@andreagiugni/tailwind-dashboard-ui 0.5.7 → 0.5.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/README.md +1 -1
  2. package/dist/{chunk-ONDBG6EY.cjs → chunk-H4UQ67RI.cjs} +4 -4
  3. package/dist/{chunk-ONDBG6EY.cjs.map → chunk-H4UQ67RI.cjs.map} +1 -1
  4. package/dist/{chunk-ASRYDS2W.js → chunk-X3OP55FG.js} +4 -4
  5. package/dist/{chunk-ASRYDS2W.js.map → chunk-X3OP55FG.js.map} +1 -1
  6. package/dist/components/ColorPicker/ColorPicker.cjs +2 -2
  7. package/dist/components/ColorPicker/ColorPicker.js +1 -1
  8. package/dist/index.cjs +12 -12
  9. package/dist/index.cjs.map +1 -1
  10. package/dist/index.js +11 -11
  11. package/dist/index.js.map +1 -1
  12. package/package.json +1 -1
package/README.md CHANGED
@@ -10,7 +10,7 @@ Dual ESM + CJS builds with TypeScript types. Every component — including the d
10
10
 
11
11
  ## Live preview
12
12
 
13
- [![TailDashboardUI component library preview](https://taildashboardui.com/opengraph-image)](https://taildashboardui.com)
13
+ [![TailDashboardUI component library preview](https://taildashboardui.com/assets/taildashboardui-preview.png)](https://taildashboardui.com)
14
14
 
15
15
  Explore every component with interactive previews, copy-ready snippets and complete prop
16
16
  references at **[taildashboardui.com](https://taildashboardui.com)**.
package/dist/{chunk-ONDBG6EY.cjs → chunk-H4UQ67RI.cjs} RENAMED
@@ -254,7 +254,7 @@ var ColorPicker = ({
254
254
  "aria-label": "Color format",
255
255
  value: format,
256
256
  onChange: (e) => handleFormatChange(e.target.value),
257
- className: "h-11 appearance-none rounded-lg border border-gray-300 bg-transparent pl-3 pr-8 text-sm text-gray-700 focus:outline-hidden dark:border-gray-700 dark:text-gray-300",
257
+ className: "h-11 appearance-none rounded-lg border border-gray-300 bg-white pl-3 pr-8 text-sm text-gray-700 focus:outline-hidden dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300",
258
258
  children: formats.map((f) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: f, children: f.toUpperCase() }, f))
259
259
  }
260
260
  ),
@@ -278,7 +278,7 @@ var ColorPicker = ({
278
278
  value: inputValue,
279
279
  onChange: (e) => handleInputChange(e.target.value),
280
280
  onBlur: () => setDraft(null),
281
- className: "h-11 min-w-0 flex-1 rounded-lg border border-gray-300 bg-transparent px-3 font-mono text-sm text-gray-800 focus:outline-hidden dark:border-gray-700 dark:text-white/90"
281
+ className: "h-11 min-w-0 flex-1 rounded-lg border border-gray-300 bg-white px-3 font-mono text-sm text-gray-800 focus:outline-hidden dark:border-gray-700 dark:bg-gray-900 dark:text-white/90"
282
282
  }
283
283
  )
284
284
  ] })
@@ -293,5 +293,5 @@ var ColorPicker = ({
293
293
  };
294
294
 
295
295
  exports.ColorPicker = ColorPicker;
296
- //# sourceMappingURL=chunk-ONDBG6EY.cjs.map
297
- //# sourceMappingURL=chunk-ONDBG6EY.cjs.map
296
+ //# sourceMappingURL=chunk-H4UQ67RI.cjs.map
297
+ //# sourceMappingURL=chunk-H4UQ67RI.cjs.map
package/dist/{chunk-ONDBG6EY.cjs.map → chunk-H4UQ67RI.cjs.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ColorPicker/ColorPicker.tsx"],"names":["jsx","useState","Color","useMemo","useRef","useEffect","useCallback","useLayoutEffect","jsxs","cn","createPortal","layers","RBColorPicker"],"mappings":"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","file":"chunk-ONDBG6EY.cjs","sourcesContent":["\"use client\";\nimport React, {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ColorPicker as RBColorPicker, Color } from \"react-beautiful-color\";\nimport { cn } from \"../../lib/cn\";\nimport { layers } from \"../../lib/layers\";\n\n// `react-beautiful-color` doesn't re-export these types from its entry, so\n// derive them from the values its API does expose.\ntype Hsva = ReturnType<Color[\"getHsva\"]>;\ntype ColorInput = ConstructorParameters<typeof Color>[0] & { type: string };\n\nexport type ColorPickerFormat = \"hex\" | \"rgb\" | \"rgba\" | \"hsl\" | \"hsla\";\n\nexport interface ColorPickerProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n /** Initial color (uncontrolled). Any hex string, e.g. `\"#3641f5\"`. */\n defaultValue?: string;\n /** Format selected on first render. Default: `\"hex\"`. */\n defaultFormat?: ColorPickerFormat;\n /** Formats offered in the switcher. Default: all five. */\n formats?: ColorPickerFormat[];\n /** Render the value input + format switcher. Default: `true`. */\n showInput?: boolean;\n /** Show the native eye-dropper button (browser support varies). */\n withEyeDropper?: boolean;\n /** Optional label rendered above the picker. */\n label?: string;\n /** Fires on every change with the formatted string and the `Color` instance. */\n onChange?: (value: string, color: Color) => void;\n}\n\nconst ALL_FORMATS: ColorPickerFormat[] = [\"hex\", \"rgb\", \"rgba\", \"hsl\", \"hsla\"];\n\n/** Parse the text in the input back into a `ColorInput`, or `null` if invalid. */\nfunction parseValue(text: string, format: ColorPickerFormat): ColorInput | null {\n const t = text.trim();\n if (format === \"hex\") {\n return /^#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)\n ? { type: \"hex\", value: t }\n : null;\n }\n const n = t.match(/-?\\d*\\.?\\d+/g)?.map(Number) ?? [];\n if (format === \"rgb\" && n.length >= 3) return { type: \"rgb\", r: n[0], g: n[1], b: n[2] };\n if (format === \"rgba\" && n.length >= 4)\n return { type: \"rgba\", r: n[0], g: n[1], b: n[2], a: n[3] };\n if (format === \"hsl\" && n.length >= 3) return { type: \"hsl\", h: n[0], s: n[1], l: n[2] };\n if (format === \"hsla\" && n.length >= 4)\n return { type: \"hsla\", h: n[0], s: n[1], l: n[2], a: n[3] };\n return null;\n}\n\n/** Format a `Color` into the requested CSS string. */\nfunction colorToString(color: Color, format: ColorPickerFormat): string {\n switch (format) {\n case \"hex\": {\n const { r, g, b } = color.getRgb();\n const a = color.getRgba().a;\n const hex = `#${[r, g, b].map((v) => Math.round(v).toString(16).padStart(2, \"0\")).join(\"\")}`;\n return a < 1\n ? `${hex}${Math.round(a * 255).toString(16).padStart(2, \"0\")}`\n : hex;\n }\n case \"rgb\": {\n const { r, g, b } = color.getRgb();\n return `rgb(${r}, ${g}, ${b})`;\n }\n case \"rgba\": {\n const { r, g, b, a } = color.getRgba();\n return `rgba(${r}, ${g}, ${b}, ${a})`;\n }\n case \"hsl\": {\n const { h, s, l } = color.getHsl();\n return `hsl(${h}, ${s}%, ${l}%)`;\n }\n case \"hsla\": {\n const { h, s, l, a } = color.getHsla();\n return `hsla(${h}, ${s}%, ${l}%, ${a})`;\n }\n default:\n return color.getHex();\n }\n}\n\nconst pipetteIcon = (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M19.5 3.5a2.12 2.12 0 0 0-3 0l-2.3 2.3-1-1-1.4 1.4 1 1L4 14.9V19h4.1l7.7-7.7 1 1 1.4-1.4-1-1 2.3-2.3a2.12 2.12 0 0 0 0-3ZM7.3 17.6H6v-1.3l6.6-6.6 1.3 1.3-6.6 6.6Z\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport const ColorPicker: React.FC<ColorPickerProps> = ({\n defaultValue = \"#3641f5\",\n defaultFormat = \"hex\",\n formats = ALL_FORMATS,\n showInput = true,\n withEyeDropper = false,\n label,\n onChange,\n className,\n ...rest\n}) => {\n // Internal state lives in full-fidelity HSVA — the picker's native space.\n // Feeding anything lossier (e.g. hex) back into the controlled picker makes\n // the knobs fight the cursor (hue/alpha collapse on round-trip), which is\n // why drag would freeze or snap.\n const [hsva, setHsva] = useState<Hsva>(() =>\n new Color({ type: \"hex\", value: defaultValue }).getHsva()\n );\n const [format, setFormat] = useState<ColorPickerFormat>(defaultFormat);\n const [isOpen, setIsOpen] = useState(false);\n const [popupPosition, setPopupPosition] = useState({\n left: 0,\n top: 0,\n width: 320,\n });\n // While the input is focused we keep a raw draft so partial/invalid typing\n // isn't clobbered by the normalized value.\n const [draft, setDraft] = useState<string | null>(null);\n // HSVA is integer-quantized, so we keep the user's exact text (defaultValue\n // or typed) and show it verbatim until the picker actually changes color.\n const [exact, setExact] = useState<{ format: ColorPickerFormat; value: string } | null>(\n () => ({ format: \"hex\", value: defaultValue })\n );\n\n const colorInput = useMemo(() => ({ type: \"hsva\" as const, ...hsva }), [hsva]);\n const currentColor = useMemo(() => new Color(colorInput), [colorInput]);\n const display =\n exact && exact.format === format ? exact.value : colorToString(currentColor, format);\n const inputValue = draft ?? display;\n\n // The picker's internal drag layer unbinds its document listeners whenever\n // the `onChange` identity changes (its cleanup effect depends on it), which\n // would kill an in-flight drag after the first tick. Keep the handler\n // identity-stable and read mutable values through refs.\n const hsvaRef = useRef(hsva);\n hsvaRef.current = hsva;\n const formatRef = useRef(format);\n formatRef.current = format;\n const onChangeRef = useRef(onChange);\n onChangeRef.current = onChange;\n const rootRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLButtonElement>(null);\n const popupRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!isOpen) return;\n\n const handlePointerDown = (event: MouseEvent) => {\n const target = event.target as Node;\n if (\n rootRef.current &&\n !rootRef.current.contains(target) &&\n !popupRef.current?.contains(target)\n ) {\n setIsOpen(false);\n }\n };\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") setIsOpen(false);\n };\n\n document.addEventListener(\"mousedown\", handlePointerDown);\n document.addEventListener(\"keydown\", handleEscape);\n return () => {\n document.removeEventListener(\"mousedown\", handlePointerDown);\n document.removeEventListener(\"keydown\", handleEscape);\n };\n }, [isOpen]);\n\n const updatePopupPosition = useCallback(() => {\n const trigger = triggerRef.current;\n if (!trigger) return;\n\n const rect = trigger.getBoundingClientRect();\n const viewportPadding = 16;\n const gap = 8;\n const width = Math.min(320, window.innerWidth - viewportPadding * 2);\n const popupHeight = popupRef.current?.offsetHeight ?? 306;\n const fitsBelow = window.innerHeight - rect.bottom - gap >= popupHeight;\n const top = fitsBelow || rect.top < popupHeight + gap\n ? rect.bottom + gap\n : rect.top - popupHeight - gap;\n const left = Math.min(\n Math.max(rect.left, viewportPadding),\n window.innerWidth - width - viewportPadding\n );\n\n setPopupPosition({ left, top: Math.max(viewportPadding, top), width });\n }, []);\n\n useLayoutEffect(() => {\n if (!isOpen) return;\n\n updatePopupPosition();\n window.addEventListener(\"resize\", updatePopupPosition);\n window.addEventListener(\"scroll\", updatePopupPosition, true);\n return () => {\n window.removeEventListener(\"resize\", updatePopupPosition);\n window.removeEventListener(\"scroll\", updatePopupPosition, true);\n };\n }, [isOpen, updatePopupPosition]);\n\n const handlePickerChange = useCallback((next: Color) => {\n const nv = next.getHsva();\n const cur = hsvaRef.current;\n // The picker re-emits the current color on mount; ignore no-op changes so\n // the exact defaultValue isn't clobbered.\n if (nv.h === cur.h && nv.s === cur.s && nv.v === cur.v && nv.a === cur.a) return;\n setHsva(nv);\n setExact(null);\n setDraft(null);\n onChangeRef.current?.(colorToString(next, formatRef.current), next);\n }, []);\n\n const handleFormatChange = (f: ColorPickerFormat) => {\n setFormat(f);\n setDraft(null);\n onChange?.(\n exact && exact.format === f ? exact.value : colorToString(currentColor, f),\n currentColor\n );\n };\n\n const handleInputChange = (text: string) => {\n setDraft(text);\n const parsed = parseValue(text, format);\n if (parsed) {\n const c = new Color(parsed);\n setHsva(c.getHsva());\n setExact({ format, value: text.trim() });\n onChange?.(text.trim(), c);\n }\n };\n\n return (\n <div\n ref={rootRef}\n className={cn(\"relative w-full max-w-xs\", className)}\n {...rest}\n >\n {label && (\n <span className=\"mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400\">\n {label}\n </span>\n )}\n <button\n ref={triggerRef}\n type=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={isOpen}\n aria-label={label ? `Open ${label} color picker` : \"Open color picker\"}\n onClick={() => setIsOpen((open) => !open)}\n className=\"flex h-11 w-full items-center gap-3 rounded-lg border border-gray-300 bg-white px-3 text-left shadow-theme-xs transition hover:bg-gray-50 focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:hover:bg-white/[0.03] dark:focus:border-brand-800\"\n >\n <span\n aria-hidden=\"true\"\n className=\"h-7 w-7 shrink-0 rounded-md border border-gray-200 dark:border-gray-700\"\n style={{ backgroundColor: currentColor.format(\"rgba\") }}\n />\n <span className=\"min-w-0 flex-1 truncate font-mono text-sm text-gray-800 dark:text-white/90\">\n {display}\n </span>\n <svg\n aria-hidden=\"true\"\n className={cn(\n \"h-4 w-4 shrink-0 text-gray-500 transition-transform dark:text-gray-400\",\n isOpen && \"rotate-180\"\n )}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path d=\"m6 9 6 6 6-6\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </button>\n\n {isOpen && typeof document !== \"undefined\" && createPortal(\n <div\n ref={popupRef}\n role=\"dialog\"\n aria-label={label ? `${label} color picker` : \"Color picker\"}\n className={cn(\n \"fixed rounded-2xl border border-gray-200 bg-white p-3 shadow-theme-lg dark:border-gray-700 dark:bg-gray-900\",\n layers.portal\n )}\n style={{\n left: popupPosition.left,\n top: popupPosition.top,\n width: popupPosition.width,\n }}\n >\n <RBColorPicker\n color={colorInput}\n onChange={handlePickerChange}\n className=\"h-auto w-full\"\n >\n {/* Overflow would clip the drag knobs beyond the track bounds. */}\n <RBColorPicker.Saturation className=\"mb-4 h-40 rounded-lg\" />\n <div className=\"flex items-center gap-3\">\n {withEyeDropper && (\n <RBColorPicker.EyeDropper className=\"flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border border-gray-300 text-gray-600 hover:bg-gray-50 dark:border-gray-700 dark:text-gray-300 dark:hover:bg-white/[0.03]\">\n {pipetteIcon}\n </RBColorPicker.EyeDropper>\n )}\n <div className=\"flex flex-1 flex-col gap-3\">\n <RBColorPicker.Hue className=\"h-4\" />\n <RBColorPicker.Alpha className=\"h-4\" />\n </div>\n </div>\n </RBColorPicker>\n\n {showInput && (\n <div className=\"mt-4 flex items-stretch gap-2\">\n {formats.length > 1 && (\n <span className=\"relative shrink-0\">\n <select\n aria-label=\"Color format\"\n value={format}\n onChange={(e) => handleFormatChange(e.target.value as ColorPickerFormat)}\n className=\"h-11 appearance-none rounded-lg border border-gray-300 bg-transparent pl-3 pr-8 text-sm text-gray-700 focus:outline-hidden dark:border-gray-700 dark:text-gray-300\"\n >\n {formats.map((f) => (\n <option key={f} value={f}>\n {f.toUpperCase()}\n </option>\n ))}\n </select>\n <svg\n aria-hidden=\"true\"\n className=\"pointer-events-none absolute right-2.5 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path d=\"m6 9 6 6 6-6\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </span>\n )}\n <input\n aria-label=\"Color value\"\n value={inputValue}\n onChange={(e) => handleInputChange(e.target.value)}\n onBlur={() => setDraft(null)}\n className=\"h-11 min-w-0 flex-1 rounded-lg border border-gray-300 bg-transparent px-3 font-mono text-sm text-gray-800 focus:outline-hidden dark:border-gray-700 dark:text-white/90\"\n />\n </div>\n )}\n </div>,\n document.body\n )}\n </div>\n );\n};\n"]}
1
+ {"version":3,"sources":["../src/components/ColorPicker/ColorPicker.tsx"],"names":["jsx","useState","Color","useMemo","useRef","useEffect","useCallback","useLayoutEffect","jsxs","cn","createPortal","layers","RBColorPicker"],"mappings":"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","file":"chunk-H4UQ67RI.cjs","sourcesContent":["\"use client\";\nimport React, {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ColorPicker as RBColorPicker, Color } from \"react-beautiful-color\";\nimport { cn } from \"../../lib/cn\";\nimport { layers } from \"../../lib/layers\";\n\n// `react-beautiful-color` doesn't re-export these types from its entry, so\n// derive them from the values its API does expose.\ntype Hsva = ReturnType<Color[\"getHsva\"]>;\ntype ColorInput = ConstructorParameters<typeof Color>[0] & { type: string };\n\nexport type ColorPickerFormat = \"hex\" | \"rgb\" | \"rgba\" | \"hsl\" | \"hsla\";\n\nexport interface ColorPickerProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n /** Initial color (uncontrolled). Any hex string, e.g. `\"#3641f5\"`. */\n defaultValue?: string;\n /** Format selected on first render. Default: `\"hex\"`. */\n defaultFormat?: ColorPickerFormat;\n /** Formats offered in the switcher. Default: all five. */\n formats?: ColorPickerFormat[];\n /** Render the value input + format switcher. Default: `true`. */\n showInput?: boolean;\n /** Show the native eye-dropper button (browser support varies). */\n withEyeDropper?: boolean;\n /** Optional label rendered above the picker. */\n label?: string;\n /** Fires on every change with the formatted string and the `Color` instance. */\n onChange?: (value: string, color: Color) => void;\n}\n\nconst ALL_FORMATS: ColorPickerFormat[] = [\"hex\", \"rgb\", \"rgba\", \"hsl\", \"hsla\"];\n\n/** Parse the text in the input back into a `ColorInput`, or `null` if invalid. */\nfunction parseValue(text: string, format: ColorPickerFormat): ColorInput | null {\n const t = text.trim();\n if (format === \"hex\") {\n return /^#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)\n ? { type: \"hex\", value: t }\n : null;\n }\n const n = t.match(/-?\\d*\\.?\\d+/g)?.map(Number) ?? [];\n if (format === \"rgb\" && n.length >= 3) return { type: \"rgb\", r: n[0], g: n[1], b: n[2] };\n if (format === \"rgba\" && n.length >= 4)\n return { type: \"rgba\", r: n[0], g: n[1], b: n[2], a: n[3] };\n if (format === \"hsl\" && n.length >= 3) return { type: \"hsl\", h: n[0], s: n[1], l: n[2] };\n if (format === \"hsla\" && n.length >= 4)\n return { type: \"hsla\", h: n[0], s: n[1], l: n[2], a: n[3] };\n return null;\n}\n\n/** Format a `Color` into the requested CSS string. */\nfunction colorToString(color: Color, format: ColorPickerFormat): string {\n switch (format) {\n case \"hex\": {\n const { r, g, b } = color.getRgb();\n const a = color.getRgba().a;\n const hex = `#${[r, g, b].map((v) => Math.round(v).toString(16).padStart(2, \"0\")).join(\"\")}`;\n return a < 1\n ? `${hex}${Math.round(a * 255).toString(16).padStart(2, \"0\")}`\n : hex;\n }\n case \"rgb\": {\n const { r, g, b } = color.getRgb();\n return `rgb(${r}, ${g}, ${b})`;\n }\n case \"rgba\": {\n const { r, g, b, a } = color.getRgba();\n return `rgba(${r}, ${g}, ${b}, ${a})`;\n }\n case \"hsl\": {\n const { h, s, l } = color.getHsl();\n return `hsl(${h}, ${s}%, ${l}%)`;\n }\n case \"hsla\": {\n const { h, s, l, a } = color.getHsla();\n return `hsla(${h}, ${s}%, ${l}%, ${a})`;\n }\n default:\n return color.getHex();\n }\n}\n\nconst pipetteIcon = (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M19.5 3.5a2.12 2.12 0 0 0-3 0l-2.3 2.3-1-1-1.4 1.4 1 1L4 14.9V19h4.1l7.7-7.7 1 1 1.4-1.4-1-1 2.3-2.3a2.12 2.12 0 0 0 0-3ZM7.3 17.6H6v-1.3l6.6-6.6 1.3 1.3-6.6 6.6Z\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport const ColorPicker: React.FC<ColorPickerProps> = ({\n defaultValue = \"#3641f5\",\n defaultFormat = \"hex\",\n formats = ALL_FORMATS,\n showInput = true,\n withEyeDropper = false,\n label,\n onChange,\n className,\n ...rest\n}) => {\n // Internal state lives in full-fidelity HSVA — the picker's native space.\n // Feeding anything lossier (e.g. hex) back into the controlled picker makes\n // the knobs fight the cursor (hue/alpha collapse on round-trip), which is\n // why drag would freeze or snap.\n const [hsva, setHsva] = useState<Hsva>(() =>\n new Color({ type: \"hex\", value: defaultValue }).getHsva()\n );\n const [format, setFormat] = useState<ColorPickerFormat>(defaultFormat);\n const [isOpen, setIsOpen] = useState(false);\n const [popupPosition, setPopupPosition] = useState({\n left: 0,\n top: 0,\n width: 320,\n });\n // While the input is focused we keep a raw draft so partial/invalid typing\n // isn't clobbered by the normalized value.\n const [draft, setDraft] = useState<string | null>(null);\n // HSVA is integer-quantized, so we keep the user's exact text (defaultValue\n // or typed) and show it verbatim until the picker actually changes color.\n const [exact, setExact] = useState<{ format: ColorPickerFormat; value: string } | null>(\n () => ({ format: \"hex\", value: defaultValue })\n );\n\n const colorInput = useMemo(() => ({ type: \"hsva\" as const, ...hsva }), [hsva]);\n const currentColor = useMemo(() => new Color(colorInput), [colorInput]);\n const display =\n exact && exact.format === format ? exact.value : colorToString(currentColor, format);\n const inputValue = draft ?? display;\n\n // The picker's internal drag layer unbinds its document listeners whenever\n // the `onChange` identity changes (its cleanup effect depends on it), which\n // would kill an in-flight drag after the first tick. Keep the handler\n // identity-stable and read mutable values through refs.\n const hsvaRef = useRef(hsva);\n hsvaRef.current = hsva;\n const formatRef = useRef(format);\n formatRef.current = format;\n const onChangeRef = useRef(onChange);\n onChangeRef.current = onChange;\n const rootRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLButtonElement>(null);\n const popupRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!isOpen) return;\n\n const handlePointerDown = (event: MouseEvent) => {\n const target = event.target as Node;\n if (\n rootRef.current &&\n !rootRef.current.contains(target) &&\n !popupRef.current?.contains(target)\n ) {\n setIsOpen(false);\n }\n };\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") setIsOpen(false);\n };\n\n document.addEventListener(\"mousedown\", handlePointerDown);\n document.addEventListener(\"keydown\", handleEscape);\n return () => {\n document.removeEventListener(\"mousedown\", handlePointerDown);\n document.removeEventListener(\"keydown\", handleEscape);\n };\n }, [isOpen]);\n\n const updatePopupPosition = useCallback(() => {\n const trigger = triggerRef.current;\n if (!trigger) return;\n\n const rect = trigger.getBoundingClientRect();\n const viewportPadding = 16;\n const gap = 8;\n const width = Math.min(320, window.innerWidth - viewportPadding * 2);\n const popupHeight = popupRef.current?.offsetHeight ?? 306;\n const fitsBelow = window.innerHeight - rect.bottom - gap >= popupHeight;\n const top = fitsBelow || rect.top < popupHeight + gap\n ? rect.bottom + gap\n : rect.top - popupHeight - gap;\n const left = Math.min(\n Math.max(rect.left, viewportPadding),\n window.innerWidth - width - viewportPadding\n );\n\n setPopupPosition({ left, top: Math.max(viewportPadding, top), width });\n }, []);\n\n useLayoutEffect(() => {\n if (!isOpen) return;\n\n updatePopupPosition();\n window.addEventListener(\"resize\", updatePopupPosition);\n window.addEventListener(\"scroll\", updatePopupPosition, true);\n return () => {\n window.removeEventListener(\"resize\", updatePopupPosition);\n window.removeEventListener(\"scroll\", updatePopupPosition, true);\n };\n }, [isOpen, updatePopupPosition]);\n\n const handlePickerChange = useCallback((next: Color) => {\n const nv = next.getHsva();\n const cur = hsvaRef.current;\n // The picker re-emits the current color on mount; ignore no-op changes so\n // the exact defaultValue isn't clobbered.\n if (nv.h === cur.h && nv.s === cur.s && nv.v === cur.v && nv.a === cur.a) return;\n setHsva(nv);\n setExact(null);\n setDraft(null);\n onChangeRef.current?.(colorToString(next, formatRef.current), next);\n }, []);\n\n const handleFormatChange = (f: ColorPickerFormat) => {\n setFormat(f);\n setDraft(null);\n onChange?.(\n exact && exact.format === f ? exact.value : colorToString(currentColor, f),\n currentColor\n );\n };\n\n const handleInputChange = (text: string) => {\n setDraft(text);\n const parsed = parseValue(text, format);\n if (parsed) {\n const c = new Color(parsed);\n setHsva(c.getHsva());\n setExact({ format, value: text.trim() });\n onChange?.(text.trim(), c);\n }\n };\n\n return (\n <div\n ref={rootRef}\n className={cn(\"relative w-full max-w-xs\", className)}\n {...rest}\n >\n {label && (\n <span className=\"mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400\">\n {label}\n </span>\n )}\n <button\n ref={triggerRef}\n type=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={isOpen}\n aria-label={label ? `Open ${label} color picker` : \"Open color picker\"}\n onClick={() => setIsOpen((open) => !open)}\n className=\"flex h-11 w-full items-center gap-3 rounded-lg border border-gray-300 bg-white px-3 text-left shadow-theme-xs transition hover:bg-gray-50 focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:hover:bg-white/[0.03] dark:focus:border-brand-800\"\n >\n <span\n aria-hidden=\"true\"\n className=\"h-7 w-7 shrink-0 rounded-md border border-gray-200 dark:border-gray-700\"\n style={{ backgroundColor: currentColor.format(\"rgba\") }}\n />\n <span className=\"min-w-0 flex-1 truncate font-mono text-sm text-gray-800 dark:text-white/90\">\n {display}\n </span>\n <svg\n aria-hidden=\"true\"\n className={cn(\n \"h-4 w-4 shrink-0 text-gray-500 transition-transform dark:text-gray-400\",\n isOpen && \"rotate-180\"\n )}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path d=\"m6 9 6 6 6-6\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </button>\n\n {isOpen && typeof document !== \"undefined\" && createPortal(\n <div\n ref={popupRef}\n role=\"dialog\"\n aria-label={label ? `${label} color picker` : \"Color picker\"}\n className={cn(\n \"fixed rounded-2xl border border-gray-200 bg-white p-3 shadow-theme-lg dark:border-gray-700 dark:bg-gray-900\",\n layers.portal\n )}\n style={{\n left: popupPosition.left,\n top: popupPosition.top,\n width: popupPosition.width,\n }}\n >\n <RBColorPicker\n color={colorInput}\n onChange={handlePickerChange}\n className=\"h-auto w-full\"\n >\n {/* Overflow would clip the drag knobs beyond the track bounds. */}\n <RBColorPicker.Saturation className=\"mb-4 h-40 rounded-lg\" />\n <div className=\"flex items-center gap-3\">\n {withEyeDropper && (\n <RBColorPicker.EyeDropper className=\"flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border border-gray-300 text-gray-600 hover:bg-gray-50 dark:border-gray-700 dark:text-gray-300 dark:hover:bg-white/[0.03]\">\n {pipetteIcon}\n </RBColorPicker.EyeDropper>\n )}\n <div className=\"flex flex-1 flex-col gap-3\">\n <RBColorPicker.Hue className=\"h-4\" />\n <RBColorPicker.Alpha className=\"h-4\" />\n </div>\n </div>\n </RBColorPicker>\n\n {showInput && (\n <div className=\"mt-4 flex items-stretch gap-2\">\n {formats.length > 1 && (\n <span className=\"relative shrink-0\">\n <select\n aria-label=\"Color format\"\n value={format}\n onChange={(e) => handleFormatChange(e.target.value as ColorPickerFormat)}\n className=\"h-11 appearance-none rounded-lg border border-gray-300 bg-white pl-3 pr-8 text-sm text-gray-700 focus:outline-hidden dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300\"\n >\n {formats.map((f) => (\n <option key={f} value={f}>\n {f.toUpperCase()}\n </option>\n ))}\n </select>\n <svg\n aria-hidden=\"true\"\n className=\"pointer-events-none absolute right-2.5 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path d=\"m6 9 6 6 6-6\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </span>\n )}\n <input\n aria-label=\"Color value\"\n value={inputValue}\n onChange={(e) => handleInputChange(e.target.value)}\n onBlur={() => setDraft(null)}\n className=\"h-11 min-w-0 flex-1 rounded-lg border border-gray-300 bg-white px-3 font-mono text-sm text-gray-800 focus:outline-hidden dark:border-gray-700 dark:bg-gray-900 dark:text-white/90\"\n />\n </div>\n )}\n </div>,\n document.body\n )}\n </div>\n );\n};\n"]}
package/dist/{chunk-ASRYDS2W.js → chunk-X3OP55FG.js} RENAMED
@@ -252,7 +252,7 @@ var ColorPicker = ({
252
252
  "aria-label": "Color format",
253
253
  value: format,
254
254
  onChange: (e) => handleFormatChange(e.target.value),
255
- className: "h-11 appearance-none rounded-lg border border-gray-300 bg-transparent pl-3 pr-8 text-sm text-gray-700 focus:outline-hidden dark:border-gray-700 dark:text-gray-300",
255
+ className: "h-11 appearance-none rounded-lg border border-gray-300 bg-white pl-3 pr-8 text-sm text-gray-700 focus:outline-hidden dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300",
256
256
  children: formats.map((f) => /* @__PURE__ */ jsx("option", { value: f, children: f.toUpperCase() }, f))
257
257
  }
258
258
  ),
@@ -276,7 +276,7 @@ var ColorPicker = ({
276
276
  value: inputValue,
277
277
  onChange: (e) => handleInputChange(e.target.value),
278
278
  onBlur: () => setDraft(null),
279
- className: "h-11 min-w-0 flex-1 rounded-lg border border-gray-300 bg-transparent px-3 font-mono text-sm text-gray-800 focus:outline-hidden dark:border-gray-700 dark:text-white/90"
279
+ className: "h-11 min-w-0 flex-1 rounded-lg border border-gray-300 bg-white px-3 font-mono text-sm text-gray-800 focus:outline-hidden dark:border-gray-700 dark:bg-gray-900 dark:text-white/90"
280
280
  }
281
281
  )
282
282
  ] })
@@ -291,5 +291,5 @@ var ColorPicker = ({
291
291
  };
292
292
 
293
293
  export { ColorPicker };
294
- //# sourceMappingURL=chunk-ASRYDS2W.js.map
295
- //# sourceMappingURL=chunk-ASRYDS2W.js.map
294
+ //# sourceMappingURL=chunk-X3OP55FG.js.map
295
+ //# sourceMappingURL=chunk-X3OP55FG.js.map
package/dist/{chunk-ASRYDS2W.js.map → chunk-X3OP55FG.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ColorPicker/ColorPicker.tsx"],"names":["RBColorPicker"],"mappings":"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","file":"chunk-ASRYDS2W.js","sourcesContent":["\"use client\";\nimport React, {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ColorPicker as RBColorPicker, Color } from \"react-beautiful-color\";\nimport { cn } from \"../../lib/cn\";\nimport { layers } from \"../../lib/layers\";\n\n// `react-beautiful-color` doesn't re-export these types from its entry, so\n// derive them from the values its API does expose.\ntype Hsva = ReturnType<Color[\"getHsva\"]>;\ntype ColorInput = ConstructorParameters<typeof Color>[0] & { type: string };\n\nexport type ColorPickerFormat = \"hex\" | \"rgb\" | \"rgba\" | \"hsl\" | \"hsla\";\n\nexport interface ColorPickerProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n /** Initial color (uncontrolled). Any hex string, e.g. `\"#3641f5\"`. */\n defaultValue?: string;\n /** Format selected on first render. Default: `\"hex\"`. */\n defaultFormat?: ColorPickerFormat;\n /** Formats offered in the switcher. Default: all five. */\n formats?: ColorPickerFormat[];\n /** Render the value input + format switcher. Default: `true`. */\n showInput?: boolean;\n /** Show the native eye-dropper button (browser support varies). */\n withEyeDropper?: boolean;\n /** Optional label rendered above the picker. */\n label?: string;\n /** Fires on every change with the formatted string and the `Color` instance. */\n onChange?: (value: string, color: Color) => void;\n}\n\nconst ALL_FORMATS: ColorPickerFormat[] = [\"hex\", \"rgb\", \"rgba\", \"hsl\", \"hsla\"];\n\n/** Parse the text in the input back into a `ColorInput`, or `null` if invalid. */\nfunction parseValue(text: string, format: ColorPickerFormat): ColorInput | null {\n const t = text.trim();\n if (format === \"hex\") {\n return /^#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)\n ? { type: \"hex\", value: t }\n : null;\n }\n const n = t.match(/-?\\d*\\.?\\d+/g)?.map(Number) ?? [];\n if (format === \"rgb\" && n.length >= 3) return { type: \"rgb\", r: n[0], g: n[1], b: n[2] };\n if (format === \"rgba\" && n.length >= 4)\n return { type: \"rgba\", r: n[0], g: n[1], b: n[2], a: n[3] };\n if (format === \"hsl\" && n.length >= 3) return { type: \"hsl\", h: n[0], s: n[1], l: n[2] };\n if (format === \"hsla\" && n.length >= 4)\n return { type: \"hsla\", h: n[0], s: n[1], l: n[2], a: n[3] };\n return null;\n}\n\n/** Format a `Color` into the requested CSS string. */\nfunction colorToString(color: Color, format: ColorPickerFormat): string {\n switch (format) {\n case \"hex\": {\n const { r, g, b } = color.getRgb();\n const a = color.getRgba().a;\n const hex = `#${[r, g, b].map((v) => Math.round(v).toString(16).padStart(2, \"0\")).join(\"\")}`;\n return a < 1\n ? `${hex}${Math.round(a * 255).toString(16).padStart(2, \"0\")}`\n : hex;\n }\n case \"rgb\": {\n const { r, g, b } = color.getRgb();\n return `rgb(${r}, ${g}, ${b})`;\n }\n case \"rgba\": {\n const { r, g, b, a } = color.getRgba();\n return `rgba(${r}, ${g}, ${b}, ${a})`;\n }\n case \"hsl\": {\n const { h, s, l } = color.getHsl();\n return `hsl(${h}, ${s}%, ${l}%)`;\n }\n case \"hsla\": {\n const { h, s, l, a } = color.getHsla();\n return `hsla(${h}, ${s}%, ${l}%, ${a})`;\n }\n default:\n return color.getHex();\n }\n}\n\nconst pipetteIcon = (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M19.5 3.5a2.12 2.12 0 0 0-3 0l-2.3 2.3-1-1-1.4 1.4 1 1L4 14.9V19h4.1l7.7-7.7 1 1 1.4-1.4-1-1 2.3-2.3a2.12 2.12 0 0 0 0-3ZM7.3 17.6H6v-1.3l6.6-6.6 1.3 1.3-6.6 6.6Z\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport const ColorPicker: React.FC<ColorPickerProps> = ({\n defaultValue = \"#3641f5\",\n defaultFormat = \"hex\",\n formats = ALL_FORMATS,\n showInput = true,\n withEyeDropper = false,\n label,\n onChange,\n className,\n ...rest\n}) => {\n // Internal state lives in full-fidelity HSVA — the picker's native space.\n // Feeding anything lossier (e.g. hex) back into the controlled picker makes\n // the knobs fight the cursor (hue/alpha collapse on round-trip), which is\n // why drag would freeze or snap.\n const [hsva, setHsva] = useState<Hsva>(() =>\n new Color({ type: \"hex\", value: defaultValue }).getHsva()\n );\n const [format, setFormat] = useState<ColorPickerFormat>(defaultFormat);\n const [isOpen, setIsOpen] = useState(false);\n const [popupPosition, setPopupPosition] = useState({\n left: 0,\n top: 0,\n width: 320,\n });\n // While the input is focused we keep a raw draft so partial/invalid typing\n // isn't clobbered by the normalized value.\n const [draft, setDraft] = useState<string | null>(null);\n // HSVA is integer-quantized, so we keep the user's exact text (defaultValue\n // or typed) and show it verbatim until the picker actually changes color.\n const [exact, setExact] = useState<{ format: ColorPickerFormat; value: string } | null>(\n () => ({ format: \"hex\", value: defaultValue })\n );\n\n const colorInput = useMemo(() => ({ type: \"hsva\" as const, ...hsva }), [hsva]);\n const currentColor = useMemo(() => new Color(colorInput), [colorInput]);\n const display =\n exact && exact.format === format ? exact.value : colorToString(currentColor, format);\n const inputValue = draft ?? display;\n\n // The picker's internal drag layer unbinds its document listeners whenever\n // the `onChange` identity changes (its cleanup effect depends on it), which\n // would kill an in-flight drag after the first tick. Keep the handler\n // identity-stable and read mutable values through refs.\n const hsvaRef = useRef(hsva);\n hsvaRef.current = hsva;\n const formatRef = useRef(format);\n formatRef.current = format;\n const onChangeRef = useRef(onChange);\n onChangeRef.current = onChange;\n const rootRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLButtonElement>(null);\n const popupRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!isOpen) return;\n\n const handlePointerDown = (event: MouseEvent) => {\n const target = event.target as Node;\n if (\n rootRef.current &&\n !rootRef.current.contains(target) &&\n !popupRef.current?.contains(target)\n ) {\n setIsOpen(false);\n }\n };\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") setIsOpen(false);\n };\n\n document.addEventListener(\"mousedown\", handlePointerDown);\n document.addEventListener(\"keydown\", handleEscape);\n return () => {\n document.removeEventListener(\"mousedown\", handlePointerDown);\n document.removeEventListener(\"keydown\", handleEscape);\n };\n }, [isOpen]);\n\n const updatePopupPosition = useCallback(() => {\n const trigger = triggerRef.current;\n if (!trigger) return;\n\n const rect = trigger.getBoundingClientRect();\n const viewportPadding = 16;\n const gap = 8;\n const width = Math.min(320, window.innerWidth - viewportPadding * 2);\n const popupHeight = popupRef.current?.offsetHeight ?? 306;\n const fitsBelow = window.innerHeight - rect.bottom - gap >= popupHeight;\n const top = fitsBelow || rect.top < popupHeight + gap\n ? rect.bottom + gap\n : rect.top - popupHeight - gap;\n const left = Math.min(\n Math.max(rect.left, viewportPadding),\n window.innerWidth - width - viewportPadding\n );\n\n setPopupPosition({ left, top: Math.max(viewportPadding, top), width });\n }, []);\n\n useLayoutEffect(() => {\n if (!isOpen) return;\n\n updatePopupPosition();\n window.addEventListener(\"resize\", updatePopupPosition);\n window.addEventListener(\"scroll\", updatePopupPosition, true);\n return () => {\n window.removeEventListener(\"resize\", updatePopupPosition);\n window.removeEventListener(\"scroll\", updatePopupPosition, true);\n };\n }, [isOpen, updatePopupPosition]);\n\n const handlePickerChange = useCallback((next: Color) => {\n const nv = next.getHsva();\n const cur = hsvaRef.current;\n // The picker re-emits the current color on mount; ignore no-op changes so\n // the exact defaultValue isn't clobbered.\n if (nv.h === cur.h && nv.s === cur.s && nv.v === cur.v && nv.a === cur.a) return;\n setHsva(nv);\n setExact(null);\n setDraft(null);\n onChangeRef.current?.(colorToString(next, formatRef.current), next);\n }, []);\n\n const handleFormatChange = (f: ColorPickerFormat) => {\n setFormat(f);\n setDraft(null);\n onChange?.(\n exact && exact.format === f ? exact.value : colorToString(currentColor, f),\n currentColor\n );\n };\n\n const handleInputChange = (text: string) => {\n setDraft(text);\n const parsed = parseValue(text, format);\n if (parsed) {\n const c = new Color(parsed);\n setHsva(c.getHsva());\n setExact({ format, value: text.trim() });\n onChange?.(text.trim(), c);\n }\n };\n\n return (\n <div\n ref={rootRef}\n className={cn(\"relative w-full max-w-xs\", className)}\n {...rest}\n >\n {label && (\n <span className=\"mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400\">\n {label}\n </span>\n )}\n <button\n ref={triggerRef}\n type=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={isOpen}\n aria-label={label ? `Open ${label} color picker` : \"Open color picker\"}\n onClick={() => setIsOpen((open) => !open)}\n className=\"flex h-11 w-full items-center gap-3 rounded-lg border border-gray-300 bg-white px-3 text-left shadow-theme-xs transition hover:bg-gray-50 focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:hover:bg-white/[0.03] dark:focus:border-brand-800\"\n >\n <span\n aria-hidden=\"true\"\n className=\"h-7 w-7 shrink-0 rounded-md border border-gray-200 dark:border-gray-700\"\n style={{ backgroundColor: currentColor.format(\"rgba\") }}\n />\n <span className=\"min-w-0 flex-1 truncate font-mono text-sm text-gray-800 dark:text-white/90\">\n {display}\n </span>\n <svg\n aria-hidden=\"true\"\n className={cn(\n \"h-4 w-4 shrink-0 text-gray-500 transition-transform dark:text-gray-400\",\n isOpen && \"rotate-180\"\n )}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path d=\"m6 9 6 6 6-6\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </button>\n\n {isOpen && typeof document !== \"undefined\" && createPortal(\n <div\n ref={popupRef}\n role=\"dialog\"\n aria-label={label ? `${label} color picker` : \"Color picker\"}\n className={cn(\n \"fixed rounded-2xl border border-gray-200 bg-white p-3 shadow-theme-lg dark:border-gray-700 dark:bg-gray-900\",\n layers.portal\n )}\n style={{\n left: popupPosition.left,\n top: popupPosition.top,\n width: popupPosition.width,\n }}\n >\n <RBColorPicker\n color={colorInput}\n onChange={handlePickerChange}\n className=\"h-auto w-full\"\n >\n {/* Overflow would clip the drag knobs beyond the track bounds. */}\n <RBColorPicker.Saturation className=\"mb-4 h-40 rounded-lg\" />\n <div className=\"flex items-center gap-3\">\n {withEyeDropper && (\n <RBColorPicker.EyeDropper className=\"flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border border-gray-300 text-gray-600 hover:bg-gray-50 dark:border-gray-700 dark:text-gray-300 dark:hover:bg-white/[0.03]\">\n {pipetteIcon}\n </RBColorPicker.EyeDropper>\n )}\n <div className=\"flex flex-1 flex-col gap-3\">\n <RBColorPicker.Hue className=\"h-4\" />\n <RBColorPicker.Alpha className=\"h-4\" />\n </div>\n </div>\n </RBColorPicker>\n\n {showInput && (\n <div className=\"mt-4 flex items-stretch gap-2\">\n {formats.length > 1 && (\n <span className=\"relative shrink-0\">\n <select\n aria-label=\"Color format\"\n value={format}\n onChange={(e) => handleFormatChange(e.target.value as ColorPickerFormat)}\n className=\"h-11 appearance-none rounded-lg border border-gray-300 bg-transparent pl-3 pr-8 text-sm text-gray-700 focus:outline-hidden dark:border-gray-700 dark:text-gray-300\"\n >\n {formats.map((f) => (\n <option key={f} value={f}>\n {f.toUpperCase()}\n </option>\n ))}\n </select>\n <svg\n aria-hidden=\"true\"\n className=\"pointer-events-none absolute right-2.5 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path d=\"m6 9 6 6 6-6\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </span>\n )}\n <input\n aria-label=\"Color value\"\n value={inputValue}\n onChange={(e) => handleInputChange(e.target.value)}\n onBlur={() => setDraft(null)}\n className=\"h-11 min-w-0 flex-1 rounded-lg border border-gray-300 bg-transparent px-3 font-mono text-sm text-gray-800 focus:outline-hidden dark:border-gray-700 dark:text-white/90\"\n />\n </div>\n )}\n </div>,\n document.body\n )}\n </div>\n );\n};\n"]}
1
+ {"version":3,"sources":["../src/components/ColorPicker/ColorPicker.tsx"],"names":["RBColorPicker"],"mappings":"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","file":"chunk-X3OP55FG.js","sourcesContent":["\"use client\";\nimport React, {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ColorPicker as RBColorPicker, Color } from \"react-beautiful-color\";\nimport { cn } from \"../../lib/cn\";\nimport { layers } from \"../../lib/layers\";\n\n// `react-beautiful-color` doesn't re-export these types from its entry, so\n// derive them from the values its API does expose.\ntype Hsva = ReturnType<Color[\"getHsva\"]>;\ntype ColorInput = ConstructorParameters<typeof Color>[0] & { type: string };\n\nexport type ColorPickerFormat = \"hex\" | \"rgb\" | \"rgba\" | \"hsl\" | \"hsla\";\n\nexport interface ColorPickerProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n /** Initial color (uncontrolled). Any hex string, e.g. `\"#3641f5\"`. */\n defaultValue?: string;\n /** Format selected on first render. Default: `\"hex\"`. */\n defaultFormat?: ColorPickerFormat;\n /** Formats offered in the switcher. Default: all five. */\n formats?: ColorPickerFormat[];\n /** Render the value input + format switcher. Default: `true`. */\n showInput?: boolean;\n /** Show the native eye-dropper button (browser support varies). */\n withEyeDropper?: boolean;\n /** Optional label rendered above the picker. */\n label?: string;\n /** Fires on every change with the formatted string and the `Color` instance. */\n onChange?: (value: string, color: Color) => void;\n}\n\nconst ALL_FORMATS: ColorPickerFormat[] = [\"hex\", \"rgb\", \"rgba\", \"hsl\", \"hsla\"];\n\n/** Parse the text in the input back into a `ColorInput`, or `null` if invalid. */\nfunction parseValue(text: string, format: ColorPickerFormat): ColorInput | null {\n const t = text.trim();\n if (format === \"hex\") {\n return /^#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)\n ? { type: \"hex\", value: t }\n : null;\n }\n const n = t.match(/-?\\d*\\.?\\d+/g)?.map(Number) ?? [];\n if (format === \"rgb\" && n.length >= 3) return { type: \"rgb\", r: n[0], g: n[1], b: n[2] };\n if (format === \"rgba\" && n.length >= 4)\n return { type: \"rgba\", r: n[0], g: n[1], b: n[2], a: n[3] };\n if (format === \"hsl\" && n.length >= 3) return { type: \"hsl\", h: n[0], s: n[1], l: n[2] };\n if (format === \"hsla\" && n.length >= 4)\n return { type: \"hsla\", h: n[0], s: n[1], l: n[2], a: n[3] };\n return null;\n}\n\n/** Format a `Color` into the requested CSS string. */\nfunction colorToString(color: Color, format: ColorPickerFormat): string {\n switch (format) {\n case \"hex\": {\n const { r, g, b } = color.getRgb();\n const a = color.getRgba().a;\n const hex = `#${[r, g, b].map((v) => Math.round(v).toString(16).padStart(2, \"0\")).join(\"\")}`;\n return a < 1\n ? `${hex}${Math.round(a * 255).toString(16).padStart(2, \"0\")}`\n : hex;\n }\n case \"rgb\": {\n const { r, g, b } = color.getRgb();\n return `rgb(${r}, ${g}, ${b})`;\n }\n case \"rgba\": {\n const { r, g, b, a } = color.getRgba();\n return `rgba(${r}, ${g}, ${b}, ${a})`;\n }\n case \"hsl\": {\n const { h, s, l } = color.getHsl();\n return `hsl(${h}, ${s}%, ${l}%)`;\n }\n case \"hsla\": {\n const { h, s, l, a } = color.getHsla();\n return `hsla(${h}, ${s}%, ${l}%, ${a})`;\n }\n default:\n return color.getHex();\n }\n}\n\nconst pipetteIcon = (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M19.5 3.5a2.12 2.12 0 0 0-3 0l-2.3 2.3-1-1-1.4 1.4 1 1L4 14.9V19h4.1l7.7-7.7 1 1 1.4-1.4-1-1 2.3-2.3a2.12 2.12 0 0 0 0-3ZM7.3 17.6H6v-1.3l6.6-6.6 1.3 1.3-6.6 6.6Z\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport const ColorPicker: React.FC<ColorPickerProps> = ({\n defaultValue = \"#3641f5\",\n defaultFormat = \"hex\",\n formats = ALL_FORMATS,\n showInput = true,\n withEyeDropper = false,\n label,\n onChange,\n className,\n ...rest\n}) => {\n // Internal state lives in full-fidelity HSVA — the picker's native space.\n // Feeding anything lossier (e.g. hex) back into the controlled picker makes\n // the knobs fight the cursor (hue/alpha collapse on round-trip), which is\n // why drag would freeze or snap.\n const [hsva, setHsva] = useState<Hsva>(() =>\n new Color({ type: \"hex\", value: defaultValue }).getHsva()\n );\n const [format, setFormat] = useState<ColorPickerFormat>(defaultFormat);\n const [isOpen, setIsOpen] = useState(false);\n const [popupPosition, setPopupPosition] = useState({\n left: 0,\n top: 0,\n width: 320,\n });\n // While the input is focused we keep a raw draft so partial/invalid typing\n // isn't clobbered by the normalized value.\n const [draft, setDraft] = useState<string | null>(null);\n // HSVA is integer-quantized, so we keep the user's exact text (defaultValue\n // or typed) and show it verbatim until the picker actually changes color.\n const [exact, setExact] = useState<{ format: ColorPickerFormat; value: string } | null>(\n () => ({ format: \"hex\", value: defaultValue })\n );\n\n const colorInput = useMemo(() => ({ type: \"hsva\" as const, ...hsva }), [hsva]);\n const currentColor = useMemo(() => new Color(colorInput), [colorInput]);\n const display =\n exact && exact.format === format ? exact.value : colorToString(currentColor, format);\n const inputValue = draft ?? display;\n\n // The picker's internal drag layer unbinds its document listeners whenever\n // the `onChange` identity changes (its cleanup effect depends on it), which\n // would kill an in-flight drag after the first tick. Keep the handler\n // identity-stable and read mutable values through refs.\n const hsvaRef = useRef(hsva);\n hsvaRef.current = hsva;\n const formatRef = useRef(format);\n formatRef.current = format;\n const onChangeRef = useRef(onChange);\n onChangeRef.current = onChange;\n const rootRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLButtonElement>(null);\n const popupRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!isOpen) return;\n\n const handlePointerDown = (event: MouseEvent) => {\n const target = event.target as Node;\n if (\n rootRef.current &&\n !rootRef.current.contains(target) &&\n !popupRef.current?.contains(target)\n ) {\n setIsOpen(false);\n }\n };\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") setIsOpen(false);\n };\n\n document.addEventListener(\"mousedown\", handlePointerDown);\n document.addEventListener(\"keydown\", handleEscape);\n return () => {\n document.removeEventListener(\"mousedown\", handlePointerDown);\n document.removeEventListener(\"keydown\", handleEscape);\n };\n }, [isOpen]);\n\n const updatePopupPosition = useCallback(() => {\n const trigger = triggerRef.current;\n if (!trigger) return;\n\n const rect = trigger.getBoundingClientRect();\n const viewportPadding = 16;\n const gap = 8;\n const width = Math.min(320, window.innerWidth - viewportPadding * 2);\n const popupHeight = popupRef.current?.offsetHeight ?? 306;\n const fitsBelow = window.innerHeight - rect.bottom - gap >= popupHeight;\n const top = fitsBelow || rect.top < popupHeight + gap\n ? rect.bottom + gap\n : rect.top - popupHeight - gap;\n const left = Math.min(\n Math.max(rect.left, viewportPadding),\n window.innerWidth - width - viewportPadding\n );\n\n setPopupPosition({ left, top: Math.max(viewportPadding, top), width });\n }, []);\n\n useLayoutEffect(() => {\n if (!isOpen) return;\n\n updatePopupPosition();\n window.addEventListener(\"resize\", updatePopupPosition);\n window.addEventListener(\"scroll\", updatePopupPosition, true);\n return () => {\n window.removeEventListener(\"resize\", updatePopupPosition);\n window.removeEventListener(\"scroll\", updatePopupPosition, true);\n };\n }, [isOpen, updatePopupPosition]);\n\n const handlePickerChange = useCallback((next: Color) => {\n const nv = next.getHsva();\n const cur = hsvaRef.current;\n // The picker re-emits the current color on mount; ignore no-op changes so\n // the exact defaultValue isn't clobbered.\n if (nv.h === cur.h && nv.s === cur.s && nv.v === cur.v && nv.a === cur.a) return;\n setHsva(nv);\n setExact(null);\n setDraft(null);\n onChangeRef.current?.(colorToString(next, formatRef.current), next);\n }, []);\n\n const handleFormatChange = (f: ColorPickerFormat) => {\n setFormat(f);\n setDraft(null);\n onChange?.(\n exact && exact.format === f ? exact.value : colorToString(currentColor, f),\n currentColor\n );\n };\n\n const handleInputChange = (text: string) => {\n setDraft(text);\n const parsed = parseValue(text, format);\n if (parsed) {\n const c = new Color(parsed);\n setHsva(c.getHsva());\n setExact({ format, value: text.trim() });\n onChange?.(text.trim(), c);\n }\n };\n\n return (\n <div\n ref={rootRef}\n className={cn(\"relative w-full max-w-xs\", className)}\n {...rest}\n >\n {label && (\n <span className=\"mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400\">\n {label}\n </span>\n )}\n <button\n ref={triggerRef}\n type=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={isOpen}\n aria-label={label ? `Open ${label} color picker` : \"Open color picker\"}\n onClick={() => setIsOpen((open) => !open)}\n className=\"flex h-11 w-full items-center gap-3 rounded-lg border border-gray-300 bg-white px-3 text-left shadow-theme-xs transition hover:bg-gray-50 focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:hover:bg-white/[0.03] dark:focus:border-brand-800\"\n >\n <span\n aria-hidden=\"true\"\n className=\"h-7 w-7 shrink-0 rounded-md border border-gray-200 dark:border-gray-700\"\n style={{ backgroundColor: currentColor.format(\"rgba\") }}\n />\n <span className=\"min-w-0 flex-1 truncate font-mono text-sm text-gray-800 dark:text-white/90\">\n {display}\n </span>\n <svg\n aria-hidden=\"true\"\n className={cn(\n \"h-4 w-4 shrink-0 text-gray-500 transition-transform dark:text-gray-400\",\n isOpen && \"rotate-180\"\n )}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path d=\"m6 9 6 6 6-6\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </button>\n\n {isOpen && typeof document !== \"undefined\" && createPortal(\n <div\n ref={popupRef}\n role=\"dialog\"\n aria-label={label ? `${label} color picker` : \"Color picker\"}\n className={cn(\n \"fixed rounded-2xl border border-gray-200 bg-white p-3 shadow-theme-lg dark:border-gray-700 dark:bg-gray-900\",\n layers.portal\n )}\n style={{\n left: popupPosition.left,\n top: popupPosition.top,\n width: popupPosition.width,\n }}\n >\n <RBColorPicker\n color={colorInput}\n onChange={handlePickerChange}\n className=\"h-auto w-full\"\n >\n {/* Overflow would clip the drag knobs beyond the track bounds. */}\n <RBColorPicker.Saturation className=\"mb-4 h-40 rounded-lg\" />\n <div className=\"flex items-center gap-3\">\n {withEyeDropper && (\n <RBColorPicker.EyeDropper className=\"flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border border-gray-300 text-gray-600 hover:bg-gray-50 dark:border-gray-700 dark:text-gray-300 dark:hover:bg-white/[0.03]\">\n {pipetteIcon}\n </RBColorPicker.EyeDropper>\n )}\n <div className=\"flex flex-1 flex-col gap-3\">\n <RBColorPicker.Hue className=\"h-4\" />\n <RBColorPicker.Alpha className=\"h-4\" />\n </div>\n </div>\n </RBColorPicker>\n\n {showInput && (\n <div className=\"mt-4 flex items-stretch gap-2\">\n {formats.length > 1 && (\n <span className=\"relative shrink-0\">\n <select\n aria-label=\"Color format\"\n value={format}\n onChange={(e) => handleFormatChange(e.target.value as ColorPickerFormat)}\n className=\"h-11 appearance-none rounded-lg border border-gray-300 bg-white pl-3 pr-8 text-sm text-gray-700 focus:outline-hidden dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300\"\n >\n {formats.map((f) => (\n <option key={f} value={f}>\n {f.toUpperCase()}\n </option>\n ))}\n </select>\n <svg\n aria-hidden=\"true\"\n className=\"pointer-events-none absolute right-2.5 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path d=\"m6 9 6 6 6-6\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n </span>\n )}\n <input\n aria-label=\"Color value\"\n value={inputValue}\n onChange={(e) => handleInputChange(e.target.value)}\n onBlur={() => setDraft(null)}\n className=\"h-11 min-w-0 flex-1 rounded-lg border border-gray-300 bg-white px-3 font-mono text-sm text-gray-800 focus:outline-hidden dark:border-gray-700 dark:bg-gray-900 dark:text-white/90\"\n />\n </div>\n )}\n </div>,\n document.body\n )}\n </div>\n );\n};\n"]}
package/dist/components/ColorPicker/ColorPicker.cjs CHANGED
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  'use strict';
3
3
 
4
- var chunkONDBG6EY_cjs = require('../../chunk-ONDBG6EY.cjs');
4
+ var chunkH4UQ67RI_cjs = require('../../chunk-H4UQ67RI.cjs');
5
5
  require('../../chunk-TF3G3E72.cjs');
6
6
  require('../../chunk-YERNSNT4.cjs');
7
7
 
@@ -9,7 +9,7 @@ require('../../chunk-YERNSNT4.cjs');
9
9
 
10
10
  Object.defineProperty(exports, "ColorPicker", {
11
11
  enumerable: true,
12
- get: function () { return chunkONDBG6EY_cjs.ColorPicker; }
12
+ get: function () { return chunkH4UQ67RI_cjs.ColorPicker; }
13
13
  });
14
14
  //# sourceMappingURL=ColorPicker.cjs.map
15
15
  //# sourceMappingURL=ColorPicker.cjs.map
package/dist/components/ColorPicker/ColorPicker.js CHANGED
@@ -1,5 +1,5 @@
1
1
  "use client";
2
- export { ColorPicker } from '../../chunk-ASRYDS2W.js';
2
+ export { ColorPicker } from '../../chunk-X3OP55FG.js';
3
3
  import '../../chunk-VX7S6VYG.js';
4
4
  import '../../chunk-ZLIYUUA4.js';
5
5
  //# sourceMappingURL=ColorPicker.js.map
package/dist/index.cjs CHANGED
@@ -6,7 +6,7 @@ var chunk3EE6CPHW_cjs = require('./chunk-3EE6CPHW.cjs');
6
6
  var chunkBMN432QX_cjs = require('./chunk-BMN432QX.cjs');
7
7
  var chunkHT7SQXRF_cjs = require('./chunk-HT7SQXRF.cjs');
8
8
  var chunkS4ADL5B7_cjs = require('./chunk-S4ADL5B7.cjs');
9
- var chunkONDBG6EY_cjs = require('./chunk-ONDBG6EY.cjs');
9
+ var chunkH4UQ67RI_cjs = require('./chunk-H4UQ67RI.cjs');
10
10
  var chunkTF3G3E72_cjs = require('./chunk-TF3G3E72.cjs');
11
11
  var chunkYERNSNT4_cjs = require('./chunk-YERNSNT4.cjs');
12
12
  var jsxRuntime = require('react/jsx-runtime');
@@ -649,14 +649,14 @@ var Input = ({
649
649
  style,
650
650
  ...rest
651
651
  }) => {
652
- const stateClass = disabled ? "text-gray-500 border-gray-300 cursor-not-allowed dark:bg-gray-800 dark:text-gray-400 dark:border-gray-700" : error ? "text-error-800 border-error-500 focus:ring-3 focus:ring-error-500/10 dark:text-error-400 dark:border-error-500" : success ? "text-success-500 border-success-400 focus:ring-success-500/10 focus:border-success-300 dark:text-success-400 dark:border-success-500" : "bg-transparent text-gray-800 border-gray-300 focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:focus:border-brand-800";
652
+ const stateClass = disabled ? "text-gray-500 border-gray-300 cursor-not-allowed dark:bg-gray-800 dark:text-gray-400 dark:border-gray-700" : error ? "text-error-800 border-error-500 focus:ring-3 focus:ring-error-500/10 dark:text-error-400 dark:border-error-500" : success ? "text-success-500 border-success-400 focus:ring-success-500/10 focus:border-success-300 dark:text-success-400 dark:border-success-500" : "text-gray-800 border-gray-300 focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:text-white/90 dark:focus:border-brand-800";
653
653
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
654
654
  /* @__PURE__ */ jsxRuntime.jsx(
655
655
  "input",
656
656
  {
657
657
  disabled,
658
658
  className: chunkYERNSNT4_cjs.cn(
659
- "h-11 w-full rounded-lg border appearance-none px-4 py-2.5 text-sm shadow-theme-xs placeholder:text-gray-400 focus:outline-hidden focus:ring-3 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800",
659
+ "h-11 w-full rounded-lg border bg-white appearance-none px-4 py-2.5 text-sm shadow-theme-xs placeholder:text-gray-400 focus:outline-hidden focus:ring-3 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800",
660
660
  stateClass,
661
661
  className
662
662
  ),
@@ -2226,7 +2226,7 @@ var TextArea = ({
2226
2226
  onChange(e.target.value);
2227
2227
  }
2228
2228
  };
2229
- const stateClass = disabled ? "bg-gray-100 opacity-50 text-gray-500 border-gray-300 cursor-not-allowed dark:bg-gray-800 dark:text-gray-400 dark:border-gray-700" : error ? "bg-transparent text-gray-400 border-gray-300 focus:border-error-300 focus:ring-3 focus:ring-error-500/10 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:focus:border-error-800" : "bg-transparent text-gray-400 border-gray-300 focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:focus:border-brand-800";
2229
+ const stateClass = disabled ? "bg-gray-100 opacity-50 text-gray-500 border-gray-300 cursor-not-allowed dark:bg-gray-800 dark:text-gray-400 dark:border-gray-700" : error ? "bg-white text-gray-400 border-gray-300 focus:border-error-300 focus:ring-3 focus:ring-error-500/10 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:focus:border-error-800" : "bg-white text-gray-400 border-gray-300 focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:focus:border-brand-800";
2230
2230
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
2231
2231
  /* @__PURE__ */ jsxRuntime.jsx(
2232
2232
  "textarea",
@@ -2560,7 +2560,7 @@ var Select = ({
2560
2560
  "aria-haspopup": "listbox",
2561
2561
  "aria-expanded": isOpen,
2562
2562
  className: chunkYERNSNT4_cjs.cn(
2563
- "flex h-11 w-full items-center justify-between rounded-lg border border-gray-300 px-4 py-2.5 text-left text-sm shadow-theme-xs transition focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:focus:border-brand-800",
2563
+ "flex h-11 w-full items-center justify-between rounded-lg border border-gray-300 bg-white px-4 py-2.5 text-left text-sm shadow-theme-xs transition focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:focus:border-brand-800",
2564
2564
  disabled && "cursor-not-allowed opacity-50",
2565
2565
  selectedLabel ? "text-gray-800 dark:text-white/90" : "text-gray-400 dark:text-gray-400"
2566
2566
  ),
@@ -2674,7 +2674,7 @@ var MultiSelect = ({
2674
2674
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full", children: [
2675
2675
  /* @__PURE__ */ jsxRuntime.jsx("label", { className: "mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400", children: label }),
2676
2676
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative inline-block w-full", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col items-center", children: [
2677
- /* @__PURE__ */ jsxRuntime.jsx("div", { onClick: toggleDropdown, className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex h-11 rounded-lg border border-gray-300 py-1.5 px-4 shadow-theme-xs outline-hidden transition focus:border-brand-300 focus:shadow-focus-ring dark:border-gray-700 dark:bg-gray-900 dark:focus:border-brand-300", children: [
2677
+ /* @__PURE__ */ jsxRuntime.jsx("div", { onClick: toggleDropdown, className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex h-11 rounded-lg border border-gray-300 bg-white py-1.5 px-4 shadow-theme-xs outline-hidden transition focus:border-brand-300 focus:shadow-focus-ring dark:border-gray-700 dark:bg-gray-900 dark:focus:border-brand-300", children: [
2678
2678
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap flex-auto gap-2", children: selectedValuesText.length > 0 ? selectedValuesText.map((text, index) => /* @__PURE__ */ jsxRuntime.jsxs(
2679
2679
  "div",
2680
2680
  {
@@ -2814,7 +2814,7 @@ var FileInput = ({ className, ...rest }) => {
2814
2814
  {
2815
2815
  type: "file",
2816
2816
  className: chunkYERNSNT4_cjs.cn(
2817
- "focus:border-ring-brand-300 h-11 w-full overflow-hidden rounded-lg border border-gray-300 bg-transparent text-sm text-gray-500 shadow-theme-xs transition-colors file:mr-5 file:border-collapse file:cursor-pointer file:rounded-l-lg file:border-0 file:border-r file:border-solid file:border-gray-200 file:bg-gray-50 file:py-3 file:pl-3.5 file:pr-3 file:text-sm file:text-gray-700 placeholder:text-gray-400 hover:file:bg-gray-100 focus:outline-hidden focus:file:ring-brand-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-400 dark:text-white/90 dark:file:border-gray-800 dark:file:bg-white/[0.03] dark:file:text-gray-400 dark:placeholder:text-gray-400",
2817
+ "focus:border-ring-brand-300 h-11 w-full overflow-hidden rounded-lg border border-gray-300 bg-white text-sm text-gray-500 shadow-theme-xs transition-colors file:mr-5 file:border-collapse file:cursor-pointer file:rounded-l-lg file:border-0 file:border-r file:border-solid file:border-gray-200 file:bg-gray-50 file:py-3 file:pl-3.5 file:pr-3 file:text-sm file:text-gray-700 placeholder:text-gray-400 hover:file:bg-gray-100 focus:outline-hidden focus:file:ring-brand-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-400 dark:text-white/90 dark:file:border-gray-800 dark:file:bg-white/[0.03] dark:file:text-gray-400 dark:placeholder:text-gray-400",
2818
2818
  className
2819
2819
  ),
2820
2820
  ...rest
@@ -2852,7 +2852,7 @@ var DatePicker = ({
2852
2852
  {
2853
2853
  id,
2854
2854
  placeholder,
2855
- className: "h-11 w-full rounded-lg border appearance-none pl-4 pr-11 py-2.5 text-sm shadow-theme-xs placeholder:text-gray-400 focus:outline-hidden focus:ring-3 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 bg-transparent text-gray-800 border-gray-300 focus:border-brand-300 focus:ring-brand-500/20 dark:border-gray-700 dark:focus:border-brand-800"
2855
+ className: "h-11 w-full rounded-lg border appearance-none pl-4 pr-11 py-2.5 text-sm shadow-theme-xs placeholder:text-gray-400 focus:outline-hidden focus:ring-3 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 bg-white text-gray-800 border-gray-300 focus:border-brand-300 focus:ring-brand-500/20 dark:border-gray-700 dark:focus:border-brand-800"
2856
2856
  }
2857
2857
  ),
2858
2858
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute text-gray-500 -translate-y-1/2 pointer-events-none right-3 top-1/2 dark:text-gray-400", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -2947,7 +2947,7 @@ var DateTimePicker = ({
2947
2947
  {
2948
2948
  id: `${id}-date`,
2949
2949
  placeholder,
2950
- className: "h-11 w-full appearance-none rounded-lg border border-gray-300 bg-transparent py-2.5 pl-4 pr-11 text-sm text-gray-800 shadow-theme-xs placeholder:text-gray-400 focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/20 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800"
2950
+ className: "h-11 w-full appearance-none rounded-lg border border-gray-300 bg-white py-2.5 pl-4 pr-11 text-sm text-gray-800 shadow-theme-xs placeholder:text-gray-400 focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/20 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800"
2951
2951
  }
2952
2952
  ),
2953
2953
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "size-6", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -2960,7 +2960,7 @@ var DateTimePicker = ({
2960
2960
  }
2961
2961
  ) }) })
2962
2962
  ] }),
2963
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-11 items-center rounded-lg border border-gray-300 bg-transparent px-3 text-sm text-gray-800 shadow-theme-xs focus-within:border-brand-300 focus-within:ring-3 focus-within:ring-brand-500/20 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:focus-within:border-brand-800", children: [
2963
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-11 items-center rounded-lg border border-gray-300 bg-white px-3 text-sm text-gray-800 shadow-theme-xs focus-within:border-brand-300 focus-within:ring-3 focus-within:ring-brand-500/20 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:focus-within:border-brand-800", children: [
2964
2964
  /* @__PURE__ */ jsxRuntime.jsx(
2965
2965
  "input",
2966
2966
  {
@@ -3012,7 +3012,7 @@ var PasswordInput = ({
3012
3012
  {
3013
3013
  type: show ? "text" : "password",
3014
3014
  className: chunkYERNSNT4_cjs.cn(
3015
- "h-11 w-full appearance-none rounded-lg border border-gray-300 bg-transparent py-2.5 pl-4 pr-11 text-sm text-gray-800 shadow-theme-xs placeholder:text-gray-400 focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800",
3015
+ "h-11 w-full appearance-none rounded-lg border border-gray-300 bg-white py-2.5 pl-4 pr-11 text-sm text-gray-800 shadow-theme-xs placeholder:text-gray-400 focus:border-brand-300 focus:outline-hidden focus:ring-3 focus:ring-brand-500/10 dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800",
3016
3016
  className
3017
3017
  ),
3018
3018
  ...rest
@@ -3172,7 +3172,7 @@ Object.defineProperty(exports, "Editor", {
3172
3172
  });
3173
3173
  Object.defineProperty(exports, "ColorPicker", {
3174
3174
  enumerable: true,
3175
- get: function () { return chunkONDBG6EY_cjs.ColorPicker; }
3175
+ get: function () { return chunkH4UQ67RI_cjs.ColorPicker; }
3176
3176
  });
3177
3177
  Object.defineProperty(exports, "cn", {
3178
3178
  enumerable: true,