@minimalstuff/ui 1.1.1 → 1.1.3

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.
@@ -1,18 +1,18 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import { Fragment, createElement, useCallback, useEffect, useId, useState } from "react";
1
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
2
+ import React, { Fragment as Fragment$1, createElement, useCallback, useEffect, useId, useState } from "react";
3
3
  import { createPortal } from "react-dom";
4
- function r(e) {
5
- var y, b, x = "";
6
- if (typeof e == "string" || typeof e == "number") x += e;
7
- else if (typeof e == "object") if (Array.isArray(e)) {
8
- var S = e.length;
9
- for (y = 0; y < S; y++) e[y] && (b = r(e[y])) && (x && (x += " "), x += b);
10
- } else for (b in e) e[b] && (x && (x += " "), x += b);
11
- return x;
4
+ function r(i) {
5
+ var M, N, P = "";
6
+ if (typeof i == "string" || typeof i == "number") P += i;
7
+ else if (typeof i == "object") if (Array.isArray(i)) {
8
+ var F = i.length;
9
+ for (M = 0; M < F; M++) i[M] && (N = r(i[M])) && (P && (P += " "), P += N);
10
+ } else for (N in i) i[N] && (P && (P += " "), P += N);
11
+ return P;
12
12
  }
13
13
  function clsx() {
14
- for (var e, y, b = 0, x = "", S = arguments.length; b < S; b++) (e = arguments[b]) && (y = r(e)) && (x && (x += " "), x += y);
15
- return x;
14
+ for (var i, M, N = 0, P = "", F = arguments.length; N < F; N++) (i = arguments[N]) && (M = r(i)) && (P && (P += " "), P += M);
15
+ return P;
16
16
  }
17
17
  var clsx_default = clsx, VARIANT_CLASSES$1 = {
18
18
  primary: "bg-blue-600 text-white hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 border-transparent",
@@ -27,121 +27,133 @@ var clsx_default = clsx, VARIANT_CLASSES$1 = {
27
27
  md: "px-4 py-2 text-sm",
28
28
  lg: "px-4 py-3 text-base"
29
29
  };
30
- const Button = ({ variant: b = "primary", size: x = "md", children: S, className: C, fullWidth: w = !1, loading: T = !1, disabled: E, ...D }) => /* @__PURE__ */ jsxs("button", {
30
+ const Button = ({ variant: i = "primary", size: P = "md", children: F, className: I, fullWidth: L = !1, loading: R = !1, disabled: z, ...B }) => /* @__PURE__ */ jsxs("button", {
31
31
  type: "button",
32
- className: clsx_default("cursor-pointer inline-flex items-center justify-center gap-2 rounded-md font-medium transition-all duration-200 border focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-900 disabled:opacity-50 disabled:cursor-not-allowed", VARIANT_CLASSES$1[b], SIZE_CLASSES$2[x], w && "w-full", C),
33
- disabled: E ?? T,
34
- ...D,
35
- children: [T && /* @__PURE__ */ jsx("span", {
32
+ className: clsx_default("cursor-pointer inline-flex items-center justify-center gap-2 rounded-md font-medium transition-all duration-200 border focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-900 disabled:opacity-50 disabled:cursor-not-allowed", VARIANT_CLASSES$1[i], SIZE_CLASSES$2[P], L && "w-full", I),
33
+ disabled: z ?? R,
34
+ ...B,
35
+ children: [R && /* @__PURE__ */ jsx("span", {
36
36
  className: "i-svg-spinners-3-dots-fade w-4 h-4",
37
37
  "aria-hidden": "true"
38
- }), S]
38
+ }), F]
39
39
  });
40
40
  var CHARACTER_COUNT_STYLES = "text-xs text-gray-500 dark:text-gray-400 mt-1 text-right";
41
- function CharacterCount({ current: e, min: b, max: x, showMin: S, showMax: C }) {
42
- let w = b !== void 0 && e <= b, T = x !== void 0 && e >= x, E = x !== void 0 && e > x;
41
+ function CharacterCount({ current: i, min: M, max: P, showMin: F, showMax: I }) {
42
+ let L = M !== void 0 && i <= M, R = P !== void 0 && i >= P, z = P !== void 0 && i > P;
43
43
  return /* @__PURE__ */ jsxs("div", {
44
44
  className: CHARACTER_COUNT_STYLES,
45
45
  children: [
46
- S && b !== void 0 && /* @__PURE__ */ jsxs("span", {
47
- className: w ? "text-amber-600 dark:text-amber-400" : "",
46
+ F && M !== void 0 && /* @__PURE__ */ jsxs("span", {
47
+ className: L ? "text-amber-600 dark:text-amber-400" : "",
48
48
  children: [
49
- e,
49
+ i,
50
50
  "/",
51
- b,
51
+ M,
52
52
  " min"
53
53
  ]
54
54
  }),
55
- S && C && " · ",
56
- C && x !== void 0 && /* @__PURE__ */ jsxs("span", {
57
- className: E ? "text-red-600 dark:text-red-400" : T ? "text-amber-600 dark:text-amber-400" : "",
55
+ F && I && " · ",
56
+ I && P !== void 0 && /* @__PURE__ */ jsxs("span", {
57
+ className: z ? "text-red-600 dark:text-red-400" : R ? "text-amber-600 dark:text-amber-400" : "",
58
58
  children: [
59
- e,
59
+ i,
60
60
  "/",
61
- x,
61
+ P,
62
62
  " max"
63
63
  ]
64
64
  }),
65
- !S && !C && x !== void 0 && /* @__PURE__ */ jsxs("span", {
66
- className: E ? "text-red-600 dark:text-red-400" : T ? "text-amber-600 dark:text-amber-400" : "",
65
+ !F && !I && P !== void 0 && /* @__PURE__ */ jsxs("span", {
66
+ className: z ? "text-red-600 dark:text-red-400" : R ? "text-amber-600 dark:text-amber-400" : "",
67
67
  children: [
68
- e,
68
+ i,
69
69
  "/",
70
- x
70
+ P
71
71
  ]
72
72
  }),
73
- !S && !C && b !== void 0 && x === void 0 && /* @__PURE__ */ jsxs("span", {
74
- className: w ? "text-amber-600 dark:text-amber-400" : "",
73
+ !F && !I && M !== void 0 && P === void 0 && /* @__PURE__ */ jsxs("span", {
74
+ className: L ? "text-amber-600 dark:text-amber-400" : "",
75
75
  children: [
76
- e,
76
+ i,
77
77
  " (min ",
78
- b,
78
+ M,
79
79
  ")"
80
80
  ]
81
81
  })
82
82
  ]
83
83
  });
84
84
  }
85
- function Checkbox({ label: b, error: x, className: S, wrapperClassName: C, checked: E, defaultChecked: D = !1, onChange: O, id: k = "checkbox", ...A }) {
86
- let j = `${k}-${useId()}`, [M, N] = useState(D), P = E !== void 0, F = P ? E : M;
85
+ function Checkbox({ label: i, description: P, error: F, className: I, wrapperClassName: L, checked: R, defaultChecked: V = !1, onChange: H, id: U = "checkbox", ...G }) {
86
+ let K = `${U}-${useId()}`, [q, J] = useState(V), Y = R !== void 0, X = Y ? R : q, Z = [P && `${K}-description`, F && `${K}-error`].filter(Boolean).join(" ") || void 0;
87
87
  return /* @__PURE__ */ jsxs("div", {
88
- className: clsx_default("w-full", C),
89
- children: [/* @__PURE__ */ jsxs("label", {
90
- htmlFor: j,
91
- className: clsx_default("flex items-start gap-3 cursor-pointer", A.disabled && "cursor-not-allowed opacity-50"),
92
- children: [/* @__PURE__ */ jsxs("span", {
93
- className: clsx_default("relative mt-0.5 shrink-0 rounded", "focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-offset-white dark:focus-within:ring-offset-gray-900", x ? "focus-within:ring-red-500" : "focus-within:ring-blue-500"),
94
- children: [/* @__PURE__ */ jsx("input", {
95
- type: "checkbox",
96
- id: j,
97
- className: "sr-only",
98
- checked: E,
99
- defaultChecked: D,
100
- onChange: (e) => {
101
- P || N(e.target.checked), O?.(e);
102
- },
103
- "aria-invalid": !!x,
104
- "aria-describedby": x ? `${j}-error` : void 0,
105
- ...A
106
- }), /* @__PURE__ */ jsx("span", {
107
- className: clsx_default("flex h-5 w-5 items-center justify-center rounded border-2 transition-all duration-200", F ? "border-blue-600 bg-blue-600 dark:border-blue-500 dark:bg-blue-500" : "border-gray-300 bg-white dark:border-gray-600 dark:bg-gray-800", x && "border-red-500 dark:border-red-400", S),
108
- "aria-hidden": !0,
109
- children: F && /* @__PURE__ */ jsx("svg", {
110
- className: "h-3 w-3 text-white",
111
- viewBox: "0 0 12 12",
112
- fill: "none",
113
- stroke: "currentColor",
114
- strokeWidth: "2.5",
115
- strokeLinecap: "round",
116
- strokeLinejoin: "round",
117
- children: /* @__PURE__ */ jsx("polyline", { points: "2 6 5 9 10 3" })
118
- })
119
- })]
120
- }), b && /* @__PURE__ */ jsxs("span", {
121
- className: "text-sm font-medium text-gray-700 dark:text-gray-300 select-none",
122
- children: [b, A.required && /* @__PURE__ */ jsx("span", {
123
- className: "text-red-500 dark:text-red-400 ml-1",
124
- children: "*"
125
- })]
126
- })]
127
- }), x && /* @__PURE__ */ jsx("p", {
128
- id: `${j}-error`,
129
- className: "text-xs text-red-600 dark:text-red-400 mt-1 ml-8",
130
- role: "alert",
131
- children: x
132
- })]
88
+ className: clsx_default("w-full", L),
89
+ children: [
90
+ /* @__PURE__ */ jsxs("label", {
91
+ htmlFor: K,
92
+ className: clsx_default("flex items-start gap-3 cursor-pointer", G.disabled && "cursor-not-allowed opacity-50"),
93
+ children: [/* @__PURE__ */ jsxs("span", {
94
+ className: clsx_default("relative shrink-0 rounded", "focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-offset-white dark:focus-within:ring-offset-gray-900", F ? "focus-within:ring-red-500" : "focus-within:ring-blue-500"),
95
+ children: [/* @__PURE__ */ jsx("input", {
96
+ type: "checkbox",
97
+ id: K,
98
+ className: "sr-only",
99
+ checked: R,
100
+ defaultChecked: V,
101
+ onChange: (i) => {
102
+ Y || J(i.target.checked), H?.(i);
103
+ },
104
+ "aria-invalid": !!F,
105
+ "aria-describedby": Z,
106
+ ...G
107
+ }), /* @__PURE__ */ jsx("span", {
108
+ className: clsx_default("flex h-5 w-5 items-center justify-center rounded border-2 transition-all duration-200", X ? "border-blue-600 bg-blue-600 dark:border-blue-500 dark:bg-blue-500" : "border-gray-300 bg-white dark:border-gray-600 dark:bg-gray-800", F && "border-red-500 dark:border-red-400", I),
109
+ "aria-hidden": !0,
110
+ children: X && /* @__PURE__ */ jsx("svg", {
111
+ className: "h-3 w-3 text-white",
112
+ viewBox: "0 0 12 12",
113
+ fill: "none",
114
+ stroke: "currentColor",
115
+ strokeWidth: "2.5",
116
+ strokeLinecap: "round",
117
+ strokeLinejoin: "round",
118
+ children: /* @__PURE__ */ jsx("polyline", { points: "2 6 5 9 10 3" })
119
+ })
120
+ })]
121
+ }), typeof i == "string" ? /* @__PURE__ */ jsxs("span", {
122
+ className: "text-sm font-medium text-gray-700 dark:text-gray-300 select-none",
123
+ children: [i, G.required && /* @__PURE__ */ jsx("span", {
124
+ className: "text-red-500 dark:text-red-400 ml-1",
125
+ children: "*"
126
+ })]
127
+ }) : i]
128
+ }),
129
+ P && (typeof P == "string" ? /* @__PURE__ */ jsx("p", {
130
+ id: `${K}-description`,
131
+ className: "text-xs text-gray-500 dark:text-gray-400 mt-1 ml-8",
132
+ children: P
133
+ }) : /* @__PURE__ */ jsx("span", {
134
+ id: `${K}-description`,
135
+ className: "block text-xs text-gray-500 dark:text-gray-400 mt-1 ml-8",
136
+ children: P
137
+ })),
138
+ F && /* @__PURE__ */ jsx("p", {
139
+ id: `${K}-error`,
140
+ className: "text-xs text-red-600 dark:text-red-400 mt-1 ml-8",
141
+ role: "alert",
142
+ children: F
143
+ })
144
+ ]
133
145
  });
134
146
  }
135
147
  const useClientOnly = () => {
136
- let [e, y] = useState(!1);
148
+ let [i, M] = useState(!1);
137
149
  return useEffect(() => {
138
150
  requestAnimationFrame(() => {
139
- y(!0);
151
+ M(!0);
140
152
  });
141
- }, []), e;
142
- }, withClientOnly = (y) => (b) => useClientOnly() ? /* @__PURE__ */ jsx(y, { ...b }) : null;
143
- function ClientOnly({ children: e, fallback: y }) {
144
- return useClientOnly() ? createElement(Fragment, { children: e }) : y ?? null;
153
+ }, []), i;
154
+ }, withClientOnly = (i) => (N) => useClientOnly() ? /* @__PURE__ */ jsx(i, { ...N }) : null;
155
+ function ClientOnly({ children: i, fallback: M }) {
156
+ return useClientOnly() ? createElement(Fragment$1, { children: i }) : M ?? null;
145
157
  }
146
158
  var VARIANT_CLASSES = {
147
159
  default: "text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800",
@@ -158,302 +170,453 @@ var VARIANT_CLASSES = {
158
170
  md: "w-5 h-5",
159
171
  lg: "w-6 h-6"
160
172
  };
161
- const IconButton = ({ icon: b, "aria-label": x, variant: S = "default", size: C = "md", className: w, children: T, ref: E, ...D }) => /* @__PURE__ */ jsxs("button", {
162
- ref: E,
173
+ const IconButton = ({ icon: i, "aria-label": P, variant: F = "default", size: I = "md", className: L, children: R, ref: z, ...B }) => /* @__PURE__ */ jsxs("button", {
174
+ ref: z,
163
175
  type: "button",
164
- "aria-label": x,
165
- className: clsx_default("cursor-pointer inline-flex items-center justify-center rounded transition-colors", "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500", VARIANT_CLASSES[S], SIZE_CLASSES$1[C], w),
166
- ...D,
167
- children: [/* @__PURE__ */ jsx("div", { className: clsx_default(b, ICON_SIZE_CLASSES[C], T && "mr-1") }), T]
176
+ "aria-label": P,
177
+ className: clsx_default("cursor-pointer inline-flex items-center justify-center rounded transition-colors", "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500", VARIANT_CLASSES[F], SIZE_CLASSES$1[I], L),
178
+ ...B,
179
+ children: [/* @__PURE__ */ jsx("div", { className: clsx_default(i, ICON_SIZE_CLASSES[I], R && "mr-1") }), R]
168
180
  }), BASE_INPUT_STYLES = "w-full rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed";
169
- function Input({ label: b, error: x, showCharCount: S = !1, minLength: C, maxLength: E, className: D, wrapperClassName: O, value: k, defaultValue: A, onChange: j, id: M = "input", ...P }) {
170
- let F = `${M}-${useId()}`, [I, L] = useState(typeof A == "string" ? A.length : 0), R = typeof k == "string" ? k.length : k === void 0 ? I : 0, z = S && (C !== void 0 || E !== void 0);
181
+ function Input({ label: i, error: P, showCharCount: F = !1, minLength: I, maxLength: L, className: R, wrapperClassName: V, value: H, defaultValue: U, onChange: G, id: K = "input", ...q }) {
182
+ let J = `${K}-${useId()}`, [X, Z] = useState(typeof U == "string" ? U.length : 0), Q = typeof H == "string" ? H.length : H === void 0 ? X : 0, $ = F && (I !== void 0 || L !== void 0);
171
183
  return /* @__PURE__ */ jsxs("div", {
172
- className: clsx_default("w-full", O),
184
+ className: clsx_default("w-full", V),
173
185
  children: [
174
- b && /* @__PURE__ */ jsxs("label", {
186
+ typeof i == "string" ? /* @__PURE__ */ jsxs("label", {
175
187
  className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",
176
- htmlFor: F,
177
- children: [b, P.required && /* @__PURE__ */ jsx("span", {
188
+ htmlFor: J,
189
+ children: [i, q.required && /* @__PURE__ */ jsx("span", {
178
190
  className: "text-red-500 dark:text-red-400 ml-1",
179
191
  children: "*"
180
192
  })]
181
- }),
193
+ }) : i,
182
194
  /* @__PURE__ */ jsx("input", {
183
- id: F,
184
- className: clsx_default(BASE_INPUT_STYLES, "px-3 py-2 text-sm", x && "border-red-500 dark:border-red-400 focus:ring-red-500", D),
185
- value: k,
186
- defaultValue: A,
187
- minLength: C,
188
- maxLength: E,
189
- onChange: (e) => {
190
- k === void 0 && L(e.target.value.length), j?.(e);
195
+ id: J,
196
+ className: clsx_default(BASE_INPUT_STYLES, "px-3 py-2 text-sm", P && "border-red-500 dark:border-red-400 focus:ring-red-500", R),
197
+ value: H,
198
+ defaultValue: U,
199
+ minLength: I,
200
+ maxLength: L,
201
+ onChange: (i) => {
202
+ H === void 0 && Z(i.target.value.length), G?.(i);
191
203
  },
192
- ...P
204
+ ...q
193
205
  }),
194
- z && /* @__PURE__ */ jsx(CharacterCount, {
195
- current: R,
196
- min: C,
197
- max: E,
198
- showMin: C !== void 0,
199
- showMax: E !== void 0
206
+ $ && /* @__PURE__ */ jsx(CharacterCount, {
207
+ current: Q,
208
+ min: I,
209
+ max: L,
210
+ showMin: I !== void 0,
211
+ showMax: L !== void 0
200
212
  }),
201
- x && /* @__PURE__ */ jsx("p", {
213
+ P && /* @__PURE__ */ jsx("p", {
202
214
  className: "text-xs text-red-600 dark:text-red-400 mt-1",
203
- children: x
215
+ children: P
204
216
  })
205
217
  ]
206
218
  });
207
219
  }
208
- function useRunAfterAnimation(e) {
209
- return useCallback((y) => {
210
- let b = setTimeout(y, e);
211
- return () => clearTimeout(b);
212
- }, [e]);
220
+ function useRunAfterAnimation(i) {
221
+ return useCallback((M) => {
222
+ let N = setTimeout(M, i);
223
+ return () => clearTimeout(N);
224
+ }, [i]);
213
225
  }
214
- var ANIMATION_DURATION_MS = 200, SIZE_CLASSES = {
226
+ var ANIMATION_DURATION_MS$1 = 200, SIZE_CLASSES = {
215
227
  sm: "max-w-md",
216
228
  md: "max-w-lg",
217
229
  lg: "max-w-2xl",
218
230
  xl: "max-w-4xl"
219
231
  };
220
- function Modal({ isOpen: b = !1, onClose: x, title: S, children: w, size: D = "md", className: O }) {
221
- let [k, A] = useState(!1), [j, M] = useState(!1), [N, P] = useState(!1), F = useRunAfterAnimation(ANIMATION_DURATION_MS);
232
+ function Modal({ isOpen: i = !1, onClose: P, title: F, children: I, size: L = "md", className: z }) {
233
+ let [H, U] = useState(!1), [G, K] = useState(!1), [q, J] = useState(!1), Y = useRunAfterAnimation(ANIMATION_DURATION_MS$1);
222
234
  useEffect(() => {
223
- if (b && !j) {
235
+ if (i && !G) {
224
236
  document.body.style.overflow = "hidden";
225
- let e = setTimeout(() => {
226
- M(!0), A(!1), requestAnimationFrame(() => {
227
- requestAnimationFrame(() => P(!0));
237
+ let i = setTimeout(() => {
238
+ K(!0), U(!1), requestAnimationFrame(() => {
239
+ requestAnimationFrame(() => J(!0));
228
240
  });
229
241
  }, 0);
230
- return () => clearTimeout(e);
242
+ return () => clearTimeout(i);
231
243
  }
232
- if (!b && j) {
233
- let e = setTimeout(() => {
234
- A(!0), P(!1);
235
- }, 0), y = F(() => {
236
- M(!1), A(!1), document.body.style.overflow = "";
244
+ if (!i && G) {
245
+ let i = setTimeout(() => {
246
+ U(!0), J(!1);
247
+ }, 0), M = Y(() => {
248
+ K(!1), U(!1), document.body.style.overflow = "";
237
249
  });
238
250
  return () => {
239
- clearTimeout(e), y();
251
+ clearTimeout(i), M();
240
252
  };
241
253
  }
242
254
  }, [
243
- b,
244
- j,
245
- F
255
+ i,
256
+ G,
257
+ Y
246
258
  ]), useEffect(() => {
247
- if (!b || k) return;
248
- let e = (e) => {
249
- e.key === "Escape" && x?.();
259
+ if (!i || H) return;
260
+ let M = (i) => {
261
+ i.key === "Escape" && P?.();
250
262
  };
251
- return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
263
+ return document.addEventListener("keydown", M), () => document.removeEventListener("keydown", M);
252
264
  }, [
253
- b,
254
- k,
255
- x
265
+ i,
266
+ H,
267
+ P
256
268
  ]);
257
- let I = () => {
258
- k || x?.();
269
+ let X = () => {
270
+ H || P?.();
259
271
  };
260
- if (!j) return null;
261
- let L = N && !k;
272
+ if (!G) return null;
273
+ let Z = q && !H;
262
274
  return createPortal(/* @__PURE__ */ jsxs("div", {
263
- className: clsx_default("fixed inset-0 z-50 h-fit flex justify-center p-4 mt-32", "transition-opacity duration-200", L ? "opacity-100" : "opacity-0"),
264
- onClick: I,
275
+ className: clsx_default("fixed inset-0 z-50 h-fit flex justify-center p-4 mt-32", "transition-opacity duration-200", Z ? "opacity-100" : "opacity-0"),
276
+ onClick: X,
265
277
  children: [/* @__PURE__ */ jsx("div", {
266
- className: clsx_default("fixed inset-0 bg-black/50 backdrop-blur-sm", "transition-opacity duration-200", L ? "opacity-100" : "opacity-0"),
278
+ className: clsx_default("fixed inset-0 bg-black/50 backdrop-blur-sm", "transition-opacity duration-200", Z ? "opacity-100" : "opacity-0"),
267
279
  "aria-hidden": "true"
268
280
  }), /* @__PURE__ */ jsxs("div", {
269
- className: clsx_default("relative w-full", SIZE_CLASSES[D], "bg-white dark:bg-gray-800 rounded-lg shadow-xl", "max-h-[90vh] overflow-hidden flex flex-col", "transition-all duration-200", L ? "opacity-100 scale-100 translate-y-0" : "opacity-0 scale-95 translate-y-2"),
270
- onClick: (e) => e.stopPropagation(),
271
- children: [S && /* @__PURE__ */ jsxs("div", {
281
+ className: clsx_default("relative w-full", SIZE_CLASSES[L], "bg-white dark:bg-gray-800 rounded-lg shadow-xl", "max-h-[90vh] overflow-hidden flex flex-col", "transition-all duration-200", Z ? "opacity-100 scale-100 translate-y-0" : "opacity-0 scale-95 translate-y-2"),
282
+ onClick: (i) => i.stopPropagation(),
283
+ children: [F && /* @__PURE__ */ jsxs("div", {
272
284
  className: "flex items-center justify-between px-6 py-4 border-b border-gray-200 dark:border-gray-700",
273
285
  children: [/* @__PURE__ */ jsx("h2", {
274
286
  className: "text-lg font-semibold text-gray-900 dark:text-gray-100",
275
- children: S
287
+ children: F
276
288
  }), /* @__PURE__ */ jsx(IconButton, {
277
289
  icon: "i-mdi-close",
278
- onClick: x?.bind(null),
290
+ onClick: P?.bind(null),
279
291
  "aria-label": "Close",
280
292
  variant: "ghost",
281
293
  className: "text-gray-400 hover:text-gray-600 dark:hover:text-gray-300"
282
294
  })]
283
295
  }), /* @__PURE__ */ jsx("div", {
284
- className: clsx_default("flex-1 overflow-y-auto px-6 py-4 text-gray-600 dark:text-gray-400", O),
285
- children: w
296
+ className: clsx_default("flex-1 overflow-y-auto px-6 py-4 text-gray-600 dark:text-gray-400", z),
297
+ children: I
286
298
  })]
287
299
  })]
288
300
  }), document.body);
289
301
  }
290
- function Select({ options: b, label: x, error: S, placeholder: C, className: T, wrapperClassName: E, value: D, defaultValue: O, onChange: k, id: A = "select", ...j }) {
291
- let M = `${A}-${useId()}`;
302
+ function ConfirmModal({ isOpen: i, onClose: P, onConfirm: F, title: I, children: L, confirmLabel: R, cancelLabel: z, confirmColor: V, loading: H = !1 }) {
303
+ let [U, W] = useState(!1), G = async () => {
304
+ W(!0);
305
+ try {
306
+ await F();
307
+ } finally {
308
+ W(!1);
309
+ }
310
+ }, K = H || U;
311
+ return /* @__PURE__ */ jsx(Modal, {
312
+ isOpen: i,
313
+ onClose: P,
314
+ title: I,
315
+ size: "sm",
316
+ children: /* @__PURE__ */ jsxs("div", {
317
+ className: "space-y-4",
318
+ children: [L && /* @__PURE__ */ jsx("div", {
319
+ className: "text-sm text-gray-600 dark:text-gray-300",
320
+ children: L
321
+ }), /* @__PURE__ */ jsxs("div", {
322
+ className: "flex justify-end gap-3",
323
+ children: [/* @__PURE__ */ jsx(Button, {
324
+ variant: "secondary",
325
+ onClick: P,
326
+ disabled: K,
327
+ size: "sm",
328
+ children: z ?? "Cancel"
329
+ }), /* @__PURE__ */ jsx(Button, {
330
+ variant: (V ?? "blue") === "red" ? "danger" : "primary",
331
+ onClick: G,
332
+ loading: K,
333
+ disabled: K,
334
+ size: "sm",
335
+ children: R ?? "Confirm"
336
+ })]
337
+ })]
338
+ })
339
+ });
340
+ }
341
+ var createStoreImpl = (i) => {
342
+ let M, N = /* @__PURE__ */ new Set(), P = (i, P) => {
343
+ let F = typeof i == "function" ? i(M) : i;
344
+ if (!Object.is(F, M)) {
345
+ let i = M;
346
+ M = P ?? (typeof F != "object" || !F) ? F : Object.assign({}, M, F), N.forEach((N) => N(M, i));
347
+ }
348
+ }, F = () => M, I = {
349
+ setState: P,
350
+ getState: F,
351
+ getInitialState: () => L,
352
+ subscribe: (i) => (N.add(i), () => N.delete(i))
353
+ }, L = M = i(P, F, I);
354
+ return I;
355
+ }, createStore = ((i) => i ? createStoreImpl(i) : createStoreImpl), identity = (i) => i;
356
+ function useStore(i, M = identity) {
357
+ let N = React.useSyncExternalStore(i.subscribe, React.useCallback(() => M(i.getState()), [i, M]), React.useCallback(() => M(i.getInitialState()), [i, M]));
358
+ return React.useDebugValue(N), N;
359
+ }
360
+ var createImpl = (i) => {
361
+ let M = createStore(i), N = (i) => useStore(M, i);
362
+ return Object.assign(N, M), N;
363
+ }, create = ((i) => i ? createImpl(i) : createImpl);
364
+ const useGlobalHotkeysStore = create((i) => ({
365
+ globalHotkeysEnabled: !0,
366
+ setGlobalHotkeysEnabled: (M) => i({ globalHotkeysEnabled: M })
367
+ }));
368
+ var ANIMATION_DURATION_MS = 200, generateId = () => Math.random().toString(36).substring(7);
369
+ const useModalStore = create((i, M) => ({
370
+ modals: [],
371
+ closingIds: /* @__PURE__ */ new Set(),
372
+ open: (N) => {
373
+ let P = generateId(), F = M(), I = F.modals.length === 0;
374
+ return i({ modals: [...F.modals, {
375
+ ...N,
376
+ id: P,
377
+ type: "standard"
378
+ }] }), I && useGlobalHotkeysStore.getState().setGlobalHotkeysEnabled(!1), P;
379
+ },
380
+ openConfirm: (N) => {
381
+ let P = generateId(), F = M(), I = F.modals.length === 0;
382
+ return i({ modals: [...F.modals, {
383
+ ...N,
384
+ id: P,
385
+ type: "confirm"
386
+ }] }), I && useGlobalHotkeysStore.getState().setGlobalHotkeysEnabled(!1), P;
387
+ },
388
+ close: (N) => {
389
+ if (!M().modals.find((i) => i.id === N)) return;
390
+ let P = M().modals.length === 1;
391
+ i((i) => ({ closingIds: new Set(i.closingIds).add(N) })), setTimeout(() => {
392
+ i((i) => {
393
+ let M = new Set(i.closingIds);
394
+ M.delete(N);
395
+ let F = i.modals.filter((i) => i.id !== N);
396
+ return P && F.length === 0 && useGlobalHotkeysStore.getState().setGlobalHotkeysEnabled(!0), {
397
+ modals: F,
398
+ closingIds: M
399
+ };
400
+ });
401
+ }, ANIMATION_DURATION_MS);
402
+ },
403
+ closeAll: () => {
404
+ let N = M().modals;
405
+ N.length !== 0 && (i({ closingIds: new Set(N.map((i) => i.id)) }), setTimeout(() => {
406
+ i({
407
+ modals: [],
408
+ closingIds: /* @__PURE__ */ new Set()
409
+ }), useGlobalHotkeysStore.getState().setGlobalHotkeysEnabled(!0);
410
+ }, ANIMATION_DURATION_MS));
411
+ },
412
+ isOpen: (i) => M().modals.some((M) => M.id === i)
413
+ }));
414
+ function ModalProvider() {
415
+ let N = useModalStore((i) => i.modals), P = useModalStore((i) => i.closingIds), F = useModalStore((i) => i.isOpen), I = useModalStore((i) => i.close);
416
+ return /* @__PURE__ */ jsx(Fragment, { children: N.map((i) => {
417
+ let N = F(i.id) && !P.has(i.id);
418
+ return i.type === "confirm" ? /* @__PURE__ */ jsx(ConfirmModal, {
419
+ isOpen: N,
420
+ onClose: () => I(i.id),
421
+ onConfirm: async () => {
422
+ await i.onConfirm(), I(i.id);
423
+ },
424
+ title: i.title,
425
+ confirmLabel: i.confirmLabel,
426
+ cancelLabel: i.cancelLabel,
427
+ confirmColor: i.confirmColor,
428
+ children: i.children
429
+ }, i.id) : /* @__PURE__ */ jsx(Modal, {
430
+ isOpen: N,
431
+ onClose: () => I(i.id),
432
+ title: i.title,
433
+ size: i.size,
434
+ children: i.children
435
+ }, i.id);
436
+ }) });
437
+ }
438
+ function Select({ options: i, label: P, error: F, placeholder: I, className: L, wrapperClassName: R, value: B, defaultValue: V, onChange: H, id: U = "select", ...G }) {
439
+ let K = `${U}-${useId()}`;
292
440
  return /* @__PURE__ */ jsxs("div", {
293
- className: clsx_default("w-full", E),
441
+ className: clsx_default("w-full", R),
294
442
  children: [
295
- x && /* @__PURE__ */ jsxs("label", {
443
+ typeof P == "string" ? /* @__PURE__ */ jsxs("label", {
296
444
  className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",
297
- htmlFor: M,
298
- children: [x, j.required && /* @__PURE__ */ jsx("span", {
445
+ htmlFor: K,
446
+ children: [P, G.required && /* @__PURE__ */ jsx("span", {
299
447
  className: "text-red-500 dark:text-red-400 ml-1",
300
448
  children: "*"
301
449
  })]
302
- }),
450
+ }) : P,
303
451
  /* @__PURE__ */ jsxs("select", {
304
- id: M,
305
- className: clsx_default(BASE_INPUT_STYLES, "pl-3 pr-8 py-2 text-sm appearance-none bg-[length:1rem_1rem] bg-[position:right_0.5rem_center] bg-no-repeat", "bg-[url(\"data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27M6 8l4 4 4-4%27/%3e%3c/svg%3e\")]", S && "border-red-500 dark:border-red-400 focus:ring-red-500", T),
306
- value: D,
307
- defaultValue: O,
308
- onChange: k,
309
- "aria-invalid": !!S,
310
- "aria-describedby": S ? `${M}-error` : void 0,
311
- ...j,
312
- children: [C !== void 0 && /* @__PURE__ */ jsx("option", {
452
+ id: K,
453
+ className: clsx_default(BASE_INPUT_STYLES, "pl-3 pr-8 py-2 text-sm appearance-none bg-[length:1rem_1rem] bg-[position:right_0.5rem_center] bg-no-repeat", "bg-[url(\"data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27M6 8l4 4 4-4%27/%3e%3c/svg%3e\")]", F && "border-red-500 dark:border-red-400 focus:ring-red-500", L),
454
+ value: B,
455
+ defaultValue: V,
456
+ onChange: H,
457
+ "aria-invalid": !!F,
458
+ "aria-describedby": F ? `${K}-error` : void 0,
459
+ ...G,
460
+ children: [I !== void 0 && /* @__PURE__ */ jsx("option", {
313
461
  value: "",
314
- children: C
315
- }), b.map((y) => /* @__PURE__ */ jsx("option", {
316
- value: y.value,
317
- children: y.label
318
- }, y.value))]
462
+ children: I
463
+ }), i.map((i) => /* @__PURE__ */ jsx("option", {
464
+ value: i.value,
465
+ children: i.label
466
+ }, i.value))]
319
467
  }),
320
- S && /* @__PURE__ */ jsx("p", {
321
- id: `${M}-error`,
468
+ F && /* @__PURE__ */ jsx("p", {
469
+ id: `${K}-error`,
322
470
  className: "text-xs text-red-600 dark:text-red-400 mt-1",
323
471
  role: "alert",
324
- children: S
472
+ children: F
325
473
  })
326
474
  ]
327
475
  });
328
476
  }
329
- function Switch({ label: b, error: x, className: S, wrapperClassName: C, checked: E, defaultChecked: D = !1, onChange: O, id: k = "switch", ...A }) {
330
- let j = `${k}-${useId()}`, [M, N] = useState(D), P = E !== void 0, F = P ? E : M;
477
+ function Switch({ label: P, description: F, error: I, className: L, wrapperClassName: R, checked: V, defaultChecked: H = !1, onChange: U, id: G = "switch", ...K }) {
478
+ let q = `${G}-${useId()}`, [J, Y] = useState(H), X = V !== void 0, Z = X ? V : J, Q = [F && `${q}-description`, I && `${q}-error`].filter(Boolean).join(" ") || void 0;
331
479
  return /* @__PURE__ */ jsxs("div", {
332
- className: clsx_default("w-full", C),
333
- children: [/* @__PURE__ */ jsxs("label", {
334
- htmlFor: j,
335
- className: clsx_default("flex items-center gap-3 cursor-pointer", A.disabled && "cursor-not-allowed opacity-50"),
336
- children: [/* @__PURE__ */ jsxs("span", {
337
- className: clsx_default("relative inline-flex w-11 shrink-0 rounded-full border-2 border-transparent", "transition-colors duration-200 ease-in-out", "focus-within:outline-none focus-within:ring-2 focus-within:ring-blue-500 focus-within:ring-offset-2", "disabled:opacity-50", F ? "bg-blue-600 dark:bg-blue-500" : "bg-gray-200 dark:bg-gray-600", x && "ring-2 ring-red-500 dark:ring-red-400", S),
338
- children: [/* @__PURE__ */ jsx("input", {
339
- type: "checkbox",
340
- role: "switch",
341
- id: j,
342
- className: "sr-only",
343
- checked: E,
344
- defaultChecked: D,
345
- onChange: (e) => {
346
- P || N(e.target.checked), O?.(e);
347
- },
348
- "aria-invalid": !!x,
349
- "aria-describedby": x ? `${j}-error` : void 0,
350
- ...A
351
- }), /* @__PURE__ */ jsx("span", {
352
- className: clsx_default("pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0", "transition duration-200 ease-in-out", F ? "translate-x-5.25" : "translate-x-0"),
353
- "aria-hidden": !0
354
- })]
355
- }), b && /* @__PURE__ */ jsxs("span", {
356
- className: "text-sm font-medium text-gray-700 dark:text-gray-300 select-none",
357
- children: [b, A.required && /* @__PURE__ */ jsx("span", {
480
+ className: clsx_default("w-full", R),
481
+ children: [
482
+ /* @__PURE__ */ jsxs("label", {
483
+ htmlFor: q,
484
+ className: clsx_default("flex items-center gap-3 cursor-pointer", K.disabled && "cursor-not-allowed opacity-50"),
485
+ children: [/* @__PURE__ */ jsxs("span", {
486
+ className: clsx_default("relative inline-flex w-11 shrink-0 rounded-full border-2 border-transparent", "transition-colors duration-200 ease-in-out", "focus-within:outline-none focus-within:ring-2 focus-within:ring-blue-500 focus-within:ring-offset-2", "disabled:opacity-50", Z ? "bg-blue-600 dark:bg-blue-500" : "bg-gray-200 dark:bg-gray-600", I && "ring-2 ring-red-500 dark:ring-red-400", L),
487
+ children: [/* @__PURE__ */ jsx("input", {
488
+ type: "checkbox",
489
+ role: "switch",
490
+ id: q,
491
+ className: "sr-only",
492
+ checked: V,
493
+ defaultChecked: H,
494
+ onChange: (i) => {
495
+ X || Y(i.target.checked), U?.(i);
496
+ },
497
+ "aria-invalid": !!I,
498
+ "aria-describedby": Q,
499
+ ...K
500
+ }), /* @__PURE__ */ jsx("span", {
501
+ className: clsx_default("pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0", "transition duration-200 ease-in-out", Z ? "translate-x-5.25" : "translate-x-0"),
502
+ "aria-hidden": !0
503
+ })]
504
+ }), P && /* @__PURE__ */ jsx(Fragment, { children: typeof P == "string" ? /* @__PURE__ */ jsxs("span", {
505
+ className: "text-sm font-medium text-gray-700 dark:text-gray-300 select-none",
506
+ children: [P, K.required && /* @__PURE__ */ jsx("span", {
507
+ className: "text-red-500 dark:text-red-400 ml-1",
508
+ children: "*"
509
+ })]
510
+ }) : /* @__PURE__ */ jsxs(Fragment, { children: [P, K.required && /* @__PURE__ */ jsx("span", {
358
511
  className: "text-red-500 dark:text-red-400 ml-1",
359
512
  children: "*"
360
- })]
361
- })]
362
- }), x && /* @__PURE__ */ jsx("p", {
363
- id: `${j}-error`,
364
- className: "text-xs text-red-600 dark:text-red-400 mt-1 ml-14",
365
- role: "alert",
366
- children: x
367
- })]
513
+ })] }) })]
514
+ }),
515
+ F && (typeof F == "string" ? /* @__PURE__ */ jsx("p", {
516
+ id: `${q}-description`,
517
+ className: "text-xs text-gray-500 dark:text-gray-400 mt-1 ml-14",
518
+ children: F
519
+ }) : /* @__PURE__ */ jsx("span", {
520
+ id: `${q}-description`,
521
+ className: "block text-xs text-gray-500 dark:text-gray-400 mt-1 ml-14",
522
+ children: F
523
+ })),
524
+ I && /* @__PURE__ */ jsx("p", {
525
+ id: `${q}-error`,
526
+ className: "text-xs text-red-600 dark:text-red-400 mt-1 ml-14",
527
+ role: "alert",
528
+ children: I
529
+ })
530
+ ]
368
531
  });
369
532
  }
370
- function Tabs({ items: b, defaultIndex: x = 0, className: S, tabListClassName: C, panelClassName: w, onChange: E }) {
371
- let [D, O] = useState(x), k = (e) => {
372
- b[e]?.disabled || (O(e), E?.(e));
373
- }, A = b[D];
533
+ function Tabs({ items: i, defaultIndex: P = 0, className: F, tabListClassName: I, panelClassName: L, onChange: R }) {
534
+ let [z, V] = useState(P), H = (M) => {
535
+ i[M]?.disabled || (V(M), R?.(M));
536
+ }, U = i[z];
374
537
  return /* @__PURE__ */ jsxs("div", {
375
- className: clsx_default("w-full", S),
538
+ className: clsx_default("w-full", F),
376
539
  children: [/* @__PURE__ */ jsx("div", {
377
540
  role: "tablist",
378
- className: clsx_default("flex gap-1 p-1 rounded-md bg-gray-100 dark:bg-gray-800/50 border border-gray-200 dark:border-gray-700", C),
379
- children: b.map((b, x) => /* @__PURE__ */ jsxs("button", {
541
+ className: clsx_default("flex gap-1 p-1 rounded-md bg-gray-100 dark:bg-gray-800/50 border border-gray-200 dark:border-gray-700", I),
542
+ children: i.map((i, P) => /* @__PURE__ */ jsxs("button", {
380
543
  role: "tab",
381
544
  type: "button",
382
- "aria-selected": D === x,
383
- "aria-disabled": b.disabled,
384
- disabled: b.disabled,
385
- onClick: () => k(x),
386
- className: clsx_default("flex items-center gap-2 px-4 py-2.5 rounded-md text-sm font-medium", D === x ? "bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm border border-gray-200 dark:border-gray-600" : clsx_default("text-gray-600 dark:text-gray-400 border border-transparent", b.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer hover:text-gray-900 dark:hover:text-gray-200 hover:bg-gray-200/50 dark:hover:bg-gray-700/50")),
387
- children: [b.icon && /* @__PURE__ */ jsx("span", { className: clsx_default("w-4 h-4 block shrink-0", b.icon, D === x ? "text-blue-600 dark:text-blue-400" : "text-gray-500 dark:text-gray-400") }), b.title]
388
- }, x))
545
+ "aria-selected": z === P,
546
+ "aria-disabled": i.disabled,
547
+ disabled: i.disabled,
548
+ onClick: () => H(P),
549
+ className: clsx_default("flex items-center gap-2 px-4 py-2.5 rounded-md text-sm font-medium", z === P ? "bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm border border-gray-200 dark:border-gray-600" : clsx_default("text-gray-600 dark:text-gray-400 border border-transparent", i.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer hover:text-gray-900 dark:hover:text-gray-200 hover:bg-gray-200/50 dark:hover:bg-gray-700/50")),
550
+ children: [i.icon && /* @__PURE__ */ jsx("span", { className: clsx_default("w-4 h-4 block shrink-0", i.icon, z === P ? "text-blue-600 dark:text-blue-400" : "text-gray-500 dark:text-gray-400") }), i.title]
551
+ }, P))
389
552
  }), /* @__PURE__ */ jsx("div", {
390
553
  role: "tabpanel",
391
- className: clsx_default("mt-3 rounded-md border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800/50 p-4 overflow-hidden", w),
554
+ className: clsx_default("mt-3 rounded-md border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800/50 p-4 overflow-hidden", L),
392
555
  children: /* @__PURE__ */ jsx("div", {
393
556
  className: "tabs-panel-inner",
394
- children: A?.content
395
- }, D)
557
+ children: U?.content
558
+ }, z)
396
559
  })]
397
560
  });
398
561
  }
399
- function Textarea({ label: b, error: x, showCharCount: S = !1, minLength: C, maxLength: E, className: D, wrapperClassName: O, value: k, defaultValue: A, onChange: j, id: M = "textarea", ...P }) {
400
- let F = `${M}-${useId()}`, [I, L] = useState(typeof A == "string" ? A.length : 0), R = typeof k == "string" ? k.length : k === void 0 ? I : 0, z = S && (C !== void 0 || E !== void 0);
562
+ function Textarea({ label: i, error: P, showCharCount: F = !1, minLength: I, maxLength: L, className: R, wrapperClassName: V, value: H, defaultValue: U, onChange: G, id: K = "textarea", ...q }) {
563
+ let J = `${K}-${useId()}`, [X, Z] = useState(typeof U == "string" ? U.length : 0), Q = typeof H == "string" ? H.length : H === void 0 ? X : 0, $ = F && (I !== void 0 || L !== void 0);
401
564
  return /* @__PURE__ */ jsxs("div", {
402
- className: clsx_default("w-full", O),
565
+ className: clsx_default("w-full", V),
403
566
  children: [
404
- b && /* @__PURE__ */ jsxs("label", {
567
+ typeof i == "string" ? /* @__PURE__ */ jsxs("label", {
405
568
  className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",
406
- htmlFor: F,
407
- children: [b, P.required && /* @__PURE__ */ jsx("span", {
569
+ htmlFor: J,
570
+ children: [i, q.required && /* @__PURE__ */ jsx("span", {
408
571
  className: "text-red-500 dark:text-red-400 ml-1",
409
572
  children: "*"
410
573
  })]
411
- }),
574
+ }) : i,
412
575
  /* @__PURE__ */ jsx("textarea", {
413
- id: F,
414
- className: clsx_default(BASE_INPUT_STYLES, "px-3 py-2 text-sm min-h-[80px] resize-y", x && "border-red-500 dark:border-red-400 focus:ring-red-500", D),
415
- value: k,
416
- defaultValue: A,
417
- minLength: C,
418
- maxLength: E,
419
- onChange: (e) => {
420
- k === void 0 && L(e.target.value.length), j?.(e);
576
+ id: J,
577
+ className: clsx_default(BASE_INPUT_STYLES, "px-3 py-2 text-sm min-h-[80px] resize-y", P && "border-red-500 dark:border-red-400 focus:ring-red-500", R),
578
+ value: H,
579
+ defaultValue: U,
580
+ minLength: I,
581
+ maxLength: L,
582
+ onChange: (i) => {
583
+ H === void 0 && Z(i.target.value.length), G?.(i);
421
584
  },
422
- ...P
585
+ ...q
423
586
  }),
424
- z && /* @__PURE__ */ jsx(CharacterCount, {
425
- current: R,
426
- min: C,
427
- max: E,
428
- showMin: C !== void 0,
429
- showMax: E !== void 0
587
+ $ && /* @__PURE__ */ jsx(CharacterCount, {
588
+ current: Q,
589
+ min: I,
590
+ max: L,
591
+ showMin: I !== void 0,
592
+ showMax: L !== void 0
430
593
  }),
431
- x && /* @__PURE__ */ jsx("p", {
594
+ P && /* @__PURE__ */ jsx("p", {
432
595
  className: "text-xs text-red-600 dark:text-red-400 mt-1",
433
- children: x
596
+ children: P
434
597
  })
435
598
  ]
436
599
  });
437
600
  }
438
601
  const useIsClient = () => {
439
- let [e, y] = useState(!1);
602
+ let [i, M] = useState(!1);
440
603
  return useEffect(() => {
441
604
  requestAnimationFrame(() => {
442
- y(!0);
605
+ M(!0);
443
606
  });
444
- }, []), e;
607
+ }, []), i;
445
608
  };
446
- function applyTheme(e) {
447
- let y = document.documentElement;
448
- e === "system" ? window.matchMedia("(prefers-color-scheme: dark)").matches ? y.classList.add("dark") : y.classList.remove("dark") : e === "dark" ? y.classList.add("dark") : y.classList.remove("dark");
609
+ function applyTheme(i) {
610
+ let M = document.documentElement;
611
+ i === "system" ? window.matchMedia("(prefers-color-scheme: dark)").matches ? M.classList.add("dark") : M.classList.remove("dark") : i === "dark" ? M.classList.add("dark") : M.classList.remove("dark");
449
612
  }
450
- function getIcon(y) {
613
+ function getIcon(i) {
451
614
  return /* @__PURE__ */ jsx("div", {
452
615
  className: clsx_default({
453
616
  light: "i-tabler-sun text-yellow-500",
454
617
  dark: "i-tabler-moon-stars text-gray-700 dark:text-yellow-500",
455
618
  system: "i-tabler-device-desktop text-blue-500"
456
- }[y], "w-5 h-5"),
619
+ }[i], "w-5 h-5"),
457
620
  style: {
458
621
  width: 20,
459
622
  height: 20
@@ -461,29 +624,29 @@ function getIcon(y) {
461
624
  });
462
625
  }
463
626
  function ThemeToggle() {
464
- let [y, b] = useState("system"), x = useIsClient();
627
+ let [i, N] = useState("system"), P = useIsClient();
465
628
  return useEffect(() => {
466
- let e = localStorage.getItem("theme");
629
+ let i = localStorage.getItem("theme");
467
630
  requestAnimationFrame(() => {
468
- e ? (b(e), applyTheme(e)) : (b("system"), applyTheme("system"));
631
+ i ? (N(i), applyTheme(i)) : (N("system"), applyTheme("system"));
469
632
  });
470
633
  }, []), useEffect(() => {
471
- let e = window.matchMedia("(prefers-color-scheme: dark)"), b = () => {
472
- y === "system" && applyTheme("system");
634
+ let M = window.matchMedia("(prefers-color-scheme: dark)"), N = () => {
635
+ i === "system" && applyTheme("system");
473
636
  };
474
- return e.addEventListener("change", b), () => {
475
- e.removeEventListener("change", b);
637
+ return M.addEventListener("change", N), () => {
638
+ M.removeEventListener("change", N);
476
639
  };
477
- }, [y]), /* @__PURE__ */ jsx("button", {
640
+ }, [i]), /* @__PURE__ */ jsx("button", {
478
641
  onClick: useCallback(() => {
479
- b((e) => {
480
- let y;
481
- return y = e === "light" ? "dark" : e === "dark" ? "system" : "light", applyTheme(y), localStorage.setItem("theme", y), y;
642
+ N((i) => {
643
+ let M;
644
+ return M = i === "light" ? "dark" : i === "dark" ? "system" : "light", applyTheme(M), localStorage.setItem("theme", M), M;
482
645
  });
483
646
  }, []),
484
647
  className: "p-2.5 rounded-lg bg-gray-100 dark:bg-gray-700/50 border border-gray-200 dark:border-gray-600 hover:bg-gray-200 dark:hover:bg-gray-600 transition-all duration-200 cursor-pointer",
485
- "aria-label": `Thème actuel: ${y}`,
486
- children: x ? getIcon(y) : /* @__PURE__ */ jsx("div", {
648
+ "aria-label": `Thème actuel: ${i}`,
649
+ children: P ? getIcon(i) : /* @__PURE__ */ jsx("div", {
487
650
  className: "i-tabler-device-desktop w-5 h-5 text-gray-400",
488
651
  style: {
489
652
  width: "20px",
@@ -492,4 +655,4 @@ function ThemeToggle() {
492
655
  })
493
656
  });
494
657
  }
495
- export { BASE_INPUT_STYLES, Button, CharacterCount, Checkbox, ClientOnly, IconButton, Input, Modal, Select, Switch, Tabs, Textarea, ThemeToggle, applyTheme, useClientOnly, useIsClient, useRunAfterAnimation, withClientOnly };
658
+ export { BASE_INPUT_STYLES, Button, CharacterCount, Checkbox, ClientOnly, ConfirmModal, IconButton, Input, Modal, ModalProvider, Select, Switch, Tabs, Textarea, ThemeToggle, applyTheme, useClientOnly, useGlobalHotkeysStore, useIsClient, useModalStore, useRunAfterAnimation, withClientOnly };