@aster-ui/prefixed 0.12.50

package/dist/components/TextRotate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextRotate.js","sources":["../../src/components/TextRotate.tsx"],"sourcesContent":["import React from 'react'\n\n// DaisyUI classes\nconst dTextRotate = 'd-text-rotate'\n\nexport type TextRotateDuration = 6000 | 9000 | 12000 | 15000 | 18000\n\nconst durationClasses: Record<TextRotateDuration, string> = {\n  6000: 'duration-6000',\n  9000: 'duration-9000',\n  12000: 'duration-12000',\n  15000: 'duration-15000',\n  18000: 'duration-18000',\n}\n\nexport interface TextRotateProps {\n  /** Text items to rotate through (max 6) */\n  items: React.ReactNode[]\n  /** Animation duration in ms (default 10000) */\n  duration?: TextRotateDuration\n  /** Center text horizontally */\n  centered?: boolean\n  /** Additional CSS classes */\n  className?: string\n}\n\nexport const TextRotate: React.FC<TextRotateProps> = ({\n  items,\n  duration,\n  centered = false,\n  className = '',\n}) => {\n  const durationClass = duration ? durationClasses[duration] : ''\n\n  return (\n    <span\n      className={`${dTextRotate} ${durationClass} ${centered ? 'justify-items-center' : ''} ${className}`.trim()}\n    >\n      <span>\n        {items.slice(0, 6).map((item, index) => (\n          <span key={index}>{item}</span>\n        ))}\n      </span>\n    </span>\n  )\n}\n"],"names":["dTextRotate","durationClasses","TextRotate","items","duration","centered","className","durationClass","jsx","item","index"],"mappings":";AAGA,MAAMA,IAAc,iBAIdC,IAAsD;AAAA,EAC1D,KAAM;AAAA,EACN,KAAM;AAAA,EACN,MAAO;AAAA,EACP,MAAO;AAAA,EACP,MAAO;AACT,GAaaC,IAAwC,CAAC;AAAA,EACpD,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AACd,MAAM;AACJ,QAAMC,IAAgBH,IAAWH,EAAgBG,CAAQ,IAAI;AAE7D,SACE,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAGR,CAAW,IAAIO,CAAa,IAAIF,IAAW,yBAAyB,EAAE,IAAIC,CAAS,GAAG,KAAA;AAAA,MAEpG,4BAAC,QAAA,EACE,UAAAH,EAAM,MAAM,GAAG,CAAC,EAAE,IAAI,CAACM,GAAMC,MAC5B,gBAAAF,EAAC,QAAA,EAAkB,UAAAC,EAAA,GAARC,CAAa,CACzB,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Textarea.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+export interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> {
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    color?: 'neutral' | 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error';
+    ghost?: boolean;
+    bordered?: boolean;
+    className?: string;
+}
+export declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;

package/dist/components/Textarea.js

@@ -0,0 +1,44 @@
+import { jsx as m } from "react/jsx-runtime";
+import { forwardRef as T } from "react";
+import { useConfig as f } from "./ConfigProvider.js";
+const u = "d-textarea", g = "d-textarea-bordered", p = "d-textarea-ghost", y = "d-textarea-xs", S = "d-textarea-sm", w = "d-textarea-md", C = "d-textarea-lg", z = "d-textarea-xl", N = "d-textarea-neutral", h = "d-textarea-primary", j = "d-textarea-secondary", B = "d-textarea-accent", X = "d-textarea-info", b = "d-textarea-success", v = "d-textarea-warning", A = "d-textarea-error", E = T(
+  ({
+    size: t,
+    color: e,
+    ghost: r = !1,
+    bordered: s = !0,
+    className: o = "",
+    ...d
+  }, n) => {
+    const { componentSize: x } = f(), a = t ?? x ?? "md", c = {
+      xs: y,
+      sm: S,
+      md: w,
+      lg: C,
+      xl: z
+    }, i = {
+      neutral: N,
+      primary: h,
+      secondary: j,
+      accent: B,
+      info: X,
+      success: b,
+      warning: v,
+      error: A
+    }, l = [
+      u,
+      "w-full",
+      s && g,
+      r && p,
+      a && c[a],
+      e && i[e],
+      o
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ m("textarea", { ref: n, className: l, ...d });
+  }
+);
+E.displayName = "Textarea";
+export {
+  E as Textarea
+};
+//# sourceMappingURL=Textarea.js.map

package/dist/components/Textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.js","sources":["../../src/components/Textarea.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport { useConfig } from './ConfigProvider'\n\n// DaisyUI classes\nconst dTextarea = 'd-textarea'\nconst dTextareaBordered = 'd-textarea-bordered'\nconst dTextareaGhost = 'd-textarea-ghost'\nconst dTextareaXs = 'd-textarea-xs'\nconst dTextareaSm = 'd-textarea-sm'\nconst dTextareaMd = 'd-textarea-md'\nconst dTextareaLg = 'd-textarea-lg'\nconst dTextareaXl = 'd-textarea-xl'\nconst dTextareaNeutral = 'd-textarea-neutral'\nconst dTextareaPrimary = 'd-textarea-primary'\nconst dTextareaSecondary = 'd-textarea-secondary'\nconst dTextareaAccent = 'd-textarea-accent'\nconst dTextareaInfo = 'd-textarea-info'\nconst dTextareaSuccess = 'd-textarea-success'\nconst dTextareaWarning = 'd-textarea-warning'\nconst dTextareaError = 'd-textarea-error'\n\nexport interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> {\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  color?: 'neutral' | 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error'\n  ghost?: boolean\n  bordered?: boolean\n  className?: string\n}\n\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(\n  (\n    {\n      size,\n      color,\n      ghost = false,\n      bordered = true,\n      className = '',\n      ...props\n    },\n    ref\n  ) => {\n    const { componentSize } = useConfig()\n    const effectiveSize = size ?? componentSize ?? 'md'\n\n    const sizeClasses = {\n      xs: dTextareaXs,\n      sm: dTextareaSm,\n      md: dTextareaMd,\n      lg: dTextareaLg,\n      xl: dTextareaXl,\n    }\n\n    const colorClasses = {\n      neutral: dTextareaNeutral,\n      primary: dTextareaPrimary,\n      secondary: dTextareaSecondary,\n      accent: dTextareaAccent,\n      info: dTextareaInfo,\n      success: dTextareaSuccess,\n      warning: dTextareaWarning,\n      error: dTextareaError,\n    }\n\n    const textareaClasses = [\n      dTextarea,\n      'w-full',\n      bordered && dTextareaBordered,\n      ghost && dTextareaGhost,\n      effectiveSize && sizeClasses[effectiveSize],\n      color && colorClasses[color],\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ')\n\n    return <textarea ref={ref} className={textareaClasses} {...props} />\n  }\n)\n\nTextarea.displayName = 'Textarea'\n"],"names":["dTextarea","dTextareaBordered","dTextareaGhost","dTextareaXs","dTextareaSm","dTextareaMd","dTextareaLg","dTextareaXl","dTextareaNeutral","dTextareaPrimary","dTextareaSecondary","dTextareaAccent","dTextareaInfo","dTextareaSuccess","dTextareaWarning","dTextareaError","Textarea","forwardRef","size","color","ghost","bordered","className","props","ref","componentSize","useConfig","effectiveSize","sizeClasses","colorClasses","textareaClasses"],"mappings":";;;AAIA,MAAMA,IAAY,cACZC,IAAoB,uBACpBC,IAAiB,oBACjBC,IAAc,iBACdC,IAAc,iBACdC,IAAc,iBACdC,IAAc,iBACdC,IAAc,iBACdC,IAAmB,sBACnBC,IAAmB,sBACnBC,IAAqB,wBACrBC,IAAkB,qBAClBC,IAAgB,mBAChBC,IAAmB,sBACnBC,IAAmB,sBACnBC,IAAiB,oBAUVC,IAAWC;AAAA,EACtB,CACE;AAAA,IACE,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAM,EAAE,eAAAC,EAAA,IAAkBC,EAAA,GACpBC,IAAgBT,KAAQO,KAAiB,MAEzCG,IAAc;AAAA,MAClB,IAAIzB;AAAA,MACJ,IAAIC;AAAA,MACJ,IAAIC;AAAA,MACJ,IAAIC;AAAA,MACJ,IAAIC;AAAA,IAAA,GAGAsB,IAAe;AAAA,MACnB,SAASrB;AAAA,MACT,SAASC;AAAA,MACT,WAAWC;AAAA,MACX,QAAQC;AAAA,MACR,MAAMC;AAAA,MACN,SAASC;AAAA,MACT,SAASC;AAAA,MACT,OAAOC;AAAA,IAAA,GAGHe,IAAkB;AAAA,MACtB9B;AAAA,MACA;AAAA,MACAqB,KAAYpB;AAAA,MACZmB,KAASlB;AAAA,MACTyB,KAAiBC,EAAYD,CAAa;AAAA,MAC1CR,KAASU,EAAaV,CAAK;AAAA,MAC3BG;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,6BAAQ,YAAA,EAAS,KAAAE,GAAU,WAAWM,GAAkB,GAAGP,GAAO;AAAA,EACpE;AACF;AAEAP,EAAS,cAAc;"}

package/dist/components/ThemeController.d.ts

@@ -0,0 +1,28 @@
+export interface ThemeControllerSwapProps {
+    lightTheme?: string;
+    darkTheme?: string;
+    onChange?: (theme: string) => void;
+    className?: string;
+}
+export interface ThemeControllerDropdownProps {
+    themes: string[];
+    defaultTheme?: string;
+    onChange?: (theme: string) => void;
+    className?: string;
+}
+export interface ThemeControllerToggleProps {
+    lightTheme?: string;
+    darkTheme?: string;
+    onChange?: (theme: string) => void;
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    className?: string;
+}
+declare function ThemeControllerSwap({ lightTheme, darkTheme, onChange, className, }: ThemeControllerSwapProps): import("react/jsx-runtime").JSX.Element;
+declare function ThemeControllerDropdown({ themes, defaultTheme, onChange, className, }: ThemeControllerDropdownProps): import("react/jsx-runtime").JSX.Element;
+declare function ThemeControllerToggle({ lightTheme, darkTheme, onChange, size, className, }: ThemeControllerToggleProps): import("react/jsx-runtime").JSX.Element;
+export declare const ThemeController: {
+    Swap: typeof ThemeControllerSwap;
+    Dropdown: typeof ThemeControllerDropdown;
+    Toggle: typeof ThemeControllerToggle;
+};
+export {};

package/dist/components/ThemeController.js

@@ -0,0 +1,162 @@
+import { jsx as o, jsxs as m } from "react/jsx-runtime";
+import { useState as h, useEffect as w, useId as x } from "react";
+import { useConfig as A } from "./ConfigProvider.js";
+const $ = "d-swap", k = "d-swap-rotate", C = "d-swap-off", M = "d-swap-on", S = "d-dropdown", T = "d-dropdown-end", Z = "d-dropdown-content", f = "d-btn", N = "d-btn-sm", D = "d-btn-block", B = "d-btn-ghost", E = "d-toggle", y = "d-toggle-xs", O = "d-toggle-sm", z = "d-toggle-md", I = "d-toggle-lg", j = "d-toggle-xl";
+function a() {
+  return document.documentElement.getAttribute("data-theme");
+}
+function p(t) {
+  document.documentElement.setAttribute("data-theme", t);
+}
+function F({
+  lightTheme: t = "light",
+  darkTheme: n = "dark",
+  onChange: d,
+  className: l = ""
+}) {
+  const [i, u] = h(() => a() === n);
+  w(() => {
+    const c = new MutationObserver(() => {
+      const e = a();
+      u(e === n);
+    });
+    return c.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme"] }), () => c.disconnect();
+  }, [n]);
+  const s = (c) => {
+    const r = c.target.checked ? n : t;
+    p(r), d?.(r);
+  };
+  return /* @__PURE__ */ m("label", { className: `${$} ${k} ${l}`, children: [
+    /* @__PURE__ */ o(
+      "input",
+      {
+        type: "checkbox",
+        checked: i,
+        onChange: s
+      }
+    ),
+    /* @__PURE__ */ o(
+      "svg",
+      {
+        className: `${C} h-8 w-8 fill-current`,
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 24 24",
+        children: /* @__PURE__ */ o("path", { d: "M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z" })
+      }
+    ),
+    /* @__PURE__ */ o(
+      "svg",
+      {
+        className: `${M} h-8 w-8 fill-current`,
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 24 24",
+        children: /* @__PURE__ */ o("path", { d: "M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z" })
+      }
+    )
+  ] });
+}
+function H({
+  themes: t,
+  defaultTheme: n,
+  onChange: d,
+  className: l = ""
+}) {
+  const i = x(), [u, s] = h(() => {
+    const e = a();
+    return e && t.includes(e) ? e : n || t[0] || "light";
+  });
+  w(() => {
+    const e = new MutationObserver(() => {
+      const r = a();
+      r && t.includes(r) && s(r);
+    });
+    return e.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme"] }), () => e.disconnect();
+  }, [t]);
+  const c = (e) => {
+    s(e), p(e), d?.(e);
+  };
+  return /* @__PURE__ */ m("div", { className: `${S} ${T} ${l}`, children: [
+    /* @__PURE__ */ m("div", { tabIndex: 0, role: "button", className: f, children: [
+      "Theme",
+      /* @__PURE__ */ o(
+        "svg",
+        {
+          width: "12px",
+          height: "12px",
+          className: "inline-block h-2 w-2 fill-current opacity-60",
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 2048 2048",
+          children: /* @__PURE__ */ o("path", { d: "M1799 349l242 241-1017 1017L7 590l242-241 775 775 775-775z" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ o(
+      "ul",
+      {
+        tabIndex: 0,
+        className: `${Z} bg-base-300 rounded-box z-[1] w-52 p-2 shadow-2xl max-h-96 overflow-y-auto`,
+        children: t.map((e) => /* @__PURE__ */ o("li", { children: /* @__PURE__ */ o(
+          "input",
+          {
+            type: "radio",
+            name: i,
+            className: `${f} ${N} ${D} ${B} justify-start`,
+            "aria-label": e,
+            value: e,
+            checked: u === e,
+            onChange: () => c(e)
+          }
+        ) }, e))
+      }
+    )
+  ] });
+}
+const L = {
+  xs: y,
+  sm: O,
+  md: z,
+  lg: I,
+  xl: j
+};
+function V({
+  lightTheme: t = "light",
+  darkTheme: n = "dark",
+  onChange: d,
+  size: l,
+  className: i = ""
+}) {
+  const { componentSize: u } = A(), s = l ?? u ?? "md", [c, e] = h(() => a() === n);
+  w(() => {
+    const g = new MutationObserver(() => {
+      const b = a();
+      e(b === n);
+    });
+    return g.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme"] }), () => g.disconnect();
+  }, [n]);
+  const r = (g) => {
+    const v = g.target.checked ? n : t;
+    p(v), d?.(v);
+  };
+  return /* @__PURE__ */ o(
+    "input",
+    {
+      type: "checkbox",
+      className: `${E} ${L[s]} ${i}`,
+      checked: c,
+      onChange: r,
+      "aria-label": "Toggle theme"
+    }
+  );
+}
+const q = Object.assign(
+  {},
+  {
+    Swap: F,
+    Dropdown: H,
+    Toggle: V
+  }
+);
+export {
+  q as ThemeController
+};
+//# sourceMappingURL=ThemeController.js.map

package/dist/components/ThemeController.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeController.js","sources":["../../src/components/ThemeController.tsx"],"sourcesContent":["import React, { useState, useEffect, useId } from 'react'\nimport { useConfig } from './ConfigProvider'\n\n// DaisyUI classes\nconst dSwap = 'd-swap'\nconst dSwapRotate = 'd-swap-rotate'\nconst dSwapOff = 'd-swap-off'\nconst dSwapOn = 'd-swap-on'\nconst dDropdown = 'd-dropdown'\nconst dDropdownEnd = 'd-dropdown-end'\nconst dDropdownContent = 'd-dropdown-content'\nconst dBtn = 'd-btn'\nconst dBtnSm = 'd-btn-sm'\nconst dBtnBlock = 'd-btn-block'\nconst dBtnGhost = 'd-btn-ghost'\nconst dToggle = 'd-toggle'\nconst dToggleXs = 'd-toggle-xs'\nconst dToggleSm = 'd-toggle-sm'\nconst dToggleMd = 'd-toggle-md'\nconst dToggleLg = 'd-toggle-lg'\nconst dToggleXl = 'd-toggle-xl'\n\nexport interface ThemeControllerSwapProps {\n  lightTheme?: string\n  darkTheme?: string\n  onChange?: (theme: string) => void\n  className?: string\n}\n\nexport interface ThemeControllerDropdownProps {\n  themes: string[]\n  defaultTheme?: string\n  onChange?: (theme: string) => void\n  className?: string\n}\n\nexport interface ThemeControllerToggleProps {\n  lightTheme?: string\n  darkTheme?: string\n  onChange?: (theme: string) => void\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  className?: string\n}\n\n// Get current theme from document\nfunction getCurrentTheme(): string | null {\n  return document.documentElement.getAttribute('data-theme')\n}\n\n// Set theme on document\nfunction setTheme(theme: string) {\n  document.documentElement.setAttribute('data-theme', theme)\n}\n\nfunction ThemeControllerSwap({\n  lightTheme = 'light',\n  darkTheme = 'dark',\n  onChange,\n  className = '',\n}: ThemeControllerSwapProps) {\n  const [isDark, setIsDark] = useState(() => {\n    const current = getCurrentTheme()\n    return current === darkTheme\n  })\n\n  // Sync with external theme changes\n  useEffect(() => {\n    const observer = new MutationObserver(() => {\n      const current = getCurrentTheme()\n      setIsDark(current === darkTheme)\n    })\n    observer.observe(document.documentElement, { attributes: true, attributeFilter: ['data-theme'] })\n    return () => observer.disconnect()\n  }, [darkTheme])\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const checked = e.target.checked\n    const theme = checked ? darkTheme : lightTheme\n    setTheme(theme)\n    onChange?.(theme)\n  }\n\n  return (\n    <label className={`${dSwap} ${dSwapRotate} ${className}`}>\n      <input\n        type=\"checkbox\"\n        checked={isDark}\n        onChange={handleChange}\n      />\n      {/* sun icon */}\n      <svg\n        className={`${dSwapOff} h-8 w-8 fill-current`}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n      >\n        <path d=\"M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z\" />\n      </svg>\n      {/* moon icon */}\n      <svg\n        className={`${dSwapOn} h-8 w-8 fill-current`}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n      >\n        <path d=\"M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z\" />\n      </svg>\n    </label>\n  )\n}\n\nfunction ThemeControllerDropdown({\n  themes,\n  defaultTheme,\n  onChange,\n  className = '',\n}: ThemeControllerDropdownProps) {\n  const radioName = useId()\n  const [selectedTheme, setSelectedTheme] = useState(() => {\n    const current = getCurrentTheme()\n    if (current && themes.includes(current)) return current\n    return defaultTheme || themes[0] || 'light'\n  })\n\n  // Sync with external theme changes\n  useEffect(() => {\n    const observer = new MutationObserver(() => {\n      const current = getCurrentTheme()\n      if (current && themes.includes(current)) {\n        setSelectedTheme(current)\n      }\n    })\n    observer.observe(document.documentElement, { attributes: true, attributeFilter: ['data-theme'] })\n    return () => observer.disconnect()\n  }, [themes])\n\n  const handleChange = (theme: string) => {\n    setSelectedTheme(theme)\n    setTheme(theme)\n    onChange?.(theme)\n  }\n\n  return (\n    <div className={`${dDropdown} ${dDropdownEnd} ${className}`}>\n      <div tabIndex={0} role=\"button\" className={dBtn}>\n        Theme\n        <svg\n          width=\"12px\"\n          height=\"12px\"\n          className=\"inline-block h-2 w-2 fill-current opacity-60\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          viewBox=\"0 0 2048 2048\"\n        >\n          <path d=\"M1799 349l242 241-1017 1017L7 590l242-241 775 775 775-775z\"></path>\n        </svg>\n      </div>\n      <ul\n        tabIndex={0}\n        className={`${dDropdownContent} bg-base-300 rounded-box z-[1] w-52 p-2 shadow-2xl max-h-96 overflow-y-auto`}\n      >\n        {themes.map((theme) => (\n          <li key={theme}>\n            <input\n              type=\"radio\"\n              name={radioName}\n              className={`${dBtn} ${dBtnSm} ${dBtnBlock} ${dBtnGhost} justify-start`}\n              aria-label={theme}\n              value={theme}\n              checked={selectedTheme === theme}\n              onChange={() => handleChange(theme)}\n            />\n          </li>\n        ))}\n      </ul>\n    </div>\n  )\n}\n\nconst sizeClasses: Record<string, string> = {\n  xs: dToggleXs,\n  sm: dToggleSm,\n  md: dToggleMd,\n  lg: dToggleLg,\n  xl: dToggleXl,\n}\n\nfunction ThemeControllerToggle({\n  lightTheme = 'light',\n  darkTheme = 'dark',\n  onChange,\n  size,\n  className = '',\n}: ThemeControllerToggleProps) {\n  const { componentSize } = useConfig()\n  const effectiveSize = size ?? componentSize ?? 'md'\n\n  const [isDark, setIsDark] = useState(() => {\n    const current = getCurrentTheme()\n    return current === darkTheme\n  })\n\n  // Sync with external theme changes\n  useEffect(() => {\n    const observer = new MutationObserver(() => {\n      const current = getCurrentTheme()\n      setIsDark(current === darkTheme)\n    })\n    observer.observe(document.documentElement, { attributes: true, attributeFilter: ['data-theme'] })\n    return () => observer.disconnect()\n  }, [darkTheme])\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const checked = e.target.checked\n    const theme = checked ? darkTheme : lightTheme\n    setTheme(theme)\n    onChange?.(theme)\n  }\n\n  return (\n    <input\n      type=\"checkbox\"\n      className={`${dToggle} ${sizeClasses[effectiveSize]} ${className}`}\n      checked={isDark}\n      onChange={handleChange}\n      aria-label=\"Toggle theme\"\n    />\n  )\n}\n\nexport const ThemeController = Object.assign(\n  {},\n  {\n    Swap: ThemeControllerSwap,\n    Dropdown: ThemeControllerDropdown,\n    Toggle: ThemeControllerToggle,\n  }\n)\n"],"names":["dSwap","dSwapRotate","dSwapOff","dSwapOn","dDropdown","dDropdownEnd","dDropdownContent","dBtn","dBtnSm","dBtnBlock","dBtnGhost","dToggle","dToggleXs","dToggleSm","dToggleMd","dToggleLg","dToggleXl","getCurrentTheme","setTheme","theme","ThemeControllerSwap","lightTheme","darkTheme","onChange","className","isDark","setIsDark","useState","useEffect","observer","current","handleChange","e","jsxs","jsx","ThemeControllerDropdown","themes","defaultTheme","radioName","useId","selectedTheme","setSelectedTheme","sizeClasses","ThemeControllerToggle","size","componentSize","useConfig","effectiveSize","ThemeController"],"mappings":"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"}

package/dist/components/TimePicker.d.ts

@@ -0,0 +1,20 @@
+import { default as React } from 'react';
+export interface TimePickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {
+    value?: Date | null;
+    defaultValue?: Date | null;
+    onChange?: (date: Date | null) => void;
+    format?: '12' | '24';
+    placeholder?: string;
+    disabled?: boolean;
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    showSeconds?: boolean;
+    allowClear?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    hourStep?: number;
+    minuteStep?: number;
+    secondStep?: number;
+    status?: 'error' | 'warning';
+    'data-testid'?: string;
+}
+export declare const TimePicker: React.ForwardRefExoticComponent<TimePickerProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/TimePicker.js

@@ -0,0 +1,304 @@
+import { jsxs as m, jsx as a } from "react/jsx-runtime";
+import { forwardRef as $e, useState as $, useRef as ne, useId as xe, useEffect as Y, useCallback as oe } from "react";
+import { Input as Me } from "./Input.js";
+import { useConfig as we } from "./ConfigProvider.js";
+const S = "d-btn", D = "d-btn-ghost", J = "d-btn-primary", ke = "d-btn-xs", E = "d-btn-sm", ye = "d-btn-circle", ve = "d-input-error", Ce = "d-input-warning";
+function Ne(s, T = "24", x = !1) {
+  if (!s) return "";
+  let o = s.getHours();
+  const M = String(s.getMinutes()).padStart(2, "0"), w = String(s.getSeconds()).padStart(2, "0");
+  if (T === "12") {
+    const P = o >= 12 ? "PM" : "AM";
+    return o = o % 12 || 12, x ? `${o}:${M}:${w} ${P}` : `${o}:${M} ${P}`;
+  }
+  const A = String(o).padStart(2, "0");
+  return x ? `${A}:${M}:${w}` : `${A}:${M}`;
+}
+const Se = $e(({
+  value: s,
+  defaultValue: T,
+  onChange: x,
+  format: o = "24",
+  placeholder: M = "Select time",
+  disabled: w = !1,
+  className: A,
+  size: P,
+  showSeconds: v = !1,
+  allowClear: se = !0,
+  open: H,
+  onOpenChange: Q,
+  hourStep: F = 1,
+  minuteStep: R = 1,
+  secondStep: z = 1,
+  status: V,
+  "data-testid": ie,
+  ...re
+}, I) => {
+  const { componentSize: ae } = we(), de = P ?? ae ?? "md", [c, O] = $(
+    s !== void 0 ? s : T || null
+  ), [ce, le] = $(!1), l = H !== void 0 ? H : ce, [p, C] = $(c ? c.getHours() : 0), [k, B] = $(c ? c.getMinutes() : 0), [y, L] = $(c ? c.getSeconds() : 0), [g, j] = $(
+    c && c.getHours() >= 12 ? "PM" : "AM"
+  ), [h, K] = $("hour"), U = ne(null), ue = ne(null), W = xe(), d = ie || "timepicker";
+  Y(() => {
+    s !== void 0 && (O(s), s && (C(s.getHours()), B(s.getMinutes()), L(s.getSeconds()), j(s.getHours() >= 12 ? "PM" : "AM")));
+  }, [s]);
+  const b = oe((e) => {
+    H === void 0 && le(e), Q?.(e);
+  }, [H, Q]);
+  Y(() => {
+    function e(t) {
+      U.current && !U.current.contains(t.target) && b(!1);
+    }
+    if (l)
+      return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, [l, b]), Y(() => {
+    if (!l) return;
+    const e = (t) => {
+      if (t.key === "Escape") {
+        b(!1);
+        return;
+      }
+      if (t.key !== "Tab") {
+        if (t.key === "ArrowUp" || t.key === "ArrowDown") {
+          t.preventDefault();
+          const i = t.key === "ArrowUp" ? -1 : 1;
+          if (h === "hour") {
+            const n = o === "12" ? 12 : 23, u = o === "12" ? 1 : 0;
+            let r = p + i * F;
+            r > n && (r = u), r < u && (r = n), Z(r);
+          } else if (h === "minute") {
+            let n = k + i * R;
+            n > 59 && (n = 0), n < 0 && (n = 59), _(n);
+          } else if (h === "second") {
+            let n = y + i * z;
+            n > 59 && (n = 0), n < 0 && (n = 59), ee(n);
+          } else h === "period" && q(g === "AM" ? "PM" : "AM");
+        }
+        if (t.key === "ArrowLeft" || t.key === "ArrowRight") {
+          t.preventDefault();
+          const i = ["hour", "minute"];
+          v && i.push("second"), o === "12" && i.push("period");
+          const n = i.indexOf(h), u = t.key === "ArrowLeft" ? -1 : 1;
+          let r = n + u;
+          r < 0 && (r = i.length - 1), r >= i.length && (r = 0), K(i[r]);
+        }
+        t.key === "Enter" && b(!1);
+      }
+    };
+    return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+  }, [l, h, p, k, y, g, o, v, F, R, z, b]);
+  const fe = oe((e) => {
+    e.stopPropagation(), O(null), C(0), B(0), L(0), j("AM"), x?.(null);
+  }, [x]), N = (e, t, i) => {
+    const n = /* @__PURE__ */ new Date(), u = new Date(
+      n.getFullYear(),
+      n.getMonth(),
+      n.getDate(),
+      e,
+      t,
+      i
+    );
+    O(u), x?.(u);
+  }, Z = (e) => {
+    let t = e;
+    o === "12" && (t = g === "PM" ? e % 12 + 12 : e % 12), C(t), N(t, k, y);
+  }, _ = (e) => {
+    B(e), N(p, e, y);
+  }, ee = (e) => {
+    L(e), N(p, k, e);
+  }, q = (e) => {
+    j(e);
+    const t = e === "PM" ? p % 12 + 12 : p % 12;
+    C(t), N(t, k, y);
+  }, G = (e, t, i, n, u, r = 1, ge = 0) => {
+    const te = [];
+    for (let f = ge; f <= i; f += r)
+      te.push(f);
+    const he = `${W}-${e}-listbox`, be = h === e;
+    return /* @__PURE__ */ m(
+      "div",
+      {
+        className: "flex flex-col w-16",
+        role: "listbox",
+        "aria-label": `Select ${t.toLowerCase()}`,
+        id: he,
+        "data-testid": `${d}-${e}-column`,
+        tabIndex: 0,
+        onFocus: () => K(e),
+        children: [
+          /* @__PURE__ */ a("div", { className: "text-xs font-semibold text-center text-base-content/60 py-2", "aria-hidden": "true", children: t }),
+          /* @__PURE__ */ a("div", { className: "overflow-y-auto max-h-48", children: te.map((f) => {
+            const X = n === f;
+            return /* @__PURE__ */ a(
+              "button",
+              {
+                type: "button",
+                role: "option",
+                "aria-selected": X,
+                onClick: () => u(f),
+                "data-testid": `${d}-${e}-${f}`,
+                className: [
+                  "w-full px-4 py-2 text-center hover:bg-base-200 transition-colors",
+                  X ? "bg-primary text-primary-content" : "",
+                  be && X ? "ring-2 ring-primary ring-offset-1" : ""
+                ].filter(Boolean).join(" "),
+                children: String(f).padStart(2, "0")
+              },
+              f
+            );
+          }) })
+        ]
+      }
+    );
+  }, pe = o === "12" ? p % 12 || 12 : p, me = {
+    error: ve,
+    warning: Ce
+  };
+  return /* @__PURE__ */ m(
+    "div",
+    {
+      ref: (e) => {
+        U.current = e, typeof I == "function" ? I(e) : I && (I.current = e);
+      },
+      className: ["relative", A].filter(Boolean).join(" "),
+      "data-testid": d,
+      "data-state": l ? "open" : "closed",
+      ...re,
+      children: [
+        /* @__PURE__ */ m("div", { className: "relative", children: [
+          /* @__PURE__ */ a(
+            Me,
+            {
+              value: Ne(c, o, v),
+              placeholder: M,
+              disabled: w,
+              size: de,
+              readOnly: !0,
+              onClick: () => !w && b(!l),
+              className: ["cursor-pointer pr-8", V ? me[V] : ""].filter(Boolean).join(" "),
+              "aria-haspopup": "listbox",
+              "aria-expanded": l,
+              "aria-controls": l ? `${W}-dropdown` : void 0,
+              "data-testid": `${d}-input`
+            }
+          ),
+          se && c && !w && /* @__PURE__ */ a(
+            "button",
+            {
+              type: "button",
+              onClick: fe,
+              className: `absolute right-2 top-1/2 -translate-y-1/2 ${S} ${D} ${ke} ${ye}`,
+              "aria-label": "Clear time",
+              "data-testid": `${d}-clear`,
+              children: /* @__PURE__ */ a("svg", { className: "w-3 h-3", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ a("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+            }
+          )
+        ] }),
+        l && /* @__PURE__ */ m(
+          "div",
+          {
+            ref: ue,
+            id: `${W}-dropdown`,
+            className: "absolute top-full left-0 mt-2 bg-base-100 border border-base-300 rounded-lg shadow-xl z-[9999] w-fit",
+            role: "dialog",
+            "aria-label": "Time picker",
+            "data-testid": `${d}-dropdown`,
+            children: [
+              /* @__PURE__ */ m("div", { className: "flex divide-x divide-base-300", children: [
+                G(
+                  "hour",
+                  "Hour",
+                  o === "12" ? 12 : 23,
+                  pe,
+                  Z,
+                  F,
+                  o === "12" ? 1 : 0
+                ),
+                G("minute", "Min", 59, k, _, R),
+                v && G("second", "Sec", 59, y, ee, z),
+                o === "12" && /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: "flex flex-col w-16",
+                    role: "listbox",
+                    "aria-label": "Select period",
+                    "data-testid": `${d}-period-column`,
+                    tabIndex: 0,
+                    onFocus: () => K("period"),
+                    children: [
+                      /* @__PURE__ */ a("div", { className: "text-xs font-semibold text-center text-base-content/60 py-2", "aria-hidden": "true", children: "Period" }),
+                      /* @__PURE__ */ m("div", { className: "flex flex-col p-2 gap-2", children: [
+                        /* @__PURE__ */ a(
+                          "button",
+                          {
+                            type: "button",
+                            role: "option",
+                            "aria-selected": g === "AM",
+                            onClick: () => q("AM"),
+                            "data-testid": `${d}-period-am`,
+                            className: [
+                              S,
+                              E,
+                              g === "AM" ? J : D
+                            ].join(" "),
+                            children: "AM"
+                          }
+                        ),
+                        /* @__PURE__ */ a(
+                          "button",
+                          {
+                            type: "button",
+                            role: "option",
+                            "aria-selected": g === "PM",
+                            onClick: () => q("PM"),
+                            "data-testid": `${d}-period-pm`,
+                            className: [
+                              S,
+                              E,
+                              g === "PM" ? J : D
+                            ].join(" "),
+                            children: "PM"
+                          }
+                        )
+                      ] })
+                    ]
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ m("div", { className: "flex justify-end gap-2 p-3 border-t border-base-300", children: [
+                /* @__PURE__ */ a(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => {
+                      const e = /* @__PURE__ */ new Date();
+                      C(e.getHours()), B(e.getMinutes()), L(e.getSeconds()), j(e.getHours() >= 12 ? "PM" : "AM"), N(e.getHours(), e.getMinutes(), e.getSeconds());
+                    },
+                    className: `${S} ${D} ${E}`,
+                    "data-testid": `${d}-now`,
+                    children: "Now"
+                  }
+                ),
+                /* @__PURE__ */ a(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => b(!1),
+                    className: `${S} ${J} ${E}`,
+                    "data-testid": `${d}-ok`,
+                    children: "OK"
+                  }
+                )
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+});
+Se.displayName = "TimePicker";
+export {
+  Se as TimePicker
+};
+//# sourceMappingURL=TimePicker.js.map