tintora 0.22.0 → 0.23.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.
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
- import { cloneElement as e, createContext as t, useContext as n, useEffect as r, useId as i, useLayoutEffect as a, useRef as o, useState as s } from "react";
2
- import { jsx as c, jsxs as l } from "react/jsx-runtime";
1
+ import { jsx as e, jsxs as t } from "react/jsx-runtime";
2
+ import { cloneElement as n, createContext as r, useContext as i, useEffect as a, useId as o, useLayoutEffect as s, useRef as c, useState as l } from "react";
3
3
  //#region node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
4
4
  function u(e) {
5
5
  var t, n, r = "";
@@ -17,31 +17,100 @@ function d() {
17
17
  return r;
18
18
  }
19
19
  //#endregion
20
+ //#region src/Alert/Alert.tsx
21
+ var f = {
22
+ info: /* @__PURE__ */ e("path", { d: "M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM12 16v-4M12 8h.01" }),
23
+ success: /* @__PURE__ */ e("path", { d: "M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM8 12.5l2.7 2.7L16 9.8" }),
24
+ warning: /* @__PURE__ */ e("path", { d: "M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01" }),
25
+ error: /* @__PURE__ */ e("path", { d: "M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM15 9l-6 6M9 9l6 6" })
26
+ }, p = ({ status: t }) => /* @__PURE__ */ e("svg", {
27
+ width: "22",
28
+ height: "22",
29
+ viewBox: "0 0 24 24",
30
+ fill: "none",
31
+ stroke: `var(--tintora-status-${t}-fg)`,
32
+ strokeWidth: "2",
33
+ strokeLinecap: "round",
34
+ strokeLinejoin: "round",
35
+ "aria-hidden": "true",
36
+ style: {
37
+ flex: "0 0 auto",
38
+ marginTop: 1
39
+ },
40
+ children: f[t]
41
+ });
42
+ function m({ status: n = "info", variant: r = "alert", title: i, children: a, action: o, onDismiss: s, className: c, ...l }) {
43
+ return /* @__PURE__ */ t("div", {
44
+ ...l,
45
+ role: r === "alert" && n === "error" ? "alert" : "status",
46
+ className: d("tintora-alert", r === "announcement" ? "tintora-alert--announcement" : `tintora-alert--${n}`, c),
47
+ children: [
48
+ r === "alert" && /* @__PURE__ */ e(p, { status: n }),
49
+ /* @__PURE__ */ t("div", {
50
+ className: d("tintora-alert__content", r === "announcement" && "tintora-alert__content--announcement"),
51
+ children: [
52
+ i && /* @__PURE__ */ e("span", {
53
+ className: "tintora-alert__content__title",
54
+ children: i
55
+ }),
56
+ a && /* @__PURE__ */ e("span", {
57
+ className: "tintora-alert__content__sub-title",
58
+ children: a
59
+ }),
60
+ o && /* @__PURE__ */ e("button", {
61
+ type: "button",
62
+ onClick: o.onClick,
63
+ className: d("tintora-alert__content__action", r === "alert" && `tintora-alert__content__action--${n}`),
64
+ children: o.label
65
+ })
66
+ ]
67
+ }),
68
+ r === "alert" && s && /* @__PURE__ */ e("button", {
69
+ type: "button",
70
+ "aria-label": "Dismiss",
71
+ className: "tintora-alert__close",
72
+ onClick: s,
73
+ children: /* @__PURE__ */ e("svg", {
74
+ width: "16",
75
+ height: "16",
76
+ viewBox: "0 0 24 24",
77
+ fill: "none",
78
+ stroke: "currentColor",
79
+ strokeWidth: "2",
80
+ strokeLinecap: "round",
81
+ "aria-hidden": "true",
82
+ children: /* @__PURE__ */ e("path", { d: "M18 6L6 18M6 6l12 12" })
83
+ })
84
+ })
85
+ ]
86
+ });
87
+ }
88
+ //#endregion
20
89
  //#region src/Avatar/utils.ts
21
- function f(e) {
90
+ function h(e) {
22
91
  if (!e.length) return "";
23
92
  let t = e.trim().split(/\s+/).map((e) => e.match(/\p{L}\p{M}*/u)?.[0]).filter((e) => !!e);
24
93
  return `${t[0] ?? ""}${t.length > 1 ? t.at(-1) ?? "" : ""}`.toLocaleUpperCase();
25
94
  }
26
95
  //#endregion
27
96
  //#region src/Avatar/Avatar.tsx
28
- function p({ name: e, src: t, size: n = "medium", className: r, ...i }) {
29
- let [a, o] = s(), l = !!t && t !== a;
30
- return /* @__PURE__ */ c("span", {
97
+ function g({ name: t, src: n, size: r = "medium", className: i, ...a }) {
98
+ let [o, s] = l(), c = !!n && n !== o;
99
+ return /* @__PURE__ */ e("span", {
31
100
  role: "img",
32
- "aria-label": e,
33
- ...i,
34
- className: d("tintora-avatar", `tintora-avatar--${n}`, r),
35
- children: l ? /* @__PURE__ */ c("img", {
36
- src: t,
101
+ "aria-label": t,
102
+ ...a,
103
+ className: d("tintora-avatar", `tintora-avatar--${r}`, i),
104
+ children: c ? /* @__PURE__ */ e("img", {
105
+ src: n,
37
106
  alt: "",
38
- onError: () => o(t)
39
- }) : f(e)
107
+ onError: () => s(n)
108
+ }) : h(t)
40
109
  });
41
110
  }
42
111
  //#endregion
43
112
  //#region src/Spinner/Spinner.tsx
44
- var m = {
113
+ var _ = {
45
114
  small: {
46
115
  width: 16,
47
116
  height: 16,
@@ -58,87 +127,87 @@ var m = {
58
127
  strokeWidth: 2.4
59
128
  }
60
129
  };
61
- function h({ size: e = "medium", color: t = "accent" }) {
62
- let { width: n, height: r, strokeWidth: i } = m[e];
63
- return /* @__PURE__ */ l("svg", {
130
+ function v({ size: n = "medium", color: r = "accent" }) {
131
+ let { width: i, height: a, strokeWidth: o } = _[n];
132
+ return /* @__PURE__ */ t("svg", {
64
133
  className: "tintora-spinner",
65
- width: n,
66
- height: r,
134
+ width: i,
135
+ height: a,
67
136
  viewBox: "0 0 24 24",
68
137
  fill: "none",
69
138
  role: "img",
70
139
  "aria-label": "Loading",
71
- children: [/* @__PURE__ */ c("circle", {
140
+ children: [/* @__PURE__ */ e("circle", {
72
141
  cx: "12",
73
142
  cy: "12",
74
143
  r: "9",
75
144
  stroke: "currentColor",
76
- strokeOpacity: t === "accent" ? .25 : .35,
77
- strokeWidth: i
78
- }), /* @__PURE__ */ c("path", {
145
+ strokeOpacity: r === "accent" ? .25 : .35,
146
+ strokeWidth: o
147
+ }), /* @__PURE__ */ e("path", {
79
148
  d: "M21 12a9 9 0 0 0-9-9",
80
- stroke: t === "accent" ? "var(--tintora-control-fill)" : "currentColor",
81
- strokeWidth: i,
149
+ stroke: r === "accent" ? "var(--tintora-control-fill)" : "currentColor",
150
+ strokeWidth: o,
82
151
  strokeLinecap: "round"
83
152
  })]
84
153
  });
85
154
  }
86
155
  //#endregion
87
156
  //#region src/Button/Button.tsx
88
- function g({ children: e, className: t, variant: n, size: r = "medium", leadingIcon: i, trailingIcon: a, type: o = "button", loading: s = !1, disabled: u, ...f }) {
89
- return /* @__PURE__ */ l("button", {
90
- type: o,
91
- className: d("tintora-button", `tintora-button--${n}`, `tintora-button--${r}`, {
92
- "tintora-button--leading-icon": !!i || s,
93
- "tintora-button--loading": s,
94
- "tintora-button--trailing-icon": !!a
95
- }, t),
96
- disabled: u || s,
97
- "aria-busy": s || void 0,
157
+ function y({ children: n, className: r, variant: i, size: a = "medium", leadingIcon: o, trailingIcon: s, type: c = "button", loading: l = !1, disabled: u, ...f }) {
158
+ return /* @__PURE__ */ t("button", {
159
+ type: c,
160
+ className: d("tintora-button", `tintora-button--${i}`, `tintora-button--${a}`, {
161
+ "tintora-button--leading-icon": !!o || l,
162
+ "tintora-button--loading": l,
163
+ "tintora-button--trailing-icon": !!s
164
+ }, r),
165
+ disabled: u || l,
166
+ "aria-busy": l || void 0,
98
167
  ...f,
99
168
  children: [
100
- s && /* @__PURE__ */ c("span", {
169
+ l && /* @__PURE__ */ e("span", {
101
170
  className: "tintora-button__icon",
102
171
  "aria-hidden": "true",
103
- children: /* @__PURE__ */ c(h, {
172
+ children: /* @__PURE__ */ e(v, {
104
173
  size: "small",
105
174
  color: "current"
106
175
  })
107
176
  }),
108
- !s && i && /* @__PURE__ */ c("span", {
177
+ !l && o && /* @__PURE__ */ e("span", {
109
178
  className: "tintora-button__icon",
110
179
  "aria-hidden": "true",
111
- children: i
180
+ children: o
112
181
  }),
113
- e,
114
- a && /* @__PURE__ */ c("span", {
182
+ n,
183
+ s && /* @__PURE__ */ e("span", {
115
184
  className: "tintora-button__icon",
116
185
  "aria-hidden": "true",
117
- children: a
186
+ children: s
118
187
  })
119
188
  ]
120
189
  });
121
190
  }
122
191
  //#endregion
123
192
  //#region src/Card/Card.tsx
124
- function _({ as: e = "article", variant: t = "surface", className: n, ...r }) {
125
- return /* @__PURE__ */ c(e, {
126
- ...r,
127
- className: d("tintora-card", `tintora-card--${t}`, n)
193
+ function b({ as: t = "article", variant: n = "surface", className: r, ...i }) {
194
+ return /* @__PURE__ */ e(t, {
195
+ ...i,
196
+ className: d("tintora-card", `tintora-card--${n}`, r)
128
197
  });
129
198
  }
130
- function v({ selected: e = !1, className: t, ...n }) {
131
- return /* @__PURE__ */ c("button", {
132
- ...n,
199
+ function x({ selected: t = !1, className: n, ...r }) {
200
+ return /* @__PURE__ */ e("button", {
201
+ ...r,
133
202
  type: "button",
134
- "aria-pressed": e,
135
- className: d("tintora-card", "tintora-card--surface", "tintora-card--selectable", e && "tintora-card--selected", t)
203
+ "aria-pressed": t,
204
+ className: d("tintora-card", "tintora-card--surface", "tintora-card--selectable", t && "tintora-card--selected", n)
136
205
  });
137
206
  }
138
207
  //#endregion
139
208
  //#region src/hooks/useCheckedState.ts
140
- function y({ checked: e, defaultChecked: t = !1, onCheckedChange: n }) {
141
- let [r, i] = s(t), a = e !== void 0;
209
+ function S({ checked: e, defaultChecked: t = !1, onCheckedChange: n }) {
210
+ let [r, i] = l(t), a = e !== void 0;
142
211
  return {
143
212
  checked: a ? e : r,
144
213
  onChange: (e) => {
@@ -148,27 +217,27 @@ function y({ checked: e, defaultChecked: t = !1, onCheckedChange: n }) {
148
217
  }
149
218
  //#endregion
150
219
  //#region src/Checkbox/Checkbox.tsx
151
- function b({ checked: e, defaultChecked: t, onCheckedChange: n, indeterminate: r = !1, className: i, ...s }) {
152
- let u = o(null), f = y({
153
- checked: e,
154
- defaultChecked: t,
155
- onCheckedChange: n
220
+ function C({ checked: n, defaultChecked: r, onCheckedChange: i, indeterminate: a = !1, className: o, ...l }) {
221
+ let u = c(null), f = S({
222
+ checked: n,
223
+ defaultChecked: r,
224
+ onCheckedChange: i
156
225
  });
157
- return a(() => {
158
- u.current && (u.current.indeterminate = r);
159
- }), /* @__PURE__ */ l("span", {
160
- className: d("tintora-checkbox", i),
161
- children: [/* @__PURE__ */ c("input", {
162
- ...s,
226
+ return s(() => {
227
+ u.current && (u.current.indeterminate = a);
228
+ }), /* @__PURE__ */ t("span", {
229
+ className: d("tintora-checkbox", o),
230
+ children: [/* @__PURE__ */ e("input", {
231
+ ...l,
163
232
  ref: u,
164
233
  type: "checkbox",
165
234
  className: "tintora-checkbox__input",
166
235
  checked: f.checked,
167
236
  onChange: f.onChange
168
- }), /* @__PURE__ */ l("span", {
237
+ }), /* @__PURE__ */ t("span", {
169
238
  className: "tintora-checkbox__box",
170
239
  "aria-hidden": "true",
171
- children: [/* @__PURE__ */ c("svg", {
240
+ children: [/* @__PURE__ */ e("svg", {
172
241
  className: "tintora-checkbox__check",
173
242
  width: "14",
174
243
  height: "14",
@@ -177,8 +246,8 @@ function b({ checked: e, defaultChecked: t, onCheckedChange: n, indeterminate: r
177
246
  strokeWidth: "3.2",
178
247
  strokeLinecap: "round",
179
248
  strokeLinejoin: "round",
180
- children: /* @__PURE__ */ c("path", { d: "M5 12.5l4.5 4.5L19 7.5" })
181
- }), /* @__PURE__ */ c("svg", {
249
+ children: /* @__PURE__ */ e("path", { d: "M5 12.5l4.5 4.5L19 7.5" })
250
+ }), /* @__PURE__ */ e("svg", {
182
251
  className: "tintora-checkbox__dash",
183
252
  width: "14",
184
253
  height: "14",
@@ -186,58 +255,58 @@ function b({ checked: e, defaultChecked: t, onCheckedChange: n, indeterminate: r
186
255
  fill: "none",
187
256
  strokeWidth: "3.2",
188
257
  strokeLinecap: "round",
189
- children: /* @__PURE__ */ c("path", { d: "M6 12h12" })
258
+ children: /* @__PURE__ */ e("path", { d: "M6 12h12" })
190
259
  })]
191
260
  })]
192
261
  });
193
262
  }
194
263
  //#endregion
195
264
  //#region src/Chip/Chip.tsx
196
- function x({ children: e, selected: t, className: n, "aria-pressed": r, ...i }) {
197
- return /* @__PURE__ */ c("button", {
198
- ...i,
265
+ function w({ children: t, selected: n, className: r, "aria-pressed": i, ...a }) {
266
+ return /* @__PURE__ */ e("button", {
267
+ ...a,
199
268
  type: "button",
200
- className: d("tintora-chip", n),
201
- "aria-pressed": t ?? r,
202
- children: e
269
+ className: d("tintora-chip", r),
270
+ "aria-pressed": n ?? i,
271
+ children: t
203
272
  });
204
273
  }
205
274
  //#endregion
206
275
  //#region src/Dot/Dot.tsx
207
- function S({ variant: e = "unread", label: t, className: n, ...r }) {
208
- return /* @__PURE__ */ c("span", {
209
- ...r,
210
- className: d("tintora-dot", `tintora-dot--${e}`, n),
211
- role: t ? "img" : void 0,
212
- "aria-label": t,
213
- "aria-hidden": !t || void 0
276
+ function T({ variant: t = "unread", label: n, className: r, ...i }) {
277
+ return /* @__PURE__ */ e("span", {
278
+ ...i,
279
+ className: d("tintora-dot", `tintora-dot--${t}`, r),
280
+ role: n ? "img" : void 0,
281
+ "aria-label": n,
282
+ "aria-hidden": !n || void 0
214
283
  });
215
284
  }
216
285
  //#endregion
217
286
  //#region src/IconButton/IconButton.tsx
218
- var C = {
287
+ var E = {
219
288
  round: "secondary",
220
289
  field: "secondary",
221
290
  nav: "ghost"
222
291
  };
223
- function w({ icon: e, variant: t = "round", size: n, selected: r, className: i, ...a }) {
224
- let o = t === "round" ? n ?? "large" : void 0;
225
- return /* @__PURE__ */ c(g, {
226
- ...a,
227
- variant: C[t],
228
- "aria-current": r ? "page" : void 0,
229
- className: d("tintora-icon-button", `tintora-icon-button--${t}`, o && `tintora-icon-button--${o}`, i),
230
- ...o && { size: o },
231
- children: /* @__PURE__ */ c("span", {
292
+ function D({ icon: t, variant: n = "round", size: r, selected: i, className: a, ...o }) {
293
+ let s = n === "round" ? r ?? "large" : void 0;
294
+ return /* @__PURE__ */ e(y, {
295
+ ...o,
296
+ variant: E[n],
297
+ "aria-current": i ? "page" : void 0,
298
+ className: d("tintora-icon-button", `tintora-icon-button--${n}`, s && `tintora-icon-button--${s}`, a),
299
+ ...s && { size: s },
300
+ children: /* @__PURE__ */ e("span", {
232
301
  className: "tintora-icon-button__icon",
233
302
  "aria-hidden": "true",
234
- children: e
303
+ children: t
235
304
  })
236
305
  });
237
306
  }
238
307
  //#endregion
239
308
  //#region src/Modal/Modal.tsx
240
- var T = () => /* @__PURE__ */ c("svg", {
309
+ var O = () => /* @__PURE__ */ e("svg", {
241
310
  width: "16",
242
311
  height: "16",
243
312
  viewBox: "0 0 24 24",
@@ -245,53 +314,53 @@ var T = () => /* @__PURE__ */ c("svg", {
245
314
  stroke: "currentColor",
246
315
  strokeWidth: "2",
247
316
  strokeLinecap: "round",
248
- children: /* @__PURE__ */ c("path", { d: "M18 6L6 18M6 6l12 12" })
317
+ children: /* @__PURE__ */ e("path", { d: "M18 6L6 18M6 6l12 12" })
249
318
  });
250
- function E({ open: e, onClose: t, title: n, description: a, icon: s, status: u = "info", actions: f, size: p = "md", align: m = "start", role: h = "dialog", closeButton: g = !0, className: _, children: v, ...y }) {
251
- let b = o(null), x = i(), S = i();
252
- return r(() => {
253
- let t = b.current;
254
- t && (e && !t.open ? (t.showModal(), t.querySelector("[data-autofocus]")?.focus()) : !e && t.open && t.close());
255
- }, [e]), /* @__PURE__ */ l("dialog", {
319
+ function k({ open: n, onClose: r, title: i, description: s, icon: l, status: u = "info", actions: f, size: p = "md", align: m = "start", role: h = "dialog", closeButton: g = !0, className: _, children: v, ...y }) {
320
+ let b = c(null), x = o(), S = o();
321
+ return a(() => {
322
+ let e = b.current;
323
+ e && (n && !e.open ? (e.showModal(), e.querySelector("[data-autofocus]")?.focus()) : !n && e.open && e.close());
324
+ }, [n]), /* @__PURE__ */ t("dialog", {
256
325
  ...y,
257
326
  ref: b,
258
327
  role: h,
259
328
  "aria-labelledby": x,
260
- "aria-describedby": a ? S : void 0,
329
+ "aria-describedby": s ? S : void 0,
261
330
  className: d("tintora-modal", `tintora-modal--${p}`, m === "center" && "tintora-modal--center", _),
262
331
  onCancel: (e) => {
263
- e.preventDefault(), t();
332
+ e.preventDefault(), r();
264
333
  },
265
334
  onClick: (e) => {
266
- h === "dialog" && e.target === e.currentTarget && t();
335
+ h === "dialog" && e.target === e.currentTarget && r();
267
336
  },
268
337
  children: [
269
- s && /* @__PURE__ */ c("span", {
338
+ l && /* @__PURE__ */ e("span", {
270
339
  className: d("tintora-modal__icon", `tintora-modal__icon--${u}`),
271
340
  "aria-hidden": "true",
272
- children: s
341
+ children: l
273
342
  }),
274
- /* @__PURE__ */ l("div", {
343
+ /* @__PURE__ */ t("div", {
275
344
  className: "tintora-modal__text",
276
- children: [/* @__PURE__ */ c("h2", {
345
+ children: [/* @__PURE__ */ e("h2", {
277
346
  id: x,
278
347
  className: "tintora-modal__title",
279
- children: n
280
- }), a && /* @__PURE__ */ c("p", {
348
+ children: i
349
+ }), s && /* @__PURE__ */ e("p", {
281
350
  id: S,
282
351
  className: "tintora-modal__description",
283
- children: a
352
+ children: s
284
353
  })]
285
354
  }),
286
- g && /* @__PURE__ */ c(w, {
355
+ g && /* @__PURE__ */ e(D, {
287
356
  className: "tintora-modal__close",
288
357
  size: "medium",
289
358
  "aria-label": "Close",
290
- icon: /* @__PURE__ */ c(T, {}),
291
- onClick: t
359
+ icon: /* @__PURE__ */ e(O, {}),
360
+ onClick: r
292
361
  }),
293
362
  v,
294
- f && /* @__PURE__ */ c("div", {
363
+ f && /* @__PURE__ */ e("div", {
295
364
  className: "tintora-modal__actions",
296
365
  children: f
297
366
  })
@@ -300,17 +369,17 @@ function E({ open: e, onClose: t, title: n, description: a, icon: s, status: u =
300
369
  }
301
370
  //#endregion
302
371
  //#region src/hooks/useLatest.ts
303
- function D(e) {
304
- let t = o(e);
305
- return r(() => {
372
+ function A(e) {
373
+ let t = c(e);
374
+ return a(() => {
306
375
  t.current = e;
307
376
  }, [e]), t;
308
377
  }
309
378
  //#endregion
310
379
  //#region src/hooks/useEscapeKey.ts
311
- function O(e, t) {
312
- let n = D(t);
313
- r(() => {
380
+ function j(e, t) {
381
+ let n = A(t);
382
+ a(() => {
314
383
  if (!e) return;
315
384
  let t = (e) => {
316
385
  e.key === "Escape" && n.current();
@@ -320,36 +389,36 @@ function O(e, t) {
320
389
  }
321
390
  //#endregion
322
391
  //#region src/hooks/useOutsidePress.ts
323
- function k(e, t, n) {
324
- let i = D(n);
325
- r(() => {
392
+ function M(e, t, n) {
393
+ let r = A(n);
394
+ a(() => {
326
395
  if (!e) return;
327
396
  let n = (e) => {
328
- t.current?.contains(e.target) || i.current();
397
+ t.current?.contains(e.target) || r.current();
329
398
  };
330
399
  return document.addEventListener("pointerdown", n), () => document.removeEventListener("pointerdown", n);
331
400
  }, [
332
401
  e,
333
402
  t,
334
- i
403
+ r
335
404
  ]);
336
405
  }
337
406
  //#endregion
338
407
  //#region src/hooks/useTopLayerPosition.ts
339
- function A(e, t, n, r) {
340
- let [i, o] = s(null);
341
- return a(() => {
408
+ function N(e, t, n, r) {
409
+ let [i, a] = l(null);
410
+ return s(() => {
342
411
  let r = t.current;
343
412
  if (!e || !r) {
344
- o(null);
413
+ a(null);
345
414
  return;
346
415
  }
347
416
  r.showPopover();
348
- let i = () => o(n()), a = (e) => {
417
+ let i = () => a(n()), o = (e) => {
349
418
  r.contains(e.target) || i();
350
419
  };
351
- return i(), window.addEventListener("scroll", a, !0), window.addEventListener("resize", i), () => {
352
- window.removeEventListener("scroll", a, !0), window.removeEventListener("resize", i);
420
+ return i(), window.addEventListener("scroll", o, !0), window.addEventListener("resize", i), () => {
421
+ window.removeEventListener("scroll", o, !0), window.removeEventListener("resize", i);
353
422
  };
354
423
  }, [
355
424
  e,
@@ -359,17 +428,17 @@ function A(e, t, n, r) {
359
428
  }
360
429
  //#endregion
361
430
  //#region src/utils/placement.ts
362
- var j = {
431
+ var P = {
363
432
  gap: 10,
364
433
  margin: 8,
365
434
  arrowInset: 12
366
- }, M = {
435
+ }, F = {
367
436
  top: "bottom",
368
437
  bottom: "top",
369
438
  left: "right",
370
439
  right: "left"
371
- }, N = (e, t, n) => Math.min(Math.max(e, t), Math.max(t, n));
372
- function P(e, t, n, r, { gap: i, margin: a }) {
440
+ }, I = (e, t, n) => Math.min(Math.max(e, t), Math.max(t, n));
441
+ function L(e, t, n, r, { gap: i, margin: a }) {
373
442
  let o = (t) => {
374
443
  switch (t) {
375
444
  case "top": return e.top;
@@ -378,16 +447,16 @@ function P(e, t, n, r, { gap: i, margin: a }) {
378
447
  case "right": return r.width - e.right;
379
448
  }
380
449
  }, s = (n === "top" || n === "bottom" ? t.height : t.width) + i + a, c = o(n);
381
- return c >= s || o(M[n]) <= c ? n : M[n];
450
+ return c >= s || o(F[n]) <= c ? n : F[n];
382
451
  }
383
- function F(e, t, n, r = {
452
+ function R(e, t, n, r = {
384
453
  width: window.innerWidth,
385
454
  height: window.innerHeight
386
455
  }, i = {}) {
387
456
  let a = {
388
- ...j,
457
+ ...P,
389
458
  ...i
390
- }, { gap: o, margin: s, arrowInset: c } = a, l = P(e, t, n, r, a), u = l === "top" || l === "bottom", d, f;
459
+ }, { gap: o, margin: s, arrowInset: c } = a, l = L(e, t, n, r, a), u = l === "top" || l === "bottom", d, f;
391
460
  switch (l) {
392
461
  case "top":
393
462
  d = e.y - t.height - o, f = e.x + e.width / 2 - t.width / 2;
@@ -400,18 +469,18 @@ function F(e, t, n, r = {
400
469
  break;
401
470
  case "right": d = e.y + e.height / 2 - t.height / 2, f = e.x + e.width + o;
402
471
  }
403
- u ? f = N(f, s, r.width - t.width - s) : d = N(d, s, r.height - t.height - s);
472
+ u ? f = I(f, s, r.width - t.width - s) : d = I(d, s, r.height - t.height - s);
404
473
  let p = u ? e.x + e.width / 2 - f : e.y + e.height / 2 - d, m = u ? t.width : t.height;
405
474
  return {
406
475
  top: d,
407
476
  left: f,
408
477
  placement: l,
409
- arrowOffset: N(p, c, m - c)
478
+ arrowOffset: I(p, c, m - c)
410
479
  };
411
480
  }
412
481
  //#endregion
413
482
  //#region src/Popover/Popover.tsx
414
- var I = [
483
+ var z = [
415
484
  "button:not([disabled])",
416
485
  "[href]",
417
486
  "input:not([disabled])",
@@ -419,14 +488,14 @@ var I = [
419
488
  "textarea:not([disabled])",
420
489
  "[tabindex]:not([tabindex=\"-1\"])"
421
490
  ].join(", ");
422
- function L({ open: t, onOpenChange: n, trigger: s, title: u, children: f, role: p = "dialog", size: m = "md", placement: h = "bottom", className: g }) {
423
- let _ = i(), v = o(null), y = o(null), b = o(!1), x = () => n(!1);
424
- O(t, x), k(t, v, x);
491
+ function B({ open: r, onOpenChange: i, trigger: l, title: u, children: f, role: p = "dialog", size: m = "md", placement: h = "bottom", className: g }) {
492
+ let _ = o(), v = c(null), y = c(null), b = c(!1), x = () => i(!1);
493
+ j(r, x), M(r, v, x);
425
494
  let S = (e) => {
426
- s.props.onClick?.(e), e.defaultPrevented || n(!t);
427
- }, C = A(t, y, () => {
495
+ l.props.onClick?.(e), e.defaultPrevented || i(!r);
496
+ }, C = N(r, y, () => {
428
497
  let e = y.current, t = v.current?.firstElementChild;
429
- return !e || !t ? null : F(t.getBoundingClientRect(), {
498
+ return !e || !t ? null : R(t.getBoundingClientRect(), {
430
499
  width: e.offsetWidth,
431
500
  height: e.offsetHeight
432
501
  }, h, void 0, { gap: 12 });
@@ -439,24 +508,24 @@ function L({ open: t, onOpenChange: n, trigger: s, title: u, children: f, role:
439
508
  left: C.left,
440
509
  "--tintora-popover-arrow-offset": `${C.arrowOffset}px`
441
510
  } : { visibility: "hidden" }, T = C !== null;
442
- return a(() => {
511
+ return s(() => {
443
512
  let e = y.current;
444
- t && T && e && (e.querySelector("[data-autofocus]") ?? e.querySelector(I) ?? e).focus();
445
- }, [t, T]), r(() => {
446
- if (b.current && !t) {
513
+ r && T && e && (e.querySelector("[data-autofocus]") ?? e.querySelector(z) ?? e).focus();
514
+ }, [r, T]), a(() => {
515
+ if (b.current && !r) {
447
516
  let e = document.activeElement;
448
517
  (!e || e === document.body) && v.current?.querySelector("*")?.focus();
449
518
  }
450
- b.current = t;
451
- }, [t]), /* @__PURE__ */ l("span", {
519
+ b.current = r;
520
+ }, [r]), /* @__PURE__ */ t("span", {
452
521
  ref: v,
453
522
  className: "tintora-popover-root",
454
- children: [e(s, {
523
+ children: [n(l, {
455
524
  "aria-haspopup": "dialog",
456
- "aria-expanded": t,
457
- "aria-controls": t ? _ : void 0,
525
+ "aria-expanded": r,
526
+ "aria-controls": r ? _ : void 0,
458
527
  onClick: S
459
- }), t && /* @__PURE__ */ c("div", {
528
+ }), r && /* @__PURE__ */ e("div", {
460
529
  id: _,
461
530
  ref: y,
462
531
  role: p,
@@ -471,31 +540,31 @@ function L({ open: t, onOpenChange: n, trigger: s, title: u, children: f, role:
471
540
  }
472
541
  //#endregion
473
542
  //#region src/ProgressBar/ProgressBar.tsx
474
- function R({ title: e, progress: t, indeterminate: n, valueLabel: r, className: a, "aria-label": o }) {
475
- let s = i(), u = n ? void 0 : Math.min(100, Math.max(0, Number.isFinite(t) ? t : 0)), f = u === 100, p = r ?? (n ? "Indeterminate" : `${u}%`);
476
- return /* @__PURE__ */ l("div", {
477
- className: d("tintora-progress-bar", a),
478
- children: [e && /* @__PURE__ */ l("div", {
543
+ function V({ title: n, progress: r, indeterminate: i, valueLabel: a, className: s, "aria-label": c }) {
544
+ let l = o(), u = i ? void 0 : Math.min(100, Math.max(0, Number.isFinite(r) ? r : 0)), f = u === 100, p = a ?? (i ? "Indeterminate" : `${u}%`);
545
+ return /* @__PURE__ */ t("div", {
546
+ className: d("tintora-progress-bar", s),
547
+ children: [n && /* @__PURE__ */ t("div", {
479
548
  className: "tintora-progress-bar__header",
480
- children: [/* @__PURE__ */ c("span", {
481
- id: s,
482
- children: e
483
- }), /* @__PURE__ */ c("span", {
549
+ children: [/* @__PURE__ */ e("span", {
550
+ id: l,
551
+ children: n
552
+ }), /* @__PURE__ */ e("span", {
484
553
  className: "tintora-progress-bar__value",
485
554
  children: p
486
555
  })]
487
- }), /* @__PURE__ */ c("div", {
556
+ }), /* @__PURE__ */ e("div", {
488
557
  role: "progressbar",
489
- "aria-label": o,
490
- "aria-labelledby": e ? s : void 0,
491
- "aria-valuemin": n ? void 0 : 0,
492
- "aria-valuemax": n ? void 0 : 100,
558
+ "aria-label": c,
559
+ "aria-labelledby": n ? l : void 0,
560
+ "aria-valuemin": i ? void 0 : 0,
561
+ "aria-valuemax": i ? void 0 : 100,
493
562
  "aria-valuenow": u,
494
- "aria-valuetext": r,
563
+ "aria-valuetext": a,
495
564
  className: "tintora-progress-bar__track",
496
- children: /* @__PURE__ */ c("div", {
565
+ children: /* @__PURE__ */ e("div", {
497
566
  className: d("tintora-progress-bar__fill", {
498
- "tintora-progress-bar__fill--indeterminate": n,
567
+ "tintora-progress-bar__fill--indeterminate": i,
499
568
  "tintora-progress-bar__fill--complete": f
500
569
  }),
501
570
  style: u === void 0 ? void 0 : { width: `${u}%` }
@@ -505,28 +574,28 @@ function R({ title: e, progress: t, indeterminate: n, valueLabel: r, className:
505
574
  }
506
575
  //#endregion
507
576
  //#region src/Radio/RadioContext.ts
508
- var z = t(null);
509
- function B() {
510
- let e = n(z);
577
+ var H = r(null);
578
+ function U() {
579
+ let e = i(H);
511
580
  if (!e) throw Error("Radio must be rendered inside a RadioGroup");
512
581
  return e;
513
582
  }
514
583
  //#endregion
515
584
  //#region src/Radio/Radio.tsx
516
- function V({ value: e, className: t, disabled: n, ...r }) {
517
- let i = B();
518
- return /* @__PURE__ */ l("span", {
519
- className: d("tintora-radio", t),
520
- children: [/* @__PURE__ */ c("input", {
521
- ...r,
585
+ function W({ value: n, className: r, disabled: i, ...a }) {
586
+ let o = U();
587
+ return /* @__PURE__ */ t("span", {
588
+ className: d("tintora-radio", r),
589
+ children: [/* @__PURE__ */ e("input", {
590
+ ...a,
522
591
  type: "radio",
523
592
  className: "tintora-radio__input",
524
- name: i.name,
525
- value: e,
526
- checked: i.value === e,
527
- disabled: n || i.disabled,
528
- onChange: () => i.select(e)
529
- }), /* @__PURE__ */ c("span", {
593
+ name: o.name,
594
+ value: n,
595
+ checked: o.value === n,
596
+ disabled: i || o.disabled,
597
+ onChange: () => o.select(n)
598
+ }), /* @__PURE__ */ e("span", {
530
599
  className: "tintora-radio__circle",
531
600
  "aria-hidden": "true"
532
601
  })]
@@ -534,30 +603,30 @@ function V({ value: e, className: t, disabled: n, ...r }) {
534
603
  }
535
604
  //#endregion
536
605
  //#region src/Radio/RadioGroup.tsx
537
- function H({ value: e, defaultValue: t, onValueChange: n, disabled: r = !1, name: a, className: o, ...l }) {
538
- let u = i(), [f, p] = s(t ?? null), m = e !== void 0, h = m ? e : f;
539
- return /* @__PURE__ */ c(z.Provider, {
606
+ function G({ value: t, defaultValue: n, onValueChange: r, disabled: i = !1, name: a, className: s, ...c }) {
607
+ let u = o(), [f, p] = l(n ?? null), m = t !== void 0, h = m ? t : f;
608
+ return /* @__PURE__ */ e(H.Provider, {
540
609
  value: {
541
610
  name: a ?? u,
542
611
  value: h,
543
612
  select: (e) => {
544
- e !== h && (m || p(e), n?.(e));
613
+ e !== h && (m || p(e), r?.(e));
545
614
  },
546
- disabled: r
615
+ disabled: i
547
616
  },
548
- children: /* @__PURE__ */ c("div", {
549
- ...l,
617
+ children: /* @__PURE__ */ e("div", {
618
+ ...c,
550
619
  role: "radiogroup",
551
- className: d("tintora-radio-group", o)
620
+ className: d("tintora-radio-group", s)
552
621
  })
553
622
  });
554
623
  }
555
624
  //#endregion
556
625
  //#region src/SearchInput/SearchInput.tsx
557
- function U({ className: e, disabled: t, ...n }) {
558
- return /* @__PURE__ */ l("label", {
559
- className: d("tintora-search-input", t && "tintora-search-input--disabled", e),
560
- children: [/* @__PURE__ */ l("svg", {
626
+ function K({ className: n, disabled: r, ...i }) {
627
+ return /* @__PURE__ */ t("label", {
628
+ className: d("tintora-search-input", r && "tintora-search-input--disabled", n),
629
+ children: [/* @__PURE__ */ t("svg", {
561
630
  className: "tintora-search-input__icon",
562
631
  viewBox: "0 0 24 24",
563
632
  fill: "none",
@@ -565,107 +634,107 @@ function U({ className: e, disabled: t, ...n }) {
565
634
  strokeWidth: "2",
566
635
  strokeLinecap: "round",
567
636
  "aria-hidden": "true",
568
- children: [/* @__PURE__ */ c("circle", {
637
+ children: [/* @__PURE__ */ e("circle", {
569
638
  cx: "11",
570
639
  cy: "11",
571
640
  r: "7"
572
- }), /* @__PURE__ */ c("path", { d: "M20 20l-3.5-3.5" })]
573
- }), /* @__PURE__ */ c("input", {
574
- ...n,
641
+ }), /* @__PURE__ */ e("path", { d: "M20 20l-3.5-3.5" })]
642
+ }), /* @__PURE__ */ e("input", {
643
+ ...i,
575
644
  type: "search",
576
- disabled: t,
645
+ disabled: r,
577
646
  className: "tintora-search-input__input"
578
647
  })]
579
648
  });
580
649
  }
581
650
  //#endregion
582
651
  //#region src/Select/SelectContext.ts
583
- var W = t(null), G = () => {
584
- let e = n(W);
652
+ var q = r(null), J = () => {
653
+ let e = i(q);
585
654
  if (!e) throw Error("SelectOption must be rendered inside a Select");
586
655
  return e;
587
656
  };
588
657
  //#endregion
589
658
  //#region src/Select/SelectOption.tsx
590
- function ee({ label: e, value: t, disabled: n }) {
591
- let { select: r, activate: i, optionId: a, value: o, activeValue: s } = G();
592
- return /* @__PURE__ */ c("div", {
593
- id: a(t),
659
+ function ee({ label: t, value: n, disabled: r }) {
660
+ let { select: i, activate: a, optionId: o, value: s, activeValue: c } = J();
661
+ return /* @__PURE__ */ e("div", {
662
+ id: o(n),
594
663
  role: "option",
595
- "aria-selected": o === t,
596
- "aria-disabled": n || void 0,
597
- className: d("tintora-select__option", s === t && "tintora-select__option--active"),
598
- onClick: () => r(t),
599
- onMouseMove: () => !n && i(t),
600
- children: e
664
+ "aria-selected": s === n,
665
+ "aria-disabled": r || void 0,
666
+ className: d("tintora-select__option", c === n && "tintora-select__option--active"),
667
+ onClick: () => i(n),
668
+ onMouseMove: () => !r && a(n),
669
+ children: t
601
670
  });
602
671
  }
603
672
  //#endregion
604
673
  //#region src/Select/Select.tsx
605
- var K = 4;
606
- function q({ defaultValue: e, options: t, disabled: n, value: a, placeholder: u, onValueChange: f, name: p, className: m, onClick: h, onKeyDown: g, onKeyUp: _, "aria-label": v, ...y }) {
607
- let b = i(), x = o(null), S = o(null), C = o(null), [w, T] = s(e ?? null), [E, D] = s(!1), [O, j] = s(-1), M = a !== void 0, N = M ? a : w, P = t.findIndex((e) => e.value === N), F = (e) => t[e]?.disabled !== !0, I = () => t.findIndex((e, t) => F(t)), L = (e, n) => {
608
- for (let r = e + n; r >= 0 && r < t.length; r += n) if (F(r)) return r;
674
+ var Y = 4;
675
+ function X({ defaultValue: n, options: r, disabled: i, value: s, placeholder: u, onValueChange: f, name: p, className: m, onClick: h, onKeyDown: g, onKeyUp: _, "aria-label": v, ...y }) {
676
+ let b = o(), x = c(null), S = c(null), C = c(null), [w, T] = l(n ?? null), [E, D] = l(!1), [O, k] = l(-1), A = s !== void 0, j = A ? s : w, P = r.findIndex((e) => e.value === j), F = (e) => r[e]?.disabled !== !0, I = () => r.findIndex((e, t) => F(t)), L = (e, t) => {
677
+ for (let n = e + t; n >= 0 && n < r.length; n += t) if (F(n)) return n;
609
678
  return e;
610
679
  }, R = () => {
611
- let e = L(t.length, -1);
612
- return e === t.length ? -1 : e;
613
- }, z = (e) => t.findIndex((t) => t.value === e), B = () => {
614
- j(P >= 0 && F(P) ? P : I()), D(!0);
680
+ let e = L(r.length, -1);
681
+ return e === r.length ? -1 : e;
682
+ }, z = (e) => r.findIndex((t) => t.value === e), B = () => {
683
+ k(P >= 0 && F(P) ? P : I()), D(!0);
615
684
  }, V = () => D(!1), H = (e) => {
616
685
  let t = z(e);
617
- t < 0 || !F(t) || (V(), e !== N && (M || T(e), f?.(e)));
686
+ t < 0 || !F(t) || (V(), e !== j && (A || T(e), f?.(e)));
618
687
  }, U = (e) => {
619
688
  if (g?.(e), e.defaultPrevented) return;
620
- let { key: n } = e;
621
- if (n === "Tab") return V();
689
+ let { key: t } = e;
690
+ if (t === "Tab") return V();
622
691
  if (!E) {
623
692
  [
624
693
  "Enter",
625
694
  " ",
626
695
  "ArrowDown",
627
696
  "ArrowUp"
628
- ].includes(n) && (e.preventDefault(), B());
697
+ ].includes(t) && (e.preventDefault(), B());
629
698
  return;
630
699
  }
631
- let r = {
700
+ let n = {
632
701
  ArrowDown: () => O < 0 ? I() : L(O, 1),
633
702
  ArrowUp: () => O < 0 ? I() : L(O, -1),
634
703
  Home: I,
635
704
  End: R
636
705
  };
637
- n in r ? (e.preventDefault(), j(r[n]())) : n === "Enter" || n === " " ? (e.preventDefault(), O >= 0 ? H(t[O].value) : V()) : n === "Escape" && (e.preventDefault(), V());
638
- }, G = (e) => {
706
+ t in n ? (e.preventDefault(), k(n[t]())) : t === "Enter" || t === " " ? (e.preventDefault(), O >= 0 ? H(r[O].value) : V()) : t === "Escape" && (e.preventDefault(), V());
707
+ }, W = (e) => {
639
708
  _?.(e), e.key === " " && e.preventDefault();
640
- }, q = A(E, C, () => {
709
+ }, G = N(E, C, () => {
641
710
  let e = C.current, t = S.current;
642
711
  if (!e || !t) return null;
643
- let n = t.getBoundingClientRect(), r = e.offsetHeight, i = n.bottom + K + r <= window.innerHeight, a = n.top - K - r >= 0;
712
+ let n = t.getBoundingClientRect(), r = e.offsetHeight, i = n.bottom + Y + r <= window.innerHeight, a = n.top - Y - r >= 0;
644
713
  return {
645
- top: i || !a ? n.bottom + K : n.top - K - r,
714
+ top: i || !a ? n.bottom + Y : n.top - Y - r,
646
715
  left: n.left,
647
716
  minWidth: n.width
648
717
  };
649
- }, []), J = (e) => {
718
+ }, []), K = (e) => {
650
719
  h?.(e), !e.defaultPrevented && (E ? V() : B());
651
720
  };
652
- k(E, x, V), r(() => {
721
+ M(E, x, V), a(() => {
653
722
  E && O >= 0 && C.current?.children.item(O)?.scrollIntoView?.({ block: "nearest" });
654
723
  }, [E, O]);
655
- let Y = (e) => `${b}-option-${z(e)}`, X = E ? t[O]?.value ?? null : null, Z = t[P]?.label;
656
- return /* @__PURE__ */ c(W.Provider, {
724
+ let J = (e) => `${b}-option-${z(e)}`, X = E ? r[O]?.value ?? null : null, Z = r[P]?.label;
725
+ return /* @__PURE__ */ e(q.Provider, {
657
726
  value: {
658
- value: N,
727
+ value: j,
659
728
  activeValue: X,
660
729
  select: H,
661
- optionId: Y,
662
- activate: (e) => j(z(e))
730
+ optionId: J,
731
+ activate: (e) => k(z(e))
663
732
  },
664
- children: /* @__PURE__ */ l("div", {
733
+ children: /* @__PURE__ */ t("div", {
665
734
  ref: x,
666
735
  className: "tintora-select",
667
736
  children: [
668
- /* @__PURE__ */ l("button", {
737
+ /* @__PURE__ */ t("button", {
669
738
  ...y,
670
739
  ref: S,
671
740
  type: "button",
@@ -674,16 +743,16 @@ function q({ defaultValue: e, options: t, disabled: n, value: a, placeholder: u,
674
743
  "aria-haspopup": "listbox",
675
744
  "aria-expanded": E,
676
745
  "aria-controls": E ? b : void 0,
677
- "aria-activedescendant": X === null ? void 0 : Y(X),
678
- disabled: n,
746
+ "aria-activedescendant": X === null ? void 0 : J(X),
747
+ disabled: i,
679
748
  className: d("tintora-select__trigger", m),
680
- onClick: J,
749
+ onClick: K,
681
750
  onKeyDown: U,
682
- onKeyUp: G,
683
- children: [/* @__PURE__ */ c("span", {
751
+ onKeyUp: W,
752
+ children: [/* @__PURE__ */ e("span", {
684
753
  className: d("tintora-select__value", Z === void 0 && "tintora-select__value--placeholder"),
685
754
  children: Z ?? u
686
- }), /* @__PURE__ */ c("svg", {
755
+ }), /* @__PURE__ */ e("svg", {
687
756
  className: "tintora-select__chevron",
688
757
  width: "10",
689
758
  height: "10",
@@ -694,25 +763,25 @@ function q({ defaultValue: e, options: t, disabled: n, value: a, placeholder: u,
694
763
  strokeLinecap: "round",
695
764
  strokeLinejoin: "round",
696
765
  "aria-hidden": "true",
697
- children: /* @__PURE__ */ c("path", { d: "M6 9l6 6 6-6" })
766
+ children: /* @__PURE__ */ e("path", { d: "M6 9l6 6 6-6" })
698
767
  })]
699
768
  }),
700
- E && /* @__PURE__ */ c("div", {
769
+ E && /* @__PURE__ */ e("div", {
701
770
  ref: C,
702
771
  id: b,
703
772
  role: "listbox",
704
773
  "aria-label": v,
705
774
  popover: "manual",
706
775
  className: "tintora-select__menu",
707
- style: q ?? {},
776
+ style: G ?? {},
708
777
  onMouseDown: (e) => e.preventDefault(),
709
- children: t.map((e) => /* @__PURE__ */ c(ee, { ...e }, e.value))
778
+ children: r.map((t) => /* @__PURE__ */ e(ee, { ...t }, t.value))
710
779
  }),
711
- p && /* @__PURE__ */ c("input", {
780
+ p && /* @__PURE__ */ e("input", {
712
781
  type: "hidden",
713
782
  name: p,
714
- value: N ?? "",
715
- disabled: n
783
+ value: j ?? "",
784
+ disabled: i
716
785
  })
717
786
  ]
718
787
  })
@@ -720,39 +789,39 @@ function q({ defaultValue: e, options: t, disabled: n, value: a, placeholder: u,
720
789
  }
721
790
  //#endregion
722
791
  //#region src/Skeleton/Skeleton.tsx
723
- function J({ width: e, height: t, className: n, style: r, ...i }) {
724
- let a = {
725
- ...e !== void 0 && { width: e },
726
- ...t !== void 0 && { height: t }
792
+ function Z({ width: t, height: n, className: r, style: i, ...a }) {
793
+ let o = {
794
+ ...t !== void 0 && { width: t },
795
+ ...n !== void 0 && { height: n }
727
796
  };
728
- return /* @__PURE__ */ c("span", {
729
- ...i,
797
+ return /* @__PURE__ */ e("span", {
798
+ ...a,
730
799
  "aria-hidden": "true",
731
- className: d("tintora-skeleton", n),
800
+ className: d("tintora-skeleton", r),
732
801
  style: {
733
- ...a,
734
- ...r
802
+ ...o,
803
+ ...i
735
804
  }
736
805
  });
737
806
  }
738
807
  //#endregion
739
808
  //#region src/Switch/Switch.tsx
740
- function Y({ checked: e, defaultChecked: t, onCheckedChange: n, className: r, ...i }) {
741
- let a = y({
742
- checked: e,
743
- defaultChecked: t,
744
- onCheckedChange: n
809
+ function te({ checked: n, defaultChecked: r, onCheckedChange: i, className: a, ...o }) {
810
+ let s = S({
811
+ checked: n,
812
+ defaultChecked: r,
813
+ onCheckedChange: i
745
814
  });
746
- return /* @__PURE__ */ l("span", {
747
- className: d("tintora-switch", r),
748
- children: [/* @__PURE__ */ c("input", {
749
- ...i,
815
+ return /* @__PURE__ */ t("span", {
816
+ className: d("tintora-switch", a),
817
+ children: [/* @__PURE__ */ e("input", {
818
+ ...o,
750
819
  type: "checkbox",
751
820
  role: "switch",
752
821
  className: "tintora-switch__input",
753
- checked: a.checked,
754
- onChange: a.onChange
755
- }), /* @__PURE__ */ c("span", {
822
+ checked: s.checked,
823
+ onChange: s.onChange
824
+ }), /* @__PURE__ */ e("span", {
756
825
  className: "tintora-switch__track",
757
826
  "aria-hidden": "true"
758
827
  })]
@@ -760,36 +829,36 @@ function Y({ checked: e, defaultChecked: t, onCheckedChange: n, className: r, ..
760
829
  }
761
830
  //#endregion
762
831
  //#region src/Tag/Tag.tsx
763
- function X({ children: e, className: t, variant: n = "neutral", size: r = "medium", ...i }) {
764
- return /* @__PURE__ */ c("span", {
765
- ...i,
766
- className: d("tintora-tag", `tintora-tag--${n}`, `tintora-tag--${r}`, t),
767
- children: e
832
+ function ne({ children: t, className: n, variant: r = "neutral", size: i = "medium", ...a }) {
833
+ return /* @__PURE__ */ e("span", {
834
+ ...a,
835
+ className: d("tintora-tag", `tintora-tag--${r}`, `tintora-tag--${i}`, n),
836
+ children: t
768
837
  });
769
838
  }
770
839
  //#endregion
771
840
  //#region src/TextField/TextField.tsx
772
- function Z({ label: e, hint: t, error: n, id: r, className: a, disabled: o, "aria-describedby": s, "aria-invalid": u, ...f }) {
773
- let p = i(), m = r ?? p, h = `${m}-message`, g = n ?? t;
774
- return /* @__PURE__ */ l("div", {
775
- className: d("tintora-textfield", o && "tintora-textfield--disabled", a),
841
+ function re({ label: n, hint: r, error: i, id: a, className: s, disabled: c, "aria-describedby": l, "aria-invalid": u, ...f }) {
842
+ let p = o(), m = a ?? p, h = `${m}-message`, g = i ?? r;
843
+ return /* @__PURE__ */ t("div", {
844
+ className: d("tintora-textfield", c && "tintora-textfield--disabled", s),
776
845
  children: [
777
- /* @__PURE__ */ c("label", {
846
+ /* @__PURE__ */ e("label", {
778
847
  htmlFor: m,
779
848
  className: "tintora-textfield__label",
780
- children: e
849
+ children: n
781
850
  }),
782
- /* @__PURE__ */ c("input", {
851
+ /* @__PURE__ */ e("input", {
783
852
  ...f,
784
853
  id: m,
785
- disabled: o,
854
+ disabled: c,
786
855
  className: "tintora-textfield__input",
787
- "aria-invalid": n ? !0 : u,
788
- "aria-describedby": d(g && h, s) || void 0
856
+ "aria-invalid": i ? !0 : u,
857
+ "aria-describedby": d(g && h, l) || void 0
789
858
  }),
790
- g && /* @__PURE__ */ c("span", {
859
+ g && /* @__PURE__ */ e("span", {
791
860
  id: h,
792
- className: d("tintora-textfield__hint", n && "tintora-textfield__hint--error"),
861
+ className: d("tintora-textfield__hint", i && "tintora-textfield__hint--error"),
793
862
  children: g
794
863
  })
795
864
  ]
@@ -797,8 +866,8 @@ function Z({ label: e, hint: t, error: n, id: r, className: a, disabled: o, "ari
797
866
  }
798
867
  //#endregion
799
868
  //#region src/Toast/ToastIcons.tsx
800
- function te() {
801
- return /* @__PURE__ */ c("svg", {
869
+ function ie() {
870
+ return /* @__PURE__ */ e("svg", {
802
871
  width: "20",
803
872
  height: "20",
804
873
  viewBox: "0 0 24 24",
@@ -809,11 +878,11 @@ function te() {
809
878
  strokeLinejoin: "round",
810
879
  "aria-hidden": "true",
811
880
  style: { flex: "0 0 auto" },
812
- children: /* @__PURE__ */ c("path", { d: "M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM8 12.5l2.7 2.7L16 9.8" })
881
+ children: /* @__PURE__ */ e("path", { d: "M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM8 12.5l2.7 2.7L16 9.8" })
813
882
  });
814
883
  }
815
- function ne() {
816
- return /* @__PURE__ */ c("svg", {
884
+ function ae() {
885
+ return /* @__PURE__ */ e("svg", {
817
886
  width: "20",
818
887
  height: "20",
819
888
  viewBox: "0 0 24 24",
@@ -824,11 +893,11 @@ function ne() {
824
893
  strokeLinejoin: "round",
825
894
  "aria-hidden": "true",
826
895
  style: { flex: "0 0 auto" },
827
- children: /* @__PURE__ */ c("path", { d: "M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM15 9l-6 6M9 9l6 6" })
896
+ children: /* @__PURE__ */ e("path", { d: "M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM15 9l-6 6M9 9l6 6" })
828
897
  });
829
898
  }
830
- function re() {
831
- return /* @__PURE__ */ c("svg", {
899
+ function oe() {
900
+ return /* @__PURE__ */ e("svg", {
832
901
  width: "20",
833
902
  height: "20",
834
903
  viewBox: "0 0 24 24",
@@ -839,11 +908,11 @@ function re() {
839
908
  strokeLinejoin: "round",
840
909
  "aria-hidden": "true",
841
910
  style: { flex: "0 0 auto" },
842
- children: /* @__PURE__ */ c("path", { d: "M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM12 16v-4M12 8h.01" })
911
+ children: /* @__PURE__ */ e("path", { d: "M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM12 16v-4M12 8h.01" })
843
912
  });
844
913
  }
845
- function ie() {
846
- return /* @__PURE__ */ c("svg", {
914
+ function se() {
915
+ return /* @__PURE__ */ e("svg", {
847
916
  width: "20",
848
917
  height: "20",
849
918
  viewBox: "0 0 24 24",
@@ -854,11 +923,11 @@ function ie() {
854
923
  strokeLinejoin: "round",
855
924
  "aria-hidden": "true",
856
925
  style: { flex: "0 0 auto" },
857
- children: /* @__PURE__ */ c("path", { d: "M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01" })
926
+ children: /* @__PURE__ */ e("path", { d: "M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01" })
858
927
  });
859
928
  }
860
- function ae() {
861
- return /* @__PURE__ */ c("svg", {
929
+ function ce() {
930
+ return /* @__PURE__ */ e("svg", {
862
931
  width: "14",
863
932
  height: "14",
864
933
  viewBox: "0 0 24 24",
@@ -867,34 +936,34 @@ function ae() {
867
936
  strokeWidth: "2.2",
868
937
  strokeLinecap: "round",
869
938
  "aria-hidden": "true",
870
- children: /* @__PURE__ */ c("path", { d: "M18 6L6 18M6 6l12 12" })
939
+ children: /* @__PURE__ */ e("path", { d: "M18 6L6 18M6 6l12 12" })
871
940
  });
872
941
  }
873
942
  //#endregion
874
943
  //#region src/Toast/Toast.tsx
875
944
  var Q = {
876
- success: /* @__PURE__ */ c(te, {}),
877
- error: /* @__PURE__ */ c(ne, {}),
878
- info: /* @__PURE__ */ c(re, {}),
879
- warning: /* @__PURE__ */ c(ie, {})
945
+ success: /* @__PURE__ */ e(ie, {}),
946
+ error: /* @__PURE__ */ e(ae, {}),
947
+ info: /* @__PURE__ */ e(oe, {}),
948
+ warning: /* @__PURE__ */ e(se, {})
880
949
  };
881
- function oe({ status: e, children: t, action: n, onDismiss: i, duration: a = 5e3, timerBar: u = !1, className: f, ...p }) {
882
- let [m, h] = s(!1), [g, _] = s(!1), v = m || g, y = D(i), b = o(a);
883
- r(() => {
884
- b.current = a;
885
- }, [a]), r(() => {
886
- if (a <= 0 || v) return;
950
+ function le({ status: n, children: r, action: i, onDismiss: o, duration: s = 5e3, timerBar: u = !1, className: f, ...p }) {
951
+ let [m, h] = l(!1), [g, _] = l(!1), v = m || g, y = A(o), b = c(s);
952
+ a(() => {
953
+ b.current = s;
954
+ }, [s]), a(() => {
955
+ if (s <= 0 || v) return;
887
956
  let e = Date.now(), t = setTimeout(() => y.current(), b.current);
888
957
  return () => {
889
958
  clearTimeout(t), b.current -= Date.now() - e;
890
959
  };
891
960
  }, [
892
- a,
961
+ s,
893
962
  v,
894
963
  y
895
964
  ]);
896
- let x = u && a > 0, S = { "--tintora-toast-animation-duration": `${a}ms` };
897
- return /* @__PURE__ */ l("div", {
965
+ let x = u && s > 0, S = { "--tintora-toast-animation-duration": `${s}ms` };
966
+ return /* @__PURE__ */ t("div", {
898
967
  ...p,
899
968
  role: "status",
900
969
  className: d("tintora-toast", x && "tintora-toast--timer", v && "tintora-toast--paused", f),
@@ -911,25 +980,25 @@ function oe({ status: e, children: t, action: n, onDismiss: i, duration: a = 5e3
911
980
  p.onBlur?.(e), e.currentTarget.contains(e.relatedTarget) || _(!1);
912
981
  },
913
982
  children: [
914
- e && Q[e],
915
- /* @__PURE__ */ c("span", {
983
+ n && Q[n],
984
+ /* @__PURE__ */ e("span", {
916
985
  className: "tintora-toast__message",
917
- children: t
986
+ children: r
918
987
  }),
919
- n && /* @__PURE__ */ c("button", {
988
+ i && /* @__PURE__ */ e("button", {
920
989
  type: "button",
921
990
  className: "tintora-toast__action",
922
- onClick: n.onClick,
923
- children: n.label
991
+ onClick: i.onClick,
992
+ children: i.label
924
993
  }),
925
- /* @__PURE__ */ c("button", {
994
+ /* @__PURE__ */ e("button", {
926
995
  type: "button",
927
996
  className: "tintora-toast__close",
928
997
  "aria-label": "Dismiss",
929
- onClick: i,
930
- children: /* @__PURE__ */ c(ae, {})
998
+ onClick: o,
999
+ children: /* @__PURE__ */ e(ce, {})
931
1000
  }),
932
- x && /* @__PURE__ */ c("span", {
1001
+ x && /* @__PURE__ */ e("span", {
933
1002
  className: "tintora-toast__progress",
934
1003
  style: S
935
1004
  })
@@ -938,20 +1007,20 @@ function oe({ status: e, children: t, action: n, onDismiss: i, duration: a = 5e3
938
1007
  }
939
1008
  //#endregion
940
1009
  //#region src/Toggle/ToggleContext.ts
941
- var $ = t(null);
942
- function se() {
943
- let e = n($);
1010
+ var $ = r(null);
1011
+ function ue() {
1012
+ let e = i($);
944
1013
  if (!e) throw Error("ToggleItem must be rendered inside a Toggle");
945
1014
  return e;
946
1015
  }
947
1016
  //#endregion
948
1017
  //#region src/Toggle/Toggle.tsx
949
- function ce({ children: e, value: t, defaultValue: n, onValueChange: r, disabled: i = !1, className: u, ...f }) {
950
- let [p, m] = s(n), h = t !== void 0, g = h ? t : p, _ = e.findIndex((e) => e.props.value === g), v = o(null), [y, b] = s({
1018
+ function de({ children: n, value: r, defaultValue: i, onValueChange: a, disabled: o = !1, className: u, ...f }) {
1019
+ let [p, m] = l(i), h = r !== void 0, g = h ? r : p, _ = n.findIndex((e) => e.props.value === g), v = c(null), [y, b] = l({
951
1020
  x: 0,
952
1021
  width: 0
953
1022
  });
954
- a(() => {
1023
+ s(() => {
955
1024
  let e = v.current;
956
1025
  if (!e) return;
957
1026
  let t = () => {
@@ -973,20 +1042,20 @@ function ce({ children: e, value: t, defaultValue: n, onValueChange: r, disabled
973
1042
  "--tintora-toggle-thumb-x": `${y.x}px`,
974
1043
  "--tintora-toggle-thumb-width": `${y.width}px`
975
1044
  };
976
- return /* @__PURE__ */ c($.Provider, {
1045
+ return /* @__PURE__ */ e($.Provider, {
977
1046
  value: {
978
1047
  value: g,
979
1048
  select: (e) => {
980
- e !== g && (h || m(e), r?.(e));
1049
+ e !== g && (h || m(e), a?.(e));
981
1050
  },
982
- disabled: i
1051
+ disabled: o
983
1052
  },
984
- children: /* @__PURE__ */ l("div", {
1053
+ children: /* @__PURE__ */ t("div", {
985
1054
  ...f,
986
1055
  role: "group",
987
1056
  ref: v,
988
- className: d("tintora-toggle", i && "tintora-toggle--disabled", u),
989
- children: [e, /* @__PURE__ */ c("span", {
1057
+ className: d("tintora-toggle", o && "tintora-toggle--disabled", u),
1058
+ children: [n, /* @__PURE__ */ e("span", {
990
1059
  "aria-hidden": "true",
991
1060
  className: "tintora-toggle__thumb",
992
1061
  style: x
@@ -996,76 +1065,76 @@ function ce({ children: e, value: t, defaultValue: n, onValueChange: r, disabled
996
1065
  }
997
1066
  //#endregion
998
1067
  //#region src/Toggle/ToggleItem.tsx
999
- function le({ value: e, children: t, className: n, disabled: r, onClick: i, ...a }) {
1000
- let o = se(), s = (t) => {
1001
- i?.(t), t.defaultPrevented || o.select(e);
1068
+ function fe({ value: t, children: n, className: r, disabled: i, onClick: a, ...o }) {
1069
+ let s = ue(), c = (e) => {
1070
+ a?.(e), e.defaultPrevented || s.select(t);
1002
1071
  };
1003
- return /* @__PURE__ */ c("button", {
1004
- ...a,
1072
+ return /* @__PURE__ */ e("button", {
1073
+ ...o,
1005
1074
  type: "button",
1006
- className: d("tintora-toggle__item", n),
1007
- "aria-pressed": o.value === e,
1008
- disabled: r || o.disabled,
1009
- onClick: s,
1010
- children: t
1075
+ className: d("tintora-toggle__item", r),
1076
+ "aria-pressed": s.value === t,
1077
+ disabled: i || s.disabled,
1078
+ onClick: c,
1079
+ children: n
1011
1080
  });
1012
1081
  }
1013
1082
  //#endregion
1014
1083
  //#region src/Tooltip/Tooltip.tsx
1015
- var ue = 100;
1016
- function de({ title: t, content: n, shortcut: a, children: u, className: f, placement: p = "top" }) {
1017
- let m = i(), [h, g] = s(!1), _ = o(null), v = o(null), y = o(void 0), b = () => {
1084
+ var pe = 100;
1085
+ function me({ title: r, content: i, shortcut: s, children: u, className: f, placement: p = "top" }) {
1086
+ let m = o(), [h, g] = l(!1), _ = c(null), v = c(null), y = c(void 0), b = () => {
1018
1087
  window.clearTimeout(y.current), g(!0);
1019
1088
  }, x = () => {
1020
- window.clearTimeout(y.current), y.current = window.setTimeout(() => g(!1), ue);
1021
- }, S = A(h, v, () => {
1089
+ window.clearTimeout(y.current), y.current = window.setTimeout(() => g(!1), pe);
1090
+ }, S = N(h, v, () => {
1022
1091
  let e = v.current, t = _.current?.firstElementChild;
1023
- return !e || !t ? null : F(t.getBoundingClientRect(), {
1092
+ return !e || !t ? null : R(t.getBoundingClientRect(), {
1024
1093
  width: e.offsetWidth,
1025
1094
  height: e.offsetHeight
1026
1095
  }, p);
1027
1096
  }, [
1028
1097
  p,
1029
- t,
1030
- n,
1031
- a
1098
+ r,
1099
+ i,
1100
+ s
1032
1101
  ]);
1033
- O(h, () => g(!1)), r(() => () => window.clearTimeout(y.current), []);
1102
+ j(h, () => g(!1)), a(() => () => window.clearTimeout(y.current), []);
1034
1103
  let C = S ? {
1035
1104
  top: S.top,
1036
1105
  left: S.left,
1037
1106
  "--tintora-tooltip-arrow-offset": `${S.arrowOffset}px`
1038
1107
  } : { visibility: "hidden" };
1039
- return /* @__PURE__ */ l("span", {
1108
+ return /* @__PURE__ */ t("span", {
1040
1109
  ref: _,
1041
1110
  className: "tintora-tooltip",
1042
1111
  onMouseEnter: b,
1043
1112
  onMouseLeave: x,
1044
1113
  onFocus: b,
1045
1114
  onBlur: x,
1046
- children: [e(u, { "aria-describedby": d(u.props["aria-describedby"], h && m) || void 0 }), h && /* @__PURE__ */ l("div", {
1115
+ children: [n(u, { "aria-describedby": d(u.props["aria-describedby"], h && m) || void 0 }), h && /* @__PURE__ */ t("div", {
1047
1116
  id: m,
1048
1117
  ref: v,
1049
1118
  role: "tooltip",
1050
1119
  popover: "manual",
1051
1120
  style: C,
1052
- className: d("tintora-tooltip__content", `tintora-tooltip__content--${S?.placement ?? p}`, t && "tintora-tooltip__content--rich", f),
1121
+ className: d("tintora-tooltip__content", `tintora-tooltip__content--${S?.placement ?? p}`, r && "tintora-tooltip__content--rich", f),
1053
1122
  children: [
1054
- t && /* @__PURE__ */ c("span", {
1123
+ r && /* @__PURE__ */ e("span", {
1055
1124
  className: "tintora-tooltip__title",
1056
- children: t
1125
+ children: r
1057
1126
  }),
1058
- /* @__PURE__ */ c("span", {
1127
+ /* @__PURE__ */ e("span", {
1059
1128
  className: "tintora-tooltip__text",
1060
- children: n
1129
+ children: i
1061
1130
  }),
1062
- a && /* @__PURE__ */ c("kbd", {
1131
+ s && /* @__PURE__ */ e("kbd", {
1063
1132
  className: "tintora-tooltip__shortcut",
1064
- children: a
1133
+ children: s
1065
1134
  })
1066
1135
  ]
1067
1136
  })]
1068
1137
  });
1069
1138
  }
1070
1139
  //#endregion
1071
- export { p as Avatar, g as Button, _ as Card, b as Checkbox, x as Chip, S as Dot, w as IconButton, E as Modal, L as Popover, R as ProgressBar, V as Radio, H as RadioGroup, U as SearchInput, q as Select, v as SelectableCard, J as Skeleton, h as Spinner, Y as Switch, X as Tag, Z as TextField, oe as Toast, ce as Toggle, le as ToggleItem, de as Tooltip };
1140
+ export { m as Alert, g as Avatar, y as Button, b as Card, C as Checkbox, w as Chip, T as Dot, D as IconButton, k as Modal, B as Popover, V as ProgressBar, W as Radio, G as RadioGroup, K as SearchInput, X as Select, x as SelectableCard, Z as Skeleton, v as Spinner, te as Switch, ne as Tag, re as TextField, le as Toast, de as Toggle, fe as ToggleItem, me as Tooltip };