@ark-ui/react 3.4.0-0 → 3.4.0

package/dist/components/color-picker/color-picker-view.cjs

@@ -6,23 +6,26 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
 const anatomy = require('@ark-ui/anatomy');
 const react = require('react');
+const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useColorPickerContext = require('./use-color-picker-context.cjs');
+const useColorPickerFormatContext = require('./use-color-picker-format-context.cjs');
 
 const ColorPickerView = react.forwardRef((props, ref) => {
   const colorPicker = useColorPickerContext.useColorPickerContext();
-  if (colorPicker.format !== props.format) {
+  const [formatProps, restProps] = createSplitProps.createSplitProps()(props, ["format"]);
+  if (colorPicker.format !== formatProps.format) {
     return null;
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(useColorPickerFormatContext.ColorPickerFormatPropsProvider, { value: formatProps, children: /* @__PURE__ */ jsxRuntime.jsx(
     factory.ark.div,
     {
       ref,
       "data-format": props.format,
       ...anatomy.colorPickerAnatomy.build().view.attrs,
-      ...props
+      ...restProps
     }
-  );
+  ) });
 });
 ColorPickerView.displayName = "ColorPickerView";
 

package/dist/components/color-picker/color-picker-view.d.cts

@@ -1,10 +1,13 @@
 import { ColorFormat } from '@zag-js/color-picker';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ColorPickerViewBaseProps {
+interface FormatOptions {
     format: ColorFormat;
 }
-export interface ColorPickerViewProps extends HTMLArkProps<'div'>, ColorPickerViewBaseProps {
+export interface ColorPickerViewBaseProps extends FormatOptions, PolymorphicProps {
+}
+export interface ColorPickerViewProps extends HTMLProps<'div'>, ColorPickerViewBaseProps {
 }
 export declare const ColorPickerView: ForwardRefExoticComponent<ColorPickerViewProps & RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/color-picker/color-picker-view.d.ts

@@ -1,10 +1,13 @@
 import { ColorFormat } from '@zag-js/color-picker';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ColorPickerViewBaseProps {
+interface FormatOptions {
     format: ColorFormat;
 }
-export interface ColorPickerViewProps extends HTMLArkProps<'div'>, ColorPickerViewBaseProps {
+export interface ColorPickerViewBaseProps extends FormatOptions, PolymorphicProps {
+}
+export interface ColorPickerViewProps extends HTMLProps<'div'>, ColorPickerViewBaseProps {
 }
 export declare const ColorPickerView: ForwardRefExoticComponent<ColorPickerViewProps & RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/color-picker/color-picker-view.js

@@ -2,23 +2,26 @@
 import { jsx } from 'react/jsx-runtime';
 import { colorPickerAnatomy } from '@ark-ui/anatomy';
 import { forwardRef } from 'react';
+import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { useColorPickerContext } from './use-color-picker-context.js';
+import { ColorPickerFormatPropsProvider } from './use-color-picker-format-context.js';
 
 const ColorPickerView = forwardRef((props, ref) => {
   const colorPicker = useColorPickerContext();
-  if (colorPicker.format !== props.format) {
+  const [formatProps, restProps] = createSplitProps()(props, ["format"]);
+  if (colorPicker.format !== formatProps.format) {
     return null;
   }
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(ColorPickerFormatPropsProvider, { value: formatProps, children: /* @__PURE__ */ jsx(
     ark.div,
     {
       ref,
       "data-format": props.format,
       ...colorPickerAnatomy.build().view.attrs,
-      ...props
+      ...restProps
     }
-  );
+  ) });
 });
 ColorPickerView.displayName = "ColorPickerView";
 

package/dist/components/color-picker/color-picker.cjs

@@ -7,26 +7,30 @@ const colorPickerAreaBackground = require('./color-picker-area-background.cjs');
 const colorPickerAreaThumb = require('./color-picker-area-thumb.cjs');
 const colorPickerChannelInput = require('./color-picker-channel-input.cjs');
 const colorPickerChannelSlider = require('./color-picker-channel-slider.cjs');
+const colorPickerChannelSliderLabel = require('./color-picker-channel-slider-label.cjs');
 const colorPickerChannelSliderThumb = require('./color-picker-channel-slider-thumb.cjs');
 const colorPickerChannelSliderTrack = require('./color-picker-channel-slider-track.cjs');
+const colorPickerChannelSliderValueText = require('./color-picker-channel-slider-value-text.cjs');
 const colorPickerContent = require('./color-picker-content.cjs');
 const colorPickerContext = require('./color-picker-context.cjs');
 const colorPickerControl = require('./color-picker-control.cjs');
 const colorPickerEyeDropperTrigger = require('./color-picker-eye-dropper-trigger.cjs');
 const colorPickerFormatSelect = require('./color-picker-format-select.cjs');
 const colorPickerFormatTrigger = require('./color-picker-format-trigger.cjs');
+const colorPickerHiddenInput = require('./color-picker-hidden-input.cjs');
 const colorPickerLabel = require('./color-picker-label.cjs');
 const colorPickerPositioner = require('./color-picker-positioner.cjs');
 const colorPickerRoot = require('./color-picker-root.cjs');
+const colorPickerRootProvider = require('./color-picker-root-provider.cjs');
 const colorPickerSwatch = require('./color-picker-swatch.cjs');
 const colorPickerSwatchGroup = require('./color-picker-swatch-group.cjs');
 const colorPickerSwatchIndicator = require('./color-picker-swatch-indicator.cjs');
 const colorPickerSwatchTrigger = require('./color-picker-swatch-trigger.cjs');
 const colorPickerTransparencyGrid = require('./color-picker-transparency-grid.cjs');
 const colorPickerTrigger = require('./color-picker-trigger.cjs');
+const colorPickerValueSwatch = require('./color-picker-value-swatch.cjs');
 const colorPickerValueText = require('./color-picker-value-text.cjs');
 const colorPickerView = require('./color-picker-view.cjs');
-const colorPickerHiddenInput = require('./color-picker-hidden-input.cjs');
 
 
 
@@ -35,23 +39,27 @@ exports.AreaBackground = colorPickerAreaBackground.ColorPickerAreaBackground;
 exports.AreaThumb = colorPickerAreaThumb.ColorPickerAreaThumb;
 exports.ChannelInput = colorPickerChannelInput.ColorPickerChannelInput;
 exports.ChannelSlider = colorPickerChannelSlider.ColorPickerChannelSlider;
+exports.ChannelSliderLabel = colorPickerChannelSliderLabel.ColorPickerChannelSliderLabel;
 exports.ChannelSliderThumb = colorPickerChannelSliderThumb.ColorPickerChannelSliderThumb;
 exports.ChannelSliderTrack = colorPickerChannelSliderTrack.ColorPickerChannelSliderTrack;
+exports.ChannelSliderValueText = colorPickerChannelSliderValueText.ColorPickerChannelSliderValueText;
 exports.Content = colorPickerContent.ColorPickerContent;
 exports.Context = colorPickerContext.ColorPickerContext;
 exports.Control = colorPickerControl.ColorPickerControl;
 exports.EyeDropperTrigger = colorPickerEyeDropperTrigger.ColorPickerEyeDropperTrigger;
 exports.FormatSelect = colorPickerFormatSelect.ColorPickerFormatSelect;
 exports.FormatTrigger = colorPickerFormatTrigger.ColorPickerFormatTrigger;
+exports.HiddenInput = colorPickerHiddenInput.ColorPickerHiddenInput;
 exports.Label = colorPickerLabel.ColorPickerLabel;
 exports.Positioner = colorPickerPositioner.ColorPickerPositioner;
 exports.Root = colorPickerRoot.ColorPickerRoot;
+exports.RootProvider = colorPickerRootProvider.ColorPickerRootProvider;
 exports.Swatch = colorPickerSwatch.ColorPickerSwatch;
 exports.SwatchGroup = colorPickerSwatchGroup.ColorPickerSwatchGroup;
 exports.SwatchIndicator = colorPickerSwatchIndicator.ColorPickerSwatchIndicator;
 exports.SwatchTrigger = colorPickerSwatchTrigger.ColorPickerSwatchTrigger;
 exports.TransparencyGrid = colorPickerTransparencyGrid.ColorPickerTransparencyGrid;
 exports.Trigger = colorPickerTrigger.ColorPickerTrigger;
+exports.ValueSwatch = colorPickerValueSwatch.ColorPickerValueSwatch;
 exports.ValueText = colorPickerValueText.ColorPickerValueText;
 exports.View = colorPickerView.ColorPickerView;
-exports.HiddenInput = colorPickerHiddenInput.ColorPickerHiddenInput;

package/dist/components/color-picker/color-picker.d.cts

@@ -1,26 +1,30 @@
 export type { ColorFormat, FormatChangeDetails, OpenChangeDetails, ValueChangeDetails, } from '@zag-js/color-picker';
-export { ColorPickerArea as Area, type ColorPickerAreaProps as AreaProps, type ColorPickerAreaBaseProps as AreaBaseProps, } from './color-picker-area';
-export { ColorPickerAreaBackground as AreaBackground, type ColorPickerAreaBackgroundProps as AreaBackgroundProps, type ColorPickerAreaBackgroundBaseProps as AreaBackgroundBaseProps, } from './color-picker-area-background';
-export { ColorPickerAreaThumb as AreaThumb, type ColorPickerAreaThumbProps as AreaThumbProps, type ColorPickerAreaThumbBaseProps as AreaThumbBaseProps, } from './color-picker-area-thumb';
-export { ColorPickerChannelInput as ChannelInput, type ColorPickerChannelInputProps as ChannelInputProps, type ColorPickerChannelInputBaseProps as ChannelInputBaseProps, } from './color-picker-channel-input';
-export { ColorPickerChannelSlider as ChannelSlider, type ColorPickerChannelSliderProps as ChannelSliderProps, type ColorPickerChannelSliderBaseProps as ChannelSliderBaseProps, } from './color-picker-channel-slider';
-export { ColorPickerChannelSliderThumb as ChannelSliderThumb, type ColorPickerChannelSliderThumbProps as ChannelSliderThumbProps, type ColorPickerChannelSliderThumbBaseProps as ChannelSliderThumbBaseProps, } from './color-picker-channel-slider-thumb';
-export { ColorPickerChannelSliderTrack as ChannelSliderTrack, type ColorPickerChannelSliderTrackProps as ChannelSliderTrackProps, type ColorPickerChannelSliderTrackBaseProps as ChannelSliderTrackBaseProps, } from './color-picker-channel-slider-track';
-export { ColorPickerContent as Content, type ColorPickerContentProps as ContentProps, type ColorPickerContentBaseProps as ContentBaseProps, } from './color-picker-content';
+export { ColorPickerArea as Area, type ColorPickerAreaBaseProps as AreaBaseProps, type ColorPickerAreaProps as AreaProps, } from './color-picker-area';
+export { ColorPickerAreaBackground as AreaBackground, type ColorPickerAreaBackgroundBaseProps as AreaBackgroundBaseProps, type ColorPickerAreaBackgroundProps as AreaBackgroundProps, } from './color-picker-area-background';
+export { ColorPickerAreaThumb as AreaThumb, type ColorPickerAreaThumbBaseProps as AreaThumbBaseProps, type ColorPickerAreaThumbProps as AreaThumbProps, } from './color-picker-area-thumb';
+export { ColorPickerChannelInput as ChannelInput, type ColorPickerChannelInputBaseProps as ChannelInputBaseProps, type ColorPickerChannelInputProps as ChannelInputProps, } from './color-picker-channel-input';
+export { ColorPickerChannelSlider as ChannelSlider, type ColorPickerChannelSliderBaseProps as ChannelSliderBaseProps, type ColorPickerChannelSliderProps as ChannelSliderProps, } from './color-picker-channel-slider';
+export { ColorPickerChannelSliderLabel as ChannelSliderLabel, type ColorPickerChannelSliderLabelBaseProps as ChannelSliderLabelBaseProps, type ColorPickerChannelSliderLabelProps as ChannelSliderLabelProps, } from './color-picker-channel-slider-label';
+export { ColorPickerChannelSliderThumb as ChannelSliderThumb, type ColorPickerChannelSliderThumbBaseProps as ChannelSliderThumbBaseProps, type ColorPickerChannelSliderThumbProps as ChannelSliderThumbProps, } from './color-picker-channel-slider-thumb';
+export { ColorPickerChannelSliderTrack as ChannelSliderTrack, type ColorPickerChannelSliderTrackBaseProps as ChannelSliderTrackBaseProps, type ColorPickerChannelSliderTrackProps as ChannelSliderTrackProps, } from './color-picker-channel-slider-track';
+export { ColorPickerChannelSliderValueText as ChannelSliderValueText, type ColorPickerChannelSliderValueTextBaseProps as ChannelSliderValueTextBaseProps, type ColorPickerChannelSliderValueTextProps as ChannelSliderValueTextProps, } from './color-picker-channel-slider-value-text';
+export { ColorPickerContent as Content, type ColorPickerContentBaseProps as ContentBaseProps, type ColorPickerContentProps as ContentProps, } from './color-picker-content';
 export { ColorPickerContext as Context, type ColorPickerContextProps as ContextProps, } from './color-picker-context';
-export { ColorPickerControl as Control, type ColorPickerControlProps as ControlProps, type ColorPickerControlBaseProps as ControlBaseProps, } from './color-picker-control';
-export { ColorPickerEyeDropperTrigger as EyeDropperTrigger, type ColorPickerEyeDropperTriggerProps as EyeDropperTriggerProps, type ColorPickerEyeDropperTriggerBaseProps as EyeDropperTriggerBaseProps, } from './color-picker-eye-dropper-trigger';
-export { ColorPickerFormatSelect as FormatSelect, type ColorPickerFormatSelectProps as FormatSelectProps, type ColorPickerFormatSelectBaseProps as FormatSelectBaseProps, } from './color-picker-format-select';
-export { ColorPickerFormatTrigger as FormatTrigger, type ColorPickerFormatTriggerProps as FormatTriggerProps, type ColorPickerFormatTriggerBaseProps as FormatTriggerBaseProps, } from './color-picker-format-trigger';
-export { ColorPickerLabel as Label, type ColorPickerLabelProps as LabelProps, type ColorPickerLabelBaseProps as LabelBaseProps, } from './color-picker-label';
-export { ColorPickerPositioner as Positioner, type ColorPickerPositionerProps as PositionerProps, type ColorPickerPositionerBaseProps as PositionerBaseProps, } from './color-picker-positioner';
-export { ColorPickerRoot as Root, type ColorPickerRootProps as RootProps, type ColorPickerRootBaseProps as RootBaseProps, } from './color-picker-root';
-export { ColorPickerSwatch as Swatch, type ColorPickerSwatchProps as SwatchProps, type ColorPickerSwatchBaseProps as SwatchBaseProps, } from './color-picker-swatch';
-export { ColorPickerSwatchGroup as SwatchGroup, type ColorPickerSwatchGroupProps as SwatchGroupProps, type ColorPickerSwatchGroupBaseProps as SwatchGroupBaseProps, } from './color-picker-swatch-group';
-export { ColorPickerSwatchIndicator as SwatchIndicator, type ColorPickerSwatchIndicatorProps as SwatchIndicatorProps, type ColorPickerSwatchIndicatorBaseProps as SwatchIndicatorBaseProps, } from './color-picker-swatch-indicator';
-export { ColorPickerSwatchTrigger as SwatchTrigger, type ColorPickerSwatchTriggerProps as SwatchTriggerProps, type ColorPickerSwatchTriggerBaseProps as SwatchTriggerBaseProps, } from './color-picker-swatch-trigger';
-export { ColorPickerTransparencyGrid as TransparencyGrid, type ColorPickerTransparencyGridProps as TransparencyGridProps, type ColorPickerTransparencyGridBaseProps as TransparencyGridBaseProps, } from './color-picker-transparency-grid';
-export { ColorPickerTrigger as Trigger, type ColorPickerTriggerProps as TriggerProps, type ColorPickerTriggerBaseProps as TriggerBaseProps, } from './color-picker-trigger';
-export { ColorPickerValueText as ValueText, type ColorPickerValueTextProps as ValueTextProps, type ColorPickerValueTextBaseProps as ValueTextBaseProps, } from './color-picker-value-text';
-export { ColorPickerView as View, type ColorPickerViewProps as ViewProps, type ColorPickerViewBaseProps as ViewBaseProps, } from './color-picker-view';
-export { ColorPickerHiddenInput as HiddenInput, type ColorPickerHiddenInputProps as HiddenInputProps, type ColorPickerHiddenInputBaseProps as HiddenInputBaseProps, } from './color-picker-hidden-input';
+export { ColorPickerControl as Control, type ColorPickerControlBaseProps as ControlBaseProps, type ColorPickerControlProps as ControlProps, } from './color-picker-control';
+export { ColorPickerEyeDropperTrigger as EyeDropperTrigger, type ColorPickerEyeDropperTriggerBaseProps as EyeDropperTriggerBaseProps, type ColorPickerEyeDropperTriggerProps as EyeDropperTriggerProps, } from './color-picker-eye-dropper-trigger';
+export { ColorPickerFormatSelect as FormatSelect, type ColorPickerFormatSelectBaseProps as FormatSelectBaseProps, type ColorPickerFormatSelectProps as FormatSelectProps, } from './color-picker-format-select';
+export { ColorPickerFormatTrigger as FormatTrigger, type ColorPickerFormatTriggerBaseProps as FormatTriggerBaseProps, type ColorPickerFormatTriggerProps as FormatTriggerProps, } from './color-picker-format-trigger';
+export { ColorPickerHiddenInput as HiddenInput, type ColorPickerHiddenInputBaseProps as HiddenInputBaseProps, type ColorPickerHiddenInputProps as HiddenInputProps, } from './color-picker-hidden-input';
+export { ColorPickerLabel as Label, type ColorPickerLabelBaseProps as LabelBaseProps, type ColorPickerLabelProps as LabelProps, } from './color-picker-label';
+export { ColorPickerPositioner as Positioner, type ColorPickerPositionerBaseProps as PositionerBaseProps, type ColorPickerPositionerProps as PositionerProps, } from './color-picker-positioner';
+export { ColorPickerRoot as Root, type ColorPickerRootBaseProps as RootBaseProps, type ColorPickerRootProps as RootProps, } from './color-picker-root';
+export { ColorPickerRootProvider as RootProvider, type ColorPickerRootProviderBaseProps as RootProviderBaseProps, type ColorPickerRootProviderProps as RootProviderProps, } from './color-picker-root-provider';
+export { ColorPickerSwatch as Swatch, type ColorPickerSwatchBaseProps as SwatchBaseProps, type ColorPickerSwatchProps as SwatchProps, } from './color-picker-swatch';
+export { ColorPickerSwatchGroup as SwatchGroup, type ColorPickerSwatchGroupBaseProps as SwatchGroupBaseProps, type ColorPickerSwatchGroupProps as SwatchGroupProps, } from './color-picker-swatch-group';
+export { ColorPickerSwatchIndicator as SwatchIndicator, type ColorPickerSwatchIndicatorBaseProps as SwatchIndicatorBaseProps, type ColorPickerSwatchIndicatorProps as SwatchIndicatorProps, } from './color-picker-swatch-indicator';
+export { ColorPickerSwatchTrigger as SwatchTrigger, type ColorPickerSwatchTriggerBaseProps as SwatchTriggerBaseProps, type ColorPickerSwatchTriggerProps as SwatchTriggerProps, } from './color-picker-swatch-trigger';
+export { ColorPickerTransparencyGrid as TransparencyGrid, type ColorPickerTransparencyGridBaseProps as TransparencyGridBaseProps, type ColorPickerTransparencyGridProps as TransparencyGridProps, } from './color-picker-transparency-grid';
+export { ColorPickerTrigger as Trigger, type ColorPickerTriggerBaseProps as TriggerBaseProps, type ColorPickerTriggerProps as TriggerProps, } from './color-picker-trigger';
+export { ColorPickerValueSwatch as ValueSwatch, type ColorPickerValueSwatchBaseProps as ValueSwatchBaseProps, type ColorPickerValueSwatchProps as ValueSwatchProps, } from './color-picker-value-swatch';
+export { ColorPickerValueText as ValueText, type ColorPickerValueTextBaseProps as ValueTextBaseProps, type ColorPickerValueTextProps as ValueTextProps, } from './color-picker-value-text';
+export { ColorPickerView as View, type ColorPickerViewBaseProps as ViewBaseProps, type ColorPickerViewProps as ViewProps, } from './color-picker-view';

package/dist/components/color-picker/color-picker.d.ts

@@ -1,26 +1,30 @@
 export type { ColorFormat, FormatChangeDetails, OpenChangeDetails, ValueChangeDetails, } from '@zag-js/color-picker';
-export { ColorPickerArea as Area, type ColorPickerAreaProps as AreaProps, type ColorPickerAreaBaseProps as AreaBaseProps, } from './color-picker-area';
-export { ColorPickerAreaBackground as AreaBackground, type ColorPickerAreaBackgroundProps as AreaBackgroundProps, type ColorPickerAreaBackgroundBaseProps as AreaBackgroundBaseProps, } from './color-picker-area-background';
-export { ColorPickerAreaThumb as AreaThumb, type ColorPickerAreaThumbProps as AreaThumbProps, type ColorPickerAreaThumbBaseProps as AreaThumbBaseProps, } from './color-picker-area-thumb';
-export { ColorPickerChannelInput as ChannelInput, type ColorPickerChannelInputProps as ChannelInputProps, type ColorPickerChannelInputBaseProps as ChannelInputBaseProps, } from './color-picker-channel-input';
-export { ColorPickerChannelSlider as ChannelSlider, type ColorPickerChannelSliderProps as ChannelSliderProps, type ColorPickerChannelSliderBaseProps as ChannelSliderBaseProps, } from './color-picker-channel-slider';
-export { ColorPickerChannelSliderThumb as ChannelSliderThumb, type ColorPickerChannelSliderThumbProps as ChannelSliderThumbProps, type ColorPickerChannelSliderThumbBaseProps as ChannelSliderThumbBaseProps, } from './color-picker-channel-slider-thumb';
-export { ColorPickerChannelSliderTrack as ChannelSliderTrack, type ColorPickerChannelSliderTrackProps as ChannelSliderTrackProps, type ColorPickerChannelSliderTrackBaseProps as ChannelSliderTrackBaseProps, } from './color-picker-channel-slider-track';
-export { ColorPickerContent as Content, type ColorPickerContentProps as ContentProps, type ColorPickerContentBaseProps as ContentBaseProps, } from './color-picker-content';
+export { ColorPickerArea as Area, type ColorPickerAreaBaseProps as AreaBaseProps, type ColorPickerAreaProps as AreaProps, } from './color-picker-area';
+export { ColorPickerAreaBackground as AreaBackground, type ColorPickerAreaBackgroundBaseProps as AreaBackgroundBaseProps, type ColorPickerAreaBackgroundProps as AreaBackgroundProps, } from './color-picker-area-background';
+export { ColorPickerAreaThumb as AreaThumb, type ColorPickerAreaThumbBaseProps as AreaThumbBaseProps, type ColorPickerAreaThumbProps as AreaThumbProps, } from './color-picker-area-thumb';
+export { ColorPickerChannelInput as ChannelInput, type ColorPickerChannelInputBaseProps as ChannelInputBaseProps, type ColorPickerChannelInputProps as ChannelInputProps, } from './color-picker-channel-input';
+export { ColorPickerChannelSlider as ChannelSlider, type ColorPickerChannelSliderBaseProps as ChannelSliderBaseProps, type ColorPickerChannelSliderProps as ChannelSliderProps, } from './color-picker-channel-slider';
+export { ColorPickerChannelSliderLabel as ChannelSliderLabel, type ColorPickerChannelSliderLabelBaseProps as ChannelSliderLabelBaseProps, type ColorPickerChannelSliderLabelProps as ChannelSliderLabelProps, } from './color-picker-channel-slider-label';
+export { ColorPickerChannelSliderThumb as ChannelSliderThumb, type ColorPickerChannelSliderThumbBaseProps as ChannelSliderThumbBaseProps, type ColorPickerChannelSliderThumbProps as ChannelSliderThumbProps, } from './color-picker-channel-slider-thumb';
+export { ColorPickerChannelSliderTrack as ChannelSliderTrack, type ColorPickerChannelSliderTrackBaseProps as ChannelSliderTrackBaseProps, type ColorPickerChannelSliderTrackProps as ChannelSliderTrackProps, } from './color-picker-channel-slider-track';
+export { ColorPickerChannelSliderValueText as ChannelSliderValueText, type ColorPickerChannelSliderValueTextBaseProps as ChannelSliderValueTextBaseProps, type ColorPickerChannelSliderValueTextProps as ChannelSliderValueTextProps, } from './color-picker-channel-slider-value-text';
+export { ColorPickerContent as Content, type ColorPickerContentBaseProps as ContentBaseProps, type ColorPickerContentProps as ContentProps, } from './color-picker-content';
 export { ColorPickerContext as Context, type ColorPickerContextProps as ContextProps, } from './color-picker-context';
-export { ColorPickerControl as Control, type ColorPickerControlProps as ControlProps, type ColorPickerControlBaseProps as ControlBaseProps, } from './color-picker-control';
-export { ColorPickerEyeDropperTrigger as EyeDropperTrigger, type ColorPickerEyeDropperTriggerProps as EyeDropperTriggerProps, type ColorPickerEyeDropperTriggerBaseProps as EyeDropperTriggerBaseProps, } from './color-picker-eye-dropper-trigger';
-export { ColorPickerFormatSelect as FormatSelect, type ColorPickerFormatSelectProps as FormatSelectProps, type ColorPickerFormatSelectBaseProps as FormatSelectBaseProps, } from './color-picker-format-select';
-export { ColorPickerFormatTrigger as FormatTrigger, type ColorPickerFormatTriggerProps as FormatTriggerProps, type ColorPickerFormatTriggerBaseProps as FormatTriggerBaseProps, } from './color-picker-format-trigger';
-export { ColorPickerLabel as Label, type ColorPickerLabelProps as LabelProps, type ColorPickerLabelBaseProps as LabelBaseProps, } from './color-picker-label';
-export { ColorPickerPositioner as Positioner, type ColorPickerPositionerProps as PositionerProps, type ColorPickerPositionerBaseProps as PositionerBaseProps, } from './color-picker-positioner';
-export { ColorPickerRoot as Root, type ColorPickerRootProps as RootProps, type ColorPickerRootBaseProps as RootBaseProps, } from './color-picker-root';
-export { ColorPickerSwatch as Swatch, type ColorPickerSwatchProps as SwatchProps, type ColorPickerSwatchBaseProps as SwatchBaseProps, } from './color-picker-swatch';
-export { ColorPickerSwatchGroup as SwatchGroup, type ColorPickerSwatchGroupProps as SwatchGroupProps, type ColorPickerSwatchGroupBaseProps as SwatchGroupBaseProps, } from './color-picker-swatch-group';
-export { ColorPickerSwatchIndicator as SwatchIndicator, type ColorPickerSwatchIndicatorProps as SwatchIndicatorProps, type ColorPickerSwatchIndicatorBaseProps as SwatchIndicatorBaseProps, } from './color-picker-swatch-indicator';
-export { ColorPickerSwatchTrigger as SwatchTrigger, type ColorPickerSwatchTriggerProps as SwatchTriggerProps, type ColorPickerSwatchTriggerBaseProps as SwatchTriggerBaseProps, } from './color-picker-swatch-trigger';
-export { ColorPickerTransparencyGrid as TransparencyGrid, type ColorPickerTransparencyGridProps as TransparencyGridProps, type ColorPickerTransparencyGridBaseProps as TransparencyGridBaseProps, } from './color-picker-transparency-grid';
-export { ColorPickerTrigger as Trigger, type ColorPickerTriggerProps as TriggerProps, type ColorPickerTriggerBaseProps as TriggerBaseProps, } from './color-picker-trigger';
-export { ColorPickerValueText as ValueText, type ColorPickerValueTextProps as ValueTextProps, type ColorPickerValueTextBaseProps as ValueTextBaseProps, } from './color-picker-value-text';
-export { ColorPickerView as View, type ColorPickerViewProps as ViewProps, type ColorPickerViewBaseProps as ViewBaseProps, } from './color-picker-view';
-export { ColorPickerHiddenInput as HiddenInput, type ColorPickerHiddenInputProps as HiddenInputProps, type ColorPickerHiddenInputBaseProps as HiddenInputBaseProps, } from './color-picker-hidden-input';
+export { ColorPickerControl as Control, type ColorPickerControlBaseProps as ControlBaseProps, type ColorPickerControlProps as ControlProps, } from './color-picker-control';
+export { ColorPickerEyeDropperTrigger as EyeDropperTrigger, type ColorPickerEyeDropperTriggerBaseProps as EyeDropperTriggerBaseProps, type ColorPickerEyeDropperTriggerProps as EyeDropperTriggerProps, } from './color-picker-eye-dropper-trigger';
+export { ColorPickerFormatSelect as FormatSelect, type ColorPickerFormatSelectBaseProps as FormatSelectBaseProps, type ColorPickerFormatSelectProps as FormatSelectProps, } from './color-picker-format-select';
+export { ColorPickerFormatTrigger as FormatTrigger, type ColorPickerFormatTriggerBaseProps as FormatTriggerBaseProps, type ColorPickerFormatTriggerProps as FormatTriggerProps, } from './color-picker-format-trigger';
+export { ColorPickerHiddenInput as HiddenInput, type ColorPickerHiddenInputBaseProps as HiddenInputBaseProps, type ColorPickerHiddenInputProps as HiddenInputProps, } from './color-picker-hidden-input';
+export { ColorPickerLabel as Label, type ColorPickerLabelBaseProps as LabelBaseProps, type ColorPickerLabelProps as LabelProps, } from './color-picker-label';
+export { ColorPickerPositioner as Positioner, type ColorPickerPositionerBaseProps as PositionerBaseProps, type ColorPickerPositionerProps as PositionerProps, } from './color-picker-positioner';
+export { ColorPickerRoot as Root, type ColorPickerRootBaseProps as RootBaseProps, type ColorPickerRootProps as RootProps, } from './color-picker-root';
+export { ColorPickerRootProvider as RootProvider, type ColorPickerRootProviderBaseProps as RootProviderBaseProps, type ColorPickerRootProviderProps as RootProviderProps, } from './color-picker-root-provider';
+export { ColorPickerSwatch as Swatch, type ColorPickerSwatchBaseProps as SwatchBaseProps, type ColorPickerSwatchProps as SwatchProps, } from './color-picker-swatch';
+export { ColorPickerSwatchGroup as SwatchGroup, type ColorPickerSwatchGroupBaseProps as SwatchGroupBaseProps, type ColorPickerSwatchGroupProps as SwatchGroupProps, } from './color-picker-swatch-group';
+export { ColorPickerSwatchIndicator as SwatchIndicator, type ColorPickerSwatchIndicatorBaseProps as SwatchIndicatorBaseProps, type ColorPickerSwatchIndicatorProps as SwatchIndicatorProps, } from './color-picker-swatch-indicator';
+export { ColorPickerSwatchTrigger as SwatchTrigger, type ColorPickerSwatchTriggerBaseProps as SwatchTriggerBaseProps, type ColorPickerSwatchTriggerProps as SwatchTriggerProps, } from './color-picker-swatch-trigger';
+export { ColorPickerTransparencyGrid as TransparencyGrid, type ColorPickerTransparencyGridBaseProps as TransparencyGridBaseProps, type ColorPickerTransparencyGridProps as TransparencyGridProps, } from './color-picker-transparency-grid';
+export { ColorPickerTrigger as Trigger, type ColorPickerTriggerBaseProps as TriggerBaseProps, type ColorPickerTriggerProps as TriggerProps, } from './color-picker-trigger';
+export { ColorPickerValueSwatch as ValueSwatch, type ColorPickerValueSwatchBaseProps as ValueSwatchBaseProps, type ColorPickerValueSwatchProps as ValueSwatchProps, } from './color-picker-value-swatch';
+export { ColorPickerValueText as ValueText, type ColorPickerValueTextBaseProps as ValueTextBaseProps, type ColorPickerValueTextProps as ValueTextProps, } from './color-picker-value-text';
+export { ColorPickerView as View, type ColorPickerViewBaseProps as ViewBaseProps, type ColorPickerViewProps as ViewProps, } from './color-picker-view';

package/dist/components/color-picker/color-picker.js

@@ -3,23 +3,27 @@ export { ColorPickerAreaBackground as AreaBackground } from './color-picker-area
 export { ColorPickerAreaThumb as AreaThumb } from './color-picker-area-thumb.js';
 export { ColorPickerChannelInput as ChannelInput } from './color-picker-channel-input.js';
 export { ColorPickerChannelSlider as ChannelSlider } from './color-picker-channel-slider.js';
+export { ColorPickerChannelSliderLabel as ChannelSliderLabel } from './color-picker-channel-slider-label.js';
 export { ColorPickerChannelSliderThumb as ChannelSliderThumb } from './color-picker-channel-slider-thumb.js';
 export { ColorPickerChannelSliderTrack as ChannelSliderTrack } from './color-picker-channel-slider-track.js';
+export { ColorPickerChannelSliderValueText as ChannelSliderValueText } from './color-picker-channel-slider-value-text.js';
 export { ColorPickerContent as Content } from './color-picker-content.js';
 export { ColorPickerContext as Context } from './color-picker-context.js';
 export { ColorPickerControl as Control } from './color-picker-control.js';
 export { ColorPickerEyeDropperTrigger as EyeDropperTrigger } from './color-picker-eye-dropper-trigger.js';
 export { ColorPickerFormatSelect as FormatSelect } from './color-picker-format-select.js';
 export { ColorPickerFormatTrigger as FormatTrigger } from './color-picker-format-trigger.js';
+export { ColorPickerHiddenInput as HiddenInput } from './color-picker-hidden-input.js';
 export { ColorPickerLabel as Label } from './color-picker-label.js';
 export { ColorPickerPositioner as Positioner } from './color-picker-positioner.js';
 export { ColorPickerRoot as Root } from './color-picker-root.js';
+export { ColorPickerRootProvider as RootProvider } from './color-picker-root-provider.js';
 export { ColorPickerSwatch as Swatch } from './color-picker-swatch.js';
 export { ColorPickerSwatchGroup as SwatchGroup } from './color-picker-swatch-group.js';
 export { ColorPickerSwatchIndicator as SwatchIndicator } from './color-picker-swatch-indicator.js';
 export { ColorPickerSwatchTrigger as SwatchTrigger } from './color-picker-swatch-trigger.js';
 export { ColorPickerTransparencyGrid as TransparencyGrid } from './color-picker-transparency-grid.js';
 export { ColorPickerTrigger as Trigger } from './color-picker-trigger.js';
+export { ColorPickerValueSwatch as ValueSwatch } from './color-picker-value-swatch.js';
 export { ColorPickerValueText as ValueText } from './color-picker-value-text.js';
 export { ColorPickerView as View } from './color-picker-view.js';
-export { ColorPickerHiddenInput as HiddenInput } from './color-picker-hidden-input.js';

package/dist/components/color-picker/index.cjs

@@ -7,8 +7,10 @@ const colorPickerAreaBackground = require('./color-picker-area-background.cjs');
 const colorPickerAreaThumb = require('./color-picker-area-thumb.cjs');
 const colorPickerChannelInput = require('./color-picker-channel-input.cjs');
 const colorPickerChannelSlider = require('./color-picker-channel-slider.cjs');
+const colorPickerChannelSliderLabel = require('./color-picker-channel-slider-label.cjs');
 const colorPickerChannelSliderThumb = require('./color-picker-channel-slider-thumb.cjs');
 const colorPickerChannelSliderTrack = require('./color-picker-channel-slider-track.cjs');
+const colorPickerChannelSliderValueText = require('./color-picker-channel-slider-value-text.cjs');
 const colorPickerContent = require('./color-picker-content.cjs');
 const colorPickerContext = require('./color-picker-context.cjs');
 const colorPickerControl = require('./color-picker-control.cjs');
@@ -26,6 +28,7 @@ const colorPickerSwatchIndicator = require('./color-picker-swatch-indicator.cjs'
 const colorPickerSwatchTrigger = require('./color-picker-swatch-trigger.cjs');
 const colorPickerTransparencyGrid = require('./color-picker-transparency-grid.cjs');
 const colorPickerTrigger = require('./color-picker-trigger.cjs');
+const colorPickerValueSwatch = require('./color-picker-value-swatch.cjs');
 const colorPickerValueText = require('./color-picker-value-text.cjs');
 const colorPickerView = require('./color-picker-view.cjs');
 const useColorPicker = require('./use-color-picker.cjs');
@@ -39,8 +42,10 @@ exports.ColorPickerAreaBackground = colorPickerAreaBackground.ColorPickerAreaBac
 exports.ColorPickerAreaThumb = colorPickerAreaThumb.ColorPickerAreaThumb;
 exports.ColorPickerChannelInput = colorPickerChannelInput.ColorPickerChannelInput;
 exports.ColorPickerChannelSlider = colorPickerChannelSlider.ColorPickerChannelSlider;
+exports.ColorPickerChannelSliderLabel = colorPickerChannelSliderLabel.ColorPickerChannelSliderLabel;
 exports.ColorPickerChannelSliderThumb = colorPickerChannelSliderThumb.ColorPickerChannelSliderThumb;
 exports.ColorPickerChannelSliderTrack = colorPickerChannelSliderTrack.ColorPickerChannelSliderTrack;
+exports.ColorPickerChannelSliderValueText = colorPickerChannelSliderValueText.ColorPickerChannelSliderValueText;
 exports.ColorPickerContent = colorPickerContent.ColorPickerContent;
 exports.ColorPickerContext = colorPickerContext.ColorPickerContext;
 exports.ColorPickerControl = colorPickerControl.ColorPickerControl;
@@ -58,6 +63,7 @@ exports.ColorPickerSwatchIndicator = colorPickerSwatchIndicator.ColorPickerSwatc
 exports.ColorPickerSwatchTrigger = colorPickerSwatchTrigger.ColorPickerSwatchTrigger;
 exports.ColorPickerTransparencyGrid = colorPickerTransparencyGrid.ColorPickerTransparencyGrid;
 exports.ColorPickerTrigger = colorPickerTrigger.ColorPickerTrigger;
+exports.ColorPickerValueSwatch = colorPickerValueSwatch.ColorPickerValueSwatch;
 exports.ColorPickerValueText = colorPickerValueText.ColorPickerValueText;
 exports.ColorPickerView = colorPickerView.ColorPickerView;
 exports.useColorPicker = useColorPicker.useColorPicker;

package/dist/components/color-picker/index.d.cts

@@ -1,30 +1,33 @@
 export type { ColorFormat as ColorPickerColorFormat, FormatChangeDetails as ColorPickerFormatChangeDetails, OpenChangeDetails as ColorPickerOpenChangeDetails, ValueChangeDetails as ColorPickerValueChangeDetails, } from '@zag-js/color-picker';
-export { ColorPickerArea, type ColorPickerAreaProps, type ColorPickerAreaBaseProps, } from './color-picker-area';
-export { ColorPickerAreaBackground, type ColorPickerAreaBackgroundProps, type ColorPickerAreaBackgroundBaseProps, } from './color-picker-area-background';
-export { ColorPickerAreaThumb, type ColorPickerAreaThumbProps, type ColorPickerAreaThumbBaseProps, } from './color-picker-area-thumb';
-export { ColorPickerChannelInput, type ColorPickerChannelInputProps, type ColorPickerChannelInputBaseProps, } from './color-picker-channel-input';
-export { ColorPickerChannelSlider, type ColorPickerChannelSliderProps, type ColorPickerChannelSliderBaseProps, } from './color-picker-channel-slider';
-export { ColorPickerChannelSliderThumb, type ColorPickerChannelSliderThumbProps, type ColorPickerChannelSliderThumbBaseProps, } from './color-picker-channel-slider-thumb';
-export { ColorPickerChannelSliderTrack, type ColorPickerChannelSliderTrackProps, type ColorPickerChannelSliderTrackBaseProps, } from './color-picker-channel-slider-track';
-export { ColorPickerContent, type ColorPickerContentProps, type ColorPickerContentBaseProps, } from './color-picker-content';
+export { ColorPickerArea, type ColorPickerAreaBaseProps, type ColorPickerAreaProps, } from './color-picker-area';
+export { ColorPickerAreaBackground, type ColorPickerAreaBackgroundBaseProps, type ColorPickerAreaBackgroundProps, } from './color-picker-area-background';
+export { ColorPickerAreaThumb, type ColorPickerAreaThumbBaseProps, type ColorPickerAreaThumbProps, } from './color-picker-area-thumb';
+export { ColorPickerChannelInput, type ColorPickerChannelInputBaseProps, type ColorPickerChannelInputProps, } from './color-picker-channel-input';
+export { ColorPickerChannelSlider, type ColorPickerChannelSliderBaseProps, type ColorPickerChannelSliderProps, } from './color-picker-channel-slider';
+export { ColorPickerChannelSliderLabel, type ColorPickerChannelSliderLabelBaseProps, type ColorPickerChannelSliderLabelProps, } from './color-picker-channel-slider-label';
+export { ColorPickerChannelSliderThumb, type ColorPickerChannelSliderThumbBaseProps, type ColorPickerChannelSliderThumbProps, } from './color-picker-channel-slider-thumb';
+export { ColorPickerChannelSliderTrack, type ColorPickerChannelSliderTrackBaseProps, type ColorPickerChannelSliderTrackProps, } from './color-picker-channel-slider-track';
+export { ColorPickerChannelSliderValueText, type ColorPickerChannelSliderValueTextBaseProps, type ColorPickerChannelSliderValueTextProps, } from './color-picker-channel-slider-value-text';
+export { ColorPickerContent, type ColorPickerContentBaseProps, type ColorPickerContentProps, } from './color-picker-content';
 export { ColorPickerContext, type ColorPickerContextProps, } from './color-picker-context';
-export { ColorPickerControl, type ColorPickerControlProps, type ColorPickerControlBaseProps, } from './color-picker-control';
-export { ColorPickerEyeDropperTrigger, type ColorPickerEyeDropperTriggerProps, type ColorPickerEyeDropperTriggerBaseProps, } from './color-picker-eye-dropper-trigger';
-export { ColorPickerFormatSelect, type ColorPickerFormatSelectProps, type ColorPickerFormatSelectBaseProps, } from './color-picker-format-select';
-export { ColorPickerFormatTrigger, type ColorPickerFormatTriggerProps, type ColorPickerFormatTriggerBaseProps, } from './color-picker-format-trigger';
-export { ColorPickerHiddenInput, type ColorPickerHiddenInputProps, type ColorPickerHiddenInputBaseProps, } from './color-picker-hidden-input';
-export { ColorPickerLabel, type ColorPickerLabelProps, type ColorPickerLabelBaseProps, } from './color-picker-label';
-export { ColorPickerPositioner, type ColorPickerPositionerProps, type ColorPickerPositionerBaseProps, } from './color-picker-positioner';
-export { ColorPickerRoot, type ColorPickerRootProps, type ColorPickerRootBaseProps, } from './color-picker-root';
-export { ColorPickerRootProvider, type ColorPickerRootProviderProps, type ColorPickerRootProviderBaseProps, } from './color-picker-root-provider';
-export { ColorPickerSwatch, type ColorPickerSwatchProps, type ColorPickerSwatchBaseProps, } from './color-picker-swatch';
-export { ColorPickerSwatchGroup, type ColorPickerSwatchGroupProps, type ColorPickerSwatchGroupBaseProps, } from './color-picker-swatch-group';
-export { ColorPickerSwatchIndicator, type ColorPickerSwatchIndicatorProps, type ColorPickerSwatchIndicatorBaseProps, } from './color-picker-swatch-indicator';
-export { ColorPickerSwatchTrigger, type ColorPickerSwatchTriggerProps, type ColorPickerSwatchTriggerBaseProps, } from './color-picker-swatch-trigger';
-export { ColorPickerTransparencyGrid, type ColorPickerTransparencyGridProps, type ColorPickerTransparencyGridBaseProps, } from './color-picker-transparency-grid';
-export { ColorPickerTrigger, type ColorPickerTriggerProps, type ColorPickerTriggerBaseProps, } from './color-picker-trigger';
-export { ColorPickerValueText, type ColorPickerValueTextProps, type ColorPickerValueTextBaseProps, } from './color-picker-value-text';
-export { ColorPickerView, type ColorPickerViewProps, type ColorPickerViewBaseProps, } from './color-picker-view';
+export { ColorPickerControl, type ColorPickerControlBaseProps, type ColorPickerControlProps, } from './color-picker-control';
+export { ColorPickerEyeDropperTrigger, type ColorPickerEyeDropperTriggerBaseProps, type ColorPickerEyeDropperTriggerProps, } from './color-picker-eye-dropper-trigger';
+export { ColorPickerFormatSelect, type ColorPickerFormatSelectBaseProps, type ColorPickerFormatSelectProps, } from './color-picker-format-select';
+export { ColorPickerFormatTrigger, type ColorPickerFormatTriggerBaseProps, type ColorPickerFormatTriggerProps, } from './color-picker-format-trigger';
+export { ColorPickerHiddenInput, type ColorPickerHiddenInputBaseProps, type ColorPickerHiddenInputProps, } from './color-picker-hidden-input';
+export { ColorPickerLabel, type ColorPickerLabelBaseProps, type ColorPickerLabelProps, } from './color-picker-label';
+export { ColorPickerPositioner, type ColorPickerPositionerBaseProps, type ColorPickerPositionerProps, } from './color-picker-positioner';
+export { ColorPickerRoot, type ColorPickerRootBaseProps, type ColorPickerRootProps, } from './color-picker-root';
+export { ColorPickerRootProvider, type ColorPickerRootProviderBaseProps, type ColorPickerRootProviderProps, } from './color-picker-root-provider';
+export { ColorPickerSwatch, type ColorPickerSwatchBaseProps, type ColorPickerSwatchProps, } from './color-picker-swatch';
+export { ColorPickerSwatchGroup, type ColorPickerSwatchGroupBaseProps, type ColorPickerSwatchGroupProps, } from './color-picker-swatch-group';
+export { ColorPickerSwatchIndicator, type ColorPickerSwatchIndicatorBaseProps, type ColorPickerSwatchIndicatorProps, } from './color-picker-swatch-indicator';
+export { ColorPickerSwatchTrigger, type ColorPickerSwatchTriggerBaseProps, type ColorPickerSwatchTriggerProps, } from './color-picker-swatch-trigger';
+export { ColorPickerTransparencyGrid, type ColorPickerTransparencyGridBaseProps, type ColorPickerTransparencyGridProps, } from './color-picker-transparency-grid';
+export { ColorPickerTrigger, type ColorPickerTriggerBaseProps, type ColorPickerTriggerProps, } from './color-picker-trigger';
+export { ColorPickerValueSwatch, type ColorPickerValueSwatchBaseProps, type ColorPickerValueSwatchProps, } from './color-picker-value-swatch';
+export { ColorPickerValueText, type ColorPickerValueTextBaseProps, type ColorPickerValueTextProps, } from './color-picker-value-text';
+export { ColorPickerView, type ColorPickerViewBaseProps, type ColorPickerViewProps, } from './color-picker-view';
 export { useColorPicker, type UseColorPickerProps, type UseColorPickerReturn, } from './use-color-picker';
 export { useColorPickerContext, type UseColorPickerContext } from './use-color-picker-context';
 export * as ColorPicker from './color-picker';

package/dist/components/color-picker/index.d.ts

@@ -1,30 +1,33 @@
 export type { ColorFormat as ColorPickerColorFormat, FormatChangeDetails as ColorPickerFormatChangeDetails, OpenChangeDetails as ColorPickerOpenChangeDetails, ValueChangeDetails as ColorPickerValueChangeDetails, } from '@zag-js/color-picker';
-export { ColorPickerArea, type ColorPickerAreaProps, type ColorPickerAreaBaseProps, } from './color-picker-area';
-export { ColorPickerAreaBackground, type ColorPickerAreaBackgroundProps, type ColorPickerAreaBackgroundBaseProps, } from './color-picker-area-background';
-export { ColorPickerAreaThumb, type ColorPickerAreaThumbProps, type ColorPickerAreaThumbBaseProps, } from './color-picker-area-thumb';
-export { ColorPickerChannelInput, type ColorPickerChannelInputProps, type ColorPickerChannelInputBaseProps, } from './color-picker-channel-input';
-export { ColorPickerChannelSlider, type ColorPickerChannelSliderProps, type ColorPickerChannelSliderBaseProps, } from './color-picker-channel-slider';
-export { ColorPickerChannelSliderThumb, type ColorPickerChannelSliderThumbProps, type ColorPickerChannelSliderThumbBaseProps, } from './color-picker-channel-slider-thumb';
-export { ColorPickerChannelSliderTrack, type ColorPickerChannelSliderTrackProps, type ColorPickerChannelSliderTrackBaseProps, } from './color-picker-channel-slider-track';
-export { ColorPickerContent, type ColorPickerContentProps, type ColorPickerContentBaseProps, } from './color-picker-content';
+export { ColorPickerArea, type ColorPickerAreaBaseProps, type ColorPickerAreaProps, } from './color-picker-area';
+export { ColorPickerAreaBackground, type ColorPickerAreaBackgroundBaseProps, type ColorPickerAreaBackgroundProps, } from './color-picker-area-background';
+export { ColorPickerAreaThumb, type ColorPickerAreaThumbBaseProps, type ColorPickerAreaThumbProps, } from './color-picker-area-thumb';
+export { ColorPickerChannelInput, type ColorPickerChannelInputBaseProps, type ColorPickerChannelInputProps, } from './color-picker-channel-input';
+export { ColorPickerChannelSlider, type ColorPickerChannelSliderBaseProps, type ColorPickerChannelSliderProps, } from './color-picker-channel-slider';
+export { ColorPickerChannelSliderLabel, type ColorPickerChannelSliderLabelBaseProps, type ColorPickerChannelSliderLabelProps, } from './color-picker-channel-slider-label';
+export { ColorPickerChannelSliderThumb, type ColorPickerChannelSliderThumbBaseProps, type ColorPickerChannelSliderThumbProps, } from './color-picker-channel-slider-thumb';
+export { ColorPickerChannelSliderTrack, type ColorPickerChannelSliderTrackBaseProps, type ColorPickerChannelSliderTrackProps, } from './color-picker-channel-slider-track';
+export { ColorPickerChannelSliderValueText, type ColorPickerChannelSliderValueTextBaseProps, type ColorPickerChannelSliderValueTextProps, } from './color-picker-channel-slider-value-text';
+export { ColorPickerContent, type ColorPickerContentBaseProps, type ColorPickerContentProps, } from './color-picker-content';
 export { ColorPickerContext, type ColorPickerContextProps, } from './color-picker-context';
-export { ColorPickerControl, type ColorPickerControlProps, type ColorPickerControlBaseProps, } from './color-picker-control';
-export { ColorPickerEyeDropperTrigger, type ColorPickerEyeDropperTriggerProps, type ColorPickerEyeDropperTriggerBaseProps, } from './color-picker-eye-dropper-trigger';
-export { ColorPickerFormatSelect, type ColorPickerFormatSelectProps, type ColorPickerFormatSelectBaseProps, } from './color-picker-format-select';
-export { ColorPickerFormatTrigger, type ColorPickerFormatTriggerProps, type ColorPickerFormatTriggerBaseProps, } from './color-picker-format-trigger';
-export { ColorPickerHiddenInput, type ColorPickerHiddenInputProps, type ColorPickerHiddenInputBaseProps, } from './color-picker-hidden-input';
-export { ColorPickerLabel, type ColorPickerLabelProps, type ColorPickerLabelBaseProps, } from './color-picker-label';
-export { ColorPickerPositioner, type ColorPickerPositionerProps, type ColorPickerPositionerBaseProps, } from './color-picker-positioner';
-export { ColorPickerRoot, type ColorPickerRootProps, type ColorPickerRootBaseProps, } from './color-picker-root';
-export { ColorPickerRootProvider, type ColorPickerRootProviderProps, type ColorPickerRootProviderBaseProps, } from './color-picker-root-provider';
-export { ColorPickerSwatch, type ColorPickerSwatchProps, type ColorPickerSwatchBaseProps, } from './color-picker-swatch';
-export { ColorPickerSwatchGroup, type ColorPickerSwatchGroupProps, type ColorPickerSwatchGroupBaseProps, } from './color-picker-swatch-group';
-export { ColorPickerSwatchIndicator, type ColorPickerSwatchIndicatorProps, type ColorPickerSwatchIndicatorBaseProps, } from './color-picker-swatch-indicator';
-export { ColorPickerSwatchTrigger, type ColorPickerSwatchTriggerProps, type ColorPickerSwatchTriggerBaseProps, } from './color-picker-swatch-trigger';
-export { ColorPickerTransparencyGrid, type ColorPickerTransparencyGridProps, type ColorPickerTransparencyGridBaseProps, } from './color-picker-transparency-grid';
-export { ColorPickerTrigger, type ColorPickerTriggerProps, type ColorPickerTriggerBaseProps, } from './color-picker-trigger';
-export { ColorPickerValueText, type ColorPickerValueTextProps, type ColorPickerValueTextBaseProps, } from './color-picker-value-text';
-export { ColorPickerView, type ColorPickerViewProps, type ColorPickerViewBaseProps, } from './color-picker-view';
+export { ColorPickerControl, type ColorPickerControlBaseProps, type ColorPickerControlProps, } from './color-picker-control';
+export { ColorPickerEyeDropperTrigger, type ColorPickerEyeDropperTriggerBaseProps, type ColorPickerEyeDropperTriggerProps, } from './color-picker-eye-dropper-trigger';
+export { ColorPickerFormatSelect, type ColorPickerFormatSelectBaseProps, type ColorPickerFormatSelectProps, } from './color-picker-format-select';
+export { ColorPickerFormatTrigger, type ColorPickerFormatTriggerBaseProps, type ColorPickerFormatTriggerProps, } from './color-picker-format-trigger';
+export { ColorPickerHiddenInput, type ColorPickerHiddenInputBaseProps, type ColorPickerHiddenInputProps, } from './color-picker-hidden-input';
+export { ColorPickerLabel, type ColorPickerLabelBaseProps, type ColorPickerLabelProps, } from './color-picker-label';
+export { ColorPickerPositioner, type ColorPickerPositionerBaseProps, type ColorPickerPositionerProps, } from './color-picker-positioner';
+export { ColorPickerRoot, type ColorPickerRootBaseProps, type ColorPickerRootProps, } from './color-picker-root';
+export { ColorPickerRootProvider, type ColorPickerRootProviderBaseProps, type ColorPickerRootProviderProps, } from './color-picker-root-provider';
+export { ColorPickerSwatch, type ColorPickerSwatchBaseProps, type ColorPickerSwatchProps, } from './color-picker-swatch';
+export { ColorPickerSwatchGroup, type ColorPickerSwatchGroupBaseProps, type ColorPickerSwatchGroupProps, } from './color-picker-swatch-group';
+export { ColorPickerSwatchIndicator, type ColorPickerSwatchIndicatorBaseProps, type ColorPickerSwatchIndicatorProps, } from './color-picker-swatch-indicator';
+export { ColorPickerSwatchTrigger, type ColorPickerSwatchTriggerBaseProps, type ColorPickerSwatchTriggerProps, } from './color-picker-swatch-trigger';
+export { ColorPickerTransparencyGrid, type ColorPickerTransparencyGridBaseProps, type ColorPickerTransparencyGridProps, } from './color-picker-transparency-grid';
+export { ColorPickerTrigger, type ColorPickerTriggerBaseProps, type ColorPickerTriggerProps, } from './color-picker-trigger';
+export { ColorPickerValueSwatch, type ColorPickerValueSwatchBaseProps, type ColorPickerValueSwatchProps, } from './color-picker-value-swatch';
+export { ColorPickerValueText, type ColorPickerValueTextBaseProps, type ColorPickerValueTextProps, } from './color-picker-value-text';
+export { ColorPickerView, type ColorPickerViewBaseProps, type ColorPickerViewProps, } from './color-picker-view';
 export { useColorPicker, type UseColorPickerProps, type UseColorPickerReturn, } from './use-color-picker';
 export { useColorPickerContext, type UseColorPickerContext } from './use-color-picker-context';
 export * as ColorPicker from './color-picker';

package/dist/components/color-picker/index.js

@@ -3,8 +3,10 @@ export { ColorPickerAreaBackground } from './color-picker-area-background.js';
 export { ColorPickerAreaThumb } from './color-picker-area-thumb.js';
 export { ColorPickerChannelInput } from './color-picker-channel-input.js';
 export { ColorPickerChannelSlider } from './color-picker-channel-slider.js';
+export { ColorPickerChannelSliderLabel } from './color-picker-channel-slider-label.js';
 export { ColorPickerChannelSliderThumb } from './color-picker-channel-slider-thumb.js';
 export { ColorPickerChannelSliderTrack } from './color-picker-channel-slider-track.js';
+export { ColorPickerChannelSliderValueText } from './color-picker-channel-slider-value-text.js';
 export { ColorPickerContent } from './color-picker-content.js';
 export { ColorPickerContext } from './color-picker-context.js';
 export { ColorPickerControl } from './color-picker-control.js';
@@ -22,6 +24,7 @@ export { ColorPickerSwatchIndicator } from './color-picker-swatch-indicator.js';
 export { ColorPickerSwatchTrigger } from './color-picker-swatch-trigger.js';
 export { ColorPickerTransparencyGrid } from './color-picker-transparency-grid.js';
 export { ColorPickerTrigger } from './color-picker-trigger.js';
+export { ColorPickerValueSwatch } from './color-picker-value-swatch.js';
 export { ColorPickerValueText } from './color-picker-value-text.js';
 export { ColorPickerView } from './color-picker-view.js';
 export { useColorPicker } from './use-color-picker.js';

package/dist/components/color-picker/use-color-picker-format-context.cjs

@@ -0,0 +1,16 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const createContext = require('../../utils/create-context.cjs');
+
+const [ColorPickerFormatPropsProvider, useColorPickerFormatPropsContext] = createContext.createContext({
+  name: "ColorPickerFormatContext",
+  hookName: "useColorPickerFormatPropsContext",
+  providerName: "<ColorPickerFormatPropsProvider />",
+  strict: false
+});
+
+exports.ColorPickerFormatPropsProvider = ColorPickerFormatPropsProvider;
+exports.useColorPickerFormatPropsContext = useColorPickerFormatPropsContext;

package/dist/components/color-picker/use-color-picker-format-context.d.cts

@@ -0,0 +1,7 @@
+import { ColorFormat } from '@zag-js/color-picker';
+import { Provider } from 'react';
+
+export interface UseColorPickerSwatchPropsContext {
+    format: ColorFormat;
+}
+export declare const ColorPickerFormatPropsProvider: Provider<UseColorPickerSwatchPropsContext>, useColorPickerFormatPropsContext: () => UseColorPickerSwatchPropsContext;

package/dist/components/color-picker/use-color-picker-format-context.d.ts

@@ -0,0 +1,7 @@
+import { ColorFormat } from '@zag-js/color-picker';
+import { Provider } from 'react';
+
+export interface UseColorPickerSwatchPropsContext {
+    format: ColorFormat;
+}
+export declare const ColorPickerFormatPropsProvider: Provider<UseColorPickerSwatchPropsContext>, useColorPickerFormatPropsContext: () => UseColorPickerSwatchPropsContext;

package/dist/components/color-picker/use-color-picker-format-context.js

@@ -0,0 +1,11 @@
+'use client';
+import { createContext } from '../../utils/create-context.js';
+
+const [ColorPickerFormatPropsProvider, useColorPickerFormatPropsContext] = createContext({
+  name: "ColorPickerFormatContext",
+  hookName: "useColorPickerFormatPropsContext",
+  providerName: "<ColorPickerFormatPropsProvider />",
+  strict: false
+});
+
+export { ColorPickerFormatPropsProvider, useColorPickerFormatPropsContext };