asterui 0.12.9 → 0.12.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/dist/components/Hero.d.ts +6 -13
  2. package/dist/components/Space.d.ts +1 -0
  3. package/dist/components/Splitter.d.ts +2 -0
  4. package/dist/index.d.ts +0 -2
  5. package/dist/index.js +63 -65
  6. package/dist/index.js.map +1 -1
  7. package/dist/index100.js +11 -44
  8. package/dist/index100.js.map +1 -1
  9. package/dist/index101.js +12 -10
  10. package/dist/index101.js.map +1 -1
  11. package/dist/index102.js +7 -14
  12. package/dist/index102.js.map +1 -1
  13. package/dist/index103.js +12 -7
  14. package/dist/index103.js.map +1 -1
  15. package/dist/index104.js +29 -11
  16. package/dist/index104.js.map +1 -1
  17. package/dist/index105.js +16 -29
  18. package/dist/index105.js.map +1 -1
  19. package/dist/index35.js +13 -26
  20. package/dist/index35.js.map +1 -1
  21. package/dist/index74.js +37 -25
  22. package/dist/index74.js.map +1 -1
  23. package/dist/index75.js +223 -103
  24. package/dist/index75.js.map +1 -1
  25. package/dist/index76.js +21 -51
  26. package/dist/index76.js.map +1 -1
  27. package/dist/index77.js +31 -22
  28. package/dist/index77.js.map +1 -1
  29. package/dist/index78.js +22 -31
  30. package/dist/index78.js.map +1 -1
  31. package/dist/index79.js +327 -20
  32. package/dist/index79.js.map +1 -1
  33. package/dist/index80.js +50 -323
  34. package/dist/index80.js.map +1 -1
  35. package/dist/index81.js +40 -56
  36. package/dist/index81.js.map +1 -1
  37. package/dist/index82.js +23 -40
  38. package/dist/index82.js.map +1 -1
  39. package/dist/index83.js +93 -21
  40. package/dist/index83.js.map +1 -1
  41. package/dist/index84.js +148 -87
  42. package/dist/index84.js.map +1 -1
  43. package/dist/index85.js +152 -147
  44. package/dist/index85.js.map +1 -1
  45. package/dist/index86.js +63 -159
  46. package/dist/index86.js.map +1 -1
  47. package/dist/index87.js +35 -65
  48. package/dist/index87.js.map +1 -1
  49. package/dist/index88.js +234 -35
  50. package/dist/index88.js.map +1 -1
  51. package/dist/index89.js +31 -231
  52. package/dist/index89.js.map +1 -1
  53. package/dist/index90.js +210 -34
  54. package/dist/index90.js.map +1 -1
  55. package/dist/index91.js +198 -195
  56. package/dist/index91.js.map +1 -1
  57. package/dist/index92.js +241 -159
  58. package/dist/index92.js.map +1 -1
  59. package/dist/index93.js +166 -283
  60. package/dist/index93.js.map +1 -1
  61. package/dist/index94.js +253 -173
  62. package/dist/index94.js.map +1 -1
  63. package/dist/index95.js +14 -258
  64. package/dist/index95.js.map +1 -1
  65. package/dist/index96.js +31 -12
  66. package/dist/index96.js.map +1 -1
  67. package/dist/index97.js +5 -32
  68. package/dist/index97.js.map +1 -1
  69. package/dist/index98.js +13 -5
  70. package/dist/index98.js.map +1 -1
  71. package/dist/index99.js +43 -11
  72. package/dist/index99.js.map +1 -1
  73. package/package.json +1 -1
  74. package/dist/components/Stack.d.ts +0 -10
  75. package/dist/index106.js +0 -21
  76. package/dist/index106.js.map +0 -1
package/dist/index82.js CHANGED
@@ -1,43 +1,26 @@
1
- import { jsx as m } from "react/jsx-runtime";
2
- import { forwardRef as i } from "react";
3
- const f = i(
4
- ({
5
- size: e,
6
- color: a,
7
- ghost: t = !1,
8
- bordered: r = !0,
9
- className: s = "",
10
- ...x
11
- }, o) => {
12
- const n = {
13
- xs: "textarea-xs",
14
- sm: "textarea-sm",
15
- md: "textarea-md",
16
- lg: "textarea-lg",
17
- xl: "textarea-xl"
18
- }, l = {
19
- neutral: "textarea-neutral",
20
- primary: "textarea-primary",
21
- secondary: "textarea-secondary",
22
- accent: "textarea-accent",
23
- info: "textarea-info",
24
- success: "textarea-success",
25
- warning: "textarea-warning",
26
- error: "textarea-error"
27
- }, c = [
28
- "textarea",
29
- "w-full",
30
- r && "textarea-bordered",
31
- t && "textarea-ghost",
32
- e && n[e],
33
- a && l[a],
34
- s
35
- ].filter(Boolean).join(" ");
36
- return /* @__PURE__ */ m("textarea", { ref: o, className: c, ...x });
37
- }
38
- );
39
- f.displayName = "Textarea";
1
+ import { jsx as t } from "react/jsx-runtime";
2
+ const c = {
3
+ 6e3: "duration-6000",
4
+ 9e3: "duration-9000",
5
+ 12e3: "duration-12000",
6
+ 15e3: "duration-15000",
7
+ 18e3: "duration-18000"
8
+ }, l = ({
9
+ items: s,
10
+ duration: e,
11
+ centered: a = !1,
12
+ className: n = ""
13
+ }) => {
14
+ const r = e ? c[e] : "";
15
+ return /* @__PURE__ */ t(
16
+ "span",
17
+ {
18
+ className: `text-rotate ${r} ${a ? "justify-items-center" : ""} ${n}`.trim(),
19
+ children: /* @__PURE__ */ t("span", { children: s.slice(0, 6).map((i, o) => /* @__PURE__ */ t("span", { children: i }, o)) })
20
+ }
21
+ );
22
+ };
40
23
  export {
41
- f as Textarea
24
+ l as TextRotate
42
25
  };
43
26
  //# sourceMappingURL=index82.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index82.js","sources":["../src/components/Textarea.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\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 sizeClasses = {\n xs: 'textarea-xs',\n sm: 'textarea-sm',\n md: 'textarea-md',\n lg: 'textarea-lg',\n xl: 'textarea-xl',\n }\n\n const colorClasses = {\n neutral: 'textarea-neutral',\n primary: 'textarea-primary',\n secondary: 'textarea-secondary',\n accent: 'textarea-accent',\n info: 'textarea-info',\n success: 'textarea-success',\n warning: 'textarea-warning',\n error: 'textarea-error',\n }\n\n const textareaClasses = [\n 'textarea',\n 'w-full',\n bordered && 'textarea-bordered',\n ghost && 'textarea-ghost',\n size && sizeClasses[size],\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":["Textarea","forwardRef","size","color","ghost","bordered","className","props","ref","sizeClasses","colorClasses","textareaClasses"],"mappings":";;AAUO,MAAMA,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,UAAMC,IAAc;AAAA,MAClB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,GAGAC,IAAe;AAAA,MACnB,SAAS;AAAA,MACT,SAAS;AAAA,MACT,WAAW;AAAA,MACX,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,IAAA,GAGHC,IAAkB;AAAA,MACtB;AAAA,MACA;AAAA,MACAN,KAAY;AAAA,MACZD,KAAS;AAAA,MACTF,KAAQO,EAAYP,CAAI;AAAA,MACxBC,KAASO,EAAaP,CAAK;AAAA,MAC3BG;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,6BAAQ,YAAA,EAAS,KAAAE,GAAU,WAAWG,GAAkB,GAAGJ,GAAO;AAAA,EACpE;AACF;AAEAP,EAAS,cAAc;"}
1
+ {"version":3,"file":"index82.js","sources":["../src/components/TextRotate.tsx"],"sourcesContent":["import React from 'react'\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={`text-rotate ${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":["durationClasses","TextRotate","items","duration","centered","className","durationClass","jsx","item","index"],"mappings":";AAIA,MAAMA,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,eAAeD,CAAa,IAAIF,IAAW,yBAAyB,EAAE,IAAIC,CAAS,GAAG,KAAA;AAAA,MAEjG,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/index83.js CHANGED
@@ -1,26 +1,98 @@
1
- import { jsx as t } from "react/jsx-runtime";
2
- const c = {
3
- 6e3: "duration-6000",
4
- 9e3: "duration-9000",
5
- 12e3: "duration-12000",
6
- 15e3: "duration-15000",
7
- 18e3: "duration-18000"
8
- }, l = ({
9
- items: s,
10
- duration: e,
11
- centered: a = !1,
12
- className: n = ""
1
+ import { jsxs as g, jsx as a } from "react/jsx-runtime";
2
+ import { useState as C } from "react";
3
+ const v = ({
4
+ closable: s = !1,
5
+ closeIcon: t,
6
+ onClose: n,
7
+ color: e,
8
+ icon: r,
9
+ size: o = "md",
10
+ children: l,
11
+ className: i = "",
12
+ ...b
13
13
  }) => {
14
- const r = e ? c[e] : "";
15
- return /* @__PURE__ */ t(
16
- "span",
17
- {
18
- className: `text-rotate ${r} ${a ? "justify-items-center" : ""} ${n}`.trim(),
19
- children: /* @__PURE__ */ t("span", { children: s.slice(0, 6).map((i, o) => /* @__PURE__ */ t("span", { children: i }, o)) })
20
- }
21
- );
14
+ const [m, u] = C(!0), h = () => {
15
+ u(!1), n?.();
16
+ };
17
+ if (!m) return null;
18
+ const d = () => {
19
+ if (!e) return "";
20
+ const c = {
21
+ primary: "badge-primary",
22
+ secondary: "badge-secondary",
23
+ accent: "badge-accent",
24
+ neutral: "badge-neutral",
25
+ info: "badge-info",
26
+ success: "badge-success",
27
+ warning: "badge-warning",
28
+ error: "badge-error",
29
+ ghost: "badge-ghost"
30
+ };
31
+ return c[e] ? c[e] : "";
32
+ }, p = {
33
+ xs: "badge-xs text-xs",
34
+ sm: "badge-sm text-sm",
35
+ md: "badge-md",
36
+ lg: "badge-lg text-lg"
37
+ }, f = [
38
+ "badge gap-1 inline-flex items-center",
39
+ d(),
40
+ p[o],
41
+ i
42
+ ].filter(Boolean).join(" "), x = e && !d() ? { backgroundColor: e, borderColor: e } : void 0;
43
+ return /* @__PURE__ */ g("span", { className: f, style: x, ...b, children: [
44
+ r && /* @__PURE__ */ a("span", { className: "inline-flex", children: r }),
45
+ l,
46
+ s && /* @__PURE__ */ a(
47
+ "button",
48
+ {
49
+ type: "button",
50
+ onClick: h,
51
+ className: "btn btn-ghost btn-xs p-0 min-h-0 h-auto hover:bg-transparent",
52
+ "aria-label": "Close",
53
+ children: t || /* @__PURE__ */ a(
54
+ "svg",
55
+ {
56
+ className: "w-3 h-3",
57
+ fill: "none",
58
+ stroke: "currentColor",
59
+ viewBox: "0 0 24 24",
60
+ children: /* @__PURE__ */ a(
61
+ "path",
62
+ {
63
+ strokeLinecap: "round",
64
+ strokeLinejoin: "round",
65
+ strokeWidth: 2,
66
+ d: "M6 18L18 6M6 6l12 12"
67
+ }
68
+ )
69
+ }
70
+ )
71
+ }
72
+ )
73
+ ] });
74
+ }, N = ({
75
+ checked: s = !1,
76
+ onChange: t,
77
+ icon: n,
78
+ children: e,
79
+ className: r = "",
80
+ ...o
81
+ }) => {
82
+ const l = () => {
83
+ t?.(!s);
84
+ }, i = [
85
+ "badge badge-md gap-1 cursor-pointer transition-colors",
86
+ s ? "badge-primary" : "badge-outline hover:badge-primary hover:badge-outline",
87
+ r
88
+ ].filter(Boolean).join(" ");
89
+ return /* @__PURE__ */ g("span", { className: i, onClick: l, role: "checkbox", "aria-checked": s, ...o, children: [
90
+ n && /* @__PURE__ */ a("span", { className: "inline-flex", children: n }),
91
+ e
92
+ ] });
22
93
  };
23
94
  export {
24
- l as TextRotate
95
+ N as CheckableTag,
96
+ v as Tag
25
97
  };
26
98
  //# sourceMappingURL=index83.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index83.js","sources":["../src/components/TextRotate.tsx"],"sourcesContent":["import React from 'react'\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={`text-rotate ${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":["durationClasses","TextRotate","items","duration","centered","className","durationClass","jsx","item","index"],"mappings":";AAIA,MAAMA,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,eAAeD,CAAa,IAAIF,IAAW,yBAAyB,EAAE,IAAIC,CAAS,GAAG,KAAA;AAAA,MAEjG,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;"}
1
+ {"version":3,"file":"index83.js","sources":["../src/components/Tag.tsx"],"sourcesContent":["import React, { useState } from 'react'\n\nexport interface TagProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'> {\n closable?: boolean\n closeIcon?: React.ReactNode\n onClose?: () => void\n color?: string\n icon?: React.ReactNode\n size?: 'xs' | 'sm' | 'md' | 'lg'\n children?: React.ReactNode\n}\n\nexport interface CheckableTagProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'onChange'> {\n checked?: boolean\n onChange?: (checked: boolean) => void\n icon?: React.ReactNode\n children?: React.ReactNode\n}\n\nexport const Tag: React.FC<TagProps> = ({\n closable = false,\n closeIcon,\n onClose,\n color,\n icon,\n size = 'md',\n children,\n className = '',\n ...rest\n}) => {\n const [visible, setVisible] = useState(true)\n\n const handleClose = () => {\n setVisible(false)\n onClose?.()\n }\n\n if (!visible) return null\n\n // Map color to daisyUI badge classes\n const getColorClass = () => {\n if (!color) return ''\n\n const colorMap: Record<string, string> = {\n primary: 'badge-primary',\n secondary: 'badge-secondary',\n accent: 'badge-accent',\n neutral: 'badge-neutral',\n info: 'badge-info',\n success: 'badge-success',\n warning: 'badge-warning',\n error: 'badge-error',\n ghost: 'badge-ghost',\n }\n\n // Check if it's a preset color\n if (colorMap[color]) {\n return colorMap[color]\n }\n\n // Assume it's a custom hex/color\n return ''\n }\n\n const sizeClasses = {\n xs: 'badge-xs text-xs',\n sm: 'badge-sm text-sm',\n md: 'badge-md',\n lg: 'badge-lg text-lg',\n }\n\n const tagClasses = [\n 'badge gap-1 inline-flex items-center',\n getColorClass(),\n sizeClasses[size],\n className,\n ]\n .filter(Boolean)\n .join(' ')\n\n const customColorStyle = color && !getColorClass() ? { backgroundColor: color, borderColor: color } : undefined\n\n return (\n <span className={tagClasses} style={customColorStyle} {...rest}>\n {icon && <span className=\"inline-flex\">{icon}</span>}\n {children}\n {closable && (\n <button\n type=\"button\"\n onClick={handleClose}\n className=\"btn btn-ghost btn-xs p-0 min-h-0 h-auto hover:bg-transparent\"\n aria-label=\"Close\"\n >\n {closeIcon || (\n <svg\n className=\"w-3 h-3\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M6 18L18 6M6 6l12 12\"\n />\n </svg>\n )}\n </button>\n )}\n </span>\n )\n}\n\nexport const CheckableTag: React.FC<CheckableTagProps> = ({\n checked = false,\n onChange,\n icon,\n children,\n className = '',\n ...rest\n}) => {\n const handleClick = () => {\n onChange?.(!checked)\n }\n\n const tagClasses = [\n 'badge badge-md gap-1 cursor-pointer transition-colors',\n checked ? 'badge-primary' : 'badge-outline hover:badge-primary hover:badge-outline',\n className,\n ]\n .filter(Boolean)\n .join(' ')\n\n return (\n <span className={tagClasses} onClick={handleClick} role=\"checkbox\" aria-checked={checked} {...rest}>\n {icon && <span className=\"inline-flex\">{icon}</span>}\n {children}\n </span>\n )\n}\n"],"names":["Tag","closable","closeIcon","onClose","color","icon","size","children","className","rest","visible","setVisible","useState","handleClose","getColorClass","colorMap","sizeClasses","tagClasses","customColorStyle","jsx","CheckableTag","checked","onChange","handleClick","jsxs"],"mappings":";;AAmBO,MAAMA,IAA0B,CAAC;AAAA,EACtC,UAAAC,IAAW;AAAA,EACX,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAI,GAErCC,IAAc,MAAM;AACxB,IAAAF,EAAW,EAAK,GAChBR,IAAA;AAAA,EACF;AAEA,MAAI,CAACO,EAAS,QAAO;AAGrB,QAAMI,IAAgB,MAAM;AAC1B,QAAI,CAACV,EAAO,QAAO;AAEnB,UAAMW,IAAmC;AAAA,MACvC,SAAS;AAAA,MACT,WAAW;AAAA,MACX,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,IAAA;AAIT,WAAIA,EAASX,CAAK,IACTW,EAASX,CAAK,IAIhB;AAAA,EACT,GAEMY,IAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,GAGAC,IAAa;AAAA,IACjB;AAAA,IACAH,EAAA;AAAA,IACAE,EAAYV,CAAI;AAAA,IAChBE;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,GAELU,IAAmBd,KAAS,CAACU,EAAA,IAAkB,EAAE,iBAAiBV,GAAO,aAAaA,EAAA,IAAU;AAEtG,2BACG,QAAA,EAAK,WAAWa,GAAY,OAAOC,GAAmB,GAAGT,GACvD,UAAA;AAAA,IAAAJ,KAAQ,gBAAAc,EAAC,QAAA,EAAK,WAAU,eAAe,UAAAd,GAAK;AAAA,IAC5CE;AAAA,IACAN,KACC,gBAAAkB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAASN;AAAA,QACT,WAAU;AAAA,QACV,cAAW;AAAA,QAEV,UAAAX,KACC,gBAAAiB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,QAAO;AAAA,YACP,SAAQ;AAAA,YAER,UAAA,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,eAAc;AAAA,gBACd,gBAAe;AAAA,gBACf,aAAa;AAAA,gBACb,GAAE;AAAA,cAAA;AAAA,YAAA;AAAA,UACJ;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAEJ,GAEJ;AAEJ,GAEaC,IAA4C,CAAC;AAAA,EACxD,SAAAC,IAAU;AAAA,EACV,UAAAC;AAAA,EACA,MAAAjB;AAAA,EACA,UAAAE;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMc,IAAc,MAAM;AACxB,IAAAD,IAAW,CAACD,CAAO;AAAA,EACrB,GAEMJ,IAAa;AAAA,IACjB;AAAA,IACAI,IAAU,kBAAkB;AAAA,IAC5Bb;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAgB,EAAC,QAAA,EAAK,WAAWP,GAAY,SAASM,GAAa,MAAK,YAAW,gBAAcF,GAAU,GAAGZ,GAC3F,UAAA;AAAA,IAAAJ,KAAQ,gBAAAc,EAAC,QAAA,EAAK,WAAU,eAAe,UAAAd,GAAK;AAAA,IAC5CE;AAAA,EAAA,GACH;AAEJ;"}
package/dist/index84.js CHANGED
@@ -1,98 +1,159 @@
1
- import { jsxs as g, jsx as a } from "react/jsx-runtime";
2
- import { useState as C } from "react";
3
- const v = ({
4
- closable: s = !1,
5
- closeIcon: t,
6
- onClose: n,
7
- color: e,
8
- icon: r,
9
- size: o = "md",
10
- children: l,
11
- className: i = "",
12
- ...b
13
- }) => {
14
- const [m, u] = C(!0), h = () => {
15
- u(!1), n?.();
1
+ import { jsx as r, jsxs as h } from "react/jsx-runtime";
2
+ import { useState as m, useEffect as g, useId as p } from "react";
3
+ function s() {
4
+ return document.documentElement.getAttribute("data-theme");
5
+ }
6
+ function b(t) {
7
+ document.documentElement.setAttribute("data-theme", t);
8
+ }
9
+ function v({
10
+ lightTheme: t = "light",
11
+ darkTheme: n = "dark",
12
+ onChange: l,
13
+ className: u = ""
14
+ }) {
15
+ const [i, d] = m(() => s() === n);
16
+ g(() => {
17
+ const o = new MutationObserver(() => {
18
+ const e = s();
19
+ d(e === n);
20
+ });
21
+ return o.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme"] }), () => o.disconnect();
22
+ }, [n]);
23
+ const a = (o) => {
24
+ const c = o.target.checked ? n : t;
25
+ b(c), l?.(c);
16
26
  };
17
- if (!m) return null;
18
- const d = () => {
19
- if (!e) return "";
20
- const c = {
21
- primary: "badge-primary",
22
- secondary: "badge-secondary",
23
- accent: "badge-accent",
24
- neutral: "badge-neutral",
25
- info: "badge-info",
26
- success: "badge-success",
27
- warning: "badge-warning",
28
- error: "badge-error",
29
- ghost: "badge-ghost"
30
- };
31
- return c[e] ? c[e] : "";
32
- }, p = {
33
- xs: "badge-xs text-xs",
34
- sm: "badge-sm text-sm",
35
- md: "badge-md",
36
- lg: "badge-lg text-lg"
37
- }, f = [
38
- "badge gap-1 inline-flex items-center",
39
- d(),
40
- p[o],
41
- i
42
- ].filter(Boolean).join(" "), x = e && !d() ? { backgroundColor: e, borderColor: e } : void 0;
43
- return /* @__PURE__ */ g("span", { className: f, style: x, ...b, children: [
44
- r && /* @__PURE__ */ a("span", { className: "inline-flex", children: r }),
45
- l,
46
- s && /* @__PURE__ */ a(
47
- "button",
27
+ return /* @__PURE__ */ h("label", { className: `swap swap-rotate ${u}`, children: [
28
+ /* @__PURE__ */ r(
29
+ "input",
48
30
  {
49
- type: "button",
50
- onClick: h,
51
- className: "btn btn-ghost btn-xs p-0 min-h-0 h-auto hover:bg-transparent",
52
- "aria-label": "Close",
53
- children: t || /* @__PURE__ */ a(
54
- "svg",
31
+ type: "checkbox",
32
+ checked: i,
33
+ onChange: a
34
+ }
35
+ ),
36
+ /* @__PURE__ */ r(
37
+ "svg",
38
+ {
39
+ className: "swap-off h-8 w-8 fill-current",
40
+ xmlns: "http://www.w3.org/2000/svg",
41
+ viewBox: "0 0 24 24",
42
+ 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" })
43
+ }
44
+ ),
45
+ /* @__PURE__ */ r(
46
+ "svg",
47
+ {
48
+ className: "swap-on h-8 w-8 fill-current",
49
+ xmlns: "http://www.w3.org/2000/svg",
50
+ viewBox: "0 0 24 24",
51
+ 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" })
52
+ }
53
+ )
54
+ ] });
55
+ }
56
+ function x({
57
+ themes: t,
58
+ defaultTheme: n,
59
+ onChange: l,
60
+ className: u = ""
61
+ }) {
62
+ const i = p(), [d, a] = m(() => {
63
+ const e = s();
64
+ return e && t.includes(e) ? e : n || t[0] || "light";
65
+ });
66
+ g(() => {
67
+ const e = new MutationObserver(() => {
68
+ const c = s();
69
+ c && t.includes(c) && a(c);
70
+ });
71
+ return e.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme"] }), () => e.disconnect();
72
+ }, [t]);
73
+ const o = (e) => {
74
+ a(e), b(e), l?.(e);
75
+ };
76
+ return /* @__PURE__ */ h("div", { className: `dropdown dropdown-end ${u}`, children: [
77
+ /* @__PURE__ */ h("div", { tabIndex: 0, role: "button", className: "btn", children: [
78
+ "Theme",
79
+ /* @__PURE__ */ r(
80
+ "svg",
81
+ {
82
+ width: "12px",
83
+ height: "12px",
84
+ className: "inline-block h-2 w-2 fill-current opacity-60",
85
+ xmlns: "http://www.w3.org/2000/svg",
86
+ viewBox: "0 0 2048 2048",
87
+ children: /* @__PURE__ */ r("path", { d: "M1799 349l242 241-1017 1017L7 590l242-241 775 775 775-775z" })
88
+ }
89
+ )
90
+ ] }),
91
+ /* @__PURE__ */ r(
92
+ "ul",
93
+ {
94
+ tabIndex: 0,
95
+ className: "dropdown-content bg-base-300 rounded-box z-[1] w-52 p-2 shadow-2xl max-h-96 overflow-y-auto",
96
+ children: t.map((e) => /* @__PURE__ */ r("li", { children: /* @__PURE__ */ r(
97
+ "input",
55
98
  {
56
- className: "w-3 h-3",
57
- fill: "none",
58
- stroke: "currentColor",
59
- viewBox: "0 0 24 24",
60
- children: /* @__PURE__ */ a(
61
- "path",
62
- {
63
- strokeLinecap: "round",
64
- strokeLinejoin: "round",
65
- strokeWidth: 2,
66
- d: "M6 18L18 6M6 6l12 12"
67
- }
68
- )
99
+ type: "radio",
100
+ name: i,
101
+ className: "btn btn-sm btn-block btn-ghost justify-start",
102
+ "aria-label": e,
103
+ value: e,
104
+ checked: d === e,
105
+ onChange: () => o(e)
69
106
  }
70
- )
107
+ ) }, e))
71
108
  }
72
109
  )
73
110
  ] });
74
- }, N = ({
75
- checked: s = !1,
76
- onChange: t,
77
- icon: n,
78
- children: e,
79
- className: r = "",
80
- ...o
81
- }) => {
82
- const l = () => {
83
- t?.(!s);
84
- }, i = [
85
- "badge badge-md gap-1 cursor-pointer transition-colors",
86
- s ? "badge-primary" : "badge-outline hover:badge-primary hover:badge-outline",
87
- r
88
- ].filter(Boolean).join(" ");
89
- return /* @__PURE__ */ g("span", { className: i, onClick: l, role: "checkbox", "aria-checked": s, ...o, children: [
90
- n && /* @__PURE__ */ a("span", { className: "inline-flex", children: n }),
91
- e
92
- ] });
111
+ }
112
+ const f = {
113
+ xs: "toggle-xs",
114
+ sm: "toggle-sm",
115
+ md: "toggle-md",
116
+ lg: "toggle-lg"
93
117
  };
118
+ function A({
119
+ lightTheme: t = "light",
120
+ darkTheme: n = "dark",
121
+ onChange: l,
122
+ size: u = "md",
123
+ className: i = ""
124
+ }) {
125
+ const [d, a] = m(() => s() === n);
126
+ g(() => {
127
+ const e = new MutationObserver(() => {
128
+ const c = s();
129
+ a(c === n);
130
+ });
131
+ return e.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme"] }), () => e.disconnect();
132
+ }, [n]);
133
+ const o = (e) => {
134
+ const w = e.target.checked ? n : t;
135
+ b(w), l?.(w);
136
+ };
137
+ return /* @__PURE__ */ r(
138
+ "input",
139
+ {
140
+ type: "checkbox",
141
+ className: `toggle ${f[u]} ${i}`,
142
+ checked: d,
143
+ onChange: o,
144
+ "aria-label": "Toggle theme"
145
+ }
146
+ );
147
+ }
148
+ const Z = Object.assign(
149
+ {},
150
+ {
151
+ Swap: v,
152
+ Dropdown: x,
153
+ Toggle: A
154
+ }
155
+ );
94
156
  export {
95
- N as CheckableTag,
96
- v as Tag
157
+ Z as ThemeController
97
158
  };
98
159
  //# sourceMappingURL=index84.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index84.js","sources":["../src/components/Tag.tsx"],"sourcesContent":["import React, { useState } from 'react'\n\nexport interface TagProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'> {\n closable?: boolean\n closeIcon?: React.ReactNode\n onClose?: () => void\n color?: string\n icon?: React.ReactNode\n size?: 'xs' | 'sm' | 'md' | 'lg'\n children?: React.ReactNode\n}\n\nexport interface CheckableTagProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'onChange'> {\n checked?: boolean\n onChange?: (checked: boolean) => void\n icon?: React.ReactNode\n children?: React.ReactNode\n}\n\nexport const Tag: React.FC<TagProps> = ({\n closable = false,\n closeIcon,\n onClose,\n color,\n icon,\n size = 'md',\n children,\n className = '',\n ...rest\n}) => {\n const [visible, setVisible] = useState(true)\n\n const handleClose = () => {\n setVisible(false)\n onClose?.()\n }\n\n if (!visible) return null\n\n // Map color to daisyUI badge classes\n const getColorClass = () => {\n if (!color) return ''\n\n const colorMap: Record<string, string> = {\n primary: 'badge-primary',\n secondary: 'badge-secondary',\n accent: 'badge-accent',\n neutral: 'badge-neutral',\n info: 'badge-info',\n success: 'badge-success',\n warning: 'badge-warning',\n error: 'badge-error',\n ghost: 'badge-ghost',\n }\n\n // Check if it's a preset color\n if (colorMap[color]) {\n return colorMap[color]\n }\n\n // Assume it's a custom hex/color\n return ''\n }\n\n const sizeClasses = {\n xs: 'badge-xs text-xs',\n sm: 'badge-sm text-sm',\n md: 'badge-md',\n lg: 'badge-lg text-lg',\n }\n\n const tagClasses = [\n 'badge gap-1 inline-flex items-center',\n getColorClass(),\n sizeClasses[size],\n className,\n ]\n .filter(Boolean)\n .join(' ')\n\n const customColorStyle = color && !getColorClass() ? { backgroundColor: color, borderColor: color } : undefined\n\n return (\n <span className={tagClasses} style={customColorStyle} {...rest}>\n {icon && <span className=\"inline-flex\">{icon}</span>}\n {children}\n {closable && (\n <button\n type=\"button\"\n onClick={handleClose}\n className=\"btn btn-ghost btn-xs p-0 min-h-0 h-auto hover:bg-transparent\"\n aria-label=\"Close\"\n >\n {closeIcon || (\n <svg\n className=\"w-3 h-3\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M6 18L18 6M6 6l12 12\"\n />\n </svg>\n )}\n </button>\n )}\n </span>\n )\n}\n\nexport const CheckableTag: React.FC<CheckableTagProps> = ({\n checked = false,\n onChange,\n icon,\n children,\n className = '',\n ...rest\n}) => {\n const handleClick = () => {\n onChange?.(!checked)\n }\n\n const tagClasses = [\n 'badge badge-md gap-1 cursor-pointer transition-colors',\n checked ? 'badge-primary' : 'badge-outline hover:badge-primary hover:badge-outline',\n className,\n ]\n .filter(Boolean)\n .join(' ')\n\n return (\n <span className={tagClasses} onClick={handleClick} role=\"checkbox\" aria-checked={checked} {...rest}>\n {icon && <span className=\"inline-flex\">{icon}</span>}\n {children}\n </span>\n )\n}\n"],"names":["Tag","closable","closeIcon","onClose","color","icon","size","children","className","rest","visible","setVisible","useState","handleClose","getColorClass","colorMap","sizeClasses","tagClasses","customColorStyle","jsx","CheckableTag","checked","onChange","handleClick","jsxs"],"mappings":";;AAmBO,MAAMA,IAA0B,CAAC;AAAA,EACtC,UAAAC,IAAW;AAAA,EACX,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAI,GAErCC,IAAc,MAAM;AACxB,IAAAF,EAAW,EAAK,GAChBR,IAAA;AAAA,EACF;AAEA,MAAI,CAACO,EAAS,QAAO;AAGrB,QAAMI,IAAgB,MAAM;AAC1B,QAAI,CAACV,EAAO,QAAO;AAEnB,UAAMW,IAAmC;AAAA,MACvC,SAAS;AAAA,MACT,WAAW;AAAA,MACX,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,IAAA;AAIT,WAAIA,EAASX,CAAK,IACTW,EAASX,CAAK,IAIhB;AAAA,EACT,GAEMY,IAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,GAGAC,IAAa;AAAA,IACjB;AAAA,IACAH,EAAA;AAAA,IACAE,EAAYV,CAAI;AAAA,IAChBE;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,GAELU,IAAmBd,KAAS,CAACU,EAAA,IAAkB,EAAE,iBAAiBV,GAAO,aAAaA,EAAA,IAAU;AAEtG,2BACG,QAAA,EAAK,WAAWa,GAAY,OAAOC,GAAmB,GAAGT,GACvD,UAAA;AAAA,IAAAJ,KAAQ,gBAAAc,EAAC,QAAA,EAAK,WAAU,eAAe,UAAAd,GAAK;AAAA,IAC5CE;AAAA,IACAN,KACC,gBAAAkB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAASN;AAAA,QACT,WAAU;AAAA,QACV,cAAW;AAAA,QAEV,UAAAX,KACC,gBAAAiB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,QAAO;AAAA,YACP,SAAQ;AAAA,YAER,UAAA,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,eAAc;AAAA,gBACd,gBAAe;AAAA,gBACf,aAAa;AAAA,gBACb,GAAE;AAAA,cAAA;AAAA,YAAA;AAAA,UACJ;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAEJ,GAEJ;AAEJ,GAEaC,IAA4C,CAAC;AAAA,EACxD,SAAAC,IAAU;AAAA,EACV,UAAAC;AAAA,EACA,MAAAjB;AAAA,EACA,UAAAE;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMc,IAAc,MAAM;AACxB,IAAAD,IAAW,CAACD,CAAO;AAAA,EACrB,GAEMJ,IAAa;AAAA,IACjB;AAAA,IACAI,IAAU,kBAAkB;AAAA,IAC5Bb;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAgB,EAAC,QAAA,EAAK,WAAWP,GAAY,SAASM,GAAa,MAAK,YAAW,gBAAcF,GAAU,GAAGZ,GAC3F,UAAA;AAAA,IAAAJ,KAAQ,gBAAAc,EAAC,QAAA,EAAK,WAAU,eAAe,UAAAd,GAAK;AAAA,IAC5CE;AAAA,EAAA,GACH;AAEJ;"}
1
+ {"version":3,"file":"index84.js","sources":["../src/components/ThemeController.tsx"],"sourcesContent":["import React, { useState, useEffect, useId } from 'react'\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'\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={`swap swap-rotate ${className}`}>\n <input\n type=\"checkbox\"\n checked={isDark}\n onChange={handleChange}\n />\n {/* sun icon */}\n <svg\n className=\"swap-off 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=\"swap-on 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={`dropdown dropdown-end ${className}`}>\n <div tabIndex={0} role=\"button\" className=\"btn\">\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=\"dropdown-content 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=\"btn btn-sm btn-block btn-ghost 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: 'toggle-xs',\n sm: 'toggle-sm',\n md: 'toggle-md',\n lg: 'toggle-lg',\n}\n\nfunction ThemeControllerToggle({\n lightTheme = 'light',\n darkTheme = 'dark',\n onChange,\n size = 'md',\n className = '',\n}: ThemeControllerToggleProps) {\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={`toggle ${sizeClasses[size]} ${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":["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","ThemeController"],"mappings":"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"}