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

Chaining changes the color in place causing side effects #276

Open
tgdn opened this issue Jun 18, 2024 · 1 comment
Open

Chaining changes the color in place causing side effects #276

tgdn opened this issue Jun 18, 2024 · 1 comment

Comments

@tgdn
Copy link

tgdn commented Jun 18, 2024

Version of tinycolor2: 1.6.0.

Chaining changes a color in place. Unsure whether this is me, but it seems odd to update the color in place: it causes side effects and forces the developer to redeclare the same "base" variable multiple times.

Example of the issue

const baseGray = tinycolor("#aaa");
const grayLight1 = baseGray.lighten(10).toRgbString();
const grayLight2 = baseGray.lighten(10).toRgbString();

console.log({ grayLight1, grayLight2 });
// { grayLight1: 'rgb(195, 195, 195)', grayLight2: 'rgb(221, 221, 221)' }
// Colors are not the same even though they both lighten the same base color

How is it possible to chain without updating the "base" color?

The only solution seems to be:

Alternative solution

const grayLight1 = tinycolor("#aaa").lighten(10).toRgbString();
const grayLight2 = tinycolor("#aaa").lighten(10).toRgbString();

console.log({ grayLight1, grayLight2 });
// { grayLight1: 'rgb(195, 195, 195)', grayLight2: 'rgb(195, 195, 195)' }

But that would defy the purpose of instantiating one base variable that can be used as a base color.

@zw-store
Copy link

我也遇到了,我发现了克隆,于是用的克隆再修改

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

2 participants