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

HslaColor parsed to zero in hue value #116

Open
bjarnef opened this issue Sep 29, 2023 · 0 comments
Open

HslaColor parsed to zero in hue value #116

bjarnef opened this issue Sep 29, 2023 · 0 comments

Comments

@bjarnef
Copy link

bjarnef commented Sep 29, 2023

We have something like this in a color picker wheere hue value is changed from a hue slider:

const newColor: HslaColor = {
      h: element.value,
      s: this.saturation,
      l: this.lightness,
      a: this.alpha / 100,
};

this.setColor(newColor);

Inside setColor() function:

  setColor(colorString: string | HslaColor) {

    const colord = new Colord(colorString);

    const { h, s, l, a } = colord.toHsl();

    this.hue = h;
    this.saturation = s;
    this.lightness = l;
    this.alpha = this.opacity ? a * 100 : 100;

    const hslaColor = colorString as HslaColor;

    // Workaround as hue isn't correct after changing hue slider, but Colord parse hue value as zero when color is black.
    if (hslaColor && hslaColor.h) {
      this.hue = hslaColor.h;
    }
    
    this._colord = colord;
    ...
}

Hue value from HslaColor object is e.g. 191, but after parsing in to Colord instance and use toHsl() it returns a hue of 0.
I added a workaround if the parameter is an HslaColor object and then use in this h property instead, which has the value 191.

chrome_9dOIC9SrbN

@bjarnef bjarnef changed the title HslaColor HslaColor parsed to zero in hue value Sep 29, 2023
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

No branches or pull requests

1 participant