Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Slider Label and Value feature, rgba and kelvin color fixes #6

Open
wants to merge 8 commits into
base: typescript
Choose a base branch
from

Conversation

lenadax
Copy link

@lenadax lenadax commented Apr 19, 2022

Currently used Version: 5.5.2

Description

This PR describes a feature that implements a label and an editable input field for the iro.js Slider component.
See the corresponding PR for iro.js: jaames/iro.js#229

Changes

  • add logic for user input in new input field option - currently this is limited to typing, and pasting from clipboard.
  • new property sliderLength:
    Since iro.js has a sliderSize option for thickness, but no option to manually set slider length, I added an option to it.
    This also makes the layout prettier and more contained when using the input field option added in the iro.js repo.
  • new property showInput:
    This property renders an input field next to a slider. ActiveColor Value can be set with this input.
  • new property showLabel:
    This property renders a label next to a slider.
  • new property disabled:
    Disables the input field.
  • getSliderDimensions now returns the correct width when using with my input field or when manually setting slider width.
  • color.ts: IroColor now defaults rgba.a value to this.alpha instead of 1. This solves the Issue (RGB and Alpha sliders not keeping alpha value on interaction  jaames/iro.js#227) I posted for iro.js.
  • color.ts: kelvin conversion now returns a more accurate value when calculating from and to rgb.

@lenadax lenadax changed the title DRAFT: Slider Label and Value feature, plus rgba hotfix Slider Label and Value feature, rgba and kelvin color fixes May 4, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant