asterui 0.12.19 → 0.12.20

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 (204) hide show
  1. package/dist/components/Code.d.ts +2 -0
  2. package/dist/components/CopyButton.d.ts +34 -0
  3. package/dist/index.d.ts +2 -0
  4. package/dist/index.js +205 -203
  5. package/dist/index.js.map +1 -1
  6. package/dist/index10.js +91 -121
  7. package/dist/index10.js.map +1 -1
  8. package/dist/index100.js +5 -13
  9. package/dist/index100.js.map +1 -1
  10. package/dist/index101.js +11 -43
  11. package/dist/index101.js.map +1 -1
  12. package/dist/index102.js +44 -11
  13. package/dist/index102.js.map +1 -1
  14. package/dist/index103.js +10 -12
  15. package/dist/index103.js.map +1 -1
  16. package/dist/index104.js +14 -7
  17. package/dist/index104.js.map +1 -1
  18. package/dist/index105.js +7 -12
  19. package/dist/index105.js.map +1 -1
  20. package/dist/index106.js +11 -29
  21. package/dist/index106.js.map +1 -1
  22. package/dist/index107.js +29 -16
  23. package/dist/index107.js.map +1 -1
  24. package/dist/index108.js +21 -0
  25. package/dist/index108.js.map +1 -0
  26. package/dist/index11.js +123 -30
  27. package/dist/index11.js.map +1 -1
  28. package/dist/index12.js +28 -263
  29. package/dist/index12.js.map +1 -1
  30. package/dist/index13.js +257 -105
  31. package/dist/index13.js.map +1 -1
  32. package/dist/index14.js +108 -153
  33. package/dist/index14.js.map +1 -1
  34. package/dist/index15.js +154 -146
  35. package/dist/index15.js.map +1 -1
  36. package/dist/index16.js +150 -5
  37. package/dist/index16.js.map +1 -1
  38. package/dist/index17.js +5 -71
  39. package/dist/index17.js.map +1 -1
  40. package/dist/index18.js +70 -24
  41. package/dist/index18.js.map +1 -1
  42. package/dist/index19.js +23 -194
  43. package/dist/index19.js.map +1 -1
  44. package/dist/index20.js +188 -106
  45. package/dist/index20.js.map +1 -1
  46. package/dist/index21.js +107 -177
  47. package/dist/index21.js.map +1 -1
  48. package/dist/index22.js +181 -107
  49. package/dist/index22.js.map +1 -1
  50. package/dist/index23.js +110 -19
  51. package/dist/index23.js.map +1 -1
  52. package/dist/index24.js +17 -41
  53. package/dist/index24.js.map +1 -1
  54. package/dist/index25.js +43 -32
  55. package/dist/index25.js.map +1 -1
  56. package/dist/index26.js +30 -170
  57. package/dist/index26.js.map +1 -1
  58. package/dist/index27.js +171 -40
  59. package/dist/index27.js.map +1 -1
  60. package/dist/index28.js +41 -17
  61. package/dist/index28.js.map +1 -1
  62. package/dist/index29.js +17 -33
  63. package/dist/index29.js.map +1 -1
  64. package/dist/index30.js +33 -52
  65. package/dist/index30.js.map +1 -1
  66. package/dist/index31.js +50 -61
  67. package/dist/index31.js.map +1 -1
  68. package/dist/index32.js +60 -181
  69. package/dist/index32.js.map +1 -1
  70. package/dist/index33.js +184 -18
  71. package/dist/index33.js.map +1 -1
  72. package/dist/index34.js +15 -271
  73. package/dist/index34.js.map +1 -1
  74. package/dist/index35.js +270 -1083
  75. package/dist/index35.js.map +1 -1
  76. package/dist/index36.js +1086 -16
  77. package/dist/index36.js.map +1 -1
  78. package/dist/index37.js +17 -17
  79. package/dist/index37.js.map +1 -1
  80. package/dist/index38.js +15 -120
  81. package/dist/index38.js.map +1 -1
  82. package/dist/index39.js +119 -37
  83. package/dist/index39.js.map +1 -1
  84. package/dist/index40.js +40 -398
  85. package/dist/index40.js.map +1 -1
  86. package/dist/index41.js +390 -89
  87. package/dist/index41.js.map +1 -1
  88. package/dist/index42.js +91 -253
  89. package/dist/index42.js.map +1 -1
  90. package/dist/index43.js +249 -145
  91. package/dist/index43.js.map +1 -1
  92. package/dist/index44.js +155 -15
  93. package/dist/index44.js.map +1 -1
  94. package/dist/index45.js +15 -17
  95. package/dist/index45.js.map +1 -1
  96. package/dist/index46.js +16 -136
  97. package/dist/index46.js.map +1 -1
  98. package/dist/index47.js +134 -10
  99. package/dist/index47.js.map +1 -1
  100. package/dist/index48.js +13 -35
  101. package/dist/index48.js.map +1 -1
  102. package/dist/index49.js +35 -34
  103. package/dist/index49.js.map +1 -1
  104. package/dist/index50.js +34 -81
  105. package/dist/index50.js.map +1 -1
  106. package/dist/index51.js +71 -166
  107. package/dist/index51.js.map +1 -1
  108. package/dist/index52.js +167 -144
  109. package/dist/index52.js.map +1 -1
  110. package/dist/index53.js +152 -11
  111. package/dist/index53.js.map +1 -1
  112. package/dist/index54.js +10 -20
  113. package/dist/index54.js.map +1 -1
  114. package/dist/index55.js +55 -12
  115. package/dist/index55.js.map +1 -1
  116. package/dist/index56.js +14 -7
  117. package/dist/index56.js.map +1 -1
  118. package/dist/index57.js +6 -333
  119. package/dist/index57.js.map +1 -1
  120. package/dist/index58.js +334 -47
  121. package/dist/index58.js.map +1 -1
  122. package/dist/index59.js +47 -122
  123. package/dist/index59.js.map +1 -1
  124. package/dist/index60.js +120 -108
  125. package/dist/index60.js.map +1 -1
  126. package/dist/index61.js +107 -167
  127. package/dist/index61.js.map +1 -1
  128. package/dist/index62.js +167 -29
  129. package/dist/index62.js.map +1 -1
  130. package/dist/index63.js +30 -120
  131. package/dist/index63.js.map +1 -1
  132. package/dist/index64.js +116 -80
  133. package/dist/index64.js.map +1 -1
  134. package/dist/index65.js +85 -19
  135. package/dist/index65.js.map +1 -1
  136. package/dist/index66.js +19 -73
  137. package/dist/index66.js.map +1 -1
  138. package/dist/index67.js +71 -54
  139. package/dist/index67.js.map +1 -1
  140. package/dist/index68.js +56 -44
  141. package/dist/index68.js.map +1 -1
  142. package/dist/index69.js +42 -49
  143. package/dist/index69.js.map +1 -1
  144. package/dist/index70.js +50 -121
  145. package/dist/index70.js.map +1 -1
  146. package/dist/index71.js +118 -102
  147. package/dist/index71.js.map +1 -1
  148. package/dist/index72.js +105 -72
  149. package/dist/index72.js.map +1 -1
  150. package/dist/index73.js +73 -67
  151. package/dist/index73.js.map +1 -1
  152. package/dist/index74.js +66 -19
  153. package/dist/index74.js.map +1 -1
  154. package/dist/index75.js +18 -55
  155. package/dist/index75.js.map +1 -1
  156. package/dist/index76.js +55 -251
  157. package/dist/index76.js.map +1 -1
  158. package/dist/index77.js +254 -22
  159. package/dist/index77.js.map +1 -1
  160. package/dist/index78.js +22 -31
  161. package/dist/index78.js.map +1 -1
  162. package/dist/index79.js +30 -93
  163. package/dist/index79.js.map +1 -1
  164. package/dist/index80.js +89 -324
  165. package/dist/index80.js.map +1 -1
  166. package/dist/index81.js +322 -73
  167. package/dist/index81.js.map +1 -1
  168. package/dist/index82.js +79 -39
  169. package/dist/index82.js.map +1 -1
  170. package/dist/index83.js +40 -23
  171. package/dist/index83.js.map +1 -1
  172. package/dist/index84.js +21 -93
  173. package/dist/index84.js.map +1 -1
  174. package/dist/index85.js +87 -148
  175. package/dist/index85.js.map +1 -1
  176. package/dist/index86.js +147 -152
  177. package/dist/index86.js.map +1 -1
  178. package/dist/index87.js +159 -63
  179. package/dist/index87.js.map +1 -1
  180. package/dist/index88.js +65 -35
  181. package/dist/index88.js.map +1 -1
  182. package/dist/index89.js +35 -234
  183. package/dist/index89.js.map +1 -1
  184. package/dist/index90.js +231 -31
  185. package/dist/index90.js.map +1 -1
  186. package/dist/index91.js +34 -210
  187. package/dist/index91.js.map +1 -1
  188. package/dist/index92.js +195 -198
  189. package/dist/index92.js.map +1 -1
  190. package/dist/index93.js +159 -241
  191. package/dist/index93.js.map +1 -1
  192. package/dist/index94.js +283 -166
  193. package/dist/index94.js.map +1 -1
  194. package/dist/index95.js +173 -253
  195. package/dist/index95.js.map +1 -1
  196. package/dist/index96.js +253 -121
  197. package/dist/index96.js.map +1 -1
  198. package/dist/index97.js +126 -14
  199. package/dist/index97.js.map +1 -1
  200. package/dist/index98.js +12 -31
  201. package/dist/index98.js.map +1 -1
  202. package/dist/index99.js +32 -5
  203. package/dist/index99.js.map +1 -1
  204. package/package.json +1 -1
package/dist/index13.js CHANGED
@@ -1,116 +1,268 @@
1
- import { jsxs as s, jsx as e, Fragment as o } from "react/jsx-runtime";
2
- function y({ children: d, hoverable: a = !1, className: l = "", style: c, ...n }) {
3
- const m = [
4
- "p-6 border border-base-content/10",
5
- a && "cursor-pointer hover:shadow-md transition-shadow",
6
- l
7
- ].filter(Boolean).join(" ");
8
- return /* @__PURE__ */ e("div", { className: m, style: c, ...n, children: d });
1
+ import { jsxs as N, jsx as h, Fragment as q } from "react/jsx-runtime";
2
+ import { useState as x, useRef as z, useEffect as R, useCallback as D } from "react";
3
+ const G = [
4
+ "#000000",
5
+ "#434343",
6
+ "#666666",
7
+ "#999999",
8
+ "#b7b7b7",
9
+ "#cccccc",
10
+ "#d9d9d9",
11
+ "#efefef",
12
+ "#f3f3f3",
13
+ "#ffffff",
14
+ "#980000",
15
+ "#ff0000",
16
+ "#ff9900",
17
+ "#ffff00",
18
+ "#00ff00",
19
+ "#00ffff",
20
+ "#4a86e8",
21
+ "#0000ff",
22
+ "#9900ff",
23
+ "#ff00ff",
24
+ "#e6b8af",
25
+ "#f4cccc",
26
+ "#fce5cd",
27
+ "#fff2cc",
28
+ "#d9ead3",
29
+ "#d0e0e3",
30
+ "#c9daf8",
31
+ "#cfe2f3",
32
+ "#d9d2e9",
33
+ "#ead1dc",
34
+ "#dd7e6b",
35
+ "#ea9999",
36
+ "#f9cb9c",
37
+ "#ffe599",
38
+ "#b6d7a8",
39
+ "#a2c4c9",
40
+ "#a4c2f4",
41
+ "#9fc5e8",
42
+ "#b4a7d6",
43
+ "#d5a6bd",
44
+ "#cc4125",
45
+ "#e06666",
46
+ "#f6b26b",
47
+ "#ffd966",
48
+ "#93c47d",
49
+ "#76a5af",
50
+ "#6d9eeb",
51
+ "#6fa8dc",
52
+ "#8e7cc3",
53
+ "#c27ba0",
54
+ "#a61c00",
55
+ "#cc0000",
56
+ "#e69138",
57
+ "#f1c232",
58
+ "#6aa84f",
59
+ "#45818e",
60
+ "#3c78d8",
61
+ "#3d85c6",
62
+ "#674ea7",
63
+ "#a64d79",
64
+ "#85200c",
65
+ "#990000",
66
+ "#b45f06",
67
+ "#bf9000",
68
+ "#38761d",
69
+ "#134f5c",
70
+ "#1155cc",
71
+ "#0b5394",
72
+ "#351c75",
73
+ "#741b47",
74
+ "#5b0f00",
75
+ "#660000",
76
+ "#783f04",
77
+ "#7f6000",
78
+ "#274e13",
79
+ "#0c343d",
80
+ "#1c4587",
81
+ "#073763",
82
+ "#20124d",
83
+ "#4c1130"
84
+ ];
85
+ function J(o, r, c) {
86
+ r /= 100, c /= 100;
87
+ const i = r * Math.min(c, 1 - c), a = (t) => {
88
+ const l = (t + o / 30) % 12, u = c - i * Math.max(Math.min(l - 3, 9 - l, 1), -1);
89
+ return Math.round(255 * u).toString(16).padStart(2, "0");
90
+ };
91
+ return `#${a(0)}${a(8)}${a(4)}`;
9
92
  }
10
- function C({ avatar: d, title: a, description: l, className: c = "", ...n }) {
11
- return /* @__PURE__ */ s("div", { className: `flex gap-4 ${c}`, ...n, children: [
12
- d && /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: d }),
13
- /* @__PURE__ */ s("div", { className: "flex-1 min-w-0", children: [
14
- a && /* @__PURE__ */ e("div", { className: "font-medium", children: a }),
15
- l && /* @__PURE__ */ e("div", { className: "text-sm opacity-70 mt-1", children: l })
16
- ] })
17
- ] });
93
+ function w(o) {
94
+ const r = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(o);
95
+ if (!r) return { h: 0, s: 100, l: 50 };
96
+ let c = parseInt(r[1], 16) / 255, i = parseInt(r[2], 16) / 255, a = parseInt(r[3], 16) / 255;
97
+ const t = Math.max(c, i, a), l = Math.min(c, i, a);
98
+ let u = 0, f = 0;
99
+ const p = (t + l) / 2;
100
+ if (t !== l) {
101
+ const d = t - l;
102
+ switch (f = p > 0.5 ? d / (2 - t - l) : d / (t + l), t) {
103
+ case c:
104
+ u = ((i - a) / d + (i < a ? 6 : 0)) / 6;
105
+ break;
106
+ case i:
107
+ u = ((a - c) / d + 2) / 6;
108
+ break;
109
+ case a:
110
+ u = ((c - i) / d + 4) / 6;
111
+ break;
112
+ }
113
+ }
114
+ return { h: Math.round(u * 360), s: Math.round(f * 100), l: Math.round(p * 100) };
115
+ }
116
+ function E(o) {
117
+ return /^#[0-9A-Fa-f]{6}$/.test(o);
118
+ }
119
+ function M(o) {
120
+ let r = o.trim();
121
+ return r.startsWith("#") || (r = "#" + r), r.toLowerCase();
18
122
  }
19
- function M({
20
- children: d,
21
- title: a,
22
- extra: l,
23
- cover: c,
24
- actions: n,
25
- className: m = "",
26
- style: h,
27
- size: t,
28
- bordered: b = !0,
29
- side: k = !1,
30
- imageFull: f = !1,
31
- actionsJustify: N = "end",
32
- loading: g = !1,
33
- hoverable: j = !1,
34
- avatar: r,
35
- description: i,
123
+ function Z({
124
+ value: o = "#000000",
125
+ onChange: r,
126
+ mode: c = "both",
127
+ presets: i = G,
128
+ size: a = "md",
129
+ disabled: t = !1,
130
+ className: l = "",
36
131
  ...u
37
132
  }) {
38
- const v = [
39
- "card",
40
- "bg-base-100",
41
- t && {
42
- xs: "card-xs",
43
- sm: "card-sm",
44
- md: "card-md",
45
- lg: "card-lg",
46
- xl: "card-xl"
47
- }[t],
48
- // Don't add border when imageFull is used (it breaks the overlay effect)
49
- b && !f && "border border-base-content/10 shadow-sm",
50
- k && "card-side",
51
- f && "image-full shadow-sm",
52
- j && "transition-shadow hover:shadow-lg cursor-pointer",
53
- m
54
- ].filter(Boolean).join(" "), w = {
55
- start: "justify-start",
56
- center: "justify-center",
57
- end: "justify-end"
133
+ const [f, p] = x(() => w(o)), [d, m] = x(o), [$, H] = x(!1), [v, I] = x(!1), k = z(null), C = z(null);
134
+ R(() => {
135
+ E(o) && (p(w(o)), m(o));
136
+ }, [o]);
137
+ const g = D((e) => {
138
+ p(e);
139
+ const n = J(e.h, e.s, e.l);
140
+ m(n), r?.(n);
141
+ }, [r]), S = D((e, n) => {
142
+ if (!k.current || t) return;
143
+ const s = k.current.getBoundingClientRect(), y = Math.max(0, Math.min(1, (e - s.left) / s.width)), V = Math.max(0, Math.min(1, (n - s.top) / s.height)), W = Math.round(y * 100), _ = Math.round((1 - V) * 100);
144
+ g({ ...f, s: W, l: _ });
145
+ }, [f, g, t]), X = (e) => {
146
+ t || (H(!0), S(e.clientX, e.clientY));
147
+ }, L = D((e) => {
148
+ if (!C.current || t) return;
149
+ const n = C.current.getBoundingClientRect(), s = Math.max(0, Math.min(1, (e - n.left) / n.width)), y = Math.round(s * 360);
150
+ g({ ...f, h: y });
151
+ }, [f, g, t]), P = (e) => {
152
+ t || (I(!0), L(e.clientX));
58
153
  };
59
- if (g)
60
- return /* @__PURE__ */ s("div", { className: v, style: h, ...u, children: [
61
- c && /* @__PURE__ */ e("figure", { children: /* @__PURE__ */ e("div", { className: "skeleton h-48 w-full rounded-none" }) }),
62
- /* @__PURE__ */ s("div", { className: "card-body", children: [
63
- (r || a) && /* @__PURE__ */ s("div", { className: "flex gap-4 mb-4", children: [
64
- r && /* @__PURE__ */ e("div", { className: "skeleton w-12 h-12 rounded-full flex-shrink-0" }),
65
- /* @__PURE__ */ s("div", { className: "flex-1 space-y-2", children: [
66
- /* @__PURE__ */ e("div", { className: "skeleton h-6 w-2/3" }),
67
- i && /* @__PURE__ */ e("div", { className: "skeleton h-4 w-full" })
68
- ] })
69
- ] }),
70
- !r && !a && /* @__PURE__ */ s(o, { children: [
71
- /* @__PURE__ */ e("div", { className: "skeleton h-6 w-2/3 mb-4" }),
72
- /* @__PURE__ */ s("div", { className: "space-y-2", children: [
73
- /* @__PURE__ */ e("div", { className: "skeleton h-4 w-full" }),
74
- /* @__PURE__ */ e("div", { className: "skeleton h-4 w-5/6" }),
75
- /* @__PURE__ */ e("div", { className: "skeleton h-4 w-4/6" })
76
- ] })
77
- ] }),
78
- n && /* @__PURE__ */ s("div", { className: `card-actions ${w[N]} mt-4`, children: [
79
- /* @__PURE__ */ e("div", { className: "skeleton h-10 w-20" }),
80
- /* @__PURE__ */ e("div", { className: "skeleton h-10 w-20" })
81
- ] })
154
+ R(() => {
155
+ const e = (s) => {
156
+ $ ? S(s.clientX, s.clientY) : v && L(s.clientX);
157
+ }, n = () => {
158
+ H(!1), I(!1);
159
+ };
160
+ if ($ || v)
161
+ return document.addEventListener("mousemove", e), document.addEventListener("mouseup", n), () => {
162
+ document.removeEventListener("mousemove", e), document.removeEventListener("mouseup", n);
163
+ };
164
+ }, [$, v, S, L]);
165
+ const T = (e) => {
166
+ const n = e.target.value;
167
+ m(n);
168
+ const s = M(n);
169
+ E(s) && (p(w(s)), r?.(s));
170
+ }, Y = (e) => {
171
+ if (t) return;
172
+ const n = M(e);
173
+ p(w(n)), m(n), r?.(n);
174
+ }, b = {
175
+ xs: { panel: "w-32 h-32", hue: "h-3", swatch: "w-4 h-4", input: "input-xs" },
176
+ sm: { panel: "w-40 h-40", hue: "h-4", swatch: "w-5 h-5", input: "input-sm" },
177
+ md: { panel: "w-48 h-48", hue: "h-5", swatch: "w-6 h-6", input: "input-md" },
178
+ lg: { panel: "w-56 h-56", hue: "h-6", swatch: "w-7 h-7", input: "input-lg" }
179
+ }[a], F = c === "picker" || c === "both", j = c === "swatches" || c === "both", A = f.s / 100, B = 1 - f.l / 100, U = f.h / 360;
180
+ return /* @__PURE__ */ N("div", { className: `inline-flex flex-col gap-3 ${t ? "opacity-50 pointer-events-none" : ""} ${l}`, ...u, children: [
181
+ F && /* @__PURE__ */ N(q, { children: [
182
+ /* @__PURE__ */ h(
183
+ "div",
184
+ {
185
+ ref: k,
186
+ className: `${b.panel} relative rounded cursor-crosshair select-none`,
187
+ style: {
188
+ background: `
189
+ linear-gradient(to top, #000, transparent),
190
+ linear-gradient(to right, #fff, hsl(${f.h}, 100%, 50%))
191
+ `
192
+ },
193
+ onMouseDown: X,
194
+ children: /* @__PURE__ */ h(
195
+ "div",
196
+ {
197
+ className: "absolute w-4 h-4 border-2 border-white rounded-full shadow-md pointer-events-none",
198
+ style: {
199
+ left: `calc(${A * 100}% - 8px)`,
200
+ top: `calc(${B * 100}% - 8px)`,
201
+ boxShadow: "0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)"
202
+ }
203
+ }
204
+ )
205
+ }
206
+ ),
207
+ /* @__PURE__ */ h(
208
+ "div",
209
+ {
210
+ ref: C,
211
+ className: `${b.hue} w-full relative rounded cursor-pointer select-none`,
212
+ style: {
213
+ background: "linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)"
214
+ },
215
+ onMouseDown: P,
216
+ children: /* @__PURE__ */ h(
217
+ "div",
218
+ {
219
+ className: "absolute top-1/2 w-3 h-full border-2 border-white rounded-sm shadow-md pointer-events-none",
220
+ style: {
221
+ left: `calc(${U * 100}% - 6px)`,
222
+ transform: "translateY(-50%)",
223
+ boxShadow: "0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)"
224
+ }
225
+ }
226
+ )
227
+ }
228
+ ),
229
+ /* @__PURE__ */ N("div", { className: "flex items-center gap-2", children: [
230
+ /* @__PURE__ */ h(
231
+ "div",
232
+ {
233
+ className: "w-8 h-8 rounded border border-base-300 flex-shrink-0",
234
+ style: { backgroundColor: E(M(d)) ? M(d) : o }
235
+ }
236
+ ),
237
+ /* @__PURE__ */ h(
238
+ "input",
239
+ {
240
+ type: "text",
241
+ value: d,
242
+ onChange: T,
243
+ className: `input input-bordered ${b.input} w-full font-mono uppercase`,
244
+ placeholder: "#000000",
245
+ maxLength: 7,
246
+ disabled: t
247
+ }
248
+ )
82
249
  ] })
83
- ] });
84
- const p = r || a && i, x = () => !a && !l ? null : l ? /* @__PURE__ */ s("div", { className: "flex justify-between items-start gap-4", children: [
85
- a && /* @__PURE__ */ e("h2", { className: "card-title", children: a }),
86
- /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: l })
87
- ] }) : a ? /* @__PURE__ */ e("h2", { className: "card-title", children: a }) : null;
88
- return /* @__PURE__ */ s("div", { className: v, style: h, ...u, children: [
89
- c && /* @__PURE__ */ e("figure", { children: c }),
90
- /* @__PURE__ */ s("div", { className: "card-body", children: [
91
- p ? /* @__PURE__ */ s(o, { children: [
92
- /* @__PURE__ */ s("div", { className: "flex gap-4", children: [
93
- r && /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: r }),
94
- /* @__PURE__ */ s("div", { className: "flex-1 min-w-0", children: [
95
- x(),
96
- i && /* @__PURE__ */ e("p", { className: "text-sm opacity-70 mt-1", children: i })
97
- ] })
98
- ] }),
99
- d
100
- ] }) : /* @__PURE__ */ s(o, { children: [
101
- x(),
102
- d
103
- ] }),
104
- n && /* @__PURE__ */ e("div", { className: `card-actions ${w[N]}`, children: n })
105
- ] })
250
+ ] }),
251
+ j && /* @__PURE__ */ h("div", { className: "grid grid-cols-10 gap-1", children: i.map((e, n) => /* @__PURE__ */ h(
252
+ "button",
253
+ {
254
+ type: "button",
255
+ className: `${b.swatch} rounded border border-base-300 cursor-pointer hover:scale-110 transition-transform ${o.toLowerCase() === e.toLowerCase() ? "ring-2 ring-primary ring-offset-1" : ""}`,
256
+ style: { backgroundColor: e },
257
+ onClick: () => Y(e),
258
+ disabled: t,
259
+ "aria-label": `Select color ${e}`
260
+ },
261
+ `${e}-${n}`
262
+ )) })
106
263
  ] });
107
264
  }
108
- const G = Object.assign(M, {
109
- Grid: y,
110
- Meta: C
111
- });
112
265
  export {
113
- G as Card,
114
- G as default
266
+ Z as ColorPicker
115
267
  };
116
268
  //# sourceMappingURL=index13.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index13.js","sources":["../src/components/Card.tsx"],"sourcesContent":["import React from 'react'\n\nexport interface CardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\n children?: React.ReactNode\n title?: React.ReactNode\n /** Content in the top-right corner of the card header */\n extra?: React.ReactNode\n cover?: React.ReactNode\n actions?: React.ReactNode\n size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n bordered?: boolean\n side?: boolean\n imageFull?: boolean\n actionsJustify?: 'start' | 'center' | 'end'\n loading?: boolean\n hoverable?: boolean\n // Meta props for avatar + description layout\n avatar?: React.ReactNode\n description?: React.ReactNode\n}\n\nexport interface CardMetaProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\n /** Avatar or icon element */\n avatar?: React.ReactNode\n /** Title content */\n title?: React.ReactNode\n /** Description content */\n description?: React.ReactNode\n}\n\nexport interface CardGridProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode\n hoverable?: boolean\n}\n\nfunction CardGrid({ children, hoverable = false, className = '', style, ...rest }: CardGridProps) {\n const classes = [\n 'p-6 border border-base-content/10',\n hoverable && 'cursor-pointer hover:shadow-md transition-shadow',\n className,\n ]\n .filter(Boolean)\n .join(' ')\n\n return (\n <div className={classes} style={style} {...rest}>\n {children}\n </div>\n )\n}\n\nfunction CardMeta({ avatar, title, description, className = '', ...rest }: CardMetaProps) {\n return (\n <div className={`flex gap-4 ${className}`} {...rest}>\n {avatar && <div className=\"flex-shrink-0\">{avatar}</div>}\n <div className=\"flex-1 min-w-0\">\n {title && <div className=\"font-medium\">{title}</div>}\n {description && <div className=\"text-sm opacity-70 mt-1\">{description}</div>}\n </div>\n </div>\n )\n}\n\nfunction CardRoot({\n children,\n title,\n extra,\n cover,\n actions,\n className = '',\n style,\n size,\n bordered = true,\n side = false,\n imageFull = false,\n actionsJustify = 'end',\n loading = false,\n hoverable = false,\n avatar,\n description,\n ...rest\n}: CardProps) {\n const sizeClasses: Record<string, string> = {\n xs: 'card-xs',\n sm: 'card-sm',\n md: 'card-md',\n lg: 'card-lg',\n xl: 'card-xl',\n }\n\n const classes = [\n 'card',\n 'bg-base-100',\n size && sizeClasses[size],\n // Don't add border when imageFull is used (it breaks the overlay effect)\n bordered && !imageFull && 'border border-base-content/10 shadow-sm',\n side && 'card-side',\n imageFull && 'image-full shadow-sm',\n hoverable && 'transition-shadow hover:shadow-lg cursor-pointer',\n className,\n ]\n .filter(Boolean)\n .join(' ')\n\n const justifyClasses: Record<string, string> = {\n start: 'justify-start',\n center: 'justify-center',\n end: 'justify-end',\n }\n\n if (loading) {\n return (\n <div className={classes} style={style} {...rest}>\n {cover && (\n <figure>\n <div className=\"skeleton h-48 w-full rounded-none\" />\n </figure>\n )}\n <div className=\"card-body\">\n {(avatar || title) && (\n <div className=\"flex gap-4 mb-4\">\n {avatar && <div className=\"skeleton w-12 h-12 rounded-full flex-shrink-0\" />}\n <div className=\"flex-1 space-y-2\">\n <div className=\"skeleton h-6 w-2/3\" />\n {description && <div className=\"skeleton h-4 w-full\" />}\n </div>\n </div>\n )}\n {!avatar && !title && (\n <>\n <div className=\"skeleton h-6 w-2/3 mb-4\" />\n <div className=\"space-y-2\">\n <div className=\"skeleton h-4 w-full\" />\n <div className=\"skeleton h-4 w-5/6\" />\n <div className=\"skeleton h-4 w-4/6\" />\n </div>\n </>\n )}\n {actions && (\n <div className={`card-actions ${justifyClasses[actionsJustify]} mt-4`}>\n <div className=\"skeleton h-10 w-20\" />\n <div className=\"skeleton h-10 w-20\" />\n </div>\n )}\n </div>\n </div>\n )\n }\n\n // Render with avatar + title + description layout (meta style)\n const hasMetaLayout = avatar || (title && description)\n\n // Header with title and extra\n const renderHeader = () => {\n if (!title && !extra) return null\n\n if (extra) {\n return (\n <div className=\"flex justify-between items-start gap-4\">\n {title && <h2 className=\"card-title\">{title}</h2>}\n <div className=\"flex-shrink-0\">{extra}</div>\n </div>\n )\n }\n\n return title ? <h2 className=\"card-title\">{title}</h2> : null\n }\n\n return (\n <div className={classes} style={style} {...rest}>\n {cover && <figure>{cover}</figure>}\n <div className=\"card-body\">\n {hasMetaLayout ? (\n <>\n <div className=\"flex gap-4\">\n {avatar && <div className=\"flex-shrink-0\">{avatar}</div>}\n <div className=\"flex-1 min-w-0\">\n {renderHeader()}\n {description && <p className=\"text-sm opacity-70 mt-1\">{description}</p>}\n </div>\n </div>\n {children}\n </>\n ) : (\n <>\n {renderHeader()}\n {children}\n </>\n )}\n {actions && <div className={`card-actions ${justifyClasses[actionsJustify]}`}>{actions}</div>}\n </div>\n </div>\n )\n}\n\nexport const Card = Object.assign(CardRoot, {\n Grid: CardGrid,\n Meta: CardMeta,\n})\n\nexport default Card\n"],"names":["CardGrid","children","hoverable","className","style","rest","classes","CardMeta","avatar","title","description","jsx","jsxs","CardRoot","extra","cover","actions","size","bordered","side","imageFull","actionsJustify","loading","justifyClasses","Fragment","hasMetaLayout","renderHeader","Card"],"mappings":"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"}
1
+ {"version":3,"file":"index13.js","sources":["../src/components/ColorPicker.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } from 'react'\n\nexport interface ColorPickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n value?: string\n onChange?: (color: string) => void\n mode?: 'swatches' | 'picker' | 'both'\n presets?: string[]\n size?: 'xs' | 'sm' | 'md' | 'lg'\n disabled?: boolean\n}\n\nconst DEFAULT_PRESETS = [\n '#000000', '#434343', '#666666', '#999999', '#b7b7b7', '#cccccc', '#d9d9d9', '#efefef', '#f3f3f3', '#ffffff',\n '#980000', '#ff0000', '#ff9900', '#ffff00', '#00ff00', '#00ffff', '#4a86e8', '#0000ff', '#9900ff', '#ff00ff',\n '#e6b8af', '#f4cccc', '#fce5cd', '#fff2cc', '#d9ead3', '#d0e0e3', '#c9daf8', '#cfe2f3', '#d9d2e9', '#ead1dc',\n '#dd7e6b', '#ea9999', '#f9cb9c', '#ffe599', '#b6d7a8', '#a2c4c9', '#a4c2f4', '#9fc5e8', '#b4a7d6', '#d5a6bd',\n '#cc4125', '#e06666', '#f6b26b', '#ffd966', '#93c47d', '#76a5af', '#6d9eeb', '#6fa8dc', '#8e7cc3', '#c27ba0',\n '#a61c00', '#cc0000', '#e69138', '#f1c232', '#6aa84f', '#45818e', '#3c78d8', '#3d85c6', '#674ea7', '#a64d79',\n '#85200c', '#990000', '#b45f06', '#bf9000', '#38761d', '#134f5c', '#1155cc', '#0b5394', '#351c75', '#741b47',\n '#5b0f00', '#660000', '#783f04', '#7f6000', '#274e13', '#0c343d', '#1c4587', '#073763', '#20124d', '#4c1130',\n]\n\n// Convert HSL to Hex\nfunction hslToHex(h: number, s: number, l: number): string {\n s /= 100\n l /= 100\n const a = s * Math.min(l, 1 - l)\n const f = (n: number) => {\n const k = (n + h / 30) % 12\n const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1)\n return Math.round(255 * color).toString(16).padStart(2, '0')\n }\n return `#${f(0)}${f(8)}${f(4)}`\n}\n\n// Convert Hex to HSL\nfunction hexToHsl(hex: string): { h: number; s: number; l: number } {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex)\n if (!result) return { h: 0, s: 100, l: 50 }\n\n let r = parseInt(result[1], 16) / 255\n let g = parseInt(result[2], 16) / 255\n let b = parseInt(result[3], 16) / 255\n\n const max = Math.max(r, g, b)\n const min = Math.min(r, g, b)\n let h = 0\n let s = 0\n const l = (max + min) / 2\n\n if (max !== min) {\n const d = max - min\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min)\n switch (max) {\n case r:\n h = ((g - b) / d + (g < b ? 6 : 0)) / 6\n break\n case g:\n h = ((b - r) / d + 2) / 6\n break\n case b:\n h = ((r - g) / d + 4) / 6\n break\n }\n }\n\n return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) }\n}\n\n// Validate hex color\nfunction isValidHex(hex: string): boolean {\n return /^#[0-9A-Fa-f]{6}$/.test(hex)\n}\n\n// Normalize hex (add # if missing, uppercase)\nfunction normalizeHex(hex: string): string {\n let normalized = hex.trim()\n if (!normalized.startsWith('#')) {\n normalized = '#' + normalized\n }\n return normalized.toLowerCase()\n}\n\nexport function ColorPicker({\n value = '#000000',\n onChange,\n mode = 'both',\n presets = DEFAULT_PRESETS,\n size = 'md',\n disabled = false,\n className = '',\n ...rest\n}: ColorPickerProps) {\n const [hsl, setHsl] = useState(() => hexToHsl(value))\n const [hexInput, setHexInput] = useState(value)\n const [isDraggingSL, setIsDraggingSL] = useState(false)\n const [isDraggingHue, setIsDraggingHue] = useState(false)\n const slPanelRef = useRef<HTMLDivElement>(null)\n const hueSliderRef = useRef<HTMLDivElement>(null)\n\n // Sync internal state when value prop changes\n useEffect(() => {\n if (isValidHex(value)) {\n setHsl(hexToHsl(value))\n setHexInput(value)\n }\n }, [value])\n\n const updateColor = useCallback((newHsl: { h: number; s: number; l: number }) => {\n setHsl(newHsl)\n const hex = hslToHex(newHsl.h, newHsl.s, newHsl.l)\n setHexInput(hex)\n onChange?.(hex)\n }, [onChange])\n\n // Saturation/Lightness panel handlers\n const handleSLChange = useCallback((clientX: number, clientY: number) => {\n if (!slPanelRef.current || disabled) return\n const rect = slPanelRef.current.getBoundingClientRect()\n const x = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width))\n const y = Math.max(0, Math.min(1, (clientY - rect.top) / rect.height))\n\n // Convert x,y to saturation and lightness\n // x = saturation (0-100), y = lightness (100-0)\n const s = Math.round(x * 100)\n const l = Math.round((1 - y) * 100)\n updateColor({ ...hsl, s, l })\n }, [hsl, updateColor, disabled])\n\n const handleSLMouseDown = (e: React.MouseEvent) => {\n if (disabled) return\n setIsDraggingSL(true)\n handleSLChange(e.clientX, e.clientY)\n }\n\n // Hue slider handlers\n const handleHueChange = useCallback((clientX: number) => {\n if (!hueSliderRef.current || disabled) return\n const rect = hueSliderRef.current.getBoundingClientRect()\n const x = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width))\n const h = Math.round(x * 360)\n updateColor({ ...hsl, h })\n }, [hsl, updateColor, disabled])\n\n const handleHueMouseDown = (e: React.MouseEvent) => {\n if (disabled) return\n setIsDraggingHue(true)\n handleHueChange(e.clientX)\n }\n\n // Global mouse handlers for dragging\n useEffect(() => {\n const handleMouseMove = (e: MouseEvent) => {\n if (isDraggingSL) {\n handleSLChange(e.clientX, e.clientY)\n } else if (isDraggingHue) {\n handleHueChange(e.clientX)\n }\n }\n\n const handleMouseUp = () => {\n setIsDraggingSL(false)\n setIsDraggingHue(false)\n }\n\n if (isDraggingSL || isDraggingHue) {\n document.addEventListener('mousemove', handleMouseMove)\n document.addEventListener('mouseup', handleMouseUp)\n return () => {\n document.removeEventListener('mousemove', handleMouseMove)\n document.removeEventListener('mouseup', handleMouseUp)\n }\n }\n }, [isDraggingSL, isDraggingHue, handleSLChange, handleHueChange])\n\n // Hex input handler\n const handleHexChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value\n setHexInput(newValue)\n const normalized = normalizeHex(newValue)\n if (isValidHex(normalized)) {\n setHsl(hexToHsl(normalized))\n onChange?.(normalized)\n }\n }\n\n // Preset click handler\n const handlePresetClick = (color: string) => {\n if (disabled) return\n const normalized = normalizeHex(color)\n setHsl(hexToHsl(normalized))\n setHexInput(normalized)\n onChange?.(normalized)\n }\n\n // Size configurations\n const sizeConfig = {\n xs: { panel: 'w-32 h-32', hue: 'h-3', swatch: 'w-4 h-4', input: 'input-xs' },\n sm: { panel: 'w-40 h-40', hue: 'h-4', swatch: 'w-5 h-5', input: 'input-sm' },\n md: { panel: 'w-48 h-48', hue: 'h-5', swatch: 'w-6 h-6', input: 'input-md' },\n lg: { panel: 'w-56 h-56', hue: 'h-6', swatch: 'w-7 h-7', input: 'input-lg' },\n }\n\n const config = sizeConfig[size]\n const showPicker = mode === 'picker' || mode === 'both'\n const showSwatches = mode === 'swatches' || mode === 'both'\n\n // Calculate picker position\n const slX = hsl.s / 100\n const slY = 1 - hsl.l / 100\n const hueX = hsl.h / 360\n\n return (\n <div className={`inline-flex flex-col gap-3 ${disabled ? 'opacity-50 pointer-events-none' : ''} ${className}`} {...rest}>\n {showPicker && (\n <>\n {/* Saturation/Lightness Panel */}\n <div\n ref={slPanelRef}\n className={`${config.panel} relative rounded cursor-crosshair select-none`}\n style={{\n background: `\n linear-gradient(to top, #000, transparent),\n linear-gradient(to right, #fff, hsl(${hsl.h}, 100%, 50%))\n `,\n }}\n onMouseDown={handleSLMouseDown}\n >\n {/* Picker indicator */}\n <div\n className=\"absolute w-4 h-4 border-2 border-white rounded-full shadow-md pointer-events-none\"\n style={{\n left: `calc(${slX * 100}% - 8px)`,\n top: `calc(${slY * 100}% - 8px)`,\n boxShadow: '0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)',\n }}\n />\n </div>\n\n {/* Hue Slider */}\n <div\n ref={hueSliderRef}\n className={`${config.hue} w-full relative rounded cursor-pointer select-none`}\n style={{\n background: 'linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)',\n }}\n onMouseDown={handleHueMouseDown}\n >\n {/* Hue indicator */}\n <div\n className=\"absolute top-1/2 w-3 h-full border-2 border-white rounded-sm shadow-md pointer-events-none\"\n style={{\n left: `calc(${hueX * 100}% - 6px)`,\n transform: 'translateY(-50%)',\n boxShadow: '0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)',\n }}\n />\n </div>\n\n {/* Hex Input and Preview */}\n <div className=\"flex items-center gap-2\">\n <div\n className=\"w-8 h-8 rounded border border-base-300 flex-shrink-0\"\n style={{ backgroundColor: isValidHex(normalizeHex(hexInput)) ? normalizeHex(hexInput) : value }}\n />\n <input\n type=\"text\"\n value={hexInput}\n onChange={handleHexChange}\n className={`input input-bordered ${config.input} w-full font-mono uppercase`}\n placeholder=\"#000000\"\n maxLength={7}\n disabled={disabled}\n />\n </div>\n </>\n )}\n\n {showSwatches && (\n <div className=\"grid grid-cols-10 gap-1\">\n {presets.map((color, index) => (\n <button\n key={`${color}-${index}`}\n type=\"button\"\n className={`${config.swatch} rounded border border-base-300 cursor-pointer hover:scale-110 transition-transform ${\n value.toLowerCase() === color.toLowerCase() ? 'ring-2 ring-primary ring-offset-1' : ''\n }`}\n style={{ backgroundColor: color }}\n onClick={() => handlePresetClick(color)}\n disabled={disabled}\n aria-label={`Select color ${color}`}\n />\n ))}\n </div>\n )}\n </div>\n )\n}\n"],"names":["DEFAULT_PRESETS","hslToHex","h","s","l","a","f","n","k","color","hexToHsl","hex","result","r","g","b","max","min","isValidHex","normalizeHex","normalized","ColorPicker","value","onChange","mode","presets","size","disabled","className","rest","hsl","setHsl","useState","hexInput","setHexInput","isDraggingSL","setIsDraggingSL","isDraggingHue","setIsDraggingHue","slPanelRef","useRef","hueSliderRef","useEffect","updateColor","useCallback","newHsl","handleSLChange","clientX","clientY","rect","x","y","handleSLMouseDown","handleHueChange","handleHueMouseDown","handleMouseMove","e","handleMouseUp","handleHexChange","newValue","handlePresetClick","config","showPicker","showSwatches","slX","slY","hueX","jsxs","Fragment","jsx","index"],"mappings":"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"}