@yamada-ui/color-picker 1.4.9-dev-20241110150602 → 1.4.9-dev-20241111191457

package/dist/{chunk-DJST5TK2.mjs → chunk-6XIZXZXV.mjs}

@@ -1,7 +1,7 @@
 "use client"
 import {
   useColorSelectorContext
-} from "./chunk-X2EYDFTM.mjs";
+} from "./chunk-C7UAG4TH.mjs";
 
 // src/color-selector-eye-dropper.tsx
 import { IconButton } from "@yamada-ui/button";
@@ -57,4 +57,4 @@ export {
   ColorSelectorEyeDropper,
   EyeDropperIcon
 };
-//# sourceMappingURL=chunk-DJST5TK2.mjs.map
+//# sourceMappingURL=chunk-6XIZXZXV.mjs.map

package/dist/{chunk-X2EYDFTM.mjs → chunk-C7UAG4TH.mjs}

@@ -395,6 +395,7 @@ var useColorSelector = ({
       "aria-label": `Select ${color} as the color`,
       disabled,
       readOnly,
+      role: "button",
       ...props2,
       ref,
       color,
@@ -432,4 +433,4 @@ export {
   useColorSelectorContext,
   useColorSelector
 };
-//# sourceMappingURL=chunk-X2EYDFTM.mjs.map
+//# sourceMappingURL=chunk-C7UAG4TH.mjs.map

package/dist/{chunk-X2EYDFTM.mjs.map → chunk-C7UAG4TH.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/use-color-selector.ts"],"sourcesContent":["import type {\n  CSSUIObject,\n  HTMLUIProps,\n  PropGetter,\n  RequiredPropGetter,\n  ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { InputProps } from \"@yamada-ui/input\"\nimport type { ColorFormat, Dict } from \"@yamada-ui/utils\"\nimport type { ChangeEvent } from \"react\"\nimport type { AlphaSliderProps } from \"./alpha-slider\"\nimport type { ColorSwatchProps } from \"./color-swatch\"\nimport type { HueSliderProps } from \"./hue-slider\"\nimport type { SaturationSliderProps } from \"./saturation-slider\"\nimport {\n  formControlProperties,\n  useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { useEyeDropper } from \"@yamada-ui/use-eye-dropper\"\nimport {\n  calcFormat,\n  convertColor,\n  createContext,\n  handlerAll,\n  hslaTo,\n  hsvTo,\n  isString,\n  parseToHsla,\n  parseToHsv,\n  parseToRgba,\n  rgbaTo,\n  splitObject,\n  useCallbackRef,\n  useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport { useCallback, useMemo, useRef, useState } from \"react\"\n\ntype Space = keyof Hsla | keyof Rgba\ninterface Hsla {\n  a: number\n  h: number\n  l: number\n  s: number\n}\ninterface Rgba {\n  a: number\n  b: number\n  g: number\n  r: number\n}\ninterface Hsva {\n  a: number\n  h: number\n  s: number\n  v: number\n}\ninterface Channel {\n  label: string\n  max: number\n  min: number\n  space: Space\n  value: number\n}\n\nconst convertHsla = (value: string, fallback?: string): Hsla => {\n  let [h, s, l, a] = parseToHsla(value, fallback) ?? [0, 0, 1, 1]\n\n  if (a > 1) a = 1\n\n  return { a, h, l, s }\n}\n\nconst convertRgba = (value: string, fallback?: string): Rgba => {\n  let [r, g, b, a] = parseToRgba(value, fallback) ?? [255, 255, 255, 1]\n\n  if (r > 255) r = 255\n  if (g > 255) g = 255\n  if (b > 255) b = 255\n  if (a > 1) a = 1\n\n  return { a, b, g, r }\n}\n\nconst convertHsva = (value: string, fallback?: string): Hsva => {\n  const [h, s, v, a] = parseToHsv(value, fallback)\n\n  return { a, h, s, v }\n}\n\ninterface ColorSelectorContext {\n  channels: Channel[]\n  eyeDropperSupported: boolean\n  isInteractive: boolean\n  styles: { [key: string]: CSSUIObject | undefined }\n  value: string\n  withAlpha: boolean\n  getAlphaSliderProps: PropGetter<AlphaSliderProps>\n  getChannelProps: RequiredPropGetter<{ space: Space } & InputProps, InputProps>\n  getEyeDropperProps: PropGetter<\"button\">\n  getHueSliderProps: PropGetter<HueSliderProps>\n  getSwatchProps: PropGetter<ColorSwatchProps>\n  onChange: (value: Partial<Hsva> | string) => void\n  size?: ThemeProps<\"ColorSelector\">[\"size\"]\n  disabled?: boolean\n  readOnly?: boolean\n}\n\nexport const [ColorSelectorProvider, useColorSelectorContext] =\n  createContext<ColorSelectorContext>({\n    name: \"ColorSelectorContext\",\n    errorMessage: `useColorSelectorContext returned is 'undefined'. Seems you forgot to wrap the components in \"<ColorSelector />\"`,\n  })\n\ninterface UseColorSelectorOptions {\n  /**\n   * The base `id` to use for the color selector.\n   */\n  id?: string\n  /**\n   * The name attribute of the hidden `input` field.\n   * This is particularly useful in forms.\n   */\n  name?: string\n  /**\n   * The initial value of the color selector.\n   */\n  defaultValue?: string\n  /**\n   * The fallback value returned when color determination fails.\n   */\n  fallbackValue?: string\n  /**\n   * Color format. For example, `hex`, `rgba`, etc.\n   *\n   * @default \"hexa\"\n   */\n  format?: ColorFormat\n  /**\n   * The value of the color selector.\n   */\n  value?: string\n  /**\n   * Function called whenever the color selector value changes.\n   */\n  onChange?: (value: string) => void\n  /**\n   * Function called when the user is done selecting a new value.\n   */\n  onChangeEnd?: (value: string) => void\n  /**\n   * Function called when the user starts selecting a new value.\n   */\n  onChangeStart?: (value: string) => void\n  /**\n   * Function called whenever the color swatch click.\n   */\n  onSwatchClick?: (value: string) => void\n}\n\nexport interface UseColorSelectorBaseProps\n  extends UseColorSelectorOptions,\n    FormControlOptions {}\n\nexport interface UseColorSelectorProps\n  extends Omit<HTMLUIProps, \"children\" | \"defaultValue\" | \"onChange\">,\n    UseColorSelectorBaseProps {}\n\nexport const useColorSelector = ({\n  isInvalid,\n  ...props\n}: UseColorSelectorProps) => {\n  const {\n    id,\n    name,\n    defaultValue,\n    fallbackValue,\n    format: formatProp,\n    value: valueProp,\n    onChange: onChangeProp,\n    onChangeEnd: onChangeEndProp,\n    onChangeStart: onChangeStartProp,\n    onSwatchClick,\n    ...rest\n  } = useFormControlProps({ isInvalid, ...props })\n  const [\n    {\n      \"aria-readonly\": ariaReadonly,\n      disabled,\n      readOnly,\n      required,\n      ...formControlProps\n    },\n    containerProps,\n  ] = splitObject(rest, formControlProperties)\n\n  const onChangeStartRef = useCallbackRef(onChangeStartProp)\n  const onChangeEndRef = useCallbackRef(onChangeEndProp)\n  const { supported: eyeDropperSupported, onOpen } = useEyeDropper()\n  const [value, setValue] = useControllableState({\n    defaultValue: defaultValue ?? fallbackValue,\n    value: valueProp,\n    onChange: onChangeProp,\n  })\n  const format = useMemo(\n    () => formatProp ?? calcFormat(value || \"#ffffff\"),\n    [value, formatProp],\n  )\n  const resolvedValue = convertColor(value, \"#ffffff\")(format) as string\n  const timeoutId = useRef<any>(undefined)\n  const isDraggingRef = useRef<boolean>(false)\n  const [parsedValue, setParsedValue] = useState<Hsva>(\n    convertHsva(resolvedValue, fallbackValue),\n  )\n  const { a, h, s, v } = parsedValue\n  const withAlpha = format.endsWith(\"a\")\n  const isInteractive = !(disabled || readOnly)\n\n  const channels: Channel[] = useMemo(() => {\n    if (resolvedValue.startsWith(\"hsl\")) {\n      const { a, h, l, s } = convertHsla(resolvedValue, fallbackValue)\n\n      let channels: Channel[] = [\n        { label: \"H\", max: 360, min: 0, space: \"h\", value: Math.round(h) },\n        {\n          label: \"S(%)\",\n          max: 100,\n          min: 0,\n          space: \"s\",\n          value: Math.round(s * 100),\n        },\n        {\n          label: \"L(%)\",\n          max: 100,\n          min: 0,\n          space: \"l\",\n          value: Math.round(l * 100),\n        },\n      ]\n\n      if (withAlpha) {\n        channels = [\n          ...channels,\n          {\n            label: \"A(%)\",\n            max: 100,\n            min: 0,\n            space: \"a\",\n            value: Math.round(a * 100),\n          },\n        ]\n      }\n\n      return channels\n    } else {\n      const { a, b, g, r } = convertRgba(resolvedValue, fallbackValue)\n\n      let channels: Channel[] = [\n        { label: \"R\", max: 255, min: 0, space: \"r\", value: Math.round(r) },\n        { label: \"G\", max: 255, min: 0, space: \"g\", value: Math.round(g) },\n        { label: \"B\", max: 255, min: 0, space: \"b\", value: Math.round(b) },\n      ]\n\n      if (withAlpha) {\n        channels = [\n          ...channels,\n          {\n            label: \"A(%)\",\n            max: 100,\n            min: 0,\n            space: \"a\",\n            value: Math.round(a * 100),\n          },\n        ]\n      }\n\n      return channels\n    }\n  }, [resolvedValue, withAlpha, fallbackValue])\n\n  const onChange = useCallback(\n    (value: Partial<Hsva> | string) => {\n      if (isString(value)) {\n        setParsedValue(convertHsva(value, fallbackValue))\n      } else {\n        setParsedValue((prev) => ({ ...prev, ...value }))\n      }\n    },\n    [fallbackValue],\n  )\n\n  const onChangeStart = useCallback(\n    (value: Partial<Hsva>) => {\n      window.clearTimeout(timeoutId.current)\n\n      isDraggingRef.current = true\n\n      const { a, h, s, v } = { ...parsedValue, ...value }\n\n      const nextValue = hsvTo([h, s, v, a], fallbackValue)(format)\n\n      if (nextValue) onChangeStartRef(nextValue)\n    },\n    [onChangeStartRef, fallbackValue, parsedValue, format],\n  )\n\n  const onChangeEnd = useCallback(\n    (value: Partial<Hsva> | string) => {\n      window.clearTimeout(timeoutId.current)\n\n      timeoutId.current = window.setTimeout(() => {\n        isDraggingRef.current = false\n      }, 200)\n\n      let nextValue: string | undefined\n\n      if (isString(value)) {\n        nextValue = convertColor(value, fallbackValue)(format)\n      } else {\n        const { a, h, s, v } = { ...parsedValue, ...value }\n\n        nextValue = hsvTo([h, s, v, a], fallbackValue)(format)\n      }\n\n      if (nextValue) onChangeEndRef(nextValue)\n    },\n    [onChangeEndRef, fallbackValue, parsedValue, format],\n  )\n\n  const onChannelChange = useCallback(\n    (ev: ChangeEvent<HTMLInputElement>, space: Space) => {\n      let n = Math.floor(parseFloat(ev.target.value))\n\n      if (isNaN(n)) n = 0\n\n      if ([\"a\", \"l\", \"s\"].includes(space)) n = n / 100\n\n      let nextValue: string | undefined\n\n      if (resolvedValue.startsWith(\"hsl\")) {\n        const { a, h, l, s } = Object.assign(\n          convertHsla(resolvedValue, fallbackValue),\n          { [space]: n },\n        )\n\n        nextValue = hslaTo([h, s, l, a], fallbackValue)(format)\n      } else {\n        const { a, b, g, r } = Object.assign(\n          convertRgba(resolvedValue, fallbackValue),\n          { [space]: n },\n        )\n\n        nextValue = rgbaTo([r, g, b, a], fallbackValue)(format)\n      }\n\n      if (!nextValue) return\n\n      onChange(nextValue)\n      onChangeEnd(nextValue)\n    },\n    [resolvedValue, onChange, onChangeEnd, fallbackValue, format],\n  )\n\n  const onEyeDropperClick = useCallback(async () => {\n    try {\n      const { sRGBHex } = (await onOpen()) ?? {}\n\n      if (!sRGBHex) return\n\n      onChange(sRGBHex)\n      onChangeEnd(sRGBHex)\n    } catch {}\n  }, [onOpen, onChange, onChangeEnd])\n\n  useUpdateEffect(() => {\n    const nextValue = hsvTo([h, s, v, a], fallbackValue)(format)\n\n    if (nextValue) setValue(nextValue)\n  }, [h, s, v, a])\n\n  useUpdateEffect(() => {\n    if (isDraggingRef.current) return\n\n    if (valueProp) setParsedValue(convertHsva(valueProp, fallbackValue))\n  }, [valueProp])\n\n  useUpdateEffect(() => {\n    if (!value) return\n\n    const nextValue = convertColor(value, fallbackValue)(format)\n\n    if (nextValue) setValue(nextValue)\n  }, [format])\n\n  const getContainerProps: PropGetter = useCallback(\n    (props = {}, ref = null) => ({\n      ...props,\n      ref,\n      ...formControlProps,\n      ...containerProps,\n    }),\n    [containerProps, formControlProps],\n  )\n\n  const getInputProps: PropGetter<\"input\"> = useCallback(\n    (props = {}, ref = null) => ({\n      ...formControlProps,\n      \"aria-readonly\": ariaReadonly,\n      ...props,\n      id,\n      ref,\n      type: \"hidden\",\n      name,\n      disabled,\n      readOnly,\n      required,\n      value: resolvedValue,\n    }),\n    [\n      formControlProps,\n      ariaReadonly,\n      id,\n      name,\n      resolvedValue,\n      required,\n      disabled,\n      readOnly,\n    ],\n  )\n\n  const getSaturationSliderProps: PropGetter<SaturationSliderProps> =\n    useCallback(\n      (props = {}, ref = null) => ({\n        disabled,\n        isInvalid,\n        readOnly,\n        required,\n        ...props,\n        ref,\n        value: [h, s, v],\n        onChange: handlerAll(props.onChange, ([, s, v]) => onChange({ s, v })),\n        onChangeEnd: handlerAll(props.onChangeEnd, ([, s, v]) =>\n          onChangeEnd({ s, v }),\n        ),\n        onChangeStart: handlerAll(props.onChangeStart, ([, s, v]) =>\n          onChangeStart({ s, v }),\n        ),\n      }),\n      [\n        required,\n        disabled,\n        readOnly,\n        isInvalid,\n        h,\n        s,\n        v,\n        onChange,\n        onChangeStart,\n        onChangeEnd,\n      ],\n    )\n\n  const getHueSliderProps: PropGetter<HueSliderProps> = useCallback(\n    (props = {}, ref = null) => ({\n      disabled,\n      isInvalid,\n      readOnly,\n      required,\n      ...props,\n      ref,\n      value: h,\n      onChange: handlerAll(props.onChange, (h) => onChange({ h })),\n      onChangeEnd: handlerAll(props.onChangeEnd, (h) => onChangeEnd({ h })),\n      onChangeStart: handlerAll(props.onChangeStart, (h) =>\n        onChangeStart({ h }),\n      ),\n    }),\n    [\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      h,\n      onChange,\n      onChangeStart,\n      onChangeEnd,\n    ],\n  )\n\n  const getAlphaSliderProps: PropGetter<AlphaSliderProps> = useCallback(\n    (props = {}, ref = null) => ({\n      disabled,\n      isInvalid,\n      readOnly,\n      required,\n      ...props,\n      ref,\n      color: hsvTo([h, s, v, a], fallbackValue)(format),\n      value: a,\n      onChange: handlerAll(props.onChange, (a) => onChange({ a })),\n      onChangeEnd: handlerAll(props.onChangeEnd, (a) => onChangeEnd({ a })),\n      onChangeStart: handlerAll(props.onChangeStart, (a) =>\n        onChangeStart({ a }),\n      ),\n    }),\n    [\n      fallbackValue,\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      format,\n      h,\n      s,\n      v,\n      a,\n      onChange,\n      onChangeStart,\n      onChangeEnd,\n    ],\n  )\n\n  const getChannelProps: RequiredPropGetter<\n    { space: Space } & InputProps,\n    InputProps\n  > = useCallback(\n    ({ space, ...props }, ref = null) => {\n      return {\n        disabled,\n        isInvalid,\n        readOnly,\n        required,\n        ...props,\n        ref,\n        type: \"number\",\n        step: 1,\n        onChange: handlerAll(props.onChange, (ev) =>\n          onChannelChange(ev, space),\n        ),\n      } as Dict\n    },\n    [required, disabled, readOnly, isInvalid, onChannelChange],\n  )\n\n  const getEyeDropperProps: PropGetter<\"button\"> = useCallback(\n    (props = {}, ref = null) => ({\n      \"aria-label\": \"Pick a color\",\n      disabled,\n      ...props,\n      ref,\n      onClick: handlerAll(props.onClick, onEyeDropperClick),\n    }),\n    [disabled, onEyeDropperClick],\n  )\n\n  const getSwatchProps: PropGetter<ColorSwatchProps> = useCallback(\n    ({ color, ...props } = {}, ref = null) => ({\n      \"aria-label\": `Select ${color} as the color`,\n      disabled,\n      readOnly,\n      ...props,\n      ref,\n      color,\n      onClick: handlerAll(props.onClick, () => {\n        if (!isString(color)) return\n\n        onSwatchClick?.(color)\n        onChange(color)\n        onChangeEnd(color)\n      }),\n    }),\n    [disabled, readOnly, onSwatchClick, onChange, onChangeEnd],\n  )\n\n  return {\n    channels,\n    disabled,\n    eyeDropperSupported,\n    isInteractive,\n    readOnly,\n    value: resolvedValue,\n    withAlpha,\n    getAlphaSliderProps,\n    getChannelProps,\n    getContainerProps,\n    getEyeDropperProps,\n    getHueSliderProps,\n    getInputProps,\n    getSaturationSliderProps,\n    getSwatchProps,\n    onChange,\n  }\n}\n\nexport type UseColorSelectorReturn = ReturnType<typeof useColorSelector>\n"],"mappings":"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","names":["a","h","s","channels","value","v","props"]}
+{"version":3,"sources":["../src/use-color-selector.ts"],"sourcesContent":["import type {\n  CSSUIObject,\n  HTMLUIProps,\n  PropGetter,\n  RequiredPropGetter,\n  ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { InputProps } from \"@yamada-ui/input\"\nimport type { ColorFormat, Dict } from \"@yamada-ui/utils\"\nimport type { ChangeEvent } from \"react\"\nimport type { AlphaSliderProps } from \"./alpha-slider\"\nimport type { ColorSwatchProps } from \"./color-swatch\"\nimport type { HueSliderProps } from \"./hue-slider\"\nimport type { SaturationSliderProps } from \"./saturation-slider\"\nimport {\n  formControlProperties,\n  useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { useEyeDropper } from \"@yamada-ui/use-eye-dropper\"\nimport {\n  calcFormat,\n  convertColor,\n  createContext,\n  handlerAll,\n  hslaTo,\n  hsvTo,\n  isString,\n  parseToHsla,\n  parseToHsv,\n  parseToRgba,\n  rgbaTo,\n  splitObject,\n  useCallbackRef,\n  useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport { useCallback, useMemo, useRef, useState } from \"react\"\n\ntype Space = keyof Hsla | keyof Rgba\ninterface Hsla {\n  a: number\n  h: number\n  l: number\n  s: number\n}\ninterface Rgba {\n  a: number\n  b: number\n  g: number\n  r: number\n}\ninterface Hsva {\n  a: number\n  h: number\n  s: number\n  v: number\n}\ninterface Channel {\n  label: string\n  max: number\n  min: number\n  space: Space\n  value: number\n}\n\nconst convertHsla = (value: string, fallback?: string): Hsla => {\n  let [h, s, l, a] = parseToHsla(value, fallback) ?? [0, 0, 1, 1]\n\n  if (a > 1) a = 1\n\n  return { a, h, l, s }\n}\n\nconst convertRgba = (value: string, fallback?: string): Rgba => {\n  let [r, g, b, a] = parseToRgba(value, fallback) ?? [255, 255, 255, 1]\n\n  if (r > 255) r = 255\n  if (g > 255) g = 255\n  if (b > 255) b = 255\n  if (a > 1) a = 1\n\n  return { a, b, g, r }\n}\n\nconst convertHsva = (value: string, fallback?: string): Hsva => {\n  const [h, s, v, a] = parseToHsv(value, fallback)\n\n  return { a, h, s, v }\n}\n\ninterface ColorSelectorContext {\n  channels: Channel[]\n  eyeDropperSupported: boolean\n  isInteractive: boolean\n  styles: { [key: string]: CSSUIObject | undefined }\n  value: string\n  withAlpha: boolean\n  getAlphaSliderProps: PropGetter<AlphaSliderProps>\n  getChannelProps: RequiredPropGetter<{ space: Space } & InputProps, InputProps>\n  getEyeDropperProps: PropGetter<\"button\">\n  getHueSliderProps: PropGetter<HueSliderProps>\n  getSwatchProps: PropGetter<ColorSwatchProps>\n  onChange: (value: Partial<Hsva> | string) => void\n  size?: ThemeProps<\"ColorSelector\">[\"size\"]\n  disabled?: boolean\n  readOnly?: boolean\n}\n\nexport const [ColorSelectorProvider, useColorSelectorContext] =\n  createContext<ColorSelectorContext>({\n    name: \"ColorSelectorContext\",\n    errorMessage: `useColorSelectorContext returned is 'undefined'. Seems you forgot to wrap the components in \"<ColorSelector />\"`,\n  })\n\ninterface UseColorSelectorOptions {\n  /**\n   * The base `id` to use for the color selector.\n   */\n  id?: string\n  /**\n   * The name attribute of the hidden `input` field.\n   * This is particularly useful in forms.\n   */\n  name?: string\n  /**\n   * The initial value of the color selector.\n   */\n  defaultValue?: string\n  /**\n   * The fallback value returned when color determination fails.\n   */\n  fallbackValue?: string\n  /**\n   * Color format. For example, `hex`, `rgba`, etc.\n   *\n   * @default \"hexa\"\n   */\n  format?: ColorFormat\n  /**\n   * The value of the color selector.\n   */\n  value?: string\n  /**\n   * Function called whenever the color selector value changes.\n   */\n  onChange?: (value: string) => void\n  /**\n   * Function called when the user is done selecting a new value.\n   */\n  onChangeEnd?: (value: string) => void\n  /**\n   * Function called when the user starts selecting a new value.\n   */\n  onChangeStart?: (value: string) => void\n  /**\n   * Function called whenever the color swatch click.\n   */\n  onSwatchClick?: (value: string) => void\n}\n\nexport interface UseColorSelectorBaseProps\n  extends UseColorSelectorOptions,\n    FormControlOptions {}\n\nexport interface UseColorSelectorProps\n  extends Omit<HTMLUIProps, \"children\" | \"defaultValue\" | \"onChange\">,\n    UseColorSelectorBaseProps {}\n\nexport const useColorSelector = ({\n  isInvalid,\n  ...props\n}: UseColorSelectorProps) => {\n  const {\n    id,\n    name,\n    defaultValue,\n    fallbackValue,\n    format: formatProp,\n    value: valueProp,\n    onChange: onChangeProp,\n    onChangeEnd: onChangeEndProp,\n    onChangeStart: onChangeStartProp,\n    onSwatchClick,\n    ...rest\n  } = useFormControlProps({ isInvalid, ...props })\n  const [\n    {\n      \"aria-readonly\": ariaReadonly,\n      disabled,\n      readOnly,\n      required,\n      ...formControlProps\n    },\n    containerProps,\n  ] = splitObject(rest, formControlProperties)\n\n  const onChangeStartRef = useCallbackRef(onChangeStartProp)\n  const onChangeEndRef = useCallbackRef(onChangeEndProp)\n  const { supported: eyeDropperSupported, onOpen } = useEyeDropper()\n  const [value, setValue] = useControllableState({\n    defaultValue: defaultValue ?? fallbackValue,\n    value: valueProp,\n    onChange: onChangeProp,\n  })\n  const format = useMemo(\n    () => formatProp ?? calcFormat(value || \"#ffffff\"),\n    [value, formatProp],\n  )\n  const resolvedValue = convertColor(value, \"#ffffff\")(format) as string\n  const timeoutId = useRef<any>(undefined)\n  const isDraggingRef = useRef<boolean>(false)\n  const [parsedValue, setParsedValue] = useState<Hsva>(\n    convertHsva(resolvedValue, fallbackValue),\n  )\n  const { a, h, s, v } = parsedValue\n  const withAlpha = format.endsWith(\"a\")\n  const isInteractive = !(disabled || readOnly)\n\n  const channels: Channel[] = useMemo(() => {\n    if (resolvedValue.startsWith(\"hsl\")) {\n      const { a, h, l, s } = convertHsla(resolvedValue, fallbackValue)\n\n      let channels: Channel[] = [\n        { label: \"H\", max: 360, min: 0, space: \"h\", value: Math.round(h) },\n        {\n          label: \"S(%)\",\n          max: 100,\n          min: 0,\n          space: \"s\",\n          value: Math.round(s * 100),\n        },\n        {\n          label: \"L(%)\",\n          max: 100,\n          min: 0,\n          space: \"l\",\n          value: Math.round(l * 100),\n        },\n      ]\n\n      if (withAlpha) {\n        channels = [\n          ...channels,\n          {\n            label: \"A(%)\",\n            max: 100,\n            min: 0,\n            space: \"a\",\n            value: Math.round(a * 100),\n          },\n        ]\n      }\n\n      return channels\n    } else {\n      const { a, b, g, r } = convertRgba(resolvedValue, fallbackValue)\n\n      let channels: Channel[] = [\n        { label: \"R\", max: 255, min: 0, space: \"r\", value: Math.round(r) },\n        { label: \"G\", max: 255, min: 0, space: \"g\", value: Math.round(g) },\n        { label: \"B\", max: 255, min: 0, space: \"b\", value: Math.round(b) },\n      ]\n\n      if (withAlpha) {\n        channels = [\n          ...channels,\n          {\n            label: \"A(%)\",\n            max: 100,\n            min: 0,\n            space: \"a\",\n            value: Math.round(a * 100),\n          },\n        ]\n      }\n\n      return channels\n    }\n  }, [resolvedValue, withAlpha, fallbackValue])\n\n  const onChange = useCallback(\n    (value: Partial<Hsva> | string) => {\n      if (isString(value)) {\n        setParsedValue(convertHsva(value, fallbackValue))\n      } else {\n        setParsedValue((prev) => ({ ...prev, ...value }))\n      }\n    },\n    [fallbackValue],\n  )\n\n  const onChangeStart = useCallback(\n    (value: Partial<Hsva>) => {\n      window.clearTimeout(timeoutId.current)\n\n      isDraggingRef.current = true\n\n      const { a, h, s, v } = { ...parsedValue, ...value }\n\n      const nextValue = hsvTo([h, s, v, a], fallbackValue)(format)\n\n      if (nextValue) onChangeStartRef(nextValue)\n    },\n    [onChangeStartRef, fallbackValue, parsedValue, format],\n  )\n\n  const onChangeEnd = useCallback(\n    (value: Partial<Hsva> | string) => {\n      window.clearTimeout(timeoutId.current)\n\n      timeoutId.current = window.setTimeout(() => {\n        isDraggingRef.current = false\n      }, 200)\n\n      let nextValue: string | undefined\n\n      if (isString(value)) {\n        nextValue = convertColor(value, fallbackValue)(format)\n      } else {\n        const { a, h, s, v } = { ...parsedValue, ...value }\n\n        nextValue = hsvTo([h, s, v, a], fallbackValue)(format)\n      }\n\n      if (nextValue) onChangeEndRef(nextValue)\n    },\n    [onChangeEndRef, fallbackValue, parsedValue, format],\n  )\n\n  const onChannelChange = useCallback(\n    (ev: ChangeEvent<HTMLInputElement>, space: Space) => {\n      let n = Math.floor(parseFloat(ev.target.value))\n\n      if (isNaN(n)) n = 0\n\n      if ([\"a\", \"l\", \"s\"].includes(space)) n = n / 100\n\n      let nextValue: string | undefined\n\n      if (resolvedValue.startsWith(\"hsl\")) {\n        const { a, h, l, s } = Object.assign(\n          convertHsla(resolvedValue, fallbackValue),\n          { [space]: n },\n        )\n\n        nextValue = hslaTo([h, s, l, a], fallbackValue)(format)\n      } else {\n        const { a, b, g, r } = Object.assign(\n          convertRgba(resolvedValue, fallbackValue),\n          { [space]: n },\n        )\n\n        nextValue = rgbaTo([r, g, b, a], fallbackValue)(format)\n      }\n\n      if (!nextValue) return\n\n      onChange(nextValue)\n      onChangeEnd(nextValue)\n    },\n    [resolvedValue, onChange, onChangeEnd, fallbackValue, format],\n  )\n\n  const onEyeDropperClick = useCallback(async () => {\n    try {\n      const { sRGBHex } = (await onOpen()) ?? {}\n\n      if (!sRGBHex) return\n\n      onChange(sRGBHex)\n      onChangeEnd(sRGBHex)\n    } catch {}\n  }, [onOpen, onChange, onChangeEnd])\n\n  useUpdateEffect(() => {\n    const nextValue = hsvTo([h, s, v, a], fallbackValue)(format)\n\n    if (nextValue) setValue(nextValue)\n  }, [h, s, v, a])\n\n  useUpdateEffect(() => {\n    if (isDraggingRef.current) return\n\n    if (valueProp) setParsedValue(convertHsva(valueProp, fallbackValue))\n  }, [valueProp])\n\n  useUpdateEffect(() => {\n    if (!value) return\n\n    const nextValue = convertColor(value, fallbackValue)(format)\n\n    if (nextValue) setValue(nextValue)\n  }, [format])\n\n  const getContainerProps: PropGetter = useCallback(\n    (props = {}, ref = null) => ({\n      ...props,\n      ref,\n      ...formControlProps,\n      ...containerProps,\n    }),\n    [containerProps, formControlProps],\n  )\n\n  const getInputProps: PropGetter<\"input\"> = useCallback(\n    (props = {}, ref = null) => ({\n      ...formControlProps,\n      \"aria-readonly\": ariaReadonly,\n      ...props,\n      id,\n      ref,\n      type: \"hidden\",\n      name,\n      disabled,\n      readOnly,\n      required,\n      value: resolvedValue,\n    }),\n    [\n      formControlProps,\n      ariaReadonly,\n      id,\n      name,\n      resolvedValue,\n      required,\n      disabled,\n      readOnly,\n    ],\n  )\n\n  const getSaturationSliderProps: PropGetter<SaturationSliderProps> =\n    useCallback(\n      (props = {}, ref = null) => ({\n        disabled,\n        isInvalid,\n        readOnly,\n        required,\n        ...props,\n        ref,\n        value: [h, s, v],\n        onChange: handlerAll(props.onChange, ([, s, v]) => onChange({ s, v })),\n        onChangeEnd: handlerAll(props.onChangeEnd, ([, s, v]) =>\n          onChangeEnd({ s, v }),\n        ),\n        onChangeStart: handlerAll(props.onChangeStart, ([, s, v]) =>\n          onChangeStart({ s, v }),\n        ),\n      }),\n      [\n        required,\n        disabled,\n        readOnly,\n        isInvalid,\n        h,\n        s,\n        v,\n        onChange,\n        onChangeStart,\n        onChangeEnd,\n      ],\n    )\n\n  const getHueSliderProps: PropGetter<HueSliderProps> = useCallback(\n    (props = {}, ref = null) => ({\n      disabled,\n      isInvalid,\n      readOnly,\n      required,\n      ...props,\n      ref,\n      value: h,\n      onChange: handlerAll(props.onChange, (h) => onChange({ h })),\n      onChangeEnd: handlerAll(props.onChangeEnd, (h) => onChangeEnd({ h })),\n      onChangeStart: handlerAll(props.onChangeStart, (h) =>\n        onChangeStart({ h }),\n      ),\n    }),\n    [\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      h,\n      onChange,\n      onChangeStart,\n      onChangeEnd,\n    ],\n  )\n\n  const getAlphaSliderProps: PropGetter<AlphaSliderProps> = useCallback(\n    (props = {}, ref = null) => ({\n      disabled,\n      isInvalid,\n      readOnly,\n      required,\n      ...props,\n      ref,\n      color: hsvTo([h, s, v, a], fallbackValue)(format),\n      value: a,\n      onChange: handlerAll(props.onChange, (a) => onChange({ a })),\n      onChangeEnd: handlerAll(props.onChangeEnd, (a) => onChangeEnd({ a })),\n      onChangeStart: handlerAll(props.onChangeStart, (a) =>\n        onChangeStart({ a }),\n      ),\n    }),\n    [\n      fallbackValue,\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      format,\n      h,\n      s,\n      v,\n      a,\n      onChange,\n      onChangeStart,\n      onChangeEnd,\n    ],\n  )\n\n  const getChannelProps: RequiredPropGetter<\n    { space: Space } & InputProps,\n    InputProps\n  > = useCallback(\n    ({ space, ...props }, ref = null) => {\n      return {\n        disabled,\n        isInvalid,\n        readOnly,\n        required,\n        ...props,\n        ref,\n        type: \"number\",\n        step: 1,\n        onChange: handlerAll(props.onChange, (ev) =>\n          onChannelChange(ev, space),\n        ),\n      } as Dict\n    },\n    [required, disabled, readOnly, isInvalid, onChannelChange],\n  )\n\n  const getEyeDropperProps: PropGetter<\"button\"> = useCallback(\n    (props = {}, ref = null) => ({\n      \"aria-label\": \"Pick a color\",\n      disabled,\n      ...props,\n      ref,\n      onClick: handlerAll(props.onClick, onEyeDropperClick),\n    }),\n    [disabled, onEyeDropperClick],\n  )\n\n  const getSwatchProps: PropGetter<ColorSwatchProps> = useCallback(\n    ({ color, ...props } = {}, ref = null) => ({\n      \"aria-label\": `Select ${color} as the color`,\n      disabled,\n      readOnly,\n      role: \"button\",\n      ...props,\n      ref,\n      color,\n      onClick: handlerAll(props.onClick, () => {\n        if (!isString(color)) return\n\n        onSwatchClick?.(color)\n        onChange(color)\n        onChangeEnd(color)\n      }),\n    }),\n    [disabled, readOnly, onSwatchClick, onChange, onChangeEnd],\n  )\n\n  return {\n    channels,\n    disabled,\n    eyeDropperSupported,\n    isInteractive,\n    readOnly,\n    value: resolvedValue,\n    withAlpha,\n    getAlphaSliderProps,\n    getChannelProps,\n    getContainerProps,\n    getEyeDropperProps,\n    getHueSliderProps,\n    getInputProps,\n    getSaturationSliderProps,\n    getSwatchProps,\n    onChange,\n  }\n}\n\nexport type UseColorSelectorReturn = ReturnType<typeof useColorSelector>\n"],"mappings":"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","names":["a","h","s","channels","value","v","props"]}

package/dist/{chunk-JRSGQRFQ.mjs → chunk-NNVWH4IX.mjs}

@@ -1,10 +1,10 @@
 "use client"
 import {
   ColorSwatch
-} from "./chunk-YYXTR7W7.mjs";
+} from "./chunk-OPWYRBSP.mjs";
 import {
   useColorSelectorContext
-} from "./chunk-X2EYDFTM.mjs";
+} from "./chunk-C7UAG4TH.mjs";
 
 // src/color-selector-swatches.tsx
 import { forwardRef, ui } from "@yamada-ui/core";
@@ -69,4 +69,4 @@ ColorSelectorSwatches.__ui__ = "ColorSelectorSwatches";
 export {
   ColorSelectorSwatches
 };
-//# sourceMappingURL=chunk-JRSGQRFQ.mjs.map
+//# sourceMappingURL=chunk-NNVWH4IX.mjs.map

package/dist/{chunk-YYXTR7W7.mjs → chunk-OPWYRBSP.mjs}

@@ -79,6 +79,8 @@ var ColorSwatch = forwardRef((props, ref) => {
     {
       ref,
       className: cx("ui-color-swatch", className),
+      "aria-roledescription": "color swatch",
+      role: "img",
       ...isRounded ? { rounded: "fallback(full, 9999px)" } : {},
       __css: css,
       ...rest,
@@ -107,4 +109,4 @@ ColorSwatch.__ui__ = "ColorSwatch";
 export {
   ColorSwatch
 };
-//# sourceMappingURL=chunk-YYXTR7W7.mjs.map
+//# sourceMappingURL=chunk-OPWYRBSP.mjs.map

package/dist/{chunk-YYXTR7W7.mjs.map → chunk-OPWYRBSP.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/color-swatch.tsx"],"sourcesContent":["import type {\n  CSSUIObject,\n  CSSUIProps,\n  HTMLUIProps,\n  ThemeProps,\n} from \"@yamada-ui/core\"\nimport {\n  forwardRef,\n  omitThemeProps,\n  ui,\n  useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\n\nconst defaultOverlays = (\n  background: CSSUIProps[\"color\"],\n  withShadow: boolean,\n): HTMLUIProps[] => {\n  let overlays: HTMLUIProps[] = [\n    {\n      bgImage:\n        \"linear-gradient(45deg, $checkers 25%, transparent 25%), linear-gradient(-45deg, $checkers 25%, transparent 25%), linear-gradient(45deg, transparent 75%, $checkers 75%), linear-gradient(-45deg, $body 75%, $checkers 75%)\",\n      bgPosition: `0 0, 0 4px, 4px -4px, -4px 0`,\n      bgSize: `8px 8px`,\n      vars: [\n        {\n          name: \"checkers\",\n          token: \"colors\",\n          value: [\"blackAlpha.300\", \"whiteAlpha.300\"],\n        },\n        {\n          name: \"body\",\n          token: \"colors\",\n          value: [\"whiteAlpha.500\", \"blackAlpha.500\"],\n        },\n      ],\n    },\n    { background },\n  ]\n\n  if (withShadow)\n    overlays = [\n      ...overlays,\n      {\n        boxShadow: `rgba(0, 0, 0, .1) 0 0 0 1px inset, rgb(0, 0, 0, .15) 0 0 4px inset`,\n      },\n    ]\n\n  return overlays\n}\n\ninterface ColorSwatchOptions {\n  /**\n   * The color used for the swatch element.\n   *\n   * @default \"#ffffff00\"\n   */\n  color?: CSSUIProps[\"color\"]\n  /**\n   * If `true`, the color swatch will be perfectly round. Else, it'll be slightly round.\n   *\n   * @default false\n   */\n  isRounded?: boolean\n  /**\n   * The overlay used for the swatch element.\n   */\n  overlays?: HTMLUIProps[]\n  /**\n   * If `true`, the swatch element has an inner `box-shadow`.\n   *\n   * @default true\n   */\n  withShadow?: boolean\n}\n\nexport interface ColorSwatchProps\n  extends Omit<HTMLUIProps, \"color\">,\n    ThemeProps<\"ColorSwatch\">,\n    ColorSwatchOptions {}\n\n/**\n * `ColorSwatch` is a component that displays color samples.\n *\n * @see Docs https://yamada-ui.com/components/data-display/color-swatch\n */\nexport const ColorSwatch = forwardRef<ColorSwatchProps, \"div\">((props, ref) => {\n  const [styles, mergedProps] = useComponentMultiStyle(\"ColorSwatch\", props)\n  const {\n    className,\n    color = \"#ffffff00\",\n    isRounded,\n    withShadow = true,\n    overlays = defaultOverlays(color, withShadow),\n    __css,\n    ...rest\n  } = omitThemeProps(mergedProps)\n\n  const css: CSSUIObject = {\n    \"& > *\": {\n      alignItems: \"center\",\n      bottom: \"0\",\n      display: \"flex\",\n      h: \"100%\",\n      justifyContent: \"center\",\n      left: \"0\",\n      overflow: \"hidden\",\n      position: \"absolute\",\n      right: \"0\",\n      top: \"0\",\n      w: \"100%\",\n    },\n    position: \"relative\",\n    _before: {\n      content: `\"\"`,\n      display: \"block\",\n      h: 0,\n      pb: \"100%\",\n    },\n    ...styles.container,\n    ...__css,\n  }\n\n  return (\n    <ui.div\n      ref={ref}\n      className={cx(\"ui-color-swatch\", className)}\n      {...(isRounded ? { rounded: \"fallback(full, 9999px)\" } : {})}\n      __css={css}\n      {...rest}\n    >\n      <ui.div {...(isRounded ? { rounded: \"fallback(full, 9999px)\" } : {})}>\n        {overlays.map((props, index) => (\n          <ui.div\n            key={index}\n            __css={{\n              bottom: 0,\n              left: 0,\n              position: \"absolute\",\n              right: 0,\n              top: 0,\n              ...styles.overlay,\n            }}\n            {...(isRounded ? { rounded: \"fallback(full, 9999px)\" } : {})}\n            {...props}\n          />\n        ))}\n      </ui.div>\n    </ui.div>\n  )\n})\n\nColorSwatch.displayName = \"ColorSwatch\"\nColorSwatch.__ui__ = \"ColorSwatch\"\n"],"mappings":";;;AAMA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,UAAU;AAyHT;AAvHV,IAAM,kBAAkB,CACtB,YACA,eACkB;AAClB,MAAI,WAA0B;AAAA,IAC5B;AAAA,MACE,SACE;AAAA,MACF,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,MAAM;AAAA,QACJ;AAAA,UACE,MAAM;AAAA,UACN,OAAO;AAAA,UACP,OAAO,CAAC,kBAAkB,gBAAgB;AAAA,QAC5C;AAAA,QACA;AAAA,UACE,MAAM;AAAA,UACN,OAAO;AAAA,UACP,OAAO,CAAC,kBAAkB,gBAAgB;AAAA,QAC5C;AAAA,MACF;AAAA,IACF;AAAA,IACA,EAAE,WAAW;AAAA,EACf;AAEA,MAAI;AACF,eAAW;AAAA,MACT,GAAG;AAAA,MACH;AAAA,QACE,WAAW;AAAA,MACb;AAAA,IACF;AAEF,SAAO;AACT;AAqCO,IAAM,cAAc,WAAoC,CAAC,OAAO,QAAQ;AAC7E,QAAM,CAAC,QAAQ,WAAW,IAAI,uBAAuB,eAAe,KAAK;AACzE,QAAM;AAAA,IACJ;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA,aAAa;AAAA,IACb,WAAW,gBAAgB,OAAO,UAAU;AAAA,IAC5C;AAAA,IACA,GAAG;AAAA,EACL,IAAI,eAAe,WAAW;AAE9B,QAAM,MAAmB;AAAA,IACvB,SAAS;AAAA,MACP,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,GAAG;AAAA,MACH,gBAAgB;AAAA,MAChB,MAAM;AAAA,MACN,UAAU;AAAA,MACV,UAAU;AAAA,MACV,OAAO;AAAA,MACP,KAAK;AAAA,MACL,GAAG;AAAA,IACL;AAAA,IACA,UAAU;AAAA,IACV,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,MACT,GAAG;AAAA,MACH,IAAI;AAAA,IACN;AAAA,IACA,GAAG,OAAO;AAAA,IACV,GAAG;AAAA,EACL;AAEA,SACE;AAAA,IAAC,GAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,WAAW,GAAG,mBAAmB,SAAS;AAAA,MACzC,GAAI,YAAY,EAAE,SAAS,yBAAyB,IAAI,CAAC;AAAA,MAC1D,OAAO;AAAA,MACN,GAAG;AAAA,MAEJ,8BAAC,GAAG,KAAH,EAAQ,GAAI,YAAY,EAAE,SAAS,yBAAyB,IAAI,CAAC,GAC/D,mBAAS,IAAI,CAACA,QAAO,UACpB;AAAA,QAAC,GAAG;AAAA,QAAH;AAAA,UAEC,OAAO;AAAA,YACL,QAAQ;AAAA,YACR,MAAM;AAAA,YACN,UAAU;AAAA,YACV,OAAO;AAAA,YACP,KAAK;AAAA,YACL,GAAG,OAAO;AAAA,UACZ;AAAA,UACC,GAAI,YAAY,EAAE,SAAS,yBAAyB,IAAI,CAAC;AAAA,UACzD,GAAGA;AAAA;AAAA,QAVC;AAAA,MAWP,CACD,GACH;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,SAAS;","names":["props"]}
+{"version":3,"sources":["../src/color-swatch.tsx"],"sourcesContent":["import type {\n  CSSUIObject,\n  CSSUIProps,\n  HTMLUIProps,\n  ThemeProps,\n} from \"@yamada-ui/core\"\nimport {\n  forwardRef,\n  omitThemeProps,\n  ui,\n  useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\n\nconst defaultOverlays = (\n  background: CSSUIProps[\"color\"],\n  withShadow: boolean,\n): HTMLUIProps[] => {\n  let overlays: HTMLUIProps[] = [\n    {\n      bgImage:\n        \"linear-gradient(45deg, $checkers 25%, transparent 25%), linear-gradient(-45deg, $checkers 25%, transparent 25%), linear-gradient(45deg, transparent 75%, $checkers 75%), linear-gradient(-45deg, $body 75%, $checkers 75%)\",\n      bgPosition: `0 0, 0 4px, 4px -4px, -4px 0`,\n      bgSize: `8px 8px`,\n      vars: [\n        {\n          name: \"checkers\",\n          token: \"colors\",\n          value: [\"blackAlpha.300\", \"whiteAlpha.300\"],\n        },\n        {\n          name: \"body\",\n          token: \"colors\",\n          value: [\"whiteAlpha.500\", \"blackAlpha.500\"],\n        },\n      ],\n    },\n    { background },\n  ]\n\n  if (withShadow)\n    overlays = [\n      ...overlays,\n      {\n        boxShadow: `rgba(0, 0, 0, .1) 0 0 0 1px inset, rgb(0, 0, 0, .15) 0 0 4px inset`,\n      },\n    ]\n\n  return overlays\n}\n\ninterface ColorSwatchOptions {\n  /**\n   * The color used for the swatch element.\n   *\n   * @default \"#ffffff00\"\n   */\n  color?: CSSUIProps[\"color\"]\n  /**\n   * If `true`, the color swatch will be perfectly round. Else, it'll be slightly round.\n   *\n   * @default false\n   */\n  isRounded?: boolean\n  /**\n   * The overlay used for the swatch element.\n   */\n  overlays?: HTMLUIProps[]\n  /**\n   * If `true`, the swatch element has an inner `box-shadow`.\n   *\n   * @default true\n   */\n  withShadow?: boolean\n}\n\nexport interface ColorSwatchProps\n  extends Omit<HTMLUIProps, \"color\">,\n    ThemeProps<\"ColorSwatch\">,\n    ColorSwatchOptions {}\n\n/**\n * `ColorSwatch` is a component that displays color samples.\n *\n * @see Docs https://yamada-ui.com/components/data-display/color-swatch\n */\nexport const ColorSwatch = forwardRef<ColorSwatchProps, \"div\">((props, ref) => {\n  const [styles, mergedProps] = useComponentMultiStyle(\"ColorSwatch\", props)\n  const {\n    className,\n    color = \"#ffffff00\",\n    isRounded,\n    withShadow = true,\n    overlays = defaultOverlays(color, withShadow),\n    __css,\n    ...rest\n  } = omitThemeProps(mergedProps)\n\n  const css: CSSUIObject = {\n    \"& > *\": {\n      alignItems: \"center\",\n      bottom: \"0\",\n      display: \"flex\",\n      h: \"100%\",\n      justifyContent: \"center\",\n      left: \"0\",\n      overflow: \"hidden\",\n      position: \"absolute\",\n      right: \"0\",\n      top: \"0\",\n      w: \"100%\",\n    },\n    position: \"relative\",\n    _before: {\n      content: `\"\"`,\n      display: \"block\",\n      h: 0,\n      pb: \"100%\",\n    },\n    ...styles.container,\n    ...__css,\n  }\n\n  return (\n    <ui.div\n      ref={ref}\n      className={cx(\"ui-color-swatch\", className)}\n      aria-roledescription=\"color swatch\"\n      role=\"img\"\n      {...(isRounded ? { rounded: \"fallback(full, 9999px)\" } : {})}\n      __css={css}\n      {...rest}\n    >\n      <ui.div {...(isRounded ? { rounded: \"fallback(full, 9999px)\" } : {})}>\n        {overlays.map((props, index) => (\n          <ui.div\n            key={index}\n            __css={{\n              bottom: 0,\n              left: 0,\n              position: \"absolute\",\n              right: 0,\n              top: 0,\n              ...styles.overlay,\n            }}\n            {...(isRounded ? { rounded: \"fallback(full, 9999px)\" } : {})}\n            {...props}\n          />\n        ))}\n      </ui.div>\n    </ui.div>\n  )\n})\n\nColorSwatch.displayName = \"ColorSwatch\"\nColorSwatch.__ui__ = \"ColorSwatch\"\n"],"mappings":";;;AAMA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,UAAU;AA2HT;AAzHV,IAAM,kBAAkB,CACtB,YACA,eACkB;AAClB,MAAI,WAA0B;AAAA,IAC5B;AAAA,MACE,SACE;AAAA,MACF,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,MAAM;AAAA,QACJ;AAAA,UACE,MAAM;AAAA,UACN,OAAO;AAAA,UACP,OAAO,CAAC,kBAAkB,gBAAgB;AAAA,QAC5C;AAAA,QACA;AAAA,UACE,MAAM;AAAA,UACN,OAAO;AAAA,UACP,OAAO,CAAC,kBAAkB,gBAAgB;AAAA,QAC5C;AAAA,MACF;AAAA,IACF;AAAA,IACA,EAAE,WAAW;AAAA,EACf;AAEA,MAAI;AACF,eAAW;AAAA,MACT,GAAG;AAAA,MACH;AAAA,QACE,WAAW;AAAA,MACb;AAAA,IACF;AAEF,SAAO;AACT;AAqCO,IAAM,cAAc,WAAoC,CAAC,OAAO,QAAQ;AAC7E,QAAM,CAAC,QAAQ,WAAW,IAAI,uBAAuB,eAAe,KAAK;AACzE,QAAM;AAAA,IACJ;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA,aAAa;AAAA,IACb,WAAW,gBAAgB,OAAO,UAAU;AAAA,IAC5C;AAAA,IACA,GAAG;AAAA,EACL,IAAI,eAAe,WAAW;AAE9B,QAAM,MAAmB;AAAA,IACvB,SAAS;AAAA,MACP,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,GAAG;AAAA,MACH,gBAAgB;AAAA,MAChB,MAAM;AAAA,MACN,UAAU;AAAA,MACV,UAAU;AAAA,MACV,OAAO;AAAA,MACP,KAAK;AAAA,MACL,GAAG;AAAA,IACL;AAAA,IACA,UAAU;AAAA,IACV,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,MACT,GAAG;AAAA,MACH,IAAI;AAAA,IACN;AAAA,IACA,GAAG,OAAO;AAAA,IACV,GAAG;AAAA,EACL;AAEA,SACE;AAAA,IAAC,GAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,WAAW,GAAG,mBAAmB,SAAS;AAAA,MAC1C,wBAAqB;AAAA,MACrB,MAAK;AAAA,MACJ,GAAI,YAAY,EAAE,SAAS,yBAAyB,IAAI,CAAC;AAAA,MAC1D,OAAO;AAAA,MACN,GAAG;AAAA,MAEJ,8BAAC,GAAG,KAAH,EAAQ,GAAI,YAAY,EAAE,SAAS,yBAAyB,IAAI,CAAC,GAC/D,mBAAS,IAAI,CAACA,QAAO,UACpB;AAAA,QAAC,GAAG;AAAA,QAAH;AAAA,UAEC,OAAO;AAAA,YACL,QAAQ;AAAA,YACR,MAAM;AAAA,YACN,UAAU;AAAA,YACV,OAAO;AAAA,YACP,KAAK;AAAA,YACL,GAAG,OAAO;AAAA,UACZ;AAAA,UACC,GAAI,YAAY,EAAE,SAAS,yBAAyB,IAAI,CAAC;AAAA,UACzD,GAAGA;AAAA;AAAA,QAVC;AAAA,MAWP,CACD,GACH;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,SAAS;","names":["props"]}

package/dist/{chunk-YPPP72VM.mjs → chunk-RJOBF4LI.mjs}

@@ -1,7 +1,7 @@
 "use client"
 import {
   useColorSelectorContext
-} from "./chunk-X2EYDFTM.mjs";
+} from "./chunk-C7UAG4TH.mjs";
 
 // src/color-selector-channels.tsx
 import { forwardRef, ui } from "@yamada-ui/core";
@@ -65,4 +65,4 @@ export {
   ColorSelectorChannels,
   ColorSelectorChannel
 };
-//# sourceMappingURL=chunk-YPPP72VM.mjs.map
+//# sourceMappingURL=chunk-RJOBF4LI.mjs.map

package/dist/{chunk-CRZIBBBY.mjs → chunk-RW7HCRPR.mjs}

@@ -6,13 +6,13 @@ import {
 } from "./chunk-Z2KAER2U.mjs";
 import {
   ColorSelector
-} from "./chunk-HJMXAALX.mjs";
+} from "./chunk-TED6IK5W.mjs";
 import {
   EyeDropperIcon
-} from "./chunk-DJST5TK2.mjs";
+} from "./chunk-6XIZXZXV.mjs";
 import {
   ColorSwatch
-} from "./chunk-YYXTR7W7.mjs";
+} from "./chunk-OPWYRBSP.mjs";
 
 // src/color-picker.tsx
 import {
@@ -256,4 +256,4 @@ ColorPickerEyeDropper.__ui__ = "ColorPickerEyeDropper";
 export {
   ColorPicker
 };
-//# sourceMappingURL=chunk-CRZIBBBY.mjs.map
+//# sourceMappingURL=chunk-RW7HCRPR.mjs.map

package/dist/{chunk-HJMXAALX.mjs → chunk-TED6IK5W.mjs}

@@ -4,17 +4,17 @@ import {
 } from "./chunk-YU3KOEL7.mjs";
 import {
   ColorSelectorBody
-} from "./chunk-LJHUX2RB.mjs";
+} from "./chunk-XSZZBWND.mjs";
 import {
   ColorSelectorChannels
-} from "./chunk-YPPP72VM.mjs";
+} from "./chunk-RJOBF4LI.mjs";
 import {
   ColorSelectorSwatches
-} from "./chunk-JRSGQRFQ.mjs";
+} from "./chunk-NNVWH4IX.mjs";
 import {
   ColorSelectorProvider,
   useColorSelector
-} from "./chunk-X2EYDFTM.mjs";
+} from "./chunk-C7UAG4TH.mjs";
 
 // src/color-selector.tsx
 import {
@@ -129,4 +129,4 @@ ColorSelector.__ui__ = "ColorSelector";
 export {
   ColorSelector
 };
-//# sourceMappingURL=chunk-HJMXAALX.mjs.map
+//# sourceMappingURL=chunk-TED6IK5W.mjs.map

package/dist/{chunk-HPP26MVU.mjs → chunk-UKR7WWUY.mjs}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-FP3X3PED.mjs";
 import {
   useColorSelectorContext
-} from "./chunk-X2EYDFTM.mjs";
+} from "./chunk-C7UAG4TH.mjs";
 
 // src/color-selector-sliders.tsx
 import { forwardRef, ui } from "@yamada-ui/core";
@@ -66,4 +66,4 @@ ColorSelectorSliders.__ui__ = "ColorSelectorSliders";
 export {
   ColorSelectorSliders
 };
-//# sourceMappingURL=chunk-HPP26MVU.mjs.map
+//# sourceMappingURL=chunk-UKR7WWUY.mjs.map

package/dist/{chunk-LJHUX2RB.mjs → chunk-XSZZBWND.mjs}

@@ -1,16 +1,16 @@
 "use client"
 import {
   ColorSelectorEyeDropper
-} from "./chunk-DJST5TK2.mjs";
+} from "./chunk-6XIZXZXV.mjs";
 import {
   ColorSelectorSliders
-} from "./chunk-HPP26MVU.mjs";
+} from "./chunk-UKR7WWUY.mjs";
 import {
   ColorSwatch
-} from "./chunk-YYXTR7W7.mjs";
+} from "./chunk-OPWYRBSP.mjs";
 import {
   useColorSelectorContext
-} from "./chunk-X2EYDFTM.mjs";
+} from "./chunk-C7UAG4TH.mjs";
 
 // src/color-selector-body.tsx
 import { forwardRef, ui } from "@yamada-ui/core";
@@ -74,4 +74,4 @@ ColorSelectorBody.__ui__ = "ColorSelectorBody";
 export {
   ColorSelectorBody
 };
-//# sourceMappingURL=chunk-LJHUX2RB.mjs.map
+//# sourceMappingURL=chunk-XSZZBWND.mjs.map

package/dist/color-picker.js

@@ -421,6 +421,7 @@ var useColorSelector = ({
       "aria-label": `Select ${color} as the color`,
       disabled,
       readOnly,
+      role: "button",
       ...props2,
       ref,
       color,
@@ -1193,6 +1194,8 @@ var ColorSwatch = (0, import_core5.forwardRef)((props, ref) => {
     {
       ref,
       className: (0, import_utils7.cx)("ui-color-swatch", className),
+      "aria-roledescription": "color swatch",
+      role: "img",
       ...isRounded ? { rounded: "fallback(full, 9999px)" } : {},
       __css: css,
       ...rest,