"use client";
import { jsxs, jsx } from 'react/jsx-runtime';
import { cx } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
import { useColorPicker } from './color-picker-root.js';
import styles from './color-picker.module.css.js';
import { Root, Track, Range, Thumb } from '../../node_modules/.pnpm/@radix-ui_react-slider@1.3.5_@types_react-dom@19.1.7_@types_react@19.1.9__@types_react@19.1.9_abtd6yt54lkmqfjli3uzhfrsgi/node_modules/@radix-ui/react-slider/dist/index.js';

const ColorPickerHue = ({ className, ...props }) => {
    const { hue, setColor } = useColorPicker();
    return (jsxs(Root, { className: cx(styles.sliderRoot, className), max: 360, onValueChange: ([hue]) => setColor({ h: hue }), step: 1, value: [hue], ...props, children: [jsx(Track, { className: cx(styles.sliderTrack, styles.hueTrack), children: jsx(Range, { className: styles.sliderRange }) }), jsx(Thumb, { className: styles.sliderThumb })] }));
};

export { ColorPickerHue };
//# sourceMappingURL=color-picker-hue.js.map
