@versini/ui-panel 1.3.2 → 1.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +65 -65
- package/package.json +4 -4
package/dist/index.js
CHANGED
|
@@ -4,13 +4,13 @@ import * as m from "react";
|
|
|
4
4
|
import M, { useId as V, useRef as D, useEffect as W } from "react";
|
|
5
5
|
import { useFloating as G, useClick as X, useDismiss as Y, useRole as q, useInteractions as H, useMergeRefs as J, FloatingPortal as K, FloatingOverlay as Q, FloatingFocusManager as Z } from "@floating-ui/react";
|
|
6
6
|
/*!
|
|
7
|
-
@versini/ui-panel v1.3.
|
|
7
|
+
@versini/ui-panel v1.3.3
|
|
8
8
|
© 2025 gizmette.com
|
|
9
9
|
*/
|
|
10
10
|
try {
|
|
11
11
|
window.__VERSINI_UI_PANEL__ || (window.__VERSINI_UI_PANEL__ = {
|
|
12
|
-
version: "1.3.
|
|
13
|
-
buildTime: "01/04/2025
|
|
12
|
+
version: "1.3.3",
|
|
13
|
+
buildTime: "01/04/2025 04:09 PM EST",
|
|
14
14
|
homepage: "https://github.com/aversini/ui-components",
|
|
15
15
|
license: "MIT"
|
|
16
16
|
});
|
|
@@ -23,14 +23,14 @@ const C = "av-messagebox", P = "av-panel", O = "av-button", _ = "icon", z = "but
|
|
|
23
23
|
labelLeft: a,
|
|
24
24
|
align: o
|
|
25
25
|
}) => {
|
|
26
|
-
const
|
|
26
|
+
const l = "max-h-8 py-0 px-2", c = "max-h-9 py-1 px-3", d = "max-h-12 py-2 px-4";
|
|
27
27
|
switch (e) {
|
|
28
28
|
case z:
|
|
29
29
|
case T:
|
|
30
30
|
return i({
|
|
31
|
-
[
|
|
31
|
+
[l]: t === "small",
|
|
32
32
|
[c]: t === "medium",
|
|
33
|
-
[
|
|
33
|
+
[d]: t === "large"
|
|
34
34
|
});
|
|
35
35
|
case _:
|
|
36
36
|
return i("inline-flex items-center", {
|
|
@@ -51,20 +51,20 @@ const C = "av-messagebox", P = "av-panel", O = "av-button", _ = "icon", z = "but
|
|
|
51
51
|
labelRight: r,
|
|
52
52
|
labelLeft: a
|
|
53
53
|
}) => {
|
|
54
|
-
const o = "text-sm font-medium",
|
|
54
|
+
const o = "text-sm font-medium", l = "text-base font-medium", c = "text-lg font-medium";
|
|
55
55
|
switch (e) {
|
|
56
56
|
case z:
|
|
57
57
|
case T:
|
|
58
58
|
return i({
|
|
59
59
|
"text-center": e === T,
|
|
60
60
|
[o]: t === "small",
|
|
61
|
-
[
|
|
61
|
+
[l]: t === "medium",
|
|
62
62
|
[c]: t === "large"
|
|
63
63
|
});
|
|
64
64
|
case _:
|
|
65
65
|
return i({
|
|
66
66
|
[o]: t === "small" && (r || a),
|
|
67
|
-
[
|
|
67
|
+
[l]: t === "medium" && (r || a),
|
|
68
68
|
[c]: t === "large" && (r || a)
|
|
69
69
|
});
|
|
70
70
|
}
|
|
@@ -200,7 +200,7 @@ const C = "av-messagebox", P = "av-panel", O = "av-button", _ = "icon", z = "but
|
|
|
200
200
|
});
|
|
201
201
|
if (r === "selected")
|
|
202
202
|
return "active:text-copy-lighter-active active:bg-action-selected-dark-active";
|
|
203
|
-
},
|
|
203
|
+
}, le = ({
|
|
204
204
|
mode: e,
|
|
205
205
|
noBorder: t,
|
|
206
206
|
variant: r
|
|
@@ -230,7 +230,7 @@ const C = "av-messagebox", P = "av-panel", O = "av-button", _ = "icon", z = "but
|
|
|
230
230
|
});
|
|
231
231
|
if (r === "selected")
|
|
232
232
|
return "border border-border-selected-dark";
|
|
233
|
-
},
|
|
233
|
+
}, de = ({
|
|
234
234
|
focusMode: e
|
|
235
235
|
}) => i("focus:outline", "focus:outline-2", "focus:outline-offset-2", {
|
|
236
236
|
"focus:outline-focus-dark": e === "dark",
|
|
@@ -243,9 +243,9 @@ const C = "av-messagebox", P = "av-panel", O = "av-button", _ = "icon", z = "but
|
|
|
243
243
|
raw: r,
|
|
244
244
|
mode: a,
|
|
245
245
|
focusMode: o,
|
|
246
|
-
disabled:
|
|
246
|
+
disabled: l,
|
|
247
247
|
fullWidth: c,
|
|
248
|
-
size:
|
|
248
|
+
size: d,
|
|
249
249
|
noBorder: h,
|
|
250
250
|
labelRight: g,
|
|
251
251
|
labelLeft: b,
|
|
@@ -266,19 +266,19 @@ const C = "av-messagebox", P = "av-panel", O = "av-button", _ = "icon", z = "but
|
|
|
266
266
|
oe({ radius: p }),
|
|
267
267
|
ee({
|
|
268
268
|
type: e,
|
|
269
|
-
size:
|
|
269
|
+
size: d,
|
|
270
270
|
labelRight: g,
|
|
271
271
|
labelLeft: b,
|
|
272
272
|
align: v
|
|
273
273
|
}),
|
|
274
|
-
re({ type: e, size:
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
ie({ mode: a, variant: s, disabled:
|
|
278
|
-
ne({ mode: a, variant: s, disabled:
|
|
274
|
+
re({ type: e, size: d, labelRight: g, labelLeft: b }),
|
|
275
|
+
le({ mode: a, variant: s, noBorder: h }),
|
|
276
|
+
de({ focusMode: o }),
|
|
277
|
+
ie({ mode: a, variant: s, disabled: l }),
|
|
278
|
+
ne({ mode: a, variant: s, disabled: l }),
|
|
279
279
|
{
|
|
280
280
|
"w-full": c,
|
|
281
|
-
"disabled:cursor-not-allowed disabled:opacity-50":
|
|
281
|
+
"disabled:cursor-not-allowed disabled:opacity-50": l
|
|
282
282
|
},
|
|
283
283
|
t
|
|
284
284
|
)), ce = (e, t, r) => {
|
|
@@ -290,8 +290,8 @@ const C = "av-messagebox", P = "av-panel", O = "av-button", _ = "icon", z = "but
|
|
|
290
290
|
"button",
|
|
291
291
|
{
|
|
292
292
|
ref: t,
|
|
293
|
-
onClick: (
|
|
294
|
-
ce(
|
|
293
|
+
onClick: (l) => {
|
|
294
|
+
ce(l, a, r);
|
|
295
295
|
},
|
|
296
296
|
...o
|
|
297
297
|
}
|
|
@@ -305,9 +305,9 @@ const A = M.forwardRef(
|
|
|
305
305
|
mode: r = "system",
|
|
306
306
|
focusMode: a = "system",
|
|
307
307
|
fullWidth: o = !1,
|
|
308
|
-
className:
|
|
308
|
+
className: l,
|
|
309
309
|
type: c = "button",
|
|
310
|
-
raw:
|
|
310
|
+
raw: d = !1,
|
|
311
311
|
noBorder: h = !1,
|
|
312
312
|
"aria-label": g,
|
|
313
313
|
label: b,
|
|
@@ -326,8 +326,8 @@ const A = M.forwardRef(
|
|
|
326
326
|
focusMode: a,
|
|
327
327
|
fullWidth: o,
|
|
328
328
|
disabled: t,
|
|
329
|
-
raw:
|
|
330
|
-
className:
|
|
329
|
+
raw: d,
|
|
330
|
+
className: l,
|
|
331
331
|
noBorder: h,
|
|
332
332
|
size: f,
|
|
333
333
|
labelRight: s,
|
|
@@ -337,10 +337,10 @@ const A = M.forwardRef(
|
|
|
337
337
|
radius: y,
|
|
338
338
|
variant: I
|
|
339
339
|
}), R = i({
|
|
340
|
-
"text-copy-accent-dark": r === "light" && !
|
|
341
|
-
"text-copy-light": r === "dark" && !
|
|
342
|
-
"text-copy-accent-dark dark:text-copy-light": r === "alt-system" && !
|
|
343
|
-
"text-copy-light dark:text-copy-accent-dark": r === "system" && !
|
|
340
|
+
"text-copy-accent-dark": r === "light" && !d,
|
|
341
|
+
"text-copy-light": r === "dark" && !d,
|
|
342
|
+
"text-copy-accent-dark dark:text-copy-light": r === "alt-system" && !d,
|
|
343
|
+
"text-copy-light dark:text-copy-accent-dark": r === "system" && !d
|
|
344
344
|
});
|
|
345
345
|
return /* @__PURE__ */ x(
|
|
346
346
|
L,
|
|
@@ -362,13 +362,13 @@ const A = M.forwardRef(
|
|
|
362
362
|
);
|
|
363
363
|
A.displayName = "ButtonIcon";
|
|
364
364
|
/*!
|
|
365
|
-
@versini/ui-button v4.0.
|
|
365
|
+
@versini/ui-button v4.0.3
|
|
366
366
|
© 2025 gizmette.com
|
|
367
367
|
*/
|
|
368
368
|
try {
|
|
369
369
|
window.__VERSINI_UI_BUTTON__ || (window.__VERSINI_UI_BUTTON__ = {
|
|
370
|
-
version: "4.0.
|
|
371
|
-
buildTime: "01/04/2025
|
|
370
|
+
version: "4.0.3",
|
|
371
|
+
buildTime: "01/04/2025 04:09 PM EST",
|
|
372
372
|
homepage: "https://github.com/aversini/ui-components",
|
|
373
373
|
license: "MIT"
|
|
374
374
|
});
|
|
@@ -381,9 +381,9 @@ const se = M.forwardRef(
|
|
|
381
381
|
mode: r = "system",
|
|
382
382
|
focusMode: a = "system",
|
|
383
383
|
fullWidth: o = !1,
|
|
384
|
-
className:
|
|
384
|
+
className: l,
|
|
385
385
|
type: c = "button",
|
|
386
|
-
raw:
|
|
386
|
+
raw: d = !1,
|
|
387
387
|
noBorder: h = !1,
|
|
388
388
|
"aria-label": g,
|
|
389
389
|
label: b,
|
|
@@ -402,8 +402,8 @@ const se = M.forwardRef(
|
|
|
402
402
|
focusMode: a,
|
|
403
403
|
fullWidth: o,
|
|
404
404
|
disabled: t,
|
|
405
|
-
raw:
|
|
406
|
-
className:
|
|
405
|
+
raw: d,
|
|
406
|
+
className: l,
|
|
407
407
|
noBorder: h,
|
|
408
408
|
size: f,
|
|
409
409
|
labelRight: s,
|
|
@@ -412,10 +412,10 @@ const se = M.forwardRef(
|
|
|
412
412
|
align: p,
|
|
413
413
|
radius: I
|
|
414
414
|
}), R = i({
|
|
415
|
-
"text-copy-accent-dark": r === "light" && !
|
|
416
|
-
"text-copy-light": r === "dark" && !
|
|
417
|
-
"text-copy-accent-dark dark:text-copy-light": r === "alt-system" && !
|
|
418
|
-
"text-copy-light dark:text-copy-accent-dark": r === "system" && !
|
|
415
|
+
"text-copy-accent-dark": r === "light" && !d,
|
|
416
|
+
"text-copy-light": r === "dark" && !d,
|
|
417
|
+
"text-copy-accent-dark dark:text-copy-light": r === "alt-system" && !d,
|
|
418
|
+
"text-copy-light dark:text-copy-accent-dark": r === "system" && !d
|
|
419
419
|
}), j = y ? i(
|
|
420
420
|
"relative",
|
|
421
421
|
"focus-within:static",
|
|
@@ -458,12 +458,12 @@ const ge = ({
|
|
|
458
458
|
viewBox: r,
|
|
459
459
|
className: a,
|
|
460
460
|
defaultViewBox: o,
|
|
461
|
-
size:
|
|
461
|
+
size: l,
|
|
462
462
|
title: c,
|
|
463
|
-
semantic:
|
|
463
|
+
semantic: d = !1,
|
|
464
464
|
...h
|
|
465
465
|
}) => {
|
|
466
|
-
const g = i(
|
|
466
|
+
const g = i(l, a);
|
|
467
467
|
return /* @__PURE__ */ x($, { children: [
|
|
468
468
|
/* @__PURE__ */ n(
|
|
469
469
|
"svg",
|
|
@@ -473,13 +473,13 @@ const ge = ({
|
|
|
473
473
|
viewBox: r || o,
|
|
474
474
|
fill: t || "currentColor",
|
|
475
475
|
role: "img",
|
|
476
|
-
"aria-hidden": !
|
|
476
|
+
"aria-hidden": !d,
|
|
477
477
|
focusable: !1,
|
|
478
478
|
...h,
|
|
479
479
|
children: e
|
|
480
480
|
}
|
|
481
481
|
),
|
|
482
|
-
c &&
|
|
482
|
+
c && d && /* @__PURE__ */ n("span", { className: "sr-only", children: c })
|
|
483
483
|
] });
|
|
484
484
|
};
|
|
485
485
|
/*!
|
|
@@ -489,7 +489,7 @@ const ge = ({
|
|
|
489
489
|
try {
|
|
490
490
|
window.__VERSINI_UI_SVGICON__ || (window.__VERSINI_UI_SVGICON__ = {
|
|
491
491
|
version: "4.0.0",
|
|
492
|
-
buildTime: "01/04/2025
|
|
492
|
+
buildTime: "01/04/2025 04:09 PM EST",
|
|
493
493
|
homepage: "https://github.com/aversini/ui-components",
|
|
494
494
|
license: "MIT"
|
|
495
495
|
});
|
|
@@ -510,17 +510,17 @@ const me = ({
|
|
|
510
510
|
className: e,
|
|
511
511
|
title: r || "Close",
|
|
512
512
|
...o,
|
|
513
|
-
children: /* @__PURE__ */ n("path", { d: "
|
|
513
|
+
children: /* @__PURE__ */ n("path", { d: "M345 137c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-119 119L73 103c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l119 119L39 375c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l119-119L311 409c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-119-119L345 137z" })
|
|
514
514
|
}
|
|
515
515
|
);
|
|
516
516
|
/*!
|
|
517
|
-
@versini/ui-icons v4.
|
|
517
|
+
@versini/ui-icons v4.2.0
|
|
518
518
|
© 2025 gizmette.com
|
|
519
519
|
*/
|
|
520
520
|
try {
|
|
521
521
|
window.__VERSINI_UI_ICONS__ || (window.__VERSINI_UI_ICONS__ = {
|
|
522
|
-
version: "4.
|
|
523
|
-
buildTime: "01/04/2025
|
|
522
|
+
version: "4.2.0",
|
|
523
|
+
buildTime: "01/04/2025 04:09 PM EST",
|
|
524
524
|
homepage: "https://github.com/aversini/ui-components",
|
|
525
525
|
license: "MIT"
|
|
526
526
|
});
|
|
@@ -532,7 +532,7 @@ function he({
|
|
|
532
532
|
open: t,
|
|
533
533
|
onOpenChange: r
|
|
534
534
|
} = {}) {
|
|
535
|
-
const [a, o] = m.useState(e), [
|
|
535
|
+
const [a, o] = m.useState(e), [l, c] = m.useState(), [d, h] = m.useState(), g = t ?? a, b = r ?? o, f = G({
|
|
536
536
|
open: g,
|
|
537
537
|
onOpenChange: b
|
|
538
538
|
}), s = f.context, u = X(s, {
|
|
@@ -547,12 +547,12 @@ function he({
|
|
|
547
547
|
setOpen: b,
|
|
548
548
|
...y,
|
|
549
549
|
...f,
|
|
550
|
-
labelId:
|
|
551
|
-
descriptionId:
|
|
550
|
+
labelId: l,
|
|
551
|
+
descriptionId: d,
|
|
552
552
|
setLabelId: c,
|
|
553
553
|
setDescriptionId: h
|
|
554
554
|
}),
|
|
555
|
-
[g, b, y, f,
|
|
555
|
+
[g, b, y, f, l, d]
|
|
556
556
|
);
|
|
557
557
|
}
|
|
558
558
|
const N = () => {
|
|
@@ -572,11 +572,11 @@ const be = m.forwardRef(function(e, t) {
|
|
|
572
572
|
const { context: r, ...a } = N(), o = J([a.refs.setFloating, t]);
|
|
573
573
|
if (!r.open)
|
|
574
574
|
return null;
|
|
575
|
-
const { overlayBackground:
|
|
576
|
-
[`${
|
|
577
|
-
"bg-black sm:bg-black/[.8]": !
|
|
575
|
+
const { overlayBackground: l, ...c } = e, d = i("grid place-items-center", {
|
|
576
|
+
[`${l}`]: l,
|
|
577
|
+
"bg-black sm:bg-black/[.8]": !l
|
|
578
578
|
});
|
|
579
|
-
return /* @__PURE__ */ n(K, { children: /* @__PURE__ */ n(Q, { className:
|
|
579
|
+
return /* @__PURE__ */ n(K, { children: /* @__PURE__ */ n(Q, { className: d, lockScroll: !0, children: /* @__PURE__ */ n(Z, { context: r, children: /* @__PURE__ */ n(
|
|
580
580
|
"div",
|
|
581
581
|
{
|
|
582
582
|
ref: o,
|
|
@@ -593,11 +593,11 @@ const be = m.forwardRef(function(e, t) {
|
|
|
593
593
|
const { setDescriptionId: a } = N(), o = V();
|
|
594
594
|
return m.useLayoutEffect(() => (a(o), () => a(void 0)), [o, a]), /* @__PURE__ */ n("div", { ...t, ref: r, id: o, children: e });
|
|
595
595
|
}), pe = m.forwardRef(function(e, t) {
|
|
596
|
-
const { setOpen: r } = N(), { trigger: a, className: o, ...
|
|
596
|
+
const { setOpen: r } = N(), { trigger: a, className: o, ...l } = e, c = m.useCallback(() => r(!1), [r]);
|
|
597
597
|
return /* @__PURE__ */ n("div", { className: o, children: m.cloneElement(a, {
|
|
598
598
|
ref: t,
|
|
599
599
|
onClick: c,
|
|
600
|
-
...
|
|
600
|
+
...l
|
|
601
601
|
}) });
|
|
602
602
|
});
|
|
603
603
|
/*!
|
|
@@ -607,7 +607,7 @@ const be = m.forwardRef(function(e, t) {
|
|
|
607
607
|
try {
|
|
608
608
|
window.__VERSINI_UI_MODAL__ || (window.__VERSINI_UI_MODAL__ = {
|
|
609
609
|
version: "1.2.0",
|
|
610
|
-
buildTime: "01/04/2025
|
|
610
|
+
buildTime: "01/04/2025 04:09 PM EST",
|
|
611
611
|
homepage: "https://github.com/aversini/ui-components",
|
|
612
612
|
license: "MIT"
|
|
613
613
|
});
|
|
@@ -639,11 +639,11 @@ const k = "panel", w = "messagebox", ye = ({
|
|
|
639
639
|
title: r,
|
|
640
640
|
children: a,
|
|
641
641
|
footer: o,
|
|
642
|
-
borderMode:
|
|
642
|
+
borderMode: l = "light",
|
|
643
643
|
kind: c = k,
|
|
644
|
-
className:
|
|
644
|
+
className: d
|
|
645
645
|
}) => {
|
|
646
|
-
const h = D(""), g = ye({ className:
|
|
646
|
+
const h = D(""), g = ye({ className: d, kind: c, borderMode: l });
|
|
647
647
|
return W(() => (e && (h.current = document.title, document.title = `${r} | ${h.current}`), () => {
|
|
648
648
|
e && (document.title = h.current);
|
|
649
649
|
}), [r, e]), /* @__PURE__ */ n($, { children: e && /* @__PURE__ */ n(ue, { open: e, onOpenChange: t, children: /* @__PURE__ */ x(be, { className: g.main, children: [
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@versini/ui-panel",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.3",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Arno Versini",
|
|
6
6
|
"publishConfig": {
|
|
@@ -39,8 +39,8 @@
|
|
|
39
39
|
},
|
|
40
40
|
"dependencies": {
|
|
41
41
|
"@tailwindcss/typography": "0.5.15",
|
|
42
|
-
"@versini/ui-button": "4.0.
|
|
43
|
-
"@versini/ui-icons": "4.
|
|
42
|
+
"@versini/ui-button": "4.0.3",
|
|
43
|
+
"@versini/ui-icons": "4.2.0",
|
|
44
44
|
"@versini/ui-modal": "1.2.0",
|
|
45
45
|
"clsx": "2.1.1",
|
|
46
46
|
"tailwindcss": "3.4.17"
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"sideEffects": [
|
|
49
49
|
"**/*.css"
|
|
50
50
|
],
|
|
51
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "88ad6c4972e02710471fede5712f5c94b67a3db9"
|
|
52
52
|
}
|