@yamada-ui/color-picker 2.0.0-next-20240614140233 → 2.0.0-next-20240615233332

package/dist/{chunk-SBN7FEOE.mjs → chunk-PVPQQB6L.mjs}

@@ -99,13 +99,11 @@ var useColorPicker = ({
   });
   const isColorSelectorFull = colorSelectorSize === "full";
   const onOpen = useCallback(() => {
-    if (disabled || readOnly)
-      return;
+    if (disabled || readOnly) return;
     onInternalOpen();
   }, [onInternalOpen, disabled, readOnly]);
   const onClose = useCallback(() => {
-    if (!isOpen)
-      return;
+    if (!isOpen) return;
     const next = convertColor(value, fallbackValue)(formatRef.current);
     setValue((prev) => !next || prev === next ? prev : next);
     setInputValue(formatInput(next != null ? next : ""));
@@ -121,14 +119,12 @@ var useColorPicker = ({
     fallbackValue
   ]);
   const onContainerClick = useCallback(() => {
-    if (isOpen)
-      return;
+    if (isOpen) return;
     onOpen();
   }, [isOpen, onOpen]);
   const onInputFocus = useCallback(() => {
     isInputFocused.current = true;
-    if (isOpen)
-      return;
+    if (isOpen) return;
     onOpen();
   }, [isOpen, onOpen]);
   const onInputBlur = useCallback(() => {
@@ -137,29 +133,23 @@ var useColorPicker = ({
   const onContainerBlur = useCallback(
     (ev) => {
       const relatedTarget = getEventRelatedTarget(ev);
-      if (isContains(containerRef.current, relatedTarget))
-        return;
-      if (!closeOnBlur)
-        return;
-      if (isOpen)
-        onClose();
+      if (isContains(containerRef.current, relatedTarget)) return;
+      if (!closeOnBlur) return;
+      if (isOpen) onClose();
     },
     [closeOnBlur, isOpen, onClose]
   );
   const onInputKeyDown = useCallback(
     (ev) => {
-      if (ev.key === " ")
-        ev.key = ev.code;
-      if (disabled || readOnly)
-        return;
+      if (ev.key === " ") ev.key = ev.code;
+      if (disabled || readOnly) return;
       const actions = {
         Space: !isOpen ? onOpen : void 0,
         Enter: !isOpen ? onOpen : void 0,
         Escape: closeOnEsc ? onClose : void 0
       };
       const action = actions[ev.key];
-      if (!action)
-        return;
+      if (!action) return;
       ev.preventDefault();
       ev.stopPropagation();
       action();
@@ -178,8 +168,7 @@ var useColorPicker = ({
     (value2) => {
       setValue(value2);
       setTimeout(() => {
-        if (!isInputFocused.current)
-          setInputValue(formatInput(value2));
+        if (!isInputFocused.current) setInputValue(formatInput(value2));
       });
     },
     [setValue, formatInput]
@@ -191,8 +180,7 @@ var useColorPicker = ({
       ev.stopPropagation();
       try {
         const { sRGBHex } = (_a2 = await onEyeDropperOpen()) != null ? _a2 : {};
-        if (!sRGBHex)
-          return;
+        if (!sRGBHex) return;
         onColorSelectorChange(sRGBHex);
         onChangeEnd == null ? void 0 : onChangeEnd(sRGBHex);
       } catch {
@@ -206,18 +194,15 @@ var useColorPicker = ({
     enabled: isOpen && closeOnBlur
   });
   useUpdateEffect(() => {
-    if (!format || !value)
-      return;
+    if (!format || !value) return;
     formatRef.current = format;
     const nextValue = convertColor(value, fallbackValue)(format);
-    if (!nextValue)
-      return;
+    if (!nextValue) return;
     setInputValue(formatInput(nextValue));
     setValue(nextValue);
   }, [format]);
   useUpdateEffect(() => {
-    if (isInputFocused.current || !valueProp)
-      return;
+    if (isInputFocused.current || !valueProp) return;
     setInputValue(formatInput(valueProp));
   }, [valueProp]);
   const getPopoverProps = useCallback(
@@ -354,4 +339,4 @@ export {
   useColorPickerContext,
   useColorPicker
 };
-//# sourceMappingURL=chunk-SBN7FEOE.mjs.map
+//# sourceMappingURL=chunk-PVPQQB6L.mjs.map

package/dist/{chunk-SBN7FEOE.mjs.map → chunk-PVPQQB6L.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/use-color-picker.ts"],"sourcesContent":["import { layoutStyleProperties } from \"@yamada-ui/core\"\nimport type {\n  UIPropGetter,\n  CSSUIObject,\n  ThemeProps,\n  HTMLUIProps,\n} from \"@yamada-ui/core\"\nimport {\n  formControlProperties,\n  useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { popoverProperties, type PopoverProps } from \"@yamada-ui/popover\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { useDisclosure } from \"@yamada-ui/use-disclosure\"\nimport { useEyeDropper } from \"@yamada-ui/use-eye-dropper\"\nimport { useOutsideClick } from \"@yamada-ui/use-outside-click\"\nimport type { ColorFormat, Dict } from \"@yamada-ui/utils\"\nimport {\n  createContext,\n  dataAttr,\n  handlerAll,\n  mergeRefs,\n  pickObject,\n  splitObject,\n  omitObject,\n  getEventRelatedTarget,\n  isContains,\n  convertColor,\n  calcFormat,\n  useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, FocusEvent, KeyboardEvent, MouseEvent } from \"react\"\nimport { useCallback, useRef, useState } from \"react\"\nimport type { ColorSelectorProps } from \"./color-selector\"\nimport type { UseColorSelectorBaseProps } from \"./use-color-selector\"\n\ntype ColorSelectorThemeProps = ThemeProps<\"ColorSelector\">\n\ntype ColorPickerContext = { value: string; styles: Record<string, CSSUIObject> }\n\nexport const [ColorPickerProvider, useColorPickerContext] =\n  createContext<ColorPickerContext>({\n    name: \"ColorPickerContext\",\n    errorMessage: `useColorPickerContext returned is 'undefined'. Seems you forgot to wrap the components in \"<ColorPicker />\"`,\n  })\n\ntype UseColorPickerOptions = {\n  /**\n   * The initial value of the color selector.\n   */\n  defaultColor?: string\n  /**\n   * If `true`, allows input.\n   *\n   * @default true\n   */\n  allowInput?: boolean\n  /**\n   * A callback function to format the input entered.\n   */\n  formatInput?: (value: string) => string\n  /**\n   * If `true`, display the result component.\n   *\n   * @default false\n   */\n  withResult?: boolean\n  /**\n   * If `true` display the eye dropper component.\n   *\n   * @default false\n   */\n  withColorSelectorEyeDropper?: boolean\n  /**\n   * If `true`, the color swatch will be closed when value is selected.\n   */\n  closeOnSelectSwatch?: boolean\n  /**\n   * Variant for the color selector component.\n   */\n  colorSelectorVariant?: ColorSelectorThemeProps[\"variant\"]\n  /**\n   * Size for the color selector component.\n   */\n  colorSelectorSize?: ColorSelectorThemeProps[\"size\"]\n  /**\n   * ColorScheme for the color selector component.\n   */\n  colorSelectorColorScheme?: ColorSelectorThemeProps[\"colorScheme\"]\n  /**\n   * Props for color selector component.\n   */\n  colorSelectorProps?: ColorSelectorProps\n}\n\nexport type UseColorPickerProps = Omit<\n  HTMLUIProps<\"input\">,\n  \"size\" | \"offset\" | \"value\" | \"defaultValue\" | \"onChange\" | \"children\"\n> &\n  Omit<UseColorSelectorBaseProps, \"id\" | \"name\"> &\n  Omit<\n    PopoverProps,\n    | \"initialFocusRef\"\n    | \"closeOnButton\"\n    | \"trigger\"\n    | \"autoFocus\"\n    | \"restoreFocus\"\n    | \"openDelay\"\n    | \"closeDelay\"\n    | \"children\"\n  > &\n  Pick<\n    ColorSelectorProps,\n    | \"withPicker\"\n    | \"withChannel\"\n    | \"swatchesLabel\"\n    | \"swatches\"\n    | \"swatchesColumns\"\n  > &\n  UseColorPickerOptions\n\nexport const useColorPicker = ({\n  value: valueProp,\n  defaultValue,\n  fallbackValue,\n  defaultColor,\n  onChange: onChangeProp,\n  onChangeStart,\n  onChangeEnd,\n  onSwatchClick,\n  formatInput = (value) => value,\n  closeOnBlur = true,\n  closeOnEsc = true,\n  placement = \"bottom-start\",\n  duration = 0.2,\n  isOpen: isOpenProp,\n  defaultIsOpen,\n  onOpen: onOpenProp,\n  onClose: onCloseProp,\n  allowInput = true,\n  closeOnSelectSwatch,\n  format,\n  swatchesLabel,\n  swatches,\n  swatchesColumns,\n  withPicker,\n  withChannel,\n  withResult = false,\n  withColorSelectorEyeDropper = false,\n  colorSelectorVariant,\n  colorSelectorSize,\n  colorSelectorColorScheme,\n  ...rest\n}: UseColorPickerProps) => {\n  rest = useFormControlProps(rest)\n\n  const { \"aria-readonly\": _ariaReadonly, ...formControlProps } = pickObject(\n    rest,\n    formControlProperties,\n  )\n  const { disabled, readOnly } = formControlProps\n  const [containerProps, inputProps] = splitObject<Dict, string>(\n    omitObject(rest, [...popoverProperties]),\n    layoutStyleProperties,\n  )\n\n  const containerRef = useRef<HTMLDivElement>(null)\n  const fieldRef = useRef<HTMLInputElement>(null)\n\n  const { supported: eyeDropperSupported, onOpen: onEyeDropperOpen } =\n    useEyeDropper()\n  const [value, setValue] = useControllableState({\n    value: valueProp,\n    defaultValue,\n    onChange: onChangeProp,\n  })\n  const formatRef = useRef<ColorFormat>(\n    format ?? calcFormat(value ?? defaultColor ?? \"\"),\n  )\n  const isInputFocused = useRef<boolean>(false)\n  const [inputValue, setInputValue] = useState<string>(value ?? \"\")\n  const {\n    isOpen,\n    onOpen: onInternalOpen,\n    onClose: onInternalClose,\n  } = useDisclosure({\n    isOpen: isOpenProp,\n    defaultIsOpen,\n    onOpen: onOpenProp,\n    onClose: onCloseProp,\n  })\n  const isColorSelectorFull = colorSelectorSize === \"full\"\n\n  const onOpen = useCallback(() => {\n    if (disabled || readOnly) return\n\n    onInternalOpen()\n  }, [onInternalOpen, disabled, readOnly])\n\n  const onClose = useCallback(() => {\n    if (!isOpen) return\n\n    const next = convertColor(value, fallbackValue)(formatRef.current)\n\n    setValue((prev) => (!next || prev === next ? prev : next))\n    setInputValue(formatInput(next ?? \"\"))\n\n    onInternalClose()\n  }, [\n    formatRef,\n    isOpen,\n    setValue,\n    onInternalClose,\n    value,\n    formatInput,\n    setInputValue,\n    fallbackValue,\n  ])\n\n  const onContainerClick = useCallback(() => {\n    if (isOpen) return\n\n    onOpen()\n  }, [isOpen, onOpen])\n\n  const onInputFocus = useCallback(() => {\n    isInputFocused.current = true\n\n    if (isOpen) return\n\n    onOpen()\n  }, [isOpen, onOpen])\n\n  const onInputBlur = useCallback(() => {\n    isInputFocused.current = false\n  }, [])\n\n  const onContainerBlur = useCallback(\n    (ev: FocusEvent<HTMLDivElement>) => {\n      const relatedTarget = getEventRelatedTarget(ev)\n\n      if (isContains(containerRef.current, relatedTarget)) return\n\n      if (!closeOnBlur) return\n\n      if (isOpen) onClose()\n    },\n    [closeOnBlur, isOpen, onClose],\n  )\n\n  const onInputKeyDown = useCallback(\n    (ev: KeyboardEvent<HTMLInputElement>) => {\n      if (ev.key === \" \") ev.key = ev.code\n\n      if (disabled || readOnly) return\n\n      const actions: Record<string, Function | undefined> = {\n        Space: !isOpen ? onOpen : undefined,\n        Enter: !isOpen ? onOpen : undefined,\n        Escape: closeOnEsc ? onClose : undefined,\n      }\n\n      const action = actions[ev.key]\n\n      if (!action) return\n\n      ev.preventDefault()\n      ev.stopPropagation()\n      action()\n    },\n    [disabled, readOnly, isOpen, onOpen, closeOnEsc, onClose],\n  )\n\n  const onInputChange = useCallback(\n    (ev: ChangeEvent<HTMLInputElement>) => {\n      const value = ev.target.value\n\n      setInputValue(formatInput(value))\n      setValue(value)\n    },\n    [setInputValue, formatInput, setValue],\n  )\n\n  const onColorSelectorChange = useCallback(\n    (value: string) => {\n      setValue(value)\n\n      setTimeout(() => {\n        if (!isInputFocused.current) setInputValue(formatInput(value))\n      })\n    },\n    [setValue, formatInput],\n  )\n\n  const onEyeDropperClick = useCallback(\n    async (ev: MouseEvent<HTMLButtonElement>) => {\n      ev.preventDefault()\n      ev.stopPropagation()\n\n      try {\n        const { sRGBHex } = (await onEyeDropperOpen()) ?? {}\n\n        if (!sRGBHex) return\n\n        onColorSelectorChange(sRGBHex)\n        onChangeEnd?.(sRGBHex)\n      } catch {}\n    },\n    [onEyeDropperOpen, onColorSelectorChange, onChangeEnd],\n  )\n\n  useOutsideClick({\n    ref: containerRef,\n    handler: onClose,\n    enabled: isOpen && closeOnBlur,\n  })\n\n  useUpdateEffect(() => {\n    if (!format || !value) return\n\n    formatRef.current = format\n\n    const nextValue = convertColor(value, fallbackValue)(format)\n\n    if (!nextValue) return\n\n    setInputValue(formatInput(nextValue))\n    setValue(nextValue)\n  }, [format])\n\n  useUpdateEffect(() => {\n    if (isInputFocused.current || !valueProp) return\n\n    setInputValue(formatInput(valueProp))\n  }, [valueProp])\n\n  const getPopoverProps = useCallback(\n    (props?: PopoverProps): PopoverProps => ({\n      matchWidth: isColorSelectorFull,\n      ...rest,\n      ...props,\n      isOpen,\n      onOpen,\n      onClose,\n      placement,\n      duration,\n      trigger: \"never\",\n      closeOnButton: false,\n    }),\n    [isColorSelectorFull, duration, onClose, onOpen, placement, rest, isOpen],\n  )\n\n  const getContainerProps: UIPropGetter = useCallback(\n    (props = {}, ref = null) => ({\n      ref: mergeRefs(containerRef, ref),\n      ...containerProps,\n      ...props,\n      ...formControlProps,\n      onClick: handlerAll(props.onClick, rest.onClick, onContainerClick),\n      onBlur: handlerAll(props.onBlur, rest.onBlur, onContainerBlur),\n    }),\n    [containerProps, formControlProps, onContainerBlur, onContainerClick, rest],\n  )\n\n  const getFieldProps: UIPropGetter<\"input\"> = useCallback(\n    (props = {}, ref = null) => ({\n      ref: mergeRefs(fieldRef, ref),\n      tabIndex: !allowInput ? -1 : 0,\n      ...inputProps,\n      ...props,\n      style: {\n        ...props.style,\n        ...(!allowInput ? { pointerEvents: \"none\" } : {}),\n      },\n      value: inputValue,\n      \"data-active\": dataAttr(isOpen),\n      \"aria-expanded\": dataAttr(isOpen),\n      onFocus: handlerAll(props.onFocus, rest.onFocus, onInputFocus),\n      onKeyDown: handlerAll(props.onKeyDown, rest.onKeyDown, onInputKeyDown),\n      onChange: handlerAll(props.onChange, onInputChange),\n      onBlur: handlerAll(props.onFocus, onInputBlur),\n    }),\n    [\n      allowInput,\n      inputProps,\n      inputValue,\n      isOpen,\n      rest,\n      onInputFocus,\n      onInputKeyDown,\n      onInputChange,\n      onInputBlur,\n    ],\n  )\n\n  const getEyeDropperProps: UIPropGetter<\"button\"> = useCallback(\n    (props = {}, ref = null) => ({\n      disabled,\n      \"aria-label\": \"Pick a color\",\n      ...props,\n      ref,\n      style: { ...props.style, pointerEvents: readOnly ? \"none\" : undefined },\n      onClick: handlerAll(props.onClick, onEyeDropperClick),\n    }),\n    [disabled, onEyeDropperClick, readOnly],\n  )\n\n  const getSelectorProps = useCallback(\n    (props?: ColorSelectorProps): ColorSelectorProps => ({\n      ...formControlProps,\n      ...props,\n      value,\n      defaultValue: defaultColor,\n      fallbackValue,\n      onChange: onColorSelectorChange,\n      onChangeStart,\n      onChangeEnd,\n      onSwatchClick: handlerAll(\n        onSwatchClick,\n        closeOnSelectSwatch ? onClose : undefined,\n      ),\n      format: formatRef.current,\n      withPicker,\n      withChannel,\n      withResult,\n      withEyeDropper: withColorSelectorEyeDropper,\n      swatchesLabel,\n      swatches,\n      swatchesColumns,\n      variant: colorSelectorVariant,\n      size: colorSelectorSize,\n      colorScheme: colorSelectorColorScheme,\n    }),\n    [\n      formControlProps,\n      value,\n      fallbackValue,\n      defaultColor,\n      onColorSelectorChange,\n      onChangeStart,\n      onChangeEnd,\n      onSwatchClick,\n      onClose,\n      closeOnSelectSwatch,\n      formatRef,\n      withPicker,\n      withChannel,\n      withResult,\n      withColorSelectorEyeDropper,\n      swatchesLabel,\n      swatches,\n      swatchesColumns,\n      colorSelectorColorScheme,\n      colorSelectorSize,\n      colorSelectorVariant,\n    ],\n  )\n\n  return {\n    value,\n    eyeDropperSupported,\n    allowInput,\n    getPopoverProps,\n    getContainerProps,\n    getFieldProps,\n    getSelectorProps,\n    getEyeDropperProps,\n  }\n}\n\nexport type UseColorPickerReturn = ReturnType<typeof useColorPicker>\n"],"mappings":"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","names":["value","_a"]}
+{"version":3,"sources":["../src/use-color-picker.ts"],"sourcesContent":["import { layoutStyleProperties } from \"@yamada-ui/core\"\nimport type {\n  UIPropGetter,\n  CSSUIObject,\n  ThemeProps,\n  HTMLUIProps,\n} from \"@yamada-ui/core\"\nimport {\n  formControlProperties,\n  useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { popoverProperties, type PopoverProps } from \"@yamada-ui/popover\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { useDisclosure } from \"@yamada-ui/use-disclosure\"\nimport { useEyeDropper } from \"@yamada-ui/use-eye-dropper\"\nimport { useOutsideClick } from \"@yamada-ui/use-outside-click\"\nimport type { ColorFormat, Dict } from \"@yamada-ui/utils\"\nimport {\n  createContext,\n  dataAttr,\n  handlerAll,\n  mergeRefs,\n  pickObject,\n  splitObject,\n  omitObject,\n  getEventRelatedTarget,\n  isContains,\n  convertColor,\n  calcFormat,\n  useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, FocusEvent, KeyboardEvent, MouseEvent } from \"react\"\nimport { useCallback, useRef, useState } from \"react\"\nimport type { ColorSelectorProps } from \"./color-selector\"\nimport type { UseColorSelectorBaseProps } from \"./use-color-selector\"\n\ntype ColorSelectorThemeProps = ThemeProps<\"ColorSelector\">\n\ntype ColorPickerContext = { value: string; styles: Record<string, CSSUIObject> }\n\nexport const [ColorPickerProvider, useColorPickerContext] =\n  createContext<ColorPickerContext>({\n    name: \"ColorPickerContext\",\n    errorMessage: `useColorPickerContext returned is 'undefined'. Seems you forgot to wrap the components in \"<ColorPicker />\"`,\n  })\n\ntype UseColorPickerOptions = {\n  /**\n   * The initial value of the color selector.\n   */\n  defaultColor?: string\n  /**\n   * If `true`, allows input.\n   *\n   * @default true\n   */\n  allowInput?: boolean\n  /**\n   * A callback function to format the input entered.\n   */\n  formatInput?: (value: string) => string\n  /**\n   * If `true`, display the result component.\n   *\n   * @default false\n   */\n  withResult?: boolean\n  /**\n   * If `true` display the eye dropper component.\n   *\n   * @default false\n   */\n  withColorSelectorEyeDropper?: boolean\n  /**\n   * If `true`, the color swatch will be closed when value is selected.\n   */\n  closeOnSelectSwatch?: boolean\n  /**\n   * Variant for the color selector component.\n   */\n  colorSelectorVariant?: ColorSelectorThemeProps[\"variant\"]\n  /**\n   * Size for the color selector component.\n   */\n  colorSelectorSize?: ColorSelectorThemeProps[\"size\"]\n  /**\n   * ColorScheme for the color selector component.\n   */\n  colorSelectorColorScheme?: ColorSelectorThemeProps[\"colorScheme\"]\n  /**\n   * Props for color selector component.\n   */\n  colorSelectorProps?: ColorSelectorProps\n}\n\nexport type UseColorPickerProps = Omit<\n  HTMLUIProps<\"input\">,\n  \"size\" | \"offset\" | \"value\" | \"defaultValue\" | \"onChange\" | \"children\"\n> &\n  Omit<UseColorSelectorBaseProps, \"id\" | \"name\"> &\n  Omit<\n    PopoverProps,\n    | \"initialFocusRef\"\n    | \"closeOnButton\"\n    | \"trigger\"\n    | \"autoFocus\"\n    | \"restoreFocus\"\n    | \"openDelay\"\n    | \"closeDelay\"\n    | \"children\"\n  > &\n  Pick<\n    ColorSelectorProps,\n    | \"withPicker\"\n    | \"withChannel\"\n    | \"swatchesLabel\"\n    | \"swatches\"\n    | \"swatchesColumns\"\n  > &\n  UseColorPickerOptions\n\nexport const useColorPicker = ({\n  value: valueProp,\n  defaultValue,\n  fallbackValue,\n  defaultColor,\n  onChange: onChangeProp,\n  onChangeStart,\n  onChangeEnd,\n  onSwatchClick,\n  formatInput = (value) => value,\n  closeOnBlur = true,\n  closeOnEsc = true,\n  placement = \"bottom-start\",\n  duration = 0.2,\n  isOpen: isOpenProp,\n  defaultIsOpen,\n  onOpen: onOpenProp,\n  onClose: onCloseProp,\n  allowInput = true,\n  closeOnSelectSwatch,\n  format,\n  swatchesLabel,\n  swatches,\n  swatchesColumns,\n  withPicker,\n  withChannel,\n  withResult = false,\n  withColorSelectorEyeDropper = false,\n  colorSelectorVariant,\n  colorSelectorSize,\n  colorSelectorColorScheme,\n  ...rest\n}: UseColorPickerProps) => {\n  rest = useFormControlProps(rest)\n\n  const { \"aria-readonly\": _ariaReadonly, ...formControlProps } = pickObject(\n    rest,\n    formControlProperties,\n  )\n  const { disabled, readOnly } = formControlProps\n  const [containerProps, inputProps] = splitObject<Dict, string>(\n    omitObject(rest, [...popoverProperties]),\n    layoutStyleProperties,\n  )\n\n  const containerRef = useRef<HTMLDivElement>(null)\n  const fieldRef = useRef<HTMLInputElement>(null)\n\n  const { supported: eyeDropperSupported, onOpen: onEyeDropperOpen } =\n    useEyeDropper()\n  const [value, setValue] = useControllableState({\n    value: valueProp,\n    defaultValue,\n    onChange: onChangeProp,\n  })\n  const formatRef = useRef<ColorFormat>(\n    format ?? calcFormat(value ?? defaultColor ?? \"\"),\n  )\n  const isInputFocused = useRef<boolean>(false)\n  const [inputValue, setInputValue] = useState<string>(value ?? \"\")\n  const {\n    isOpen,\n    onOpen: onInternalOpen,\n    onClose: onInternalClose,\n  } = useDisclosure({\n    isOpen: isOpenProp,\n    defaultIsOpen,\n    onOpen: onOpenProp,\n    onClose: onCloseProp,\n  })\n  const isColorSelectorFull = colorSelectorSize === \"full\"\n\n  const onOpen = useCallback(() => {\n    if (disabled || readOnly) return\n\n    onInternalOpen()\n  }, [onInternalOpen, disabled, readOnly])\n\n  const onClose = useCallback(() => {\n    if (!isOpen) return\n\n    const next = convertColor(value, fallbackValue)(formatRef.current)\n\n    setValue((prev) => (!next || prev === next ? prev : next))\n    setInputValue(formatInput(next ?? \"\"))\n\n    onInternalClose()\n  }, [\n    formatRef,\n    isOpen,\n    setValue,\n    onInternalClose,\n    value,\n    formatInput,\n    setInputValue,\n    fallbackValue,\n  ])\n\n  const onContainerClick = useCallback(() => {\n    if (isOpen) return\n\n    onOpen()\n  }, [isOpen, onOpen])\n\n  const onInputFocus = useCallback(() => {\n    isInputFocused.current = true\n\n    if (isOpen) return\n\n    onOpen()\n  }, [isOpen, onOpen])\n\n  const onInputBlur = useCallback(() => {\n    isInputFocused.current = false\n  }, [])\n\n  const onContainerBlur = useCallback(\n    (ev: FocusEvent<HTMLDivElement>) => {\n      const relatedTarget = getEventRelatedTarget(ev)\n\n      if (isContains(containerRef.current, relatedTarget)) return\n\n      if (!closeOnBlur) return\n\n      if (isOpen) onClose()\n    },\n    [closeOnBlur, isOpen, onClose],\n  )\n\n  const onInputKeyDown = useCallback(\n    (ev: KeyboardEvent<HTMLInputElement>) => {\n      if (ev.key === \" \") ev.key = ev.code\n\n      if (disabled || readOnly) return\n\n      const actions: Record<string, Function | undefined> = {\n        Space: !isOpen ? onOpen : undefined,\n        Enter: !isOpen ? onOpen : undefined,\n        Escape: closeOnEsc ? onClose : undefined,\n      }\n\n      const action = actions[ev.key]\n\n      if (!action) return\n\n      ev.preventDefault()\n      ev.stopPropagation()\n      action()\n    },\n    [disabled, readOnly, isOpen, onOpen, closeOnEsc, onClose],\n  )\n\n  const onInputChange = useCallback(\n    (ev: ChangeEvent<HTMLInputElement>) => {\n      const value = ev.target.value\n\n      setInputValue(formatInput(value))\n      setValue(value)\n    },\n    [setInputValue, formatInput, setValue],\n  )\n\n  const onColorSelectorChange = useCallback(\n    (value: string) => {\n      setValue(value)\n\n      setTimeout(() => {\n        if (!isInputFocused.current) setInputValue(formatInput(value))\n      })\n    },\n    [setValue, formatInput],\n  )\n\n  const onEyeDropperClick = useCallback(\n    async (ev: MouseEvent<HTMLButtonElement>) => {\n      ev.preventDefault()\n      ev.stopPropagation()\n\n      try {\n        const { sRGBHex } = (await onEyeDropperOpen()) ?? {}\n\n        if (!sRGBHex) return\n\n        onColorSelectorChange(sRGBHex)\n        onChangeEnd?.(sRGBHex)\n      } catch {}\n    },\n    [onEyeDropperOpen, onColorSelectorChange, onChangeEnd],\n  )\n\n  useOutsideClick({\n    ref: containerRef,\n    handler: onClose,\n    enabled: isOpen && closeOnBlur,\n  })\n\n  useUpdateEffect(() => {\n    if (!format || !value) return\n\n    formatRef.current = format\n\n    const nextValue = convertColor(value, fallbackValue)(format)\n\n    if (!nextValue) return\n\n    setInputValue(formatInput(nextValue))\n    setValue(nextValue)\n  }, [format])\n\n  useUpdateEffect(() => {\n    if (isInputFocused.current || !valueProp) return\n\n    setInputValue(formatInput(valueProp))\n  }, [valueProp])\n\n  const getPopoverProps = useCallback(\n    (props?: PopoverProps): PopoverProps => ({\n      matchWidth: isColorSelectorFull,\n      ...rest,\n      ...props,\n      isOpen,\n      onOpen,\n      onClose,\n      placement,\n      duration,\n      trigger: \"never\",\n      closeOnButton: false,\n    }),\n    [isColorSelectorFull, duration, onClose, onOpen, placement, rest, isOpen],\n  )\n\n  const getContainerProps: UIPropGetter = useCallback(\n    (props = {}, ref = null) => ({\n      ref: mergeRefs(containerRef, ref),\n      ...containerProps,\n      ...props,\n      ...formControlProps,\n      onClick: handlerAll(props.onClick, rest.onClick, onContainerClick),\n      onBlur: handlerAll(props.onBlur, rest.onBlur, onContainerBlur),\n    }),\n    [containerProps, formControlProps, onContainerBlur, onContainerClick, rest],\n  )\n\n  const getFieldProps: UIPropGetter<\"input\"> = useCallback(\n    (props = {}, ref = null) => ({\n      ref: mergeRefs(fieldRef, ref),\n      tabIndex: !allowInput ? -1 : 0,\n      ...inputProps,\n      ...props,\n      style: {\n        ...props.style,\n        ...(!allowInput ? { pointerEvents: \"none\" } : {}),\n      },\n      value: inputValue,\n      \"data-active\": dataAttr(isOpen),\n      \"aria-expanded\": dataAttr(isOpen),\n      onFocus: handlerAll(props.onFocus, rest.onFocus, onInputFocus),\n      onKeyDown: handlerAll(props.onKeyDown, rest.onKeyDown, onInputKeyDown),\n      onChange: handlerAll(props.onChange, onInputChange),\n      onBlur: handlerAll(props.onFocus, onInputBlur),\n    }),\n    [\n      allowInput,\n      inputProps,\n      inputValue,\n      isOpen,\n      rest,\n      onInputFocus,\n      onInputKeyDown,\n      onInputChange,\n      onInputBlur,\n    ],\n  )\n\n  const getEyeDropperProps: UIPropGetter<\"button\"> = useCallback(\n    (props = {}, ref = null) => ({\n      disabled,\n      \"aria-label\": \"Pick a color\",\n      ...props,\n      ref,\n      style: { ...props.style, pointerEvents: readOnly ? \"none\" : undefined },\n      onClick: handlerAll(props.onClick, onEyeDropperClick),\n    }),\n    [disabled, onEyeDropperClick, readOnly],\n  )\n\n  const getSelectorProps = useCallback(\n    (props?: ColorSelectorProps): ColorSelectorProps => ({\n      ...formControlProps,\n      ...props,\n      value,\n      defaultValue: defaultColor,\n      fallbackValue,\n      onChange: onColorSelectorChange,\n      onChangeStart,\n      onChangeEnd,\n      onSwatchClick: handlerAll(\n        onSwatchClick,\n        closeOnSelectSwatch ? onClose : undefined,\n      ),\n      format: formatRef.current,\n      withPicker,\n      withChannel,\n      withResult,\n      withEyeDropper: withColorSelectorEyeDropper,\n      swatchesLabel,\n      swatches,\n      swatchesColumns,\n      variant: colorSelectorVariant,\n      size: colorSelectorSize,\n      colorScheme: colorSelectorColorScheme,\n    }),\n    [\n      formControlProps,\n      value,\n      fallbackValue,\n      defaultColor,\n      onColorSelectorChange,\n      onChangeStart,\n      onChangeEnd,\n      onSwatchClick,\n      onClose,\n      closeOnSelectSwatch,\n      formatRef,\n      withPicker,\n      withChannel,\n      withResult,\n      withColorSelectorEyeDropper,\n      swatchesLabel,\n      swatches,\n      swatchesColumns,\n      colorSelectorColorScheme,\n      colorSelectorSize,\n      colorSelectorVariant,\n    ],\n  )\n\n  return {\n    value,\n    eyeDropperSupported,\n    allowInput,\n    getPopoverProps,\n    getContainerProps,\n    getFieldProps,\n    getSelectorProps,\n    getEyeDropperProps,\n  }\n}\n\nexport type UseColorPickerReturn = ReturnType<typeof useColorPicker>\n"],"mappings":"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","names":["value","_a"]}

package/dist/{chunk-YE3Z2X2L.mjs → chunk-RWVTJOMP.mjs}

@@ -1,16 +1,16 @@
 "use client"
 import {
   ColorSelectorEyeDropper
-} from "./chunk-6CYIIW6Z.mjs";
+} from "./chunk-MXH5UN5E.mjs";
 import {
   ColorSelectorSliders
-} from "./chunk-NJEVZQVF.mjs";
+} from "./chunk-YPW3ZJM7.mjs";
 import {
   ColorSwatch
 } from "./chunk-WHGFYZII.mjs";
 import {
   useColorSelectorContext
-} from "./chunk-5QT7SRA4.mjs";
+} from "./chunk-UZQ2UORY.mjs";
 
 // src/color-selector-body.tsx
 import { forwardRef, ui } from "@yamada-ui/core";
@@ -70,4 +70,4 @@ var ColorSelectorBody = forwardRef(
 export {
   ColorSelectorBody
 };
-//# sourceMappingURL=chunk-YE3Z2X2L.mjs.map
+//# sourceMappingURL=chunk-RWVTJOMP.mjs.map

package/dist/{chunk-5QT7SRA4.mjs → chunk-UZQ2UORY.mjs}

@@ -28,21 +28,16 @@ import { useCallback, useMemo, useRef, useState } from "react";
 var convertHsla = (value, fallback) => {
   var _a;
   let [h, s, l, a] = (_a = parseToHsla(value, fallback)) != null ? _a : [0, 0, 1, 1];
-  if (a > 1)
-    a = 1;
+  if (a > 1) a = 1;
   return { h, s, l, a };
 };
 var convertRgba = (value, fallback) => {
   var _a;
   let [r, g, b, a] = (_a = parseToRgba(value, fallback)) != null ? _a : [255, 255, 255, 1];
-  if (r > 255)
-    r = 255;
-  if (g > 255)
-    g = 255;
-  if (b > 255)
-    b = 255;
-  if (a > 1)
-    a = 1;
+  if (r > 255) r = 255;
+  if (g > 255) g = 255;
+  if (b > 255) b = 255;
+  if (a > 1) a = 1;
   return { r, g, b, a };
 };
 var convertHsva = (value, fallback) => {
@@ -162,8 +157,7 @@ var useColorSelector = ({
       isDraggingRef.current = true;
       const { h: h2, s: s2, v: v2, a: a2 } = { ...parsedValue, ...value2 };
       const nextValue = hsvTo([h2, s2, v2, a2], fallbackValue)(formatRef.current);
-      if (nextValue)
-        onChangeStartRef(nextValue);
+      if (nextValue) onChangeStartRef(nextValue);
     },
     [formatRef, onChangeStartRef, fallbackValue, parsedValue]
   );
@@ -180,18 +174,15 @@ var useColorSelector = ({
         const { h: h2, s: s2, v: v2, a: a2 } = { ...parsedValue, ...value2 };
         nextValue = hsvTo([h2, s2, v2, a2], fallbackValue)(formatRef.current);
       }
-      if (nextValue)
-        onChangeEndRef(nextValue);
+      if (nextValue) onChangeEndRef(nextValue);
     },
     [formatRef, onChangeEndRef, fallbackValue, parsedValue]
   );
   const onChannelChange = useCallback(
     (ev, space) => {
       let n = Math.floor(parseFloat(ev.target.value));
-      if (isNaN(n))
-        n = 0;
-      if (["s", "l", "a"].includes(space))
-        n = n / 100;
+      if (isNaN(n)) n = 0;
+      if (["s", "l", "a"].includes(space)) n = n / 100;
       let nextValue;
       if (resolvedValue.startsWith("hsl")) {
         const { h: h2, s: s2, l, a: a2 } = Object.assign(
@@ -206,8 +197,7 @@ var useColorSelector = ({
         );
         nextValue = rgbaTo([r, g, b, a2], fallbackValue)(formatRef.current);
       }
-      if (!nextValue)
-        return;
+      if (!nextValue) return;
       onChange(nextValue);
       onChangeEnd(nextValue);
     },
@@ -217,8 +207,7 @@ var useColorSelector = ({
     var _a;
     try {
       const { sRGBHex } = (_a = await onOpen()) != null ? _a : {};
-      if (!sRGBHex)
-        return;
+      if (!sRGBHex) return;
       onChange(sRGBHex);
       onChangeEnd(sRGBHex);
     } catch {
@@ -226,22 +215,17 @@ var useColorSelector = ({
   }, [onOpen, onChange, onChangeEnd]);
   useUpdateEffect(() => {
     const nextValue = hsvTo([h, s, v, a], fallbackValue)(formatRef.current);
-    if (nextValue)
-      setValue(nextValue);
+    if (nextValue) setValue(nextValue);
   }, [h, s, v, a]);
   useUpdateEffect(() => {
-    if (isDraggingRef.current)
-      return;
-    if (valueProp)
-      setParsedValue(convertHsva(valueProp, fallbackValue));
+    if (isDraggingRef.current) return;
+    if (valueProp) setParsedValue(convertHsva(valueProp, fallbackValue));
   }, [valueProp]);
   useUpdateEffect(() => {
-    if (!format || !value)
-      return;
+    if (!format || !value) return;
     formatRef.current = format;
     const nextValue = convertColor(value, fallbackValue)(format);
-    if (nextValue)
-      setValue(nextValue);
+    if (nextValue) setValue(nextValue);
   }, [format]);
   const getContainerProps = (props2 = {}, ref = null) => ({
     ...props2,
@@ -393,8 +377,7 @@ var useColorSelector = ({
       ref,
       color,
       onClick: handlerAll(props2.onClick, () => {
-        if (!color)
-          return;
+        if (!color) return;
         onSwatchClick == null ? void 0 : onSwatchClick(color);
         onChange(color);
         onChangeEnd(color);
@@ -427,4 +410,4 @@ export {
   useColorSelectorContext,
   useColorSelector
 };
-//# sourceMappingURL=chunk-5QT7SRA4.mjs.map
+//# sourceMappingURL=chunk-UZQ2UORY.mjs.map

package/dist/{chunk-5QT7SRA4.mjs.map → chunk-UZQ2UORY.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/use-color-selector.ts"],"sourcesContent":["import type {\n  CSSUIObject,\n  HTMLUIProps,\n  UIPropGetter,\n  ThemeProps,\n  RequiredUIPropGetter,\n} from \"@yamada-ui/core\"\nimport {\n  useFormControlProps,\n  type FormControlOptions,\n  formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { InputProps } from \"@yamada-ui/input\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { useEyeDropper } from \"@yamada-ui/use-eye-dropper\"\nimport type { ColorFormat, Dict, Merge } from \"@yamada-ui/utils\"\nimport {\n  calcFormat,\n  convertColor,\n  createContext,\n  handlerAll,\n  hsvTo,\n  isString,\n  parseToHsv,\n  useCallbackRef,\n  useUpdateEffect,\n  omitObject,\n  parseToRgba,\n  parseToHsla,\n  rgbaTo,\n  hslaTo,\n  pickObject,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent } from \"react\"\nimport { useCallback, useMemo, useRef, useState } 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\"\n\ntype Space = keyof Hsla | keyof Rgba\ntype Hsla = { h: number; s: number; l: number; a: number }\ntype Rgba = { r: number; g: number; b: number; a: number }\ntype Hsva = { h: number; s: number; v: number; a: number }\ntype Channel = {\n  label: string\n  space: Space\n  value: number\n  min: number\n  max: 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 { h, s, l, a }\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 { r, g, b, a }\n}\n\nconst convertHsva = (value: string, fallback?: string): Hsva => {\n  const [h, s, v, a] = parseToHsv(value, fallback)\n\n  return { h, s, v, a }\n}\n\ntype ColorSelectorContext = {\n  value: string\n  onChange: (value: string | Partial<Hsva>) => void\n  eyeDropperSupported: boolean\n  withAlpha: boolean\n  isInteractive: boolean\n  disabled?: boolean\n  readOnly?: boolean\n  channels: Channel[]\n  size?: ThemeProps<\"ColorSelector\">[\"size\"]\n  getHueSliderProps: UIPropGetter<\"input\", HueSliderProps, HueSliderProps>\n  getAlphaSliderProps: UIPropGetter<\"input\", AlphaSliderProps, AlphaSliderProps>\n  getEyeDropperProps: UIPropGetter<\"button\">\n  getChannelProps: RequiredUIPropGetter<\n    \"input\",\n    Merge<InputProps, { space: Space }>,\n    InputProps\n  >\n  getSwatchProps: UIPropGetter<\"div\", ColorSwatchProps, ColorSwatchProps>\n  styles: Record<string, CSSUIObject>\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\ntype 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 value of the color selector.\n   */\n  value?: 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   * Function called whenever the color selector value changes.\n   */\n  onChange?: (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 when the user is done selecting a new value.\n   */\n  onChangeEnd?: (value: string) => void\n  /**\n   * Color format. For example, `hex`, `rgba`, etc.\n   *\n   * @default \"hexa\"\n   */\n  format?: ColorFormat\n  /**\n   * Function called whenever the color swatch click.\n   */\n  onSwatchClick?: (value: string) => void\n}\n\nexport type UseColorSelectorBaseProps = UseColorSelectorOptions &\n  FormControlOptions\n\nexport type UseColorSelectorProps = Omit<\n  HTMLUIProps<\"div\">,\n  \"defaultValue\" | \"onChange\" | \"children\"\n> &\n  UseColorSelectorBaseProps\n\nexport const useColorSelector = ({\n  isInvalid,\n  ...props\n}: UseColorSelectorProps) => {\n  let {\n    id,\n    name,\n    value: valueProp,\n    defaultValue,\n    fallbackValue,\n    onChange: onChangeProp,\n    onChangeStart: onChangeStartProp,\n    onChangeEnd: onChangeEndProp,\n    format,\n    required,\n    disabled,\n    readOnly,\n    onSwatchClick,\n    ...rest\n  } = useFormControlProps({ isInvalid, ...props })\n\n  const onChangeStartRef = useCallbackRef(onChangeStartProp)\n  const onChangeEndRef = useCallbackRef(onChangeEndProp)\n  const { supported: eyeDropperSupported, onOpen } = useEyeDropper()\n  const [value, setValue] = useControllableState({\n    value: valueProp,\n    defaultValue: defaultValue ?? fallbackValue,\n    onChange: onChangeProp,\n  })\n  const resolvedValue = value ?? \"#ffffff\"\n  const timeoutId = useRef<any>(undefined)\n  const formatRef = useRef<ColorFormat>(format ?? calcFormat(resolvedValue))\n  const isDraggingRef = useRef<boolean>(false)\n  const [parsedValue, setParsedValue] = useState<Hsva>(\n    convertHsva(resolvedValue, fallbackValue),\n  )\n  const { h, s, v, a } = parsedValue\n  const withAlpha = formatRef.current.endsWith(\"a\")\n  const isInteractive = !(disabled || readOnly)\n\n  const channels: Channel[] = useMemo(() => {\n    if (resolvedValue.startsWith(\"hsl\")) {\n      const { h, s, l, a } = convertHsla(resolvedValue, fallbackValue)\n\n      let channels: Channel[] = [\n        { label: \"H\", space: \"h\", value: Math.round(h), min: 0, max: 360 },\n        {\n          label: \"S(%)\",\n          space: \"s\",\n          value: Math.round(s * 100),\n          min: 0,\n          max: 100,\n        },\n        {\n          label: \"L(%)\",\n          space: \"l\",\n          value: Math.round(l * 100),\n          min: 0,\n          max: 100,\n        },\n      ]\n\n      if (withAlpha) {\n        channels = [\n          ...channels,\n          {\n            label: \"A(%)\",\n            space: \"a\",\n            value: Math.round(a * 100),\n            min: 0,\n            max: 100,\n          },\n        ]\n      }\n\n      return channels\n    } else {\n      const { r, g, b, a } = convertRgba(resolvedValue, fallbackValue)\n\n      let channels: Channel[] = [\n        { label: \"R\", space: \"r\", value: Math.round(r), min: 0, max: 255 },\n        { label: \"G\", space: \"g\", value: Math.round(g), min: 0, max: 255 },\n        { label: \"B\", space: \"b\", value: Math.round(b), min: 0, max: 255 },\n      ]\n\n      if (withAlpha) {\n        channels = [\n          ...channels,\n          {\n            label: \"A(%)\",\n            space: \"a\",\n            value: Math.round(a * 100),\n            min: 0,\n            max: 100,\n          },\n        ]\n      }\n\n      return channels\n    }\n  }, [resolvedValue, withAlpha, fallbackValue])\n\n  const onChange = useCallback(\n    (value: string | Partial<Hsva>) => {\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 { h, s, v, a } = { ...parsedValue, ...value }\n\n      const nextValue = hsvTo([h, s, v, a], fallbackValue)(formatRef.current)\n\n      if (nextValue) onChangeStartRef(nextValue)\n    },\n    [formatRef, onChangeStartRef, fallbackValue, parsedValue],\n  )\n\n  const onChangeEnd = useCallback(\n    (value: string | Partial<Hsva>) => {\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)(formatRef.current)\n      } else {\n        const { h, s, v, a } = { ...parsedValue, ...value }\n\n        nextValue = hsvTo([h, s, v, a], fallbackValue)(formatRef.current)\n      }\n\n      if (nextValue) onChangeEndRef(nextValue)\n    },\n    [formatRef, onChangeEndRef, fallbackValue, parsedValue],\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 ([\"s\", \"l\", \"a\"].includes(space)) n = n / 100\n\n      let nextValue: string | undefined\n\n      if (resolvedValue.startsWith(\"hsl\")) {\n        const { h, s, l, a } = Object.assign(\n          convertHsla(resolvedValue, fallbackValue),\n          { [space]: n },\n        )\n\n        nextValue = hslaTo([h, s, l, a], fallbackValue)(formatRef.current)\n      } else {\n        const { r, g, b, a } = Object.assign(\n          convertRgba(resolvedValue, fallbackValue),\n          { [space]: n },\n        )\n\n        nextValue = rgbaTo([r, g, b, a], fallbackValue)(formatRef.current)\n      }\n\n      if (!nextValue) return\n\n      onChange(nextValue)\n      onChangeEnd(nextValue)\n    },\n    [resolvedValue, onChange, onChangeEnd, formatRef, fallbackValue],\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)(formatRef.current)\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 (!format || !value) return\n\n    formatRef.current = format\n\n    const nextValue = convertColor(value, fallbackValue)(format)\n\n    if (nextValue) setValue(nextValue)\n  }, [format])\n\n  const getContainerProps: UIPropGetter = (props = {}, ref = null) => ({\n    ...props,\n    ref,\n    ...omitObject(rest, [\"aria-readonly\"]),\n  })\n\n  const getInputProps: UIPropGetter<\"input\"> = useCallback(\n    (props = {}, ref = null) => ({\n      ...pickObject(rest, formControlProperties),\n      ...props,\n      id,\n      ref,\n      type: \"hidden\",\n      name,\n      value: resolvedValue,\n      required,\n      disabled,\n      readOnly,\n    }),\n    [disabled, id, name, readOnly, required, rest, resolvedValue],\n  )\n\n  const getSaturationSliderProps: UIPropGetter<\n    \"input\",\n    SaturationSliderProps,\n    SaturationSliderProps\n  > = useCallback(\n    (props = {}, ref = null) => ({\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      ...props,\n      ref,\n      value: [h, s, v],\n      onChange: handlerAll(props.onChange, ([, s, v]) => onChange({ s, v })),\n      onChangeStart: handlerAll(props.onChangeStart, ([, s, v]) =>\n        onChangeStart({ s, v }),\n      ),\n      onChangeEnd: handlerAll(props.onChangeEnd, ([, s, v]) =>\n        onChangeEnd({ 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: UIPropGetter<\n    \"input\",\n    HueSliderProps,\n    HueSliderProps\n  > = useCallback(\n    (props = {}, ref = null) => ({\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      ...props,\n      ref,\n      value: h,\n      onChange: handlerAll(props.onChange, (h) => onChange({ h })),\n      onChangeStart: handlerAll(props.onChangeStart, (h) =>\n        onChangeStart({ h }),\n      ),\n      onChangeEnd: handlerAll(props.onChangeEnd, (h) => onChangeEnd({ h })),\n    }),\n    [\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      h,\n      onChange,\n      onChangeStart,\n      onChangeEnd,\n    ],\n  )\n\n  const getAlphaSliderProps: UIPropGetter<\n    \"input\",\n    AlphaSliderProps,\n    AlphaSliderProps\n  > = useCallback(\n    (props = {}, ref = null) => ({\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      ...props,\n      ref,\n      value: a,\n      color: hsvTo([h, s, v, a], fallbackValue)(formatRef.current),\n      onChange: handlerAll(props.onChange, (a) => onChange({ a })),\n      onChangeStart: handlerAll(props.onChangeStart, (a) =>\n        onChangeStart({ a }),\n      ),\n      onChangeEnd: handlerAll(props.onChangeEnd, (a) => onChangeEnd({ a })),\n    }),\n    [\n      fallbackValue,\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      formatRef,\n      h,\n      s,\n      v,\n      a,\n      onChange,\n      onChangeStart,\n      onChangeEnd,\n    ],\n  )\n\n  const getChannelProps: RequiredUIPropGetter<\n    \"input\",\n    Merge<InputProps, { space: Space }>,\n    InputProps\n  > = useCallback(\n    ({ space, ...props }, ref = null) => {\n      return {\n        required,\n        disabled,\n        readOnly,\n        isInvalid,\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: UIPropGetter<\"button\"> = useCallback(\n    (props = {}, ref = null) => ({\n      disabled,\n      \"aria-label\": \"Pick a color\",\n      ...props,\n      ref,\n      onClick: handlerAll(props.onClick, onEyeDropperClick),\n    }),\n    [disabled, onEyeDropperClick],\n  )\n\n  const getSwatchProps: UIPropGetter<\n    \"div\",\n    ColorSwatchProps,\n    ColorSwatchProps\n  > = 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 (!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    value: resolvedValue,\n    onChange,\n    eyeDropperSupported,\n    withAlpha,\n    isInteractive,\n    disabled,\n    readOnly,\n    channels,\n    getContainerProps,\n    getInputProps,\n    getSaturationSliderProps,\n    getHueSliderProps,\n    getAlphaSliderProps,\n    getEyeDropperProps,\n    getChannelProps,\n    getSwatchProps,\n  }\n}\n\nexport type UseColorSelectorReturn = ReturnType<typeof useColorSelector>\n"],"mappings":"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","names":["h","s","a","channels","value","v","props"]}
+{"version":3,"sources":["../src/use-color-selector.ts"],"sourcesContent":["import type {\n  CSSUIObject,\n  HTMLUIProps,\n  UIPropGetter,\n  ThemeProps,\n  RequiredUIPropGetter,\n} from \"@yamada-ui/core\"\nimport {\n  useFormControlProps,\n  type FormControlOptions,\n  formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { InputProps } from \"@yamada-ui/input\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { useEyeDropper } from \"@yamada-ui/use-eye-dropper\"\nimport type { ColorFormat, Dict, Merge } from \"@yamada-ui/utils\"\nimport {\n  calcFormat,\n  convertColor,\n  createContext,\n  handlerAll,\n  hsvTo,\n  isString,\n  parseToHsv,\n  useCallbackRef,\n  useUpdateEffect,\n  omitObject,\n  parseToRgba,\n  parseToHsla,\n  rgbaTo,\n  hslaTo,\n  pickObject,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent } from \"react\"\nimport { useCallback, useMemo, useRef, useState } 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\"\n\ntype Space = keyof Hsla | keyof Rgba\ntype Hsla = { h: number; s: number; l: number; a: number }\ntype Rgba = { r: number; g: number; b: number; a: number }\ntype Hsva = { h: number; s: number; v: number; a: number }\ntype Channel = {\n  label: string\n  space: Space\n  value: number\n  min: number\n  max: 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 { h, s, l, a }\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 { r, g, b, a }\n}\n\nconst convertHsva = (value: string, fallback?: string): Hsva => {\n  const [h, s, v, a] = parseToHsv(value, fallback)\n\n  return { h, s, v, a }\n}\n\ntype ColorSelectorContext = {\n  value: string\n  onChange: (value: string | Partial<Hsva>) => void\n  eyeDropperSupported: boolean\n  withAlpha: boolean\n  isInteractive: boolean\n  disabled?: boolean\n  readOnly?: boolean\n  channels: Channel[]\n  size?: ThemeProps<\"ColorSelector\">[\"size\"]\n  getHueSliderProps: UIPropGetter<\"input\", HueSliderProps, HueSliderProps>\n  getAlphaSliderProps: UIPropGetter<\"input\", AlphaSliderProps, AlphaSliderProps>\n  getEyeDropperProps: UIPropGetter<\"button\">\n  getChannelProps: RequiredUIPropGetter<\n    \"input\",\n    Merge<InputProps, { space: Space }>,\n    InputProps\n  >\n  getSwatchProps: UIPropGetter<\"div\", ColorSwatchProps, ColorSwatchProps>\n  styles: Record<string, CSSUIObject>\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\ntype 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 value of the color selector.\n   */\n  value?: 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   * Function called whenever the color selector value changes.\n   */\n  onChange?: (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 when the user is done selecting a new value.\n   */\n  onChangeEnd?: (value: string) => void\n  /**\n   * Color format. For example, `hex`, `rgba`, etc.\n   *\n   * @default \"hexa\"\n   */\n  format?: ColorFormat\n  /**\n   * Function called whenever the color swatch click.\n   */\n  onSwatchClick?: (value: string) => void\n}\n\nexport type UseColorSelectorBaseProps = UseColorSelectorOptions &\n  FormControlOptions\n\nexport type UseColorSelectorProps = Omit<\n  HTMLUIProps<\"div\">,\n  \"defaultValue\" | \"onChange\" | \"children\"\n> &\n  UseColorSelectorBaseProps\n\nexport const useColorSelector = ({\n  isInvalid,\n  ...props\n}: UseColorSelectorProps) => {\n  let {\n    id,\n    name,\n    value: valueProp,\n    defaultValue,\n    fallbackValue,\n    onChange: onChangeProp,\n    onChangeStart: onChangeStartProp,\n    onChangeEnd: onChangeEndProp,\n    format,\n    required,\n    disabled,\n    readOnly,\n    onSwatchClick,\n    ...rest\n  } = useFormControlProps({ isInvalid, ...props })\n\n  const onChangeStartRef = useCallbackRef(onChangeStartProp)\n  const onChangeEndRef = useCallbackRef(onChangeEndProp)\n  const { supported: eyeDropperSupported, onOpen } = useEyeDropper()\n  const [value, setValue] = useControllableState({\n    value: valueProp,\n    defaultValue: defaultValue ?? fallbackValue,\n    onChange: onChangeProp,\n  })\n  const resolvedValue = value ?? \"#ffffff\"\n  const timeoutId = useRef<any>(undefined)\n  const formatRef = useRef<ColorFormat>(format ?? calcFormat(resolvedValue))\n  const isDraggingRef = useRef<boolean>(false)\n  const [parsedValue, setParsedValue] = useState<Hsva>(\n    convertHsva(resolvedValue, fallbackValue),\n  )\n  const { h, s, v, a } = parsedValue\n  const withAlpha = formatRef.current.endsWith(\"a\")\n  const isInteractive = !(disabled || readOnly)\n\n  const channels: Channel[] = useMemo(() => {\n    if (resolvedValue.startsWith(\"hsl\")) {\n      const { h, s, l, a } = convertHsla(resolvedValue, fallbackValue)\n\n      let channels: Channel[] = [\n        { label: \"H\", space: \"h\", value: Math.round(h), min: 0, max: 360 },\n        {\n          label: \"S(%)\",\n          space: \"s\",\n          value: Math.round(s * 100),\n          min: 0,\n          max: 100,\n        },\n        {\n          label: \"L(%)\",\n          space: \"l\",\n          value: Math.round(l * 100),\n          min: 0,\n          max: 100,\n        },\n      ]\n\n      if (withAlpha) {\n        channels = [\n          ...channels,\n          {\n            label: \"A(%)\",\n            space: \"a\",\n            value: Math.round(a * 100),\n            min: 0,\n            max: 100,\n          },\n        ]\n      }\n\n      return channels\n    } else {\n      const { r, g, b, a } = convertRgba(resolvedValue, fallbackValue)\n\n      let channels: Channel[] = [\n        { label: \"R\", space: \"r\", value: Math.round(r), min: 0, max: 255 },\n        { label: \"G\", space: \"g\", value: Math.round(g), min: 0, max: 255 },\n        { label: \"B\", space: \"b\", value: Math.round(b), min: 0, max: 255 },\n      ]\n\n      if (withAlpha) {\n        channels = [\n          ...channels,\n          {\n            label: \"A(%)\",\n            space: \"a\",\n            value: Math.round(a * 100),\n            min: 0,\n            max: 100,\n          },\n        ]\n      }\n\n      return channels\n    }\n  }, [resolvedValue, withAlpha, fallbackValue])\n\n  const onChange = useCallback(\n    (value: string | Partial<Hsva>) => {\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 { h, s, v, a } = { ...parsedValue, ...value }\n\n      const nextValue = hsvTo([h, s, v, a], fallbackValue)(formatRef.current)\n\n      if (nextValue) onChangeStartRef(nextValue)\n    },\n    [formatRef, onChangeStartRef, fallbackValue, parsedValue],\n  )\n\n  const onChangeEnd = useCallback(\n    (value: string | Partial<Hsva>) => {\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)(formatRef.current)\n      } else {\n        const { h, s, v, a } = { ...parsedValue, ...value }\n\n        nextValue = hsvTo([h, s, v, a], fallbackValue)(formatRef.current)\n      }\n\n      if (nextValue) onChangeEndRef(nextValue)\n    },\n    [formatRef, onChangeEndRef, fallbackValue, parsedValue],\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 ([\"s\", \"l\", \"a\"].includes(space)) n = n / 100\n\n      let nextValue: string | undefined\n\n      if (resolvedValue.startsWith(\"hsl\")) {\n        const { h, s, l, a } = Object.assign(\n          convertHsla(resolvedValue, fallbackValue),\n          { [space]: n },\n        )\n\n        nextValue = hslaTo([h, s, l, a], fallbackValue)(formatRef.current)\n      } else {\n        const { r, g, b, a } = Object.assign(\n          convertRgba(resolvedValue, fallbackValue),\n          { [space]: n },\n        )\n\n        nextValue = rgbaTo([r, g, b, a], fallbackValue)(formatRef.current)\n      }\n\n      if (!nextValue) return\n\n      onChange(nextValue)\n      onChangeEnd(nextValue)\n    },\n    [resolvedValue, onChange, onChangeEnd, formatRef, fallbackValue],\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)(formatRef.current)\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 (!format || !value) return\n\n    formatRef.current = format\n\n    const nextValue = convertColor(value, fallbackValue)(format)\n\n    if (nextValue) setValue(nextValue)\n  }, [format])\n\n  const getContainerProps: UIPropGetter = (props = {}, ref = null) => ({\n    ...props,\n    ref,\n    ...omitObject(rest, [\"aria-readonly\"]),\n  })\n\n  const getInputProps: UIPropGetter<\"input\"> = useCallback(\n    (props = {}, ref = null) => ({\n      ...pickObject(rest, formControlProperties),\n      ...props,\n      id,\n      ref,\n      type: \"hidden\",\n      name,\n      value: resolvedValue,\n      required,\n      disabled,\n      readOnly,\n    }),\n    [disabled, id, name, readOnly, required, rest, resolvedValue],\n  )\n\n  const getSaturationSliderProps: UIPropGetter<\n    \"input\",\n    SaturationSliderProps,\n    SaturationSliderProps\n  > = useCallback(\n    (props = {}, ref = null) => ({\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      ...props,\n      ref,\n      value: [h, s, v],\n      onChange: handlerAll(props.onChange, ([, s, v]) => onChange({ s, v })),\n      onChangeStart: handlerAll(props.onChangeStart, ([, s, v]) =>\n        onChangeStart({ s, v }),\n      ),\n      onChangeEnd: handlerAll(props.onChangeEnd, ([, s, v]) =>\n        onChangeEnd({ 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: UIPropGetter<\n    \"input\",\n    HueSliderProps,\n    HueSliderProps\n  > = useCallback(\n    (props = {}, ref = null) => ({\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      ...props,\n      ref,\n      value: h,\n      onChange: handlerAll(props.onChange, (h) => onChange({ h })),\n      onChangeStart: handlerAll(props.onChangeStart, (h) =>\n        onChangeStart({ h }),\n      ),\n      onChangeEnd: handlerAll(props.onChangeEnd, (h) => onChangeEnd({ h })),\n    }),\n    [\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      h,\n      onChange,\n      onChangeStart,\n      onChangeEnd,\n    ],\n  )\n\n  const getAlphaSliderProps: UIPropGetter<\n    \"input\",\n    AlphaSliderProps,\n    AlphaSliderProps\n  > = useCallback(\n    (props = {}, ref = null) => ({\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      ...props,\n      ref,\n      value: a,\n      color: hsvTo([h, s, v, a], fallbackValue)(formatRef.current),\n      onChange: handlerAll(props.onChange, (a) => onChange({ a })),\n      onChangeStart: handlerAll(props.onChangeStart, (a) =>\n        onChangeStart({ a }),\n      ),\n      onChangeEnd: handlerAll(props.onChangeEnd, (a) => onChangeEnd({ a })),\n    }),\n    [\n      fallbackValue,\n      required,\n      disabled,\n      readOnly,\n      isInvalid,\n      formatRef,\n      h,\n      s,\n      v,\n      a,\n      onChange,\n      onChangeStart,\n      onChangeEnd,\n    ],\n  )\n\n  const getChannelProps: RequiredUIPropGetter<\n    \"input\",\n    Merge<InputProps, { space: Space }>,\n    InputProps\n  > = useCallback(\n    ({ space, ...props }, ref = null) => {\n      return {\n        required,\n        disabled,\n        readOnly,\n        isInvalid,\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: UIPropGetter<\"button\"> = useCallback(\n    (props = {}, ref = null) => ({\n      disabled,\n      \"aria-label\": \"Pick a color\",\n      ...props,\n      ref,\n      onClick: handlerAll(props.onClick, onEyeDropperClick),\n    }),\n    [disabled, onEyeDropperClick],\n  )\n\n  const getSwatchProps: UIPropGetter<\n    \"div\",\n    ColorSwatchProps,\n    ColorSwatchProps\n  > = 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 (!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    value: resolvedValue,\n    onChange,\n    eyeDropperSupported,\n    withAlpha,\n    isInteractive,\n    disabled,\n    readOnly,\n    channels,\n    getContainerProps,\n    getInputProps,\n    getSaturationSliderProps,\n    getHueSliderProps,\n    getAlphaSliderProps,\n    getEyeDropperProps,\n    getChannelProps,\n    getSwatchProps,\n  }\n}\n\nexport type UseColorSelectorReturn = ReturnType<typeof useColorSelector>\n"],"mappings":"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","names":["h","s","a","channels","value","v","props"]}

package/dist/{chunk-R4DLOKLT.mjs → chunk-WRHKYN3W.mjs}

@@ -28,8 +28,7 @@ var useColorSlider = ({
   focusThumbOnChange = true,
   ...props
 }) => {
-  if (!focusThumbOnChange)
-    props.isReadOnly = true;
+  if (!focusThumbOnChange) props.isReadOnly = true;
   let {
     id,
     name,
@@ -76,16 +75,14 @@ var useColorSlider = ({
   const getValueFromPointer = useCallback(
     (ev) => {
       var _a, _b;
-      if (!trackRef.current)
-        return;
+      if (!trackRef.current) return;
       const { min: min2, max: max2, step: step2 } = latestRef.current;
       latestRef.current.eventSource = "pointer";
       const { left, width } = trackRef.current.getBoundingClientRect();
       const { clientX } = (_b = (_a = ev.touches) == null ? void 0 : _a[0]) != null ? _b : ev;
       let percent = (clientX - left) / width;
       let nextValue = percentToValue(percent, min2, max2);
-      if (step2)
-        nextValue = parseFloat(roundNumberToStep(nextValue, min2, step2));
+      if (step2) nextValue = parseFloat(roundNumberToStep(nextValue, min2, step2));
       nextValue = clampNumber(nextValue, min2, max2);
       return nextValue;
     },
@@ -94,22 +91,19 @@ var useColorSlider = ({
   const setValueFromPointer = (ev) => {
     const { value: value2 } = latestRef.current;
     const nextValue = getValueFromPointer(ev);
-    if (nextValue != null && nextValue !== value2)
-      setValue(nextValue);
+    if (nextValue != null && nextValue !== value2) setValue(nextValue);
   };
   const focusThumb = useCallback(() => {
     const { focusThumbOnChange: focusThumbOnChange2 } = latestRef.current;
-    if (focusThumbOnChange2)
-      setTimeout(() => {
-        var _a;
-        return (_a = thumbRef.current) == null ? void 0 : _a.focus();
-      });
+    if (focusThumbOnChange2) setTimeout(() => {
+      var _a;
+      return (_a = thumbRef.current) == null ? void 0 : _a.focus();
+    });
   }, [latestRef]);
   const constrain = useCallback(
     (value2) => {
       const { isInteractive: isInteractive2, min: min2, max: max2 } = latestRef.current;
-      if (!isInteractive2)
-        return;
+      if (!isInteractive2) return;
       value2 = parseFloat(roundNumberToStep(value2, min2, oneStep));
       value2 = clampNumber(value2, min2, max2);
       setValue(value2);
@@ -138,8 +132,7 @@ var useColorSlider = ({
         End: () => constrain(max2)
       };
       const action = actions[ev.key];
-      if (!action)
-        return;
+      if (!action) return;
       ev.preventDefault();
       ev.stopPropagation();
       action(ev);
@@ -150,8 +143,7 @@ var useColorSlider = ({
   usePanEvent(containerRef, {
     onSessionStart: (ev) => {
       const { isInteractive: isInteractive2, value: value2 } = latestRef.current;
-      if (!isInteractive2)
-        return;
+      if (!isInteractive2) return;
       setDragging(true);
       focusThumb();
       setValueFromPointer(ev);
@@ -159,22 +151,19 @@ var useColorSlider = ({
     },
     onSessionEnd: () => {
       const { isInteractive: isInteractive2, value: value2 } = latestRef.current;
-      if (!isInteractive2)
-        return;
+      if (!isInteractive2) return;
       setDragging(false);
       onChangeEnd(value2);
     },
     onMove: (ev) => {
       const { isInteractive: isInteractive2 } = latestRef.current;
-      if (!isInteractive2)
-        return;
+      if (!isInteractive2) return;
       setValueFromPointer(ev);
     }
   });
   useUpdateEffect(() => {
     const { eventSource, value: value2 } = latestRef.current;
-    if (eventSource === "keyboard")
-      onChangeEnd(value2);
+    if (eventSource === "keyboard") onChangeEnd(value2);
   }, [value, onChangeEnd]);
   const getContainerProps = useCallback(
     (props2 = {}, ref = null) => {
@@ -275,4 +264,4 @@ var useColorSlider = ({
 export {
   useColorSlider
 };
-//# sourceMappingURL=chunk-R4DLOKLT.mjs.map
+//# sourceMappingURL=chunk-WRHKYN3W.mjs.map