Skip to content

Commit eaf0403

Browse files
committed
Fix RGBA calc error when change alpha
1 parent c7e8716 commit eaf0403

File tree

1 file changed

+10
-2
lines changed

1 file changed

+10
-2
lines changed

src/hooks/useColorManipulation.ts

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,10 +32,18 @@ export function useColorManipulation<T extends AnyColor>(
3232
// Trigger `onChange` callback only if an updated color is different from cached one;
3333
// save the new color to the ref to prevent unnecessary updates
3434
useEffect(() => {
35-
let newColor;
35+
const { a, ...hsv } = hsva;
36+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
37+
const { a: _, ...cacheHsv } = cache.current.hsva;
38+
39+
// When alpha channel is changed, use cached RGB values to prevent rounding errors
40+
const newColor = equalColorObjects(hsv, cacheHsv)
41+
? Object.assign({}, cache.current.color, { a })
42+
: colorModel.fromHsva(hsva);
43+
3644
if (
3745
!equalColorObjects(hsva, cache.current.hsva) &&
38-
!colorModel.equal((newColor = colorModel.fromHsva(hsva)), cache.current.color)
46+
!colorModel.equal(newColor, cache.current.color)
3947
) {
4048
cache.current = { hsva, color: newColor };
4149
onChangeCallback(newColor);

0 commit comments

Comments
 (0)