@versini/ui-togglegroup 1.2.0 → 1.3.0

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as ToggleGroupRadix from '@radix-ui/react-toggle-group';
-import { SpacingProps } from '@versini/ui-private/dist/utilities';
+import { SpacingTypes } from '@versini/ui-spacing-types';
 
 declare const TOGGLEGROUP_CLASSNAME = "av-togglegroup";
 declare const TOGGLEGROUP_ITEM_WRAPPER_CLASSNAME = "av-togglegroup-item-wrapper";
@@ -24,7 +24,7 @@ type ToggleGroupProps = {
 	 */
 	size?: Size;
 } & Omit<ToggleGroupRadix.ToggleGroupSingleProps, "type", "defaultValue"> &
-	SpacingProps;
+	SpacingTypes.Props;
 
 type ToggleGroupItemProps = ToggleGroupRadix.ToggleGroupItemProps;
 

package/dist/index.js

@@ -1,51 +1,54 @@
-import { jsx as l, Fragment as pe } from "react/jsx-runtime";
-import * as a from "react";
-import v, { useContext as ge } from "react";
-import P from "clsx";
+import { jsx as a, Fragment as ge } from "react/jsx-runtime";
+import * as l from "react";
+import C, { useContext as me } from "react";
+import G from "clsx";
 /*!
-  @versini/ui-togglegroup v1.2.0
+  @versini/ui-togglegroup v1.3.0
   © 2024 gizmette.com
 */
 try {
   window.__VERSINI_UI_TOGGLEGROUP__ || (window.__VERSINI_UI_TOGGLEGROUP__ = {
-    version: "1.2.0",
-    buildTime: "12/18/2024 12:35 PM EST",
+    version: "1.3.0",
+    buildTime: "12/24/2024 06:47 PM EST",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
 } catch {
 }
-const me = "av-togglegroup", ve = "av-togglegroup-item-wrapper", Ce = "av-togglegroup-item";
+const ve = "av-togglegroup", Ce = "av-togglegroup-item-wrapper", he = "av-togglegroup-item";
 function U(e, t = []) {
   let o = [];
   function r(s, c) {
-    const u = a.createContext(c), i = o.length;
+    const u = l.createContext(c), i = o.length;
     o = [...o, c];
-    function f(p) {
-      const { scope: C, children: I, ...d } = p, h = (C == null ? void 0 : C[e][i]) || u, T = a.useMemo(() => d, Object.values(d));
-      return /* @__PURE__ */ l(h.Provider, { value: T, children: I });
-    }
-    function g(p, C) {
-      const I = (C == null ? void 0 : C[e][i]) || u, d = a.useContext(I);
+    const f = (p) => {
+      var g;
+      const { scope: h, children: I, ...d } = p, m = ((g = h == null ? void 0 : h[e]) == null ? void 0 : g[i]) || u, _ = l.useMemo(() => d, Object.values(d));
+      return /* @__PURE__ */ a(m.Provider, { value: _, children: I });
+    };
+    f.displayName = s + "Provider";
+    function v(p, h) {
+      var m;
+      const I = ((m = h == null ? void 0 : h[e]) == null ? void 0 : m[i]) || u, d = l.useContext(I);
       if (d) return d;
       if (c !== void 0) return c;
       throw new Error(`\`${p}\` must be used within \`${s}\``);
     }
-    return f.displayName = s + "Provider", [f, g];
+    return [f, v];
   }
   const n = () => {
-    const s = o.map((c) => a.createContext(c));
+    const s = o.map((c) => l.createContext(c));
     return function(u) {
       const i = (u == null ? void 0 : u[e]) || s;
-      return a.useMemo(
+      return l.useMemo(
         () => ({ [`__scope${e}`]: { ...u, [e]: i } }),
         [u, i]
       );
     };
   };
-  return n.scopeName = e, [r, he(n, ...t)];
+  return n.scopeName = e, [r, be(n, ...t)];
 }
-function he(...e) {
+function be(...e) {
   const t = e[0];
   if (e.length === 1) return t;
   const o = () => {
@@ -58,47 +61,62 @@ function he(...e) {
         const p = i(s)[`__scope${f}`];
         return { ...u, ...p };
       }, {});
-      return a.useMemo(() => ({ [`__scope${t.scopeName}`]: c }), [c]);
+      return l.useMemo(() => ({ [`__scope${t.scopeName}`]: c }), [c]);
     };
   };
   return o.scopeName = t.scopeName, o;
 }
-function be(e, t) {
-  typeof e == "function" ? e(t) : e != null && (e.current = t);
+function W(e, t) {
+  if (typeof e == "function")
+    return e(t);
+  e != null && (e.current = t);
 }
-function Y(...e) {
-  return (t) => e.forEach((o) => be(o, t));
+function z(...e) {
+  return (t) => {
+    let o = !1;
+    const r = e.map((n) => {
+      const s = W(n, t);
+      return !o && typeof s == "function" && (o = !0), s;
+    });
+    if (o)
+      return () => {
+        for (let n = 0; n < r.length; n++) {
+          const s = r[n];
+          typeof s == "function" ? s() : W(e[n], null);
+        }
+      };
+  };
 }
 function D(...e) {
-  return a.useCallback(Y(...e), e);
+  return l.useCallback(z(...e), e);
 }
-var A = a.forwardRef((e, t) => {
-  const { children: o, ...r } = e, n = a.Children.toArray(o), s = n.find(Te);
+var A = l.forwardRef((e, t) => {
+  const { children: o, ...r } = e, n = l.Children.toArray(o), s = n.find(_e);
   if (s) {
-    const c = s.props.children, u = n.map((i) => i === s ? a.Children.count(c) > 1 ? a.Children.only(null) : a.isValidElement(c) ? c.props.children : null : i);
-    return /* @__PURE__ */ l(L, { ...r, ref: t, children: a.isValidElement(c) ? a.cloneElement(c, void 0, u) : null });
+    const c = s.props.children, u = n.map((i) => i === s ? l.Children.count(c) > 1 ? l.Children.only(null) : l.isValidElement(c) ? c.props.children : null : i);
+    return /* @__PURE__ */ a(L, { ...r, ref: t, children: l.isValidElement(c) ? l.cloneElement(c, void 0, u) : null });
   }
-  return /* @__PURE__ */ l(L, { ...r, ref: t, children: o });
+  return /* @__PURE__ */ a(L, { ...r, ref: t, children: o });
 });
 A.displayName = "Slot";
-var L = a.forwardRef((e, t) => {
+var L = l.forwardRef((e, t) => {
   const { children: o, ...r } = e;
-  if (a.isValidElement(o)) {
-    const n = ye(o);
-    return a.cloneElement(o, {
-      ...Re(r, o.props),
+  if (l.isValidElement(o)) {
+    const n = Re(o);
+    return l.cloneElement(o, {
+      ...Te(r, o.props),
       // @ts-ignore
-      ref: t ? Y(t, n) : n
+      ref: t ? z(t, n) : n
     });
   }
-  return a.Children.count(o) > 1 ? a.Children.only(null) : null;
+  return l.Children.count(o) > 1 ? l.Children.only(null) : null;
 });
 L.displayName = "SlotClone";
-var Ie = ({ children: e }) => /* @__PURE__ */ l(pe, { children: e });
-function Te(e) {
-  return a.isValidElement(e) && e.type === Ie;
+var Ie = ({ children: e }) => /* @__PURE__ */ a(ge, { children: e });
+function _e(e) {
+  return l.isValidElement(e) && e.type === Ie;
 }
-function Re(e, t) {
+function Te(e, t) {
   const o = { ...t };
   for (const r in t) {
     const n = e[r], s = t[r];
@@ -108,12 +126,12 @@ function Re(e, t) {
   }
   return { ...e, ...o };
 }
-function ye(e) {
+function Re(e) {
   var r, n;
   let t = (r = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : r.get, o = t && "isReactWarning" in t && t.isReactWarning;
   return o ? e.ref : (t = (n = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : n.get, o = t && "isReactWarning" in t && t.isReactWarning, o ? e.props.ref : e.props.ref || e.ref);
 }
-var Se = [
+var ye = [
   "a",
   "button",
   "div",
@@ -130,84 +148,84 @@ var Se = [
   "span",
   "svg",
   "ul"
-], w = Se.reduce((e, t) => {
-  const o = a.forwardRef((r, n) => {
+], w = ye.reduce((e, t) => {
+  const o = l.forwardRef((r, n) => {
     const { asChild: s, ...c } = r, u = s ? A : t;
-    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ l(u, { ...c, ref: n });
+    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ a(u, { ...c, ref: n });
   });
   return o.displayName = `Primitive.${t}`, { ...e, [t]: o };
 }, {});
-function S(e, t, { checkForDefaultPrevented: o = !0 } = {}) {
+function y(e, t, { checkForDefaultPrevented: o = !0 } = {}) {
   return function(n) {
     if (e == null || e(n), o === !1 || !n.defaultPrevented)
       return t == null ? void 0 : t(n);
   };
 }
-function _e(e) {
+function Se(e) {
   const t = e + "CollectionProvider", [o, r] = U(t), [n, s] = o(
     t,
     { collectionRef: { current: null }, itemMap: /* @__PURE__ */ new Map() }
   ), c = (I) => {
-    const { scope: d, children: h } = I, T = v.useRef(null), m = v.useRef(/* @__PURE__ */ new Map()).current;
-    return /* @__PURE__ */ l(n, { scope: d, itemMap: m, collectionRef: T, children: h });
+    const { scope: d, children: m } = I, _ = C.useRef(null), g = C.useRef(/* @__PURE__ */ new Map()).current;
+    return /* @__PURE__ */ a(n, { scope: d, itemMap: g, collectionRef: _, children: m });
   };
   c.displayName = t;
-  const u = e + "CollectionSlot", i = v.forwardRef(
+  const u = e + "CollectionSlot", i = C.forwardRef(
     (I, d) => {
-      const { scope: h, children: T } = I, m = s(u, h), b = D(d, m.collectionRef);
-      return /* @__PURE__ */ l(A, { ref: b, children: T });
+      const { scope: m, children: _ } = I, g = s(u, m), b = D(d, g.collectionRef);
+      return /* @__PURE__ */ a(A, { ref: b, children: _ });
     }
   );
   i.displayName = u;
-  const f = e + "CollectionItemSlot", g = "data-radix-collection-item", p = v.forwardRef(
+  const f = e + "CollectionItemSlot", v = "data-radix-collection-item", p = C.forwardRef(
     (I, d) => {
-      const { scope: h, children: T, ...m } = I, b = v.useRef(null), _ = D(d, b), G = s(f, h);
-      return v.useEffect(() => (G.itemMap.set(b, { ref: b, ...m }), () => void G.itemMap.delete(b))), /* @__PURE__ */ l(A, { [g]: "", ref: _, children: T });
+      const { scope: m, children: _, ...g } = I, b = C.useRef(null), S = D(d, b), P = s(f, m);
+      return C.useEffect(() => (P.itemMap.set(b, { ref: b, ...g }), () => void P.itemMap.delete(b))), /* @__PURE__ */ a(A, { [v]: "", ref: S, children: _ });
     }
   );
   p.displayName = f;
-  function C(I) {
+  function h(I) {
     const d = s(e + "CollectionConsumer", I);
-    return v.useCallback(() => {
-      const T = d.collectionRef.current;
-      if (!T) return [];
-      const m = Array.from(T.querySelectorAll(`[${g}]`));
+    return C.useCallback(() => {
+      const _ = d.collectionRef.current;
+      if (!_) return [];
+      const g = Array.from(_.querySelectorAll(`[${v}]`));
       return Array.from(d.itemMap.values()).sort(
-        (G, x) => m.indexOf(G.ref.current) - m.indexOf(x.ref.current)
+        (P, x) => g.indexOf(P.ref.current) - g.indexOf(x.ref.current)
       );
     }, [d.collectionRef, d.itemMap]);
   }
   return [
     { Provider: c, Slot: i, ItemSlot: p },
-    C,
+    h,
     r
   ];
 }
-var Ge = globalThis != null && globalThis.document ? a.useLayoutEffect : () => {
-}, Pe = a.useId || (() => {
+var Pe = globalThis != null && globalThis.document ? l.useLayoutEffect : () => {
+}, Ge = l.useId || (() => {
 }), Ee = 0;
 function xe(e) {
-  const [t, o] = a.useState(Pe());
-  return Ge(() => {
+  const [t, o] = l.useState(Ge());
+  return Pe(() => {
     o((r) => r ?? String(Ee++));
   }, [e]), t ? `radix-${t}` : "";
 }
 function $(e) {
-  const t = a.useRef(e);
-  return a.useEffect(() => {
+  const t = l.useRef(e);
+  return l.useEffect(() => {
     t.current = e;
-  }), a.useMemo(() => (...o) => {
+  }), l.useMemo(() => (...o) => {
     var r;
     return (r = t.current) == null ? void 0 : r.call(t, ...o);
   }, []);
 }
-function k({
+function F({
   prop: e,
   defaultProp: t,
   onChange: o = () => {
   }
 }) {
-  const [r, n] = we({ defaultProp: t, onChange: o }), s = e !== void 0, c = s ? e : r, u = $(o), i = a.useCallback(
+  const [r, n] = we({ defaultProp: t, onChange: o }), s = e !== void 0, c = s ? e : r, u = $(o), i = l.useCallback(
     (f) => {
       if (s) {
         const p = typeof f == "function" ? f(e) : f;
@@ -223,24 +241,24 @@ function we({
   defaultProp: e,
   onChange: t
 }) {
-  const o = a.useState(e), [r] = o, n = a.useRef(r), s = $(t);
-  return a.useEffect(() => {
+  const o = l.useState(e), [r] = o, n = l.useRef(r), s = $(t);
+  return l.useEffect(() => {
     n.current !== r && (s(r), n.current = r);
   }, [r, n, s]), o;
 }
-var Ae = a.createContext(void 0);
-function z(e) {
-  const t = a.useContext(Ae);
+var Ae = l.createContext(void 0);
+function q(e) {
+  const t = l.useContext(Ae);
   return e || t || "ltr";
 }
-var O = "rovingFocusGroup.onEntryFocus", Fe = { bubbles: !1, cancelable: !0 }, N = "RovingFocusGroup", [V, q, ke] = _e(N), [Ne, Z] = U(
-  N,
-  [ke]
-), [Me, Oe] = Ne(N), J = a.forwardRef(
-  (e, t) => /* @__PURE__ */ l(V.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ l(V.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ l(De, { ...e, ref: t }) }) })
+var O = "rovingFocusGroup.onEntryFocus", Ne = { bubbles: !1, cancelable: !0 }, k = "RovingFocusGroup", [V, Z, Fe] = Se(k), [ke, J] = U(
+  k,
+  [Fe]
+), [Me, Oe] = ke(k), Q = l.forwardRef(
+  (e, t) => /* @__PURE__ */ a(V.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ a(V.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ a(De, { ...e, ref: t }) }) })
 );
-J.displayName = N;
-var De = a.forwardRef((e, t) => {
+Q.displayName = k;
+var De = l.forwardRef((e, t) => {
   const {
     __scopeRovingFocusGroup: o,
     orientation: r,
@@ -250,68 +268,68 @@ var De = a.forwardRef((e, t) => {
     defaultCurrentTabStopId: u,
     onCurrentTabStopIdChange: i,
     onEntryFocus: f,
-    preventScrollOnEntryFocus: g = !1,
+    preventScrollOnEntryFocus: v = !1,
     ...p
-  } = e, C = a.useRef(null), I = D(t, C), d = z(s), [h = null, T] = k({
+  } = e, h = l.useRef(null), I = D(t, h), d = q(s), [m = null, _] = F({
     prop: c,
     defaultProp: u,
     onChange: i
-  }), [m, b] = a.useState(!1), _ = $(f), G = q(o), x = a.useRef(!1), [ae, K] = a.useState(0);
-  return a.useEffect(() => {
-    const R = C.current;
-    if (R)
-      return R.addEventListener(O, _), () => R.removeEventListener(O, _);
-  }, [_]), /* @__PURE__ */ l(
+  }), [g, b] = l.useState(!1), S = $(f), P = Z(o), x = l.useRef(!1), [ae, K] = l.useState(0);
+  return l.useEffect(() => {
+    const T = h.current;
+    if (T)
+      return T.addEventListener(O, S), () => T.removeEventListener(O, S);
+  }, [S]), /* @__PURE__ */ a(
     Me,
     {
       scope: o,
       orientation: r,
       dir: d,
       loop: n,
-      currentTabStopId: h,
-      onItemFocus: a.useCallback(
-        (R) => T(R),
-        [T]
+      currentTabStopId: m,
+      onItemFocus: l.useCallback(
+        (T) => _(T),
+        [_]
       ),
-      onItemShiftTab: a.useCallback(() => b(!0), []),
-      onFocusableItemAdd: a.useCallback(
-        () => K((R) => R + 1),
+      onItemShiftTab: l.useCallback(() => b(!0), []),
+      onFocusableItemAdd: l.useCallback(
+        () => K((T) => T + 1),
         []
       ),
-      onFocusableItemRemove: a.useCallback(
-        () => K((R) => R - 1),
+      onFocusableItemRemove: l.useCallback(
+        () => K((T) => T - 1),
         []
       ),
-      children: /* @__PURE__ */ l(
+      children: /* @__PURE__ */ a(
         w.div,
         {
-          tabIndex: m || ae === 0 ? -1 : 0,
+          tabIndex: g || ae === 0 ? -1 : 0,
           "data-orientation": r,
           ...p,
           ref: I,
           style: { outline: "none", ...e.style },
-          onMouseDown: S(e.onMouseDown, () => {
+          onMouseDown: y(e.onMouseDown, () => {
             x.current = !0;
           }),
-          onFocus: S(e.onFocus, (R) => {
-            const le = !x.current;
-            if (R.target === R.currentTarget && le && !m) {
-              const j = new CustomEvent(O, Fe);
-              if (R.currentTarget.dispatchEvent(j), !j.defaultPrevented) {
-                const M = G().filter((y) => y.focusable), ie = M.find((y) => y.active), de = M.find((y) => y.id === h), fe = [ie, de, ...M].filter(
+          onFocus: y(e.onFocus, (T) => {
+            const ie = !x.current;
+            if (T.target === T.currentTarget && ie && !g) {
+              const j = new CustomEvent(O, Ne);
+              if (T.currentTarget.dispatchEvent(j), !j.defaultPrevented) {
+                const M = P().filter((R) => R.focusable), de = M.find((R) => R.active), fe = M.find((R) => R.id === m), pe = [de, fe, ...M].filter(
                   Boolean
-                ).map((y) => y.ref.current);
-                H(fe, g);
+                ).map((R) => R.ref.current);
+                ee(pe, v);
               }
             }
             x.current = !1;
           }),
-          onBlur: S(e.onBlur, () => b(!1))
+          onBlur: y(e.onBlur, () => b(!1))
         }
       )
     }
   );
-}), Q = "RovingFocusGroupItem", X = a.forwardRef(
+}), X = "RovingFocusGroupItem", H = l.forwardRef(
   (e, t) => {
     const {
       __scopeRovingFocusGroup: o,
@@ -319,46 +337,46 @@ var De = a.forwardRef((e, t) => {
       active: n = !1,
       tabStopId: s,
       ...c
-    } = e, u = xe(), i = s || u, f = Oe(Q, o), g = f.currentTabStopId === i, p = q(o), { onFocusableItemAdd: C, onFocusableItemRemove: I } = f;
-    return a.useEffect(() => {
+    } = e, u = xe(), i = s || u, f = Oe(X, o), v = f.currentTabStopId === i, p = Z(o), { onFocusableItemAdd: h, onFocusableItemRemove: I } = f;
+    return l.useEffect(() => {
       if (r)
-        return C(), () => I();
-    }, [r, C, I]), /* @__PURE__ */ l(
+        return h(), () => I();
+    }, [r, h, I]), /* @__PURE__ */ a(
       V.ItemSlot,
       {
         scope: o,
         id: i,
         focusable: r,
         active: n,
-        children: /* @__PURE__ */ l(
+        children: /* @__PURE__ */ a(
           w.span,
           {
-            tabIndex: g ? 0 : -1,
+            tabIndex: v ? 0 : -1,
             "data-orientation": f.orientation,
             ...c,
             ref: t,
-            onMouseDown: S(e.onMouseDown, (d) => {
+            onMouseDown: y(e.onMouseDown, (d) => {
               r ? f.onItemFocus(i) : d.preventDefault();
             }),
-            onFocus: S(e.onFocus, () => f.onItemFocus(i)),
-            onKeyDown: S(e.onKeyDown, (d) => {
+            onFocus: y(e.onFocus, () => f.onItemFocus(i)),
+            onKeyDown: y(e.onKeyDown, (d) => {
               if (d.key === "Tab" && d.shiftKey) {
                 f.onItemShiftTab();
                 return;
               }
               if (d.target !== d.currentTarget) return;
-              const h = Ue(d, f.orientation, f.dir);
-              if (h !== void 0) {
+              const m = Ue(d, f.orientation, f.dir);
+              if (m !== void 0) {
                 if (d.metaKey || d.ctrlKey || d.altKey || d.shiftKey) return;
                 d.preventDefault();
-                let m = p().filter((b) => b.focusable).map((b) => b.ref.current);
-                if (h === "last") m.reverse();
-                else if (h === "prev" || h === "next") {
-                  h === "prev" && m.reverse();
-                  const b = m.indexOf(d.currentTarget);
-                  m = f.loop ? $e(m, b + 1) : m.slice(b + 1);
+                let g = p().filter((b) => b.focusable).map((b) => b.ref.current);
+                if (m === "last") g.reverse();
+                else if (m === "prev" || m === "next") {
+                  m === "prev" && g.reverse();
+                  const b = g.indexOf(d.currentTarget);
+                  g = f.loop ? $e(g, b + 1) : g.slice(b + 1);
                 }
-                setTimeout(() => H(m));
+                setTimeout(() => ee(g));
               }
             })
           }
@@ -367,7 +385,7 @@ var De = a.forwardRef((e, t) => {
     );
   }
 );
-X.displayName = Q;
+H.displayName = X;
 var Le = {
   ArrowLeft: "prev",
   ArrowUp: "prev",
@@ -386,7 +404,7 @@ function Ue(e, t, o) {
   if (!(t === "vertical" && ["ArrowLeft", "ArrowRight"].includes(r)) && !(t === "horizontal" && ["ArrowUp", "ArrowDown"].includes(r)))
     return Le[r];
 }
-function H(e, t = !1) {
+function ee(e, t = !1) {
   const o = document.activeElement;
   for (const r of e)
     if (r === o || (r.focus({ preventScroll: t }), document.activeElement !== o)) return;
@@ -394,13 +412,13 @@ function H(e, t = !1) {
 function $e(e, t) {
   return e.map((o, r) => e[(t + r) % e.length]);
 }
-var Be = J, Ke = X, je = "Toggle", ee = a.forwardRef((e, t) => {
-  const { pressed: o, defaultPressed: r = !1, onPressedChange: n, ...s } = e, [c = !1, u] = k({
+var Be = Q, Ke = H, je = "Toggle", te = l.forwardRef((e, t) => {
+  const { pressed: o, defaultPressed: r = !1, onPressedChange: n, ...s } = e, [c = !1, u] = F({
     prop: o,
     onChange: n,
     defaultProp: r
   });
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ a(
     w.button,
     {
       type: "button",
@@ -409,79 +427,79 @@ var Be = J, Ke = X, je = "Toggle", ee = a.forwardRef((e, t) => {
       "data-disabled": e.disabled ? "" : void 0,
       ...s,
       ref: t,
-      onClick: S(e.onClick, () => {
+      onClick: y(e.onClick, () => {
         e.disabled || u(!c);
       })
     }
   );
 });
-ee.displayName = je;
-var E = "ToggleGroup", [te, at] = U(E, [
-  Z
-]), oe = Z(), B = v.forwardRef((e, t) => {
+te.displayName = je;
+var E = "ToggleGroup", [oe, lt] = U(E, [
+  J
+]), re = J(), B = C.forwardRef((e, t) => {
   const { type: o, ...r } = e;
   if (o === "single")
-    return /* @__PURE__ */ l(We, { ...r, ref: t });
+    return /* @__PURE__ */ a(We, { ...r, ref: t });
   if (o === "multiple")
-    return /* @__PURE__ */ l(Ye, { ...r, ref: t });
+    return /* @__PURE__ */ a(Ye, { ...r, ref: t });
   throw new Error(`Missing prop \`type\` expected on \`${E}\``);
 });
 B.displayName = E;
-var [re, ne] = te(E), We = v.forwardRef((e, t) => {
+var [ne, se] = oe(E), We = C.forwardRef((e, t) => {
   const {
     value: o,
     defaultValue: r,
     onValueChange: n = () => {
     },
     ...s
-  } = e, [c, u] = k({
+  } = e, [c, u] = F({
     prop: o,
     defaultProp: r,
     onChange: n
   });
-  return /* @__PURE__ */ l(
-    re,
+  return /* @__PURE__ */ a(
+    ne,
     {
       scope: e.__scopeToggleGroup,
       type: "single",
       value: c ? [c] : [],
       onItemActivate: u,
-      onItemDeactivate: v.useCallback(() => u(""), [u]),
-      children: /* @__PURE__ */ l(se, { ...s, ref: t })
+      onItemDeactivate: C.useCallback(() => u(""), [u]),
+      children: /* @__PURE__ */ a(ce, { ...s, ref: t })
     }
   );
-}), Ye = v.forwardRef((e, t) => {
+}), Ye = C.forwardRef((e, t) => {
   const {
     value: o,
     defaultValue: r,
     onValueChange: n = () => {
     },
     ...s
-  } = e, [c = [], u] = k({
+  } = e, [c = [], u] = F({
     prop: o,
     defaultProp: r,
     onChange: n
-  }), i = v.useCallback(
-    (g) => u((p = []) => [...p, g]),
+  }), i = C.useCallback(
+    (v) => u((p = []) => [...p, v]),
     [u]
-  ), f = v.useCallback(
-    (g) => u((p = []) => p.filter((C) => C !== g)),
+  ), f = C.useCallback(
+    (v) => u((p = []) => p.filter((h) => h !== v)),
     [u]
   );
-  return /* @__PURE__ */ l(
-    re,
+  return /* @__PURE__ */ a(
+    ne,
     {
       scope: e.__scopeToggleGroup,
       type: "multiple",
       value: c,
       onItemActivate: i,
       onItemDeactivate: f,
-      children: /* @__PURE__ */ l(se, { ...s, ref: t })
+      children: /* @__PURE__ */ a(ce, { ...s, ref: t })
     }
   );
 });
 B.displayName = E;
-var [ze, qe] = te(E), se = v.forwardRef(
+var [ze, qe] = oe(E), ce = C.forwardRef(
   (e, t) => {
     const {
       __scopeToggleGroup: o,
@@ -491,23 +509,23 @@ var [ze, qe] = te(E), se = v.forwardRef(
       dir: c,
       loop: u = !0,
       ...i
-    } = e, f = oe(o), g = z(c), p = { role: "group", dir: g, ...i };
-    return /* @__PURE__ */ l(ze, { scope: o, rovingFocus: n, disabled: r, children: n ? /* @__PURE__ */ l(
+    } = e, f = re(o), v = q(c), p = { role: "group", dir: v, ...i };
+    return /* @__PURE__ */ a(ze, { scope: o, rovingFocus: n, disabled: r, children: n ? /* @__PURE__ */ a(
       Be,
       {
         asChild: !0,
         ...f,
         orientation: s,
-        dir: g,
+        dir: v,
         loop: u,
-        children: /* @__PURE__ */ l(w.div, { ...p, ref: t })
+        children: /* @__PURE__ */ a(w.div, { ...p, ref: t })
       }
-    ) : /* @__PURE__ */ l(w.div, { ...p, ref: t }) });
+    ) : /* @__PURE__ */ a(w.div, { ...p, ref: t }) });
   }
-), F = "ToggleGroupItem", ce = v.forwardRef(
+), N = "ToggleGroupItem", ue = C.forwardRef(
   (e, t) => {
-    const o = ne(F, e.__scopeToggleGroup), r = qe(F, e.__scopeToggleGroup), n = oe(e.__scopeToggleGroup), s = o.value.includes(e.value), c = r.disabled || e.disabled, u = { ...e, pressed: s, disabled: c }, i = v.useRef(null);
-    return r.rovingFocus ? /* @__PURE__ */ l(
+    const o = se(N, e.__scopeToggleGroup), r = qe(N, e.__scopeToggleGroup), n = re(e.__scopeToggleGroup), s = o.value.includes(e.value), c = r.disabled || e.disabled, u = { ...e, pressed: s, disabled: c }, i = C.useRef(null);
+    return r.rovingFocus ? /* @__PURE__ */ a(
       Ke,
       {
         asChild: !0,
@@ -515,17 +533,17 @@ var [ze, qe] = te(E), se = v.forwardRef(
         focusable: !c,
         active: s,
         ref: i,
-        children: /* @__PURE__ */ l(W, { ...u, ref: t })
+        children: /* @__PURE__ */ a(Y, { ...u, ref: t })
       }
-    ) : /* @__PURE__ */ l(W, { ...u, ref: t });
+    ) : /* @__PURE__ */ a(Y, { ...u, ref: t });
   }
 );
-ce.displayName = F;
-var W = v.forwardRef(
+ue.displayName = N;
+var Y = C.forwardRef(
   (e, t) => {
-    const { __scopeToggleGroup: o, value: r, ...n } = e, s = ne(F, o), c = { role: "radio", "aria-checked": e.pressed, "aria-pressed": void 0 }, u = s.type === "single" ? c : void 0;
-    return /* @__PURE__ */ l(
-      ee,
+    const { __scopeToggleGroup: o, value: r, ...n } = e, s = se(N, o), c = { role: "radio", "aria-checked": e.pressed, "aria-pressed": void 0 }, u = s.type === "single" ? c : void 0;
+    return /* @__PURE__ */ a(
+      te,
       {
         ...u,
         ...n,
@@ -536,12 +554,26 @@ var W = v.forwardRef(
       }
     );
   }
-), Ze = B, Je = ce;
-const ue = v.createContext({
+), Ze = B, Je = ue;
+const le = C.createContext({
   size: "medium",
   focusMode: "system",
   mode: "system"
-}), Qe = (e) => {
+});
+/*!
+  @versini/ui-spacing v1.0.0
+  © 2024 gizmette.com
+*/
+try {
+  window.__VERSINI_UI_SPACING__ || (window.__VERSINI_UI_SPACING__ = {
+    version: "1.0.0",
+    buildTime: "12/24/2024 06:47 PM EST",
+    homepage: "https://github.com/aversini/ui-components",
+    license: "MIT"
+  });
+} catch {
+}
+const Qe = (e) => {
   let t = "";
   if (typeof e == "number" || typeof e == "string")
     t = "m-" + e;
@@ -550,22 +582,22 @@ const ue = v.createContext({
     (e == null ? void 0 : e.t) !== void 0 && o.push(`mt-${e.t}`), (e == null ? void 0 : e.r) !== void 0 && o.push(`mr-${e.r}`), (e == null ? void 0 : e.b) !== void 0 && o.push(`mb-${e.b}`), (e == null ? void 0 : e.l) !== void 0 && o.push(`ml-${e.l}`), t = o.join(" ");
   }
   return t;
-}, Xe = ({ focusMode: e }) => P("focus:outline", "focus:outline-2", "focus:outline-offset", {
+}, Xe = ({ focusMode: e }) => G("focus:outline", "focus:outline-2", "focus:outline-offset", {
   "focus:outline-focus-light": e === "light",
   "focus:outline-focus-dark": e === "dark",
   "focus:outline-focus-light dark:focus:outline-focus-dark": e === "alt-system",
   "focus:outline-focus-dark dark:focus:outline-focus-light": e === "system"
-}), He = ({ mode: e }) => P({
+}), He = ({ mode: e }) => G({
   "data-[state=on]:bg-surface-medium": e === "dark",
   "data-[state=on]:bg-surface-lightest": e === "light",
   "data-[state=on]:bg-surface-lightest dark:data-[state=on]:bg-surface-medium": e === "system",
   "data-[state=on]:bg-surface-medium dark:data-[state=on]:bg-surface-lightest": e === "alt-system"
-}), et = ({ size: e }) => P({
+}), et = ({ size: e }) => G({
   "h-5 px-2": e === "small",
   "h-6 px-3": e === "medium",
   "h-7 px-4": e === "large"
-}), tt = ({ mode: e }) => P(
-  ve,
+}), tt = ({ mode: e }) => G(
+  Ce,
   "px-1",
   "relative",
   "border-r",
@@ -584,8 +616,8 @@ const ue = v.createContext({
   size: o
 }) => ({
   wrapperClass: tt({ mode: t }),
-  itemClass: P(
-    Ce,
+  itemClass: G(
+    he,
     "flex items-center justify-center bg-transparent",
     "rounded-sm",
     "transition duration-200 ease",
@@ -596,8 +628,8 @@ const ue = v.createContext({
 }), rt = ({
   mode: e,
   spacing: t
-}) => P(
-  me,
+}) => G(
+  ve,
   Qe(t),
   "inline-flex p-1",
   "rounded-sm",
@@ -607,7 +639,7 @@ const ue = v.createContext({
     "bg-surface-light text-copy-dark dark:bg-surface-darker dark:text-copy-lighter": e === "system",
     "bg-surface-darker text-copy-lighter dark:bg-surface-light dark:text-copy-dark": e === "alt-system"
   }
-), lt = ({
+), at = ({
   children: e,
   value: t,
   onValueChange: o,
@@ -619,12 +651,12 @@ const ue = v.createContext({
   spacing: i,
   ...f
 }) => {
-  const g = rt({ mode: n, spacing: i }), p = { size: c, focusMode: s, mode: n };
-  return /* @__PURE__ */ l(ue.Provider, { value: p, children: /* @__PURE__ */ l(
+  const v = rt({ mode: n, spacing: i }), p = { size: c, focusMode: s, mode: n };
+  return /* @__PURE__ */ a(le.Provider, { value: p, children: /* @__PURE__ */ a(
     Ze,
     {
       disabled: r,
-      className: g,
+      className: v,
       value: t,
       defaultValue: u,
       onValueChange: o,
@@ -634,12 +666,12 @@ const ue = v.createContext({
     }
   ) });
 }, it = ({ value: e, disabled: t }) => {
-  const { size: o, focusMode: r, mode: n } = ge(ue), { itemClass: s, wrapperClass: c } = ot({
+  const { size: o, focusMode: r, mode: n } = me(le), { itemClass: s, wrapperClass: c } = ot({
     focusMode: r,
     mode: n,
     size: o
   });
-  return /* @__PURE__ */ l("div", { className: c, children: /* @__PURE__ */ l(
+  return /* @__PURE__ */ a("div", { className: c, children: /* @__PURE__ */ a(
     Je,
     {
       disabled: t,
@@ -650,9 +682,9 @@ const ue = v.createContext({
   ) });
 };
 export {
-  me as TOGGLEGROUP_CLASSNAME,
-  Ce as TOGGLEGROUP_ITEM_CLASSNAME,
-  ve as TOGGLEGROUP_ITEM_WRAPPER_CLASSNAME,
-  lt as ToggleGroup,
+  ve as TOGGLEGROUP_CLASSNAME,
+  he as TOGGLEGROUP_ITEM_CLASSNAME,
+  Ce as TOGGLEGROUP_ITEM_WRAPPER_CLASSNAME,
+  at as ToggleGroup,
   it as ToggleGroupItem
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-togglegroup",
-	"version": "1.2.0",
+	"version": "1.3.0",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -38,14 +38,16 @@
 		"react-dom": "^18.3.1 || ^19.0.0"
 	},
 	"dependencies": {
-		"@radix-ui/react-toggle-group": "1.1.0",
+		"@radix-ui/react-toggle-group": "1.1.1",
 		"@tailwindcss/typography": "0.5.15",
-		"@versini/ui-private": "1.5.0",
+		"@versini/ui-private": "1.6.0",
+		"@versini/ui-spacing": "1.0.0",
+		"@versini/ui-spacing-types": "1.0.0",
 		"clsx": "2.1.1",
-		"tailwindcss": "3.4.15"
+		"tailwindcss": "3.4.17"
 	},
 	"sideEffects": [
 		"**/*.css"
 	],
-	"gitHead": "413e5c7cd8228d2f135f54fa897101401207229b"
+	"gitHead": "cb948414a675c01f3328ed6470ccf4b58f73534f"
 }