Merge pull request #6033 from pat270/LPD-53383

fix(@clayui/color-picker): LPD-53383 Hue slider thumb should update c…

Author: matuzalemsteles

packages/clay-color-picker/src/Editor.tsx

@@ -148,7 +148,7 @@ export function Editor({
 	onHueChange,
 }: Props) {
 	const {b, g, r} = color.toRgb();
-	const {s, v} = color.toHsv();
+	const {h, s, v} = color.toHsv();
 
 	const rgbArr: Array<[number, string]> = [
 		[r, 'r'],
@@ -170,7 +170,7 @@ export function Editor({
 						tinycolor({h: hue, s, v}).setAlpha(color.getAlpha())
 					);
 				}}
-				value={hue}
+				value={Math.round(h)}
 			/>
 			<div className="clay-color-map-group">
 				<GradientSelector

packages/clay-color-picker/src/__tests__/index.tsx

@@ -416,9 +416,12 @@ describe('Interactions', () => {
 			) as Array<HTMLElement>;
 
 			fireEvent.change(hueSlider as HTMLElement, {target: {value: 1}});
-			fireEvent.change(hueSlider as HTMLElement, {target: {value: 0}});
 
-			expect(handleColorsChange).toBeCalledTimes(2);
+			fireEvent.change(hueSlider as HTMLElement, {target: {value: 2}});
+
+			fireEvent.change(hueSlider as HTMLElement, {target: {value: 1}});
+
+			expect(handleColorsChange).toBeCalledTimes(3);
 		});
 	});