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

Manually clearing color has unexpected behavior #104

Closed
momijizukamori opened this issue Jun 17, 2023 · 3 comments
Closed

Manually clearing color has unexpected behavior #104

momijizukamori opened this issue Jun 17, 2023 · 3 comments
Labels
enhancement New feature or request

Comments

@momijizukamori
Copy link

First off, thank you for this little library, it's just what I needed! This is the config I'm using:

Coloris({
  alpha: false,
  theme: 'pill',
  closeButton: true,
  clearButton: true
});

The 'Clear' button behaves like I expect it to (clearing the color, leaving the text input empty and the color swatch as the 'transparent background' view). Trying to 'manually' clear the field (by deleting the color code in the text input of the picker) does not behave as expected - when I close the picker, the text input goes to #000000. I can then backspace the in-page text input and it clears 'properly', but that's a bit round-about and I think is going to frustrate some users (this is an application where 'no color' is a valid and not-uncommon choice). I will probably see about binding a handler to the change function to deal with it, but thought I should probably report it :)

@momijizukamori
Copy link
Author

momijizukamori commented Jun 17, 2023

Additional note after I poked at the code base some - changing the event handler here https://github.com/mdbassit/Coloris/blob/main/src/coloris.js#L999 to

  addListener(colorValue, 'change', event => {
      if (colorValue.value.length == 0) {
        pickColor('');
      } else if (currentEl || settings.inline) {
        setColorFromStr(colorValue.value);
        pickColor();
      }
    });

produces the behavior I was expecting - sliders and the gradient map selector remain at whatever they were at for the last 'real' color, and changing any of them will result in the colorValue field being filled, but if you close (either via button or by clicking elsewhere on the page), the behavior is the same as the clear button.

(apologies for the edits, fighting with Markdown)

@mdbassit
Copy link
Owner

Thank you for your kind words!
Indeed, it could be more intuitive to do it like you suggested. I'll make the change soon.

@mdbassit mdbassit added the enhancement New feature or request label Jun 19, 2023
@melloware
Copy link
Contributor

0.21.0 is now in NPM: https://www.npmjs.com/package/@melloware/coloris

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

3 participants