@minimalstuff/ui 1.4.0 → 2.1.0

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 (5) hide show
  1. package/README.md +1 -1
  2. package/dist/index.d.ts +88 -70
  3. package/dist/minimalstuff-ui.css +1 -1
  4. package/dist/minimalstuff-ui.js +765 -452
  5. package/package.json +35 -33
package/dist/minimalstuff-ui.js CHANGED
@@ -1,116 +1,161 @@
1
1
  import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
2
- import r, { Fragment as i, createElement as a, useCallback as o, useEffect as s, useId as c, useRef as l, useState as u } from "react";
3
- import { createPortal as d } from "react-dom";
2
+ import r, { createElement as i, useCallback as a, useEffect as o, useId as s, useMemo as c, useRef as l, useState as u, useSyncExternalStore as d } from "react";
3
+ import { createPortal as f } from "react-dom";
4
4
  //#region node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
5
- function f(e) {
5
+ function p(e) {
6
6
  var t, n, r = "";
7
7
  if (typeof e == "string" || typeof e == "number") r += e;
8
8
  else if (typeof e == "object") if (Array.isArray(e)) {
9
9
  var i = e.length;
10
- for (t = 0; t < i; t++) e[t] && (n = f(e[t])) && (r && (r += " "), r += n);
10
+ for (t = 0; t < i; t++) e[t] && (n = p(e[t])) && (r && (r += " "), r += n);
11
11
  } else for (n in e) e[n] && (r && (r += " "), r += n);
12
12
  return r;
13
13
  }
14
- function p() {
15
- for (var e, t, n = 0, r = "", i = arguments.length; n < i; n++) (e = arguments[n]) && (t = f(e)) && (r && (r += " "), r += t);
14
+ function m() {
15
+ for (var e, t, n = 0, r = "", i = arguments.length; n < i; n++) (e = arguments[n]) && (t = p(e)) && (r && (r += " "), r += t);
16
16
  return r;
17
17
  }
18
18
  //#endregion
19
- //#region src/components/button/button.tsx
20
- var m = {
21
- primary: "bg-blue-600 text-white hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 border-transparent",
22
- secondary: "bg-gray-200 text-gray-900 hover:bg-gray-300 dark:bg-gray-600 dark:text-gray-100 dark:hover:bg-gray-500 border-transparent",
23
- ghost: "bg-transparent text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-700/50 border-transparent",
24
- outline: "bg-transparent border-gray-300 text-gray-700 hover:bg-gray-50 dark:border-gray-600 dark:text-gray-300 dark:hover:bg-gray-800/50",
25
- subtle: "bg-gray-100 text-gray-700 hover:bg-gray-200 dark:bg-gray-700/50 dark:text-gray-300 dark:hover:bg-gray-600/50 border-transparent",
26
- danger: "bg-red-600 text-white hover:bg-red-700 dark:bg-red-500 dark:hover:bg-red-600 border-transparent"
27
- }, h = {
19
+ //#region src/components/shared/radius.ts
20
+ var h = {
21
+ none: "rounded-none",
22
+ sm: "rounded-sm",
23
+ md: "rounded-md",
24
+ lg: "rounded-lg",
25
+ xl: "rounded-xl",
26
+ full: "rounded-full"
27
+ }, g = {
28
+ primary: {
29
+ solid: "border-transparent bg-blue-600 text-white enabled:hover:bg-blue-700 enabled:active:bg-blue-800 dark:bg-blue-500 dark:enabled:hover:bg-blue-600 dark:enabled:active:bg-blue-700",
30
+ outline: "border-blue-300 bg-transparent text-blue-700 enabled:hover:bg-blue-50 enabled:active:bg-blue-100 dark:border-blue-800 dark:text-blue-400 dark:enabled:hover:bg-blue-950/40 dark:enabled:active:bg-blue-950/60",
31
+ ghost: "border-transparent bg-transparent text-blue-700 enabled:hover:bg-blue-50 enabled:active:bg-blue-100 dark:text-blue-400 dark:enabled:hover:bg-blue-950/40 dark:enabled:active:bg-blue-950/60",
32
+ subtle: "border-transparent bg-blue-50 text-blue-700 enabled:hover:bg-blue-100 enabled:active:bg-blue-200 dark:bg-blue-500/10 dark:text-blue-400 dark:enabled:hover:bg-blue-500/20 dark:enabled:active:bg-blue-500/30",
33
+ focusOutline: "focus-visible:outline-blue-500"
34
+ },
35
+ neutral: {
36
+ solid: "border-transparent bg-gray-200 text-gray-900 enabled:hover:bg-gray-300 enabled:active:bg-gray-400 dark:bg-gray-600 dark:text-gray-100 dark:enabled:hover:bg-gray-500 dark:enabled:active:bg-gray-400",
37
+ outline: "border-gray-300 bg-transparent text-gray-700 enabled:hover:bg-gray-50 enabled:active:bg-gray-100 dark:border-gray-600 dark:text-gray-300 dark:enabled:hover:bg-gray-800/50 dark:enabled:active:bg-gray-800/80",
38
+ ghost: "border-transparent bg-transparent text-gray-700 enabled:hover:bg-gray-100 enabled:active:bg-gray-200 dark:text-gray-300 dark:enabled:hover:bg-gray-700/50 dark:enabled:active:bg-gray-700/80",
39
+ subtle: "border-transparent bg-gray-100 text-gray-700 enabled:hover:bg-gray-200 enabled:active:bg-gray-300 dark:bg-gray-700/50 dark:text-gray-300 dark:enabled:hover:bg-gray-600/50 dark:enabled:active:bg-gray-600/80",
40
+ focusOutline: "focus-visible:outline-gray-400"
41
+ },
42
+ danger: {
43
+ solid: "border-transparent bg-red-600 text-white enabled:hover:bg-red-700 enabled:active:bg-red-800 dark:bg-red-500 dark:enabled:hover:bg-red-600 dark:enabled:active:bg-red-700",
44
+ outline: "border-red-300 bg-transparent text-red-700 enabled:hover:bg-red-50 enabled:active:bg-red-100 dark:border-red-800 dark:text-red-400 dark:enabled:hover:bg-red-950/40 dark:enabled:active:bg-red-950/60",
45
+ ghost: "border-transparent bg-transparent text-red-700 enabled:hover:bg-red-50 enabled:active:bg-red-100 dark:text-red-400 dark:enabled:hover:bg-red-950/40 dark:enabled:active:bg-red-950/60",
46
+ subtle: "border-transparent bg-red-50 text-red-700 enabled:hover:bg-red-100 enabled:active:bg-red-200 dark:bg-red-500/10 dark:text-red-400 dark:enabled:hover:bg-red-500/20 dark:enabled:active:bg-red-500/30",
47
+ focusOutline: "focus-visible:outline-red-500"
48
+ },
49
+ success: {
50
+ solid: "border-transparent bg-green-600 text-white enabled:hover:bg-green-700 enabled:active:bg-green-800 dark:bg-green-500 dark:enabled:hover:bg-green-600 dark:enabled:active:bg-green-700",
51
+ outline: "border-green-300 bg-transparent text-green-700 enabled:hover:bg-green-50 enabled:active:bg-green-100 dark:border-green-800 dark:text-green-400 dark:enabled:hover:bg-green-950/40 dark:enabled:active:bg-green-950/60",
52
+ ghost: "border-transparent bg-transparent text-green-700 enabled:hover:bg-green-50 enabled:active:bg-green-100 dark:text-green-400 dark:enabled:hover:bg-green-950/40 dark:enabled:active:bg-green-950/60",
53
+ subtle: "border-transparent bg-green-50 text-green-700 enabled:hover:bg-green-100 enabled:active:bg-green-200 dark:bg-green-500/10 dark:text-green-400 dark:enabled:hover:bg-green-500/20 dark:enabled:active:bg-green-500/30",
54
+ focusOutline: "focus-visible:outline-green-500"
55
+ }
56
+ }, _ = "cursor-pointer inline-flex items-center justify-center transition-[color,background-color,border-color,transform] duration-200 enabled:active:duration-75 enabled:active:scale-[0.95] outline-hidden focus-visible:outline-2 focus-visible:outline-offset-2 disabled:opacity-50 disabled:cursor-not-allowed", v = {
28
57
  xs: "px-2 py-1 text-xs",
29
58
  sm: "px-3 py-1.5 text-sm",
30
59
  md: "px-4 py-2 text-sm",
31
60
  lg: "px-4 py-3 text-base"
32
- }, g = ({ variant: e = "primary", size: r = "md", children: i, className: a, fullWidth: o = !1, loading: s = !1, disabled: c, ...l }) => /* @__PURE__ */ n("button", {
33
- type: "button",
34
- className: p("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", m[e], h[r], o && "w-full", a),
35
- disabled: c ?? s,
36
- ...l,
37
- children: [s && /* @__PURE__ */ t("span", {
38
- className: "i-svg-spinners-3-dots-fade w-4 h-4",
39
- "aria-hidden": "true"
40
- }), i]
41
- }), _ = "text-xs text-gray-500 dark:text-gray-400 mt-1 text-right";
42
- function v({ current: e, min: t, max: r, showMin: i, showMax: a }) {
43
- let o = t !== void 0 && e <= t, s = r !== void 0 && e >= r, c = r !== void 0 && e > r;
61
+ }, y = {
62
+ xs: "w-3.5 h-3.5",
63
+ sm: "w-4 h-4",
64
+ md: "w-4 h-4",
65
+ lg: "w-5 h-5"
66
+ }, b = ({ variant: e = "solid", color: r = "primary", size: i = "md", radius: a = "md", children: o, className: s, fullWidth: c = !1, loading: l = !1, startIcon: u, endIcon: d, disabled: f, ...p }) => {
67
+ let b = g[r], x = y[i];
68
+ return /* @__PURE__ */ n("button", {
69
+ type: "button",
70
+ className: m(_, "gap-2 font-medium", e !== "unstyled" && [
71
+ "border",
72
+ h[a],
73
+ b[e],
74
+ b.focusOutline
75
+ ], v[i], c && "w-full", s),
76
+ disabled: f ?? l,
77
+ "aria-busy": l || void 0,
78
+ ...p,
79
+ children: [
80
+ l && /* @__PURE__ */ t("span", {
81
+ className: m("i-svg-spinners-3-dots-fade", x),
82
+ "aria-hidden": "true"
83
+ }),
84
+ !l && u && /* @__PURE__ */ t("span", {
85
+ className: m(u, x),
86
+ "aria-hidden": "true"
87
+ }),
88
+ o,
89
+ !l && d && /* @__PURE__ */ t("span", {
90
+ className: m(d, x),
91
+ "aria-hidden": "true"
92
+ })
93
+ ]
94
+ });
95
+ }, x = "text-xs text-gray-500 dark:text-gray-400 mt-1 text-right";
96
+ function S(e) {
97
+ return e === "overLimit" ? "text-red-600 dark:text-red-400" : e === "atLimit" ? "text-amber-600 dark:text-amber-400" : "";
98
+ }
99
+ function C({ current: e, min: r, max: i, showMin: a, showMax: o }) {
100
+ let s = a === !0 || o === !0, c = r !== void 0 && e <= r ? "atLimit" : "ok", l = i !== void 0 && e > i ? "overLimit" : i !== void 0 && e >= i ? "atLimit" : "ok", u = s ? `${e}/${r} min` : `${e} (min ${r})`, d = s ? `${e}/${i} max` : `${e}/${i}`;
44
101
  return /* @__PURE__ */ n("div", {
45
- className: _,
102
+ className: x,
46
103
  children: [
47
- i && t !== void 0 && /* @__PURE__ */ n("span", {
48
- className: o ? "text-amber-600 dark:text-amber-400" : "",
49
- children: [
50
- e,
51
- "/",
52
- t,
53
- " min"
54
- ]
104
+ a && r !== void 0 && /* @__PURE__ */ t("span", {
105
+ className: S(c),
106
+ children: u
55
107
  }),
56
- i && a && " · ",
57
- a && r !== void 0 && /* @__PURE__ */ n("span", {
58
- className: c ? "text-red-600 dark:text-red-400" : s ? "text-amber-600 dark:text-amber-400" : "",
59
- children: [
60
- e,
61
- "/",
62
- r,
63
- " max"
64
- ]
108
+ a && o && " · ",
109
+ o && i !== void 0 && /* @__PURE__ */ t("span", {
110
+ className: S(l),
111
+ children: d
65
112
  }),
66
- !i && !a && r !== void 0 && /* @__PURE__ */ n("span", {
67
- className: c ? "text-red-600 dark:text-red-400" : s ? "text-amber-600 dark:text-amber-400" : "",
68
- children: [
69
- e,
70
- "/",
71
- r
72
- ]
113
+ !a && !o && i !== void 0 && /* @__PURE__ */ t("span", {
114
+ className: S(l),
115
+ children: d
73
116
  }),
74
- !i && !a && t !== void 0 && r === void 0 && /* @__PURE__ */ n("span", {
75
- className: o ? "text-amber-600 dark:text-amber-400" : "",
76
- children: [
77
- e,
78
- " (min ",
79
- t,
80
- ")"
81
- ]
117
+ !a && !o && r !== void 0 && i === void 0 && /* @__PURE__ */ t("span", {
118
+ className: S(c),
119
+ children: u
82
120
  })
83
121
  ]
84
122
  });
85
123
  }
86
124
  //#endregion
125
+ //#region src/components/shared/surface_tokens.ts
126
+ var w = "border-gray-300 dark:border-gray-600", T = "bg-white dark:bg-gray-800", E = "border-gray-200 dark:border-gray-700", D = "bg-white dark:bg-gray-900", O = "bg-blue-600 dark:bg-blue-500", k = "text-sm font-medium text-gray-700 dark:text-gray-300", A = "border-red-500 dark:border-red-400";
127
+ //#endregion
87
128
  //#region src/components/checkbox/checkbox.tsx
88
- function y({ label: e, description: r, error: i, className: a, wrapperClassName: o, checked: s, defaultChecked: l = !1, onChange: d, id: f = "checkbox", ...m }) {
89
- let h = `${f}-${c()}`, [g, _] = u(l), v = s !== void 0, y = v ? s : g, b = [r && `${h}-description`, i && `${h}-error`].filter(Boolean).join(" ") || void 0;
129
+ function j({ label: e, description: r, error: i, radius: a = "sm", unstyled: o = !1, className: c, wrapperClassName: l, checked: d, defaultChecked: f = !1, onChange: p, id: g = "checkbox", ..._ }) {
130
+ let v = `${g}-${s()}`, [y, b] = u(f), x = d !== void 0, S = x ? d : y, C = [r && `${v}-description`, i && `${v}-error`].filter(Boolean).join(" ") || void 0;
90
131
  return /* @__PURE__ */ n("div", {
91
- className: p("w-full", o),
132
+ className: m("w-full", l),
92
133
  children: [
93
134
  /* @__PURE__ */ n("label", {
94
- htmlFor: h,
95
- className: p("flex items-start gap-3 cursor-pointer", m.disabled && "cursor-not-allowed opacity-50"),
135
+ htmlFor: v,
136
+ className: m("flex items-start gap-3 cursor-pointer", _.disabled && "cursor-not-allowed opacity-50"),
96
137
  children: [/* @__PURE__ */ n("span", {
97
- className: p("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", i ? "focus-within:ring-red-500" : "focus-within:ring-blue-500"),
138
+ className: m("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", i ? "focus-within:ring-red-500" : "focus-within:ring-blue-500"),
98
139
  children: [/* @__PURE__ */ t("input", {
99
140
  type: "checkbox",
100
- id: h,
141
+ id: v,
101
142
  className: "sr-only",
102
- checked: s,
103
- defaultChecked: l,
143
+ checked: S,
104
144
  onChange: (e) => {
105
- v || _(e.target.checked), d?.(e);
145
+ x || b(e.target.checked), p?.(e);
106
146
  },
107
147
  "aria-invalid": !!i,
108
- "aria-describedby": b,
109
- ...m
148
+ "aria-describedby": C,
149
+ ..._
110
150
  }), /* @__PURE__ */ t("span", {
111
- className: p("flex h-5 w-5 items-center justify-center rounded border-2 transition-all duration-200", y ? "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", i && "border-red-500 dark:border-red-400", a),
151
+ className: m("flex h-5 w-5 items-center justify-center transition-all duration-200", !o && [
152
+ h[a],
153
+ "border-2",
154
+ S ? m("border-blue-600 dark:border-blue-500", "bg-blue-600 dark:bg-blue-500") : m("border-gray-300 dark:border-gray-600", "bg-white dark:bg-gray-800"),
155
+ i && "border-red-500 dark:border-red-400"
156
+ ], c),
112
157
  "aria-hidden": !0,
113
- children: y && /* @__PURE__ */ t("svg", {
158
+ children: S && /* @__PURE__ */ t("svg", {
114
159
  className: "h-3 w-3 text-white",
115
160
  viewBox: "0 0 12 12",
116
161
  fill: "none",
@@ -122,25 +167,25 @@ function y({ label: e, description: r, error: i, className: a, wrapperClassName:
122
167
  })
123
168
  })]
124
169
  }), typeof e == "string" ? /* @__PURE__ */ n("span", {
125
- className: "text-sm font-medium text-gray-700 dark:text-gray-300 select-none",
126
- children: [e, m.required && /* @__PURE__ */ t("span", {
170
+ className: m(k, "select-none"),
171
+ children: [e, _.required && /* @__PURE__ */ t("span", {
127
172
  className: "text-red-500 dark:text-red-400 ml-1",
128
173
  children: "*"
129
174
  })]
130
175
  }) : e]
131
176
  }),
132
177
  r && (typeof r == "string" ? /* @__PURE__ */ t("p", {
133
- id: `${h}-description`,
134
- className: "text-xs text-gray-500 dark:text-gray-400 mt-1 ml-8",
178
+ id: `${v}-description`,
179
+ className: m("text-xs text-gray-500 dark:text-gray-400", "mt-1 ml-8"),
135
180
  children: r
136
181
  }) : /* @__PURE__ */ t("span", {
137
- id: `${h}-description`,
138
- className: "block text-xs text-gray-500 dark:text-gray-400 mt-1 ml-8",
182
+ id: `${v}-description`,
183
+ className: m("text-xs text-gray-500 dark:text-gray-400", "block mt-1 ml-8"),
139
184
  children: r
140
185
  })),
141
186
  i && /* @__PURE__ */ t("p", {
142
- id: `${h}-error`,
143
- className: "text-xs text-red-600 dark:text-red-400 mt-1 ml-8",
187
+ id: `${v}-error`,
188
+ className: m("text-xs text-red-600 dark:text-red-400", "mt-1 ml-8"),
144
189
  role: "alert",
145
190
  children: i
146
191
  })
@@ -149,216 +194,437 @@ function y({ label: e, description: r, error: i, className: a, wrapperClassName:
149
194
  }
150
195
  //#endregion
151
196
  //#region src/hooks/use_client_only/use_client_only.tsx
152
- var b = () => {
197
+ var M = () => {
153
198
  let [e, t] = u(!1);
154
- return s(() => {
199
+ return o(() => {
155
200
  requestAnimationFrame(() => {
156
201
  t(!0);
157
202
  });
158
203
  }, []), e;
159
- }, x = (e) => (n) => b() ? /* @__PURE__ */ t(e, { ...n }) : null;
204
+ }, N = (e) => (n) => M() ? /* @__PURE__ */ t(e, { ...n }) : null;
160
205
  //#endregion
161
206
  //#region src/components/client_only/client_only.tsx
162
- function S({ children: e, fallback: t }) {
163
- return b() ? a(i, { children: e }) : t ?? null;
207
+ function P({ children: n, fallback: r }) {
208
+ return M() ? /* @__PURE__ */ t(e, { children: n }) : r ?? null;
164
209
  }
165
210
  //#endregion
166
- //#region src/components/icon_button/icon_button.tsx
167
- var C = {
168
- default: "text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800",
169
- ghost: "text-gray-600 dark:text-gray-400 hover:bg-white/50 dark:hover:bg-gray-800/50",
170
- danger: "text-red-600 dark:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20",
171
- outline: "text-gray-600 dark:text-gray-400 border border-gray-300 dark:border-gray-600 hover:bg-white/50 dark:hover:bg-gray-800/50",
172
- subtle: "text-gray-500 dark:text-gray-500 hover:text-gray-700 dark:hover:text-gray-300 hover:bg-gray-50/50 dark:hover:bg-gray-800/30"
173
- }, w = {
174
- sm: "p-1",
175
- md: "p-2",
176
- lg: "p-3"
177
- }, T = {
178
- sm: "w-4 h-4",
179
- md: "w-5 h-5",
180
- lg: "w-6 h-6"
181
- }, E = ({ icon: e, "aria-label": r, variant: i = "default", size: a = "md", className: o, children: s, ref: c, ...l }) => /* @__PURE__ */ n("button", {
182
- ref: c,
183
- type: "button",
184
- "aria-label": r,
185
- className: p("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", C[i], w[a], o),
186
- ...l,
187
- children: [/* @__PURE__ */ t("div", { className: p(e, T[a], s && "mr-1") }), s]
188
- }), D = "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";
189
- function ee({ label: e, error: r, showCharCount: i = !1, minLength: a, maxLength: o, className: s, wrapperClassName: l, value: d, defaultValue: f, onChange: m, id: h = "input", ...g }) {
190
- let _ = `${h}-${c()}`, [y, b] = u(typeof f == "string" ? f.length : 0), x = typeof d == "string" ? d.length : d === void 0 ? y : 0, S = i && (a !== void 0 || o !== void 0);
211
+ //#region src/components/input/input.tsx
212
+ var F = `w-full border ${w} ${T} 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`;
213
+ function I({ label: e, error: r, showCharCount: i = !1, minLength: a, maxLength: o, radius: c = "md", unstyled: l = !1, className: d, wrapperClassName: f, value: p, defaultValue: g, onChange: _, id: v = "input", ...y }) {
214
+ let b = `${v}-${s()}`, [x, S] = u(typeof g == "string" ? g.length : 0), w = typeof p == "string" ? p.length : p === void 0 ? x : 0, T = i && (a !== void 0 || o !== void 0), E = (e) => {
215
+ p === void 0 && S(e.target.value.length), _?.(e);
216
+ };
191
217
  return /* @__PURE__ */ n("div", {
192
- className: p("w-full", l),
218
+ className: m("w-full", f),
193
219
  children: [
194
220
  typeof e == "string" ? /* @__PURE__ */ n("label", {
195
- className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",
196
- htmlFor: _,
197
- children: [e, g.required && /* @__PURE__ */ t("span", {
221
+ className: m(k, "block mb-1"),
222
+ htmlFor: b,
223
+ children: [e, y.required && /* @__PURE__ */ t("span", {
198
224
  className: "text-red-500 dark:text-red-400 ml-1",
199
225
  children: "*"
200
226
  })]
201
227
  }) : e,
202
228
  /* @__PURE__ */ t("input", {
203
- id: _,
204
- className: p(D, "px-3 py-2 text-sm", r && "border-red-500 dark:border-red-400 focus:ring-red-500", s),
205
- value: d,
206
- defaultValue: f,
229
+ id: b,
230
+ className: m("w-full disabled:opacity-50 disabled:cursor-not-allowed", !l && [
231
+ F,
232
+ h[c],
233
+ "px-3 py-2 text-sm"
234
+ ], !l && r && m("border-red-500 dark:border-red-400", "focus:ring-red-500"), d),
235
+ ...p === void 0 ? { defaultValue: g } : { value: p },
207
236
  minLength: a,
208
237
  maxLength: o,
209
- onChange: (e) => {
210
- d === void 0 && b(e.target.value.length), m?.(e);
211
- },
212
- ...g
238
+ onChange: E,
239
+ "aria-invalid": !!r,
240
+ "aria-describedby": r ? `${b}-error` : void 0,
241
+ ...y
213
242
  }),
214
- S && /* @__PURE__ */ t(v, {
215
- current: x,
243
+ T && /* @__PURE__ */ t(C, {
244
+ current: w,
216
245
  min: a,
217
246
  max: o,
218
247
  showMin: a !== void 0,
219
248
  showMax: o !== void 0
220
249
  }),
221
250
  r && /* @__PURE__ */ t("p", {
222
- className: "text-xs text-red-600 dark:text-red-400 mt-1",
251
+ id: `${b}-error`,
252
+ className: m("text-xs text-red-600 dark:text-red-400", "mt-1"),
253
+ role: "alert",
223
254
  children: r
224
255
  })
225
256
  ]
226
257
  });
227
258
  }
228
259
  //#endregion
229
- //#region src/hooks/use_run_after_animation/use_run_after_animation.ts
230
- function O(e) {
231
- return o((t) => {
232
- let n = setTimeout(t, e);
233
- return () => clearTimeout(n);
234
- }, [e]);
260
+ //#region src/components/combobox/combobox.tsx
261
+ function L({ options: e, label: r, error: i, placeholder: a, noResultsText: o = "No results found", radius: l = "md", unstyled: d = !1, disabled: f = !1, required: p = !1, className: g, wrapperClassName: _, value: v, defaultValue: y = "", onChange: b, id: x = "combobox" }) {
262
+ let S = `${x}-${s()}`, C = `${S}-listbox`, [w, T] = u(y), E = v !== void 0, D = E ? v : w, O = e.find((e) => e.value === D), [A, j] = u(""), [M, N] = u(!1), [P, I] = u(!1), [L, R] = u(-1), z = c(() => M ? e.filter((e) => e.label.toLowerCase().includes(A.toLowerCase())) : e, [
263
+ e,
264
+ M,
265
+ A
266
+ ]), B = P ? A : O?.label ?? "", V = () => {
267
+ f || (j(O?.label ?? ""), N(!1), I(!0), R(-1));
268
+ }, H = () => {
269
+ I(!1), N(!1), R(-1);
270
+ }, U = (e) => {
271
+ E || T(e.value), b?.(e.value), H();
272
+ }, W = () => {
273
+ E || T(""), b?.(""), j("");
274
+ }, ee = (e) => {
275
+ j(e.target.value), N(!0), I(!0), R(0);
276
+ }, te = (e) => {
277
+ z.length !== 0 && R((t) => {
278
+ let n = t + e;
279
+ return n < 0 ? z.length - 1 : n >= z.length ? 0 : n;
280
+ });
281
+ }, G = (e) => {
282
+ if (e.key === "ArrowDown") {
283
+ e.preventDefault(), P ? te(1) : V();
284
+ return;
285
+ }
286
+ if (e.key === "ArrowUp") {
287
+ e.preventDefault(), P ? te(-1) : V();
288
+ return;
289
+ }
290
+ if (e.key === "Enter") {
291
+ if (!P) return;
292
+ e.preventDefault();
293
+ let t = z[L];
294
+ t && U(t);
295
+ return;
296
+ }
297
+ if (e.key === "Escape") {
298
+ if (!P) return;
299
+ e.preventDefault(), H();
300
+ }
301
+ }, K = P && L >= 0 ? `${C}-option-${L}` : void 0;
302
+ return /* @__PURE__ */ n("div", {
303
+ className: m("w-full", _),
304
+ children: [
305
+ typeof r == "string" ? /* @__PURE__ */ n("label", {
306
+ className: m(k, "block mb-1"),
307
+ htmlFor: S,
308
+ children: [r, p && /* @__PURE__ */ t("span", {
309
+ className: "text-red-500 dark:text-red-400 ml-1",
310
+ children: "*"
311
+ })]
312
+ }) : r,
313
+ /* @__PURE__ */ n("div", {
314
+ className: "relative",
315
+ children: [
316
+ !d && /* @__PURE__ */ t("span", {
317
+ className: "i-mdi-magnify absolute left-2.5 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400 dark:text-gray-500 pointer-events-none",
318
+ "aria-hidden": !0
319
+ }),
320
+ /* @__PURE__ */ t("input", {
321
+ id: S,
322
+ role: "combobox",
323
+ type: "text",
324
+ autoComplete: "off",
325
+ disabled: f,
326
+ placeholder: a,
327
+ value: B,
328
+ onChange: ee,
329
+ onFocus: V,
330
+ onBlur: H,
331
+ onKeyDown: G,
332
+ "aria-expanded": P,
333
+ "aria-controls": C,
334
+ "aria-autocomplete": "list",
335
+ "aria-activedescendant": K,
336
+ "aria-invalid": !!i,
337
+ "aria-describedby": i ? `${S}-error` : void 0,
338
+ className: m("w-full disabled:opacity-50 disabled:cursor-not-allowed", !d && [
339
+ F,
340
+ h[l],
341
+ "pl-9 pr-8 py-2 text-sm"
342
+ ], !d && i && m("border-red-500 dark:border-red-400", "focus:ring-red-500"), g)
343
+ }),
344
+ !d && O && !f && /* @__PURE__ */ t("button", {
345
+ type: "button",
346
+ "aria-label": "Clear selection",
347
+ onMouseDown: (e) => e.preventDefault(),
348
+ onClick: W,
349
+ className: "absolute right-2.5 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300",
350
+ children: /* @__PURE__ */ t("span", {
351
+ className: "i-mdi-close block w-4 h-4",
352
+ "aria-hidden": !0
353
+ })
354
+ }),
355
+ P && /* @__PURE__ */ t("ul", {
356
+ id: C,
357
+ role: "listbox",
358
+ className: m("absolute z-10 mt-1 w-full max-h-60 overflow-auto py-1 text-sm shadow-lg", !d && [
359
+ "border",
360
+ "bg-white dark:bg-gray-900",
361
+ "border-gray-100 dark:border-gray-800",
362
+ h[l]
363
+ ]),
364
+ children: z.length === 0 ? /* @__PURE__ */ t("li", {
365
+ className: "px-3 py-2 text-gray-500 dark:text-gray-400",
366
+ children: o
367
+ }) : z.map((e, n) => /* @__PURE__ */ t("li", {
368
+ id: `${C}-option-${n}`,
369
+ role: "option",
370
+ "aria-selected": e.value === D,
371
+ onMouseDown: (e) => e.preventDefault(),
372
+ onClick: () => U(e),
373
+ className: m("px-3 py-2 cursor-pointer text-gray-900 dark:text-gray-100", n === L ? "bg-blue-50 dark:bg-blue-900/40" : "hover:bg-gray-50 dark:hover:bg-gray-800/60", e.value === D && "font-medium"),
374
+ children: e.label
375
+ }, e.value))
376
+ })
377
+ ]
378
+ }),
379
+ i && /* @__PURE__ */ t("p", {
380
+ id: `${S}-error`,
381
+ className: m("text-xs text-red-600 dark:text-red-400", "mt-1"),
382
+ role: "alert",
383
+ children: i
384
+ })
385
+ ]
386
+ });
235
387
  }
236
388
  //#endregion
237
- //#region src/components/modal/modal.tsx
238
- var k = 200, te = {
389
+ //#region src/components/icon_button/icon_button.tsx
390
+ var R = {
391
+ sm: "p-1",
392
+ md: "p-2",
393
+ lg: "p-3"
394
+ }, z = {
395
+ sm: "w-4 h-4",
396
+ md: "w-5 h-5",
397
+ lg: "w-6 h-6"
398
+ }, B = ({ icon: e, "aria-label": r, variant: i = "outline", color: a = "neutral", size: o = "md", radius: s = "md", className: c, children: l, ref: u, ...d }) => {
399
+ let f = g[a];
400
+ return /* @__PURE__ */ n("button", {
401
+ ref: u,
402
+ type: "button",
403
+ "aria-label": r,
404
+ className: m(_, i !== "unstyled" && [
405
+ "border",
406
+ h[s],
407
+ f[i],
408
+ f.focusOutline
409
+ ], R[o], c),
410
+ ...d,
411
+ children: [/* @__PURE__ */ t("div", { className: m(e, z[o], l && "mr-1") }), l]
412
+ });
413
+ }, V = [];
414
+ function H() {
415
+ let e = 0, t = [], n = null, r = /* @__PURE__ */ new Set(), i = () => {
416
+ for (let e of r) e(t);
417
+ };
418
+ return {
419
+ add: (n) => {
420
+ t = [...t, {
421
+ ...n,
422
+ key: String(e++)
423
+ }], i();
424
+ },
425
+ set: (e, n) => {
426
+ t = t.map((t) => e && t.promise !== e ? t : n(t)), i();
427
+ },
428
+ remove: (e) => {
429
+ t = t.filter((t) => !e.has(t.promise)), i();
430
+ },
431
+ subscribe: (i) => (r.add(i), () => {
432
+ r.delete(i), r.size || (e = 0, t = [], n = null);
433
+ }),
434
+ getSnapshot: () => t,
435
+ getServerSnapshot: () => V,
436
+ getListenersSize: () => r.size,
437
+ getUpsertPromise: () => n,
438
+ setUpsertPromise: (e) => {
439
+ n = e;
440
+ }
441
+ };
442
+ }
443
+ var U = /* @__PURE__ */ new Map();
444
+ function W(e, t = 0) {
445
+ let n = { current: H() }, r = (e) => (r) => {
446
+ let i = /* @__PURE__ */ new Set();
447
+ n.current.set(e, (e) => (e.resolve(r), i.add(e.promise), {
448
+ ...e,
449
+ ended: !0
450
+ })), globalThis.setTimeout(() => n.current.remove(i), t);
451
+ }, a = () => {
452
+ let e = n.current.getListenersSize();
453
+ if (!e) throw Error("No <Root> found!");
454
+ if (e > 1) throw Error("Multiple instances of <Root> found!");
455
+ }, o = (e) => {
456
+ a();
457
+ let t, i = new Promise((e) => {
458
+ t = e;
459
+ });
460
+ return n.current.add({
461
+ props: e,
462
+ end: r(i),
463
+ ended: !1,
464
+ promise: i,
465
+ resolve: t
466
+ }), i;
467
+ }, s = (e) => {
468
+ a();
469
+ let t = n.current.getUpsertPromise();
470
+ if (t) return n.current.set(t, (t) => ({
471
+ ...t,
472
+ props: e
473
+ })), t;
474
+ let i, o = new Promise((e) => {
475
+ i = e;
476
+ });
477
+ return n.current.setUpsertPromise(o), n.current.add({
478
+ props: e,
479
+ end: (e) => {
480
+ n.current.setUpsertPromise(null), r(o)(e);
481
+ },
482
+ ended: !1,
483
+ promise: o,
484
+ resolve: i
485
+ }), o;
486
+ }, c = (...e) => {
487
+ let t = e.length === 2, i = t ? e[0] : null, a = t ? e[1] : e[0];
488
+ return (!t || i === n.current.getUpsertPromise()) && n.current.setUpsertPromise(null), r(i)(a);
489
+ }, l = (...e) => {
490
+ let t = e.length === 2;
491
+ n.current.set(t ? e[0] : null, (n) => ({
492
+ ...n,
493
+ props: {
494
+ ...n.props,
495
+ ...t ? e[1] : e[0]
496
+ }
497
+ }));
498
+ }, u = function(t) {
499
+ return d(n.current.subscribe, n.current.getSnapshot, n.current.getServerSnapshot).map(({ props: n, key: r, end: a, ended: o }, s, c) => /* @__PURE__ */ i(e, {
500
+ ...n,
501
+ key: r,
502
+ call: {
503
+ key: r,
504
+ end: a,
505
+ ended: o,
506
+ root: t,
507
+ index: s,
508
+ stackSize: c.length
509
+ }
510
+ }));
511
+ }, f = Object.assign(u, {
512
+ Root: u,
513
+ call: o,
514
+ upsert: s,
515
+ end: c,
516
+ update: l
517
+ });
518
+ if (process.env.NODE_ENV !== "production") {
519
+ Object.defineProperty(f, "name", {
520
+ value: "Root",
521
+ configurable: !0
522
+ });
523
+ let e, t = !1;
524
+ Object.defineProperty(f, "displayName", {
525
+ configurable: !0,
526
+ enumerable: !0,
527
+ get: () => e,
528
+ set: (r) => {
529
+ if (t || (e = r, !r)) return;
530
+ t = !0;
531
+ let i = U.get(r);
532
+ i ? n.current = i : U.set(r, n.current);
533
+ }
534
+ });
535
+ }
536
+ return f;
537
+ }
538
+ //#endregion
539
+ //#region src/components/modal/modal_shell.tsx
540
+ var ee = "a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"])", te = {
239
541
  sm: "max-w-md",
240
542
  md: "max-w-lg",
241
543
  lg: "max-w-2xl",
242
544
  xl: "max-w-4xl"
243
545
  };
244
- function A({ isOpen: e = !1, onClose: r, title: i, children: a, footer: o, size: c = "md", className: l }) {
245
- let [f, m] = u(!1), [h, g] = u(!1), [_, v] = u(!1), y = O(k);
246
- s(() => {
247
- if (e && !h) {
248
- document.body.style.overflow = "hidden";
249
- let e = setTimeout(() => {
250
- g(!0), m(!1), requestAnimationFrame(() => {
251
- requestAnimationFrame(() => v(!0));
252
- });
253
- }, 0);
254
- return () => clearTimeout(e);
255
- }
256
- if (!e && h) {
257
- let e = setTimeout(() => {
258
- m(!0), v(!1);
259
- }, 0), t = y(() => {
260
- g(!1), m(!1), document.body.style.overflow = "";
261
- });
262
- return () => {
263
- clearTimeout(e), t();
264
- };
265
- }
266
- }, [
267
- e,
268
- h,
269
- y
270
- ]), s(() => {
271
- if (!e || f) return;
546
+ function G({ isEnded: e, onDismiss: r, title: i, children: a, footer: c, size: d = "md", radius: p = "xl", className: g, dismissible: _ = !0 }) {
547
+ let [v, y] = u(!1), b = l(null), x = l(null), S = s();
548
+ o(() => {
549
+ document.body.style.overflow = "hidden", x.current = document.activeElement, b.current?.focus();
550
+ let e = requestAnimationFrame(() => {
551
+ requestAnimationFrame(() => y(!0));
552
+ });
553
+ return () => {
554
+ cancelAnimationFrame(e), document.body.style.overflow = "";
555
+ };
556
+ }, []), o(() => {
557
+ e && x.current?.focus();
558
+ }, [e]), o(() => {
559
+ if (e) return;
272
560
  let t = (e) => {
273
- e.key === "Escape" && r?.();
561
+ if (e.key === "Escape") {
562
+ _ && r();
563
+ return;
564
+ }
565
+ if (e.key !== "Tab") return;
566
+ let t = b.current;
567
+ if (!t) return;
568
+ let n = Array.from(t.querySelectorAll(ee));
569
+ if (n.length === 0) return;
570
+ let i = n[0], a = n[n.length - 1];
571
+ e.shiftKey && document.activeElement === i ? (e.preventDefault(), a.focus()) : !e.shiftKey && document.activeElement === a && (e.preventDefault(), i.focus());
274
572
  };
275
573
  return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
276
574
  }, [
277
575
  e,
278
- f,
279
- r
576
+ r,
577
+ _
280
578
  ]);
281
- let b = () => {
282
- f || r?.();
283
- };
284
- if (!h) return null;
285
- let x = _ && !f;
286
- return d(/* @__PURE__ */ n("div", {
287
- className: p("fixed inset-0 z-50 flex items-start justify-center", "p-2 sm:py-[3rem] lg:py-[5rem]", "transition-all duration-200", x ? "opacity-100" : "opacity-0"),
288
- onClick: b,
579
+ let C = () => {
580
+ !e && _ && r();
581
+ }, w = v && !e;
582
+ return f(/* @__PURE__ */ n("div", {
583
+ className: m("fixed inset-0 z-50 flex items-start justify-center", "p-2 sm:py-[3rem] lg:py-[5rem]", "transition-opacity duration-200 ease-out", w ? "opacity-100" : "opacity-0"),
584
+ onClick: C,
289
585
  children: [/* @__PURE__ */ t("div", {
290
- className: p("fixed inset-0 bg-black/50 backdrop-blur-sm", "transition-opacity duration-200", x ? "opacity-100" : "opacity-0"),
586
+ className: m("fixed inset-0 bg-black/60 backdrop-blur-md", "transition-opacity duration-200 ease-out", w ? "opacity-100" : "opacity-0"),
291
587
  "aria-hidden": "true"
292
588
  }), /* @__PURE__ */ n("div", {
293
- className: p("relative w-full", te[c], "bg-white dark:bg-gray-800 rounded-lg shadow-xl", "max-h-[calc(100vh-4rem)] sm:max-h-[calc(100vh-10rem)] overflow-hidden flex flex-col", "transition-all duration-200", x ? "opacity-100 scale-100 translate-y-0" : "opacity-0 scale-95 translate-y-2"),
589
+ ref: b,
590
+ role: "dialog",
591
+ "aria-modal": "true",
592
+ "aria-labelledby": i ? S : void 0,
593
+ tabIndex: -1,
594
+ className: m("relative w-full", te[d], D, "shadow-2xl", h[p], "max-h-[calc(100vh-4rem)] sm:max-h-[calc(100vh-10rem)] overflow-hidden flex flex-col", "transition-all duration-200 ease-out", "focus:outline-none", w ? "opacity-100 scale-100 translate-y-0" : "opacity-0 scale-95 translate-y-1"),
294
595
  onClick: (e) => e.stopPropagation(),
295
596
  children: [
296
597
  i && /* @__PURE__ */ n("div", {
297
- className: "flex items-center justify-between px-6 py-4 border-b border-gray-200 dark:border-gray-700 flex-shrink-0",
598
+ className: "flex items-center justify-between gap-4 px-6 pt-5 pb-4 flex-shrink-0",
298
599
  children: [/* @__PURE__ */ t("h2", {
299
- className: "text-lg font-semibold text-gray-900 dark:text-gray-100",
600
+ id: S,
601
+ className: "text-base font-medium tracking-tight text-gray-900 dark:text-gray-100",
300
602
  children: i
301
- }), /* @__PURE__ */ t(E, {
603
+ }), _ && /* @__PURE__ */ t(B, {
302
604
  icon: "i-mdi-close",
303
- onClick: r?.bind(null),
605
+ onClick: r,
304
606
  "aria-label": "Close",
305
- variant: "ghost",
306
- className: "text-gray-400 hover:text-gray-600 dark:hover:text-gray-300"
607
+ variant: "subtle",
608
+ size: "sm",
609
+ radius: "full",
610
+ className: "-mr-1"
307
611
  })]
308
612
  }),
309
613
  /* @__PURE__ */ t("div", {
310
- className: p("flex-1 overflow-y-auto px-6 py-4 text-gray-600 dark:text-gray-400 min-h-0", l),
614
+ className: m("flex-1 overflow-y-auto px-6 pb-6 text-sm leading-relaxed text-gray-600 dark:text-gray-400 min-h-0", !i && "pt-6", g),
311
615
  children: a
312
616
  }),
313
- o && /* @__PURE__ */ t("div", {
314
- className: "flex items-center justify-end gap-3 px-6 py-4 border-t border-gray-200 dark:border-gray-700 flex-shrink-0",
315
- children: o
617
+ c && /* @__PURE__ */ t("div", {
618
+ className: m("flex items-center justify-end gap-3 px-6 py-4 border-t flex-shrink-0", "border-gray-100 dark:border-gray-800"),
619
+ children: c
316
620
  })
317
621
  ]
318
622
  })]
319
623
  }), document.body);
320
624
  }
321
625
  //#endregion
322
- //#region src/components/modal/confirm_modal.tsx
323
- function j({ isOpen: r, onClose: i, onConfirm: a, title: o, children: s, confirmLabel: c, cancelLabel: l, confirmColor: d, loading: f = !1 }) {
324
- let [p, m] = u(!1), h = async () => {
325
- m(!0);
326
- try {
327
- await a();
328
- } finally {
329
- m(!1);
330
- }
331
- }, _ = f || p;
332
- return /* @__PURE__ */ t(A, {
333
- isOpen: r,
334
- onClose: i,
335
- title: o,
336
- size: "sm",
337
- footer: /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(g, {
338
- variant: "secondary",
339
- onClick: i,
340
- disabled: _,
341
- size: "sm",
342
- children: l ?? "Cancel"
343
- }), /* @__PURE__ */ t(g, {
344
- variant: (d ?? "blue") === "red" ? "danger" : "primary",
345
- onClick: () => {
346
- h();
347
- },
348
- loading: _,
349
- disabled: _,
350
- size: "sm",
351
- children: c ?? "Confirm"
352
- })] }),
353
- children: s && /* @__PURE__ */ t("div", {
354
- className: "text-sm text-gray-600 dark:text-gray-300",
355
- children: s
356
- })
357
- });
358
- }
359
- //#endregion
360
- //#region node_modules/.pnpm/zustand@5.0.12_@types+react@19.2.14_react@19.2.5_use-sync-external-store@1.6.0_react@19.2.5_/node_modules/zustand/esm/vanilla.mjs
361
- var M = (e) => {
626
+ //#region node_modules/.pnpm/zustand@5.0.14_@types+react@19.2.17_react@19.2.7_use-sync-external-store@1.6.0_react@19.2.7_/node_modules/zustand/esm/vanilla.mjs
627
+ var K = (e) => {
362
628
  let t, n = /* @__PURE__ */ new Set(), r = (e, r) => {
363
629
  let i = typeof e == "function" ? e(t) : e;
364
630
  if (!Object.is(i, t)) {
@@ -372,126 +638,156 @@ var M = (e) => {
372
638
  subscribe: (e) => (n.add(e), () => n.delete(e))
373
639
  }, o = t = e(r, i, a);
374
640
  return a;
375
- }, ne = ((e) => e ? M(e) : M), re = (e) => e;
641
+ }, ne = ((e) => e ? K(e) : K), re = (e) => e;
376
642
  function ie(e, t = re) {
377
643
  let n = r.useSyncExternalStore(e.subscribe, r.useCallback(() => t(e.getState()), [e, t]), r.useCallback(() => t(e.getInitialState()), [e, t]));
378
644
  return r.useDebugValue(n), n;
379
645
  }
380
- var N = (e) => {
646
+ var ae = (e) => {
381
647
  let t = ne(e), n = (e) => ie(t, e);
382
648
  return Object.assign(n, t), n;
383
- }, P = ((e) => e ? N(e) : N), F = P((e) => ({
649
+ }, oe = ((e) => e ? ae(e) : ae), q = oe((e) => ({
384
650
  globalHotkeysEnabled: !0,
385
651
  setGlobalHotkeysEnabled: (t) => e({ globalHotkeysEnabled: t })
386
- })), I = 200, L = () => Math.random().toString(36).substring(7), R = P((e, t) => ({
387
- modals: [],
388
- closingIds: /* @__PURE__ */ new Set(),
389
- open: (n) => {
390
- let r = L(), i = t(), a = i.modals.length === 0;
391
- return e({ modals: [...i.modals, {
392
- ...n,
393
- id: r,
394
- type: "standard"
395
- }] }), a && F.getState().setGlobalHotkeysEnabled(!1), r;
396
- },
397
- openConfirm: (n) => {
398
- let r = L(), i = t(), a = i.modals.length === 0;
399
- return e({ modals: [...i.modals, {
400
- ...n,
401
- id: r,
402
- type: "confirm"
403
- }] }), a && F.getState().setGlobalHotkeysEnabled(!1), r;
404
- },
405
- close: (n) => {
406
- if (!t().modals.find((e) => e.id === n)) return;
407
- let r = t().modals.length === 1;
408
- e((e) => ({ closingIds: new Set(e.closingIds).add(n) })), setTimeout(() => {
409
- e((e) => {
410
- let t = new Set(e.closingIds);
411
- t.delete(n);
412
- let i = e.modals.filter((e) => e.id !== n);
413
- return r && i.length === 0 && F.getState().setGlobalHotkeysEnabled(!0), {
414
- modals: i,
415
- closingIds: t
416
- };
417
- });
418
- }, I);
419
- },
420
- closeAll: () => {
421
- let n = t().modals;
422
- n.length !== 0 && (e({ closingIds: new Set(n.map((e) => e.id)) }), setTimeout(() => {
423
- e({
424
- modals: [],
425
- closingIds: /* @__PURE__ */ new Set()
426
- }), F.getState().setGlobalHotkeysEnabled(!0);
427
- }, I));
428
- },
429
- isOpen: (e) => t().modals.some((t) => t.id === e)
430
- }));
652
+ })), J = 0;
653
+ function Y() {
654
+ o(() => (J += 1, J === 1 && q.getState().setGlobalHotkeysEnabled(!1), () => {
655
+ --J, J === 0 && q.getState().setGlobalHotkeysEnabled(!0);
656
+ }), []);
657
+ }
431
658
  //#endregion
432
- //#region src/components/modal_provider/modal_provider.tsx
433
- function ae() {
434
- let n = R((e) => e.modals), r = R((e) => e.closingIds), i = R((e) => e.isOpen), a = R((e) => e.close);
435
- return /* @__PURE__ */ t(e, { children: n.map((e) => {
436
- let n = i(e.id) && !r.has(e.id);
437
- return e.type === "confirm" ? /* @__PURE__ */ t(j, {
438
- isOpen: n,
439
- onClose: () => a(e.id),
440
- onConfirm: async () => {
441
- await e.onConfirm(), a(e.id);
659
+ //#region src/components/modal/confirm_modal.tsx
660
+ var se = {
661
+ red: "danger",
662
+ blue: "primary",
663
+ green: "success"
664
+ }, ce = {
665
+ red: "i-mdi-alert-circle",
666
+ blue: "i-mdi-help-circle",
667
+ green: "i-mdi-check-circle"
668
+ }, le = {
669
+ red: "bg-red-50 text-red-600 dark:bg-red-500/10 dark:text-red-400",
670
+ blue: "bg-blue-50 text-blue-600 dark:bg-blue-500/10 dark:text-blue-400",
671
+ green: "bg-green-50 text-green-600 dark:bg-green-500/10 dark:text-green-400"
672
+ };
673
+ function ue({ title: e, color: r }) {
674
+ return /* @__PURE__ */ n("div", {
675
+ className: "flex items-center gap-3",
676
+ children: [/* @__PURE__ */ t("span", {
677
+ className: m("flex h-9 w-9 shrink-0 items-center justify-center rounded-full", le[r]),
678
+ "aria-hidden": "true",
679
+ children: /* @__PURE__ */ t("span", { className: m(ce[r], "h-5 w-5") })
680
+ }), e]
681
+ });
682
+ }
683
+ var de = W(({ call: r, title: i, children: a, confirmLabel: o, cancelLabel: s, confirmColor: c, radius: l, onConfirm: d }) => {
684
+ Y();
685
+ let [f, p] = u(!1), m = () => r.end(!1), h = async () => {
686
+ if (!d) {
687
+ r.end(!0);
688
+ return;
689
+ }
690
+ p(!0);
691
+ try {
692
+ await d(), r.end(!0);
693
+ } finally {
694
+ p(!1);
695
+ }
696
+ }, g = f, _ = o ?? "Confirm", v = s ?? "Cancel", y = c ?? "blue";
697
+ return /* @__PURE__ */ t(G, {
698
+ isEnded: r.ended,
699
+ onDismiss: m,
700
+ title: /* @__PURE__ */ t(ue, {
701
+ title: i,
702
+ color: y
703
+ }),
704
+ size: "sm",
705
+ radius: l,
706
+ footer: /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(b, {
707
+ variant: "outline",
708
+ color: "neutral",
709
+ onClick: m,
710
+ disabled: g,
711
+ size: "sm",
712
+ children: v
713
+ }), /* @__PURE__ */ t(b, {
714
+ color: se[y],
715
+ onClick: () => {
716
+ h();
442
717
  },
443
- title: e.title,
444
- confirmLabel: e.confirmLabel,
445
- cancelLabel: e.cancelLabel,
446
- confirmColor: e.confirmColor,
447
- children: e.children
448
- }, e.id) : /* @__PURE__ */ t(A, {
449
- isOpen: n,
450
- onClose: () => a(e.id),
451
- title: e.title,
452
- size: e.size,
453
- children: e.children
454
- }, e.id);
455
- }) });
718
+ loading: g,
719
+ disabled: g,
720
+ size: "sm",
721
+ children: _
722
+ })] }),
723
+ children: a
724
+ });
725
+ }, 200), fe = 200;
726
+ function pe(e, t) {
727
+ return typeof e == "function" ? e(t) : e;
728
+ }
729
+ var me = W(({ call: e, title: n, children: r, footer: i, size: a, radius: o, className: s, dismissible: c }) => {
730
+ Y();
731
+ let l = () => e.end();
732
+ return /* @__PURE__ */ t(G, {
733
+ isEnded: e.ended,
734
+ onDismiss: l,
735
+ title: n,
736
+ footer: pe(i, l),
737
+ size: a,
738
+ radius: o,
739
+ className: s,
740
+ dismissible: c,
741
+ children: pe(r, l)
742
+ });
743
+ }, fe);
744
+ //#endregion
745
+ //#region src/components/modal_provider/modal_provider.tsx
746
+ function he() {
747
+ return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(me, {}), /* @__PURE__ */ t(de, {})] });
456
748
  }
457
749
  //#endregion
458
750
  //#region src/components/radio_options/radio_options.tsx
459
- function oe({ options: e, orientation: r = "vertical", value: i, defaultValue: a, onChange: o, name: s, label: l, error: d, required: f, disabled: m, className: h, wrapperClassName: g, id: _ = "radio", ...v }) {
460
- let y = `${_}-${c()}`, b = s ?? y, [x, S] = u(a ?? ""), C = i !== void 0, w = C ? i : x, T = e.map((e) => typeof e == "string" ? {
751
+ function ge({ options: e, orientation: r = "vertical", value: i, defaultValue: a, onChange: o, name: c, label: l, error: d, required: f, disabled: p, radius: g = "lg", unstyled: _ = !1, className: v, wrapperClassName: y, id: b = "radio", ...x }) {
752
+ let S = `${b}-${s()}`, C = c ?? S, [T, E] = u(a ?? ""), D = i !== void 0, O = D ? i : T, k = e.map((e) => typeof e == "string" ? {
461
753
  value: e,
462
754
  label: e
463
- } : e), E = `${y}-error`, D = (e) => {
464
- C || S(e), o?.(e);
755
+ } : e), j = `${S}-error`, M = (e) => {
756
+ D || E(e), o?.(e);
465
757
  };
466
758
  return /* @__PURE__ */ n("fieldset", {
467
- className: p("m-0 border-0 p-0", g),
468
- disabled: m,
469
- "aria-describedby": d ? E : void 0,
759
+ className: m("m-0 border-0 p-0", y),
760
+ disabled: p,
761
+ "aria-describedby": d ? j : void 0,
470
762
  "aria-required": f,
471
- ...v,
763
+ ...x,
472
764
  children: [
473
765
  l && /* @__PURE__ */ n("legend", {
474
- className: p("mb-2 text-sm font-medium text-gray-700 dark:text-gray-300", h),
766
+ className: m("text-sm font-medium text-gray-700 dark:text-gray-300", "mb-2", v),
475
767
  children: [l, f && /* @__PURE__ */ t("span", {
476
- className: "ml-1 text-red-500 dark:text-red-400",
768
+ className: "text-red-500 dark:text-red-400 ml-1",
477
769
  children: "*"
478
770
  })]
479
771
  }),
480
772
  /* @__PURE__ */ t("div", {
481
- className: p(r === "horizontal" ? "flex flex-row gap-2" : "flex flex-col gap-2"),
482
- children: T.map((e, i) => {
483
- let a = `${y}-${i}`, o = `${y}-${i}-desc`, s = w === e.value, c = m ?? e.disabled;
773
+ className: m(r === "horizontal" ? "flex flex-row gap-2" : "flex flex-col gap-2"),
774
+ children: k.map((e, i) => {
775
+ let a = `${S}-${i}`, o = `${S}-${i}-desc`, s = O === e.value, c = p ?? e.disabled;
484
776
  return /* @__PURE__ */ n("label", {
485
777
  htmlFor: a,
486
- className: p("flex cursor-pointer items-start gap-3 rounded-lg border px-3 py-2.5 transition-colors duration-150", r === "horizontal" && "flex-1", "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", d ? "focus-within:ring-red-500" : "focus-within:ring-blue-500", s ? d ? "border-red-500 bg-red-50 dark:border-red-400 dark:bg-red-950/20" : "border-blue-500 bg-blue-50 dark:border-blue-500 dark:bg-blue-950/25" : d ? "border-red-300 bg-white dark:border-red-800/50 dark:bg-gray-800/50" : "border-gray-200 bg-gray-50 hover:border-gray-300 hover:bg-white dark:border-gray-700 dark:bg-gray-800/50 dark:hover:border-gray-600 dark:hover:bg-gray-800", c && "cursor-not-allowed opacity-50"),
778
+ className: m("flex cursor-pointer items-start gap-3 transition-colors duration-150", r === "horizontal" && "flex-1", "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", d ? "focus-within:ring-red-500" : "focus-within:ring-blue-500", !_ && [
779
+ h[g],
780
+ "border px-3 py-2.5",
781
+ s ? d ? m("border-red-500 dark:border-red-400", "bg-red-50 dark:bg-red-950/20") : "border-blue-500 bg-blue-50 dark:border-blue-500 dark:bg-blue-950/25" : d ? "border-red-300 bg-white dark:border-red-800/50 dark:bg-gray-800/50" : m("border-gray-200 dark:border-gray-700", "bg-gray-50 hover:border-gray-300 hover:bg-white dark:bg-gray-800/50 dark:hover:border-gray-600 dark:hover:bg-gray-800")
782
+ ], c && "cursor-not-allowed opacity-50"),
487
783
  children: [
488
784
  /* @__PURE__ */ t("input", {
489
785
  type: "radio",
490
786
  id: a,
491
- name: b,
787
+ name: C,
492
788
  value: e.value,
493
789
  checked: s,
494
- onChange: () => D(e.value),
790
+ onChange: () => M(e.value),
495
791
  disabled: c,
496
792
  required: f && i === 0,
497
793
  "aria-invalid": d ? !0 : void 0,
@@ -499,24 +795,24 @@ function oe({ options: e, orientation: r = "vertical", value: i, defaultValue: a
499
795
  className: "sr-only"
500
796
  }),
501
797
  /* @__PURE__ */ t("span", {
502
- className: p("mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-2 transition-colors duration-150", s ? d ? "border-red-500 dark:border-red-400" : "border-blue-600 dark:border-blue-500" : d ? "border-red-400 dark:border-red-600" : "border-gray-300 dark:border-gray-600"),
798
+ className: m("mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-2 transition-colors duration-150", s ? d ? A : "border-blue-600 dark:border-blue-500" : d ? "border-red-400 dark:border-red-600" : w),
503
799
  "aria-hidden": !0,
504
- children: s && /* @__PURE__ */ t("span", { className: p("h-2 w-2 rounded-full", d ? "bg-red-500 dark:bg-red-400" : "bg-blue-600 dark:bg-blue-500") })
800
+ children: s && /* @__PURE__ */ t("span", { className: m("h-2 w-2 rounded-full", d ? "bg-red-500 dark:bg-red-400" : "bg-blue-600 dark:bg-blue-500") })
505
801
  }),
506
802
  /* @__PURE__ */ n("span", {
507
803
  className: "flex min-w-0 flex-col",
508
804
  children: [/* @__PURE__ */ n("span", {
509
805
  className: "flex items-center gap-1.5",
510
806
  children: [e.icon && /* @__PURE__ */ t("span", {
511
- className: p(e.icon, "h-4 w-4 shrink-0", s ? d ? "text-red-600 dark:text-red-400" : "text-blue-600 dark:text-blue-400" : "text-gray-500 dark:text-gray-400"),
807
+ className: m(e.icon, "h-4 w-4 shrink-0", s ? d ? "text-red-600 dark:text-red-400" : "text-blue-600 dark:text-blue-400" : "text-gray-500 dark:text-gray-400"),
512
808
  "aria-hidden": !0
513
809
  }), /* @__PURE__ */ t("span", {
514
- className: p("select-none text-sm font-medium", s ? d ? "text-red-700 dark:text-red-300" : "text-blue-700 dark:text-blue-300" : "text-gray-700 dark:text-gray-300"),
810
+ className: m("select-none text-sm font-medium", s ? d ? "text-red-700 dark:text-red-300" : "text-blue-700 dark:text-blue-300" : "text-gray-700 dark:text-gray-300"),
515
811
  children: e.label
516
812
  })]
517
813
  }), e.description && /* @__PURE__ */ t("span", {
518
814
  id: o,
519
- className: "mt-0.5 text-xs text-gray-500 dark:text-gray-400",
815
+ className: m("text-xs text-gray-500 dark:text-gray-400", "mt-0.5"),
520
816
  children: e.description
521
817
  })]
522
818
  })
@@ -525,8 +821,8 @@ function oe({ options: e, orientation: r = "vertical", value: i, defaultValue: a
525
821
  })
526
822
  }),
527
823
  d && /* @__PURE__ */ t("p", {
528
- id: E,
529
- className: "mt-2 text-xs text-red-600 dark:text-red-400",
824
+ id: j,
825
+ className: m("text-xs text-red-600 dark:text-red-400", "mt-2"),
530
826
  role: "alert",
531
827
  children: d
532
828
  })
@@ -535,28 +831,32 @@ function oe({ options: e, orientation: r = "vertical", value: i, defaultValue: a
535
831
  }
536
832
  //#endregion
537
833
  //#region src/components/select/select.tsx
538
- function se({ options: e, label: r, error: i, placeholder: a, className: o, wrapperClassName: s, value: l, defaultValue: u, onChange: d, id: f = "select", ...m }) {
539
- let h = `${f}-${c()}`;
834
+ function _e({ options: e, label: r, error: i, placeholder: a, radius: o = "md", unstyled: c = !1, className: l, wrapperClassName: u, value: d, defaultValue: f, onChange: p, id: g = "select", ..._ }) {
835
+ let v = `${g}-${s()}`;
540
836
  return /* @__PURE__ */ n("div", {
541
- className: p("w-full", s),
837
+ className: m("w-full", u),
542
838
  children: [
543
839
  typeof r == "string" ? /* @__PURE__ */ n("label", {
544
- className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",
545
- htmlFor: h,
546
- children: [r, m.required && /* @__PURE__ */ t("span", {
840
+ className: m(k, "block mb-1"),
841
+ htmlFor: v,
842
+ children: [r, _.required && /* @__PURE__ */ t("span", {
547
843
  className: "text-red-500 dark:text-red-400 ml-1",
548
844
  children: "*"
549
845
  })]
550
846
  }) : r,
551
847
  /* @__PURE__ */ n("select", {
552
- id: h,
553
- className: p(D, "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\")]", i && "border-red-500 dark:border-red-400 focus:ring-red-500", o),
554
- value: l,
555
- defaultValue: u,
556
- onChange: d,
848
+ id: v,
849
+ className: m("w-full disabled:opacity-50 disabled:cursor-not-allowed", !c && [
850
+ F,
851
+ h[o],
852
+ "pl-3 pr-8 py-2 text-sm appearance-none bg-[length:1rem_1rem] bg-[position:right_0.5rem_center] bg-no-repeat",
853
+ "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\")]"
854
+ ], !c && i && m("border-red-500 dark:border-red-400", "focus:ring-red-500"), l),
855
+ ...d === void 0 ? { defaultValue: f } : { value: d },
856
+ onChange: p,
557
857
  "aria-invalid": !!i,
558
- "aria-describedby": i ? `${h}-error` : void 0,
559
- ...m,
858
+ "aria-describedby": i ? `${v}-error` : void 0,
859
+ ..._,
560
860
  children: [a !== void 0 && /* @__PURE__ */ t("option", {
561
861
  value: "",
562
862
  children: a
@@ -566,8 +866,8 @@ function se({ options: e, label: r, error: i, placeholder: a, className: o, wrap
566
866
  }, e.value))]
567
867
  }),
568
868
  i && /* @__PURE__ */ t("p", {
569
- id: `${h}-error`,
570
- className: "text-xs text-red-600 dark:text-red-400 mt-1",
869
+ id: `${v}-error`,
870
+ className: m("text-xs text-red-600 dark:text-red-400", "mt-1"),
571
871
  role: "alert",
572
872
  children: i
573
873
  })
@@ -576,23 +876,22 @@ function se({ options: e, label: r, error: i, placeholder: a, className: o, wrap
576
876
  }
577
877
  //#endregion
578
878
  //#region src/components/switch/switch.tsx
579
- function ce({ label: r, description: i, error: a, className: o, wrapperClassName: s, checked: l, defaultChecked: d = !1, onChange: f, id: m = "switch", ...h }) {
580
- let g = `${m}-${c()}`, [_, v] = u(d), y = l !== void 0, b = y ? l : _, x = [i && `${g}-description`, a && `${g}-error`].filter(Boolean).join(" ") || void 0;
879
+ function ve({ label: r, description: i, error: a, className: o, wrapperClassName: c, checked: l, defaultChecked: d = !1, onChange: f, id: p = "switch", ...h }) {
880
+ let g = `${p}-${s()}`, [_, v] = u(d), y = l !== void 0, b = y ? l : _, x = [i && `${g}-description`, a && `${g}-error`].filter(Boolean).join(" ") || void 0;
581
881
  return /* @__PURE__ */ n("div", {
582
- className: p("w-full", s),
882
+ className: m("w-full", c),
583
883
  children: [
584
884
  /* @__PURE__ */ n("label", {
585
885
  htmlFor: g,
586
- className: p("flex items-center gap-3 cursor-pointer", h.disabled && "cursor-not-allowed opacity-50"),
886
+ className: m("flex items-center gap-3 cursor-pointer", h.disabled && "cursor-not-allowed opacity-50"),
587
887
  children: [/* @__PURE__ */ n("span", {
588
- className: p("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", b ? "bg-blue-600 dark:bg-blue-500" : "bg-gray-200 dark:bg-gray-600", a && "ring-2 ring-red-500 dark:ring-red-400", o),
888
+ className: m("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", b ? O : "bg-gray-200 dark:bg-gray-600", a && "ring-2 ring-red-500 dark:ring-red-400", o),
589
889
  children: [/* @__PURE__ */ t("input", {
590
890
  type: "checkbox",
591
891
  role: "switch",
592
892
  id: g,
593
893
  className: "sr-only",
594
- checked: l,
595
- defaultChecked: d,
894
+ checked: b,
596
895
  onChange: (e) => {
597
896
  y || v(e.target.checked), f?.(e);
598
897
  },
@@ -600,11 +899,11 @@ function ce({ label: r, description: i, error: a, className: o, wrapperClassName
600
899
  "aria-describedby": x,
601
900
  ...h
602
901
  }), /* @__PURE__ */ t("span", {
603
- className: p("pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0", "transition duration-200 ease-in-out", b ? "translate-x-5.25" : "translate-x-0"),
902
+ className: m("pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0", "transition duration-200 ease-in-out", b ? "translate-x-5.25" : "translate-x-0"),
604
903
  "aria-hidden": !0
605
904
  })]
606
905
  }), r && /* @__PURE__ */ t(e, { children: typeof r == "string" ? /* @__PURE__ */ n("span", {
607
- className: "text-sm font-medium text-gray-700 dark:text-gray-300 select-none",
906
+ className: m("text-sm font-medium text-gray-700 dark:text-gray-300", "select-none"),
608
907
  children: [r, h.required && /* @__PURE__ */ t("span", {
609
908
  className: "text-red-500 dark:text-red-400 ml-1",
610
909
  children: "*"
@@ -616,16 +915,16 @@ function ce({ label: r, description: i, error: a, className: o, wrapperClassName
616
915
  }),
617
916
  i && (typeof i == "string" ? /* @__PURE__ */ t("p", {
618
917
  id: `${g}-description`,
619
- className: "text-xs text-gray-500 dark:text-gray-400 mt-1 ml-14",
918
+ className: m("text-xs text-gray-500 dark:text-gray-400", "mt-1 ml-14"),
620
919
  children: i
621
920
  }) : /* @__PURE__ */ t("span", {
622
921
  id: `${g}-description`,
623
- className: "block text-xs text-gray-500 dark:text-gray-400 mt-1 ml-14",
922
+ className: m("text-xs text-gray-500 dark:text-gray-400", "block mt-1 ml-14"),
624
923
  children: i
625
924
  })),
626
925
  a && /* @__PURE__ */ t("p", {
627
926
  id: `${g}-error`,
628
- className: "text-xs text-red-600 dark:text-red-400 mt-1 ml-14",
927
+ className: m("text-xs text-red-600 dark:text-red-400", "mt-1 ml-14"),
629
928
  role: "alert",
630
929
  children: a
631
930
  })
@@ -634,87 +933,142 @@ function ce({ label: r, description: i, error: a, className: o, wrapperClassName
634
933
  }
635
934
  //#endregion
636
935
  //#region src/components/tabs/tabs.tsx
637
- function z({ items: e, defaultIndex: r = 0, className: i, tabListClassName: a, panelClassName: o, onChange: s }) {
638
- let [c, l] = u(r), d = (t) => {
639
- e[t]?.disabled || (l(t), s?.(t));
640
- }, f = e[c];
936
+ function ye({ items: e, defaultIndex: r = 0, radius: i = "md", className: a, tabListClassName: o, panelClassName: c, onChange: d }) {
937
+ let [f, p] = u(r), g = s(), _ = l([]), v = (t) => {
938
+ e[t]?.disabled || (p(t), d?.(t));
939
+ }, y = (e) => {
940
+ _.current[e]?.focus(), v(e);
941
+ }, b = (t) => {
942
+ let n = e.map((e, t) => t).filter((t) => !e[t]?.disabled);
943
+ if (n.length === 0) return;
944
+ let r = n.indexOf(f);
945
+ t.key === "ArrowRight" ? (t.preventDefault(), y(n[(r + 1) % n.length])) : t.key === "ArrowLeft" ? (t.preventDefault(), y(n[(r - 1 + n.length) % n.length])) : t.key === "Home" ? (t.preventDefault(), y(n[0])) : t.key === "End" && (t.preventDefault(), y(n[n.length - 1]));
946
+ }, x = e[f];
641
947
  return /* @__PURE__ */ n("div", {
642
- className: p("w-full", i),
948
+ className: m("w-full", a),
643
949
  children: [/* @__PURE__ */ t("div", {
644
950
  role: "tablist",
645
- className: p("flex gap-1 p-1 rounded-md bg-gray-100 dark:bg-gray-800/50 border border-gray-200 dark:border-gray-700", a),
951
+ className: m("flex gap-1 p-1 bg-gray-100 dark:bg-gray-800/50 border", E, h[i], o),
646
952
  children: e.map((e, r) => /* @__PURE__ */ n("button", {
953
+ ref: (e) => {
954
+ _.current[r] = e;
955
+ },
956
+ id: `${g}-tab-${r}`,
647
957
  role: "tab",
648
958
  type: "button",
649
- "aria-selected": c === r,
959
+ "aria-selected": f === r,
650
960
  "aria-disabled": e.disabled,
961
+ "aria-controls": `${g}-panel-${r}`,
962
+ tabIndex: f === r ? 0 : -1,
651
963
  disabled: e.disabled,
652
- onClick: () => d(r),
653
- className: p("flex items-center gap-2 px-4 py-2.5 rounded-md text-sm font-medium", c === r ? "bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm border border-gray-200 dark:border-gray-600" : p("text-gray-600 dark:text-gray-400 border border-transparent", e.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")),
654
- children: [e.icon && /* @__PURE__ */ t("span", { className: p("w-4 h-4 block shrink-0", e.icon, c === r ? "text-blue-600 dark:text-blue-400" : "text-gray-500 dark:text-gray-400") }), e.title]
964
+ onClick: () => v(r),
965
+ onKeyDown: b,
966
+ className: m("flex items-center gap-2 px-4 py-2.5 text-sm font-medium", h[i], f === r ? m("bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm border", E) : m("text-gray-600 dark:text-gray-400 border border-transparent", e.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")),
967
+ children: [e.icon && /* @__PURE__ */ t("span", { className: m("w-4 h-4 block shrink-0", e.icon, f === r ? "text-blue-600 dark:text-blue-400" : "text-gray-500 dark:text-gray-400") }), e.title]
655
968
  }, r))
656
969
  }), /* @__PURE__ */ t("div", {
657
970
  role: "tabpanel",
658
- className: p("mt-3 rounded-md border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800/50 p-4 overflow-hidden", o),
971
+ id: `${g}-panel-${f}`,
972
+ "aria-labelledby": `${g}-tab-${f}`,
973
+ tabIndex: 0,
974
+ className: m("mt-3 border bg-white dark:bg-gray-800/50 p-4 overflow-hidden focus:outline-none", E, h[i], c),
659
975
  children: /* @__PURE__ */ t("div", {
660
976
  className: "tabs-panel-inner",
661
- children: f?.content
662
- }, c)
977
+ children: x?.content
978
+ }, f)
663
979
  })]
664
980
  });
665
981
  }
666
982
  //#endregion
667
983
  //#region src/components/textarea/textarea.tsx
668
- function le({ label: e, error: r, showCharCount: i = !1, minLength: a, maxLength: o, className: s, wrapperClassName: l, value: d, defaultValue: f, onChange: m, id: h = "textarea", ...g }) {
669
- let _ = `${h}-${c()}`, [y, b] = u(typeof f == "string" ? f.length : 0), x = typeof d == "string" ? d.length : d === void 0 ? y : 0, S = i && (a !== void 0 || o !== void 0);
984
+ function be({ label: e, error: r, showCharCount: i = !1, minLength: a, maxLength: o, radius: c = "md", unstyled: l = !1, className: d, wrapperClassName: f, value: p, defaultValue: g, onChange: _, id: v = "textarea", ...y }) {
985
+ let b = `${v}-${s()}`, [x, S] = u(typeof g == "string" ? g.length : 0), w = typeof p == "string" ? p.length : p === void 0 ? x : 0, T = i && (a !== void 0 || o !== void 0), E = (e) => {
986
+ p === void 0 && S(e.target.value.length), _?.(e);
987
+ };
670
988
  return /* @__PURE__ */ n("div", {
671
- className: p("w-full", l),
989
+ className: m("w-full", f),
672
990
  children: [
673
991
  typeof e == "string" ? /* @__PURE__ */ n("label", {
674
- className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",
675
- htmlFor: _,
676
- children: [e, g.required && /* @__PURE__ */ t("span", {
992
+ className: m(k, "block mb-1"),
993
+ htmlFor: b,
994
+ children: [e, y.required && /* @__PURE__ */ t("span", {
677
995
  className: "text-red-500 dark:text-red-400 ml-1",
678
996
  children: "*"
679
997
  })]
680
998
  }) : e,
681
999
  /* @__PURE__ */ t("textarea", {
682
- id: _,
683
- className: p(D, "px-3 py-2 text-sm min-h-[80px] resize-y", r && "border-red-500 dark:border-red-400 focus:ring-red-500", s),
684
- value: d,
685
- defaultValue: f,
1000
+ id: b,
1001
+ className: m("w-full min-h-[80px] resize-y disabled:opacity-50 disabled:cursor-not-allowed", !l && [
1002
+ F,
1003
+ h[c],
1004
+ "px-3 py-2 text-sm"
1005
+ ], !l && r && m("border-red-500 dark:border-red-400", "focus:ring-red-500"), d),
1006
+ ...p === void 0 ? { defaultValue: g } : { value: p },
686
1007
  minLength: a,
687
1008
  maxLength: o,
688
- onChange: (e) => {
689
- d === void 0 && b(e.target.value.length), m?.(e);
690
- },
691
- ...g
1009
+ onChange: E,
1010
+ "aria-invalid": !!r,
1011
+ "aria-describedby": r ? `${b}-error` : void 0,
1012
+ ...y
692
1013
  }),
693
- S && /* @__PURE__ */ t(v, {
694
- current: x,
1014
+ T && /* @__PURE__ */ t(C, {
1015
+ current: w,
695
1016
  min: a,
696
1017
  max: o,
697
1018
  showMin: a !== void 0,
698
1019
  showMax: o !== void 0
699
1020
  }),
700
1021
  r && /* @__PURE__ */ t("p", {
701
- className: "text-xs text-red-600 dark:text-red-400 mt-1",
1022
+ id: `${b}-error`,
1023
+ className: m("text-xs text-red-600 dark:text-red-400", "mt-1"),
1024
+ role: "alert",
702
1025
  children: r
703
1026
  })
704
1027
  ]
705
1028
  });
706
1029
  }
707
1030
  //#endregion
1031
+ //#region src/stores/theme_store/theme_store.ts
1032
+ var X = "theme";
1033
+ function xe(e) {
1034
+ return e === "light" || e === "dark" || e === "system";
1035
+ }
1036
+ function Z() {
1037
+ return globalThis.window !== void 0 && globalThis.document !== void 0;
1038
+ }
1039
+ function Q(e) {
1040
+ let t = window.matchMedia("(prefers-color-scheme: dark)").matches, n = e === "dark" || e === "system" && t;
1041
+ document.documentElement.classList.toggle("dark", n);
1042
+ }
1043
+ function Se() {
1044
+ if (!Z()) return "system";
1045
+ let e = globalThis.localStorage.getItem(X);
1046
+ return xe(e) ? e : "system";
1047
+ }
1048
+ var $ = oe((e) => ({
1049
+ theme: Se(),
1050
+ setTheme: (t) => {
1051
+ Q(t), Z() && globalThis.localStorage.setItem(X, t), e({ theme: t });
1052
+ }
1053
+ }));
1054
+ Z() && (globalThis.addEventListener("storage", (e) => {
1055
+ if (e.key !== X) return;
1056
+ let t = xe(e.newValue) ? e.newValue : "system";
1057
+ Q(t), $.setState({ theme: t });
1058
+ }), globalThis.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", () => {
1059
+ $.getState().theme === "system" && Q("system");
1060
+ }));
1061
+ //#endregion
708
1062
  //#region src/hooks/use_is_client/use_is_client.tsx
709
- var B = () => {
1063
+ var Ce = () => {
710
1064
  let [e, t] = u(!1);
711
- return s(() => {
1065
+ return o(() => {
712
1066
  requestAnimationFrame(() => {
713
1067
  t(!0);
714
1068
  });
715
1069
  }, []), e;
716
- }, V = 750, H = "ease-in-out";
717
- async function U({ theme: e, element: t, transitionDuration: n = V, transitionEasing: r = H, applyThemeCallback: i }) {
1070
+ }, we = 750, Te = "ease-in-out";
1071
+ async function Ee({ theme: e, element: t, transitionDuration: n = we, transitionEasing: r = Te, applyThemeCallback: i }) {
718
1072
  if (!document.startViewTransition || globalThis.matchMedia("(prefers-reduced-motion: reduce)").matches) {
719
1073
  i(e);
720
1074
  return;
@@ -728,96 +1082,55 @@ async function U({ theme: e, element: t, transitionDuration: n = V, transitionEa
728
1082
  pseudoElement: "::view-transition-new(root)"
729
1083
  });
730
1084
  }
731
- function ue(e) {
1085
+ function De(e) {
732
1086
  return e === "light" ? "dark" : e === "dark" ? "system" : "light";
733
1087
  }
734
1088
  //#endregion
735
- //#region src/utils/theme.ts
736
- var W = "theme", G = /* @__PURE__ */ new Set(), K = null;
737
- function q(e) {
738
- return e === "light" || e === "dark" || e === "system";
739
- }
740
- function J() {
741
- return globalThis.window !== void 0 && globalThis.document !== void 0;
742
- }
743
- function Y(e) {
744
- for (let t of G) t(e);
745
- }
746
- function de() {
747
- if (!J() || K) return;
748
- let e = globalThis.matchMedia("(prefers-color-scheme: dark)"), t = (e) => {
749
- if (e.key !== W) return;
750
- let t = q(e.newValue) ? e.newValue : "system";
751
- X(t), Y(t);
752
- }, n = () => {
753
- Z() === "system" && (X("system"), Y("system"));
754
- }, r = typeof e.addEventListener == "function" && typeof e.removeEventListener == "function";
755
- globalThis.addEventListener("storage", t), r && e.addEventListener("change", n), K = () => {
756
- globalThis.removeEventListener("storage", t), r && e.removeEventListener("change", n), K = null;
757
- };
758
- }
759
- function fe() {
760
- G.size === 0 && K && K();
761
- }
762
- function X(e) {
763
- let t = document.documentElement;
764
- e === "system" ? window.matchMedia("(prefers-color-scheme: dark)").matches ? t.classList.add("dark") : t.classList.remove("dark") : e === "dark" ? t.classList.add("dark") : t.classList.remove("dark");
765
- }
766
- function Z() {
767
- if (!J()) return "system";
768
- let e = globalThis.localStorage.getItem(W);
769
- return q(e) ? e : "system";
770
- }
771
- function Q(e) {
772
- J() && (X(e), globalThis.localStorage.setItem(W, e), Y(e));
773
- }
774
- function $(e) {
775
- return G.add(e), de(), () => {
776
- G.delete(e), fe();
777
- };
778
- }
779
- //#endregion
780
1089
  //#region src/components/theme_toggle/theme_toggle.tsx
781
- var pe = {
1090
+ var Oe = {
782
1091
  light: "i-tabler-sun text-yellow-500",
783
1092
  dark: "i-tabler-moon-stars text-gray-700 dark:text-yellow-500",
784
1093
  system: "i-tabler-device-desktop text-blue-500"
785
- }, me = "i-tabler-device-desktop text-gray-400";
786
- function he({ isTransitionEnabled: e = !0, transitionDuration: n, transitionEasing: r, size: i = "md" }) {
787
- let [a, c] = u("system"), d = B(), f = l(null);
788
- s(() => {
789
- let e = Z();
790
- return requestAnimationFrame(() => {
791
- c(e), Q(e);
792
- }), $((e) => {
793
- c(e);
794
- });
795
- }, []);
796
- let p = o(async () => {
797
- let t = ue(a), i = f.current;
798
- i && e ? await U({
1094
+ }, ke = "i-tabler-device-desktop text-gray-400";
1095
+ function Ae({ isTransitionEnabled: e = !0, transitionDuration: n, transitionEasing: r, size: i = "md", radius: s }) {
1096
+ let c = $((e) => e.theme), u = $((e) => e.setTheme), d = Ce(), f = l(null);
1097
+ o(() => {
1098
+ u($.getState().theme);
1099
+ }, [u]);
1100
+ let p = a(async () => {
1101
+ let t = De(c), i = f.current;
1102
+ i && e ? await Ee({
799
1103
  theme: t,
800
1104
  element: i,
801
1105
  transitionDuration: n,
802
1106
  transitionEasing: r,
803
- applyThemeCallback: Q
804
- }) : Q(t);
1107
+ applyThemeCallback: u
1108
+ }) : u(t);
805
1109
  }, [
806
- a,
1110
+ c,
807
1111
  e,
808
1112
  n,
809
- r
1113
+ r,
1114
+ u
810
1115
  ]);
811
- return /* @__PURE__ */ t(E, {
1116
+ return /* @__PURE__ */ t(B, {
812
1117
  ref: f,
813
- icon: d ? pe[a] : me,
814
- "aria-label": `Thème actuel: ${a}`,
1118
+ icon: d ? Oe[c] : ke,
1119
+ "aria-label": `Thème actuel: ${c}`,
815
1120
  size: i,
1121
+ radius: s,
816
1122
  onClick: () => {
817
1123
  p();
818
- },
819
- className: "!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"
1124
+ }
820
1125
  });
821
1126
  }
822
1127
  //#endregion
823
- export { D as BASE_INPUT_STYLES, g as Button, v as CharacterCount, y as Checkbox, S as ClientOnly, j as ConfirmModal, E as IconButton, ee as Input, A as Modal, ae as ModalProvider, oe as RadioOptions, se as Select, ce as Switch, z as Tabs, le as Textarea, he as ThemeToggle, X as applyTheme, $ as followThemeState, Z as getCurrentTheme, Q as setCurrentTheme, b as useClientOnly, F as useGlobalHotkeysStore, B as useIsClient, R as useModalStore, O as useRunAfterAnimation, x as withClientOnly };
1128
+ //#region src/hooks/use_run_after_animation/use_run_after_animation.ts
1129
+ function je(e) {
1130
+ return a((t) => {
1131
+ let n = setTimeout(t, e);
1132
+ return () => clearTimeout(n);
1133
+ }, [e]);
1134
+ }
1135
+ //#endregion
1136
+ export { F as BASE_INPUT_STYLES, b as Button, C as CharacterCount, j as Checkbox, P as ClientOnly, L as Combobox, de as ConfirmModal, B as IconButton, I as Input, me as Modal, he as ModalProvider, ge as RadioOptions, _e as Select, ve as Switch, ye as Tabs, be as Textarea, Ae as ThemeToggle, M as useClientOnly, Y as useDisableHotkeysWhileMounted, q as useGlobalHotkeysStore, Ce as useIsClient, je as useRunAfterAnimation, $ as useThemeStore, N as withClientOnly };