asterui 0.12.55 → 0.12.57

package/dist/components/ThemeController.js

@@ -1,84 +1,94 @@
-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 $ = "swap", k = "swap-rotate", C = "swap-off", M = "swap-on", S = "dropdown", T = "dropdown-end", Z = "dropdown-content", f = "btn", N = "btn-sm", D = "btn-block", B = "btn-ghost", E = "toggle", y = "toggle-xs", O = "toggle-sm", z = "toggle-md", I = "toggle-lg", j = "toggle-xl";
-function a() {
+import { jsx as r, jsxs as p } from "react/jsx-runtime";
+import { useState as b, useEffect as f, useId as $ } from "react";
+import { useConfig as S } from "./ConfigProvider.js";
+import { useTheme as v } from "../hooks/useTheme.js";
+const C = "swap", D = "swap-rotate", M = "swap-off", Z = "swap-on", N = "dropdown", B = "dropdown-end", y = "dropdown-content", A = "btn", E = "btn-sm", I = "btn-block", O = "btn-ghost", z = "toggle", j = "toggle-xs", F = "toggle-sm", H = "toggle-md", L = "toggle-lg", V = "toggle-xl";
+function i() {
   return document.documentElement.getAttribute("data-theme");
 }
-function p(t) {
-  document.documentElement.setAttribute("data-theme", t);
+function x(n) {
+  document.documentElement.setAttribute("data-theme", n);
 }
-function F({
-  lightTheme: t = "light",
-  darkTheme: n = "dark",
-  onChange: l,
-  className: d = ""
+function X({
+  lightTheme: n = "light",
+  darkTheme: o = "dark",
+  onChange: u,
+  className: m = ""
 }) {
-  const [i, u] = h(() => a() === n);
-  w(() => {
-    const c = new MutationObserver(() => {
-      const e = a();
-      u(e === n);
+  const { setTheme: g, isDark: t } = v(), h = g ?? x, [c, d] = b(() => t !== void 0 ? t : i() === o);
+  f(() => {
+    if (t !== void 0) {
+      d(t);
+      return;
+    }
+    const s = new MutationObserver(() => {
+      const e = i();
+      d(e === o);
     });
-    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), l?.(r);
+    return s.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme"] }), () => s.disconnect();
+  }, [o, t]);
+  const l = (s) => {
+    const a = s.target.checked ? o : n;
+    h(a), u?.(a);
   };
-  return /* @__PURE__ */ m("label", { className: `${$} ${k} ${d}`, children: [
-    /* @__PURE__ */ o(
+  return /* @__PURE__ */ p("label", { className: `${C} ${D} ${m}`, children: [
+    /* @__PURE__ */ r(
       "input",
       {
         type: "checkbox",
-        checked: i,
-        onChange: s
+        checked: c,
+        onChange: l
       }
     ),
-    /* @__PURE__ */ o(
+    /* @__PURE__ */ r(
       "svg",
       {
-        className: `${C} h-8 w-8 fill-current`,
+        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: "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" })
+        children: /* @__PURE__ */ r("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(
+    /* @__PURE__ */ r(
       "svg",
       {
-        className: `${M} h-8 w-8 fill-current`,
+        className: `${Z} 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" })
+        children: /* @__PURE__ */ r("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: l,
-  className: d = ""
+function G({
+  themes: n,
+  defaultTheme: o,
+  onChange: u,
+  className: m = ""
 }) {
-  const i = x(), [u, s] = h(() => {
-    const e = a();
-    return e && t.includes(e) ? e : n || t[0] || "light";
+  const { setTheme: g, resolvedTheme: t } = v(), h = g ?? x, c = $(), [d, l] = b(() => {
+    if (t && n.includes(t)) return t;
+    const e = i();
+    return e && n.includes(e) ? e : o || n[0] || "light";
   });
-  w(() => {
+  f(() => {
+    if (t && n.includes(t)) {
+      l(t);
+      return;
+    }
     const e = new MutationObserver(() => {
-      const r = a();
-      r && t.includes(r) && s(r);
+      const a = i();
+      a && n.includes(a) && l(a);
     });
     return e.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme"] }), () => e.disconnect();
-  }, [t]);
-  const c = (e) => {
-    s(e), p(e), l?.(e);
+  }, [n, t]);
+  const s = (e) => {
+    l(e), h(e), u?.(e);
   };
-  return /* @__PURE__ */ m("div", { className: `${S} ${T} ${d}`, children: [
-    /* @__PURE__ */ m("div", { tabIndex: 0, role: "button", className: f, children: [
+  return /* @__PURE__ */ p("div", { className: `${N} ${B} ${m}`, children: [
+    /* @__PURE__ */ p("div", { tabIndex: 0, role: "button", className: A, children: [
       "Theme",
-      /* @__PURE__ */ o(
+      /* @__PURE__ */ r(
         "svg",
         {
           width: "12px",
@@ -86,77 +96,81 @@ function H({
           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" })
+          children: /* @__PURE__ */ r("path", { d: "M1799 349l242 241-1017 1017L7 590l242-241 775 775 775-775z" })
         }
       )
     ] }),
-    /* @__PURE__ */ o(
+    /* @__PURE__ */ r(
       "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(
+        className: `${y} bg-base-300 rounded-box z-[1] w-52 p-2 shadow-2xl max-h-96 overflow-y-auto`,
+        children: n.map((e) => /* @__PURE__ */ r("li", { children: /* @__PURE__ */ r(
           "input",
           {
             type: "radio",
-            name: i,
-            className: `${f} ${N} ${D} ${B} justify-start`,
+            name: c,
+            className: `${A} ${E} ${I} ${O} justify-start`,
             "aria-label": e,
             value: e,
-            checked: u === e,
-            onChange: () => c(e)
+            checked: d === e,
+            onChange: () => s(e)
           }
         ) }, e))
       }
     )
   ] });
 }
-const L = {
-  xs: y,
-  sm: O,
-  md: z,
-  lg: I,
-  xl: j
+const R = {
+  xs: j,
+  sm: F,
+  md: H,
+  lg: L,
+  xl: V
 };
-function V({
-  lightTheme: t = "light",
-  darkTheme: n = "dark",
-  onChange: l,
-  size: d,
-  className: i = ""
+function q({
+  lightTheme: n = "light",
+  darkTheme: o = "dark",
+  onChange: u,
+  size: m,
+  className: g = ""
 }) {
-  const { componentSize: u } = A(), s = d ?? u ?? "md", [c, e] = h(() => a() === n);
-  w(() => {
-    const g = new MutationObserver(() => {
-      const b = a();
-      e(b === n);
+  const { componentSize: t } = S(), { setTheme: h, isDark: c } = v(), d = h ?? x, l = m ?? t ?? "md", [s, e] = b(() => c !== void 0 ? c : i() === o);
+  f(() => {
+    if (c !== void 0) {
+      e(c);
+      return;
+    }
+    const w = new MutationObserver(() => {
+      const T = i();
+      e(T === o);
     });
-    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), l?.(v);
+    return w.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme"] }), () => w.disconnect();
+  }, [o, c]);
+  const a = (w) => {
+    const k = w.target.checked ? o : n;
+    d(k), u?.(k);
   };
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ r(
     "input",
     {
       type: "checkbox",
-      className: `${E} ${L[s]} ${i}`,
-      checked: c,
-      onChange: r,
+      className: `${z} ${R[l]} ${g}`,
+      checked: s,
+      onChange: a,
       "aria-label": "Toggle theme"
     }
   );
 }
-const q = Object.assign(
+const U = Object.assign(
   {},
   {
-    Swap: F,
-    Dropdown: H,
-    Toggle: V
+    Swap: X,
+    Dropdown: G,
+    Toggle: q
   }
 );
 export {
-  q as ThemeController
+  U as ThemeController
 };
 //# sourceMappingURL=ThemeController.js.map

package/dist/components/ThemeController.js.map

@@ -1 +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 = 'swap'\nconst dSwapRotate = 'swap-rotate'\nconst dSwapOff = 'swap-off'\nconst dSwapOn = 'swap-on'\nconst dDropdown = 'dropdown'\nconst dDropdownEnd = 'dropdown-end'\nconst dDropdownContent = 'dropdown-content'\nconst dBtn = 'btn'\nconst dBtnSm = 'btn-sm'\nconst dBtnBlock = 'btn-block'\nconst dBtnGhost = 'btn-ghost'\nconst dToggle = 'toggle'\nconst dToggleXs = 'toggle-xs'\nconst dToggleSm = 'toggle-sm'\nconst dToggleMd = 'toggle-md'\nconst dToggleLg = 'toggle-lg'\nconst dToggleXl = '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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"}
+{"version":3,"file":"ThemeController.js","sources":["../../src/components/ThemeController.tsx"],"sourcesContent":["import React, { useState, useEffect, useId } from 'react'\nimport { useConfig } from './ConfigProvider'\nimport { useTheme } from '../hooks/useTheme'\n\n// DaisyUI classes\nconst dSwap = 'swap'\nconst dSwapRotate = 'swap-rotate'\nconst dSwapOff = 'swap-off'\nconst dSwapOn = 'swap-on'\nconst dDropdown = 'dropdown'\nconst dDropdownEnd = 'dropdown-end'\nconst dDropdownContent = 'dropdown-content'\nconst dBtn = 'btn'\nconst dBtnSm = 'btn-sm'\nconst dBtnBlock = 'btn-block'\nconst dBtnGhost = 'btn-ghost'\nconst dToggle = 'toggle'\nconst dToggleXs = 'toggle-xs'\nconst dToggleSm = 'toggle-sm'\nconst dToggleMd = 'toggle-md'\nconst dToggleLg = 'toggle-lg'\nconst dToggleXl = '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 directly on document (fallback when no ThemeProvider)\nfunction setThemeDirectly(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 { setTheme: contextSetTheme, isDark: contextIsDark } = useTheme()\n  const setTheme = contextSetTheme ?? setThemeDirectly\n\n  const [isDark, setIsDark] = useState(() => {\n    if (contextIsDark !== undefined) return contextIsDark\n    const current = getCurrentTheme()\n    return current === darkTheme\n  })\n\n  // Sync with context or external theme changes\n  useEffect(() => {\n    if (contextIsDark !== undefined) {\n      setIsDark(contextIsDark)\n      return\n    }\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, contextIsDark])\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 { setTheme: contextSetTheme, resolvedTheme } = useTheme()\n  const setTheme = contextSetTheme ?? setThemeDirectly\n  const radioName = useId()\n\n  const [selectedTheme, setSelectedTheme] = useState(() => {\n    if (resolvedTheme && themes.includes(resolvedTheme)) return resolvedTheme\n    const current = getCurrentTheme()\n    if (current && themes.includes(current)) return current\n    return defaultTheme || themes[0] || 'light'\n  })\n\n  // Sync with context or external theme changes\n  useEffect(() => {\n    if (resolvedTheme && themes.includes(resolvedTheme)) {\n      setSelectedTheme(resolvedTheme)\n      return\n    }\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, resolvedTheme])\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 { setTheme: contextSetTheme, isDark: contextIsDark } = useTheme()\n  const setTheme = contextSetTheme ?? setThemeDirectly\n  const effectiveSize = size ?? componentSize ?? 'md'\n\n  const [isDark, setIsDark] = useState(() => {\n    if (contextIsDark !== undefined) return contextIsDark\n    const current = getCurrentTheme()\n    return current === darkTheme\n  })\n\n  // Sync with context or external theme changes\n  useEffect(() => {\n    if (contextIsDark !== undefined) {\n      setIsDark(contextIsDark)\n      return\n    }\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, contextIsDark])\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","setThemeDirectly","theme","ThemeControllerSwap","lightTheme","darkTheme","onChange","className","contextSetTheme","contextIsDark","useTheme","setTheme","isDark","setIsDark","useState","useEffect","observer","current","handleChange","e","jsxs","jsx","ThemeControllerDropdown","themes","defaultTheme","resolvedTheme","radioName","useId","selectedTheme","setSelectedTheme","sizeClasses","ThemeControllerToggle","size","componentSize","useConfig","effectiveSize","ThemeController"],"mappings":"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"}

package/dist/components/ThemeProvider.js

@@ -1,6 +1,6 @@
 import { jsx as E } from "react/jsx-runtime";
-import { useState as a, useMemo as m, useCallback as k, useEffect as l, createContext as P, useContext as v } from "react";
-const L = /* @__PURE__ */ new Set([
+import { useState as d, useMemo as m, useCallback as k, useEffect as l, createContext as P, useContext as v } from "react";
+const A = /* @__PURE__ */ new Set([
   "dark",
   "synthwave",
   "halloween",
@@ -14,7 +14,7 @@ const L = /* @__PURE__ */ new Set([
   "dim",
   "sunset"
 ]), h = P(void 0);
-function M(t) {
+function L(t) {
   if (typeof document > "u") return "#000000";
   const e = document.createElement("canvas");
   e.width = e.height = 1;
@@ -40,7 +40,7 @@ function b() {
     };
   const t = getComputedStyle(document.documentElement), e = (n, f) => {
     const o = t.getPropertyValue(n).trim();
-    return o ? M(o) : f;
+    return o ? L(o) : f;
   };
   return {
     background: e("--color-base-100", "#ffffff"),
@@ -55,7 +55,7 @@ function b() {
     error: e("--color-error", "#f87272")
   };
 }
-function A() {
+function M() {
   return typeof window > "u" ? "light" : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
 }
 function H(t) {
@@ -73,7 +73,7 @@ function I(t, e) {
     } catch {
     }
 }
-function j({
+function F({
   children: t,
   defaultTheme: e = "system",
   storageKey: n = "asterui-theme",
@@ -81,12 +81,14 @@ function j({
   darkTheme: o = "dark",
   isDarkTheme: i
 }) {
-  const [u, w] = a(() => H(n) || e), [d, C] = a(A), c = m(() => u === "system" ? d === "dark" ? o : f : u, [u, d, f, o]), g = m(() => i ? i(c) : L.has(c), [c, i]), [y, S] = a(b), p = k((r) => {
+  const [u, w] = d(() => H(n) || e), [a, C] = d(M), c = m(() => u === "system" ? a === "dark" ? o : f : u, [u, a, f, o]), g = m(() => i ? i(c) : A.has(c), [c, i]), [y, S] = d(b), p = k((r) => {
     w(r), I(n, r);
   }, [n]);
   l(() => {
     typeof document > "u" || (document.documentElement.setAttribute("data-theme", c), requestAnimationFrame(() => {
-      S(b());
+      requestAnimationFrame(() => {
+        S(b());
+      });
     }));
   }, [c]), l(() => {
     if (typeof window > "u") return;
@@ -107,22 +109,22 @@ function j({
     isDark: g,
     setTheme: p,
     colors: y,
-    systemTheme: d
-  }), [u, c, g, p, y, d]);
+    systemTheme: a
+  }), [u, c, g, p, y, a]);
   return /* @__PURE__ */ E(h.Provider, { value: x, children: t });
 }
-function q() {
+function R() {
   const t = v(h);
   if (!t)
     throw new Error("useThemeContext must be used within a ThemeProvider");
   return t;
 }
-function D() {
+function j() {
   return v(h) !== void 0;
 }
 export {
-  j as ThemeProvider,
-  D as useHasThemeProvider,
-  q as useThemeContext
+  F as ThemeProvider,
+  j as useHasThemeProvider,
+  R as useThemeContext
 };
 //# sourceMappingURL=ThemeProvider.js.map

package/dist/components/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","sources":["../../src/components/ThemeProvider.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useState, useCallback, useMemo } from 'react'\n\n// Common dark themes in DaisyUI\nconst DARK_THEMES = new Set([\n  'dark', 'synthwave', 'halloween', 'forest', 'black', 'luxury', 'dracula',\n  'business', 'night', 'coffee', 'dim', 'sunset'\n])\n\nexport interface ThemeProviderProps {\n  children: React.ReactNode\n  /** Default theme. Use \"system\" to follow browser preference. */\n  defaultTheme?: string\n  /** localStorage key for persisting theme. Set to false to disable persistence. */\n  storageKey?: string | false\n  /** Light theme to use when system preference is light */\n  lightTheme?: string\n  /** Dark theme to use when system preference is dark */\n  darkTheme?: string\n  /** Custom function to determine if a theme is dark */\n  isDarkTheme?: (theme: string) => boolean\n}\n\nexport interface ThemeColors {\n  background: string\n  foreground: string\n  primary: string\n  primaryContent: string\n  secondary: string\n  accent: string\n  info: string\n  success: string\n  warning: string\n  error: string\n}\n\nexport interface ThemeContextValue {\n  /** The theme setting (what user selected: \"system\", \"light\", \"dark\", etc.) */\n  theme: string\n  /** The actual applied theme after resolving \"system\" */\n  resolvedTheme: string\n  /** Whether the resolved theme is dark */\n  isDark: boolean\n  /** Set the theme */\n  setTheme: (theme: string) => void\n  /** Computed theme colors as hex values (for canvas/non-CSS contexts) */\n  colors: ThemeColors\n  /** The system preference (\"light\" or \"dark\") */\n  systemTheme: 'light' | 'dark'\n}\n\nconst ThemeContext = createContext<ThemeContextValue | undefined>(undefined)\n\n// Convert any CSS color to hex\nfunction colorToHex(color: string): string {\n  if (typeof document === 'undefined') return '#000000'\n  const canvas = document.createElement('canvas')\n  canvas.width = canvas.height = 1\n  const ctx = canvas.getContext('2d')\n  if (!ctx) return '#000000'\n  ctx.fillStyle = color\n  ctx.fillRect(0, 0, 1, 1)\n  const [r, g, b] = ctx.getImageData(0, 0, 1, 1).data\n  return `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`\n}\n\nfunction getThemeColors(): ThemeColors {\n  if (typeof document === 'undefined') {\n    return {\n      background: '#ffffff',\n      foreground: '#000000',\n      primary: '#6366f1',\n      primaryContent: '#ffffff',\n      secondary: '#f000b8',\n      accent: '#37cdbe',\n      info: '#3abff8',\n      success: '#36d399',\n      warning: '#fbbd23',\n      error: '#f87272',\n    }\n  }\n\n  const style = getComputedStyle(document.documentElement)\n  const getColor = (varName: string, fallback: string): string => {\n    const value = style.getPropertyValue(varName).trim()\n    return value ? colorToHex(value) : fallback\n  }\n\n  return {\n    background: getColor('--color-base-100', '#ffffff'),\n    foreground: getColor('--color-base-content', '#000000'),\n    primary: getColor('--color-primary', '#6366f1'),\n    primaryContent: getColor('--color-primary-content', '#ffffff'),\n    secondary: getColor('--color-secondary', '#f000b8'),\n    accent: getColor('--color-accent', '#37cdbe'),\n    info: getColor('--color-info', '#3abff8'),\n    success: getColor('--color-success', '#36d399'),\n    warning: getColor('--color-warning', '#fbbd23'),\n    error: getColor('--color-error', '#f87272'),\n  }\n}\n\nfunction getSystemTheme(): 'light' | 'dark' {\n  if (typeof window === 'undefined') return 'light'\n  return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n}\n\nfunction getStoredTheme(key: string | false): string | null {\n  if (!key || typeof window === 'undefined') return null\n  try {\n    return localStorage.getItem(key)\n  } catch {\n    return null\n  }\n}\n\nfunction storeTheme(key: string | false, theme: string): void {\n  if (!key || typeof window === 'undefined') return\n  try {\n    localStorage.setItem(key, theme)\n  } catch {\n    // Ignore storage errors\n  }\n}\n\nexport function ThemeProvider({\n  children,\n  defaultTheme = 'system',\n  storageKey = 'asterui-theme',\n  lightTheme = 'light',\n  darkTheme = 'dark',\n  isDarkTheme,\n}: ThemeProviderProps) {\n  // Initialize theme from storage or default\n  const [theme, setThemeState] = useState<string>(() => {\n    const stored = getStoredTheme(storageKey)\n    return stored || defaultTheme\n  })\n\n  // Track system preference\n  const [systemTheme, setSystemTheme] = useState<'light' | 'dark'>(getSystemTheme)\n\n  // Resolve the actual theme\n  const resolvedTheme = useMemo(() => {\n    if (theme === 'system') {\n      return systemTheme === 'dark' ? darkTheme : lightTheme\n    }\n    return theme\n  }, [theme, systemTheme, lightTheme, darkTheme])\n\n  // Determine if dark\n  const isDark = useMemo(() => {\n    if (isDarkTheme) return isDarkTheme(resolvedTheme)\n    return DARK_THEMES.has(resolvedTheme)\n  }, [resolvedTheme, isDarkTheme])\n\n  // Track colors (updated after theme applies)\n  const [colors, setColors] = useState<ThemeColors>(getThemeColors)\n\n  // Set theme function\n  const setTheme = useCallback((newTheme: string) => {\n    setThemeState(newTheme)\n    storeTheme(storageKey, newTheme)\n  }, [storageKey])\n\n  // Apply theme to document\n  useEffect(() => {\n    if (typeof document === 'undefined') return\n    document.documentElement.setAttribute('data-theme', resolvedTheme)\n\n    // Update colors after a frame to ensure CSS has applied\n    requestAnimationFrame(() => {\n      setColors(getThemeColors())\n    })\n  }, [resolvedTheme])\n\n  // Listen for system preference changes\n  useEffect(() => {\n    if (typeof window === 'undefined') return\n\n    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)')\n    const handleChange = (e: MediaQueryListEvent) => {\n      setSystemTheme(e.matches ? 'dark' : 'light')\n    }\n\n    mediaQuery.addEventListener('change', handleChange)\n    return () => mediaQuery.removeEventListener('change', handleChange)\n  }, [])\n\n  // Listen for storage changes (cross-tab sync)\n  useEffect(() => {\n    if (!storageKey || typeof window === 'undefined') return\n\n    const handleStorage = (e: StorageEvent) => {\n      if (e.key === storageKey && e.newValue) {\n        setThemeState(e.newValue)\n      }\n    }\n\n    window.addEventListener('storage', handleStorage)\n    return () => window.removeEventListener('storage', handleStorage)\n  }, [storageKey])\n\n  const value = useMemo<ThemeContextValue>(() => ({\n    theme,\n    resolvedTheme,\n    isDark,\n    setTheme,\n    colors,\n    systemTheme,\n  }), [theme, resolvedTheme, isDark, setTheme, colors, systemTheme])\n\n  return (\n    <ThemeContext.Provider value={value}>\n      {children}\n    </ThemeContext.Provider>\n  )\n}\n\n/**\n * Hook to access theme context.\n * Must be used within a ThemeProvider.\n */\nexport function useThemeContext(): ThemeContextValue {\n  const context = useContext(ThemeContext)\n  if (!context) {\n    throw new Error('useThemeContext must be used within a ThemeProvider')\n  }\n  return context\n}\n\n/**\n * Check if ThemeProvider is present in the tree.\n */\nexport function useHasThemeProvider(): boolean {\n  return useContext(ThemeContext) !== undefined\n}\n"],"names":["DARK_THEMES","ThemeContext","createContext","colorToHex","color","canvas","ctx","r","g","b","getThemeColors","style","getColor","varName","fallback","value","getSystemTheme","getStoredTheme","key","storeTheme","theme","ThemeProvider","children","defaultTheme","storageKey","lightTheme","darkTheme","isDarkTheme","setThemeState","useState","systemTheme","setSystemTheme","resolvedTheme","useMemo","isDark","colors","setColors","setTheme","useCallback","newTheme","useEffect","mediaQuery","handleChange","e","handleStorage","jsx","useThemeContext","context","useContext","useHasThemeProvider"],"mappings":"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"}
+{"version":3,"file":"ThemeProvider.js","sources":["../../src/components/ThemeProvider.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useState, useCallback, useMemo } from 'react'\n\n// Common dark themes in DaisyUI\nconst DARK_THEMES = new Set([\n  'dark', 'synthwave', 'halloween', 'forest', 'black', 'luxury', 'dracula',\n  'business', 'night', 'coffee', 'dim', 'sunset'\n])\n\nexport interface ThemeProviderProps {\n  children: React.ReactNode\n  /** Default theme. Use \"system\" to follow browser preference. */\n  defaultTheme?: string\n  /** localStorage key for persisting theme. Set to false to disable persistence. */\n  storageKey?: string | false\n  /** Light theme to use when system preference is light */\n  lightTheme?: string\n  /** Dark theme to use when system preference is dark */\n  darkTheme?: string\n  /** Custom function to determine if a theme is dark */\n  isDarkTheme?: (theme: string) => boolean\n}\n\nexport interface ThemeColors {\n  background: string\n  foreground: string\n  primary: string\n  primaryContent: string\n  secondary: string\n  accent: string\n  info: string\n  success: string\n  warning: string\n  error: string\n}\n\nexport interface ThemeContextValue {\n  /** The theme setting (what user selected: \"system\", \"light\", \"dark\", etc.) */\n  theme: string\n  /** The actual applied theme after resolving \"system\" */\n  resolvedTheme: string\n  /** Whether the resolved theme is dark */\n  isDark: boolean\n  /** Set the theme */\n  setTheme: (theme: string) => void\n  /** Computed theme colors as hex values (for canvas/non-CSS contexts) */\n  colors: ThemeColors\n  /** The system preference (\"light\" or \"dark\") */\n  systemTheme: 'light' | 'dark'\n}\n\nconst ThemeContext = createContext<ThemeContextValue | undefined>(undefined)\n\n// Convert any CSS color to hex\nfunction colorToHex(color: string): string {\n  if (typeof document === 'undefined') return '#000000'\n  const canvas = document.createElement('canvas')\n  canvas.width = canvas.height = 1\n  const ctx = canvas.getContext('2d')\n  if (!ctx) return '#000000'\n  ctx.fillStyle = color\n  ctx.fillRect(0, 0, 1, 1)\n  const [r, g, b] = ctx.getImageData(0, 0, 1, 1).data\n  return `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`\n}\n\nfunction getThemeColors(): ThemeColors {\n  if (typeof document === 'undefined') {\n    return {\n      background: '#ffffff',\n      foreground: '#000000',\n      primary: '#6366f1',\n      primaryContent: '#ffffff',\n      secondary: '#f000b8',\n      accent: '#37cdbe',\n      info: '#3abff8',\n      success: '#36d399',\n      warning: '#fbbd23',\n      error: '#f87272',\n    }\n  }\n\n  const style = getComputedStyle(document.documentElement)\n  const getColor = (varName: string, fallback: string): string => {\n    const value = style.getPropertyValue(varName).trim()\n    return value ? colorToHex(value) : fallback\n  }\n\n  return {\n    background: getColor('--color-base-100', '#ffffff'),\n    foreground: getColor('--color-base-content', '#000000'),\n    primary: getColor('--color-primary', '#6366f1'),\n    primaryContent: getColor('--color-primary-content', '#ffffff'),\n    secondary: getColor('--color-secondary', '#f000b8'),\n    accent: getColor('--color-accent', '#37cdbe'),\n    info: getColor('--color-info', '#3abff8'),\n    success: getColor('--color-success', '#36d399'),\n    warning: getColor('--color-warning', '#fbbd23'),\n    error: getColor('--color-error', '#f87272'),\n  }\n}\n\nfunction getSystemTheme(): 'light' | 'dark' {\n  if (typeof window === 'undefined') return 'light'\n  return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n}\n\nfunction getStoredTheme(key: string | false): string | null {\n  if (!key || typeof window === 'undefined') return null\n  try {\n    return localStorage.getItem(key)\n  } catch {\n    return null\n  }\n}\n\nfunction storeTheme(key: string | false, theme: string): void {\n  if (!key || typeof window === 'undefined') return\n  try {\n    localStorage.setItem(key, theme)\n  } catch {\n    // Ignore storage errors\n  }\n}\n\nexport function ThemeProvider({\n  children,\n  defaultTheme = 'system',\n  storageKey = 'asterui-theme',\n  lightTheme = 'light',\n  darkTheme = 'dark',\n  isDarkTheme,\n}: ThemeProviderProps) {\n  // Initialize theme from storage or default\n  const [theme, setThemeState] = useState<string>(() => {\n    const stored = getStoredTheme(storageKey)\n    return stored || defaultTheme\n  })\n\n  // Track system preference\n  const [systemTheme, setSystemTheme] = useState<'light' | 'dark'>(getSystemTheme)\n\n  // Resolve the actual theme\n  const resolvedTheme = useMemo(() => {\n    if (theme === 'system') {\n      return systemTheme === 'dark' ? darkTheme : lightTheme\n    }\n    return theme\n  }, [theme, systemTheme, lightTheme, darkTheme])\n\n  // Determine if dark\n  const isDark = useMemo(() => {\n    if (isDarkTheme) return isDarkTheme(resolvedTheme)\n    return DARK_THEMES.has(resolvedTheme)\n  }, [resolvedTheme, isDarkTheme])\n\n  // Track colors (updated after theme applies)\n  const [colors, setColors] = useState<ThemeColors>(getThemeColors)\n\n  // Set theme function\n  const setTheme = useCallback((newTheme: string) => {\n    setThemeState(newTheme)\n    storeTheme(storageKey, newTheme)\n  }, [storageKey])\n\n  // Apply theme to document\n  useEffect(() => {\n    if (typeof document === 'undefined') return\n    document.documentElement.setAttribute('data-theme', resolvedTheme)\n\n    // Double RAF ensures CSS has fully recalculated after attribute change\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        setColors(getThemeColors())\n      })\n    })\n  }, [resolvedTheme])\n\n  // Listen for system preference changes\n  useEffect(() => {\n    if (typeof window === 'undefined') return\n\n    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)')\n    const handleChange = (e: MediaQueryListEvent) => {\n      setSystemTheme(e.matches ? 'dark' : 'light')\n    }\n\n    mediaQuery.addEventListener('change', handleChange)\n    return () => mediaQuery.removeEventListener('change', handleChange)\n  }, [])\n\n  // Listen for storage changes (cross-tab sync)\n  useEffect(() => {\n    if (!storageKey || typeof window === 'undefined') return\n\n    const handleStorage = (e: StorageEvent) => {\n      if (e.key === storageKey && e.newValue) {\n        setThemeState(e.newValue)\n      }\n    }\n\n    window.addEventListener('storage', handleStorage)\n    return () => window.removeEventListener('storage', handleStorage)\n  }, [storageKey])\n\n  const value = useMemo<ThemeContextValue>(() => ({\n    theme,\n    resolvedTheme,\n    isDark,\n    setTheme,\n    colors,\n    systemTheme,\n  }), [theme, resolvedTheme, isDark, setTheme, colors, systemTheme])\n\n  return (\n    <ThemeContext.Provider value={value}>\n      {children}\n    </ThemeContext.Provider>\n  )\n}\n\n/**\n * Hook to access theme context.\n * Must be used within a ThemeProvider.\n */\nexport function useThemeContext(): ThemeContextValue {\n  const context = useContext(ThemeContext)\n  if (!context) {\n    throw new Error('useThemeContext must be used within a ThemeProvider')\n  }\n  return context\n}\n\n/**\n * Check if ThemeProvider is present in the tree.\n */\nexport function useHasThemeProvider(): boolean {\n  return useContext(ThemeContext) !== undefined\n}\n"],"names":["DARK_THEMES","ThemeContext","createContext","colorToHex","color","canvas","ctx","r","g","b","getThemeColors","style","getColor","varName","fallback","value","getSystemTheme","getStoredTheme","key","storeTheme","theme","ThemeProvider","children","defaultTheme","storageKey","lightTheme","darkTheme","isDarkTheme","setThemeState","useState","systemTheme","setSystemTheme","resolvedTheme","useMemo","isDark","colors","setColors","setTheme","useCallback","newTheme","useEffect","mediaQuery","handleChange","e","handleStorage","jsx","useThemeContext","context","useContext","useHasThemeProvider"],"mappings":"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"}

package/dist/components/Transfer.d.ts

@@ -18,5 +18,7 @@ export interface TransferProps extends Omit<React.HTMLAttributes<HTMLDivElement>
     showSelectAll?: boolean;
     disabled?: boolean;
     listStyle?: React.CSSProperties;
+    /** Test ID prefix for child elements */
+    'data-testid'?: string;
 }
-export declare function Transfer({ dataSource, targetKeys: controlledTargetKeys, defaultTargetKeys, onChange, onSelectChange, titles, render, showSearch, filterOption, showSelectAll, disabled, listStyle, className, ...rest }: TransferProps): import("react/jsx-runtime").JSX.Element;
+export declare function Transfer({ dataSource, targetKeys: controlledTargetKeys, defaultTargetKeys, onChange, onSelectChange, titles, render, showSearch, filterOption, showSelectAll, disabled, listStyle, className, 'data-testid': testId, ...rest }: TransferProps): import("react/jsx-runtime").JSX.Element;