@versini/ui-togglegroup 3.0.12 → 4.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +20 -20
- package/package.json +4 -4
- package/dist/style.css +0 -1
- package/dist/style.js +0 -0
package/dist/index.js
CHANGED
|
@@ -3,13 +3,13 @@ import * as u from "react";
|
|
|
3
3
|
import C, { useContext as me } from "react";
|
|
4
4
|
import P from "clsx";
|
|
5
5
|
/*!
|
|
6
|
-
@versini/ui-togglegroup
|
|
6
|
+
@versini/ui-togglegroup v4.0.0
|
|
7
7
|
© 2025 gizmette.com
|
|
8
8
|
*/
|
|
9
9
|
try {
|
|
10
10
|
window.__VERSINI_UI_TOGGLEGROUP__ || (window.__VERSINI_UI_TOGGLEGROUP__ = {
|
|
11
|
-
version: "
|
|
12
|
-
buildTime: "03/
|
|
11
|
+
version: "4.0.0",
|
|
12
|
+
buildTime: "03/18/2025 07:53 PM EDT",
|
|
13
13
|
homepage: "https://github.com/aversini/ui-components",
|
|
14
14
|
license: "MIT"
|
|
15
15
|
});
|
|
@@ -187,7 +187,7 @@ function _e(e) {
|
|
|
187
187
|
if (!T) return [];
|
|
188
188
|
const g = Array.from(T.querySelectorAll(`[${v}]`));
|
|
189
189
|
return Array.from(f.itemMap.values()).sort(
|
|
190
|
-
(G,
|
|
190
|
+
(G, E) => g.indexOf(G.ref.current) - g.indexOf(E.ref.current)
|
|
191
191
|
);
|
|
192
192
|
}, [f.collectionRef, f.itemMap]);
|
|
193
193
|
}
|
|
@@ -199,11 +199,11 @@ function _e(e) {
|
|
|
199
199
|
}
|
|
200
200
|
var Ge = globalThis != null && globalThis.document ? u.useLayoutEffect : () => {
|
|
201
201
|
}, Pe = u.useId || (() => {
|
|
202
|
-
}),
|
|
203
|
-
function
|
|
202
|
+
}), xe = 0;
|
|
203
|
+
function Ee(e) {
|
|
204
204
|
const [t, o] = u.useState(Pe());
|
|
205
205
|
return Ge(() => {
|
|
206
|
-
o((r) => r ?? String(
|
|
206
|
+
o((r) => r ?? String(xe++));
|
|
207
207
|
}, [e]), t ? `radix-${t}` : "";
|
|
208
208
|
}
|
|
209
209
|
function $(e) {
|
|
@@ -270,7 +270,7 @@ var De = u.forwardRef((e, t) => {
|
|
|
270
270
|
prop: c,
|
|
271
271
|
defaultProp: a,
|
|
272
272
|
onChange: i
|
|
273
|
-
}), [g, b] = u.useState(!1), _ = $(d), G = Z(o),
|
|
273
|
+
}), [g, b] = u.useState(!1), _ = $(d), G = Z(o), E = u.useRef(!1), [le, K] = u.useState(0);
|
|
274
274
|
return u.useEffect(() => {
|
|
275
275
|
const R = h.current;
|
|
276
276
|
if (R)
|
|
@@ -305,10 +305,10 @@ var De = u.forwardRef((e, t) => {
|
|
|
305
305
|
ref: I,
|
|
306
306
|
style: { outline: "none", ...e.style },
|
|
307
307
|
onMouseDown: S(e.onMouseDown, () => {
|
|
308
|
-
|
|
308
|
+
E.current = !0;
|
|
309
309
|
}),
|
|
310
310
|
onFocus: S(e.onFocus, (R) => {
|
|
311
|
-
const ie = !
|
|
311
|
+
const ie = !E.current;
|
|
312
312
|
if (R.target === R.currentTarget && ie && !g) {
|
|
313
313
|
const W = new CustomEvent(O, Fe);
|
|
314
314
|
if (R.currentTarget.dispatchEvent(W), !W.defaultPrevented) {
|
|
@@ -318,7 +318,7 @@ var De = u.forwardRef((e, t) => {
|
|
|
318
318
|
ee(pe, v);
|
|
319
319
|
}
|
|
320
320
|
}
|
|
321
|
-
|
|
321
|
+
E.current = !1;
|
|
322
322
|
}),
|
|
323
323
|
onBlur: S(e.onBlur, () => b(!1))
|
|
324
324
|
}
|
|
@@ -333,7 +333,7 @@ var De = u.forwardRef((e, t) => {
|
|
|
333
333
|
active: n = !1,
|
|
334
334
|
tabStopId: s,
|
|
335
335
|
...c
|
|
336
|
-
} = e, a =
|
|
336
|
+
} = e, a = Ee(), i = s || a, d = Oe(X, o), v = d.currentTabStopId === i, p = Z(o), { onFocusableItemAdd: h, onFocusableItemRemove: I } = d;
|
|
337
337
|
return u.useEffect(() => {
|
|
338
338
|
if (r)
|
|
339
339
|
return h(), () => I();
|
|
@@ -430,7 +430,7 @@ var Be = Q, Ke = H, We = "Toggle", te = u.forwardRef((e, t) => {
|
|
|
430
430
|
);
|
|
431
431
|
});
|
|
432
432
|
te.displayName = We;
|
|
433
|
-
var
|
|
433
|
+
var x = "ToggleGroup", [oe, ut] = U(x, [
|
|
434
434
|
J
|
|
435
435
|
]), re = J(), B = C.forwardRef((e, t) => {
|
|
436
436
|
const { type: o, ...r } = e;
|
|
@@ -438,10 +438,10 @@ var E = "ToggleGroup", [oe, ut] = U(E, [
|
|
|
438
438
|
return /* @__PURE__ */ l(je, { ...r, ref: t });
|
|
439
439
|
if (o === "multiple")
|
|
440
440
|
return /* @__PURE__ */ l(Ye, { ...r, ref: t });
|
|
441
|
-
throw new Error(`Missing prop \`type\` expected on \`${
|
|
441
|
+
throw new Error(`Missing prop \`type\` expected on \`${x}\``);
|
|
442
442
|
});
|
|
443
|
-
B.displayName =
|
|
444
|
-
var [ne, se] = oe(
|
|
443
|
+
B.displayName = x;
|
|
444
|
+
var [ne, se] = oe(x), je = C.forwardRef((e, t) => {
|
|
445
445
|
const {
|
|
446
446
|
value: o,
|
|
447
447
|
defaultValue: r,
|
|
@@ -494,8 +494,8 @@ var [ne, se] = oe(E), je = C.forwardRef((e, t) => {
|
|
|
494
494
|
}
|
|
495
495
|
);
|
|
496
496
|
});
|
|
497
|
-
B.displayName =
|
|
498
|
-
var [ze, qe] = oe(
|
|
497
|
+
B.displayName = x;
|
|
498
|
+
var [ze, qe] = oe(x), ce = C.forwardRef(
|
|
499
499
|
(e, t) => {
|
|
500
500
|
const {
|
|
501
501
|
__scopeToggleGroup: o,
|
|
@@ -592,7 +592,7 @@ const ae = C.createContext({
|
|
|
592
592
|
itemClass: P(
|
|
593
593
|
he,
|
|
594
594
|
"flex items-center justify-center bg-transparent",
|
|
595
|
-
"rounded-
|
|
595
|
+
"rounded-xs",
|
|
596
596
|
"transition duration-200 ease",
|
|
597
597
|
He({ size: o }),
|
|
598
598
|
Qe({ focusMode: e }),
|
|
@@ -604,7 +604,7 @@ const ae = C.createContext({
|
|
|
604
604
|
}) => P(
|
|
605
605
|
ve,
|
|
606
606
|
"inline-flex p-1",
|
|
607
|
-
"rounded-
|
|
607
|
+
"rounded-xs",
|
|
608
608
|
{
|
|
609
609
|
"bg-surface-light text-copy-dark": e === "light",
|
|
610
610
|
"bg-surface-darker text-copy-lighter": e === "dark",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@versini/ui-togglegroup",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "4.0.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Arno Versini",
|
|
6
6
|
"publishConfig": {
|
|
@@ -39,16 +39,16 @@
|
|
|
39
39
|
"react-dom": "^18.3.1 || ^19.0.0"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
|
-
"@versini/ui-types": "
|
|
42
|
+
"@versini/ui-types": "5.0.0"
|
|
43
43
|
},
|
|
44
44
|
"dependencies": {
|
|
45
45
|
"@radix-ui/react-toggle-group": "1.1.2",
|
|
46
46
|
"@tailwindcss/typography": "0.5.16",
|
|
47
47
|
"clsx": "2.1.1",
|
|
48
|
-
"tailwindcss": "
|
|
48
|
+
"tailwindcss": "4.0.14"
|
|
49
49
|
},
|
|
50
50
|
"sideEffects": [
|
|
51
51
|
"**/*.css"
|
|
52
52
|
],
|
|
53
|
-
"gitHead": "
|
|
53
|
+
"gitHead": "40a943e1215f5344afa169a21267769e60ed81fd"
|
|
54
54
|
}
|
package/dist/style.css
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::-ms-backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-ms-input-placeholder,textarea::-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}@keyframes blink{50%{fill:transparent}}@keyframes av-tooltip-fade-in{0%{opacity:0}to{opacity:100}}.visible{visibility:visible}.fixed{position:fixed}.relative{position:relative}.mr-2{margin-right:.5rem}.flex{display:flex}.inline-flex{display:inline-flex}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.items-center{align-items:center}.justify-center{justify-content:center}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded{border-radius:.25rem}.rounded-sm{border-radius:.125rem}.border{border-width:1px}.border-r{border-right-width:1px}.border-surface-darker{--tw-border-opacity: 1;border-color:var(--av-surface-darker, rgb(15 23 42 / var(--tw-border-opacity, 1)))}.border-surface-light{--tw-border-opacity: 1;border-color:var(--av-surface-light, rgb(203 213 225 / var(--tw-border-opacity, 1)))}.bg-surface-darker{--tw-bg-opacity: 1;background-color:var(--av-surface-darker, rgb(15 23 42 / var(--tw-bg-opacity, 1)))}.bg-surface-light{--tw-bg-opacity: 1;background-color:var(--av-surface-light, rgb(203 213 225 / var(--tw-bg-opacity, 1)))}.bg-surface-lightest{--tw-bg-opacity: 1;background-color:var(--av-surface-lightest, rgb(241 245 249 / var(--tw-bg-opacity, 1)))}.bg-surface-medium{--tw-bg-opacity: 1;background-color:var(--av-surface-medium, rgb(100 116 139 / var(--tw-bg-opacity, 1)))}.bg-transparent{background-color:transparent}.p-1{padding:.25rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.text-copy-dark{--tw-text-opacity: 1;color:var(--av-copy-dark, rgb(15 23 42 / var(--tw-text-opacity, 1)))}.text-copy-lighter{--tw-text-opacity: 1;color:var(--av-copy-lighter, rgb(255 255 255 / var(--tw-text-opacity, 1)))}.outline-focus-dark{outline-color:var(--av-focus-dark, rgb(21 128 61 / 1))}.outline-focus-light{outline-color:var(--av-focus-light, rgb(134 239 172 / 1))}.ring{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.transition{transition-property:color,background-color,border-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-text-decoration-color,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-text-decoration-color,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.last\:border-transparent:last-child{border-color:transparent}.focus\:outline:focus{outline-style:solid}.focus\:outline-2:focus{outline-width:2px}.focus\:outline-focus-dark:focus{outline-color:var(--av-focus-dark, rgb(21 128 61 / 1))}.focus\:outline-focus-light:focus{outline-color:var(--av-focus-light, rgb(134 239 172 / 1))}.has-\[\+_\*_button\[aria-checked\=\'false\'\]\]\:border-border-medium:has(+* button[aria-checked=false]){--tw-border-opacity: 1;border-color:var(--av-border-medium, rgb(148 163 184 / var(--tw-border-opacity, 1)))}.has-\[button\[aria-checked\=\'true\'\]\]\:border-transparent:has(button[aria-checked=true]){border-color:transparent}.data-\[state\=on\]\:bg-surface-lightest[data-state=on]{--tw-bg-opacity: 1;background-color:var(--av-surface-lightest, rgb(241 245 249 / var(--tw-bg-opacity, 1)))}.data-\[state\=on\]\:bg-surface-medium[data-state=on]{--tw-bg-opacity: 1;background-color:var(--av-surface-medium, rgb(100 116 139 / var(--tw-bg-opacity, 1)))}@media (prefers-color-scheme: dark){.dark\:border-surface-darker{--tw-border-opacity: 1;border-color:var(--av-surface-darker, rgb(15 23 42 / var(--tw-border-opacity, 1)))}.dark\:border-surface-light{--tw-border-opacity: 1;border-color:var(--av-surface-light, rgb(203 213 225 / var(--tw-border-opacity, 1)))}.dark\:bg-surface-darker{--tw-bg-opacity: 1;background-color:var(--av-surface-darker, rgb(15 23 42 / var(--tw-bg-opacity, 1)))}.dark\:bg-surface-light{--tw-bg-opacity: 1;background-color:var(--av-surface-light, rgb(203 213 225 / var(--tw-bg-opacity, 1)))}.dark\:text-copy-dark{--tw-text-opacity: 1;color:var(--av-copy-dark, rgb(15 23 42 / var(--tw-text-opacity, 1)))}.dark\:text-copy-lighter{--tw-text-opacity: 1;color:var(--av-copy-lighter, rgb(255 255 255 / var(--tw-text-opacity, 1)))}.dark\:focus\:outline-focus-dark:focus{outline-color:var(--av-focus-dark, rgb(21 128 61 / 1))}.dark\:focus\:outline-focus-light:focus{outline-color:var(--av-focus-light, rgb(134 239 172 / 1))}.dark\:data-\[state\=on\]\:bg-surface-lightest[data-state=on]{--tw-bg-opacity: 1;background-color:var(--av-surface-lightest, rgb(241 245 249 / var(--tw-bg-opacity, 1)))}.dark\:data-\[state\=on\]\:bg-surface-medium[data-state=on]{--tw-bg-opacity: 1;background-color:var(--av-surface-medium, rgb(100 116 139 / var(--tw-bg-opacity, 1)))}}
|
package/dist/style.js
DELETED
|
File without changes
|