asterui 0.12.24 → 0.12.26

package/dist/index11.js.map

@@ -1 +1 @@
-{"version":3,"file":"index11.js","sources":["../src/components/Checkbox.tsx"],"sourcesContent":["import React, { forwardRef, createContext, useContext } from 'react'\n\nexport interface CheckboxSwapConfig {\n  /** Content shown when checked */\n  on: React.ReactNode\n  /** Content shown when unchecked */\n  off: React.ReactNode\n  /** Animation effect for the swap transition */\n  effect?: 'rotate' | 'flip'\n}\n\nexport interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {\n  children?: React.ReactNode\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  color?: 'primary' | 'secondary' | 'accent' | 'neutral' | 'success' | 'warning' | 'info' | 'error'\n  indeterminate?: boolean\n  /** Swap mode: toggle between two visual states instead of showing a checkbox */\n  swap?: CheckboxSwapConfig\n  className?: string\n}\n\nexport interface CheckboxOptionType {\n  label: React.ReactNode\n  value: string | number\n  disabled?: boolean\n}\n\nexport interface CheckboxGroupProps {\n  children?: React.ReactNode\n  value?: (string | number)[]\n  defaultValue?: (string | number)[]\n  onChange?: (values: (string | number)[]) => void\n  disabled?: boolean\n  options?: (string | number | CheckboxOptionType)[]\n  /** Layout direction for options */\n  direction?: 'horizontal' | 'vertical'\n  className?: string\n}\n\ninterface CheckboxGroupContextValue {\n  value?: (string | number)[]\n  onChange?: (checkedValue: string | number, checked: boolean) => void\n  disabled?: boolean\n}\n\nconst CheckboxGroupContext = createContext<CheckboxGroupContextValue | null>(null)\n\nfunction CheckboxGroup({\n  children,\n  value,\n  defaultValue,\n  onChange,\n  disabled = false,\n  options,\n  direction = 'vertical',\n  className = ''\n}: CheckboxGroupProps) {\n  const [internalValue, setInternalValue] = React.useState<(string | number)[]>(defaultValue || [])\n  const currentValue = value !== undefined ? value : internalValue\n\n  const handleChange = (checkedValue: string | number, checked: boolean) => {\n    const newValue = checked\n      ? [...currentValue, checkedValue]\n      : currentValue.filter((v) => v !== checkedValue)\n\n    if (value === undefined) {\n      setInternalValue(newValue)\n    }\n    onChange?.(newValue)\n  }\n\n  const contextValue: CheckboxGroupContextValue = {\n    value: currentValue,\n    onChange: handleChange,\n    disabled,\n  }\n\n  // If options are provided, render checkboxes automatically\n  if (options) {\n    const directionClasses = direction === 'horizontal' ? 'flex flex-row flex-wrap gap-4' : 'flex flex-col'\n    return (\n      <CheckboxGroupContext.Provider value={contextValue}>\n        <div className={`${directionClasses} ${className}`.trim()}>\n          {options.map((option) => {\n            if (typeof option === 'string' || typeof option === 'number') {\n              return (\n                <label key={option} className=\"label cursor-pointer justify-start gap-2\">\n                  <CheckboxRoot value={option} />\n                  <span className=\"label-text\">{option}</span>\n                </label>\n              )\n            } else {\n              return (\n                <label key={option.value} className=\"label cursor-pointer justify-start gap-2\">\n                  <CheckboxRoot value={option.value} disabled={option.disabled} />\n                  <span className=\"label-text\">{option.label}</span>\n                </label>\n              )\n            }\n          })}\n        </div>\n      </CheckboxGroupContext.Provider>\n    )\n  }\n\n  return (\n    <CheckboxGroupContext.Provider value={contextValue}>\n      <div className={className}>{children}</div>\n    </CheckboxGroupContext.Provider>\n  )\n}\n\nconst CheckboxRoot = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      children,\n      size,\n      color,\n      indeterminate = false,\n      swap,\n      className = '',\n      value,\n      checked,\n      onChange,\n      disabled: disabledProp,\n      ...props\n    },\n    ref\n  ) => {\n    const groupContext = useContext(CheckboxGroupContext)\n\n    const sizeClasses = {\n      xs: 'checkbox-xs',\n      sm: 'checkbox-sm',\n      md: 'checkbox-md',\n      lg: 'checkbox-lg',\n      xl: 'checkbox-xl',\n    }\n\n    const colorClasses = {\n      primary: 'checkbox-primary',\n      secondary: 'checkbox-secondary',\n      accent: 'checkbox-accent',\n      neutral: 'checkbox-neutral',\n      success: 'checkbox-success',\n      warning: 'checkbox-warning',\n      info: 'checkbox-info',\n      error: 'checkbox-error',\n    }\n\n    const checkboxClasses = [\n      'checkbox',\n      size && sizeClasses[size],\n      color && colorClasses[color],\n    ]\n      .filter(Boolean)\n      .join(' ')\n\n    // If in a group, use group's value to determine checked state\n    const isChecked = groupContext && value !== undefined && (typeof value === 'string' || typeof value === 'number')\n      ? groupContext.value?.includes(value) ?? false\n      : checked\n\n    const isDisabled = groupContext?.disabled || disabledProp\n\n    const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n      if (groupContext && value !== undefined && (typeof value === 'string' || typeof value === 'number')) {\n        groupContext.onChange?.(value, e.target.checked)\n      }\n      onChange?.(e)\n    }\n\n    // Handle indeterminate state\n    const checkboxRef = React.useCallback(\n      (node: HTMLInputElement | null) => {\n        if (node) {\n          node.indeterminate = indeterminate\n        }\n        if (typeof ref === 'function') {\n          ref(node)\n        } else if (ref) {\n          ref.current = node\n        }\n      },\n      [indeterminate, ref]\n    )\n\n    const dataState = indeterminate ? 'indeterminate' : isChecked ? 'checked' : 'unchecked'\n\n    // Swap mode: render as a swap toggle instead of checkbox\n    if (swap) {\n      const swapClasses = [\n        'swap',\n        swap.effect === 'rotate' && 'swap-rotate',\n        swap.effect === 'flip' && 'swap-flip',\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')\n\n      return (\n        <label className={swapClasses}>\n          <input\n            ref={ref}\n            type=\"checkbox\"\n            checked={isChecked}\n            onChange={handleChange}\n            disabled={isDisabled}\n            data-state={dataState}\n            {...props}\n          />\n          <div className=\"swap-on\">{swap.on}</div>\n          <div className=\"swap-off\">{swap.off}</div>\n        </label>\n      )\n    }\n\n    const checkboxInput = (\n      <input\n        ref={checkboxRef}\n        type=\"checkbox\"\n        className={checkboxClasses}\n        value={value}\n        checked={isChecked}\n        onChange={handleChange}\n        disabled={isDisabled}\n        data-state={dataState}\n        {...props}\n      />\n    )\n\n    // If children provided, wrap in label\n    if (children) {\n      return (\n        <label className={`label cursor-pointer justify-start gap-2 ${className}`}>\n          {checkboxInput}\n          <span className=\"label-text\">{children}</span>\n        </label>\n      )\n    }\n\n    return checkboxInput\n  }\n)\n\nCheckboxRoot.displayName = 'Checkbox'\n\nexport const Checkbox = Object.assign(CheckboxRoot, {\n  Group: CheckboxGroup,\n})\n"],"names":["CheckboxGroupContext","createContext","CheckboxGroup","children","value","defaultValue","onChange","disabled","options","direction","className","internalValue","setInternalValue","React","currentValue","contextValue","checkedValue","checked","newValue","v","directionClasses","option","jsxs","jsx","CheckboxRoot","forwardRef","size","color","indeterminate","swap","disabledProp","props","ref","groupContext","useContext","sizeClasses","colorClasses","checkboxClasses","isChecked","isDisabled","handleChange","e","checkboxRef","node","dataState","swapClasses","checkboxInput","Checkbox"],"mappings":"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"}
+{"version":3,"file":"index11.js","sources":["../src/components/Checkbox.tsx"],"sourcesContent":["import React, { forwardRef, createContext, useContext } from 'react'\n\nexport interface CheckboxSwapConfig {\n  /** Content shown when checked */\n  on: React.ReactNode\n  /** Content shown when unchecked */\n  off: React.ReactNode\n  /** Animation effect for the swap transition */\n  effect?: 'rotate' | 'flip'\n}\n\nexport interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {\n  children?: React.ReactNode\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  color?: 'primary' | 'secondary' | 'accent' | 'neutral' | 'success' | 'warning' | 'info' | 'error'\n  indeterminate?: boolean\n  /** Swap mode: toggle between two visual states instead of showing a checkbox */\n  swap?: CheckboxSwapConfig\n  className?: string\n}\n\nexport interface CheckboxOptionType {\n  label: React.ReactNode\n  value: string | number\n  disabled?: boolean\n}\n\nexport interface CheckboxGroupProps {\n  children?: React.ReactNode\n  value?: (string | number)[]\n  defaultValue?: (string | number)[]\n  onChange?: (values: (string | number)[]) => void\n  disabled?: boolean\n  options?: (string | number | CheckboxOptionType)[]\n  /** Layout direction for options */\n  direction?: 'horizontal' | 'vertical'\n  className?: string\n}\n\ninterface CheckboxGroupContextValue {\n  value?: (string | number)[]\n  onChange?: (checkedValue: string | number, checked: boolean) => void\n  disabled?: boolean\n}\n\nconst CheckboxGroupContext = createContext<CheckboxGroupContextValue | null>(null)\n\nfunction CheckboxGroup({\n  children,\n  value,\n  defaultValue,\n  onChange,\n  disabled = false,\n  options,\n  direction = 'vertical',\n  className = ''\n}: CheckboxGroupProps) {\n  const [internalValue, setInternalValue] = React.useState<(string | number)[]>(defaultValue || [])\n  const currentValue = value !== undefined ? value : internalValue\n\n  const handleChange = (checkedValue: string | number, checked: boolean) => {\n    const newValue = checked\n      ? [...currentValue, checkedValue]\n      : currentValue.filter((v) => v !== checkedValue)\n\n    if (value === undefined) {\n      setInternalValue(newValue)\n    }\n    onChange?.(newValue)\n  }\n\n  const contextValue: CheckboxGroupContextValue = {\n    value: currentValue,\n    onChange: handleChange,\n    disabled,\n  }\n\n  // If options are provided, render checkboxes automatically\n  if (options) {\n    const directionClasses = direction === 'horizontal' ? 'flex flex-row flex-wrap gap-4' : 'flex flex-col'\n    return (\n      <CheckboxGroupContext.Provider value={contextValue}>\n        <div className={`${directionClasses} ${className}`.trim()}>\n          {options.map((option) => {\n            if (typeof option === 'string' || typeof option === 'number') {\n              return (\n                <label key={option} className=\"flex items-center cursor-pointer gap-2\">\n                  <CheckboxRoot value={option} />\n                  <span>{option}</span>\n                </label>\n              )\n            } else {\n              return (\n                <label key={option.value} className=\"flex items-center cursor-pointer gap-2\">\n                  <CheckboxRoot value={option.value} disabled={option.disabled} />\n                  <span>{option.label}</span>\n                </label>\n              )\n            }\n          })}\n        </div>\n      </CheckboxGroupContext.Provider>\n    )\n  }\n\n  return (\n    <CheckboxGroupContext.Provider value={contextValue}>\n      <div className={className}>{children}</div>\n    </CheckboxGroupContext.Provider>\n  )\n}\n\nconst CheckboxRoot = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      children,\n      size,\n      color,\n      indeterminate = false,\n      swap,\n      className = '',\n      value,\n      checked,\n      onChange,\n      disabled: disabledProp,\n      ...props\n    },\n    ref\n  ) => {\n    const groupContext = useContext(CheckboxGroupContext)\n\n    const sizeClasses = {\n      xs: 'checkbox-xs',\n      sm: 'checkbox-sm',\n      md: 'checkbox-md',\n      lg: 'checkbox-lg',\n      xl: 'checkbox-xl',\n    }\n\n    const colorClasses = {\n      primary: 'checkbox-primary',\n      secondary: 'checkbox-secondary',\n      accent: 'checkbox-accent',\n      neutral: 'checkbox-neutral',\n      success: 'checkbox-success',\n      warning: 'checkbox-warning',\n      info: 'checkbox-info',\n      error: 'checkbox-error',\n    }\n\n    const checkboxClasses = [\n      'checkbox',\n      size && sizeClasses[size],\n      color && colorClasses[color],\n    ]\n      .filter(Boolean)\n      .join(' ')\n\n    // If in a group, use group's value to determine checked state\n    const isChecked = groupContext && value !== undefined && (typeof value === 'string' || typeof value === 'number')\n      ? groupContext.value?.includes(value) ?? false\n      : checked\n\n    const isDisabled = groupContext?.disabled || disabledProp\n\n    const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n      if (groupContext && value !== undefined && (typeof value === 'string' || typeof value === 'number')) {\n        groupContext.onChange?.(value, e.target.checked)\n      }\n      onChange?.(e)\n    }\n\n    // Handle indeterminate state\n    const checkboxRef = React.useCallback(\n      (node: HTMLInputElement | null) => {\n        if (node) {\n          node.indeterminate = indeterminate\n        }\n        if (typeof ref === 'function') {\n          ref(node)\n        } else if (ref) {\n          ref.current = node\n        }\n      },\n      [indeterminate, ref]\n    )\n\n    const dataState = indeterminate ? 'indeterminate' : isChecked ? 'checked' : 'unchecked'\n\n    // Swap mode: render as a swap toggle instead of checkbox\n    if (swap) {\n      const swapClasses = [\n        'swap',\n        swap.effect === 'rotate' && 'swap-rotate',\n        swap.effect === 'flip' && 'swap-flip',\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')\n\n      return (\n        <label className={swapClasses}>\n          <input\n            ref={ref}\n            type=\"checkbox\"\n            checked={isChecked}\n            onChange={handleChange}\n            disabled={isDisabled}\n            data-state={dataState}\n            {...props}\n          />\n          <div className=\"swap-on\">{swap.on}</div>\n          <div className=\"swap-off\">{swap.off}</div>\n        </label>\n      )\n    }\n\n    const checkboxInput = (\n      <input\n        ref={checkboxRef}\n        type=\"checkbox\"\n        className={checkboxClasses}\n        value={value}\n        checked={isChecked}\n        onChange={handleChange}\n        disabled={isDisabled}\n        data-state={dataState}\n        {...props}\n      />\n    )\n\n    // If children provided, wrap in label\n    if (children) {\n      return (\n        <label className={`flex items-center cursor-pointer gap-2 ${className}`}>\n          {checkboxInput}\n          <span>{children}</span>\n        </label>\n      )\n    }\n\n    return checkboxInput\n  }\n)\n\nCheckboxRoot.displayName = 'Checkbox'\n\nexport const Checkbox = Object.assign(CheckboxRoot, {\n  Group: CheckboxGroup,\n})\n"],"names":["CheckboxGroupContext","createContext","CheckboxGroup","children","value","defaultValue","onChange","disabled","options","direction","className","internalValue","setInternalValue","React","currentValue","contextValue","checkedValue","checked","newValue","v","directionClasses","option","jsxs","jsx","CheckboxRoot","forwardRef","size","color","indeterminate","swap","disabledProp","props","ref","groupContext","useContext","sizeClasses","colorClasses","checkboxClasses","isChecked","isDisabled","handleChange","e","checkboxRef","node","dataState","swapClasses","checkboxInput","Checkbox"],"mappings":"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"}

package/dist/index13.js

@@ -1,4 +1,4 @@
-import { jsxs as N, jsx as h, Fragment as q } from "react/jsx-runtime";
+import { jsxs as N, jsx as d, Fragment as q } from "react/jsx-runtime";
 import { useState as x, useRef as z, useEffect as R, useCallback as D } from "react";
 const G = [
   "#000000",
@@ -82,47 +82,47 @@ const G = [
   "#20124d",
   "#4c1130"
 ];
-function J(o, r, c) {
-  r /= 100, c /= 100;
-  const i = r * Math.min(c, 1 - c), a = (t) => {
-    const l = (t + o / 30) % 12, u = c - i * Math.max(Math.min(l - 3, 9 - l, 1), -1);
+function J(r, o, c) {
+  o /= 100, c /= 100;
+  const i = o * Math.min(c, 1 - c), a = (t) => {
+    const l = (t + r / 30) % 12, u = c - i * Math.max(Math.min(l - 3, 9 - l, 1), -1);
     return Math.round(255 * u).toString(16).padStart(2, "0");
   };
   return `#${a(0)}${a(8)}${a(4)}`;
 }
-function w(o) {
-  const r = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(o);
-  if (!r) return { h: 0, s: 100, l: 50 };
-  let c = parseInt(r[1], 16) / 255, i = parseInt(r[2], 16) / 255, a = parseInt(r[3], 16) / 255;
+function w(r) {
+  const o = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(r);
+  if (!o) return { h: 0, s: 100, l: 50 };
+  let c = parseInt(o[1], 16) / 255, i = parseInt(o[2], 16) / 255, a = parseInt(o[3], 16) / 255;
   const t = Math.max(c, i, a), l = Math.min(c, i, a);
   let u = 0, f = 0;
   const p = (t + l) / 2;
   if (t !== l) {
-    const d = t - l;
-    switch (f = p > 0.5 ? d / (2 - t - l) : d / (t + l), t) {
+    const h = t - l;
+    switch (f = p > 0.5 ? h / (2 - t - l) : h / (t + l), t) {
       case c:
-        u = ((i - a) / d + (i < a ? 6 : 0)) / 6;
+        u = ((i - a) / h + (i < a ? 6 : 0)) / 6;
         break;
       case i:
-        u = ((a - c) / d + 2) / 6;
+        u = ((a - c) / h + 2) / 6;
         break;
       case a:
-        u = ((c - i) / d + 4) / 6;
+        u = ((c - i) / h + 4) / 6;
         break;
     }
   }
   return { h: Math.round(u * 360), s: Math.round(f * 100), l: Math.round(p * 100) };
 }
-function E(o) {
-  return /^#[0-9A-Fa-f]{6}$/.test(o);
+function E(r) {
+  return /^#[0-9A-Fa-f]{6}$/.test(r);
 }
-function M(o) {
-  let r = o.trim();
-  return r.startsWith("#") || (r = "#" + r), r.toLowerCase();
+function M(r) {
+  let o = r.trim();
+  return o.startsWith("#") || (o = "#" + o), o.toLowerCase();
 }
 function Z({
-  value: o = "#000000",
-  onChange: r,
+  value: r = "#000000",
+  onChange: o,
   mode: c = "both",
   presets: i = G,
   size: a = "md",
@@ -130,15 +130,15 @@ function Z({
   className: l = "",
   ...u
 }) {
-  const [f, p] = x(() => w(o)), [d, m] = x(o), [$, H] = x(!1), [v, I] = x(!1), k = z(null), C = z(null);
+  const [f, p] = x(() => w(r)), [h, m] = x(r), [$, H] = x(!1), [v, I] = x(!1), k = z(null), C = z(null);
   R(() => {
-    E(o) && (p(w(o)), m(o));
-  }, [o]);
+    E(r) && (p(w(r)), m(r));
+  }, [r]);
   const g = D((e) => {
     p(e);
     const n = J(e.h, e.s, e.l);
-    m(n), r?.(n);
-  }, [r]), S = D((e, n) => {
+    m(n), o?.(n);
+  }, [o]), S = D((e, n) => {
     if (!k.current || t) return;
     const s = k.current.getBoundingClientRect(), y = Math.max(0, Math.min(1, (e - s.left) / s.width)), V = Math.max(0, Math.min(1, (n - s.top) / s.height)), W = Math.round(y * 100), _ = Math.round((1 - V) * 100);
     g({ ...f, s: W, l: _ });
@@ -166,11 +166,11 @@ function Z({
     const n = e.target.value;
     m(n);
     const s = M(n);
-    E(s) && (p(w(s)), r?.(s));
+    E(s) && (p(w(s)), o?.(s));
   }, Y = (e) => {
     if (t) return;
     const n = M(e);
-    p(w(n)), m(n), r?.(n);
+    p(w(n)), m(n), o?.(n);
   }, b = {
     xs: { panel: "w-32 h-32", hue: "h-3", swatch: "w-4 h-4", input: "input-xs" },
     sm: { panel: "w-40 h-40", hue: "h-4", swatch: "w-5 h-5", input: "input-sm" },
@@ -179,7 +179,7 @@ function Z({
   }[a], F = c === "picker" || c === "both", j = c === "swatches" || c === "both", A = f.s / 100, B = 1 - f.l / 100, U = f.h / 360;
   return /* @__PURE__ */ N("div", { className: `inline-flex flex-col gap-3 ${t ? "opacity-50 pointer-events-none" : ""} ${l}`, ...u, children: [
     F && /* @__PURE__ */ N(q, { children: [
-      /* @__PURE__ */ h(
+      /* @__PURE__ */ d(
         "div",
         {
           ref: k,
@@ -191,7 +191,7 @@ function Z({
               `
           },
           onMouseDown: X,
-          children: /* @__PURE__ */ h(
+          children: /* @__PURE__ */ d(
             "div",
             {
               className: "absolute w-4 h-4 border-2 border-white rounded-full shadow-md pointer-events-none",
@@ -204,7 +204,7 @@ function Z({
           )
         }
       ),
-      /* @__PURE__ */ h(
+      /* @__PURE__ */ d(
         "div",
         {
           ref: C,
@@ -213,7 +213,7 @@ function Z({
             background: "linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)"
           },
           onMouseDown: P,
-          children: /* @__PURE__ */ h(
+          children: /* @__PURE__ */ d(
             "div",
             {
               className: "absolute top-1/2 w-3 h-full border-2 border-white rounded-sm shadow-md pointer-events-none",
@@ -227,20 +227,20 @@ function Z({
         }
       ),
       /* @__PURE__ */ N("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ h(
+        /* @__PURE__ */ d(
           "div",
           {
             className: "w-8 h-8 rounded border border-base-300 flex-shrink-0",
-            style: { backgroundColor: E(M(d)) ? M(d) : o }
+            style: { backgroundColor: E(M(h)) ? M(h) : r }
           }
         ),
-        /* @__PURE__ */ h(
+        /* @__PURE__ */ d(
           "input",
           {
             type: "text",
-            value: d,
+            value: h,
             onChange: T,
-            className: `input input-bordered ${b.input} w-full font-mono uppercase`,
+            className: `input ${b.input} w-full font-mono uppercase`,
             placeholder: "#000000",
             maxLength: 7,
             disabled: t
@@ -248,11 +248,11 @@ function Z({
         )
       ] })
     ] }),
-    j && /* @__PURE__ */ h("div", { className: "grid grid-cols-10 gap-1", children: i.map((e, n) => /* @__PURE__ */ h(
+    j && /* @__PURE__ */ d("div", { className: "grid grid-cols-10 gap-1", children: i.map((e, n) => /* @__PURE__ */ d(
       "button",
       {
         type: "button",
-        className: `${b.swatch} rounded border border-base-300 cursor-pointer hover:scale-110 transition-transform ${o.toLowerCase() === e.toLowerCase() ? "ring-2 ring-primary ring-offset-1" : ""}`,
+        className: `${b.swatch} rounded border border-base-300 cursor-pointer hover:scale-110 transition-transform ${r.toLowerCase() === e.toLowerCase() ? "ring-2 ring-primary ring-offset-1" : ""}`,
         style: { backgroundColor: e },
         onClick: () => Y(e),
         disabled: t,

package/dist/index13.js.map

@@ -1 +1 @@
-{"version":3,"file":"index13.js","sources":["../src/components/ColorPicker.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } from 'react'\n\nexport interface ColorPickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  value?: string\n  onChange?: (color: string) => void\n  mode?: 'swatches' | 'picker' | 'both'\n  presets?: string[]\n  size?: 'xs' | 'sm' | 'md' | 'lg'\n  disabled?: boolean\n}\n\nconst DEFAULT_PRESETS = [\n  '#000000', '#434343', '#666666', '#999999', '#b7b7b7', '#cccccc', '#d9d9d9', '#efefef', '#f3f3f3', '#ffffff',\n  '#980000', '#ff0000', '#ff9900', '#ffff00', '#00ff00', '#00ffff', '#4a86e8', '#0000ff', '#9900ff', '#ff00ff',\n  '#e6b8af', '#f4cccc', '#fce5cd', '#fff2cc', '#d9ead3', '#d0e0e3', '#c9daf8', '#cfe2f3', '#d9d2e9', '#ead1dc',\n  '#dd7e6b', '#ea9999', '#f9cb9c', '#ffe599', '#b6d7a8', '#a2c4c9', '#a4c2f4', '#9fc5e8', '#b4a7d6', '#d5a6bd',\n  '#cc4125', '#e06666', '#f6b26b', '#ffd966', '#93c47d', '#76a5af', '#6d9eeb', '#6fa8dc', '#8e7cc3', '#c27ba0',\n  '#a61c00', '#cc0000', '#e69138', '#f1c232', '#6aa84f', '#45818e', '#3c78d8', '#3d85c6', '#674ea7', '#a64d79',\n  '#85200c', '#990000', '#b45f06', '#bf9000', '#38761d', '#134f5c', '#1155cc', '#0b5394', '#351c75', '#741b47',\n  '#5b0f00', '#660000', '#783f04', '#7f6000', '#274e13', '#0c343d', '#1c4587', '#073763', '#20124d', '#4c1130',\n]\n\n// Convert HSL to Hex\nfunction hslToHex(h: number, s: number, l: number): string {\n  s /= 100\n  l /= 100\n  const a = s * Math.min(l, 1 - l)\n  const f = (n: number) => {\n    const k = (n + h / 30) % 12\n    const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1)\n    return Math.round(255 * color).toString(16).padStart(2, '0')\n  }\n  return `#${f(0)}${f(8)}${f(4)}`\n}\n\n// Convert Hex to HSL\nfunction hexToHsl(hex: string): { h: number; s: number; l: number } {\n  const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex)\n  if (!result) return { h: 0, s: 100, l: 50 }\n\n  let r = parseInt(result[1], 16) / 255\n  let g = parseInt(result[2], 16) / 255\n  let b = parseInt(result[3], 16) / 255\n\n  const max = Math.max(r, g, b)\n  const min = Math.min(r, g, b)\n  let h = 0\n  let s = 0\n  const l = (max + min) / 2\n\n  if (max !== min) {\n    const d = max - min\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min)\n    switch (max) {\n      case r:\n        h = ((g - b) / d + (g < b ? 6 : 0)) / 6\n        break\n      case g:\n        h = ((b - r) / d + 2) / 6\n        break\n      case b:\n        h = ((r - g) / d + 4) / 6\n        break\n    }\n  }\n\n  return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) }\n}\n\n// Validate hex color\nfunction isValidHex(hex: string): boolean {\n  return /^#[0-9A-Fa-f]{6}$/.test(hex)\n}\n\n// Normalize hex (add # if missing, uppercase)\nfunction normalizeHex(hex: string): string {\n  let normalized = hex.trim()\n  if (!normalized.startsWith('#')) {\n    normalized = '#' + normalized\n  }\n  return normalized.toLowerCase()\n}\n\nexport function ColorPicker({\n  value = '#000000',\n  onChange,\n  mode = 'both',\n  presets = DEFAULT_PRESETS,\n  size = 'md',\n  disabled = false,\n  className = '',\n  ...rest\n}: ColorPickerProps) {\n  const [hsl, setHsl] = useState(() => hexToHsl(value))\n  const [hexInput, setHexInput] = useState(value)\n  const [isDraggingSL, setIsDraggingSL] = useState(false)\n  const [isDraggingHue, setIsDraggingHue] = useState(false)\n  const slPanelRef = useRef<HTMLDivElement>(null)\n  const hueSliderRef = useRef<HTMLDivElement>(null)\n\n  // Sync internal state when value prop changes\n  useEffect(() => {\n    if (isValidHex(value)) {\n      setHsl(hexToHsl(value))\n      setHexInput(value)\n    }\n  }, [value])\n\n  const updateColor = useCallback((newHsl: { h: number; s: number; l: number }) => {\n    setHsl(newHsl)\n    const hex = hslToHex(newHsl.h, newHsl.s, newHsl.l)\n    setHexInput(hex)\n    onChange?.(hex)\n  }, [onChange])\n\n  // Saturation/Lightness panel handlers\n  const handleSLChange = useCallback((clientX: number, clientY: number) => {\n    if (!slPanelRef.current || disabled) return\n    const rect = slPanelRef.current.getBoundingClientRect()\n    const x = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width))\n    const y = Math.max(0, Math.min(1, (clientY - rect.top) / rect.height))\n\n    // Convert x,y to saturation and lightness\n    // x = saturation (0-100), y = lightness (100-0)\n    const s = Math.round(x * 100)\n    const l = Math.round((1 - y) * 100)\n    updateColor({ ...hsl, s, l })\n  }, [hsl, updateColor, disabled])\n\n  const handleSLMouseDown = (e: React.MouseEvent) => {\n    if (disabled) return\n    setIsDraggingSL(true)\n    handleSLChange(e.clientX, e.clientY)\n  }\n\n  // Hue slider handlers\n  const handleHueChange = useCallback((clientX: number) => {\n    if (!hueSliderRef.current || disabled) return\n    const rect = hueSliderRef.current.getBoundingClientRect()\n    const x = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width))\n    const h = Math.round(x * 360)\n    updateColor({ ...hsl, h })\n  }, [hsl, updateColor, disabled])\n\n  const handleHueMouseDown = (e: React.MouseEvent) => {\n    if (disabled) return\n    setIsDraggingHue(true)\n    handleHueChange(e.clientX)\n  }\n\n  // Global mouse handlers for dragging\n  useEffect(() => {\n    const handleMouseMove = (e: MouseEvent) => {\n      if (isDraggingSL) {\n        handleSLChange(e.clientX, e.clientY)\n      } else if (isDraggingHue) {\n        handleHueChange(e.clientX)\n      }\n    }\n\n    const handleMouseUp = () => {\n      setIsDraggingSL(false)\n      setIsDraggingHue(false)\n    }\n\n    if (isDraggingSL || isDraggingHue) {\n      document.addEventListener('mousemove', handleMouseMove)\n      document.addEventListener('mouseup', handleMouseUp)\n      return () => {\n        document.removeEventListener('mousemove', handleMouseMove)\n        document.removeEventListener('mouseup', handleMouseUp)\n      }\n    }\n  }, [isDraggingSL, isDraggingHue, handleSLChange, handleHueChange])\n\n  // Hex input handler\n  const handleHexChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = e.target.value\n    setHexInput(newValue)\n    const normalized = normalizeHex(newValue)\n    if (isValidHex(normalized)) {\n      setHsl(hexToHsl(normalized))\n      onChange?.(normalized)\n    }\n  }\n\n  // Preset click handler\n  const handlePresetClick = (color: string) => {\n    if (disabled) return\n    const normalized = normalizeHex(color)\n    setHsl(hexToHsl(normalized))\n    setHexInput(normalized)\n    onChange?.(normalized)\n  }\n\n  // Size configurations\n  const sizeConfig = {\n    xs: { panel: 'w-32 h-32', hue: 'h-3', swatch: 'w-4 h-4', input: 'input-xs' },\n    sm: { panel: 'w-40 h-40', hue: 'h-4', swatch: 'w-5 h-5', input: 'input-sm' },\n    md: { panel: 'w-48 h-48', hue: 'h-5', swatch: 'w-6 h-6', input: 'input-md' },\n    lg: { panel: 'w-56 h-56', hue: 'h-6', swatch: 'w-7 h-7', input: 'input-lg' },\n  }\n\n  const config = sizeConfig[size]\n  const showPicker = mode === 'picker' || mode === 'both'\n  const showSwatches = mode === 'swatches' || mode === 'both'\n\n  // Calculate picker position\n  const slX = hsl.s / 100\n  const slY = 1 - hsl.l / 100\n  const hueX = hsl.h / 360\n\n  return (\n    <div className={`inline-flex flex-col gap-3 ${disabled ? 'opacity-50 pointer-events-none' : ''} ${className}`} {...rest}>\n      {showPicker && (\n        <>\n          {/* Saturation/Lightness Panel */}\n          <div\n            ref={slPanelRef}\n            className={`${config.panel} relative rounded cursor-crosshair select-none`}\n            style={{\n              background: `\n                linear-gradient(to top, #000, transparent),\n                linear-gradient(to right, #fff, hsl(${hsl.h}, 100%, 50%))\n              `,\n            }}\n            onMouseDown={handleSLMouseDown}\n          >\n            {/* Picker indicator */}\n            <div\n              className=\"absolute w-4 h-4 border-2 border-white rounded-full shadow-md pointer-events-none\"\n              style={{\n                left: `calc(${slX * 100}% - 8px)`,\n                top: `calc(${slY * 100}% - 8px)`,\n                boxShadow: '0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)',\n              }}\n            />\n          </div>\n\n          {/* Hue Slider */}\n          <div\n            ref={hueSliderRef}\n            className={`${config.hue} w-full relative rounded cursor-pointer select-none`}\n            style={{\n              background: 'linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)',\n            }}\n            onMouseDown={handleHueMouseDown}\n          >\n            {/* Hue indicator */}\n            <div\n              className=\"absolute top-1/2 w-3 h-full border-2 border-white rounded-sm shadow-md pointer-events-none\"\n              style={{\n                left: `calc(${hueX * 100}% - 6px)`,\n                transform: 'translateY(-50%)',\n                boxShadow: '0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)',\n              }}\n            />\n          </div>\n\n          {/* Hex Input and Preview */}\n          <div className=\"flex items-center gap-2\">\n            <div\n              className=\"w-8 h-8 rounded border border-base-300 flex-shrink-0\"\n              style={{ backgroundColor: isValidHex(normalizeHex(hexInput)) ? normalizeHex(hexInput) : value }}\n            />\n            <input\n              type=\"text\"\n              value={hexInput}\n              onChange={handleHexChange}\n              className={`input input-bordered ${config.input} w-full font-mono uppercase`}\n              placeholder=\"#000000\"\n              maxLength={7}\n              disabled={disabled}\n            />\n          </div>\n        </>\n      )}\n\n      {showSwatches && (\n        <div className=\"grid grid-cols-10 gap-1\">\n          {presets.map((color, index) => (\n            <button\n              key={`${color}-${index}`}\n              type=\"button\"\n              className={`${config.swatch} rounded border border-base-300 cursor-pointer hover:scale-110 transition-transform ${\n                value.toLowerCase() === color.toLowerCase() ? 'ring-2 ring-primary ring-offset-1' : ''\n              }`}\n              style={{ backgroundColor: color }}\n              onClick={() => handlePresetClick(color)}\n              disabled={disabled}\n              aria-label={`Select color ${color}`}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["DEFAULT_PRESETS","hslToHex","h","s","l","a","f","n","k","color","hexToHsl","hex","result","r","g","b","max","min","isValidHex","normalizeHex","normalized","ColorPicker","value","onChange","mode","presets","size","disabled","className","rest","hsl","setHsl","useState","hexInput","setHexInput","isDraggingSL","setIsDraggingSL","isDraggingHue","setIsDraggingHue","slPanelRef","useRef","hueSliderRef","useEffect","updateColor","useCallback","newHsl","handleSLChange","clientX","clientY","rect","x","y","handleSLMouseDown","handleHueChange","handleHueMouseDown","handleMouseMove","e","handleMouseUp","handleHexChange","newValue","handlePresetClick","config","showPicker","showSwatches","slX","slY","hueX","jsxs","Fragment","jsx","index"],"mappings":";;AAWA,MAAMA,IAAkB;AAAA,EACtB;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EACnG;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EACnG;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EACnG;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EACnG;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EACnG;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EACnG;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EACnG;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AACrG;AAGA,SAASC,EAASC,GAAWC,GAAWC,GAAmB;AACzD,EAAAD,KAAK,KACLC,KAAK;AACL,QAAMC,IAAIF,IAAI,KAAK,IAAIC,GAAG,IAAIA,CAAC,GACzBE,IAAI,CAACC,MAAc;AACvB,UAAMC,KAAKD,IAAIL,IAAI,MAAM,IACnBO,IAAQL,IAAIC,IAAI,KAAK,IAAI,KAAK,IAAIG,IAAI,GAAG,IAAIA,GAAG,CAAC,GAAG,EAAE;AAC5D,WAAO,KAAK,MAAM,MAAMC,CAAK,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,GAAG;AAAA,EAC7D;AACA,SAAO,IAAIH,EAAE,CAAC,CAAC,GAAGA,EAAE,CAAC,CAAC,GAAGA,EAAE,CAAC,CAAC;AAC/B;AAGA,SAASI,EAASC,GAAkD;AAClE,QAAMC,IAAS,4CAA4C,KAAKD,CAAG;AACnE,MAAI,CAACC,EAAQ,QAAO,EAAE,GAAG,GAAG,GAAG,KAAK,GAAG,GAAA;AAEvC,MAAIC,IAAI,SAASD,EAAO,CAAC,GAAG,EAAE,IAAI,KAC9BE,IAAI,SAASF,EAAO,CAAC,GAAG,EAAE,IAAI,KAC9BG,IAAI,SAASH,EAAO,CAAC,GAAG,EAAE,IAAI;AAElC,QAAMI,IAAM,KAAK,IAAIH,GAAGC,GAAGC,CAAC,GACtBE,IAAM,KAAK,IAAIJ,GAAGC,GAAGC,CAAC;AAC5B,MAAIb,IAAI,GACJC,IAAI;AACR,QAAMC,KAAKY,IAAMC,KAAO;AAExB,MAAID,MAAQC,GAAK;AACf,UAAM,IAAID,IAAMC;AAEhB,YADAd,IAAIC,IAAI,MAAM,KAAK,IAAIY,IAAMC,KAAO,KAAKD,IAAMC,IACvCD,GAAA;AAAA,MACN,KAAKH;AACH,QAAAX,MAAMY,IAAIC,KAAK,KAAKD,IAAIC,IAAI,IAAI,MAAM;AACtC;AAAA,MACF,KAAKD;AACH,QAAAZ,MAAMa,IAAIF,KAAK,IAAI,KAAK;AACxB;AAAA,MACF,KAAKE;AACH,QAAAb,MAAMW,IAAIC,KAAK,IAAI,KAAK;AACxB;AAAA,IAAA;AAAA,EAEN;AAEA,SAAO,EAAE,GAAG,KAAK,MAAMZ,IAAI,GAAG,GAAG,GAAG,KAAK,MAAMC,IAAI,GAAG,GAAG,GAAG,KAAK,MAAMC,IAAI,GAAG,EAAA;AAChF;AAGA,SAASc,EAAWP,GAAsB;AACxC,SAAO,oBAAoB,KAAKA,CAAG;AACrC;AAGA,SAASQ,EAAaR,GAAqB;AACzC,MAAIS,IAAaT,EAAI,KAAA;AACrB,SAAKS,EAAW,WAAW,GAAG,MAC5BA,IAAa,MAAMA,IAEdA,EAAW,YAAA;AACpB;AAEO,SAASC,EAAY;AAAA,EAC1B,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAUzB;AAAA,EACV,MAAA0B,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAAqB;AACnB,QAAM,CAACC,GAAKC,CAAM,IAAIC,EAAS,MAAMtB,EAASY,CAAK,CAAC,GAC9C,CAACW,GAAUC,CAAW,IAAIF,EAASV,CAAK,GACxC,CAACa,GAAcC,CAAe,IAAIJ,EAAS,EAAK,GAChD,CAACK,GAAeC,CAAgB,IAAIN,EAAS,EAAK,GAClDO,IAAaC,EAAuB,IAAI,GACxCC,IAAeD,EAAuB,IAAI;AAGhD,EAAAE,EAAU,MAAM;AACd,IAAIxB,EAAWI,CAAK,MAClBS,EAAOrB,EAASY,CAAK,CAAC,GACtBY,EAAYZ,CAAK;AAAA,EAErB,GAAG,CAACA,CAAK,CAAC;AAEV,QAAMqB,IAAcC,EAAY,CAACC,MAAgD;AAC/E,IAAAd,EAAOc,CAAM;AACb,UAAMlC,IAAMV,EAAS4C,EAAO,GAAGA,EAAO,GAAGA,EAAO,CAAC;AACjD,IAAAX,EAAYvB,CAAG,GACfY,IAAWZ,CAAG;AAAA,EAChB,GAAG,CAACY,CAAQ,CAAC,GAGPuB,IAAiBF,EAAY,CAACG,GAAiBC,MAAoB;AACvE,QAAI,CAACT,EAAW,WAAWZ,EAAU;AACrC,UAAMsB,IAAOV,EAAW,QAAQ,sBAAA,GAC1BW,IAAI,KAAK,IAAI,GAAG,KAAK,IAAI,IAAIH,IAAUE,EAAK,QAAQA,EAAK,KAAK,CAAC,GAC/DE,IAAI,KAAK,IAAI,GAAG,KAAK,IAAI,IAAIH,IAAUC,EAAK,OAAOA,EAAK,MAAM,CAAC,GAI/D9C,IAAI,KAAK,MAAM+C,IAAI,GAAG,GACtB9C,IAAI,KAAK,OAAO,IAAI+C,KAAK,GAAG;AAClC,IAAAR,EAAY,EAAE,GAAGb,GAAK,GAAA3B,GAAG,GAAAC,GAAG;AAAA,EAC9B,GAAG,CAAC0B,GAAKa,GAAahB,CAAQ,CAAC,GAEzByB,IAAoB,CAAC,MAAwB;AACjD,IAAIzB,MACJS,EAAgB,EAAI,GACpBU,EAAe,EAAE,SAAS,EAAE,OAAO;AAAA,EACrC,GAGMO,IAAkBT,EAAY,CAACG,MAAoB;AACvD,QAAI,CAACN,EAAa,WAAWd,EAAU;AACvC,UAAMsB,IAAOR,EAAa,QAAQ,sBAAA,GAC5BS,IAAI,KAAK,IAAI,GAAG,KAAK,IAAI,IAAIH,IAAUE,EAAK,QAAQA,EAAK,KAAK,CAAC,GAC/D/C,IAAI,KAAK,MAAMgD,IAAI,GAAG;AAC5B,IAAAP,EAAY,EAAE,GAAGb,GAAK,GAAA5B,GAAG;AAAA,EAC3B,GAAG,CAAC4B,GAAKa,GAAahB,CAAQ,CAAC,GAEzB2B,IAAqB,CAAC,MAAwB;AAClD,IAAI3B,MACJW,EAAiB,EAAI,GACrBe,EAAgB,EAAE,OAAO;AAAA,EAC3B;AAGA,EAAAX,EAAU,MAAM;AACd,UAAMa,IAAkB,CAACC,MAAkB;AACzC,MAAIrB,IACFW,EAAeU,EAAE,SAASA,EAAE,OAAO,IAC1BnB,KACTgB,EAAgBG,EAAE,OAAO;AAAA,IAE7B,GAEMC,IAAgB,MAAM;AAC1B,MAAArB,EAAgB,EAAK,GACrBE,EAAiB,EAAK;AAAA,IACxB;AAEA,QAAIH,KAAgBE;AAClB,sBAAS,iBAAiB,aAAakB,CAAe,GACtD,SAAS,iBAAiB,WAAWE,CAAa,GAC3C,MAAM;AACX,iBAAS,oBAAoB,aAAaF,CAAe,GACzD,SAAS,oBAAoB,WAAWE,CAAa;AAAA,MACvD;AAAA,EAEJ,GAAG,CAACtB,GAAcE,GAAeS,GAAgBO,CAAe,CAAC;AAGjE,QAAMK,IAAkB,CAAC,MAA2C;AAClE,UAAMC,IAAW,EAAE,OAAO;AAC1B,IAAAzB,EAAYyB,CAAQ;AACpB,UAAMvC,IAAaD,EAAawC,CAAQ;AACxC,IAAIzC,EAAWE,CAAU,MACvBW,EAAOrB,EAASU,CAAU,CAAC,GAC3BG,IAAWH,CAAU;AAAA,EAEzB,GAGMwC,IAAoB,CAACnD,MAAkB;AAC3C,QAAIkB,EAAU;AACd,UAAMP,IAAaD,EAAaV,CAAK;AACrC,IAAAsB,EAAOrB,EAASU,CAAU,CAAC,GAC3Bc,EAAYd,CAAU,GACtBG,IAAWH,CAAU;AAAA,EACvB,GAUMyC,IAPa;AAAA,IACjB,IAAI,EAAE,OAAO,aAAa,KAAK,OAAO,QAAQ,WAAW,OAAO,WAAA;AAAA,IAChE,IAAI,EAAE,OAAO,aAAa,KAAK,OAAO,QAAQ,WAAW,OAAO,WAAA;AAAA,IAChE,IAAI,EAAE,OAAO,aAAa,KAAK,OAAO,QAAQ,WAAW,OAAO,WAAA;AAAA,IAChE,IAAI,EAAE,OAAO,aAAa,KAAK,OAAO,QAAQ,WAAW,OAAO,WAAA;AAAA,EAAW,EAGnDnC,CAAI,GACxBoC,IAAatC,MAAS,YAAYA,MAAS,QAC3CuC,IAAevC,MAAS,cAAcA,MAAS,QAG/CwC,IAAMlC,EAAI,IAAI,KACdmC,IAAM,IAAInC,EAAI,IAAI,KAClBoC,IAAOpC,EAAI,IAAI;AAErB,SACE,gBAAAqC,EAAC,OAAA,EAAI,WAAW,8BAA8BxC,IAAW,mCAAmC,EAAE,IAAIC,CAAS,IAAK,GAAGC,GAChH,UAAA;AAAA,IAAAiC,KACC,gBAAAK,EAAAC,GAAA,EAEE,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAK9B;AAAA,UACL,WAAW,GAAGsB,EAAO,KAAK;AAAA,UAC1B,OAAO;AAAA,YACL,YAAY;AAAA;AAAA,sDAE4B/B,EAAI,CAAC;AAAA;AAAA,UAAA;AAAA,UAG/C,aAAasB;AAAA,UAGb,UAAA,gBAAAiB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO;AAAA,gBACL,MAAM,QAAQL,IAAM,GAAG;AAAA,gBACvB,KAAK,QAAQC,IAAM,GAAG;AAAA,gBACtB,WAAW;AAAA,cAAA;AAAA,YACb;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,MAIF,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAK5B;AAAA,UACL,WAAW,GAAGoB,EAAO,GAAG;AAAA,UACxB,OAAO;AAAA,YACL,YAAY;AAAA,UAAA;AAAA,UAEd,aAAaP;AAAA,UAGb,UAAA,gBAAAe;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO;AAAA,gBACL,MAAM,QAAQH,IAAO,GAAG;AAAA,gBACxB,WAAW;AAAA,gBACX,WAAW;AAAA,cAAA;AAAA,YACb;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,MAIF,gBAAAC,EAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,QAAA,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO,EAAE,iBAAiBnD,EAAWC,EAAac,CAAQ,CAAC,IAAId,EAAac,CAAQ,IAAIX,EAAA;AAAA,UAAM;AAAA,QAAA;AAAA,QAEhG,gBAAA+C;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,OAAOpC;AAAA,YACP,UAAUyB;AAAA,YACV,WAAW,wBAAwBG,EAAO,KAAK;AAAA,YAC/C,aAAY;AAAA,YACZ,WAAW;AAAA,YACX,UAAAlC;AAAA,UAAA;AAAA,QAAA;AAAA,MACF,EAAA,CACF;AAAA,IAAA,GACF;AAAA,IAGDoC,uBACE,OAAA,EAAI,WAAU,2BACZ,UAAAtC,EAAQ,IAAI,CAAChB,GAAO6D,MACnB,gBAAAD;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,MAAK;AAAA,QACL,WAAW,GAAGR,EAAO,MAAM,uFACzBvC,EAAM,YAAA,MAAkBb,EAAM,YAAA,IAAgB,sCAAsC,EACtF;AAAA,QACA,OAAO,EAAE,iBAAiBA,EAAA;AAAA,QAC1B,SAAS,MAAMmD,EAAkBnD,CAAK;AAAA,QACtC,UAAAkB;AAAA,QACA,cAAY,gBAAgBlB,CAAK;AAAA,MAAA;AAAA,MAR5B,GAAGA,CAAK,IAAI6D,CAAK;AAAA,IAAA,CAUzB,EAAA,CACH;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"index13.js","sources":["../src/components/ColorPicker.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } from 'react'\n\nexport interface ColorPickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  value?: string\n  onChange?: (color: string) => void\n  mode?: 'swatches' | 'picker' | 'both'\n  presets?: string[]\n  size?: 'xs' | 'sm' | 'md' | 'lg'\n  disabled?: boolean\n}\n\nconst DEFAULT_PRESETS = [\n  '#000000', '#434343', '#666666', '#999999', '#b7b7b7', '#cccccc', '#d9d9d9', '#efefef', '#f3f3f3', '#ffffff',\n  '#980000', '#ff0000', '#ff9900', '#ffff00', '#00ff00', '#00ffff', '#4a86e8', '#0000ff', '#9900ff', '#ff00ff',\n  '#e6b8af', '#f4cccc', '#fce5cd', '#fff2cc', '#d9ead3', '#d0e0e3', '#c9daf8', '#cfe2f3', '#d9d2e9', '#ead1dc',\n  '#dd7e6b', '#ea9999', '#f9cb9c', '#ffe599', '#b6d7a8', '#a2c4c9', '#a4c2f4', '#9fc5e8', '#b4a7d6', '#d5a6bd',\n  '#cc4125', '#e06666', '#f6b26b', '#ffd966', '#93c47d', '#76a5af', '#6d9eeb', '#6fa8dc', '#8e7cc3', '#c27ba0',\n  '#a61c00', '#cc0000', '#e69138', '#f1c232', '#6aa84f', '#45818e', '#3c78d8', '#3d85c6', '#674ea7', '#a64d79',\n  '#85200c', '#990000', '#b45f06', '#bf9000', '#38761d', '#134f5c', '#1155cc', '#0b5394', '#351c75', '#741b47',\n  '#5b0f00', '#660000', '#783f04', '#7f6000', '#274e13', '#0c343d', '#1c4587', '#073763', '#20124d', '#4c1130',\n]\n\n// Convert HSL to Hex\nfunction hslToHex(h: number, s: number, l: number): string {\n  s /= 100\n  l /= 100\n  const a = s * Math.min(l, 1 - l)\n  const f = (n: number) => {\n    const k = (n + h / 30) % 12\n    const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1)\n    return Math.round(255 * color).toString(16).padStart(2, '0')\n  }\n  return `#${f(0)}${f(8)}${f(4)}`\n}\n\n// Convert Hex to HSL\nfunction hexToHsl(hex: string): { h: number; s: number; l: number } {\n  const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex)\n  if (!result) return { h: 0, s: 100, l: 50 }\n\n  let r = parseInt(result[1], 16) / 255\n  let g = parseInt(result[2], 16) / 255\n  let b = parseInt(result[3], 16) / 255\n\n  const max = Math.max(r, g, b)\n  const min = Math.min(r, g, b)\n  let h = 0\n  let s = 0\n  const l = (max + min) / 2\n\n  if (max !== min) {\n    const d = max - min\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min)\n    switch (max) {\n      case r:\n        h = ((g - b) / d + (g < b ? 6 : 0)) / 6\n        break\n      case g:\n        h = ((b - r) / d + 2) / 6\n        break\n      case b:\n        h = ((r - g) / d + 4) / 6\n        break\n    }\n  }\n\n  return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) }\n}\n\n// Validate hex color\nfunction isValidHex(hex: string): boolean {\n  return /^#[0-9A-Fa-f]{6}$/.test(hex)\n}\n\n// Normalize hex (add # if missing, uppercase)\nfunction normalizeHex(hex: string): string {\n  let normalized = hex.trim()\n  if (!normalized.startsWith('#')) {\n    normalized = '#' + normalized\n  }\n  return normalized.toLowerCase()\n}\n\nexport function ColorPicker({\n  value = '#000000',\n  onChange,\n  mode = 'both',\n  presets = DEFAULT_PRESETS,\n  size = 'md',\n  disabled = false,\n  className = '',\n  ...rest\n}: ColorPickerProps) {\n  const [hsl, setHsl] = useState(() => hexToHsl(value))\n  const [hexInput, setHexInput] = useState(value)\n  const [isDraggingSL, setIsDraggingSL] = useState(false)\n  const [isDraggingHue, setIsDraggingHue] = useState(false)\n  const slPanelRef = useRef<HTMLDivElement>(null)\n  const hueSliderRef = useRef<HTMLDivElement>(null)\n\n  // Sync internal state when value prop changes\n  useEffect(() => {\n    if (isValidHex(value)) {\n      setHsl(hexToHsl(value))\n      setHexInput(value)\n    }\n  }, [value])\n\n  const updateColor = useCallback((newHsl: { h: number; s: number; l: number }) => {\n    setHsl(newHsl)\n    const hex = hslToHex(newHsl.h, newHsl.s, newHsl.l)\n    setHexInput(hex)\n    onChange?.(hex)\n  }, [onChange])\n\n  // Saturation/Lightness panel handlers\n  const handleSLChange = useCallback((clientX: number, clientY: number) => {\n    if (!slPanelRef.current || disabled) return\n    const rect = slPanelRef.current.getBoundingClientRect()\n    const x = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width))\n    const y = Math.max(0, Math.min(1, (clientY - rect.top) / rect.height))\n\n    // Convert x,y to saturation and lightness\n    // x = saturation (0-100), y = lightness (100-0)\n    const s = Math.round(x * 100)\n    const l = Math.round((1 - y) * 100)\n    updateColor({ ...hsl, s, l })\n  }, [hsl, updateColor, disabled])\n\n  const handleSLMouseDown = (e: React.MouseEvent) => {\n    if (disabled) return\n    setIsDraggingSL(true)\n    handleSLChange(e.clientX, e.clientY)\n  }\n\n  // Hue slider handlers\n  const handleHueChange = useCallback((clientX: number) => {\n    if (!hueSliderRef.current || disabled) return\n    const rect = hueSliderRef.current.getBoundingClientRect()\n    const x = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width))\n    const h = Math.round(x * 360)\n    updateColor({ ...hsl, h })\n  }, [hsl, updateColor, disabled])\n\n  const handleHueMouseDown = (e: React.MouseEvent) => {\n    if (disabled) return\n    setIsDraggingHue(true)\n    handleHueChange(e.clientX)\n  }\n\n  // Global mouse handlers for dragging\n  useEffect(() => {\n    const handleMouseMove = (e: MouseEvent) => {\n      if (isDraggingSL) {\n        handleSLChange(e.clientX, e.clientY)\n      } else if (isDraggingHue) {\n        handleHueChange(e.clientX)\n      }\n    }\n\n    const handleMouseUp = () => {\n      setIsDraggingSL(false)\n      setIsDraggingHue(false)\n    }\n\n    if (isDraggingSL || isDraggingHue) {\n      document.addEventListener('mousemove', handleMouseMove)\n      document.addEventListener('mouseup', handleMouseUp)\n      return () => {\n        document.removeEventListener('mousemove', handleMouseMove)\n        document.removeEventListener('mouseup', handleMouseUp)\n      }\n    }\n  }, [isDraggingSL, isDraggingHue, handleSLChange, handleHueChange])\n\n  // Hex input handler\n  const handleHexChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = e.target.value\n    setHexInput(newValue)\n    const normalized = normalizeHex(newValue)\n    if (isValidHex(normalized)) {\n      setHsl(hexToHsl(normalized))\n      onChange?.(normalized)\n    }\n  }\n\n  // Preset click handler\n  const handlePresetClick = (color: string) => {\n    if (disabled) return\n    const normalized = normalizeHex(color)\n    setHsl(hexToHsl(normalized))\n    setHexInput(normalized)\n    onChange?.(normalized)\n  }\n\n  // Size configurations\n  const sizeConfig = {\n    xs: { panel: 'w-32 h-32', hue: 'h-3', swatch: 'w-4 h-4', input: 'input-xs' },\n    sm: { panel: 'w-40 h-40', hue: 'h-4', swatch: 'w-5 h-5', input: 'input-sm' },\n    md: { panel: 'w-48 h-48', hue: 'h-5', swatch: 'w-6 h-6', input: 'input-md' },\n    lg: { panel: 'w-56 h-56', hue: 'h-6', swatch: 'w-7 h-7', input: 'input-lg' },\n  }\n\n  const config = sizeConfig[size]\n  const showPicker = mode === 'picker' || mode === 'both'\n  const showSwatches = mode === 'swatches' || mode === 'both'\n\n  // Calculate picker position\n  const slX = hsl.s / 100\n  const slY = 1 - hsl.l / 100\n  const hueX = hsl.h / 360\n\n  return (\n    <div className={`inline-flex flex-col gap-3 ${disabled ? 'opacity-50 pointer-events-none' : ''} ${className}`} {...rest}>\n      {showPicker && (\n        <>\n          {/* Saturation/Lightness Panel */}\n          <div\n            ref={slPanelRef}\n            className={`${config.panel} relative rounded cursor-crosshair select-none`}\n            style={{\n              background: `\n                linear-gradient(to top, #000, transparent),\n                linear-gradient(to right, #fff, hsl(${hsl.h}, 100%, 50%))\n              `,\n            }}\n            onMouseDown={handleSLMouseDown}\n          >\n            {/* Picker indicator */}\n            <div\n              className=\"absolute w-4 h-4 border-2 border-white rounded-full shadow-md pointer-events-none\"\n              style={{\n                left: `calc(${slX * 100}% - 8px)`,\n                top: `calc(${slY * 100}% - 8px)`,\n                boxShadow: '0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)',\n              }}\n            />\n          </div>\n\n          {/* Hue Slider */}\n          <div\n            ref={hueSliderRef}\n            className={`${config.hue} w-full relative rounded cursor-pointer select-none`}\n            style={{\n              background: 'linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)',\n            }}\n            onMouseDown={handleHueMouseDown}\n          >\n            {/* Hue indicator */}\n            <div\n              className=\"absolute top-1/2 w-3 h-full border-2 border-white rounded-sm shadow-md pointer-events-none\"\n              style={{\n                left: `calc(${hueX * 100}% - 6px)`,\n                transform: 'translateY(-50%)',\n                boxShadow: '0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)',\n              }}\n            />\n          </div>\n\n          {/* Hex Input and Preview */}\n          <div className=\"flex items-center gap-2\">\n            <div\n              className=\"w-8 h-8 rounded border border-base-300 flex-shrink-0\"\n              style={{ backgroundColor: isValidHex(normalizeHex(hexInput)) ? normalizeHex(hexInput) : value }}\n            />\n            <input\n              type=\"text\"\n              value={hexInput}\n              onChange={handleHexChange}\n              className={`input ${config.input} w-full font-mono uppercase`}\n              placeholder=\"#000000\"\n              maxLength={7}\n              disabled={disabled}\n            />\n          </div>\n        </>\n      )}\n\n      {showSwatches && (\n        <div className=\"grid grid-cols-10 gap-1\">\n          {presets.map((color, index) => (\n            <button\n              key={`${color}-${index}`}\n              type=\"button\"\n              className={`${config.swatch} rounded border border-base-300 cursor-pointer hover:scale-110 transition-transform ${\n                value.toLowerCase() === color.toLowerCase() ? 'ring-2 ring-primary ring-offset-1' : ''\n              }`}\n              style={{ backgroundColor: color }}\n              onClick={() => handlePresetClick(color)}\n              disabled={disabled}\n              aria-label={`Select color ${color}`}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["DEFAULT_PRESETS","hslToHex","h","s","l","a","f","n","k","color","hexToHsl","hex","result","r","g","b","max","min","d","isValidHex","normalizeHex","normalized","ColorPicker","value","onChange","mode","presets","size","disabled","className","rest","hsl","setHsl","useState","hexInput","setHexInput","isDraggingSL","setIsDraggingSL","isDraggingHue","setIsDraggingHue","slPanelRef","useRef","hueSliderRef","useEffect","updateColor","useCallback","newHsl","handleSLChange","clientX","clientY","rect","x","y","handleSLMouseDown","handleHueChange","handleHueMouseDown","handleMouseMove","e","handleMouseUp","handleHexChange","newValue","handlePresetClick","config","showPicker","showSwatches","slX","slY","hueX","jsxs","Fragment","jsx","index"],"mappings":"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"}