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/Alert/Alert.d.ts +20 -0
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +448 -379
- package/dist/tintora.css +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
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
|
|
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
|
|
29
|
-
let [
|
|
30
|
-
return /* @__PURE__ */
|
|
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":
|
|
33
|
-
...
|
|
34
|
-
className: d("tintora-avatar", `tintora-avatar--${
|
|
35
|
-
children:
|
|
36
|
-
src:
|
|
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: () =>
|
|
39
|
-
}) :
|
|
107
|
+
onError: () => s(n)
|
|
108
|
+
}) : h(t)
|
|
40
109
|
});
|
|
41
110
|
}
|
|
42
111
|
//#endregion
|
|
43
112
|
//#region src/Spinner/Spinner.tsx
|
|
44
|
-
var
|
|
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
|
|
62
|
-
let { width:
|
|
63
|
-
return /* @__PURE__ */
|
|
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:
|
|
66
|
-
height:
|
|
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__ */
|
|
140
|
+
children: [/* @__PURE__ */ e("circle", {
|
|
72
141
|
cx: "12",
|
|
73
142
|
cy: "12",
|
|
74
143
|
r: "9",
|
|
75
144
|
stroke: "currentColor",
|
|
76
|
-
strokeOpacity:
|
|
77
|
-
strokeWidth:
|
|
78
|
-
}), /* @__PURE__ */
|
|
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:
|
|
81
|
-
strokeWidth:
|
|
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
|
|
89
|
-
return /* @__PURE__ */
|
|
90
|
-
type:
|
|
91
|
-
className: d("tintora-button", `tintora-button--${
|
|
92
|
-
"tintora-button--leading-icon": !!
|
|
93
|
-
"tintora-button--loading":
|
|
94
|
-
"tintora-button--trailing-icon": !!
|
|
95
|
-
},
|
|
96
|
-
disabled: u ||
|
|
97
|
-
"aria-busy":
|
|
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
|
-
|
|
169
|
+
l && /* @__PURE__ */ e("span", {
|
|
101
170
|
className: "tintora-button__icon",
|
|
102
171
|
"aria-hidden": "true",
|
|
103
|
-
children: /* @__PURE__ */
|
|
172
|
+
children: /* @__PURE__ */ e(v, {
|
|
104
173
|
size: "small",
|
|
105
174
|
color: "current"
|
|
106
175
|
})
|
|
107
176
|
}),
|
|
108
|
-
!
|
|
177
|
+
!l && o && /* @__PURE__ */ e("span", {
|
|
109
178
|
className: "tintora-button__icon",
|
|
110
179
|
"aria-hidden": "true",
|
|
111
|
-
children:
|
|
180
|
+
children: o
|
|
112
181
|
}),
|
|
113
|
-
|
|
114
|
-
|
|
182
|
+
n,
|
|
183
|
+
s && /* @__PURE__ */ e("span", {
|
|
115
184
|
className: "tintora-button__icon",
|
|
116
185
|
"aria-hidden": "true",
|
|
117
|
-
children:
|
|
186
|
+
children: s
|
|
118
187
|
})
|
|
119
188
|
]
|
|
120
189
|
});
|
|
121
190
|
}
|
|
122
191
|
//#endregion
|
|
123
192
|
//#region src/Card/Card.tsx
|
|
124
|
-
function
|
|
125
|
-
return /* @__PURE__ */
|
|
126
|
-
...
|
|
127
|
-
className: d("tintora-card", `tintora-card--${
|
|
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
|
|
131
|
-
return /* @__PURE__ */
|
|
132
|
-
...
|
|
199
|
+
function x({ selected: t = !1, className: n, ...r }) {
|
|
200
|
+
return /* @__PURE__ */ e("button", {
|
|
201
|
+
...r,
|
|
133
202
|
type: "button",
|
|
134
|
-
"aria-pressed":
|
|
135
|
-
className: d("tintora-card", "tintora-card--surface", "tintora-card--selectable",
|
|
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
|
|
141
|
-
let [r, i] =
|
|
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
|
|
152
|
-
let u =
|
|
153
|
-
checked:
|
|
154
|
-
defaultChecked:
|
|
155
|
-
onCheckedChange:
|
|
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
|
|
158
|
-
u.current && (u.current.indeterminate =
|
|
159
|
-
}), /* @__PURE__ */
|
|
160
|
-
className: d("tintora-checkbox",
|
|
161
|
-
children: [/* @__PURE__ */
|
|
162
|
-
...
|
|
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__ */
|
|
237
|
+
}), /* @__PURE__ */ t("span", {
|
|
169
238
|
className: "tintora-checkbox__box",
|
|
170
239
|
"aria-hidden": "true",
|
|
171
|
-
children: [/* @__PURE__ */
|
|
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__ */
|
|
181
|
-
}), /* @__PURE__ */
|
|
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__ */
|
|
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
|
|
197
|
-
return /* @__PURE__ */
|
|
198
|
-
...
|
|
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",
|
|
201
|
-
"aria-pressed":
|
|
202
|
-
children:
|
|
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
|
|
208
|
-
return /* @__PURE__ */
|
|
209
|
-
...
|
|
210
|
-
className: d("tintora-dot", `tintora-dot--${
|
|
211
|
-
role:
|
|
212
|
-
"aria-label":
|
|
213
|
-
"aria-hidden": !
|
|
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
|
|
287
|
+
var E = {
|
|
219
288
|
round: "secondary",
|
|
220
289
|
field: "secondary",
|
|
221
290
|
nav: "ghost"
|
|
222
291
|
};
|
|
223
|
-
function
|
|
224
|
-
let
|
|
225
|
-
return /* @__PURE__ */
|
|
226
|
-
...
|
|
227
|
-
variant:
|
|
228
|
-
"aria-current":
|
|
229
|
-
className: d("tintora-icon-button", `tintora-icon-button--${
|
|
230
|
-
...
|
|
231
|
-
children: /* @__PURE__ */
|
|
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:
|
|
303
|
+
children: t
|
|
235
304
|
})
|
|
236
305
|
});
|
|
237
306
|
}
|
|
238
307
|
//#endregion
|
|
239
308
|
//#region src/Modal/Modal.tsx
|
|
240
|
-
var
|
|
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__ */
|
|
317
|
+
children: /* @__PURE__ */ e("path", { d: "M18 6L6 18M6 6l12 12" })
|
|
249
318
|
});
|
|
250
|
-
function
|
|
251
|
-
let b =
|
|
252
|
-
return
|
|
253
|
-
let
|
|
254
|
-
|
|
255
|
-
}, [
|
|
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":
|
|
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(),
|
|
332
|
+
e.preventDefault(), r();
|
|
264
333
|
},
|
|
265
334
|
onClick: (e) => {
|
|
266
|
-
h === "dialog" && e.target === e.currentTarget &&
|
|
335
|
+
h === "dialog" && e.target === e.currentTarget && r();
|
|
267
336
|
},
|
|
268
337
|
children: [
|
|
269
|
-
|
|
338
|
+
l && /* @__PURE__ */ e("span", {
|
|
270
339
|
className: d("tintora-modal__icon", `tintora-modal__icon--${u}`),
|
|
271
340
|
"aria-hidden": "true",
|
|
272
|
-
children:
|
|
341
|
+
children: l
|
|
273
342
|
}),
|
|
274
|
-
/* @__PURE__ */
|
|
343
|
+
/* @__PURE__ */ t("div", {
|
|
275
344
|
className: "tintora-modal__text",
|
|
276
|
-
children: [/* @__PURE__ */
|
|
345
|
+
children: [/* @__PURE__ */ e("h2", {
|
|
277
346
|
id: x,
|
|
278
347
|
className: "tintora-modal__title",
|
|
279
|
-
children:
|
|
280
|
-
}),
|
|
348
|
+
children: i
|
|
349
|
+
}), s && /* @__PURE__ */ e("p", {
|
|
281
350
|
id: S,
|
|
282
351
|
className: "tintora-modal__description",
|
|
283
|
-
children:
|
|
352
|
+
children: s
|
|
284
353
|
})]
|
|
285
354
|
}),
|
|
286
|
-
g && /* @__PURE__ */
|
|
355
|
+
g && /* @__PURE__ */ e(D, {
|
|
287
356
|
className: "tintora-modal__close",
|
|
288
357
|
size: "medium",
|
|
289
358
|
"aria-label": "Close",
|
|
290
|
-
icon: /* @__PURE__ */
|
|
291
|
-
onClick:
|
|
359
|
+
icon: /* @__PURE__ */ e(O, {}),
|
|
360
|
+
onClick: r
|
|
292
361
|
}),
|
|
293
362
|
v,
|
|
294
|
-
f && /* @__PURE__ */
|
|
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
|
|
304
|
-
let t =
|
|
305
|
-
return
|
|
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
|
|
312
|
-
let n =
|
|
313
|
-
|
|
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
|
|
324
|
-
let
|
|
325
|
-
|
|
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) ||
|
|
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
|
-
|
|
403
|
+
r
|
|
335
404
|
]);
|
|
336
405
|
}
|
|
337
406
|
//#endregion
|
|
338
407
|
//#region src/hooks/useTopLayerPosition.ts
|
|
339
|
-
function
|
|
340
|
-
let [i,
|
|
341
|
-
return
|
|
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
|
-
|
|
413
|
+
a(null);
|
|
345
414
|
return;
|
|
346
415
|
}
|
|
347
416
|
r.showPopover();
|
|
348
|
-
let i = () =>
|
|
417
|
+
let i = () => a(n()), o = (e) => {
|
|
349
418
|
r.contains(e.target) || i();
|
|
350
419
|
};
|
|
351
|
-
return i(), window.addEventListener("scroll",
|
|
352
|
-
window.removeEventListener("scroll",
|
|
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
|
|
431
|
+
var P = {
|
|
363
432
|
gap: 10,
|
|
364
433
|
margin: 8,
|
|
365
434
|
arrowInset: 12
|
|
366
|
-
},
|
|
435
|
+
}, F = {
|
|
367
436
|
top: "bottom",
|
|
368
437
|
bottom: "top",
|
|
369
438
|
left: "right",
|
|
370
439
|
right: "left"
|
|
371
|
-
},
|
|
372
|
-
function
|
|
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(
|
|
450
|
+
return c >= s || o(F[n]) <= c ? n : F[n];
|
|
382
451
|
}
|
|
383
|
-
function
|
|
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
|
-
...
|
|
457
|
+
...P,
|
|
389
458
|
...i
|
|
390
|
-
}, { gap: o, margin: s, arrowInset: c } = a, l =
|
|
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 =
|
|
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:
|
|
478
|
+
arrowOffset: I(p, c, m - c)
|
|
410
479
|
};
|
|
411
480
|
}
|
|
412
481
|
//#endregion
|
|
413
482
|
//#region src/Popover/Popover.tsx
|
|
414
|
-
var
|
|
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
|
|
423
|
-
let _ =
|
|
424
|
-
|
|
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
|
-
|
|
427
|
-
}, C =
|
|
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 :
|
|
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
|
|
511
|
+
return s(() => {
|
|
443
512
|
let e = y.current;
|
|
444
|
-
|
|
445
|
-
}, [
|
|
446
|
-
if (b.current && !
|
|
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 =
|
|
451
|
-
}, [
|
|
519
|
+
b.current = r;
|
|
520
|
+
}, [r]), /* @__PURE__ */ t("span", {
|
|
452
521
|
ref: v,
|
|
453
522
|
className: "tintora-popover-root",
|
|
454
|
-
children: [
|
|
523
|
+
children: [n(l, {
|
|
455
524
|
"aria-haspopup": "dialog",
|
|
456
|
-
"aria-expanded":
|
|
457
|
-
"aria-controls":
|
|
525
|
+
"aria-expanded": r,
|
|
526
|
+
"aria-controls": r ? _ : void 0,
|
|
458
527
|
onClick: S
|
|
459
|
-
}),
|
|
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
|
|
475
|
-
let
|
|
476
|
-
return /* @__PURE__ */
|
|
477
|
-
className: d("tintora-progress-bar",
|
|
478
|
-
children: [
|
|
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__ */
|
|
481
|
-
id:
|
|
482
|
-
children:
|
|
483
|
-
}), /* @__PURE__ */
|
|
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__ */
|
|
556
|
+
}), /* @__PURE__ */ e("div", {
|
|
488
557
|
role: "progressbar",
|
|
489
|
-
"aria-label":
|
|
490
|
-
"aria-labelledby":
|
|
491
|
-
"aria-valuemin":
|
|
492
|
-
"aria-valuemax":
|
|
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":
|
|
563
|
+
"aria-valuetext": a,
|
|
495
564
|
className: "tintora-progress-bar__track",
|
|
496
|
-
children: /* @__PURE__ */
|
|
565
|
+
children: /* @__PURE__ */ e("div", {
|
|
497
566
|
className: d("tintora-progress-bar__fill", {
|
|
498
|
-
"tintora-progress-bar__fill--indeterminate":
|
|
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
|
|
509
|
-
function
|
|
510
|
-
let e =
|
|
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
|
|
517
|
-
let
|
|
518
|
-
return /* @__PURE__ */
|
|
519
|
-
className: d("tintora-radio",
|
|
520
|
-
children: [/* @__PURE__ */
|
|
521
|
-
...
|
|
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:
|
|
525
|
-
value:
|
|
526
|
-
checked:
|
|
527
|
-
disabled:
|
|
528
|
-
onChange: () =>
|
|
529
|
-
}), /* @__PURE__ */
|
|
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
|
|
538
|
-
let u =
|
|
539
|
-
return /* @__PURE__ */
|
|
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),
|
|
613
|
+
e !== h && (m || p(e), r?.(e));
|
|
545
614
|
},
|
|
546
|
-
disabled:
|
|
615
|
+
disabled: i
|
|
547
616
|
},
|
|
548
|
-
children: /* @__PURE__ */
|
|
549
|
-
...
|
|
617
|
+
children: /* @__PURE__ */ e("div", {
|
|
618
|
+
...c,
|
|
550
619
|
role: "radiogroup",
|
|
551
|
-
className: d("tintora-radio-group",
|
|
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
|
|
558
|
-
return /* @__PURE__ */
|
|
559
|
-
className: d("tintora-search-input",
|
|
560
|
-
children: [/* @__PURE__ */
|
|
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__ */
|
|
637
|
+
children: [/* @__PURE__ */ e("circle", {
|
|
569
638
|
cx: "11",
|
|
570
639
|
cy: "11",
|
|
571
640
|
r: "7"
|
|
572
|
-
}), /* @__PURE__ */
|
|
573
|
-
}), /* @__PURE__ */
|
|
574
|
-
...
|
|
641
|
+
}), /* @__PURE__ */ e("path", { d: "M20 20l-3.5-3.5" })]
|
|
642
|
+
}), /* @__PURE__ */ e("input", {
|
|
643
|
+
...i,
|
|
575
644
|
type: "search",
|
|
576
|
-
disabled:
|
|
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
|
|
584
|
-
let e =
|
|
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:
|
|
591
|
-
let { select:
|
|
592
|
-
return /* @__PURE__ */
|
|
593
|
-
id:
|
|
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":
|
|
596
|
-
"aria-disabled":
|
|
597
|
-
className: d("tintora-select__option",
|
|
598
|
-
onClick: () =>
|
|
599
|
-
onMouseMove: () => !
|
|
600
|
-
children:
|
|
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
|
|
606
|
-
function
|
|
607
|
-
let b =
|
|
608
|
-
for (let
|
|
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(
|
|
612
|
-
return e ===
|
|
613
|
-
}, z = (e) =>
|
|
614
|
-
|
|
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 !==
|
|
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:
|
|
621
|
-
if (
|
|
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(
|
|
697
|
+
].includes(t) && (e.preventDefault(), B());
|
|
629
698
|
return;
|
|
630
699
|
}
|
|
631
|
-
let
|
|
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
|
-
|
|
638
|
-
},
|
|
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
|
-
},
|
|
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 +
|
|
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 +
|
|
714
|
+
top: i || !a ? n.bottom + Y : n.top - Y - r,
|
|
646
715
|
left: n.left,
|
|
647
716
|
minWidth: n.width
|
|
648
717
|
};
|
|
649
|
-
}, []),
|
|
718
|
+
}, []), K = (e) => {
|
|
650
719
|
h?.(e), !e.defaultPrevented && (E ? V() : B());
|
|
651
720
|
};
|
|
652
|
-
|
|
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
|
|
656
|
-
return /* @__PURE__ */
|
|
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:
|
|
727
|
+
value: j,
|
|
659
728
|
activeValue: X,
|
|
660
729
|
select: H,
|
|
661
|
-
optionId:
|
|
662
|
-
activate: (e) =>
|
|
730
|
+
optionId: J,
|
|
731
|
+
activate: (e) => k(z(e))
|
|
663
732
|
},
|
|
664
|
-
children: /* @__PURE__ */
|
|
733
|
+
children: /* @__PURE__ */ t("div", {
|
|
665
734
|
ref: x,
|
|
666
735
|
className: "tintora-select",
|
|
667
736
|
children: [
|
|
668
|
-
/* @__PURE__ */
|
|
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 :
|
|
678
|
-
disabled:
|
|
746
|
+
"aria-activedescendant": X === null ? void 0 : J(X),
|
|
747
|
+
disabled: i,
|
|
679
748
|
className: d("tintora-select__trigger", m),
|
|
680
|
-
onClick:
|
|
749
|
+
onClick: K,
|
|
681
750
|
onKeyDown: U,
|
|
682
|
-
onKeyUp:
|
|
683
|
-
children: [/* @__PURE__ */
|
|
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__ */
|
|
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__ */
|
|
766
|
+
children: /* @__PURE__ */ e("path", { d: "M6 9l6 6 6-6" })
|
|
698
767
|
})]
|
|
699
768
|
}),
|
|
700
|
-
E && /* @__PURE__ */
|
|
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:
|
|
776
|
+
style: G ?? {},
|
|
708
777
|
onMouseDown: (e) => e.preventDefault(),
|
|
709
|
-
children:
|
|
778
|
+
children: r.map((t) => /* @__PURE__ */ e(ee, { ...t }, t.value))
|
|
710
779
|
}),
|
|
711
|
-
p && /* @__PURE__ */
|
|
780
|
+
p && /* @__PURE__ */ e("input", {
|
|
712
781
|
type: "hidden",
|
|
713
782
|
name: p,
|
|
714
|
-
value:
|
|
715
|
-
disabled:
|
|
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
|
|
724
|
-
let
|
|
725
|
-
...
|
|
726
|
-
...
|
|
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__ */
|
|
729
|
-
...
|
|
797
|
+
return /* @__PURE__ */ e("span", {
|
|
798
|
+
...a,
|
|
730
799
|
"aria-hidden": "true",
|
|
731
|
-
className: d("tintora-skeleton",
|
|
800
|
+
className: d("tintora-skeleton", r),
|
|
732
801
|
style: {
|
|
733
|
-
...
|
|
734
|
-
...
|
|
802
|
+
...o,
|
|
803
|
+
...i
|
|
735
804
|
}
|
|
736
805
|
});
|
|
737
806
|
}
|
|
738
807
|
//#endregion
|
|
739
808
|
//#region src/Switch/Switch.tsx
|
|
740
|
-
function
|
|
741
|
-
let
|
|
742
|
-
checked:
|
|
743
|
-
defaultChecked:
|
|
744
|
-
onCheckedChange:
|
|
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__ */
|
|
747
|
-
className: d("tintora-switch",
|
|
748
|
-
children: [/* @__PURE__ */
|
|
749
|
-
...
|
|
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:
|
|
754
|
-
onChange:
|
|
755
|
-
}), /* @__PURE__ */
|
|
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
|
|
764
|
-
return /* @__PURE__ */
|
|
765
|
-
...
|
|
766
|
-
className: d("tintora-tag", `tintora-tag--${
|
|
767
|
-
children:
|
|
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
|
|
773
|
-
let p =
|
|
774
|
-
return /* @__PURE__ */
|
|
775
|
-
className: d("tintora-textfield",
|
|
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__ */
|
|
846
|
+
/* @__PURE__ */ e("label", {
|
|
778
847
|
htmlFor: m,
|
|
779
848
|
className: "tintora-textfield__label",
|
|
780
|
-
children:
|
|
849
|
+
children: n
|
|
781
850
|
}),
|
|
782
|
-
/* @__PURE__ */
|
|
851
|
+
/* @__PURE__ */ e("input", {
|
|
783
852
|
...f,
|
|
784
853
|
id: m,
|
|
785
|
-
disabled:
|
|
854
|
+
disabled: c,
|
|
786
855
|
className: "tintora-textfield__input",
|
|
787
|
-
"aria-invalid":
|
|
788
|
-
"aria-describedby": d(g && h,
|
|
856
|
+
"aria-invalid": i ? !0 : u,
|
|
857
|
+
"aria-describedby": d(g && h, l) || void 0
|
|
789
858
|
}),
|
|
790
|
-
g && /* @__PURE__ */
|
|
859
|
+
g && /* @__PURE__ */ e("span", {
|
|
791
860
|
id: h,
|
|
792
|
-
className: d("tintora-textfield__hint",
|
|
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
|
|
801
|
-
return /* @__PURE__ */
|
|
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__ */
|
|
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
|
|
816
|
-
return /* @__PURE__ */
|
|
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__ */
|
|
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
|
|
831
|
-
return /* @__PURE__ */
|
|
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__ */
|
|
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
|
|
846
|
-
return /* @__PURE__ */
|
|
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__ */
|
|
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
|
|
861
|
-
return /* @__PURE__ */
|
|
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__ */
|
|
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__ */
|
|
877
|
-
error: /* @__PURE__ */
|
|
878
|
-
info: /* @__PURE__ */
|
|
879
|
-
warning: /* @__PURE__ */
|
|
945
|
+
success: /* @__PURE__ */ e(ie, {}),
|
|
946
|
+
error: /* @__PURE__ */ e(ae, {}),
|
|
947
|
+
info: /* @__PURE__ */ e(oe, {}),
|
|
948
|
+
warning: /* @__PURE__ */ e(se, {})
|
|
880
949
|
};
|
|
881
|
-
function
|
|
882
|
-
let [m, h] =
|
|
883
|
-
|
|
884
|
-
b.current =
|
|
885
|
-
}, [
|
|
886
|
-
if (
|
|
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
|
-
|
|
961
|
+
s,
|
|
893
962
|
v,
|
|
894
963
|
y
|
|
895
964
|
]);
|
|
896
|
-
let x = u &&
|
|
897
|
-
return /* @__PURE__ */
|
|
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
|
-
|
|
915
|
-
/* @__PURE__ */
|
|
983
|
+
n && Q[n],
|
|
984
|
+
/* @__PURE__ */ e("span", {
|
|
916
985
|
className: "tintora-toast__message",
|
|
917
|
-
children:
|
|
986
|
+
children: r
|
|
918
987
|
}),
|
|
919
|
-
|
|
988
|
+
i && /* @__PURE__ */ e("button", {
|
|
920
989
|
type: "button",
|
|
921
990
|
className: "tintora-toast__action",
|
|
922
|
-
onClick:
|
|
923
|
-
children:
|
|
991
|
+
onClick: i.onClick,
|
|
992
|
+
children: i.label
|
|
924
993
|
}),
|
|
925
|
-
/* @__PURE__ */
|
|
994
|
+
/* @__PURE__ */ e("button", {
|
|
926
995
|
type: "button",
|
|
927
996
|
className: "tintora-toast__close",
|
|
928
997
|
"aria-label": "Dismiss",
|
|
929
|
-
onClick:
|
|
930
|
-
children: /* @__PURE__ */
|
|
998
|
+
onClick: o,
|
|
999
|
+
children: /* @__PURE__ */ e(ce, {})
|
|
931
1000
|
}),
|
|
932
|
-
x && /* @__PURE__ */
|
|
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 $ =
|
|
942
|
-
function
|
|
943
|
-
let e =
|
|
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
|
|
950
|
-
let [p, m] =
|
|
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
|
-
|
|
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__ */
|
|
1045
|
+
return /* @__PURE__ */ e($.Provider, {
|
|
977
1046
|
value: {
|
|
978
1047
|
value: g,
|
|
979
1048
|
select: (e) => {
|
|
980
|
-
e !== g && (h || m(e),
|
|
1049
|
+
e !== g && (h || m(e), a?.(e));
|
|
981
1050
|
},
|
|
982
|
-
disabled:
|
|
1051
|
+
disabled: o
|
|
983
1052
|
},
|
|
984
|
-
children: /* @__PURE__ */
|
|
1053
|
+
children: /* @__PURE__ */ t("div", {
|
|
985
1054
|
...f,
|
|
986
1055
|
role: "group",
|
|
987
1056
|
ref: v,
|
|
988
|
-
className: d("tintora-toggle",
|
|
989
|
-
children: [
|
|
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
|
|
1000
|
-
let
|
|
1001
|
-
|
|
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__ */
|
|
1004
|
-
...
|
|
1072
|
+
return /* @__PURE__ */ e("button", {
|
|
1073
|
+
...o,
|
|
1005
1074
|
type: "button",
|
|
1006
|
-
className: d("tintora-toggle__item",
|
|
1007
|
-
"aria-pressed":
|
|
1008
|
-
disabled:
|
|
1009
|
-
onClick:
|
|
1010
|
-
children:
|
|
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
|
|
1016
|
-
function
|
|
1017
|
-
let m =
|
|
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),
|
|
1021
|
-
}, S =
|
|
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 :
|
|
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
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1098
|
+
r,
|
|
1099
|
+
i,
|
|
1100
|
+
s
|
|
1032
1101
|
]);
|
|
1033
|
-
|
|
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__ */
|
|
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: [
|
|
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}`,
|
|
1121
|
+
className: d("tintora-tooltip__content", `tintora-tooltip__content--${S?.placement ?? p}`, r && "tintora-tooltip__content--rich", f),
|
|
1053
1122
|
children: [
|
|
1054
|
-
|
|
1123
|
+
r && /* @__PURE__ */ e("span", {
|
|
1055
1124
|
className: "tintora-tooltip__title",
|
|
1056
|
-
children:
|
|
1125
|
+
children: r
|
|
1057
1126
|
}),
|
|
1058
|
-
/* @__PURE__ */
|
|
1127
|
+
/* @__PURE__ */ e("span", {
|
|
1059
1128
|
className: "tintora-tooltip__text",
|
|
1060
|
-
children:
|
|
1129
|
+
children: i
|
|
1061
1130
|
}),
|
|
1062
|
-
|
|
1131
|
+
s && /* @__PURE__ */ e("kbd", {
|
|
1063
1132
|
className: "tintora-tooltip__shortcut",
|
|
1064
|
-
children:
|
|
1133
|
+
children: s
|
|
1065
1134
|
})
|
|
1066
1135
|
]
|
|
1067
1136
|
})]
|
|
1068
1137
|
});
|
|
1069
1138
|
}
|
|
1070
1139
|
//#endregion
|
|
1071
|
-
export {
|
|
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 };
|