@ufoui/core 0.0.5 → 0.0.40

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (80) hide show
  1. package/assets/icons.d.ts +8 -2
  2. package/components/accordion/accordion.d.ts +31 -3
  3. package/components/accordion/accordionItem.d.ts +31 -3
  4. package/components/badge/badge.d.ts +2 -2
  5. package/components/base/boxBase.d.ts +14 -36
  6. package/components/base/buttonBase.d.ts +4 -4
  7. package/components/base/checkboxBase.d.ts +2 -2
  8. package/components/base/dialogBase.d.ts +111 -13
  9. package/components/base/fieldBase.d.ts +1 -2
  10. package/components/base/textBase.d.ts +1 -2
  11. package/components/breadcrumbs/breadcrumbs.d.ts +48 -0
  12. package/components/calendar/calendar.d.ts +23 -0
  13. package/components/calendar/calendarUtils.d.ts +18 -0
  14. package/components/card/card.d.ts +2 -2
  15. package/components/collapse/collapse.d.ts +15 -20
  16. package/components/dialogs/dialog.d.ts +1 -1
  17. package/components/dialogs/dialogActions.d.ts +19 -7
  18. package/components/dialogs/dialogActions.guards.d.ts +15 -0
  19. package/components/dialogs/dialogContent.d.ts +7 -1
  20. package/components/dialogs/dialogHeader.d.ts +60 -0
  21. package/components/dialogs/dialogTitle.d.ts +9 -5
  22. package/components/dialogs/drawer.d.ts +1 -1
  23. package/components/dialogs/index.d.ts +1 -0
  24. package/components/fieldset/fieldset.d.ts +1 -1
  25. package/components/link/link.d.ts +58 -0
  26. package/components/list/list.d.ts +1 -1
  27. package/components/menu/menu.d.ts +2 -2
  28. package/components/rating/rating.d.ts +68 -0
  29. package/components/slider/slider.d.ts +11 -0
  30. package/components/switch/switch.d.ts +2 -10
  31. package/components/themeProvider/themeProvider.d.ts +10 -15
  32. package/components/toast/toast.d.ts +18 -4
  33. package/components/toast/toastViewport.d.ts +4 -3
  34. package/components/tooltip/tooltip.d.ts +2 -2
  35. package/context/selectionContext.d.ts +18 -17
  36. package/hooks/index.d.ts +3 -1
  37. package/hooks/useAnimate.d.ts +36 -16
  38. package/hooks/useFocusTrap.d.ts +32 -0
  39. package/hooks/useFocusVisible.d.ts +16 -14
  40. package/hooks/useResizeObserver.d.ts +7 -3
  41. package/hooks/useRovingFocus.d.ts +30 -0
  42. package/hooks/useSelection.d.ts +10 -7
  43. package/hooks/useSelectionState.d.ts +29 -0
  44. package/hooks/useSliderKeys.d.ts +41 -0
  45. package/index.css +1 -1
  46. package/index.d.ts +4 -8
  47. package/index.js +4782 -0
  48. package/internal/controlGrid/controlGrid.d.ts +32 -0
  49. package/internal/controlLabel/controlLabel.d.ts +31 -0
  50. package/internal/description/description.d.ts +18 -0
  51. package/internal/icon/icon.d.ts +28 -0
  52. package/internal/index.d.ts +7 -0
  53. package/internal/inlineTooltip/index.d.ts +1 -0
  54. package/internal/inlineTooltip/inlineTooltipManager.d.ts +3 -3
  55. package/internal/slots/slot.d.ts +44 -0
  56. package/internal/stateLayer/stateLayer.d.ts +33 -0
  57. package/package.json +12 -3
  58. package/types/dialog.d.ts +37 -0
  59. package/types/index.d.ts +1 -0
  60. package/types/motion.d.ts +2 -2
  61. package/types/theme.d.ts +0 -30
  62. package/utils/applyThemeTokens.d.ts +10 -0
  63. package/utils/calculateFloatingPosition.d.ts +3 -3
  64. package/utils/color.d.ts +61 -216
  65. package/utils/colorRegistry.d.ts +44 -0
  66. package/utils/controlStyle.d.ts +8 -8
  67. package/utils/flatChildren.d.ts +17 -0
  68. package/utils/generateMaterialColors.d.ts +7 -7
  69. package/utils/getWrapperStyle.d.ts +53 -0
  70. package/utils/index.d.ts +5 -1
  71. package/utils/renderPortal.d.ts +30 -0
  72. package/utils/toasts/ensureViewport.d.ts +6 -1
  73. package/utils/toasts/toast.d.ts +66 -10
  74. package/utils/toasts/toastStore.d.ts +55 -1
  75. package/utils/utils.d.ts +67 -55
  76. package/hooks/useFocusState.d.ts +0 -16
  77. package/index.mjs +0 -4649
  78. package/internal/inlineTooltip/inlineTooltip.d.ts +0 -11
  79. package/internal/inlineTooltip/inlineTooltip2.d.ts +0 -10
  80. package/utils/generateSchemes.d.ts +0 -32
package/index.mjs DELETED
@@ -1,4649 +0,0 @@
1
- import { jsx as o, jsxs as R, Fragment as tt } from "react/jsx-runtime";
2
- import rt, { forwardRef as L, useState as W, useEffect as fe, useRef as ne, createContext as Ht, useCallback as Bt, useSyncExternalStore as ni, useContext as $t, useLayoutEffect as vn, isValidElement as mt, cloneElement as Lt, useMemo as ft, Children as xn } from "react";
3
- import { argbFromHex as Ft, themeFromSourceColor as ii, hexFromArgb as we, TonalPalette as oi } from "@material/material-color-utilities";
4
- import ri, { createPortal as Qt } from "react-dom";
5
- const si = (e) => ({
6
- topLeft: "uui-top-left",
7
- topCenter: "uui-top-center",
8
- topRight: "uui-top-right",
9
- topRightOut: "uui-top-right-out",
10
- topLeftOut: "uui-top-left-out",
11
- centerLeft: "uui-center-left",
12
- center: "uui-center",
13
- centerRight: "uui-center-right",
14
- bottomLeft: "uui-bottom-left",
15
- bottomCenter: "uui-bottom-center",
16
- bottomRight: "uui-bottom-right",
17
- auto: "uui-top-right"
18
- })[e], Re = (e) => {
19
- switch (e) {
20
- case "square":
21
- return "uui-square";
22
- case "smooth":
23
- return "uui-smooth";
24
- case "rounded":
25
- return "uui-rounded";
26
- case "round":
27
- return "uui-round";
28
- default:
29
- return "";
30
- }
31
- }, Ct = (e) => ({
32
- extraSmall: "uui-extra-small",
33
- small: "uui-small",
34
- medium: "uui-medium",
35
- large: "uui-large",
36
- extraLarge: "uui-extra-large"
37
- })[e], Je = (e) => {
38
- const t = wn(0, 5, e);
39
- return t === void 0 ? "" : `uui-border-${t}`;
40
- }, Po = (e) => +e > 0 || +e < 5 ? `uui-outline-${String(e)}` : "uui-outline-0", st = (e) => {
41
- switch (e) {
42
- case 0:
43
- return "uui-elevation-0";
44
- case 1:
45
- return "uui-elevation-1";
46
- case 2:
47
- return "uui-elevation-2";
48
- case 3:
49
- return "uui-elevation-3";
50
- case 4:
51
- return "uui-elevation-4";
52
- case 5:
53
- return "uui-elevation-5";
54
- default:
55
- return "";
56
- }
57
- }, pt = (e) => {
58
- switch (e) {
59
- case "compact":
60
- return "uui-compact";
61
- case "dense":
62
- return "uui-dense";
63
- default:
64
- return "";
65
- }
66
- }, Ce = (e) => ({
67
- displayLarge: "uui-font-display-large",
68
- displayMedium: "uui-font-display-medium",
69
- displaySmall: "uui-font-display-small",
70
- headlineLarge: "uui-font-headline-large",
71
- headlineMedium: "uui-font-headline-medium",
72
- headlineSmall: "uui-font-headline-small",
73
- titleLarge: "uui-font-title-large",
74
- titleMedium: "uui-font-title-medium",
75
- titleSmall: "uui-font-title-small",
76
- labelLarge: "uui-font-label-large",
77
- labelMedium: "uui-font-label-medium",
78
- labelSmall: "uui-font-label-small",
79
- bodyLarge: "uui-font-body-large",
80
- bodyMedium: "uui-font-body-medium",
81
- bodySmall: "uui-font-body-small",
82
- caption: "uui-font-caption",
83
- overline: "uui-font-overline"
84
- })[e];
85
- function gt(...e) {
86
- return (t) => {
87
- e.forEach((n) => {
88
- if (typeof n == "function")
89
- n(t);
90
- else if (n) {
91
- const i = n;
92
- i.current = t;
93
- }
94
- });
95
- };
96
- }
97
- const It = (e, t, n) => {
98
- const i = n ?? e, r = i.querySelector(".ripple-container");
99
- r && r.remove();
100
- const s = e.getBoundingClientRect(), a = i.getBoundingClientRect(), u = t.clientX - s.left, g = t.clientY - s.top, m = u >= 0 && u <= s.width && g >= 0 && g <= s.height, d = m ? u : s.width / 2, c = m ? g : s.height / 2, l = Math.sqrt(
101
- s.width * s.width + s.height * s.height
102
- ), f = l / 2, h = document.createElement("div");
103
- h.className = "ripple-container", h.style.position = "absolute", h.style.pointerEvents = "none", h.style.overflow = "hidden", h.style.width = `${s.width}px`, h.style.height = `${s.height}px`, h.style.left = `${s.left - a.left}px`, h.style.top = `${s.top - a.top}px`, requestAnimationFrame(() => {
104
- h.style.borderRadius = getComputedStyle(e).borderRadius;
105
- });
106
- const C = document.createElement("span");
107
- C.className = "ripple", C.style.position = "absolute", C.style.width = `${l}px`, C.style.height = `${l}px`, C.style.left = `${d - f}px`, C.style.top = `${c - f}px`, h.appendChild(C), i.appendChild(h), C.addEventListener("animationend", () => {
108
- h.remove();
109
- });
110
- };
111
- function Et(e) {
112
- return e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").replace(/([A-Z]+)([A-Z][a-z])/g, "$1-$2").toLowerCase();
113
- }
114
- function Oo(e) {
115
- e && (e.classList.remove("uui-focus-visible"), e.focus(), e.classList.add("uui-focus-visible"), e.addEventListener(
116
- "blur",
117
- () => {
118
- e.classList.remove("uui-focus-visible");
119
- },
120
- { once: !0 }
121
- ));
122
- }
123
- function wn(e, t, n, i) {
124
- const r = Number(n);
125
- return Number.isFinite(r) ? Math.min(t, Math.max(e, Math.round(r))) : i;
126
- }
127
- const Sn = [
128
- "primary",
129
- "secondary",
130
- "tertiary",
131
- "warning",
132
- "info",
133
- "success",
134
- "error"
135
- ], Nn = [
136
- ...Sn,
137
- "primaryContainer",
138
- "primaryFixed",
139
- "primaryFixedDim",
140
- "secondaryContainer",
141
- "secondaryFixed",
142
- "secondaryFixedDim",
143
- "tertiaryContainer",
144
- "tertiaryFixed",
145
- "tertiaryFixedDim",
146
- "warningContainer",
147
- "warningFixed",
148
- "warningFixedDim",
149
- "infoContainer",
150
- "infoFixed",
151
- "infoFixedDim",
152
- "successContainer",
153
- "successFixed",
154
- "successFixedDim",
155
- "errorContainer",
156
- "errorFixed",
157
- "errorFixedDim",
158
- "black",
159
- "white"
160
- ], kn = [
161
- ...Nn,
162
- "outline",
163
- "outlineVariant",
164
- "surface",
165
- "surfaceVariant",
166
- "background",
167
- "inverseSurface",
168
- "inversePrimary",
169
- "surfaceContainerHighest",
170
- "surfaceContainerHigh",
171
- "surfaceContainer",
172
- "surfaceContainerLow",
173
- "surfaceContainerLowest",
174
- "surfaceBright",
175
- "surfaceDim"
176
- ], Fn = [
177
- ...kn,
178
- "onPrimary",
179
- "onPrimaryContainer",
180
- "onPrimaryFixed",
181
- "onPrimaryFixedVariant",
182
- "onSecondary",
183
- "onSecondaryContainer",
184
- "onSecondaryFixed",
185
- "onSecondaryFixedVariant",
186
- "onTertiary",
187
- "onTertiaryContainer",
188
- "onTertiaryFixed",
189
- "onTertiaryFixedVariant",
190
- "onWarning",
191
- "onWarningContainer",
192
- "onWarningFixed",
193
- "onWarningFixedVariant",
194
- "onInfo",
195
- "onInfoContainer",
196
- "onInfoFixed",
197
- "onInfoFixedVariant",
198
- "onSuccess",
199
- "onSuccessContainer",
200
- "onSuccessFixed",
201
- "onSuccessFixedVariant",
202
- "onError",
203
- "onErrorContainer",
204
- "onErrorFixed",
205
- "onErrorFixedVariant",
206
- "onSurface",
207
- "onSurfaceVariant",
208
- "onBackground",
209
- "inverseOnSurface",
210
- "inversePrimary",
211
- "shadow",
212
- "surfaceTint",
213
- "scrim"
214
- ], _t = {
215
- fade: "uui-motion-fade",
216
- fadeBlur: "uui-motion-fade-blur",
217
- scale: "uui-motion-scale",
218
- scaleBlur: "uui-motion-scale-blur",
219
- popup: "uui-motion-popup",
220
- slideUp: "uui-motion-slide-up",
221
- slideDown: "uui-motion-slide-down",
222
- slideLeft: "uui-motion-slide-left",
223
- slideRight: "uui-motion-slide-right",
224
- slideUpBlur: "uui-motion-slide-up-blur",
225
- slideDownBlur: "uui-motion-slide-down-blur",
226
- slideLeftBlur: "uui-motion-slide-left-blur",
227
- slideRightBlur: "uui-motion-slide-right-blur",
228
- rotate: "uui-motion-rotate",
229
- rotateUpRight: "uui-motion-rotate-up-right",
230
- rotateUpLeft: "uui-motion-rotate-up-left",
231
- rollLeft: "uui-motion-roll-left",
232
- rollRight: "uui-motion-roll-right",
233
- flipX: "uui-motion-flip-x",
234
- flipY: "uui-motion-flip-y",
235
- bounce: "uui-motion-bounce",
236
- squish: "uui-motion-squish",
237
- rubber: "uui-motion-rubber",
238
- popElastic: "uui-motion-pop-elastic",
239
- jelly: "uui-motion-jelly"
240
- };
241
- function Bn(e) {
242
- return e ? _t[e] ?? "" : "";
243
- }
244
- function Ho() {
245
- return Object.keys(_t);
246
- }
247
- function Ln(e) {
248
- return e === "expressive" ? "uui-motion-expressive" : "";
249
- }
250
- const li = (e) => {
251
- const t = Sn.includes(e) ? e : "primary";
252
- return {
253
- textColor: `uui-text-${t}`,
254
- borderColor: `uui-border-${t}`,
255
- bgColor: `uui-bg-${t}`,
256
- textOnColor: `uui-text-on-${t}`,
257
- borderOnColor: `uui-border-on-${t}`,
258
- bgOnColor: `uui-bg-on-${t}`,
259
- textContainer: `uui-text-${t}-container`,
260
- borderContainer: `uui-border-${t}-container`,
261
- bgContainer: `uui-bg-${t}-container`,
262
- textOnContainer: `uui-text-on-${t}-container`,
263
- borderOnContainer: `uui-border-on-${t}-container`,
264
- bgOnContainer: `uui-bg-on-${t}-container`,
265
- textFixed: `uui-text-${t}-fixed`,
266
- borderFixed: `uui-border-${t}-fixed`,
267
- bgFixed: `uui-bg-${t}-fixed`,
268
- textOnFixed: `uui-text-on-${t}-fixed`,
269
- borderOnFixed: `uui-border-on-${t}-fixed`,
270
- bgOnFixed: `uui-bg-on-${t}-fixed`,
271
- textFixedDim: `uui-text-${t}-fixed-dim`,
272
- borderFixedDim: `uui-border-${t}-fixed-dim`,
273
- bgFixedDim: `uui-bg-${t}-fixed-dim`,
274
- textOnFixedVariant: `uui-text-on-${t}-fixed-variant`,
275
- borderOnFixedVariant: `uui-border-on-${t}-fixed-variant`,
276
- bgOnFixedVariant: `uui-bg-on-${t}-fixed-variant`
277
- };
278
- }, Ot = {
279
- // SURFACE
280
- surface: "onSurface",
281
- surfaceVariant: "onSurfaceVariant",
282
- surfaceContainerLowest: "onSurface",
283
- surfaceContainerLow: "onSurface",
284
- surfaceContainer: "onSurface",
285
- surfaceContainerHigh: "onSurface",
286
- surfaceContainerHighest: "onSurface",
287
- surfaceDim: "onSurface",
288
- surfaceBright: "onSurface",
289
- background: "onBackground",
290
- inverseSurface: "inverseOnSurface",
291
- // SEMANTIC
292
- primary: "onPrimary",
293
- secondary: "onSecondary",
294
- tertiary: "onTertiary",
295
- warning: "onWarning",
296
- info: "onInfo",
297
- success: "onSuccess",
298
- error: "onError",
299
- // EXTENDED
300
- primaryContainer: "onPrimaryContainer",
301
- primaryFixed: "onPrimaryFixed",
302
- primaryFixedDim: "onPrimaryFixedVariant",
303
- secondaryContainer: "onSecondaryContainer",
304
- secondaryFixed: "onSecondaryFixed",
305
- secondaryFixedDim: "onSecondaryFixedVariant",
306
- tertiaryContainer: "onTertiaryContainer",
307
- tertiaryFixed: "onTertiaryFixed",
308
- tertiaryFixedDim: "onTertiaryFixedVariant",
309
- warningContainer: "onWarningContainer",
310
- warningFixed: "onWarningFixed",
311
- warningFixedDim: "onWarningFixedVariant",
312
- infoContainer: "onInfoContainer",
313
- infoFixed: "onInfoFixed",
314
- infoFixedDim: "onInfoFixedVariant",
315
- successContainer: "onSuccessContainer",
316
- successFixed: "onSuccessFixed",
317
- successFixedDim: "onSuccessFixedVariant",
318
- errorContainer: "onErrorContainer",
319
- errorFixed: "onErrorFixed",
320
- errorFixedDim: "onErrorFixedVariant",
321
- // NEUTRAL / TECHNICAL (for TS completeness)
322
- outline: "surface",
323
- outlineVariant: "inverseSurface",
324
- inversePrimary: "onPrimaryContainer",
325
- black: "white",
326
- white: "black",
327
- onSurface: "surface",
328
- onSurfaceVariant: "surfaceVariant",
329
- onBackground: "background",
330
- inverseOnSurface: "inverseSurface",
331
- onPrimary: "primary",
332
- onSecondary: "secondary",
333
- onTertiary: "tertiary",
334
- onWarning: "warning",
335
- onInfo: "info",
336
- onSuccess: "success",
337
- onError: "error",
338
- onPrimaryContainer: "primaryContainer",
339
- onSecondaryContainer: "secondaryContainer",
340
- onTertiaryContainer: "tertiaryContainer",
341
- onWarningContainer: "warningContainer",
342
- onInfoContainer: "infoContainer",
343
- onSuccessContainer: "successContainer",
344
- onErrorContainer: "errorContainer"
345
- }, Wt = (e) => {
346
- const t = kn.includes(e) ? e : "primary", n = Et(t), i = Et(Ot[t]);
347
- return {
348
- textColor: `uui-text-${n}`,
349
- textOnColor: `uui-text-${i}`,
350
- borderColor: `uui-border-${n}`,
351
- borderOnColor: `uui-border-${i}`,
352
- bgColor: `uui-bg-${n}`,
353
- bgOnColor: `uui-bg-${i}`
354
- };
355
- }, _o = (e) => {
356
- const t = Fn.includes(e) ? e : "primary", n = Et(t);
357
- return {
358
- textColor: `uui-text-${n}`,
359
- borderColor: `uui-border-${n}`,
360
- bgColor: `uui-bg-${n}`
361
- };
362
- };
363
- function en(e) {
364
- return Wt(e).borderColor;
365
- }
366
- const Wo = (e) => {
367
- const t = e.toLowerCase(), n = `--uui-color-${t}`, i = `--uui-color-on-${t}`;
368
- return {
369
- color: `var(${n})`,
370
- onColor: `var(${i})`,
371
- container: `var(${n}-container)`,
372
- onContainer: `var(${i}-container)`,
373
- fixed: `var(${n}-fixed)`,
374
- fixedDim: `var(${n}-fixed-dim)`,
375
- onFixed: `var(${i}-fixed)`,
376
- onFixedVariant: `var(${i}-fixed-variant)`
377
- };
378
- }, $n = (e) => {
379
- const t = e.toLowerCase(), n = `--uui-color-${t}`, i = `--uui-color-on-${t}`;
380
- return {
381
- color: `var(${n})`,
382
- onColor: `var(${i})`
383
- };
384
- }, ai = (e) => [
385
- parseInt(e.slice(1, 3), 16),
386
- parseInt(e.slice(3, 5), 16),
387
- parseInt(e.slice(5, 7), 16)
388
- ], Uo = (e) => [
389
- parseInt(e.slice(1, 3), 16),
390
- parseInt(e.slice(3, 5), 16),
391
- parseInt(e.slice(5, 7), 16)
392
- ].join(",");
393
- function qo(e, t) {
394
- const i = {
395
- 0: "0",
396
- 1: "0.05",
397
- 2: "0.08",
398
- 3: "0.11",
399
- 4: "0.12",
400
- 5: "0.14"
401
- }[e] ?? 0, [r, s, a] = ai(t);
402
- return `rgba(${String(r)}, ${String(s)}, ${String(a)}, ${i})`;
403
- }
404
- const zo = () => {
405
- const e = [
406
- "surface",
407
- "onSurface",
408
- "surfaceDim",
409
- "surfaceBright",
410
- "surfaceContainerLowest",
411
- "surfaceContainerLow",
412
- "surfaceContainer",
413
- "surfaceContainerHigh",
414
- "surfaceContainerHighest",
415
- "onSurfaceVariant",
416
- "inverseSurface",
417
- "inverseOnSurface",
418
- "outline",
419
- "outlineVariant",
420
- "inversePrimary",
421
- "scrim",
422
- "shadow",
423
- "white",
424
- "black",
425
- "background",
426
- "onBackground",
427
- "surfaceTint"
428
- ], t = {};
429
- for (const n of e) {
430
- const i = n.charAt(0).toUpperCase() + n.slice(1);
431
- t[`text${i}`] = `uui-text-${n}`, t[`border${i}`] = `uui-border-${n}`, t[`outline${i}`] = `uui-outline-${n}`, t[`bg${i}`] = `uui-bg-${n}`;
432
- }
433
- return t;
434
- };
435
- function ui(e) {
436
- return e.charAt(0).toUpperCase() + e.slice(1);
437
- }
438
- function ht(e) {
439
- return e ?? "outlineVariant";
440
- }
441
- function En(e, t, n = {}) {
442
- const { placement: i = "topCenter", offset: r = 8, mode: s = "tooltip" } = n, a = 12, u = {
443
- tooltip: ["topCenter", "bottomCenter", "centerRight", "centerLeft"],
444
- dropdown: ["bottomCenter", "topCenter", "centerRight", "centerLeft"],
445
- menu: [
446
- "bottomLeft",
447
- "bottomRight",
448
- "topLeft",
449
- "topRight",
450
- "centerRight",
451
- "centerLeft"
452
- ],
453
- submenu: [
454
- "topRightOut",
455
- "topLeftOut",
456
- "centerRight",
457
- "centerLeft",
458
- "bottomCenter",
459
- "topCenter"
460
- ]
461
- }, g = i === "auto" ? u[s] : [i, ...u[s]], m = e.current, d = t.current;
462
- if (!m || !d)
463
- return null;
464
- const c = m.getBoundingClientRect(), l = d.getBoundingClientRect(), f = window.innerWidth, h = window.innerHeight, C = (y) => {
465
- let b = 0, x = 0;
466
- switch (y) {
467
- case "topCenter":
468
- b = c.left + (c.width - l.width) / 2, x = c.top - l.height - r;
469
- break;
470
- case "topLeft":
471
- b = c.left, x = c.top - l.height - r;
472
- break;
473
- case "topRight":
474
- b = c.right - l.width, x = c.top - l.height - r;
475
- break;
476
- case "bottomCenter":
477
- b = c.left + (c.width - l.width) / 2, x = c.bottom + r;
478
- break;
479
- case "bottomLeft":
480
- b = c.left, x = c.bottom + r;
481
- break;
482
- case "bottomRight":
483
- b = c.right - l.width, x = c.bottom + r;
484
- break;
485
- case "centerLeft":
486
- b = c.left - l.width - r, x = c.top + (c.height - l.height) / 2;
487
- break;
488
- case "centerRight":
489
- b = c.right + r, x = c.top + (c.height - l.height) / 2;
490
- break;
491
- case "center":
492
- b = c.left + (c.width - l.width) / 2, x = c.top + (c.height - l.height) / 2;
493
- break;
494
- case "topRightOut":
495
- b = c.right + r, x = c.top;
496
- break;
497
- case "topLeftOut":
498
- b = c.left - l.width - r, x = c.top;
499
- break;
500
- }
501
- return { x: b, y: x, placement: y };
502
- };
503
- for (const y of g) {
504
- const b = C(y), x = b.x >= 0 && b.x + l.width <= f, F = b.y >= 0 && b.y + l.height <= h;
505
- let B = !1;
506
- if (y === "centerLeft" || y === "centerRight" ? B = x : y === "topCenter" || y === "bottomCenter" || y === "center" ? B = F : B = x && F, B)
507
- return b.x = Math.max(
508
- a,
509
- Math.min(b.x, f - l.width - a)
510
- ), b.y = Math.max(
511
- a,
512
- Math.min(b.y, h - l.height - a)
513
- ), b;
514
- }
515
- const w = C(i);
516
- return w.x = Math.max(
517
- a,
518
- Math.min(w.x, f - l.width - a)
519
- ), w.y = Math.max(
520
- a,
521
- Math.min(w.y, h - l.height - a)
522
- ), w;
523
- }
524
- let pn = !1, Yt = "pointer";
525
- function ci() {
526
- pn || typeof window > "u" || (pn = !0, window.addEventListener(
527
- "keydown",
528
- () => {
529
- Yt = "keyboard";
530
- },
531
- !0
532
- ), window.addEventListener(
533
- "pointerdown",
534
- () => {
535
- Yt = "pointer";
536
- },
537
- !0
538
- ));
539
- }
540
- function di() {
541
- return Yt;
542
- }
543
- function fi(e = "#6750A4", t, n = {}) {
544
- var d, c, l, f, h, C, w, y, b, x, F, B, V, P, A, D, M;
545
- const i = { light: {}, dark: {} }, r = (d = n.light) != null && d.primary ? Ft(n.light.primary) : Ft(e), s = {
546
- info: "#03a9f4",
547
- warning: "#ffd600",
548
- success: "#689f38",
549
- ...t
550
- }, a = [];
551
- Object.keys(s).forEach((S) => {
552
- var k;
553
- const v = (k = n.light) == null ? void 0 : k[S];
554
- v ? a.push({
555
- value: Ft(v),
556
- name: S,
557
- blend: !0
558
- }) : a.push({
559
- value: Ft(
560
- s[S]
561
- ),
562
- name: S,
563
- blend: !0
564
- });
565
- }), ["secondary", "tertiary", "error"].forEach((S) => {
566
- var k;
567
- const v = (k = n.light) == null ? void 0 : k[S];
568
- v && a.push({
569
- value: Ft(v),
570
- name: S,
571
- blend: !0
572
- });
573
- });
574
- const u = ii(r, a);
575
- ["light", "dark"].forEach((S) => {
576
- const v = S;
577
- Fn.forEach((k) => {
578
- var T;
579
- (T = n[v]) != null && T[k] ? i[v][k] = n[v][k] : typeof u.schemes[v][k] == "number" && (i[v][k] = we(
580
- u.schemes[v][k]
581
- ));
582
- });
583
- }), i.light.scrim = "#00000052", i.dark.scrim = "#00000052", u.customColors.forEach((S) => {
584
- const v = S.color.name[0].toUpperCase() + S.color.name.slice(1), k = {
585
- color: S.color.name,
586
- onColor: `on${v}`,
587
- colorContainer: `${S.color.name}Container`,
588
- onColorContainer: `on${v}Container`
589
- };
590
- ["light", "dark"].forEach((T) => {
591
- const U = T;
592
- Object.keys(k).forEach((Z) => {
593
- var ie;
594
- i[T][k[Z]] = ((ie = n[T]) == null ? void 0 : ie[k[Z]]) ?? we(S[U][Z]);
595
- });
596
- });
597
- }), ["primary", "secondary", "tertiary", "error"].forEach((S) => {
598
- const v = S[0].toUpperCase() + S.slice(1);
599
- ["light", "dark"].forEach((k) => {
600
- var T, U, Z, ie;
601
- i[k][`${S}Fixed`] = (T = n[k]) != null && T[`${S}Fixed`] ? n[k][`${S}Fixed`] : we(
602
- u.palettes[S].tone(90)
603
- ), i[k][`${S}FixedDim`] = (U = n[k]) != null && U[`${S}FixedDim`] ? n[k][`${S}FixedDim`] : we(
604
- u.palettes[S].tone(80)
605
- ), i[k][`on${v}Fixed`] = (Z = n[k]) != null && Z[`on${v}Fixed`] ? n[k][`on${v}Fixed`] : we(
606
- u.palettes[S].tone(10)
607
- ), i[k][`on${v}FixedVariant`] = (ie = n[k]) != null && ie[`on${v}FixedVariant`] ? n[k][`on${v}FixedVariant`] : we(
608
- u.palettes[S].tone(30)
609
- );
610
- });
611
- });
612
- const g = (S, v) => {
613
- const k = oi.fromInt(S);
614
- return we(k.tone(v));
615
- };
616
- u.customColors.forEach((S) => {
617
- const v = S.color.name, k = v[0].toUpperCase() + v.slice(1);
618
- ["light", "dark"].forEach((T) => {
619
- var Z, ie, Se, he;
620
- const U = S[T].color;
621
- i[T][`${v}Fixed`] = (Z = n[T]) != null && Z[`${v}Fixed`] ? n[T][`${v}Fixed`] : g(U, 90), i[T][`${v}FixedDim`] = (ie = n[T]) != null && ie[`${v}FixedDim`] ? n[T][`${v}FixedDim`] : g(U, 80), i[T][`on${k}Fixed`] = (Se = n[T]) != null && Se[`on${k}Fixed`] ? n[T][`on${k}Fixed`] : g(U, 10), i[T][`on${k}FixedVariant`] = (he = n[T]) != null && he[`on${k}FixedVariant`] ? n[T][`on${k}FixedVariant`] : g(U, 30);
622
- });
623
- });
624
- const m = {
625
- black: "#000000",
626
- onBlack: "#ffffff",
627
- white: "#ffffff",
628
- onWhite: "#000000"
629
- };
630
- return Object.assign(i.light, m), Object.assign(i.dark, m), i.light.surface = ((c = n.light) == null ? void 0 : c.surface) ?? we(u.palettes.neutral.tone(99)), i.light.surfaceDim = ((l = n.light) == null ? void 0 : l.surfaceDim) ?? we(u.palettes.neutral.tone(87)), i.light.surfaceBright = ((f = n.light) == null ? void 0 : f.surfaceBright) ?? we(u.palettes.neutral.tone(99)), i.light.surfaceContainerLowest = ((h = n.light) == null ? void 0 : h.surfaceContainerLowest) ?? we(u.palettes.neutral.tone(100)), i.light.surfaceContainerLow = ((C = n.light) == null ? void 0 : C.surfaceContainerLow) ?? we(u.palettes.neutral.tone(96)), i.light.surfaceContainer = ((w = n.light) == null ? void 0 : w.surfaceContainer) ?? we(u.palettes.neutral.tone(94)), i.light.surfaceContainerHigh = ((y = n.light) == null ? void 0 : y.surfaceContainerHigh) ?? we(u.palettes.neutral.tone(92)), i.light.surfaceContainerHighest = ((b = n.light) == null ? void 0 : b.surfaceContainerHighest) ?? we(u.palettes.neutral.tone(90)), i.dark.surface = ((x = n.dark) == null ? void 0 : x.surface) ?? we(u.palettes.neutral.tone(6)), i.dark.surfaceDim = ((F = n.dark) == null ? void 0 : F.surfaceDim) ?? we(u.palettes.neutral.tone(6)), i.dark.surfaceBright = ((B = n.dark) == null ? void 0 : B.surfaceBright) ?? we(u.palettes.neutral.tone(24)), i.dark.surfaceContainerLowest = ((V = n.dark) == null ? void 0 : V.surfaceContainerLowest) ?? we(u.palettes.neutral.tone(4)), i.dark.surfaceContainerLow = ((P = n.dark) == null ? void 0 : P.surfaceContainerLow) ?? we(u.palettes.neutral.tone(10)), i.dark.surfaceContainer = ((A = n.dark) == null ? void 0 : A.surfaceContainer) ?? we(u.palettes.neutral.tone(12)), i.dark.surfaceContainerHigh = ((D = n.dark) == null ? void 0 : D.surfaceContainerHigh) ?? we(u.palettes.neutral.tone(17)), i.dark.surfaceContainerHighest = ((M = n.dark) == null ? void 0 : M.surfaceContainerHighest) ?? we(u.palettes.neutral.tone(22)), i.light.surfaceTint = we(u.palettes.primary.tone(40)), i.dark.surfaceTint = we(u.palettes.primary.tone(80)), i;
631
- }
632
- function mi(e = "#6750A4", t, n = {}) {
633
- const i = "ufo-ui-theme";
634
- let r = document.getElementById(i);
635
- r || (r = document.createElement("style"), r.id = i, document.head.appendChild(r));
636
- const s = fi(
637
- e,
638
- t,
639
- n
640
- ), a = [
641
- ...Object.entries(s.light).map(
642
- ([g, m]) => `--uui-color-${Et(g)}: ${m};`
643
- )
644
- ].join(""), u = Object.entries(s.dark).map(([g, m]) => `--uui-color-${Et(g)}: ${m};`).join("");
645
- return r.textContent = `:root{${a}}.dark{${u}}`, s;
646
- }
647
- let ot = [], Pt = [];
648
- function jt() {
649
- const e = [...ot];
650
- Pt.forEach((t) => {
651
- t(e);
652
- });
653
- }
654
- const bt = {
655
- subscribe(e) {
656
- return Pt.push(e), e([...ot]), () => {
657
- Pt = Pt.filter((t) => t !== e);
658
- };
659
- },
660
- add(e) {
661
- ot.some((t) => t.id === e.id) || (ot = [...ot, e], jt());
662
- },
663
- update(e, t) {
664
- ot = ot.map((n) => n.id === e ? { ...n, ...t } : n), jt();
665
- },
666
- remove(e) {
667
- ot = ot.filter((t) => t.id !== e), jt();
668
- },
669
- clear() {
670
- ot = [], jt();
671
- },
672
- getState() {
673
- return [...ot];
674
- }
675
- };
676
- var wt = {}, gn;
677
- function pi() {
678
- if (gn) return wt;
679
- gn = 1;
680
- var e = ri;
681
- if (process.env.NODE_ENV === "production")
682
- wt.createRoot = e.createRoot, wt.hydrateRoot = e.hydrateRoot;
683
- else {
684
- var t = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
685
- wt.createRoot = function(n, i) {
686
- t.usingClientEntryPoint = !0;
687
- try {
688
- return e.createRoot(n, i);
689
- } finally {
690
- t.usingClientEntryPoint = !1;
691
- }
692
- }, wt.hydrateRoot = function(n, i, r) {
693
- t.usingClientEntryPoint = !0;
694
- try {
695
- return e.hydrateRoot(n, i, r);
696
- } finally {
697
- t.usingClientEntryPoint = !1;
698
- }
699
- };
700
- }
701
- return wt;
702
- }
703
- var gi = pi();
704
- const In = L(
705
- ({
706
- title: e,
707
- description: t,
708
- color: n,
709
- icon: i,
710
- action: r,
711
- content: s,
712
- elevation: a = 3,
713
- shape: u = "smooth",
714
- status: g,
715
- className: m,
716
- ...d
717
- }, c) => {
718
- const l = I();
719
- l.bg(n), l.text.on(n);
720
- const f = g !== void 0 ? `uui-toast-${g}` : "";
721
- return /* @__PURE__ */ o(
722
- Pe,
723
- {
724
- className: ["uui-toast", m, f].filter(Boolean).join(" "),
725
- elevation: a,
726
- font: "bodyMedium",
727
- ref: c,
728
- shape: u,
729
- style: l.get(),
730
- ...d,
731
- children: s ?? /* @__PURE__ */ R(tt, { children: [
732
- i && /* @__PURE__ */ o("div", { className: "uui-icon", children: i }),
733
- /* @__PURE__ */ R("div", { className: "uui-toast-content", children: [
734
- e && /* @__PURE__ */ o("div", { className: "uui-toast-title", children: e }),
735
- t && /* @__PURE__ */ o("div", { className: "uui-toast-description", children: t }),
736
- r
737
- ] })
738
- ] })
739
- }
740
- );
741
- }
742
- );
743
- In.displayName = "Toast";
744
- const hi = ({
745
- position: e = "bottom-right",
746
- gap: t = 12
747
- }) => {
748
- const [n, i] = W([]);
749
- fe(() => bt.subscribe(i), []);
750
- const r = yi(e);
751
- return /* @__PURE__ */ o(
752
- Pe,
753
- {
754
- className: "uui-toast-viewport",
755
- id: Jt,
756
- position: "fixed",
757
- style: {
758
- ...r,
759
- flexDirection: "column",
760
- gap: t,
761
- zIndex: 1e3
762
- },
763
- children: n.map((s) => {
764
- const a = typeof s.action == "function" ? s.action(s.id) : s.action;
765
- return /* @__PURE__ */ o(In, { ...s, action: a }, s.id);
766
- })
767
- }
768
- );
769
- };
770
- function yi(e) {
771
- switch (e) {
772
- case "top-right":
773
- return { top: 16, right: 16 };
774
- case "top-left":
775
- return { top: 16, left: 16 };
776
- case "bottom-right":
777
- return { bottom: 16, right: 16 };
778
- case "bottom-left":
779
- return { bottom: 16, left: 16 };
780
- }
781
- }
782
- const Jt = "uui-toast-viewport-root";
783
- function bi() {
784
- if (document.getElementById(Jt))
785
- return;
786
- const e = document.createElement("div");
787
- e.id = Jt, document.body.appendChild(e), gi.createRoot(e).render(/* @__PURE__ */ o(hi, {}));
788
- }
789
- const hn = (e, t) => typeof e == "function" ? e(t) : e;
790
- function St(e) {
791
- bi();
792
- const t = typeof e == "string" ? { description: e } : e, n = t.id ?? crypto.randomUUID();
793
- return bt.add({ ...t, id: n }), n;
794
- }
795
- const Zo = Object.assign(St, {
796
- update: bt.update,
797
- dismiss: bt.remove,
798
- clear: bt.clear,
799
- success: (e, t) => St({ ...t, description: e, status: "success" }),
800
- error: (e, t) => St({ ...t, description: e, status: "error" }),
801
- info: (e, t) => St({ ...t, description: e, status: "info" }),
802
- warning: (e, t) => St({ ...t, description: e, status: "warning" }),
803
- async promise(e, t) {
804
- const n = St({ description: t.loading, duration: 0 });
805
- return e.then(
806
- (i) => (bt.update(n, {
807
- description: hn(t.success, i)
808
- }), i),
809
- (i) => {
810
- throw bt.update(n, {
811
- description: hn(t.error, i)
812
- }), i;
813
- }
814
- );
815
- }
816
- }), Tt = (e) => (
817
- // eslint-disable-next-line sonarjs/pseudo-random
818
- `${e}_${Math.floor((1 + Math.random()) * 65536).toString(16).substring(1)}`
819
- );
820
- function I(e) {
821
- const t = { ...e || {} };
822
- function n(l, f) {
823
- t[l] = f;
824
- }
825
- const i = (l) => `var(--uui-color-${l.replace(/[A-Z]/g, (f) => "-" + f.toLowerCase())})`, r = (l) => Object.assign(
826
- (f) => {
827
- f && l(i(f));
828
- },
829
- {
830
- on(f) {
831
- if (f) {
832
- const h = Ot[f];
833
- h !== void 0 && l(i(h));
834
- }
835
- },
836
- container(f) {
837
- f && l(i(`${f}Container`));
838
- },
839
- onContainer(f) {
840
- f && l(i(`on${ui(f)}Container`));
841
- },
842
- fixed(f) {
843
- f && l(i(`${f}Fixed`));
844
- },
845
- fixedDim(f) {
846
- f && l(i(`${f}FixedDim`));
847
- }
848
- }
849
- ), s = r((l) => {
850
- n("backgroundColor", l);
851
- }), a = r((l) => {
852
- n("color", l);
853
- }), u = r((l) => {
854
- n("borderColor", l);
855
- }), g = r((l) => {
856
- n("outlineColor", l);
857
- }), m = r((l) => {
858
- n("--uui-current-color", l);
859
- }), d = r((l) => {
860
- n("stroke", l);
861
- }), c = r((l) => {
862
- n("fill", l);
863
- });
864
- return {
865
- bg: s,
866
- text: a,
867
- border: u,
868
- outline: g,
869
- current: m,
870
- stroke: d,
871
- fill: c,
872
- set: n,
873
- get() {
874
- return t;
875
- },
876
- merge(l) {
877
- l && Object.assign(t, l);
878
- }
879
- };
880
- }
881
- const Pe = L((e, t) => {
882
- const {
883
- type: n = "flex",
884
- inline: i = !1,
885
- color: r,
886
- elevation: s,
887
- shape: a,
888
- border: u,
889
- direction: g,
890
- flow: m,
891
- borderColor: d,
892
- elementClass: c,
893
- children: l,
894
- className: f,
895
- style: h,
896
- font: C,
897
- fullWidth: w,
898
- fullHeight: y,
899
- grow: b,
900
- m: x,
901
- mx: F,
902
- my: B,
903
- mt: V,
904
- mb: P,
905
- ml: A,
906
- mr: D,
907
- p: M,
908
- px: S,
909
- py: v,
910
- pt: k,
911
- pb: T,
912
- pl: U,
913
- pr: Z,
914
- gap: ie,
915
- gapX: Se,
916
- gapY: he,
917
- justifyContent: z,
918
- alignItems: Ae,
919
- placeItems: De,
920
- alignContent: Oe,
921
- wrap: G,
922
- cols: X,
923
- rows: me,
924
- component: ge,
925
- row: pe,
926
- col: J,
927
- position: ve,
928
- top: se,
929
- right: H,
930
- bottom: j,
931
- left: Q,
932
- zIndex: Fe,
933
- ...oe
934
- } = e, ee = ge ?? "div", N = I(h);
935
- u && +u > 0 && N.border(ht(d)), N.bg(r), N.text.on(r);
936
- const Be = [];
937
- n === "flex" ? Be.push(i ? "uui-flex-inline" : "uui-flex") : n === "grid" ? Be.push(i ? "uui-grid-inline" : "uui-grid") : Be.push(i ? "uui-inline-block" : "uui-block"), w && N.set("width", "100%"), y && N.set("height", "100%"), b && Be.push("uui-grow"), x !== void 0 && N.set("margin", x), F !== void 0 && (N.set("marginLeft", F), N.set("marginRight", F)), B !== void 0 && (N.set("marginTop", B), N.set("marginBottom", B)), V !== void 0 && N.set("marginTop", V), P !== void 0 && N.set("marginBottom", P), A !== void 0 && N.set("marginLeft", A), D !== void 0 && N.set("marginRight", D), M !== void 0 && N.set("padding", M), S !== void 0 && (N.set("paddingLeft", S), N.set("paddingRight", S)), v !== void 0 && (N.set("paddingTop", v), N.set("paddingBottom", v)), k !== void 0 && N.set("paddingTop", k), T !== void 0 && N.set("paddingBottom", T), U !== void 0 && N.set("paddingLeft", U), Z !== void 0 && N.set("paddingRight", Z), ie !== void 0 && N.set("gap", ie), Se !== void 0 && N.set("columnGap", Se), he !== void 0 && N.set("rowGap", he), z !== void 0 && N.set("justifyContent", z), Ae !== void 0 && N.set("alignItems", Ae), De !== void 0 && N.set("placeItems", De), Oe !== void 0 && N.set("alignContent", Oe), G && n === "flex" && N.set("flexWrap", "wrap"), se !== void 0 && N.set("top", se), H !== void 0 && N.set("right", H), j !== void 0 && N.set("bottom", j), Q !== void 0 && N.set("left", Q), Fe !== void 0 && N.set("zIndex", Fe), n === "grid" && (X !== void 0 && N.set(
938
- "gridTemplateColumns",
939
- typeof X == "number" ? `repeat(${X}, 1fr)` : X
940
- ), me !== void 0 && N.set(
941
- "gridTemplateRows",
942
- typeof me == "number" ? `repeat(${me}, 1fr)` : me
943
- ));
944
- const _ = (pe ? "row" : void 0) ?? (J ? "col" : void 0) ?? g;
945
- let le = "";
946
- _ && n === "flex" && (le = _ === "col" ? "uui-flex-col" : "uui-flex-row");
947
- let Ne = "";
948
- m && n === "grid" && (Ne = m === "col" ? "uui-grid-flow-col" : "uui-grid-flow-row");
949
- const je = [
950
- f,
951
- "uui-box",
952
- ...C ? [Ce(C)] : [],
953
- c,
954
- ...Be,
955
- ...a ? [Re(a)] : [],
956
- ...s !== void 0 ? [st(s)] : [],
957
- ...u !== void 0 ? [Je(u)] : [],
958
- ...ve !== void 0 ? [`uui-${ve}`] : [],
959
- le,
960
- Ne
961
- ].filter(Boolean).join(" ");
962
- return /* @__PURE__ */ o(ee, { className: je, ref: t, ...oe, style: N.get(), children: l });
963
- });
964
- Pe.displayName = "BoxBase";
965
- const Vt = ({
966
- tooltip: e,
967
- align: t,
968
- triggerRef: n
969
- }) => {
970
- const [i, r] = W(!1), [s, a] = W(null), u = ne(null), { bgColor: g, textOnColor: m } = Wt("inverseSurface");
971
- fe(() => {
972
- const l = n.current;
973
- if (!l)
974
- return;
975
- const f = () => {
976
- r(!0);
977
- }, h = () => {
978
- r(!1), a(null);
979
- }, C = (w) => {
980
- w.target.matches(":focus-visible") && r(!0);
981
- };
982
- return l.addEventListener("mouseenter", f), l.addEventListener("mouseleave", h), l.addEventListener("focus", C), l.addEventListener("blur", h), () => {
983
- l.removeEventListener("mouseenter", f), l.removeEventListener("mouseleave", h), l.removeEventListener("focus", C), l.removeEventListener("blur", h);
984
- };
985
- }, [n]), fe(() => {
986
- if (!i)
987
- return;
988
- const l = requestAnimationFrame(() => {
989
- if (!u.current || !n.current)
990
- return;
991
- const f = En(n, u, {
992
- placement: t,
993
- offset: 8
994
- });
995
- f && a({ x: f.x, y: f.y });
996
- });
997
- return () => {
998
- cancelAnimationFrame(l);
999
- };
1000
- }, [t, i, n]);
1001
- const d = {
1002
- position: "absolute",
1003
- top: (s == null ? void 0 : s.y) ?? -9999,
1004
- left: (s == null ? void 0 : s.x) ?? -9999,
1005
- zIndex: 1e3,
1006
- opacity: s ? 1 : 0,
1007
- pointerEvents: "none",
1008
- visibility: s && i ? "visible" : "hidden"
1009
- }, c = [
1010
- m,
1011
- g,
1012
- "uui-tooltip",
1013
- "uui-font-body-small",
1014
- "uui-elevation-2",
1015
- "uui-px-2",
1016
- "uui-py-1",
1017
- "uui-corner-small"
1018
- ].join(" ");
1019
- return Qt(
1020
- /* @__PURE__ */ o("div", { className: c, ref: u, role: "tooltip", style: d, children: e }),
1021
- document.body
1022
- );
1023
- };
1024
- Vt.displayName = "InlineTooltipManager";
1025
- function Ci({
1026
- variant: e = "circular",
1027
- inline: t,
1028
- className: n
1029
- }) {
1030
- const i = [
1031
- "uui-spinner",
1032
- `uui-spinner-${e}`,
1033
- t && "uui-spinner-inline",
1034
- n
1035
- ].filter(Boolean).join(" ");
1036
- return e === "circular" ? /* @__PURE__ */ o("svg", { "aria-hidden": "true", className: i, viewBox: "22 22 44 44", children: /* @__PURE__ */ o(
1037
- "circle",
1038
- {
1039
- className: "uui-spinner-circle",
1040
- cx: "44",
1041
- cy: "44",
1042
- fill: "none",
1043
- r: "19.8",
1044
- strokeWidth: "4.6"
1045
- }
1046
- ) }) : e === "bars2" ? /* @__PURE__ */ R(
1047
- "svg",
1048
- {
1049
- className: "uui-bars-spinner",
1050
- viewBox: "0 0 48 48",
1051
- xmlns: "http://www.w3.org/2000/svg",
1052
- children: [
1053
- /* @__PURE__ */ o("rect", { height: "12", rx: "2", width: "4", x: "22" }),
1054
- /* @__PURE__ */ o(
1055
- "rect",
1056
- {
1057
- height: "12",
1058
- rx: "2",
1059
- transform: "rotate(-135 33.9 16.9)",
1060
- width: "4",
1061
- x: "33.9",
1062
- y: "16.9"
1063
- }
1064
- ),
1065
- /* @__PURE__ */ o(
1066
- "rect",
1067
- {
1068
- height: "12",
1069
- rx: "2",
1070
- transform: "rotate(-90 36 26)",
1071
- width: "4",
1072
- x: "36",
1073
- y: "26"
1074
- }
1075
- ),
1076
- /* @__PURE__ */ o(
1077
- "rect",
1078
- {
1079
- height: "12",
1080
- rx: "2",
1081
- transform: "rotate(-45 31.1 33.9)",
1082
- width: "4",
1083
- x: "31.1",
1084
- y: "33.9"
1085
- }
1086
- ),
1087
- /* @__PURE__ */ o("rect", { height: "12", rx: "2", width: "4", x: "22", y: "36" }),
1088
- /* @__PURE__ */ o(
1089
- "rect",
1090
- {
1091
- height: "12",
1092
- rx: "2",
1093
- transform: "rotate(-135 8.4 42.4)",
1094
- width: "4",
1095
- x: "8.4",
1096
- y: "42.4"
1097
- }
1098
- ),
1099
- /* @__PURE__ */ o(
1100
- "rect",
1101
- {
1102
- height: "12",
1103
- rx: "2",
1104
- transform: "rotate(-90 0 26)",
1105
- width: "4",
1106
- y: "26"
1107
- }
1108
- ),
1109
- /* @__PURE__ */ o(
1110
- "rect",
1111
- {
1112
- height: "12",
1113
- rx: "2",
1114
- transform: "rotate(-45 5.6 8.4)",
1115
- width: "4",
1116
- x: "5.6",
1117
- y: "8.4"
1118
- }
1119
- )
1120
- ]
1121
- }
1122
- ) : e === "orbit" ? /* @__PURE__ */ R(
1123
- "svg",
1124
- {
1125
- className: "uui-orbit-spinner",
1126
- viewBox: "0 0 48 48",
1127
- xmlns: "http://www.w3.org/2000/svg",
1128
- children: [
1129
- /* @__PURE__ */ o("circle", { cx: "24", cy: "4", r: "4" }),
1130
- /* @__PURE__ */ o("circle", { cx: "38.1421", cy: "9.8579", r: "4" }),
1131
- /* @__PURE__ */ o("circle", { cx: "44", cy: "24", r: "4" }),
1132
- /* @__PURE__ */ o("circle", { cx: "38.1421", cy: "38.1421", r: "4" }),
1133
- /* @__PURE__ */ o("circle", { cx: "24", cy: "44", r: "4" }),
1134
- /* @__PURE__ */ o("circle", { cx: "9.8579", cy: "38.1421", r: "4" }),
1135
- /* @__PURE__ */ o("circle", { cx: "4", cy: "24", r: "4" }),
1136
- /* @__PURE__ */ o("circle", { cx: "9.8579", cy: "9.8579", r: "4" })
1137
- ]
1138
- }
1139
- ) : e === "arc" ? /* @__PURE__ */ R(
1140
- "svg",
1141
- {
1142
- className: "uui-ring-spinner",
1143
- viewBox: "0 0 56 56",
1144
- xmlns: "http://www.w3.org/2000/svg",
1145
- children: [
1146
- /* @__PURE__ */ o(
1147
- "circle",
1148
- {
1149
- cx: "28",
1150
- cy: "28",
1151
- fill: "none",
1152
- opacity: "0.25",
1153
- r: "22",
1154
- stroke: "currentColor",
1155
- strokeWidth: "8"
1156
- }
1157
- ),
1158
- /* @__PURE__ */ o(
1159
- "circle",
1160
- {
1161
- cx: "28",
1162
- cy: "28",
1163
- fill: "none",
1164
- r: "22",
1165
- stroke: "currentColor",
1166
- strokeDasharray: "69 69",
1167
- strokeDashoffset: "0",
1168
- strokeLinecap: "butt",
1169
- strokeWidth: "8"
1170
- }
1171
- )
1172
- ]
1173
- }
1174
- ) : e === "stepBar" ? /* @__PURE__ */ R("svg", { className: "uui-bars-steps", viewBox: "0 0 48 48", children: [
1175
- /* @__PURE__ */ o("rect", { height: "8", rx: "4", width: "8", x: "6", y: "20" }),
1176
- /* @__PURE__ */ o("rect", { height: "8", rx: "4", width: "8", x: "20", y: "20" }),
1177
- /* @__PURE__ */ o("rect", { height: "8", rx: "4", width: "8", x: "34", y: "20" })
1178
- ] }) : /* @__PURE__ */ R(
1179
- "svg",
1180
- {
1181
- className: "uui-dots2-spinner",
1182
- viewBox: "0 0 48 48",
1183
- xmlns: "http://www.w3.org/2000/svg",
1184
- children: [
1185
- /* @__PURE__ */ o("circle", { cx: "10", cy: "24", r: "4" }),
1186
- /* @__PURE__ */ o("circle", { cx: "24", cy: "24", r: "4" }),
1187
- /* @__PURE__ */ o("circle", { cx: "38", cy: "24", r: "4" })
1188
- ]
1189
- }
1190
- );
1191
- }
1192
- const kt = L(
1193
- (e, t) => {
1194
- const {
1195
- color: n,
1196
- selectedColor: i,
1197
- className: r,
1198
- label: s,
1199
- title: a,
1200
- type: u = "button",
1201
- size: g = "small",
1202
- border: m,
1203
- borderColor: d,
1204
- hoverEffects: c = ["overlay", "elevate"],
1205
- pressedEffects: l = ["overlay", "elevate"],
1206
- touchEffects: f = ["ripple"],
1207
- selectedEffects: h = ["morph", "color"],
1208
- focusEffects: C = ["ring", "overlay"],
1209
- children: w,
1210
- outlined: y = !1,
1211
- filled: b = !1,
1212
- tonal: x = !1,
1213
- elevated: F = !1,
1214
- flat: B = !1,
1215
- elevation: V,
1216
- disabled: P,
1217
- textColor: A,
1218
- selectedTextColor: D,
1219
- shape: M = "round",
1220
- selectedShape: S = "rounded",
1221
- icon: v,
1222
- selectedIcon: k,
1223
- leading: T,
1224
- endIcon: U,
1225
- trailing: Z,
1226
- onClick: ie,
1227
- elementClass: Se,
1228
- font: he = "labelLarge",
1229
- upload: z,
1230
- uploadAccept: Ae,
1231
- uploadMultiple: De,
1232
- onUploadChange: Oe,
1233
- id: G = "",
1234
- name: X = "",
1235
- loading: me,
1236
- fullWidth: ge = !1,
1237
- link: pe,
1238
- selected: J,
1239
- defaultSelected: ve,
1240
- toggle: se = !1,
1241
- tooltipAlign: H = "auto",
1242
- density: j,
1243
- style: Q,
1244
- "aria-label": Fe,
1245
- ...oe
1246
- } = e, ee = J !== void 0, [N, Be] = W(
1247
- ve ?? !1
1248
- ), _ = ee ? J : N, le = ne(null), Ne = ne(null), je = ne(null), ae = ne(Tt("button")), Le = G || X || ae.current, xe = pe ? rt.cloneElement(pe, { ref: Ne, style: { display: "none" } }) : null, Ee = [
1249
- Se,
1250
- r,
1251
- "uui-wrapper uui-bb",
1252
- pt(j),
1253
- ...ge ? ["uui-full"] : []
1254
- ].filter(Boolean).join(" "), $e = [
1255
- "uui-btn-control",
1256
- Ce(he),
1257
- ...b ? ["uui-filled"] : [],
1258
- ...F ? ["uui-elevated"] : [],
1259
- ...x ? ["uui-tonal"] : [],
1260
- ...y ? ["uui-outlined"] : [],
1261
- ...C.includes("ring") ? ["uui-focus-ring"] : [],
1262
- ...C.includes("overlay") ? ["uui-focus-overlay"] : [],
1263
- ...c.includes("overlay") ? ["uui-hover-overlay"] : [],
1264
- ...l.includes("overlay") ? ["uui-pressed-overlay"] : [],
1265
- ...h.includes("overlay") ? ["uui-selected-overlay"] : [],
1266
- ...me ? ["uui-loading"] : [],
1267
- ...ge ? ["uui-full"] : [],
1268
- ...w ? [] : [Ct(g)],
1269
- ..._ ? ["uui-selected"] : []
1270
- ], ye = ["uui-state"], qe = se && _ && h.includes("morph") ? Re(S) : Re(M);
1271
- $e.push(qe), ye.push(qe);
1272
- const be = "uui-icon", Ie = se && _ ? k ?? T ?? v : T ?? v, Te = me ? /* @__PURE__ */ o("div", { className: be, children: /* @__PURE__ */ o(Ci, {}) }) : Ie && /* @__PURE__ */ o("div", { className: be, children: Ie }), ze = (Z ?? U) && /* @__PURE__ */ o("div", { className: be, children: Z ?? U });
1273
- let ue;
1274
- if (w) {
1275
- const te = [
1276
- "uui-btn-content uui-overflow-hidden",
1277
- qe,
1278
- Ce(he)
1279
- ].filter(Boolean).join(" ");
1280
- ue = /* @__PURE__ */ o("div", { className: te, children: w });
1281
- } else
1282
- ue = /* @__PURE__ */ R("div", { className: "uui-btn-content", children: [
1283
- Te,
1284
- s && /* @__PURE__ */ o("span", { className: "uui-label " + Ce(he), children: s }),
1285
- ze
1286
- ] });
1287
- const $ = I(Q), Y = I();
1288
- if (y || m !== void 0) {
1289
- $.border(ht(d));
1290
- const Xe = Je(m ?? (y ? 1 : 0));
1291
- $e.push(Xe);
1292
- }
1293
- let Me = V;
1294
- V === void 0 && (x || b ? B || (Me = F ? 1 : 0) : F && (Me = 1));
1295
- const K = [
1296
- ...c.includes("elevate") && !B ? ["uui-hover-elevate"] : [],
1297
- ...l.includes("elevate") && !B ? ["uui-pressed-elevate"] : []
1298
- ];
1299
- $e.push(
1300
- ...K,
1301
- st(Me)
1302
- );
1303
- const Qe = () => {
1304
- b ? ($.bg(n ?? "primary"), Y.bg.on(n ?? "primary"), A ? $.text(A) : $.text.on(n ?? "primary")) : x ? ($.bg.container("secondary"), Y.bg.onContainer("secondary"), A ? $.text(A) : $.text.onContainer("secondary")) : F ? ($.bg("surfaceContainerLow"), $.text(A ?? n ?? "primary"), Y.bg(n ?? "primary")) : y && !A ? ($.text.on("surfaceVariant"), Y.bg.on("surfaceVariant")) : ($.text(A ?? n ?? "primary"), Y.bg(A ?? n ?? "primary"));
1305
- }, Ze = () => {
1306
- n ? ($.bg(n), Y.bg.on(n), $.text.on(n)) : b ? ($.bg("surfaceContainer"), Y.bg.on("surfaceContainer"), $.text.on("surfaceVariant")) : F ? ($.bg("surfaceContainerLow"), Y.bg.on("surfaceContainerLow"), $.text("primary")) : x ? ($.bg.container("secondary"), Y.bg("secondary"), $.text.onContainer("secondary")) : y && !A ? ($.text.on("surfaceVariant"), Y.bg.on("surfaceVariant")) : ($.text(A ?? n ?? "primary"), Y.bg(A ?? n ?? "primary")), A && $.text(A);
1307
- }, q = () => {
1308
- const te = i ?? n ?? "primary";
1309
- x && !i ? ($.bg("secondary"), Y.bg.on("secondary"), D ? $.text(D) : $.text.on("secondary")) : y && !i ? ($.bg("inverseSurface"), Y.bg.on("inverseSurface"), D ? $.text(D) : $.text.on("inverseSurface")) : ($.bg(te), Y.bg.on(te), D ? $.text(D) : $.text.on(te));
1310
- };
1311
- se && h.includes("color") ? _ ? q() : Ze() : Qe();
1312
- const ce = (te) => {
1313
- var Xe;
1314
- if (!P) {
1315
- if (se) {
1316
- const Ve = !_;
1317
- ee || Be(Ve), (Xe = e.onChange) == null || Xe.call(e, {
1318
- ...te,
1319
- target: {
1320
- ...te.target,
1321
- name: X,
1322
- value: Ve
1323
- }
1324
- });
1325
- }
1326
- if (Ne.current) {
1327
- Ne.current.click();
1328
- return;
1329
- }
1330
- if (z && le.current) {
1331
- le.current.click();
1332
- return;
1333
- }
1334
- ie && ie(te), f.includes("ripple") && It(te.currentTarget, te);
1335
- }
1336
- }, He = a ? /* @__PURE__ */ o("div", { id: `${Le}-tip`, children: a }) : null;
1337
- let _e;
1338
- s && w && (_e = s), !s && !w && (_e = a);
1339
- const We = Fe ?? _e;
1340
- return /* @__PURE__ */ R("div", { className: Ee, children: [
1341
- z && /* @__PURE__ */ o(
1342
- "input",
1343
- {
1344
- accept: Ae,
1345
- "aria-labelledby": Le,
1346
- multiple: De,
1347
- onChange: Oe,
1348
- ref: le,
1349
- style: { display: "none" },
1350
- type: "file"
1351
- }
1352
- ),
1353
- /* @__PURE__ */ R(
1354
- "button",
1355
- {
1356
- "aria-busy": me,
1357
- "aria-describedby": a ? `${Le}-tip` : void 0,
1358
- "aria-haspopup": z ? "dialog" : void 0,
1359
- "aria-label": We,
1360
- "aria-pressed": se ? _ : void 0,
1361
- className: $e.join(" "),
1362
- disabled: P,
1363
- id: Le,
1364
- name: X || void 0,
1365
- onClick: ce,
1366
- ref: gt(t, je),
1367
- style: $.get(),
1368
- type: u,
1369
- ...oe,
1370
- children: [
1371
- /* @__PURE__ */ o("div", { className: ye.join(" "), style: Y.get() }),
1372
- ue
1373
- ]
1374
- }
1375
- ),
1376
- xe,
1377
- He && /* @__PURE__ */ o(
1378
- Vt,
1379
- {
1380
- align: H,
1381
- tooltip: He,
1382
- triggerRef: je
1383
- }
1384
- )
1385
- ] });
1386
- }
1387
- );
1388
- kt.displayName = "ButtonBase";
1389
- const Tn = Ht(
1390
- null
1391
- ), tn = Ht(null), Ut = Ht(
1392
- null
1393
- ), yn = {
1394
- darkMode: !1,
1395
- schemes: { light: {}, dark: {} }
1396
- }, Vn = Ht(null);
1397
- function Dn(e = {}) {
1398
- const { initial: t = "idle" } = e, [n, i] = W("idle"), [r, s] = W(!1), { t1: a = 0, t2: u, oneShot: g = !1 } = e, m = u ?? Math.round(a * 0.67), d = ne(null), c = () => d.current !== null ? (clearTimeout(d.current), d.current = null, !0) : !1, l = Bt(
1399
- (b) => {
1400
- function x(B, V) {
1401
- d.current = window.setTimeout(() => {
1402
- i(B);
1403
- }, V);
1404
- }
1405
- if (c() && s(!0), g) {
1406
- a ? (x("open", a), i("opening")) : i((B) => B === "opening" ? "open" : "opening");
1407
- return;
1408
- }
1409
- if (a) {
1410
- i((B) => {
1411
- const V = (
1412
- // eslint-disable-next-line no-nested-ternary
1413
- b === "closed" ? !0 : (
1414
- // eslint-disable-next-line sonarjs/no-nested-conditional
1415
- b === "open" ? !1 : B === "open" || B === "opening"
1416
- )
1417
- ), P = V ? "closing" : "opening", A = V ? "closed" : "open";
1418
- return x(A, A === "open" ? a : m), P;
1419
- });
1420
- return;
1421
- }
1422
- i((B) => {
1423
- switch (B) {
1424
- case "idle":
1425
- case "closed":
1426
- return "opening";
1427
- case "opening":
1428
- return "open";
1429
- case "open":
1430
- return "closing";
1431
- case "closing":
1432
- return "closed";
1433
- default:
1434
- return B;
1435
- }
1436
- });
1437
- },
1438
- [g, a, m]
1439
- );
1440
- fe(() => {
1441
- r && s(!1);
1442
- }, [r]), fe(() => {
1443
- t !== "idle" && l(t === "open" ? "open" : "closed");
1444
- }, []);
1445
- const f = n === "closing", h = n === "opening";
1446
- return {
1447
- opening: h,
1448
- closing: f,
1449
- animating: (h || f) && !r,
1450
- idle: n === "idle",
1451
- animationVars: {
1452
- "--uui-duration": `${h ? a : m}ms`,
1453
- "--uui-reverse": f ? "reverse" : "normal"
1454
- },
1455
- animate: l
1456
- };
1457
- }
1458
- function vi(e, t, n, i) {
1459
- fe(() => {
1460
- if (!e)
1461
- return;
1462
- const r = (s) => {
1463
- var m, d;
1464
- const a = s.target;
1465
- if (Array.isArray(t)) {
1466
- const c = t.some((f) => {
1467
- var h;
1468
- return (h = f.current) == null ? void 0 : h.contains(a);
1469
- }), l = ((m = i == null ? void 0 : i.current) == null ? void 0 : m.contains(a)) ?? !1;
1470
- !c && !l && n();
1471
- return;
1472
- }
1473
- const u = !!a.closest(t), g = ((d = i == null ? void 0 : i.current) == null ? void 0 : d.contains(a)) ?? !1;
1474
- !u && !g && n();
1475
- };
1476
- return document.addEventListener("mousedown", r), () => {
1477
- document.removeEventListener("mousedown", r);
1478
- };
1479
- }, [e, t, n, i]);
1480
- }
1481
- function xi(e, t) {
1482
- fe(() => {
1483
- if (!e)
1484
- return;
1485
- const n = (i) => {
1486
- i.key === "Escape" && t();
1487
- };
1488
- return document.addEventListener("keydown", n), () => {
1489
- document.removeEventListener("keydown", n);
1490
- };
1491
- }, [e, t]);
1492
- }
1493
- function qt() {
1494
- return ci(), ni(
1495
- () => () => {
1496
- },
1497
- () => di() === "keyboard",
1498
- () => !1
1499
- );
1500
- }
1501
- function wi(e) {
1502
- const t = qt(), [n, i] = W(!1);
1503
- return fe(() => {
1504
- const r = e.current;
1505
- if (!r)
1506
- return;
1507
- const s = () => {
1508
- i(!0);
1509
- }, a = () => {
1510
- i(!1);
1511
- };
1512
- return r.addEventListener("focus", s, !0), r.addEventListener("blur", a, !0), () => {
1513
- r.removeEventListener("focus", s, !0), r.removeEventListener("blur", a, !0);
1514
- };
1515
- }, [e]), {
1516
- isFocused: n,
1517
- focusVisible: t
1518
- };
1519
- }
1520
- function Si(e, t, n = !0) {
1521
- fe(() => {
1522
- if (!n)
1523
- return;
1524
- const i = e.current;
1525
- if (!i)
1526
- return;
1527
- const r = new ResizeObserver(([s]) => {
1528
- const { width: a, height: u } = s.contentRect;
1529
- t({ width: a, height: u });
1530
- });
1531
- return r.observe(i), () => {
1532
- r.disconnect();
1533
- };
1534
- }, [e, t, n]);
1535
- }
1536
- function Mn() {
1537
- const e = $t(Ut);
1538
- if (!e)
1539
- throw new Error(
1540
- "useSelection must be used within a SelectionContext provider"
1541
- );
1542
- return e;
1543
- }
1544
- function Ko() {
1545
- const e = $t(Vn);
1546
- if (!e)
1547
- throw new Error("useTheme must be used within a <ThemeProvider>");
1548
- return e;
1549
- }
1550
- const nn = L(
1551
- (e, t) => {
1552
- const {
1553
- elementClass: n,
1554
- density: i,
1555
- icon: r,
1556
- disabled: s,
1557
- elevation: a,
1558
- checked: u,
1559
- children: g,
1560
- color: m,
1561
- uncheckedColor: d,
1562
- defaultChecked: c,
1563
- indeterminate: l,
1564
- hoverEffects: f = ["overlay"],
1565
- touchEffects: h = ["ripple"],
1566
- focusEffects: C = ["ring"],
1567
- selectedEffects: w = [],
1568
- pressedEffects: y = ["overlay"],
1569
- id: b,
1570
- name: x,
1571
- label: F,
1572
- font: B,
1573
- border: V,
1574
- borderColor: P,
1575
- uncheckedBorder: A,
1576
- uncheckedBorderColor: D,
1577
- onChange: M,
1578
- onClick: S,
1579
- type: v,
1580
- required: k,
1581
- shape: T = "smooth",
1582
- title: U,
1583
- filled: Z,
1584
- value: ie,
1585
- size: Se = "small",
1586
- uncheckedIcon: he,
1587
- indeterminateIcon: z,
1588
- description: Ae,
1589
- descriptionColor: De,
1590
- descriptionFont: Oe,
1591
- className: G,
1592
- error: X,
1593
- animation: me,
1594
- duration: ge = 150,
1595
- motionStyle: pe = "regular",
1596
- focusColor: J,
1597
- labelColor: ve,
1598
- textColor: se,
1599
- readOnly: H,
1600
- tooltipAlign: j = "auto",
1601
- textPlacement: Q = "end",
1602
- "aria-label": Fe,
1603
- ...oe
1604
- } = e, { animationVars: ee, animate: N, animating: Be } = Dn({
1605
- t1: ge,
1606
- oneShot: !0
1607
- }), _ = $t(Tn), le = v === "radio" ? x ?? (_ == null ? void 0 : _.name) : x, Ne = $t(tn), je = s ?? (Ne == null ? void 0 : Ne.disabled), ae = qt(), [Le, xe] = W(!1), Ee = ne(null), $e = ne(null), ye = ne(null), qe = ne(Tt("check")), be = b ?? qe.current, Ie = u !== void 0, [Te, ze] = W(
1608
- c ?? !1
1609
- );
1610
- let ue;
1611
- Ie ? ue = !!u : (_ == null ? void 0 : _.value) !== void 0 ? ue = _.value === ie : ue = Te;
1612
- const $ = l ? "indeterminate" : ue ? "checked" : "unchecked", [Y, Me] = W($), K = Fe ?? (F ? void 0 : U), Qe = X ? "error" : !ue && !l && d ? d : m, Ze = U ? /* @__PURE__ */ o("div", { id: `${be}-tip`, children: U }) : null, q = (Ue) => {
1613
- if (H) {
1614
- Ue.preventDefault();
1615
- return;
1616
- }
1617
- const lt = Ue.currentTarget;
1618
- Ie || (v === "radio" && (_ != null && _.setValue) && _.setValue(lt.value), ze(lt.checked)), M == null || M(Ue);
1619
- }, ce = (Ue) => {
1620
- if (H) {
1621
- Ue.preventDefault();
1622
- return;
1623
- }
1624
- h.includes("ripple") && ye.current && $e.current && It(ye.current, Ue, $e.current), S == null || S(Ue);
1625
- }, He = (Ue) => {
1626
- var lt;
1627
- xe(!0), (lt = e.onFocus) == null || lt.call(e, Ue);
1628
- }, _e = (Ue) => {
1629
- var lt;
1630
- xe(!1), (lt = e.onBlur) == null || lt.call(e, Ue);
1631
- };
1632
- fe(() => {
1633
- $ !== Y && me && N();
1634
- }, [$, Y, me, N]), fe(() => {
1635
- Be || Me($);
1636
- }, [Be, $]);
1637
- const We = I(), te = [
1638
- n,
1639
- "uui-cb",
1640
- pt(i),
1641
- G,
1642
- je && "uui-disabled",
1643
- ...g ? [] : [Ct(Se)]
1644
- ].filter(Boolean).join(" "), Xe = [
1645
- "uui-cb-control",
1646
- ue && "uui-checked",
1647
- l && "uui-indeterminate",
1648
- Z && "uui-filled",
1649
- ...f.includes("overlay") && !H ? ["uui-hover-overlay"] : [],
1650
- ...C.includes("overlay") && ae && Le ? ["uui-focus-overlay"] : [],
1651
- ...w.includes("overlay") ? ["uui-selected-overlay"] : [],
1652
- ...y.includes("overlay") && !H ? ["uui-pressed-overlay"] : [],
1653
- ...g ? [Re(T)] : ["uui-round"]
1654
- ].filter(Boolean).join(" "), Ve = I();
1655
- J && ae && Le && Ve.set(
1656
- "--uui-focus-color",
1657
- $n(J).color
1658
- );
1659
- const re = [
1660
- "uui-input",
1661
- C.includes("ring") && ae && Le && "uui-focus-visible uui-focus-ring"
1662
- ].filter(Boolean).join(" "), et = ["uui-state"].filter(Boolean).join(" "), Ge = I();
1663
- Ge.bg(Qe);
1664
- const ct = [
1665
- "uui-cb-glyph",
1666
- st(a),
1667
- Re(T),
1668
- Je(ue ? V : A)
1669
- ].filter(Boolean).join(" "), it = I(), vt = Bn(me), Ke = [
1670
- "uui-icon",
1671
- Be && vt,
1672
- Ln(pe)
1673
- ].filter(Boolean).join(" "), de = I();
1674
- de.merge(ee), ue || l || d ? (it.border(X ? "error" : P), Z ? (!ue && !he && !l || it.bg(Qe), de.text.on(Qe)) : de.text(Qe)) : (Z && he ? (de.text(X ? "onError" : "surface"), it.bg(X ? "error" : "onSurfaceVariant")) : he && de.text(X ? "error" : "onSurfaceVariant"), it.border(X ? "error" : D));
1675
- let Ye;
1676
- if (g) {
1677
- const Ue = [
1678
- "uui-cb-content uui-overflow-hidden",
1679
- Re(T),
1680
- Je(V)
1681
- ].filter(Boolean).join(" ");
1682
- Ye = /* @__PURE__ */ o("div", { className: Ue, children: g });
1683
- } else {
1684
- const Ue = (
1685
- // eslint-disable-next-line no-nested-ternary
1686
- Y === "indeterminate" ? z : Y === "checked" ? r : he
1687
- );
1688
- Ye = /* @__PURE__ */ o("div", { className: ct, style: it.get(), children: /* @__PURE__ */ o("div", { className: Ke, style: de.get(), children: Ue }) });
1689
- }
1690
- const xt = I();
1691
- xt.text(
1692
- (X ? "error" : void 0) ?? ve ?? se ?? "onSurface"
1693
- );
1694
- const Dt = [
1695
- Ce(B ?? "bodyMedium"),
1696
- "uui-cb-label"
1697
- ].join(" "), Mt = F && /* @__PURE__ */ R("label", { className: Dt, htmlFor: be, style: xt.get(), children: [
1698
- F,
1699
- k && /* @__PURE__ */ o("span", { "aria-hidden": "true", className: "uui-required", children: "*" })
1700
- ] }), dt = I();
1701
- X ? dt.text("error") : De ? dt.text(De) : dt.text.on("surfaceVariant");
1702
- const Zt = [
1703
- Ce(Oe ?? "bodySmall"),
1704
- X && "uui-error uui-support-text",
1705
- Ae && !X && "uui-description uui-support-text"
1706
- ].filter(Boolean).join(" "), Rt = (Ae ?? X) && /* @__PURE__ */ o("div", { className: Zt, style: dt.get(), children: X ?? Ae }), Kt = (Mt ?? Rt) && /* @__PURE__ */ R(tt, { children: [
1707
- Mt,
1708
- Rt
1709
- ] }), yt = I();
1710
- return Q === "end" ? (xt.set("gridColumn", 2), dt.set("gridColumn", 2), yt.set("gridColumn", 1)) : Q === "start" ? (xt.set("gridColumn", 1), dt.set("gridColumn", 1), yt.set("gridColumn", 2), yt.set("gridRow", 1)) : (We.set("gridTemplateColumns", "1fr"), We.set("justifyItems", "start")), Q === "top" && (yt.set("order", 1), dt.set("order", 2)), /* @__PURE__ */ R("div", { className: te, style: We.get(), children: [
1711
- /* @__PURE__ */ o(
1712
- "div",
1713
- {
1714
- className: "uui-cb-control-wrapper",
1715
- style: yt.get(),
1716
- children: /* @__PURE__ */ R(
1717
- "div",
1718
- {
1719
- className: Xe,
1720
- ref: $e,
1721
- style: Ve.get(),
1722
- children: [
1723
- /* @__PURE__ */ o(
1724
- "input",
1725
- {
1726
- "aria-label": K,
1727
- "aria-readonly": H === !0 ? !0 : void 0,
1728
- checked: !!ue,
1729
- className: re,
1730
- disabled: je,
1731
- id: be,
1732
- name: le,
1733
- onBlur: _e,
1734
- onChange: q,
1735
- onClick: ce,
1736
- onFocus: He,
1737
- readOnly: H,
1738
- ref: gt(Ee, t),
1739
- type: v,
1740
- value: ie,
1741
- ...oe
1742
- }
1743
- ),
1744
- /* @__PURE__ */ o(
1745
- "div",
1746
- {
1747
- className: et,
1748
- ref: ye,
1749
- style: Ge.get()
1750
- }
1751
- ),
1752
- Ye
1753
- ]
1754
- }
1755
- )
1756
- }
1757
- ),
1758
- Kt,
1759
- Ze && /* @__PURE__ */ o(
1760
- Vt,
1761
- {
1762
- align: j,
1763
- tooltip: Ze,
1764
- triggerRef: Ee
1765
- }
1766
- )
1767
- ] });
1768
- }
1769
- );
1770
- nn.displayName = "CheckBoxBase";
1771
- const Ni = {
1772
- basic: "scale",
1773
- fullscreen: "fade",
1774
- dockBottom: "slideUp",
1775
- dockTop: "slideDown",
1776
- dockRight: "slideRight",
1777
- dockLeft: "slideLeft"
1778
- }, ki = (e, t) => e === "auto" ? Ni[t] : e, bn = typeof document < "u" ? document.getElementById("dialog-root") ?? document.body : null, zt = L(
1779
- ({
1780
- open: e,
1781
- onClose: t,
1782
- type: n = "basic",
1783
- color: i = "surfaceContainerHigh",
1784
- elevation: r = 3,
1785
- shape: s = "rounded",
1786
- border: a = 0,
1787
- borderColor: u,
1788
- size: g = "small",
1789
- animation: m = "auto",
1790
- duration: d = 250,
1791
- disableBackdropClose: c,
1792
- disableEscapeKey: l,
1793
- children: f,
1794
- className: h,
1795
- motionStyle: C = "regular",
1796
- modal: w = !1
1797
- }, y) => {
1798
- const b = ne(null), [x, F] = W(!1), [B, V] = W(!1), [P, A] = W(), [D, M] = W(!1), [S, v] = W("normal"), k = ne(null), T = () => b.current ? Array.from(
1799
- b.current.querySelectorAll(
1800
- 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
1801
- )
1802
- ).filter(
1803
- (J) => !J.hasAttribute("disabled") && J.getAttribute("aria-hidden") !== "true"
1804
- ) : [];
1805
- fe(() => {
1806
- if (e)
1807
- F(!0), v("normal"), M(!0), A(!0);
1808
- else {
1809
- v("reverse"), M(!1), A(!1);
1810
- const J = setTimeout(() => {
1811
- F(!1);
1812
- }, d);
1813
- return () => {
1814
- clearTimeout(J);
1815
- };
1816
- }
1817
- }, [e, d]), fe(() => {
1818
- S === "reverse" && M(!0);
1819
- }, [S]), fe(() => {
1820
- P === !0 ? V(!0) : P === !1 && V(!1);
1821
- }, [P]), xi(!l && x, () => t == null ? void 0 : t());
1822
- const U = (J) => {
1823
- c || J.target === J.currentTarget && (t == null || t());
1824
- };
1825
- if (fe(() => {
1826
- if (x) {
1827
- const J = document.body.style.overflow;
1828
- return document.body.style.overflow = "hidden", () => {
1829
- document.body.style.overflow = J;
1830
- };
1831
- }
1832
- }, [x]), fe(() => {
1833
- if (!x || !w)
1834
- return;
1835
- const J = T();
1836
- k.current = document.activeElement;
1837
- const ve = J.length > 0 ? J[0] : b.current;
1838
- ve && ve.focus();
1839
- const se = (H) => {
1840
- if (H.key !== "Tab")
1841
- return;
1842
- const j = T();
1843
- if (j.length === 0) {
1844
- H.preventDefault();
1845
- return;
1846
- }
1847
- const Q = j[0], Fe = j[j.length - 1];
1848
- H.shiftKey && document.activeElement === Q && (H.preventDefault(), Fe.focus()), !H.shiftKey && document.activeElement === Fe && (H.preventDefault(), Q.focus());
1849
- };
1850
- return document.addEventListener("keydown", se), () => {
1851
- var H;
1852
- document.removeEventListener("keydown", se), (H = k.current) == null || H.focus();
1853
- };
1854
- }, [w, x]), !x || !bn)
1855
- return null;
1856
- const Z = Re(s), ie = Je(a), Se = en(ht(u)), he = st(r), { bgColor: z, textOnColor: Ae } = Wt(i), De = ki(m, n), Oe = De === "none" ? "" : _t[De], G = C === "expressive" ? "uui-motion-expressive" : "", X = {
1857
- "--uui-duration": String(d * 0.65) + "ms"
1858
- }, me = {
1859
- "--uui-reverse": S,
1860
- "--uui-duration": S === "reverse" ? String(d * 0.67) + "ms" : String(d) + "ms"
1861
- }, ge = [
1862
- "uui-dialog-backdrop",
1863
- B && "uui-open"
1864
- ].filter(Boolean).join(" "), pe = [
1865
- "uui-db",
1866
- `uui-dialog-${n}`,
1867
- Z,
1868
- ie,
1869
- Ct(g),
1870
- Se,
1871
- he,
1872
- z,
1873
- Ae,
1874
- D && Oe,
1875
- G,
1876
- h
1877
- ].filter(Boolean).join(" ");
1878
- return Qt(
1879
- // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
1880
- /* @__PURE__ */ o(
1881
- "div",
1882
- {
1883
- className: ge,
1884
- onClick: U,
1885
- style: X,
1886
- children: /* @__PURE__ */ o(
1887
- "div",
1888
- {
1889
- className: pe,
1890
- ref: gt(y, b),
1891
- style: me,
1892
- children: f
1893
- }
1894
- )
1895
- }
1896
- ),
1897
- bn
1898
- );
1899
- }
1900
- );
1901
- zt.displayName = "Dialog";
1902
- const nt = L(
1903
- (e, t) => {
1904
- const {
1905
- elementClass: n,
1906
- color: i,
1907
- density: r,
1908
- label: s,
1909
- labelColor: a,
1910
- labelFont: u,
1911
- id: g,
1912
- outlined: m,
1913
- filled: d,
1914
- classic: c,
1915
- disabled: l,
1916
- font: f,
1917
- placeholderFont: h,
1918
- placeholderColor: C,
1919
- border: w,
1920
- borderColor: y,
1921
- shape: b,
1922
- required: x,
1923
- title: F,
1924
- description: B,
1925
- descriptionColor: V,
1926
- descriptionFont: P,
1927
- name: A,
1928
- error: D,
1929
- className: M,
1930
- placeholder: S,
1931
- type: v = "text",
1932
- icon: k,
1933
- leading: T,
1934
- trailing: U,
1935
- endIcon: Z,
1936
- variant: ie,
1937
- value: Se,
1938
- textColor: he,
1939
- defaultValue: z,
1940
- ...Ae
1941
- } = e, [De, Oe] = W(z ?? ""), G = Se !== void 0, me = (G ? Se : De).length === 0, ge = ne(null), pe = ne(null), J = g ?? Tt("input"), [ve, se] = W(0), H = T ?? k, j = ie ?? (d && "filled") ?? (m && "outlined") ?? (c && "classic") ?? "filled", { isFocused: Q } = wi(ge), Fe = (q) => {
1942
- var ce;
1943
- G || Oe(q.target.value), (ce = e.onChange) == null || ce.call(e, q);
1944
- }, oe = (q) => {
1945
- var ce;
1946
- q.preventDefault(), (ce = ge.current) == null || ce.focus();
1947
- };
1948
- fe(() => {
1949
- const q = ge.current;
1950
- q && q.value && Oe(q.value);
1951
- }, []), vn(() => {
1952
- const q = pe.current, ce = ge.current;
1953
- if (!q || !ce)
1954
- return;
1955
- const He = q.getBoundingClientRect().left - ce.getBoundingClientRect().left + 16;
1956
- se((_e) => _e === He ? _e : He);
1957
- }, [H]);
1958
- const ee = [
1959
- n,
1960
- M,
1961
- "uui-field uui-field-wrapper",
1962
- `uui-${j}`,
1963
- pt(r)
1964
- ], N = H && /* @__PURE__ */ o("div", { className: "uui-leading", children: rt.Children.map(
1965
- H,
1966
- (q) => q ? /* @__PURE__ */ o(
1967
- "span",
1968
- {
1969
- className: "uui-slot",
1970
- onClick: (ce) => {
1971
- ce.stopPropagation();
1972
- },
1973
- children: q
1974
- }
1975
- ) : null
1976
- ) }), Be = U ?? Z, _ = Be && /* @__PURE__ */ o("div", { className: "uui-trailing", children: rt.Children.map(
1977
- Be,
1978
- (q) => q ? /* @__PURE__ */ o(
1979
- "span",
1980
- {
1981
- className: "uui-slot",
1982
- onClick: (ce) => {
1983
- ce.stopPropagation();
1984
- },
1985
- children: q
1986
- }
1987
- ) : null
1988
- ) }), le = s && /* @__PURE__ */ R(tt, { children: [
1989
- s,
1990
- x && /* @__PURE__ */ o("span", { "aria-hidden": "true", className: "uui-required", children: "*" })
1991
- ] }), Ne = w ?? (j !== "filled" ? 1 : void 0), je = [
1992
- "uui-field-control",
1993
- Ce(f ?? "bodyLarge"),
1994
- Re(b ?? "rounded"),
1995
- j !== "outlined" && Je(Ne),
1996
- D && "uui-error",
1997
- Q && "uui-active",
1998
- l && "uui-disabled",
1999
- N && "uui-has-leading",
2000
- _ && "uui-has-trailing"
2001
- ];
2002
- let ae, Le, xe, Ee;
2003
- const $e = I(), ye = ["uui-fb-label"];
2004
- if (le)
2005
- if (j !== "classic")
2006
- Q || !me ? ($e.text((D ? "error" : void 0) ?? i ?? "primary"), ye.push(Ce(u ?? "bodySmall")), je.push("uui-fb-label-up")) : ($e.text((D ? "error" : void 0) ?? "onSurfaceVariant"), ye.push(Ce(f ?? "bodyLarge"))), ye.push("uui-field-float-label"), j === "outlined" ? (xe = /* @__PURE__ */ o("legend", { className: Ce(u ?? "bodySmall"), children: le }), ae = /* @__PURE__ */ o("span", { className: ye.join(" "), children: le })) : (Le = /* @__PURE__ */ o("span", { className: Ce(u ?? "bodySmall"), children: " " }), ae = /* @__PURE__ */ o("span", { className: ye.join(" "), children: le }));
2007
- else {
2008
- $e.text((D ? "error" : void 0) ?? "onSurface"), ye.push(Ce(u ?? "bodyMedium"));
2009
- const q = ye.filter(Boolean).join(" ");
2010
- Ee = /* @__PURE__ */ o(
2011
- "label",
2012
- {
2013
- className: q,
2014
- htmlFor: J,
2015
- style: $e.get(),
2016
- children: le
2017
- }
2018
- );
2019
- }
2020
- let qe;
2021
- if (j === "outlined") {
2022
- const q = [
2023
- "uui-field-fieldset",
2024
- Re(b ?? "rounded")
2025
- ].filter(Boolean).join(" "), ce = I(), He = wn(0, 4, w, 1);
2026
- ce.set("borderWidth", `${He}px`), ce.border(y ?? "onSurfaceVariant"), qe = /* @__PURE__ */ o("fieldset", { className: q, style: ce.get(), children: xe });
2027
- }
2028
- const be = I();
2029
- be.set("--uui-label-up-x", `${ve}px`), j === "classic" && be.border(y ?? "outline"), j === "filled" && be.border(y ?? "onSurfaceVariant");
2030
- const Ie = ["uui-field-state"].filter(Boolean).join(" "), Te = I(), ze = I();
2031
- D ? ze.text("error") : V ? ze.text(V) : ze.text.on("surfaceVariant");
2032
- const ue = [
2033
- Ce(P ?? "bodySmall"),
2034
- D && "uui-error uui-support-text",
2035
- B && !D && "uui-description uui-support-text"
2036
- ].filter(Boolean).join(" "), $ = (B ?? D) && /* @__PURE__ */ o("div", { className: ue, style: ze.get(), children: D ?? B }), Y = "uui-field-input", Me = I();
2037
- Me.text("onSurface"), !Q && ae && me && Me.set("opacity", 0);
2038
- const K = ["uui-field-input-wrapper"].filter(Boolean).join(" "), Qe = ee.filter(Boolean).join(" "), Ze = je.filter(Boolean).join(" ");
2039
- return /* @__PURE__ */ R("div", { className: Qe, title: F, children: [
2040
- Ee,
2041
- /* @__PURE__ */ R(
2042
- "div",
2043
- {
2044
- className: Ze,
2045
- onPointerDown: oe,
2046
- ref: pe,
2047
- style: be.get(),
2048
- children: [
2049
- N,
2050
- /* @__PURE__ */ R("div", { className: K, children: [
2051
- Le,
2052
- ae,
2053
- /* @__PURE__ */ o(
2054
- "input",
2055
- {
2056
- ...Ae,
2057
- ...G ? { value: Se } : { defaultValue: z },
2058
- "aria-invalid": !!D,
2059
- autoComplete: "email",
2060
- className: Y,
2061
- disabled: l,
2062
- id: J,
2063
- name: A,
2064
- onChange: Fe,
2065
- placeholder: S,
2066
- ref: gt(t, ge),
2067
- style: Me.get(),
2068
- type: v
2069
- }
2070
- )
2071
- ] }),
2072
- _,
2073
- j === "filled" && /* @__PURE__ */ o("div", { className: Ie, style: Te.get() }),
2074
- qe
2075
- ]
2076
- }
2077
- ),
2078
- $
2079
- ] });
2080
- }
2081
- );
2082
- nt.displayName = "FieldBase";
2083
- const ut = L((e, t) => {
2084
- const {
2085
- component: n,
2086
- font: i,
2087
- color: r,
2088
- elevation: s,
2089
- shape: a,
2090
- border: u,
2091
- borderColor: g,
2092
- elementClass: m,
2093
- children: d,
2094
- className: c,
2095
- style: l,
2096
- ...f
2097
- } = e, h = n ?? "span", C = I(l);
2098
- u && +u > 0 && C.border(ht(g)), C.bg(r), C.text.on(r);
2099
- const w = [
2100
- "uui-inline",
2101
- m,
2102
- ...i ? [Ce(i)] : [],
2103
- ...a ? [Re(a)] : [],
2104
- ...s !== void 0 ? [st(s)] : [],
2105
- ...u !== void 0 ? [Je(u)] : [],
2106
- c
2107
- ].filter(Boolean).join(" ");
2108
- return /* @__PURE__ */ o(h, { className: w, ref: t, style: C.get(), ...f, children: d });
2109
- });
2110
- ut.displayName = "TextBase";
2111
- const Fi = L(
2112
- ({ font: e, size: t = "small", ...n }, i) => /* @__PURE__ */ o(
2113
- kt,
2114
- {
2115
- font: e ?? {
2116
- extraSmall: "labelLarge",
2117
- small: "labelLarge",
2118
- medium: "titleMedium",
2119
- large: "headlineSmall",
2120
- extraLarge: "headlineLarge"
2121
- }[t],
2122
- ref: i,
2123
- size: t,
2124
- ...n,
2125
- elementClass: "uui-button"
2126
- }
2127
- )
2128
- );
2129
- Fi.displayName = "Button";
2130
- const Bi = L(
2131
- ({
2132
- font: e,
2133
- size: t = "small",
2134
- shape: n = "smooth",
2135
- selectedShape: i = "smooth",
2136
- borderColor: r = "outlineVariant",
2137
- ...s
2138
- }, a) => /* @__PURE__ */ o(
2139
- kt,
2140
- {
2141
- borderColor: r,
2142
- font: e ?? {
2143
- extraSmall: "labelLarge",
2144
- small: "labelLarge",
2145
- medium: "titleMedium",
2146
- large: "headlineSmall",
2147
- extraLarge: "headlineLarge"
2148
- }[t],
2149
- ref: a,
2150
- selectedShape: i,
2151
- ...s,
2152
- elementClass: "uui-chip",
2153
- shape: n,
2154
- size: t
2155
- }
2156
- )
2157
- );
2158
- Bi.displayName = "Chip";
2159
- const on = (e) => {
2160
- const {
2161
- children: t,
2162
- className: n,
2163
- border: i,
2164
- borderColor: r,
2165
- color: s = "error",
2166
- align: a = "topRight",
2167
- shape: u = "round",
2168
- size: g = "medium",
2169
- elevation: m,
2170
- ariaLabel: d,
2171
- value: c,
2172
- font: l,
2173
- offset: f,
2174
- ...h
2175
- } = e, C = "uui-badge", w = l ?? (g === "extraLarge" || g === "large" ? "labelMedium" : "labelSmall"), y = [
2176
- "uui-badge-control",
2177
- n,
2178
- Re(u),
2179
- Ct(g),
2180
- Ce(w)
2181
- ], b = ["uui-badge-slot", si(a)].filter(Boolean).join(" "), x = I();
2182
- x.bg(s), x.text.on(s), f !== void 0 && x.set("--uui-badge-offset", `${f}px`), m !== void 0 && y.push(st(m)), i !== void 0 && (y.push(Je(i)), x.border(ht(r)));
2183
- const F = y.filter(Boolean).join(" "), B = /* @__PURE__ */ o(
2184
- "span",
2185
- {
2186
- "aria-label": d,
2187
- className: F,
2188
- style: x.get(),
2189
- children: g !== "small" && g !== "extraSmall" && c
2190
- }
2191
- );
2192
- return t ? /* @__PURE__ */ R("span", { className: C, ...h, children: [
2193
- t,
2194
- /* @__PURE__ */ o("span", { className: b, children: B })
2195
- ] }) : B;
2196
- };
2197
- on.displayName = "Badge";
2198
- const Li = L(
2199
- ({
2200
- children: e,
2201
- className: t = "",
2202
- color: n = "error",
2203
- position: i = "topRight",
2204
- shape: r = "round",
2205
- size: s = "medium",
2206
- outlined: a,
2207
- raised: u,
2208
- filled: g = !0,
2209
- value: m,
2210
- ...d
2211
- }, c) => {
2212
- const { bgColor: l, textOnColor: f, textColor: h } = li(n);
2213
- return en(n), /* @__PURE__ */ o("span", { className: ["uui-card-wrapper"].join(" "), ref: c, ...d, children: e });
2214
- }
2215
- );
2216
- Li.displayName = "Card";
2217
- const $i = /* @__PURE__ */ o("svg", { fill: "none", viewBox: "3 3 18 18", children: /* @__PURE__ */ o(
2218
- "path",
2219
- {
2220
- d: "M10 16.4L6 12.4L7.4 11L10 13.6L16.6 7L18 8.4L10 16.4Z",
2221
- fill: "currentColor"
2222
- }
2223
- ) }), Ei = /* @__PURE__ */ o("svg", { fill: "none", viewBox: "3 3 18 18", children: /* @__PURE__ */ o("path", { d: "M6 13V11H18V13H6Z", fill: "currentColor" }) }), Ii = /* @__PURE__ */ o("svg", { fill: "none", viewBox: "2 2 20 20", children: /* @__PURE__ */ o(
2224
- "path",
2225
- {
2226
- d: "M12 17C13.3833 17 14.5625 16.5125 15.5375 15.5375C16.5125 14.5625 17 13.3833 17 12C17 10.6167 16.5125 9.4375 15.5375 8.4625C14.5625 7.4875 13.3833 7 12 7C10.6167 7 9.4375 7.4875 8.4625 8.4625C7.4875 9.4375 7 10.6167 7 12C7 13.3833 7.4875 14.5625 8.4625 15.5375C9.4375 16.5125 10.6167 17 12 17Z",
2227
- fill: "currentColor"
2228
- }
2229
- ) }), Rn = /* @__PURE__ */ o("svg", { fill: "none", viewBox: "0 0 24 24", children: /* @__PURE__ */ o("path", { d: "M10 17V7L15 12L10 17Z", fill: "currentColor" }) }), Ti = /* @__PURE__ */ o("svg", { fill: "none", viewBox: "0 0 24 24", children: /* @__PURE__ */ o(
2230
- "path",
2231
- {
2232
- d: "M9.5501 18L3.8501 12.3L5.2751 10.875L9.5501 15.15L18.7251 5.97498L20.1501 7.39998L9.5501 18Z",
2233
- fill: "currentColor"
2234
- }
2235
- ) }), An = /* @__PURE__ */ o("svg", { fill: "none", viewBox: "0 0 24 24", children: /* @__PURE__ */ o(
2236
- "path",
2237
- {
2238
- d: "M12 17C13.3833 17 14.5625 16.5125 15.5375 15.5375C16.5125 14.5625 17 13.3833 17 12C17 10.6167 16.5125 9.4375 15.5375 8.4625C14.5625 7.4875 13.3833 7 12 7C10.6167 7 9.4375 7.4875 8.4625 8.4625C7.4875 9.4375 7 10.6167 7 12C7 13.3833 7.4875 14.5625 8.4625 15.5375C9.4375 16.5125 10.6167 17 12 17ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22ZM12 20C14.2333 20 16.125 19.225 17.675 17.675C19.225 16.125 20 14.2333 20 12C20 9.76667 19.225 7.875 17.675 6.325C16.125 4.775 14.2333 4 12 4C9.76667 4 7.875 4.775 6.325 6.325C4.775 7.875 4 9.76667 4 12C4 14.2333 4.775 16.125 6.325 17.675C7.875 19.225 9.76667 20 12 20Z",
2239
- fill: "currentColor"
2240
- }
2241
- ) }), jn = /* @__PURE__ */ o("svg", { fill: "none", viewBox: "0 0 24 24", children: /* @__PURE__ */ o(
2242
- "path",
2243
- {
2244
- d: "M12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22ZM12 20C14.2333 20 16.125 19.225 17.675 17.675C19.225 16.125 20 14.2333 20 12C20 9.76667 19.225 7.875 17.675 6.325C16.125 4.775 14.2333 4 12 4C9.76667 4 7.875 4.775 6.325 6.325C4.775 7.875 4 9.76667 4 12C4 14.2333 4.775 16.125 6.325 17.675C7.875 19.225 9.76667 20 12 20Z",
2245
- fill: "currentColor"
2246
- }
2247
- ) }), Vi = /* @__PURE__ */ o("svg", { fill: "none", viewBox: "0 0 24 24", children: /* @__PURE__ */ o(
2248
- "path",
2249
- {
2250
- d: "M9.5501 18L3.8501 12.3L5.2751 10.875L9.5501 15.15L18.7251 5.97498L20.1501 7.39998L9.5501 18Z",
2251
- fill: "currentColor"
2252
- }
2253
- ) }), Di = L(
2254
- ({
2255
- shape: e = "smooth",
2256
- border: t,
2257
- uncheckedBorder: n,
2258
- color: i,
2259
- borderColor: r,
2260
- animation: s,
2261
- uncheckedBorderColor: a,
2262
- uncheckedIcon: u,
2263
- indeterminateIcon: g,
2264
- indeterminate: m,
2265
- icon: d,
2266
- size: c = "small",
2267
- filled: l = !0,
2268
- ...f
2269
- }, h) => {
2270
- const C = i ?? "primary", w = !d && t === void 0 ? void 0 : t;
2271
- let y;
2272
- return m ? y = t : y = !u && n === void 0 ? t ?? 2 : n, /* @__PURE__ */ o(
2273
- nn,
2274
- {
2275
- animation: s ?? "scale",
2276
- border: w,
2277
- borderColor: r ?? C,
2278
- color: C,
2279
- elementClass: "uui-checkbox",
2280
- filled: l,
2281
- icon: d ?? $i,
2282
- indeterminate: m,
2283
- indeterminateIcon: g ?? Ei,
2284
- ref: h,
2285
- shape: e,
2286
- size: c,
2287
- type: "checkbox",
2288
- uncheckedBorder: y,
2289
- uncheckedBorderColor: a ?? r ?? "onSurfaceVariant",
2290
- uncheckedIcon: u,
2291
- ...f
2292
- }
2293
- );
2294
- }
2295
- );
2296
- Di.displayName = "Checkbox";
2297
- const Mi = L(
2298
- (e, t) => /* @__PURE__ */ o(nt, { ref: t, ...e, elementClass: "uui-text-field" })
2299
- );
2300
- Mi.displayName = "TextField";
2301
- const Ri = L(
2302
- (e, t) => /* @__PURE__ */ o(
2303
- nt,
2304
- {
2305
- ref: t,
2306
- ...e,
2307
- elementClass: "uui-number-field",
2308
- type: "number"
2309
- }
2310
- )
2311
- );
2312
- Ri.displayName = "NumberField";
2313
- const Ai = L(
2314
- (e, t) => /* @__PURE__ */ o(
2315
- nt,
2316
- {
2317
- ref: t,
2318
- ...e,
2319
- elementClass: "uui-email-field",
2320
- type: "email"
2321
- }
2322
- )
2323
- );
2324
- Ai.displayName = "EmailField";
2325
- const ji = L(
2326
- (e, t) => /* @__PURE__ */ o(
2327
- nt,
2328
- {
2329
- ref: t,
2330
- ...e,
2331
- elementClass: "uui-phone-field",
2332
- type: "tel"
2333
- }
2334
- )
2335
- );
2336
- ji.displayName = "PhoneField";
2337
- const Pi = L(
2338
- (e, t) => /* @__PURE__ */ o(
2339
- nt,
2340
- {
2341
- ref: t,
2342
- ...e,
2343
- type: "password",
2344
- elementClass: "uui-password-field"
2345
- }
2346
- )
2347
- );
2348
- Pi.displayName = "PasswordField";
2349
- const Oi = L(
2350
- (e, t) => /* @__PURE__ */ o(
2351
- nt,
2352
- {
2353
- ref: t,
2354
- ...e,
2355
- elementClass: "uui-date-field",
2356
- type: "date"
2357
- }
2358
- )
2359
- );
2360
- Oi.displayName = "DateField";
2361
- const Hi = L(
2362
- (e, t) => /* @__PURE__ */ o(
2363
- nt,
2364
- {
2365
- ref: t,
2366
- ...e,
2367
- elementClass: "uui-datetime-field",
2368
- type: "datetime-local"
2369
- }
2370
- )
2371
- );
2372
- Hi.displayName = "DateTimeField";
2373
- const _i = L(
2374
- (e, t) => /* @__PURE__ */ o(
2375
- nt,
2376
- {
2377
- ref: t,
2378
- ...e,
2379
- elementClass: "uui-time-field",
2380
- type: "time"
2381
- }
2382
- )
2383
- );
2384
- _i.displayName = "TimeField";
2385
- const Wi = L(
2386
- (e, t) => /* @__PURE__ */ o(
2387
- nt,
2388
- {
2389
- ref: t,
2390
- ...e,
2391
- type: "month",
2392
- elementClass: "uui-month-field"
2393
- }
2394
- )
2395
- );
2396
- Wi.displayName = "MonthField";
2397
- const Ui = L(
2398
- (e, t) => /* @__PURE__ */ o(
2399
- nt,
2400
- {
2401
- ref: t,
2402
- ...e,
2403
- type: "week",
2404
- elementClass: "uui-week-field"
2405
- }
2406
- )
2407
- );
2408
- Ui.displayName = "WeekField";
2409
- const qi = L(
2410
- (e, t) => /* @__PURE__ */ o(nt, { ref: t, ...e, elementClass: "uui-url-field", type: "url" })
2411
- );
2412
- qi.displayName = "UrlField";
2413
- const zi = L(
2414
- ({
2415
- elevation: e = 3,
2416
- font: t,
2417
- size: n = "medium",
2418
- shape: i = "rounded",
2419
- label: r,
2420
- ...s
2421
- }, a) => /* @__PURE__ */ o(
2422
- kt,
2423
- {
2424
- ref: a,
2425
- ...s,
2426
- elementClass: r ? "uui-fab uui-fab-extended" : "uui-fab",
2427
- elevation: e,
2428
- font: t ?? {
2429
- extraSmall: "labelLarge",
2430
- small: "titleMedium",
2431
- medium: "titleMedium",
2432
- large: "headlineSmall",
2433
- extraLarge: "headlineLarge"
2434
- }[n],
2435
- label: r,
2436
- shape: i,
2437
- size: n
2438
- }
2439
- )
2440
- );
2441
- zi.displayName = "Fab";
2442
- const Zi = L(
2443
- ({
2444
- "aria-label": e,
2445
- endIcon: t,
2446
- trailing: n,
2447
- loading: i,
2448
- size: r = "small",
2449
- shape: s = "round",
2450
- label: a,
2451
- title: u,
2452
- children: g,
2453
- ...m
2454
- }, d) => /* @__PURE__ */ o(
2455
- kt,
2456
- {
2457
- ref: d,
2458
- ...m,
2459
- "aria-label": e ?? a,
2460
- elementClass: "uui-icon-button",
2461
- loading: i,
2462
- shape: s,
2463
- size: r,
2464
- title: u,
2465
- children: !i && g
2466
- }
2467
- )
2468
- );
2469
- Zi.displayName = "IconButton";
2470
- const Ki = L(
2471
- ({
2472
- selected: e = !1,
2473
- shape: t = "rounded",
2474
- size: n = "medium",
2475
- ...i
2476
- }, r) => /* @__PURE__ */ o(
2477
- kt,
2478
- {
2479
- ref: r,
2480
- ...i,
2481
- "aria-pressed": e,
2482
- elementClass: `uui-toggle-button${e ? " uui-selected" : ""}`,
2483
- filled: e,
2484
- shape: t,
2485
- size: n
2486
- }
2487
- )
2488
- );
2489
- Ki.displayName = "ToggleButton";
2490
- const Pn = Symbol.for("uui.menu");
2491
- function Nt(e) {
2492
- return mt(e) && typeof e.type != "string" && !!e.type[Pn];
2493
- }
2494
- const rn = Symbol.for("uui.menuitem");
2495
- function Gt(e) {
2496
- return mt(e) && typeof e.type != "string" && !!e.type[rn];
2497
- }
2498
- const On = Symbol.for("uui.divider");
2499
- function Xt(e) {
2500
- return mt(e) && typeof e.type != "string" && !!e.type[On];
2501
- }
2502
- const Gi = (e) => e === "none" ? "none" : e === "auto" ? "scale" : e, sn = L(
2503
- ({
2504
- anchorRef: e,
2505
- open: t = !1,
2506
- horizontal: n = !1,
2507
- placement: i = "auto",
2508
- floatingMode: r,
2509
- offset: s = 4,
2510
- color: a,
2511
- elevation: u,
2512
- dockedElevation: g,
2513
- shape: m,
2514
- border: d,
2515
- borderColor: c,
2516
- className: l,
2517
- children: f,
2518
- style: h,
2519
- id: C,
2520
- onClose: w,
2521
- variant: y = "classic",
2522
- animation: b = "scale",
2523
- duration: x,
2524
- motionStyle: F = "regular",
2525
- fixedLeading: B,
2526
- density: V,
2527
- __level: P,
2528
- __groupId: A,
2529
- __closeRootMenu: D,
2530
- __navigateHorizontal: M,
2531
- __horizontalDepth: S,
2532
- docked: v,
2533
- textColor: k,
2534
- descriptionColor: T,
2535
- labelColor: U,
2536
- shortcutColor: Z,
2537
- uncheckedIcon: ie,
2538
- checkedIcon: Se,
2539
- radioUncheckedIcon: he,
2540
- radioCheckedIcon: z,
2541
- selectedColor: Ae,
2542
- itemTouchEffects: De,
2543
- itemSelectedEffects: Oe,
2544
- itemFocusEffects: G,
2545
- closeOnChange: X = !1,
2546
- openOnHover: me = !0,
2547
- labelFont: ge,
2548
- font: pe,
2549
- descriptionFont: J,
2550
- shortcutFont: ve,
2551
- ...se
2552
- }, H) => {
2553
- const j = ne("closed"), [Q, Fe] = W(-1), [oe, ee] = W(-1), [N, Be] = W(!1), _ = qt(), le = P ?? 0, Ne = ne(C ?? Tt("menu")).current, je = A ?? Ne, ae = ne(null), Le = ne(null), [xe, Ee] = W(
2554
- null
2555
- ), $e = Q === -1, [ye, qe] = W(!1), [be, Ie] = W(!1), [Te, ze] = W("normal"), [ue, $] = W(!1), [Y, Me] = W(-1), K = a ?? (y === "modern" ? "surfaceContainerLow" : "surfaceContainer"), Qe = (v ? g : void 0) ?? u ?? (y === "modern" ? 3 : 2), [Ze, q] = W(!1), ce = b !== "none" ? x ?? 220 : 0, He = v ? 0 : ce, _e = ne(null), We = ne(null), te = Q !== -1;
2556
- function Xe(p) {
2557
- return Gt(p) || Xt(p);
2558
- }
2559
- const Ve = rt.Children.toArray(f).filter(
2560
- Xe
2561
- ), re = Ve.reduce(
2562
- (p, E, O) => (Gt(E) && (E.props.disabled || p.push(O)), p),
2563
- []
2564
- );
2565
- function et() {
2566
- te && (q(!0), Fe(-1));
2567
- }
2568
- function Ge() {
2569
- w == null || w(), !w && te && (et(), ee(-1)), le === 0 && (e != null && e.current) && e.current.focus();
2570
- }
2571
- function ct() {
2572
- D ? D() : Ge();
2573
- }
2574
- function it(p) {
2575
- return !ae.current || p === -1 ? null : ae.current.querySelector(
2576
- `[data-menu-index="${String(p)}"]`
2577
- );
2578
- }
2579
- function vt(p) {
2580
- const O = rt.Children.toArray(
2581
- Ve[p].props.children
2582
- ).find((at) => Nt(at));
2583
- return mt(O) ? rt.Children.toArray(
2584
- O.props.children
2585
- ).filter(
2586
- (at) => Xt(at) || Xe(at)
2587
- ) : void 0;
2588
- }
2589
- function Ke(p) {
2590
- if (p === -1 || re.indexOf(p) === -1)
2591
- return;
2592
- if (te) {
2593
- Me(p), et();
2594
- return;
2595
- }
2596
- const O = vt(p);
2597
- if (!O || O.length === 0)
2598
- return;
2599
- const ke = it(p);
2600
- ke && (Le.current = ke, q(!0), Fe(p), setTimeout(() => {
2601
- q(!1);
2602
- }, ce));
2603
- }
2604
- function de(p) {
2605
- return p < 0 ? !1 : rt.Children.toArray(
2606
- Ve[p].props.children
2607
- ).some((O) => Nt(O));
2608
- }
2609
- function Ye(p) {
2610
- if (oe === -1)
2611
- return;
2612
- const E = re.indexOf(oe);
2613
- if (E === -1)
2614
- return;
2615
- let O;
2616
- p ? O = re[E + 1 < re.length ? E + 1 : 0] : O = E > 0 ? re[E - 1] : re[re.length - 1], O !== oe && (ee(O), de(O) ? Ke(O) : et());
2617
- }
2618
- fe(() => {
2619
- te || setTimeout(() => {
2620
- $(!0);
2621
- }, ce * 0.67);
2622
- }, [ce, te]), fe(() => {
2623
- var p;
2624
- !te && ue && ($(!1), Fe(-1), Y !== -1 ? (Me(-1), Ke(Y)) : (p = ae.current) == null || p.focus(), q(!1));
2625
- }, [ue, Y, te]), fe(() => {
2626
- t ? (j.current = "opening", q(!0), ze("normal"), qe(!0), Fe(-1), Ie(!1), ee(-1)) : (j.current = "closing", q(!0), Ie(!1), ze("reverse"));
2627
- }, [t]), fe(() => {
2628
- if (!t || !ye || !ae.current)
2629
- return;
2630
- const p = () => {
2631
- const E = r ?? (n ? "dropdown" : "menu");
2632
- if (e != null && e.current) {
2633
- const O = En(e, ae, {
2634
- placement: i,
2635
- mode: E,
2636
- offset: s
2637
- });
2638
- O && Ee({ x: O.x, y: O.y });
2639
- }
2640
- };
2641
- return v ? Ee({ x: 0, y: 0 }) : (window.addEventListener("resize", p), p()), Ie(!0), () => {
2642
- v || window.removeEventListener("resize", p);
2643
- };
2644
- }, [
2645
- e,
2646
- v,
2647
- r,
2648
- n,
2649
- s,
2650
- t,
2651
- i,
2652
- ye
2653
- ]), fe(() => {
2654
- t && ye && xe && setTimeout(() => {
2655
- var p;
2656
- j.current === "opening" && (q(!1), j.current = "opened", v || (p = ae.current) == null || p.focus(), ee(_ ? re[0] ?? -1 : -1));
2657
- }, He);
2658
- }, [t, xe, ye]), fe(() => {
2659
- Te === "reverse" && j.current === "closing" && (Ie(!0), ee(-1), setTimeout(() => {
2660
- j.current === "closing" && (j.current = "closed", qe(!1), Ee(null), q(!1));
2661
- }, ce * 0.67));
2662
- }, [ce, Te]), fe(() => {
2663
- if (oe < 0 || !N || j.current !== "opened")
2664
- return;
2665
- const p = it(oe);
2666
- p && (p.focus({ preventScroll: !0 }), p.scrollIntoView({
2667
- block: "nearest",
2668
- inline: "nearest"
2669
- }), setTimeout(() => {
2670
- var E;
2671
- (E = ae.current) == null || E.focus({ preventScroll: !0 });
2672
- }, 0));
2673
- }, [oe, N]), fe(() => {
2674
- N && _ && oe === -1 && j.current === "opened" && re.length > 0 && ee(re[0]);
2675
- }, [oe, _, N]);
2676
- function xt(p) {
2677
- Be(!0);
2678
- }
2679
- vi(
2680
- t && le === 0,
2681
- `[data-menu-group="${je}"]`,
2682
- () => {
2683
- ct();
2684
- },
2685
- e
2686
- );
2687
- function Dt(p) {
2688
- var O, ke, at, mn;
2689
- const E = p;
2690
- E !== -1 && (Ve[E].props.disabled || (ee(E), de(E) ? te && E === Q ? et() : Ke(E) : Ve[E].props.type === "radio" || Ve[E].props.type === "checkbox" || Ve[E].props.type === "option" ? ((ke = (O = Ve[E].props).onChange) == null || ke.call(O), X && ct()) : ((mn = (at = Ve[E].props).onClick) == null || mn.call(at), ct())));
2691
- }
2692
- function Mt(p, E) {
2693
- if (Ze) {
2694
- p == null || p.preventDefault();
2695
- return;
2696
- }
2697
- Dt(E);
2698
- }
2699
- function dt(p, E) {
2700
- if (!(!me || _ && N)) {
2701
- if (We.current && (clearTimeout(We.current), We.current = null), _e.current && (clearTimeout(_e.current), _e.current = null), !de(E)) {
2702
- te && (We.current = window.setTimeout(() => {
2703
- et();
2704
- }, 150));
2705
- return;
2706
- }
2707
- te && Q === E || (_e.current = window.setTimeout(() => {
2708
- ee(E), Ke(E);
2709
- }, 150));
2710
- }
2711
- }
2712
- function Zt() {
2713
- We.current && (clearTimeout(We.current), We.current = null), _e.current && (clearTimeout(_e.current), _e.current = null);
2714
- }
2715
- const Rt = Ve.some(
2716
- (p) => p.props.icon !== void 0 || p.props.leading !== void 0 || p.props.type === "radio" || p.props.type === "checkbox"
2717
- ), Kt = Ve.map((p, E) => {
2718
- if (Gt(p)) {
2719
- const O = {
2720
- "data-menu-index": E,
2721
- __interactionsDisabled: Ze,
2722
- __index: E,
2723
- disabled: p.props.disabled,
2724
- active: E === oe && N,
2725
- focusVisible: _ && N,
2726
- horizontal: n,
2727
- expanded: te && Q === E,
2728
- fixedLeading: p.props.fixedLeading ?? (B && Rt),
2729
- variant: p.props.variant ?? y,
2730
- shape: p.props.shape ?? m,
2731
- color: p.props.color ?? a,
2732
- density: p.props.density ?? V,
2733
- shortcutColor: p.props.shortcutColor ?? Z,
2734
- textColor: p.props.textColor ?? k,
2735
- labelColor: p.props.labelColor ?? U,
2736
- descriptionColor: p.props.descriptionColor ?? T,
2737
- checkedIcon: p.props.checkedIcon ?? (p.props.type === "checkbox" ? Se : z),
2738
- uncheckedIcon: p.props.uncheckedIcon ?? (p.props.type === "checkbox" ? ie : he),
2739
- selectedColor: p.props.selectedColor ?? Ae,
2740
- touchEffects: p.props.touchEffects ?? De,
2741
- selectedEffects: p.props.selectedEffects ?? Oe,
2742
- focusEffects: p.props.focusEffects ?? G,
2743
- labelFont: p.props.labelFont ?? ge,
2744
- font: p.props.font ?? pe,
2745
- descriptionFont: p.props.descriptionFont ?? J,
2746
- shortcutFont: p.props.shortcutFont ?? ve,
2747
- onClick: (ke) => {
2748
- Mt(ke, E);
2749
- },
2750
- onMouseEnter: (ke) => {
2751
- dt(ke, E);
2752
- },
2753
- onMouseLeave: (ke) => {
2754
- Zt();
2755
- }
2756
- };
2757
- return Lt(p, {
2758
- ...p.props,
2759
- ...O
2760
- });
2761
- } else if (Xt(p)) {
2762
- const O = Ot[K] === "onSurface" ? "outlineVariant" : Ot[K], ke = {
2763
- borderColor: p.props.borderColor ?? p.props.color ?? O ?? "outlineVariant",
2764
- vertical: n,
2765
- insetSize: p.props.insetSize ?? 8,
2766
- spacing: p.props.spacing ?? (y === "modern" ? 5 : 8),
2767
- inset: p.props.inset ?? (y === "modern" ? "middle" : void 0)
2768
- };
2769
- return Lt(p, { ...p.props, ...ke });
2770
- }
2771
- return Lt(p, {
2772
- ...p.props
2773
- });
2774
- });
2775
- function yt(p) {
2776
- p.target.closest("[data-menu-index]") || te && et();
2777
- }
2778
- const Ue = (p) => {
2779
- if (!t || Ze)
2780
- return;
2781
- let E = p.key;
2782
- if (n) {
2783
- const at = {
2784
- ArrowDown: "ArrowRight",
2785
- ArrowUp: "ArrowLeft",
2786
- ArrowRight: "ArrowDown",
2787
- ArrowLeft: "ArrowUp"
2788
- };
2789
- E = at[E] ? at[E] : E;
2790
- }
2791
- if (re.length === 0 && E !== "Tab")
2792
- return;
2793
- const O = re.indexOf(oe);
2794
- let ke;
2795
- switch (E) {
2796
- case "ArrowUp":
2797
- p.preventDefault(), oe === -1 || O === -1 ? ke = re[re.length - 1] : ke = O > 0 ? re[O - 1] : re[re.length - 1], ee(ke), n && de(ke) && Ke(ke);
2798
- break;
2799
- case "ArrowDown":
2800
- p.preventDefault(), oe === -1 || O === -1 ? ke = re[0] : ke = re[O + 1 < re.length ? O + 1 : 0], ee(ke), n && de(ke) && Ke(ke);
2801
- break;
2802
- case "Home":
2803
- ee(re[0]);
2804
- break;
2805
- case "End":
2806
- ee(re[re.length - 1]);
2807
- break;
2808
- case "Enter":
2809
- case " ":
2810
- p.stopPropagation(), p.preventDefault(), O >= 0 && Dt(re[O]);
2811
- break;
2812
- case "ArrowRight":
2813
- p.preventDefault(), O >= 0 && de(re[O]) ? Ke(re[O]) : M && M(!0);
2814
- break;
2815
- case "ArrowLeft":
2816
- p.preventDefault(), M && S === 1 ? M(!1) : Ge();
2817
- break;
2818
- case "Escape":
2819
- p.preventDefault(), Ge();
2820
- break;
2821
- case "Tab":
2822
- v || (p.stopPropagation(), p.preventDefault()), ct();
2823
- break;
2824
- }
2825
- };
2826
- if (!t && !ye || !e && !v)
2827
- return null;
2828
- const lt = {
2829
- "--uui-reverse": Te,
2830
- "--uui-duration": Te === "reverse" ? String(He * 0.67) + "ms" : String(He) + "ms"
2831
- }, un = Gi(b), Jn = un === "none" ? "" : _t[un], Qn = F === "expressive" ? "uui-motion-expressive" : "", At = I({ ...h, ...lt });
2832
- At.bg(K), At.text.on(K), d && +d > 0 && At.border(ht(c));
2833
- const ei = [
2834
- "uui-menu",
2835
- `uui-menu-level-${String(le)}`,
2836
- n && "uui-menu-horizontal",
2837
- $e && "uui-menu-active",
2838
- y === "modern" ? "uui-menu-modern" : "uui-menu-classic",
2839
- be && Jn,
2840
- Qn,
2841
- pt(V),
2842
- Re(m ?? (y === "modern" ? "rounded" : "smooth")),
2843
- st(Qe),
2844
- d !== void 0 ? Je(d) : null,
2845
- l
2846
- ].filter(Boolean).join(" "), cn = /* @__PURE__ */ o(
2847
- "div",
2848
- {
2849
- "aria-orientation": n ? "horizontal" : "vertical",
2850
- className: ei,
2851
- "data-menu-group": je,
2852
- id: C,
2853
- onBlur: () => {
2854
- Be(!1);
2855
- },
2856
- onClick: yt,
2857
- onFocus: xt,
2858
- onKeyDown: Ue,
2859
- ref: gt(H, ae),
2860
- role: "menu",
2861
- style: {
2862
- position: v ? "relative" : "fixed",
2863
- left: (xe == null ? void 0 : xe.x) ?? 0,
2864
- top: (xe == null ? void 0 : xe.y) ?? 0,
2865
- zIndex: 9999,
2866
- visibility: xe ? "visible" : "hidden",
2867
- ...At.get()
2868
- },
2869
- tabIndex: 0,
2870
- ...se,
2871
- children: /* @__PURE__ */ o("div", { className: "uui-menu-scroll", children: Kt })
2872
- }
2873
- ), ti = document.getElementById("menu-root") ?? document.body;
2874
- let dn = null;
2875
- if (Q !== -1) {
2876
- const p = vt(Q);
2877
- p && p.length > 0 && (dn = p);
2878
- }
2879
- const fn = Qt(
2880
- /* @__PURE__ */ R(tt, { children: [
2881
- !v && cn,
2882
- Le.current && Q !== -1 && /* @__PURE__ */ o(
2883
- sn,
2884
- {
2885
- __closeRootMenu: D ?? ct,
2886
- __groupId: je,
2887
- __horizontalDepth: n ? 1 : S && S + 1,
2888
- __level: le + 1,
2889
- __navigateHorizontal: n ? Ye : M,
2890
- anchorRef: Le,
2891
- animation: b,
2892
- "aria-orientation": "vertical",
2893
- border: d,
2894
- borderColor: c,
2895
- checkedIcon: Se,
2896
- closeOnChange: X,
2897
- color: K,
2898
- density: V,
2899
- descriptionColor: T,
2900
- descriptionFont: J,
2901
- duration: x,
2902
- elevation: u,
2903
- fixedLeading: B,
2904
- floatingMode: n ? "menu" : "submenu",
2905
- font: pe,
2906
- itemFocusEffects: G,
2907
- itemSelectedEffects: Oe,
2908
- itemTouchEffects: De,
2909
- labelColor: U,
2910
- labelFont: ge,
2911
- motionStyle: F,
2912
- offset: 0,
2913
- onClose: et,
2914
- open: t && te,
2915
- openOnHover: me,
2916
- placement: "auto",
2917
- radioCheckedIcon: z,
2918
- radioUncheckedIcon: he,
2919
- role: "menu",
2920
- selectedColor: Ae,
2921
- shape: m,
2922
- shortcutColor: Z,
2923
- shortcutFont: ve,
2924
- textColor: k,
2925
- uncheckedIcon: ie,
2926
- variant: y,
2927
- children: dn
2928
- }
2929
- )
2930
- ] }),
2931
- ti
2932
- );
2933
- return v && le === 0 ? /* @__PURE__ */ R(tt, { children: [
2934
- cn,
2935
- fn
2936
- ] }) : fn;
2937
- }
2938
- );
2939
- sn[Pn] = !0;
2940
- sn.displayName = "Menu";
2941
- const Hn = L(
2942
- ({
2943
- shape: e,
2944
- touchEffects: t = ["ripple"],
2945
- focusEffects: n = ["ring", "overlay"],
2946
- selectedEffects: i = ["color"],
2947
- checkedIcon: r,
2948
- uncheckedIcon: s,
2949
- selectedColor: a,
2950
- textColor: u,
2951
- labelColor: g,
2952
- descriptionColor: m,
2953
- shortcutColor: d,
2954
- fixedLeading: c,
2955
- color: l,
2956
- icon: f,
2957
- endIcon: h,
2958
- leading: C,
2959
- trailing: w,
2960
- label: y,
2961
- disabled: b = !1,
2962
- className: x,
2963
- onClick: F,
2964
- badge: B,
2965
- expanded: V,
2966
- active: P,
2967
- children: A,
2968
- focusVisible: D,
2969
- type: M = "item",
2970
- checked: S,
2971
- description: v,
2972
- shortcut: k,
2973
- density: T,
2974
- horizontal: U,
2975
- labelFont: Z,
2976
- font: ie,
2977
- descriptionFont: Se,
2978
- shortcutFont: he,
2979
- selected: z,
2980
- __index: Ae,
2981
- __interactionsDisabled: De,
2982
- onChange: Oe,
2983
- variant: G = "classic",
2984
- ...X
2985
- }, me) => {
2986
- const ge = ne(null), pe = rt.Children.toArray(A), J = pe.find((K) => Nt(K)), ve = pe.filter((K) => !Nt(K)), se = !!J;
2987
- let H;
2988
- M !== "item" && (M === "radio" ? H = S ? r ?? An : s ?? jn : M === "checkbox" && (H = S ? r ?? Vi : s));
2989
- const j = H ?? C ?? f ?? (c && !U), Q = j && /* @__PURE__ */ o("div", { className: "uui-icon uui-leading", children: j }), Fe = w ?? h;
2990
- let oe;
2991
- B && (typeof B == "string" || typeof B == "number" ? oe = /* @__PURE__ */ o(on, { value: B }) : oe = B);
2992
- const ee = G === "modern" ? "labelLarge" : "bodyLarge", N = Z ?? ie ?? ee, Be = Se ?? (G === "modern" ? "bodySmall" : "bodyMedium"), _ = he ?? ee, le = I();
2993
- le.text(d);
2994
- const Ne = se && !U ? Rn : Fe, je = k && /* @__PURE__ */ o(
2995
- "div",
2996
- {
2997
- className: `uui-menu-item-shortcut ${Ce(_)}`,
2998
- style: le.get(),
2999
- children: k
3000
- }
3001
- ), ae = (k ?? B ?? Ne) && /* @__PURE__ */ R(tt, { children: [
3002
- je,
3003
- oe,
3004
- Ne && /* @__PURE__ */ o("div", { className: "uui-icon uui-trailing", children: Ne })
3005
- ] }), Le = I();
3006
- Le.text(g);
3007
- const xe = y && /* @__PURE__ */ o(
3008
- "div",
3009
- {
3010
- className: `uui-menu-item-label ${Ce(N)}`,
3011
- style: Le.get(),
3012
- children: y
3013
- }
3014
- ), Ee = I();
3015
- (m || !u && G === "classic" && (l != null && l.startsWith("surface"))) && (m ? Ee.text(m) : Ee.text.on("surfaceVariant"));
3016
- const $e = v && /* @__PURE__ */ o(
3017
- "div",
3018
- {
3019
- className: `uui-menu-item-description ${Ce(Be)}`,
3020
- style: Ee.get(),
3021
- children: v
3022
- }
3023
- ), ye = (xe ?? $e) && /* @__PURE__ */ R("div", { className: "uui-menu-item-text", children: [
3024
- xe,
3025
- $e
3026
- ] }), qe = (K) => {
3027
- if (De || b) {
3028
- K == null || K.preventDefault();
3029
- return;
3030
- }
3031
- F == null || F(K), t.includes("ripple") && ge.current && K && It(ge.current, K);
3032
- };
3033
- let be = l ?? (G === "modern" ? "surfaceContainerLow" : "surfaceContainer");
3034
- M === "option" && z && i.includes("color") && (be = a ?? (G === "modern" ? "tertiaryContainer" : "secondaryContainer"));
3035
- const Ie = I();
3036
- Ie.bg.on(be);
3037
- const Te = I();
3038
- Te.bg(be), u ? Te.text(u) : Te.text.on(be);
3039
- const ze = [
3040
- "uui-menu-item",
3041
- x,
3042
- pt(T),
3043
- b && "uui-disabled",
3044
- G === "modern" ? "uui-menu-item-modern" : "uui-menu-item-classic"
3045
- ].filter(Boolean).join(" "), ue = Re(
3046
- e ?? (G === "modern" ? "rounded" : "smooth")
3047
- ), $ = [
3048
- "uui-menu-item-content",
3049
- ue,
3050
- ...n.includes("ring") && P ? ["uui-focus-ring-in"] : [],
3051
- ...n.includes("overlay") && P ? ["uui-focus-overlay"] : [],
3052
- P && "uui-active",
3053
- P && D && "uui-focus-visible"
3054
- ].filter(Boolean).join(" "), Y = /* @__PURE__ */ R("div", { className: $, style: Te.get(), children: [
3055
- ve.length > 0 ? /* @__PURE__ */ o("div", { className: "uui-menu-item-children", children: ve }) : /* @__PURE__ */ R(tt, { children: [
3056
- Q,
3057
- ye,
3058
- ae
3059
- ] }),
3060
- /* @__PURE__ */ o(
3061
- "div",
3062
- {
3063
- className: ["uui-state", ue].join(" "),
3064
- style: Ie.get()
3065
- }
3066
- )
3067
- ] });
3068
- let Me = "menuitem";
3069
- return (M === "radio" || M === "checkbox") && (Me = M === "radio" ? "menuitemradio" : "menuitemcheckbox"), // eslint-disable-next-line jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events
3070
- /* @__PURE__ */ o(
3071
- "div",
3072
- {
3073
- ...X,
3074
- "aria-checked": M === "radio" || M === "checkbox" ? S ?? !1 : void 0,
3075
- "aria-disabled": b ? "true" : void 0,
3076
- "aria-expanded": se ? V : void 0,
3077
- "aria-haspopup": se ? "menu" : void 0,
3078
- className: ze,
3079
- onClick: qe,
3080
- ref: gt(ge, me),
3081
- role: Me,
3082
- tabIndex: -1,
3083
- children: Y
3084
- }
3085
- );
3086
- }
3087
- );
3088
- Hn[rn] = !0;
3089
- Hn.displayName = "MenuItem";
3090
- const _n = (e) => {
3091
- const {
3092
- className: t,
3093
- borderColor: n,
3094
- color: i,
3095
- border: r = 1,
3096
- inset: s = "none",
3097
- insetSize: a = 16,
3098
- spacing: u = 8,
3099
- vertical: g,
3100
- variant: m = "strong",
3101
- elevation: d,
3102
- shape: c,
3103
- style: l,
3104
- height: f,
3105
- ...h
3106
- } = e, C = ne(null), [w, y] = W(!1);
3107
- vn(() => {
3108
- const V = C.current;
3109
- if (!(V != null && V.parentElement))
3110
- return;
3111
- const P = getComputedStyle(V.parentElement).display;
3112
- y(P.includes("flex"));
3113
- }, []);
3114
- const b = Math.min(4, Math.max(0, r)), x = [
3115
- "uui-divider",
3116
- Je(b === 0 ? 0 : 1),
3117
- t,
3118
- d && st(d),
3119
- c && Re(c)
3120
- ].filter(Boolean).join(" "), F = I(l), B = ht(n ?? i ?? "outlineVariant");
3121
- if (F.border(B), F.bg(B), m !== "strong" && (m === "subtle" ? F.set("opacity", "var(--uui-subtle-opacity)") : F.set("opacity", "var(--uui-medium-opacity)")), w ? g ? F.merge({
3122
- height: f,
3123
- alignSelf: "stretch",
3124
- width: `${b}px`,
3125
- marginInline: `${u}px`
3126
- }) : F.merge({
3127
- flex: "1 1 auto",
3128
- height: `${b}px`,
3129
- marginBlock: `${u}px`
3130
- }) : g ? F.merge({
3131
- height: f,
3132
- display: "inline-block",
3133
- verticalAlign: "middle",
3134
- width: `${b}px`,
3135
- marginInline: `${u}px`
3136
- }) : F.merge({
3137
- height: `${b}px`,
3138
- marginBlock: `${u}px`
3139
- }), s !== "none") {
3140
- const V = s === "left" || s === "top" || s === "middle", P = s === "right" || s === "bottom" || s === "middle";
3141
- V && (g ? F.set("marginBlockStart", `${a}px`) : F.set("marginInlineStart", `${a}px`)), P && (g ? F.set("marginBlockEnd", `${a}px`) : F.set("marginInlineEnd", `${a}px`));
3142
- }
3143
- return /* @__PURE__ */ o(
3144
- "div",
3145
- {
3146
- "aria-hidden": "true",
3147
- className: x,
3148
- ref: C,
3149
- role: "separator",
3150
- style: F.get(),
3151
- ...h
3152
- }
3153
- );
3154
- };
3155
- _n[On] = !0;
3156
- _n.displayName = "Divider";
3157
- const Xi = L(
3158
- ({
3159
- uncheckedBorder: e,
3160
- border: t,
3161
- color: n,
3162
- borderColor: i,
3163
- uncheckedBorderColor: r,
3164
- shape: s = "round",
3165
- size: a = "small",
3166
- filled: u = !1,
3167
- icon: g,
3168
- uncheckedIcon: m,
3169
- animation: d,
3170
- ...c
3171
- }, l) => {
3172
- const f = n ?? "primary";
3173
- return /* @__PURE__ */ o(
3174
- nn,
3175
- {
3176
- animation: d ?? "scale",
3177
- border: !g && t === void 0 ? 2 : t,
3178
- borderColor: i ?? f,
3179
- color: f,
3180
- elementClass: "uui-radio",
3181
- filled: u,
3182
- icon: g ?? Ii,
3183
- indeterminateIcon: void 0,
3184
- ref: l,
3185
- shape: s,
3186
- size: a,
3187
- type: "radio",
3188
- uncheckedBorder: e ?? t ?? (m ? void 0 : 2),
3189
- uncheckedBorderColor: r ?? i ?? "onSurfaceVariant",
3190
- uncheckedIcon: m,
3191
- ...c
3192
- }
3193
- );
3194
- }
3195
- );
3196
- Xi.displayName = "Radio";
3197
- const Go = ({
3198
- children: e,
3199
- colorMode: t,
3200
- seedColor: n,
3201
- extraColors: i
3202
- }) => {
3203
- const [r, s] = W(yn), a = Bt(
3204
- (d) => {
3205
- d ? document.body.classList.add("dark") : document.body.classList.remove("dark"), s((c) => ({ ...c, darkMode: d }));
3206
- },
3207
- [s]
3208
- ), u = Bt(
3209
- (d) => (r.darkMode ? r.schemes.dark : r.schemes.light)[d] ?? "",
3210
- [r]
3211
- ), g = Bt(
3212
- (d, c) => r.schemes[d][c] ?? "",
3213
- [r]
3214
- );
3215
- fe(() => {
3216
- if (t) {
3217
- const d = t === "dark";
3218
- document.body.classList.toggle("dark", d), s((c) => ({ ...c, darkMode: d }));
3219
- }
3220
- }, [t]), fe(() => {
3221
- const { schemes: d } = yn;
3222
- s((c) => ({
3223
- darkMode: c.darkMode,
3224
- schemes: mi(n, i, d)
3225
- }));
3226
- }, [i, n]);
3227
- const m = ft(
3228
- () => ({
3229
- theme: r,
3230
- setTheme: s,
3231
- darkMode: r.darkMode,
3232
- setDarkMode: a,
3233
- getColorValue: u,
3234
- getThemeColorValue: g
3235
- }),
3236
- [u, g, a, r]
3237
- );
3238
- return /* @__PURE__ */ o(Vn.Provider, { value: m, children: e });
3239
- }, Yi = L(
3240
- ({
3241
- children: e,
3242
- className: t = "",
3243
- title: n = "",
3244
- align: i = "topRight",
3245
- value: r,
3246
- ...s
3247
- }, a) => {
3248
- const u = ne(null);
3249
- return /* @__PURE__ */ R("span", { className: "uui-tooltip", ref: a, ...s, children: [
3250
- /* @__PURE__ */ o(
3251
- Vt,
3252
- {
3253
- align: i,
3254
- tooltip: /* @__PURE__ */ o("div", { children: n }),
3255
- triggerRef: u
3256
- }
3257
- ),
3258
- /* @__PURE__ */ o("div", { ref: u, children: e })
3259
- ] });
3260
- }
3261
- );
3262
- Yi.displayName = "Tooltip";
3263
- const Ji = L(
3264
- ({ direction: e = "col", ...t }, n) => /* @__PURE__ */ o(
3265
- Pe,
3266
- {
3267
- ref: n,
3268
- ...t,
3269
- component: "article",
3270
- direction: e,
3271
- elementClass: "uui-article"
3272
- }
3273
- )
3274
- );
3275
- Ji.displayName = "Article";
3276
- const Qi = L(
3277
- ({ direction: e = "col", ...t }, n) => /* @__PURE__ */ o(
3278
- Pe,
3279
- {
3280
- ref: n,
3281
- ...t,
3282
- component: "aside",
3283
- direction: e,
3284
- elementClass: "uui-aside"
3285
- }
3286
- )
3287
- );
3288
- Qi.displayName = "Aside";
3289
- const eo = L(
3290
- ({ direction: e = "col", ...t }, n) => /* @__PURE__ */ o(
3291
- Pe,
3292
- {
3293
- ref: n,
3294
- ...t,
3295
- direction: e,
3296
- elementClass: "uui-article-content"
3297
- }
3298
- )
3299
- );
3300
- eo.displayName = "Content";
3301
- const to = L((e, t) => /* @__PURE__ */ o(Pe, { ...e, ref: t, type: "block" }));
3302
- to.displayName = "Div";
3303
- const Wn = L(
3304
- ({ direction: e = "row", ...t }, n) => /* @__PURE__ */ o(Pe, { ...t, direction: e, ref: n, type: "flex" })
3305
- );
3306
- Wn.displayName = "Flex";
3307
- const no = L(
3308
- ({ direction: e = "row", ...t }, n) => /* @__PURE__ */ o(
3309
- Pe,
3310
- {
3311
- ref: n,
3312
- ...t,
3313
- component: "footer",
3314
- direction: e,
3315
- elementClass: "uui-footer"
3316
- }
3317
- )
3318
- );
3319
- no.displayName = "Footer";
3320
- const Un = L((e, t) => /* @__PURE__ */ o(Pe, { ...e, ref: t, type: "grid" }));
3321
- Un.displayName = "Grid";
3322
- const io = L(
3323
- ({ direction: e = "row", ...t }, n) => /* @__PURE__ */ o(
3324
- Pe,
3325
- {
3326
- ref: n,
3327
- ...t,
3328
- component: "header",
3329
- direction: e,
3330
- elementClass: "uui-header"
3331
- }
3332
- )
3333
- );
3334
- io.displayName = "Header";
3335
- const oo = L(
3336
- ({ direction: e = "col", ...t }, n) => /* @__PURE__ */ o(
3337
- Pe,
3338
- {
3339
- ref: n,
3340
- ...t,
3341
- component: "main",
3342
- direction: e,
3343
- elementClass: "uui-main"
3344
- }
3345
- )
3346
- );
3347
- oo.displayName = "Main";
3348
- const ro = L(
3349
- ({ direction: e = "row", ...t }, n) => /* @__PURE__ */ o(
3350
- Pe,
3351
- {
3352
- ref: n,
3353
- ...t,
3354
- component: "nav",
3355
- direction: e,
3356
- elementClass: "uui-nav"
3357
- }
3358
- )
3359
- );
3360
- ro.displayName = "Nav";
3361
- const so = L(
3362
- ({ direction: e = "col", ...t }, n) => /* @__PURE__ */ o(
3363
- Pe,
3364
- {
3365
- ref: n,
3366
- ...t,
3367
- component: "section",
3368
- direction: e,
3369
- elementClass: "uui-section"
3370
- }
3371
- )
3372
- );
3373
- so.displayName = "Section";
3374
- const lo = L(
3375
- (e, t) => /* @__PURE__ */ o(zt, { ref: t, ...e, elementClass: "uui-dialog" })
3376
- );
3377
- lo.displayName = "Dialog";
3378
- const ao = ({
3379
- children: e,
3380
- className: t,
3381
- color: n,
3382
- borderTop: i = !1,
3383
- borderTopWidth: r = 1,
3384
- borderColor: s
3385
- }) => {
3386
- if (!e)
3387
- return null;
3388
- const a = n ? Wt(n) : null, u = i ? Je(r) : "", g = i && n ? en(ht(s)) : "", m = [
3389
- "uui-dialog-actions",
3390
- a == null ? void 0 : a.bgColor,
3391
- a == null ? void 0 : a.textOnColor,
3392
- i ? "uui-dialog-actions-border-top" : "",
3393
- u,
3394
- g,
3395
- t
3396
- ].filter(Boolean).join(" ");
3397
- return /* @__PURE__ */ o("div", { className: m, children: e });
3398
- };
3399
- ao.displayName = "DialogActions";
3400
- const uo = ({ children: e, className: t }) => {
3401
- const n = ["uui-dialog-content", t].filter(Boolean).join(" ");
3402
- return e ? /* @__PURE__ */ o("div", { className: n, children: /* @__PURE__ */ o("div", { className: "uui-content", children: e }) }) : null;
3403
- };
3404
- uo.displayName = "DialogContent";
3405
- const co = ({
3406
- icon: e,
3407
- label: t,
3408
- children: n,
3409
- className: i,
3410
- font: r = "headlineSmall"
3411
- }) => {
3412
- const s = t ?? n ?? null, a = ["uui-dialog-title", i];
3413
- a.push(Ce(r));
3414
- const u = a.filter(Boolean).join(" ");
3415
- return s ? /* @__PURE__ */ R("div", { className: u, children: [
3416
- e && /* @__PURE__ */ o("div", { className: "uui-icon", children: e }),
3417
- s && /* @__PURE__ */ o("div", { className: "uui-content", children: s })
3418
- ] }) : null;
3419
- };
3420
- co.displayName = "DialogTitle";
3421
- const fo = L(
3422
- (e, t) => /* @__PURE__ */ o(
3423
- zt,
3424
- {
3425
- ref: t,
3426
- ...e,
3427
- elementClass: "uui-drawer",
3428
- type: "dockRight"
3429
- }
3430
- )
3431
- );
3432
- fo.displayName = "Drawer";
3433
- const mo = L(
3434
- (e, t) => /* @__PURE__ */ o(
3435
- zt,
3436
- {
3437
- ref: t,
3438
- ...e,
3439
- elementClass: "uui-bottom-sheet",
3440
- type: "dockBottom"
3441
- }
3442
- )
3443
- );
3444
- mo.displayName = "BottomSheet";
3445
- const qn = L(
3446
- ({
3447
- description: e,
3448
- error: t,
3449
- font: n,
3450
- label: i,
3451
- disabled: r,
3452
- legend: s,
3453
- children: a,
3454
- direction: u = "col",
3455
- required: g,
3456
- descriptionColor: m,
3457
- descriptionFont: d,
3458
- alignItems: c = "start",
3459
- ...l
3460
- }, f) => {
3461
- const h = s ?? i, C = [
3462
- "uui-fieldset-legend",
3463
- Ce(n ?? "labelLarge")
3464
- ].filter(Boolean).join(" "), w = I();
3465
- t ? w.text("error") : m ? w.text(m) : w.text.on("surfaceVariant");
3466
- const y = [
3467
- "uui-support-text",
3468
- Ce(d ?? "bodySmall"),
3469
- t && "uui-error",
3470
- e && !t && "uui-description"
3471
- ].filter(Boolean).join(" "), b = (e ?? t) && /* @__PURE__ */ o("div", { className: y, style: w.get(), children: t ?? e });
3472
- return /* @__PURE__ */ R(tt, { children: [
3473
- /* @__PURE__ */ o(tn.Provider, { value: { disabled: r }, children: /* @__PURE__ */ R(
3474
- Pe,
3475
- {
3476
- ref: f,
3477
- ...l,
3478
- alignItems: c,
3479
- component: "fieldset",
3480
- direction: u,
3481
- disabled: r,
3482
- elementClass: "uui-fieldset",
3483
- children: [
3484
- h && /* @__PURE__ */ R("legend", { className: C, children: [
3485
- h,
3486
- g && /* @__PURE__ */ o("span", { "aria-hidden": "true", className: "uui-required", children: "*" })
3487
- ] }),
3488
- a
3489
- ]
3490
- }
3491
- ) }),
3492
- b
3493
- ] });
3494
- }
3495
- );
3496
- qn.displayName = "Fieldset";
3497
- const po = L(
3498
- ({
3499
- name: e,
3500
- disabled: t,
3501
- onChange: n,
3502
- value: i,
3503
- defaultValue: r,
3504
- children: s,
3505
- ...a
3506
- }, u) => {
3507
- const [g, m] = W(r), d = i !== void 0, c = d ? i : g, l = Bt(
3508
- (h) => {
3509
- d || m(h), n == null || n(h);
3510
- },
3511
- [d, n]
3512
- ), f = ft(
3513
- () => ({ name: e, value: c, setValue: l, disabled: t }),
3514
- [e, c, l, t]
3515
- );
3516
- return /* @__PURE__ */ o(qn, { disabled: t, ref: u, ...a, children: /* @__PURE__ */ o(Tn.Provider, { value: f, children: s }) });
3517
- }
3518
- );
3519
- po.displayName = "RadioGroup";
3520
- const zn = Symbol.for("uui.listItem");
3521
- function go(e) {
3522
- return mt(e) && typeof e.type != "string" && !!e.type[zn];
3523
- }
3524
- const Xo = ({
3525
- type: e = "single",
3526
- defaultValue: t,
3527
- children: n
3528
- }) => {
3529
- const [i, r] = W(
3530
- t ? [t] : []
3531
- ), s = rt.Children.toArray(n).filter(go);
3532
- function a(d) {
3533
- r((c) => {
3534
- const l = c.includes(d);
3535
- return e === "single" ? l ? [] : [d] : l ? c.filter((f) => f !== d) : [...c, d];
3536
- });
3537
- }
3538
- function u(d) {
3539
- r(e === "single" ? [d] : [d]);
3540
- }
3541
- function g() {
3542
- r([]);
3543
- }
3544
- const m = ft(
3545
- () => ({
3546
- values: i,
3547
- mode: e,
3548
- toggle: a,
3549
- set: u,
3550
- clear: g
3551
- }),
3552
- [i, e]
3553
- );
3554
- return /* @__PURE__ */ o(Ut.Provider, { value: m, children: /* @__PURE__ */ o(
3555
- "div",
3556
- {
3557
- "aria-orientation": "vertical",
3558
- className: "uui-list uui-flex uui-flex-col",
3559
- role: "listbox",
3560
- children: s
3561
- }
3562
- ) });
3563
- }, ln = L(
3564
- ({
3565
- shape: e,
3566
- touchEffects: t = ["ripple"],
3567
- focusEffects: n = ["ring", "overlay"],
3568
- selectedEffects: i = ["color"],
3569
- checkedIcon: r,
3570
- uncheckedIcon: s,
3571
- selectedColor: a,
3572
- textColor: u,
3573
- labelColor: g,
3574
- descriptionColor: m,
3575
- shortcutColor: d,
3576
- fixedLeading: c,
3577
- color: l,
3578
- icon: f,
3579
- endIcon: h,
3580
- leading: C,
3581
- trailing: w,
3582
- label: y,
3583
- disabled: b = !1,
3584
- className: x,
3585
- onClick: F,
3586
- badge: B,
3587
- expanded: V,
3588
- active: P,
3589
- children: A,
3590
- focusVisible: D,
3591
- type: M = "item",
3592
- checked: S,
3593
- description: v,
3594
- shortcut: k,
3595
- density: T,
3596
- horizontal: U,
3597
- labelFont: Z,
3598
- font: ie,
3599
- descriptionFont: Se,
3600
- shortcutFont: he,
3601
- selected: z,
3602
- __index: Ae,
3603
- __interactionsDisabled: De,
3604
- onChange: Oe,
3605
- variant: G = "classic",
3606
- ...X
3607
- }, me) => {
3608
- const ge = ne(null), pe = rt.Children.toArray(A), J = pe.find((K) => Nt(K)), ve = pe.filter((K) => !Nt(K)), se = !!J;
3609
- let H;
3610
- M !== "item" && (M === "radio" ? H = S ? r ?? An : s ?? jn : M === "checkbox" && (H = S ? r ?? Ti : s));
3611
- const j = H ?? C ?? f ?? (c && !U), Q = j && /* @__PURE__ */ o("div", { className: "uui-icon uui-leading", children: j }), Fe = w ?? h;
3612
- let oe;
3613
- B && (typeof B == "string" || typeof B == "number" ? oe = /* @__PURE__ */ o(on, { value: B }) : oe = B);
3614
- const ee = G === "modern" ? "labelLarge" : "bodyLarge", N = Z ?? ie ?? ee, Be = Se ?? (G === "modern" ? "bodySmall" : "bodyMedium"), _ = he ?? ee, le = I();
3615
- le.text(d);
3616
- const Ne = se && !U ? Rn : Fe, je = k && /* @__PURE__ */ o(
3617
- "div",
3618
- {
3619
- className: `uui-menu-item-shortcut ${Ce(_)}`,
3620
- style: le.get(),
3621
- children: k
3622
- }
3623
- ), ae = (k ?? B ?? Ne) && /* @__PURE__ */ R(tt, { children: [
3624
- je,
3625
- oe,
3626
- Ne && /* @__PURE__ */ o("div", { className: "uui-icon uui-trailing", children: Ne })
3627
- ] }), Le = I();
3628
- Le.text(g);
3629
- const xe = y && /* @__PURE__ */ o(
3630
- "div",
3631
- {
3632
- className: `uui-menu-item-label ${Ce(N)}`,
3633
- style: Le.get(),
3634
- children: y
3635
- }
3636
- ), Ee = I();
3637
- (m || !u && G === "classic" && (l != null && l.startsWith("surface"))) && (m ? Ee.text(m) : Ee.text.on("surfaceVariant"));
3638
- const $e = v && /* @__PURE__ */ o(
3639
- "div",
3640
- {
3641
- className: `uui-menu-item-description ${Ce(Be)}`,
3642
- style: Ee.get(),
3643
- children: v
3644
- }
3645
- ), ye = (xe ?? $e) && /* @__PURE__ */ R("div", { className: "uui-menu-item-text", children: [
3646
- xe,
3647
- $e
3648
- ] }), qe = (K) => {
3649
- if (De || b) {
3650
- K == null || K.preventDefault();
3651
- return;
3652
- }
3653
- F == null || F(K), t.includes("ripple") && ge.current && K && It(ge.current, K);
3654
- };
3655
- let be = l ?? (G === "modern" ? "surfaceContainerLow" : "surfaceContainer");
3656
- M === "option" && z && i.includes("color") && (be = a ?? (G === "modern" ? "tertiaryContainer" : "secondaryContainer"));
3657
- const Ie = I();
3658
- Ie.bg.on(be);
3659
- const Te = I();
3660
- Te.bg(be), u ? Te.text(u) : Te.text.on(be);
3661
- const ze = [
3662
- "uui-menu-item",
3663
- x,
3664
- pt(T),
3665
- b && "uui-disabled",
3666
- G === "modern" ? "uui-menu-item-modern" : "uui-menu-item-classic"
3667
- ].filter(Boolean).join(" "), ue = Re(
3668
- e ?? (G === "modern" ? "rounded" : "smooth")
3669
- ), $ = [
3670
- "uui-menu-item-content",
3671
- ue,
3672
- ...n.includes("ring") && P ? ["uui-focus-ring-in"] : [],
3673
- ...n.includes("overlay") && P ? ["uui-focus-overlay"] : [],
3674
- P && "uui-active",
3675
- P && D && "uui-focus-visible"
3676
- ].filter(Boolean).join(" "), Y = /* @__PURE__ */ R("div", { className: $, style: Te.get(), children: [
3677
- ve.length > 0 ? /* @__PURE__ */ o("div", { className: "uui-menu-item-children", children: ve }) : /* @__PURE__ */ R(tt, { children: [
3678
- Q,
3679
- ye,
3680
- ae
3681
- ] }),
3682
- /* @__PURE__ */ o(
3683
- "div",
3684
- {
3685
- className: ["uui-state", ue].join(" "),
3686
- style: Ie.get()
3687
- }
3688
- )
3689
- ] });
3690
- return (
3691
- // eslint-disable-next-line jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events
3692
- /* @__PURE__ */ o(
3693
- "div",
3694
- {
3695
- ...X,
3696
- "aria-checked": M === "radio" || M === "checkbox" ? S ?? !1 : void 0,
3697
- "aria-disabled": b ? "true" : void 0,
3698
- "aria-expanded": se ? V : void 0,
3699
- "aria-haspopup": se ? "menu" : void 0,
3700
- className: ze,
3701
- onClick: qe,
3702
- ref: gt(ge, me),
3703
- role: "option",
3704
- tabIndex: -1,
3705
- children: Y
3706
- }
3707
- )
3708
- );
3709
- }
3710
- );
3711
- ln[zn] = !0;
3712
- ln[rn] = !0;
3713
- ln.displayName = "ListItem";
3714
- const ho = L(
3715
- (e, t) => {
3716
- const {
3717
- density: n,
3718
- icon: i,
3719
- disabled: r,
3720
- elevation: s,
3721
- checked: a,
3722
- children: u,
3723
- color: g = "primary",
3724
- uncheckedColor: m,
3725
- defaultChecked: d,
3726
- hoverEffects: c = ["overlay"],
3727
- touchEffects: l = ["ripple"],
3728
- focusEffects: f = ["ring"],
3729
- selectedEffects: h = [],
3730
- pressedEffects: C = ["overlay", "scale"],
3731
- id: w,
3732
- name: y,
3733
- label: b,
3734
- font: x,
3735
- border: F,
3736
- borderColor: B,
3737
- uncheckedBorder: V,
3738
- uncheckedBorderColor: P,
3739
- onChange: A,
3740
- onClick: D,
3741
- required: M,
3742
- shape: S = "round",
3743
- title: v,
3744
- value: k,
3745
- size: T = "small",
3746
- uncheckedIcon: U,
3747
- description: Z,
3748
- descriptionColor: ie,
3749
- descriptionFont: Se,
3750
- className: he,
3751
- error: z,
3752
- focusColor: Ae,
3753
- labelColor: De,
3754
- textColor: Oe,
3755
- duration: G = 200,
3756
- tooltipAlign: X = "auto",
3757
- textPlacement: me = "end",
3758
- "aria-label": ge,
3759
- readOnly: pe,
3760
- ...J
3761
- } = e, ve = ne(null), se = $t(tn), H = r ?? (se == null ? void 0 : se.disabled), j = qt(), [Q, Fe] = W(!1), oe = ne(null), ee = ne(null), N = ne(null), Be = ne(Tt("check")), _ = w ?? Be.current, le = a !== void 0, [Ne, je] = W(
3762
- d ?? !1
3763
- ), ae = le ? !!a : Ne, Le = ge ?? (b ? void 0 : v), xe = z ? "error" : g, Ee = v ? /* @__PURE__ */ o("div", { id: `${_}-tip`, children: v }) : null, $e = (de) => {
3764
- if (pe) {
3765
- de.preventDefault();
3766
- return;
3767
- }
3768
- const Ye = de.currentTarget;
3769
- le || je(Ye.checked), A == null || A(de);
3770
- }, ye = (de) => {
3771
- if (pe) {
3772
- de.preventDefault();
3773
- return;
3774
- }
3775
- l.includes("ripple") && (ve.current && clearTimeout(ve.current), ve.current = window.setTimeout(() => {
3776
- N.current && ee.current && (It(N.current, de, ee.current), ve.current = null);
3777
- }, G)), D == null || D(de);
3778
- }, qe = (de) => {
3779
- var Ye;
3780
- Fe(!0), (Ye = e.onFocus) == null || Ye.call(e, de);
3781
- }, be = (de) => {
3782
- var Ye;
3783
- Fe(!1), (Ye = e.onBlur) == null || Ye.call(e, de);
3784
- }, Ie = I(), Te = [
3785
- "uui-switch",
3786
- pt(n),
3787
- he,
3788
- H && "uui-disabled",
3789
- ...u ? [] : [Ct(T)]
3790
- ].filter(Boolean).join(" "), ze = [
3791
- "uui-switch-control",
3792
- ae && "uui-checked",
3793
- U && "uui-symmetric-thumb",
3794
- ...c.includes("overlay") && !pe ? ["uui-hover-overlay"] : [],
3795
- ...f.includes("overlay") && j && Q ? ["uui-focus-overlay"] : [],
3796
- ...h.includes("overlay") ? ["uui-selected-overlay"] : [],
3797
- ...C.includes("overlay") && !pe ? ["uui-pressed-overlay"] : [],
3798
- ...C.includes("scale") && !pe ? ["uui-pressed-scale"] : [],
3799
- Re(S),
3800
- f.includes("ring") && j && Q && "uui-focus-visible uui-focus-ring"
3801
- ].filter(Boolean).join(" "), ue = I();
3802
- Ae && j && Q && ue.set(
3803
- "--uui-focus-color",
3804
- $n(Ae).color
3805
- ), ue.set("--uui-switch-duration", `${G}ms`);
3806
- const $ = ["uui-input"].filter(Boolean).join(" "), Y = ["uui-state", Re("round")].filter(Boolean).join(" "), Me = I(), Qe = [
3807
- "uui-switch-track",
3808
- Je(ae ? F : V ?? F ?? 2),
3809
- Re(S),
3810
- st(s)
3811
- ].filter(Boolean).join(" "), Ze = I(), q = ["uui-switch-thumb", Re(S)].filter(Boolean).join(" "), ce = ["uui-icon"].filter(Boolean).join(" "), He = I(), _e = ["uui-switch-glyph"].filter(Boolean).join(" "), We = I(), te = I();
3812
- Ze.border(z ? "error" : B ?? "outline"), te.border(z ? "error" : B ?? "outline"), ae ? (Me.bg(xe), Ze.bg(z ? "errorContainer" : g), We.bg.on(g), He.text.onContainer(g)) : (P && (Ze.border(z ? "error" : P), te.border(z ? "error" : P)), Me.bg(z ? "error" : m ?? "onSurface"), Ze.bg(
3813
- z ? "errorContainer" : m ?? "surfaceContainerHighest"
3814
- ), m ? (We.bg.on(m), He.text.onContainer(m)) : (We.bg(U ? "onSurfaceVariant" : "outline"), He.text("surfaceContainerHighest")));
3815
- let Xe;
3816
- if (u) {
3817
- const de = [
3818
- "uui-switch-content uui-overflow-hidden",
3819
- Re(S),
3820
- Je(F),
3821
- st(s)
3822
- ].filter(Boolean).join(" ");
3823
- Xe = /* @__PURE__ */ R("div", { className: de, style: te.get(), children: [
3824
- u,
3825
- /* @__PURE__ */ o(
3826
- "div",
3827
- {
3828
- className: Y,
3829
- ref: N,
3830
- style: Me.get()
3831
- }
3832
- )
3833
- ] });
3834
- } else {
3835
- const de = ae ? i : U;
3836
- Xe = /* @__PURE__ */ R(tt, { children: [
3837
- /* @__PURE__ */ o("div", { className: Qe, style: Ze.get() }),
3838
- /* @__PURE__ */ R("div", { className: q, children: [
3839
- /* @__PURE__ */ o("div", { className: _e, style: We.get(), children: /* @__PURE__ */ o("div", { className: ce, style: He.get(), children: de }) }),
3840
- /* @__PURE__ */ o(
3841
- "div",
3842
- {
3843
- className: Y,
3844
- ref: N,
3845
- style: Me.get()
3846
- }
3847
- )
3848
- ] })
3849
- ] });
3850
- }
3851
- const Ve = I();
3852
- Ve.text(
3853
- (z ? "error" : void 0) ?? De ?? Oe ?? "onSurface"
3854
- );
3855
- const re = [
3856
- Ce(x ?? "bodyMedium"),
3857
- "uui-switch-label"
3858
- ].join(" "), et = b && /* @__PURE__ */ R("label", { className: re, htmlFor: _, style: Ve.get(), children: [
3859
- b,
3860
- M && /* @__PURE__ */ o("span", { "aria-hidden": "true", className: "uui-required", children: "*" })
3861
- ] }), Ge = I();
3862
- z ? Ge.text("error") : ie ? Ge.text(ie) : Ge.text.on("surfaceVariant");
3863
- const ct = [
3864
- Ce(Se ?? "bodySmall"),
3865
- z && "uui-error uui-support-text",
3866
- Z && !z && "uui-description uui-support-text"
3867
- ].filter(Boolean).join(" "), it = (Z ?? z) && /* @__PURE__ */ o("div", { className: ct, style: Ge.get(), children: z ?? Z }), vt = (et ?? it) && /* @__PURE__ */ R(tt, { children: [
3868
- et,
3869
- it
3870
- ] }), Ke = I();
3871
- return me === "end" ? (Ve.set("gridColumn", 2), Ge.set("gridColumn", 2), Ke.set("gridColumn", 1)) : me === "start" ? (Ve.set("gridColumn", 1), Ge.set("gridColumn", 1), Ke.set("gridColumn", 2), Ke.set("gridRow", 1)) : (Ie.set("gridTemplateColumns", "1fr"), Ie.set("justifyItems", "start")), me === "top" && (Ke.set("order", 1), Ge.set("order", 2)), /* @__PURE__ */ R("div", { className: Te, style: Ie.get(), children: [
3872
- /* @__PURE__ */ o(
3873
- "div",
3874
- {
3875
- className: "uui-switch-control-wrapper",
3876
- style: Ke.get(),
3877
- children: /* @__PURE__ */ R(
3878
- "div",
3879
- {
3880
- className: ze,
3881
- ref: ee,
3882
- style: ue.get(),
3883
- children: [
3884
- /* @__PURE__ */ o(
3885
- "input",
3886
- {
3887
- "aria-label": Le,
3888
- "aria-readonly": pe === !0 ? !0 : void 0,
3889
- checked: !!ae,
3890
- className: $,
3891
- disabled: H,
3892
- id: _,
3893
- name: y,
3894
- onBlur: be,
3895
- onChange: $e,
3896
- onClick: ye,
3897
- onFocus: qe,
3898
- readOnly: pe,
3899
- ref: gt(oe, t),
3900
- type: "checkbox",
3901
- value: k,
3902
- ...J
3903
- }
3904
- ),
3905
- Xe
3906
- ]
3907
- }
3908
- )
3909
- }
3910
- ),
3911
- vt,
3912
- Ee && /* @__PURE__ */ o(
3913
- Vt,
3914
- {
3915
- align: X,
3916
- tooltip: Ee,
3917
- triggerRef: oe
3918
- }
3919
- )
3920
- ] });
3921
- }
3922
- );
3923
- ho.displayName = "Switch";
3924
- const yo = L(
3925
- ({ font: e = "headlineLarge", ...t }, n) => /* @__PURE__ */ o(
3926
- ut,
3927
- {
3928
- ref: n,
3929
- ...t,
3930
- component: "h1",
3931
- elementClass: "uui-h1",
3932
- font: e
3933
- }
3934
- )
3935
- );
3936
- yo.displayName = "H1";
3937
- const bo = L(
3938
- ({ font: e = "headlineMedium", ...t }, n) => /* @__PURE__ */ o(
3939
- ut,
3940
- {
3941
- ref: n,
3942
- ...t,
3943
- component: "h2",
3944
- elementClass: "uui-h2",
3945
- font: e
3946
- }
3947
- )
3948
- );
3949
- bo.displayName = "H2";
3950
- const Co = L(
3951
- ({ font: e = "headlineSmall", ...t }, n) => /* @__PURE__ */ o(
3952
- ut,
3953
- {
3954
- ref: n,
3955
- ...t,
3956
- component: "h3",
3957
- elementClass: "uui-h3",
3958
- font: e
3959
- }
3960
- )
3961
- );
3962
- Co.displayName = "H3";
3963
- const vo = L(
3964
- ({ font: e = "titleLarge", ...t }, n) => /* @__PURE__ */ o(
3965
- ut,
3966
- {
3967
- ref: n,
3968
- ...t,
3969
- component: "h4",
3970
- elementClass: "uui-h4",
3971
- font: e
3972
- }
3973
- )
3974
- );
3975
- vo.displayName = "H4";
3976
- const xo = L(
3977
- ({ font: e = "titleMedium", ...t }, n) => /* @__PURE__ */ o(
3978
- ut,
3979
- {
3980
- ref: n,
3981
- ...t,
3982
- component: "h5",
3983
- elementClass: "uui-h5",
3984
- font: e
3985
- }
3986
- )
3987
- );
3988
- xo.displayName = "H5";
3989
- const wo = L(
3990
- ({ font: e = "titleSmall", ...t }, n) => /* @__PURE__ */ o(
3991
- ut,
3992
- {
3993
- ref: n,
3994
- ...t,
3995
- component: "h6",
3996
- elementClass: "uui-h6",
3997
- font: e
3998
- }
3999
- )
4000
- );
4001
- wo.displayName = "H6";
4002
- const So = L((e, t) => /* @__PURE__ */ o(ut, { ref: t, ...e, component: "p", elementClass: "uui-p" }));
4003
- So.displayName = "P";
4004
- const No = L((e, t) => /* @__PURE__ */ o(ut, { ref: t, ...e, component: "span", elementClass: "uui-span" }));
4005
- No.displayName = "Span";
4006
- const ko = L(
4007
- ({ font: e = "labelLarge", ...t }, n) => /* @__PURE__ */ o(
4008
- ut,
4009
- {
4010
- ref: n,
4011
- ...t,
4012
- component: "label",
4013
- elementClass: "uui-label",
4014
- font: e
4015
- }
4016
- )
4017
- );
4018
- ko.displayName = "Label";
4019
- const Zn = L(
4020
- (e, t) => {
4021
- const {
4022
- open: n,
4023
- animation: i = "slideDown",
4024
- duration: r = 220,
4025
- motionStyle: s = "regular",
4026
- className: a,
4027
- children: u,
4028
- style: g,
4029
- orientation: m = "vertical",
4030
- ...d
4031
- } = e, c = ne(!0), l = ne(null), f = ne(null), [h, C] = W(void 0), w = m === "vertical" ? "height" : "width", { animationVars: y, animate: b, animating: x } = Dn({
4032
- t1: r
4033
- }), F = ({ height: D, width: M }) => {
4034
- console.log("calc HxW", D, M), C(m === "vertical" ? D : M), c.current = !1;
4035
- };
4036
- console.log("open:", n, "anim:", x, h), Si(l, F, !x), fe(() => {
4037
- c.current || b(n ? "open" : "closed");
4038
- }, [n]), fe(() => {
4039
- const D = l.current;
4040
- if (!D)
4041
- return;
4042
- C(m === "vertical" ? D.scrollHeight : D.scrollWidth);
4043
- }, [m]);
4044
- const B = [
4045
- "uui-collapse",
4046
- a,
4047
- m === "vertical" ? "uui-vertical" : "uui-horizontal"
4048
- ].filter(Boolean).join(" "), V = I();
4049
- V.merge(y), n ? (h !== void 0 && V.set(w, `${h}px`), m === "horizontal" && (V.set("display", "inline-flex"), V.set("width", "100%"))) : V.set(w, "0px");
4050
- const P = [
4051
- x && Bn(i),
4052
- Ln(s)
4053
- ].filter(Boolean).join(" "), A = I(g);
4054
- return A.merge(y), /* @__PURE__ */ o(
4055
- "div",
4056
- {
4057
- "aria-hidden": !n,
4058
- className: B,
4059
- inert: n ? void 0 : "",
4060
- ref: f,
4061
- style: V.get(),
4062
- children: /* @__PURE__ */ o("div", { className: "uui-collapse-wrapper", ref: l, children: /* @__PURE__ */ o(
4063
- Pe,
4064
- {
4065
- ...d,
4066
- className: P,
4067
- ref: t,
4068
- style: A.get(),
4069
- children: u
4070
- }
4071
- ) })
4072
- }
4073
- );
4074
- }
4075
- );
4076
- Zn.displayName = "Collapse";
4077
- const Kn = Symbol.for("uui.accordionItem");
4078
- function Fo(e) {
4079
- return mt(e) && typeof e.type != "string" && !!e.type[Kn];
4080
- }
4081
- const Yo = ({
4082
- type: e = "single",
4083
- children: t,
4084
- ...n
4085
- }) => {
4086
- const [i, r] = W([]), s = rt.Children.toArray(t).filter(Fo);
4087
- function a(d) {
4088
- r((c) => {
4089
- const l = c.includes(d);
4090
- return e === "single" ? l ? [] : [d] : l ? c.filter((f) => f !== d) : [...c, d];
4091
- });
4092
- }
4093
- function u(d) {
4094
- r(e === "single" ? [d] : [d]);
4095
- }
4096
- function g() {
4097
- r([]);
4098
- }
4099
- const m = ft(
4100
- () => ({
4101
- values: i,
4102
- mode: e,
4103
- toggle: a,
4104
- set: u,
4105
- clear: g
4106
- }),
4107
- [i, e]
4108
- );
4109
- return /* @__PURE__ */ o(Ut.Provider, { value: m, children: /* @__PURE__ */ o("div", { className: "uui-accordion uui-flex uui-flex-col", children: s }) });
4110
- }, Bo = ({
4111
- value: e,
4112
- title: t,
4113
- children: n
4114
- }) => {
4115
- const { values: i, toggle: r } = Mn(), s = i.includes(e), a = `accordion-${e}`;
4116
- return /* @__PURE__ */ R("div", { className: "uui-accordion-item", "data-open": s, children: [
4117
- /* @__PURE__ */ o(
4118
- "button",
4119
- {
4120
- "aria-controls": `${a}-content`,
4121
- "aria-expanded": s,
4122
- className: "uui-accordion-trigger",
4123
- id: `${a}-trigger`,
4124
- onClick: () => {
4125
- r(e);
4126
- },
4127
- type: "button",
4128
- children: t
4129
- }
4130
- ),
4131
- /* @__PURE__ */ o(Zn, { open: s, children: /* @__PURE__ */ o(
4132
- "div",
4133
- {
4134
- "aria-labelledby": `${a}-trigger`,
4135
- id: `${a}-content`,
4136
- role: "region",
4137
- children: n
4138
- }
4139
- ) })
4140
- ] });
4141
- };
4142
- Bo[Kn] = !0;
4143
- const Gn = Symbol.for("uui.tab");
4144
- function Lo(e) {
4145
- return mt(e) && typeof e.type != "string" && !!e.type[Gn];
4146
- }
4147
- const Jo = ({ defaultValue: e, children: t, ...n }) => {
4148
- const [i, r] = W([e]), s = xn.toArray(t).filter(Lo);
4149
- function a(d) {
4150
- r([d]);
4151
- }
4152
- const u = ft(
4153
- () => ({
4154
- values: i,
4155
- mode: "single",
4156
- toggle: a,
4157
- set: a,
4158
- clear: () => {
4159
- r([]);
4160
- }
4161
- }),
4162
- [i]
4163
- );
4164
- function g(d) {
4165
- const c = s.findIndex(
4166
- (C) => i.includes(C.props.value)
4167
- );
4168
- if (c === -1)
4169
- return;
4170
- let l;
4171
- switch (d.key) {
4172
- case "ArrowRight":
4173
- l = (c + 1) % s.length;
4174
- break;
4175
- case "ArrowLeft":
4176
- l = (c - 1 + s.length) % s.length;
4177
- break;
4178
- case "Home":
4179
- l = 0;
4180
- break;
4181
- case "End":
4182
- l = s.length - 1;
4183
- break;
4184
- default:
4185
- return;
4186
- }
4187
- d.preventDefault();
4188
- const f = s[l].props.value;
4189
- a(f);
4190
- const h = document.getElementById(`uui-tab-${f}-trigger`);
4191
- h == null || h.focus();
4192
- }
4193
- const m = s.map((d) => ({
4194
- label: d.props.label,
4195
- value: d.props.value
4196
- })).map(({ label: d, value: c }) => /* @__PURE__ */ o(
4197
- "button",
4198
- {
4199
- "aria-controls": `uui-tab-${c}-panel`,
4200
- "aria-selected": i.includes(c),
4201
- className: "uui-tabs-trigger",
4202
- id: `uui-tab-${c}-trigger`,
4203
- onClick: () => {
4204
- a(c);
4205
- },
4206
- role: "tab",
4207
- tabIndex: i.includes(c) ? 0 : -1,
4208
- children: d
4209
- },
4210
- c
4211
- ));
4212
- return /* @__PURE__ */ o(Ut.Provider, { value: u, children: /* @__PURE__ */ R(Pe, { direction: "col", gap: 2, ...n, children: [
4213
- /* @__PURE__ */ o(
4214
- "div",
4215
- {
4216
- "aria-orientation": "horizontal",
4217
- className: "uui-tabs-list",
4218
- onKeyDown: g,
4219
- role: "tablist",
4220
- children: m
4221
- }
4222
- ),
4223
- /* @__PURE__ */ o("div", { className: "uui-tabs-panels", children: s })
4224
- ] }) });
4225
- }, Xn = ({ value: e, label: t, children: n }) => {
4226
- const { values: i } = Mn(), r = i.includes(e);
4227
- return /* @__PURE__ */ o(
4228
- "div",
4229
- {
4230
- "aria-labelledby": `uui-tab-${e}-trigger`,
4231
- className: "uui-tabs-panel",
4232
- hidden: !r,
4233
- id: `uui-tab-${e}-panel`,
4234
- role: "tabpanel",
4235
- children: n
4236
- }
4237
- );
4238
- };
4239
- Xn[Gn] = !0;
4240
- Xn.displayName = "Tab";
4241
- const $o = L(
4242
- ({
4243
- variant: e = "docked",
4244
- color: t,
4245
- elevation: n,
4246
- shape: i,
4247
- density: r,
4248
- fullWidth: s,
4249
- placement: a = "bottom",
4250
- fixed: u,
4251
- divider: g,
4252
- children: m,
4253
- className: d,
4254
- disabled: c,
4255
- orientation: l = "horizontal",
4256
- ...f
4257
- }, h) => {
4258
- const C = e === "floating", w = n ?? (C ? 3 : 0), y = i ?? (C ? "round" : void 0), b = t ?? (e === "floating" ? "surfaceContainerHigh" : "surfaceContainer"), x = [
4259
- "uui-toolbar",
4260
- `uui-toolbar-${e}`,
4261
- c && "uui-disabled",
4262
- d,
4263
- s && "uui-toolbar-full",
4264
- u && "uui-toolbar-fixed",
4265
- g && "uui-toolbar-divider",
4266
- w && st(w),
4267
- y && Re(y),
4268
- r && pt(r),
4269
- l === "horizontal" ? "uui-horizontal" : "uui-vertical"
4270
- ].filter(Boolean).join(" ");
4271
- return /* @__PURE__ */ o(
4272
- Pe,
4273
- {
4274
- ref: h,
4275
- ...f,
4276
- className: x,
4277
- color: b,
4278
- component: "div",
4279
- "data-position": a,
4280
- direction: l === "horizontal" ? "row" : "col",
4281
- disabled: c,
4282
- children: m
4283
- }
4284
- );
4285
- }
4286
- );
4287
- $o.displayName = "Toolbar";
4288
- const Eo = L(
4289
- ({
4290
- variant: e = "linear",
4291
- value: t,
4292
- min: n = 0,
4293
- max: i = 100,
4294
- color: r = "primary",
4295
- size: s = "medium",
4296
- thickness: a,
4297
- className: u,
4298
- style: g,
4299
- ...m
4300
- }, d) => {
4301
- const c = typeof t == "number", l = ft(() => c ? Math.min(Math.max(t, n), i) : 0, [t, n, i, c]), f = ft(() => c ? (l - n) / (i - n) * 100 : 0, [l, n, i, c]), h = c ? {
4302
- role: "progressbar",
4303
- "aria-valuemin": n,
4304
- "aria-valuemax": i,
4305
- "aria-valuenow": l
4306
- } : {
4307
- role: "progressbar",
4308
- "aria-valuemin": n,
4309
- "aria-valuemax": i
4310
- }, C = [
4311
- "uui-progress",
4312
- e === "circular" ? "uui-progress-circular" : "uui-progress-linear",
4313
- c ? "" : "uui-progress-indeterminate",
4314
- Ct(s),
4315
- u
4316
- ].filter(Boolean).join(" "), w = {
4317
- ...g ?? {},
4318
- ...a ? { "--uui-progress-thickness": `${a}px` } : {}
4319
- };
4320
- if (e === "circular") {
4321
- const x = I(), F = I();
4322
- return x.stroke.container(r), F.stroke(r), /* @__PURE__ */ o(
4323
- Pe,
4324
- {
4325
- className: C,
4326
- ref: d,
4327
- style: w,
4328
- ...h,
4329
- ...m,
4330
- children: /* @__PURE__ */ R("svg", { className: "uui-progress-svg", viewBox: "0 0 100 100", children: [
4331
- /* @__PURE__ */ o(
4332
- "circle",
4333
- {
4334
- className: "uui-progress-track",
4335
- cx: "50",
4336
- cy: "50",
4337
- fill: "none",
4338
- r: "45",
4339
- style: x.get()
4340
- }
4341
- ),
4342
- /* @__PURE__ */ o(
4343
- "circle",
4344
- {
4345
- className: "uui-progress-indicator",
4346
- cx: "50",
4347
- cy: "50",
4348
- fill: "none",
4349
- pathLength: "100",
4350
- r: "45",
4351
- strokeDasharray: "100",
4352
- strokeDashoffset: c ? 100 - f : void 0,
4353
- style: F.get()
4354
- }
4355
- )
4356
- ] })
4357
- }
4358
- );
4359
- }
4360
- const y = I(), b = I();
4361
- return y.bg.container(r), b.bg(r), /* @__PURE__ */ o(
4362
- Pe,
4363
- {
4364
- className: C,
4365
- ref: d,
4366
- style: w,
4367
- ...h,
4368
- ...m,
4369
- children: /* @__PURE__ */ o("div", { className: "uui-progress-track", style: y.get(), children: /* @__PURE__ */ o(
4370
- "div",
4371
- {
4372
- className: "uui-progress-indicator",
4373
- style: {
4374
- ...b.get(),
4375
- ...c ? { width: `${f}%` } : {}
4376
- }
4377
- }
4378
- ) })
4379
- }
4380
- );
4381
- }
4382
- );
4383
- Eo.displayName = "Progress";
4384
- const Yn = Symbol.for("uui.avatar");
4385
- function Io(e) {
4386
- return mt(e) && typeof e.type != "string" && !!e.type[Yn];
4387
- }
4388
- const Cn = Nn.filter(
4389
- (e) => e !== "white" && e !== "black"
4390
- );
4391
- function To(e) {
4392
- let t = 0;
4393
- for (let n = 0; n < e.length; n++)
4394
- t = e.charCodeAt(n) + ((t << 5) - t);
4395
- return Math.abs(t);
4396
- }
4397
- function Vo(e) {
4398
- const t = e == null ? void 0 : e.trim().split(/\s+/).filter(Boolean);
4399
- if (!(t != null && t.length))
4400
- return "";
4401
- const n = t[0][0], i = t.length > 1 ? t[t.length - 1][0] : "";
4402
- return (n + i).toUpperCase();
4403
- }
4404
- const an = L(
4405
- ({
4406
- children: e,
4407
- className: t,
4408
- shape: n = "round",
4409
- size: i = "medium",
4410
- src: r,
4411
- alt: s,
4412
- name: a,
4413
- color: u,
4414
- ...g
4415
- }, m) => {
4416
- const [d, c] = W(!1), l = ["uui-avatar", Ct(i), t].filter(Boolean).join(" "), f = !!(r && !d), h = Vo(a), C = ft(() => {
4417
- if (!a || f || u)
4418
- return;
4419
- const y = To(a) % Cn.length;
4420
- return Cn[y];
4421
- }, [a, f, u]);
4422
- let w;
4423
- return f ? w = /* @__PURE__ */ o(
4424
- "img",
4425
- {
4426
- alt: s ?? a ?? "",
4427
- draggable: !1,
4428
- onError: () => {
4429
- c(!0);
4430
- },
4431
- src: r
4432
- }
4433
- ) : a ? w = /* @__PURE__ */ o("span", { "aria-hidden": !0, children: h }) : w = e, /* @__PURE__ */ o(
4434
- Un,
4435
- {
4436
- "aria-label": f ? void 0 : a,
4437
- className: l,
4438
- color: u ?? C,
4439
- font: "labelLarge",
4440
- ref: m,
4441
- shape: n,
4442
- ...g,
4443
- children: w
4444
- }
4445
- );
4446
- }
4447
- );
4448
- an[Yn] = !0;
4449
- an.displayName = "Avatar";
4450
- const Do = L(
4451
- ({
4452
- children: e,
4453
- max: t,
4454
- overlap: n = 8,
4455
- size: i,
4456
- shape: r,
4457
- border: s,
4458
- borderColor: a,
4459
- overflow: u,
4460
- className: g,
4461
- ...m
4462
- }, d) => {
4463
- const c = xn.toArray(e).filter(Io), l = c.length;
4464
- let f = c, h = 0;
4465
- if (t !== void 0 && l > t) {
4466
- const y = Math.max(t - 1, 0);
4467
- f = c.slice(0, y), h = l - y;
4468
- }
4469
- const C = f.map(
4470
- (y, b) => Lt(y, {
4471
- key: y.key ?? b,
4472
- size: i ?? y.props.size,
4473
- shape: r ?? y.props.shape,
4474
- border: s ?? y.props.border,
4475
- borderColor: a ?? y.props.borderColor,
4476
- style: {
4477
- ...y.props.style ?? {},
4478
- marginInlineStart: b === 0 ? 0 : -n,
4479
- zIndex: b,
4480
- position: "relative"
4481
- }
4482
- })
4483
- );
4484
- if (h > 0) {
4485
- const y = (u == null ? void 0 : u(h)) ?? /* @__PURE__ */ R(an, { shape: r, size: i, children: [
4486
- "+",
4487
- h
4488
- ] });
4489
- C.push(
4490
- Lt(y, {
4491
- key: "overflow",
4492
- style: {
4493
- marginInlineStart: C.length === 0 ? 0 : -n,
4494
- zIndex: C.length,
4495
- position: "relative"
4496
- }
4497
- })
4498
- );
4499
- }
4500
- const w = ["uui-avatar-group", g].filter(Boolean).join(" ");
4501
- return /* @__PURE__ */ o(Wn, { alignItems: "center", ref: d, ...m, className: w, children: C });
4502
- }
4503
- );
4504
- Do.displayName = "AvatarGroup";
4505
- export {
4506
- Yo as Accordion,
4507
- Bo as AccordionItem,
4508
- Rn as ArrowRightIcon,
4509
- Ji as Article,
4510
- Qi as Aside,
4511
- an as Avatar,
4512
- Do as AvatarGroup,
4513
- on as Badge,
4514
- mo as BottomSheet,
4515
- Pe as BoxBase,
4516
- Fi as Button,
4517
- kt as ButtonBase,
4518
- Li as Card,
4519
- Di as Checkbox,
4520
- nn as CheckboxBase,
4521
- Ti as CheckboxIcon,
4522
- $i as CheckmarkIcon,
4523
- Bi as Chip,
4524
- Zn as Collapse,
4525
- eo as Content,
4526
- I as ControlStyle,
4527
- Oi as DateField,
4528
- Hi as DateTimeField,
4529
- lo as Dialog,
4530
- ao as DialogActions,
4531
- zt as DialogBase,
4532
- uo as DialogContent,
4533
- co as DialogTitle,
4534
- to as Div,
4535
- _n as Divider,
4536
- fo as Drawer,
4537
- Ai as EmailField,
4538
- zi as Fab,
4539
- nt as FieldBase,
4540
- qn as Fieldset,
4541
- tn as FieldsetContext,
4542
- Wn as Flex,
4543
- no as Footer,
4544
- Un as Grid,
4545
- yo as H1,
4546
- bo as H2,
4547
- Co as H3,
4548
- vo as H4,
4549
- xo as H5,
4550
- wo as H6,
4551
- io as Header,
4552
- On as IS_DIVIDER,
4553
- Pn as IS_MENU,
4554
- rn as IS_MENU_ITEM,
4555
- Zi as IconButton,
4556
- Ei as IndeterminateIcon,
4557
- ko as Label,
4558
- Xo as List,
4559
- ln as ListItem,
4560
- oo as Main,
4561
- sn as Menu,
4562
- Vi as MenuCheckIcon,
4563
- Hn as MenuItem,
4564
- Wi as MonthField,
4565
- ro as Nav,
4566
- Ri as NumberField,
4567
- So as P,
4568
- Pi as PasswordField,
4569
- ji as PhoneField,
4570
- Eo as Progress,
4571
- Xi as Radio,
4572
- An as RadioCheckedIcon,
4573
- po as RadioGroup,
4574
- Tn as RadioGroupContext,
4575
- Ii as RadioIcon,
4576
- jn as RadioUncheckedIcon,
4577
- so as Section,
4578
- Ut as SelectionContext,
4579
- No as Span,
4580
- Ci as Spinner,
4581
- ho as Switch,
4582
- Xn as Tab,
4583
- Jo as Tabs,
4584
- ut as TextBase,
4585
- Mi as TextField,
4586
- Vn as ThemeContext,
4587
- Nn as ThemeExtendedColorKeys,
4588
- Go as ThemeProvider,
4589
- Fn as ThemeSchemeKeys,
4590
- Sn as ThemeSemanticColorKeys,
4591
- kn as ThemeSurfaceColorKeys,
4592
- _i as TimeField,
4593
- In as Toast,
4594
- hi as ToastViewport,
4595
- Ki as ToggleButton,
4596
- $o as Toolbar,
4597
- Yi as Tooltip,
4598
- qi as UrlField,
4599
- Ui as WeekField,
4600
- En as calculateFloatingPosition,
4601
- ui as capitalize,
4602
- wn as clampInt,
4603
- It as createRipple,
4604
- yn as defaultTheme,
4605
- ci as ensureInputMethod,
4606
- fi as generateMaterialColors,
4607
- mi as generateSchemes,
4608
- si as getAlignClass,
4609
- Bn as getAnimationClass,
4610
- Ho as getAnimationList,
4611
- Je as getBorderClass,
4612
- ht as getBorderColor,
4613
- en as getBorderColorClass,
4614
- _o as getColorClasses,
4615
- pt as getDensityClass,
4616
- st as getElevationClass,
4617
- zo as getFixedColorClasses,
4618
- Ce as getFontClass,
4619
- di as getInputMethod,
4620
- Ln as getMotionStyleClass,
4621
- Po as getOutlineClass,
4622
- li as getSemanticColorClasses,
4623
- Wo as getSemanticColorVar,
4624
- Re as getShapeClass,
4625
- Ct as getSizeClass,
4626
- Wt as getSurfaceColorClasses,
4627
- $n as getSurfaceColorVar,
4628
- qo as getTintOverlayColor,
4629
- Uo as hexToRgb,
4630
- ai as hexToRgbValues,
4631
- Ot as inverseColorMap,
4632
- Xt as isDivider,
4633
- Nt as isMenu,
4634
- Gt as isMenuItem,
4635
- gt as mergeRefs,
4636
- _t as motionClassMap,
4637
- Oo as setFocusVisible,
4638
- Et as toKebabCase,
4639
- Zo as toast,
4640
- Tt as uniqueID,
4641
- Dn as useAnimate,
4642
- vi as useClickOutside,
4643
- xi as useEscapeHandler,
4644
- wi as useFocusState,
4645
- qt as useFocusVisible,
4646
- Si as useResizeObserver,
4647
- Mn as useSelection,
4648
- Ko as useTheme
4649
- };