@spear-ai/spectral 1.6.17 → 1.8.0

package/dist/RadioGroup.js

@@ -1,156 +1,158 @@
 "use client";
 import "./styles/main.css";
-import { jsx as n, jsxs as N } from "react/jsx-runtime";
-import { Label as _ } from "./Label.js";
+import { jsx as a, jsxs as Y } from "react/jsx-runtime";
+import { Label as D } from "./Label.js";
 import * as c from "react";
-import { createContext as be, memo as Re, useMemo as ge, useContext as he } from "react";
-import { c as B, P as S, b as w, u as G, e as q } from "./index-OnYbwQjk.js";
-import { c as Ie, u as Y } from "./index-DSXuB1g3.js";
-import { u as we } from "./index-Dy-Hzr7y.js";
-import { u as ye } from "./index-0ioNhtNM.js";
-import { u as Ce } from "./index-ZExQO1ax.js";
-import { u as Ee } from "./index-BZPx6jYI.js";
-import { P as Fe } from "./index-D6HcSXrq.js";
-import { cn as F } from "./utils/twUtils.js";
-var L = "rovingFocusGroup.onEntryFocus", Se = { bubbles: !1, cancelable: !0 }, x = "RovingFocusGroup", [O, j, xe] = Ie(x), [Ne, z] = B(
-  x,
-  [xe]
-), [_e, Ae] = Ne(x), H = c.forwardRef(
-  (e, t) => /* @__PURE__ */ n(O.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ n(O.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ n(Ge, { ...e, ref: t }) }) })
+import { useState as ge, createContext as he, memo as Ie, useMemo as ye, useContext as we, useId as Ce } from "react";
+import { c as L, P as F, b as y, u as _, e as $ } from "./index-OnYbwQjk.js";
+import { c as Ee, u as j } from "./index-DSXuB1g3.js";
+import { u as Se } from "./index-C12FUuIW.js";
+import { u as Fe } from "./index-0ioNhtNM.js";
+import { u as Ae } from "./index-ZExQO1ax.js";
+import { u as Ne } from "./index-BZPx6jYI.js";
+import { P as _e } from "./index-D6HcSXrq.js";
+import { cn as E } from "./utils/twUtils.js";
+import { h as Pe, c as Te, p as xe, w as Ge, m as V } from "./proxy-CgaCj1WQ.js";
+import { A as ke } from "./index-DdFoGvON.js";
+var k = "rovingFocusGroup.onEntryFocus", De = { bubbles: !1, cancelable: !0 }, N = "RovingFocusGroup", [M, H, Me] = Ee(N), [Oe, z] = L(
+  N,
+  [Me]
+), [Le, Be] = Oe(N), W = c.forwardRef(
+  (e, t) => /* @__PURE__ */ a(M.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ a(M.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ a(Ke, { ...e, ref: t }) }) })
 );
-H.displayName = x;
-var Ge = c.forwardRef((e, t) => {
+W.displayName = N;
+var Ke = c.forwardRef((e, t) => {
   const {
     __scopeRovingFocusGroup: o,
     orientation: r,
-    loop: a = !1,
+    loop: n = !1,
     dir: s,
     currentTabStopId: i,
     defaultCurrentTabStopId: m,
-    onCurrentTabStopIdChange: b,
+    onCurrentTabStopIdChange: v,
     onEntryFocus: f,
-    preventScrollOnEntryFocus: d = !1,
+    preventScrollOnEntryFocus: u = !1,
     ...R
-  } = e, g = c.useRef(null), l = G(t, g), p = Y(s), [v, u] = q({
+  } = e, b = c.useRef(null), l = _(t, b), p = j(s), [h, d] = $({
     prop: i,
     defaultProp: m ?? null,
-    onChange: b,
-    caller: x
-  }), [y, T] = c.useState(!1), I = ye(f), C = j(o), k = c.useRef(!1), [le, U] = c.useState(0);
+    onChange: v,
+    caller: N
+  }), [w, T] = c.useState(!1), I = Fe(f), C = H(o), x = c.useRef(!1), [pe, K] = c.useState(0);
   return c.useEffect(() => {
-    const h = g.current;
-    if (h)
-      return h.addEventListener(L, I), () => h.removeEventListener(L, I);
-  }, [I]), /* @__PURE__ */ n(
-    _e,
+    const g = b.current;
+    if (g)
+      return g.addEventListener(k, I), () => g.removeEventListener(k, I);
+  }, [I]), /* @__PURE__ */ a(
+    Le,
     {
       scope: o,
       orientation: r,
       dir: p,
-      loop: a,
-      currentTabStopId: v,
+      loop: n,
+      currentTabStopId: h,
       onItemFocus: c.useCallback(
-        (h) => u(h),
-        [u]
+        (g) => d(g),
+        [d]
       ),
       onItemShiftTab: c.useCallback(() => T(!0), []),
       onFocusableItemAdd: c.useCallback(
-        () => U((h) => h + 1),
+        () => K((g) => g + 1),
         []
       ),
       onFocusableItemRemove: c.useCallback(
-        () => U((h) => h - 1),
+        () => K((g) => g - 1),
         []
       ),
-      children: /* @__PURE__ */ n(
-        S.div,
+      children: /* @__PURE__ */ a(
+        F.div,
         {
-          tabIndex: y || le === 0 ? -1 : 0,
+          tabIndex: w || pe === 0 ? -1 : 0,
           "data-orientation": r,
           ...R,
           ref: l,
           style: { outline: "none", ...e.style },
-          onMouseDown: w(e.onMouseDown, () => {
-            k.current = !0;
+          onMouseDown: y(e.onMouseDown, () => {
+            x.current = !0;
           }),
-          onFocus: w(e.onFocus, (h) => {
-            const fe = !k.current;
-            if (h.target === h.currentTarget && fe && !y) {
-              const V = new CustomEvent(L, Se);
-              if (h.currentTarget.dispatchEvent(V), !V.defaultPrevented) {
-                const D = C().filter((E) => E.focusable), pe = D.find((E) => E.active), me = D.find((E) => E.id === v), ve = [pe, me, ...D].filter(
+          onFocus: y(e.onFocus, (g) => {
+            const me = !x.current;
+            if (g.target === g.currentTarget && me && !w) {
+              const U = new CustomEvent(k, De);
+              if (g.currentTarget.dispatchEvent(U), !U.defaultPrevented) {
+                const G = C().filter((S) => S.focusable), ve = G.find((S) => S.active), be = G.find((S) => S.id === h), Re = [ve, be, ...G].filter(
                   Boolean
-                ).map((E) => E.ref.current);
-                X(ve, d);
+                ).map((S) => S.ref.current);
+                Q(Re, u);
               }
             }
-            k.current = !1;
+            x.current = !1;
           }),
-          onBlur: w(e.onBlur, () => T(!1))
+          onBlur: y(e.onBlur, () => T(!1))
         }
       )
     }
   );
-}), $ = "RovingFocusGroupItem", W = c.forwardRef(
+}), X = "RovingFocusGroupItem", J = c.forwardRef(
   (e, t) => {
     const {
       __scopeRovingFocusGroup: o,
       focusable: r = !0,
-      active: a = !1,
+      active: n = !1,
       tabStopId: s,
       children: i,
       ...m
-    } = e, b = we(), f = s || b, d = Ae($, o), R = d.currentTabStopId === f, g = j(o), { onFocusableItemAdd: l, onFocusableItemRemove: p, currentTabStopId: v } = d;
+    } = e, v = Se(), f = s || v, u = Be(X, o), R = u.currentTabStopId === f, b = H(o), { onFocusableItemAdd: l, onFocusableItemRemove: p, currentTabStopId: h } = u;
     return c.useEffect(() => {
       if (r)
         return l(), () => p();
-    }, [r, l, p]), /* @__PURE__ */ n(
-      O.ItemSlot,
+    }, [r, l, p]), /* @__PURE__ */ a(
+      M.ItemSlot,
       {
         scope: o,
         id: f,
         focusable: r,
-        active: a,
-        children: /* @__PURE__ */ n(
-          S.span,
+        active: n,
+        children: /* @__PURE__ */ a(
+          F.span,
           {
             tabIndex: R ? 0 : -1,
-            "data-orientation": d.orientation,
+            "data-orientation": u.orientation,
             ...m,
             ref: t,
-            onMouseDown: w(e.onMouseDown, (u) => {
-              r ? d.onItemFocus(f) : u.preventDefault();
+            onMouseDown: y(e.onMouseDown, (d) => {
+              r ? u.onItemFocus(f) : d.preventDefault();
             }),
-            onFocus: w(e.onFocus, () => d.onItemFocus(f)),
-            onKeyDown: w(e.onKeyDown, (u) => {
-              if (u.key === "Tab" && u.shiftKey) {
-                d.onItemShiftTab();
+            onFocus: y(e.onFocus, () => u.onItemFocus(f)),
+            onKeyDown: y(e.onKeyDown, (d) => {
+              if (d.key === "Tab" && d.shiftKey) {
+                u.onItemShiftTab();
                 return;
               }
-              if (u.target !== u.currentTarget) return;
-              const y = ke(u, d.orientation, d.dir);
-              if (y !== void 0) {
-                if (u.metaKey || u.ctrlKey || u.altKey || u.shiftKey) return;
-                u.preventDefault();
-                let I = g().filter((C) => C.focusable).map((C) => C.ref.current);
-                if (y === "last") I.reverse();
-                else if (y === "prev" || y === "next") {
-                  y === "prev" && I.reverse();
-                  const C = I.indexOf(u.currentTarget);
-                  I = d.loop ? De(I, C + 1) : I.slice(C + 1);
+              if (d.target !== d.currentTarget) return;
+              const w = qe(d, u.orientation, u.dir);
+              if (w !== void 0) {
+                if (d.metaKey || d.ctrlKey || d.altKey || d.shiftKey) return;
+                d.preventDefault();
+                let I = b().filter((C) => C.focusable).map((C) => C.ref.current);
+                if (w === "last") I.reverse();
+                else if (w === "prev" || w === "next") {
+                  w === "prev" && I.reverse();
+                  const C = I.indexOf(d.currentTarget);
+                  I = u.loop ? Ye(I, C + 1) : I.slice(C + 1);
                 }
-                setTimeout(() => X(I));
+                setTimeout(() => Q(I));
               }
             }),
-            children: typeof i == "function" ? i({ isCurrentTabStop: R, hasTabStop: v != null }) : i
+            children: typeof i == "function" ? i({ isCurrentTabStop: R, hasTabStop: h != null }) : i
           }
         )
       }
     );
   }
 );
-W.displayName = $;
-var Pe = {
+J.displayName = X;
+var Ue = {
   ArrowLeft: "prev",
   ArrowUp: "prev",
   ArrowRight: "next",
@@ -160,61 +162,61 @@ var Pe = {
   PageDown: "last",
   End: "last"
 };
-function Te(e, t) {
+function Ve(e, t) {
   return t !== "rtl" ? e : e === "ArrowLeft" ? "ArrowRight" : e === "ArrowRight" ? "ArrowLeft" : e;
 }
-function ke(e, t, o) {
-  const r = Te(e.key, o);
+function qe(e, t, o) {
+  const r = Ve(e.key, o);
   if (!(t === "vertical" && ["ArrowLeft", "ArrowRight"].includes(r)) && !(t === "horizontal" && ["ArrowUp", "ArrowDown"].includes(r)))
-    return Pe[r];
+    return Ue[r];
 }
-function X(e, t = !1) {
+function Q(e, t = !1) {
   const o = document.activeElement;
   for (const r of e)
     if (r === o || (r.focus({ preventScroll: t }), document.activeElement !== o)) return;
 }
-function De(e, t) {
+function Ye(e, t) {
   return e.map((o, r) => e[(t + r) % e.length]);
 }
-var Le = H, Oe = W, K = "Radio", [Me, J] = B(K), [Be, Ke] = Me(K), Q = c.forwardRef(
+var $e = W, je = J, B = "Radio", [He, Z] = L(B), [ze, We] = He(B), ee = c.forwardRef(
   (e, t) => {
     const {
       __scopeRadio: o,
       name: r,
-      checked: a = !1,
+      checked: n = !1,
       required: s,
       disabled: i,
       value: m = "on",
-      onCheck: b,
+      onCheck: v,
       form: f,
-      ...d
-    } = e, [R, g] = c.useState(null), l = G(t, (u) => g(u)), p = c.useRef(!1), v = R ? f || !!R.closest("form") : !0;
-    return /* @__PURE__ */ N(Be, { scope: o, checked: a, disabled: i, children: [
-      /* @__PURE__ */ n(
-        S.button,
+      ...u
+    } = e, [R, b] = c.useState(null), l = _(t, (d) => b(d)), p = c.useRef(!1), h = R ? f || !!R.closest("form") : !0;
+    return /* @__PURE__ */ Y(ze, { scope: o, checked: n, disabled: i, children: [
+      /* @__PURE__ */ a(
+        F.button,
         {
           type: "button",
           role: "radio",
-          "aria-checked": a,
-          "data-state": te(a),
+          "aria-checked": n,
+          "data-state": ae(n),
           "data-disabled": i ? "" : void 0,
           disabled: i,
           value: m,
-          ...d,
+          ...u,
           ref: l,
-          onClick: w(e.onClick, (u) => {
-            a || b?.(), v && (p.current = u.isPropagationStopped(), p.current || u.stopPropagation());
+          onClick: y(e.onClick, (d) => {
+            n || v?.(), h && (p.current = d.isPropagationStopped(), p.current || d.stopPropagation());
           })
         }
       ),
-      v && /* @__PURE__ */ n(
-        oe,
+      h && /* @__PURE__ */ a(
+        re,
         {
           control: R,
           bubbles: !p.current,
           name: r,
           value: m,
-          checked: a,
+          checked: n,
           required: s,
           disabled: i,
           form: f,
@@ -224,53 +226,53 @@ var Le = H, Oe = W, K = "Radio", [Me, J] = B(K), [Be, Ke] = Me(K), Q = c.forward
     ] });
   }
 );
-Q.displayName = K;
-var Z = "RadioIndicator", ee = c.forwardRef(
+ee.displayName = B;
+var oe = "RadioIndicator", te = c.forwardRef(
   (e, t) => {
-    const { __scopeRadio: o, forceMount: r, ...a } = e, s = Ke(Z, o);
-    return /* @__PURE__ */ n(Fe, { present: r || s.checked, children: /* @__PURE__ */ n(
-      S.span,
+    const { __scopeRadio: o, forceMount: r, ...n } = e, s = We(oe, o);
+    return /* @__PURE__ */ a(_e, { present: r || s.checked, children: /* @__PURE__ */ a(
+      F.span,
       {
-        "data-state": te(s.checked),
+        "data-state": ae(s.checked),
         "data-disabled": s.disabled ? "" : void 0,
-        ...a,
+        ...n,
         ref: t
       }
     ) });
   }
 );
-ee.displayName = Z;
-var Ue = "RadioBubbleInput", oe = c.forwardRef(
+te.displayName = oe;
+var Xe = "RadioBubbleInput", re = c.forwardRef(
   ({
     __scopeRadio: e,
     control: t,
     checked: o,
     bubbles: r = !0,
-    ...a
+    ...n
   }, s) => {
-    const i = c.useRef(null), m = G(i, s), b = Ee(o), f = Ce(t);
+    const i = c.useRef(null), m = _(i, s), v = Ne(o), f = Ae(t);
     return c.useEffect(() => {
-      const d = i.current;
-      if (!d) return;
+      const u = i.current;
+      if (!u) return;
       const R = window.HTMLInputElement.prototype, l = Object.getOwnPropertyDescriptor(
         R,
         "checked"
       ).set;
-      if (b !== o && l) {
+      if (v !== o && l) {
         const p = new Event("click", { bubbles: r });
-        l.call(d, o), d.dispatchEvent(p);
+        l.call(u, o), u.dispatchEvent(p);
       }
-    }, [b, o, r]), /* @__PURE__ */ n(
-      S.input,
+    }, [v, o, r]), /* @__PURE__ */ a(
+      F.input,
       {
         type: "radio",
         "aria-hidden": !0,
         defaultChecked: o,
-        ...a,
+        ...n,
         tabIndex: -1,
         ref: m,
         style: {
-          ...a.style,
+          ...n.style,
           ...f,
           position: "absolute",
           pointerEvents: "none",
@@ -281,59 +283,59 @@ var Ue = "RadioBubbleInput", oe = c.forwardRef(
     );
   }
 );
-oe.displayName = Ue;
-function te(e) {
+re.displayName = Xe;
+function ae(e) {
   return e ? "checked" : "unchecked";
 }
-var Ve = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], P = "RadioGroup", [qe] = B(P, [
+var Je = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], P = "RadioGroup", [Qe] = L(P, [
   z,
-  J
-]), re = z(), ae = J(), [Ye, je] = qe(P), ne = c.forwardRef(
+  Z
+]), ne = z(), se = Z(), [Ze, eo] = Qe(P), ie = c.forwardRef(
   (e, t) => {
     const {
       __scopeRadioGroup: o,
       name: r,
-      defaultValue: a,
+      defaultValue: n,
       value: s,
       required: i = !1,
       disabled: m = !1,
-      orientation: b,
+      orientation: v,
       dir: f,
-      loop: d = !0,
+      loop: u = !0,
       onValueChange: R,
-      ...g
-    } = e, l = re(o), p = Y(f), [v, u] = q({
+      ...b
+    } = e, l = ne(o), p = j(f), [h, d] = $({
       prop: s,
-      defaultProp: a ?? null,
+      defaultProp: n ?? null,
       onChange: R,
       caller: P
     });
-    return /* @__PURE__ */ n(
-      Ye,
+    return /* @__PURE__ */ a(
+      Ze,
       {
         scope: o,
         name: r,
         required: i,
         disabled: m,
-        value: v,
-        onValueChange: u,
-        children: /* @__PURE__ */ n(
-          Le,
+        value: h,
+        onValueChange: d,
+        children: /* @__PURE__ */ a(
+          $e,
           {
             asChild: !0,
             ...l,
-            orientation: b,
+            orientation: v,
             dir: p,
-            loop: d,
-            children: /* @__PURE__ */ n(
-              S.div,
+            loop: u,
+            children: /* @__PURE__ */ a(
+              F.div,
               {
                 role: "radiogroup",
                 "aria-required": i,
-                "aria-orientation": b,
+                "aria-orientation": v,
                 "data-disabled": m ? "" : void 0,
                 dir: p,
-                ...g,
+                ...b,
                 ref: t
               }
             )
@@ -343,40 +345,40 @@ var Ve = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], P = "RadioGroup",
     );
   }
 );
-ne.displayName = P;
-var se = "RadioGroupItem", ie = c.forwardRef(
+ie.displayName = P;
+var ce = "RadioGroupItem", ue = c.forwardRef(
   (e, t) => {
-    const { __scopeRadioGroup: o, disabled: r, ...a } = e, s = je(se, o), i = s.disabled || r, m = re(o), b = ae(o), f = c.useRef(null), d = G(t, f), R = s.value === a.value, g = c.useRef(!1);
+    const { __scopeRadioGroup: o, disabled: r, ...n } = e, s = eo(ce, o), i = s.disabled || r, m = ne(o), v = se(o), f = c.useRef(null), u = _(t, f), R = s.value === n.value, b = c.useRef(!1);
     return c.useEffect(() => {
-      const l = (v) => {
-        Ve.includes(v.key) && (g.current = !0);
-      }, p = () => g.current = !1;
+      const l = (h) => {
+        Je.includes(h.key) && (b.current = !0);
+      }, p = () => b.current = !1;
       return document.addEventListener("keydown", l), document.addEventListener("keyup", p), () => {
         document.removeEventListener("keydown", l), document.removeEventListener("keyup", p);
       };
-    }, []), /* @__PURE__ */ n(
-      Oe,
+    }, []), /* @__PURE__ */ a(
+      je,
       {
         asChild: !0,
         ...m,
         focusable: !i,
         active: R,
-        children: /* @__PURE__ */ n(
-          Q,
+        children: /* @__PURE__ */ a(
+          ee,
           {
             disabled: i,
             required: s.required,
             checked: R,
-            ...b,
-            ...a,
+            ...v,
+            ...n,
             name: s.name,
-            ref: d,
-            onCheck: () => s.onValueChange(a.value),
-            onKeyDown: w((l) => {
+            ref: u,
+            onCheck: () => s.onValueChange(n.value),
+            onKeyDown: y((l) => {
               l.key === "Enter" && l.preventDefault();
             }),
-            onFocus: w(a.onFocus, () => {
-              g.current && f.current?.click();
+            onFocus: y(n.onFocus, () => {
+              b.current && f.current?.click();
             })
           }
         )
@@ -384,115 +386,130 @@ var se = "RadioGroupItem", ie = c.forwardRef(
     );
   }
 );
-ie.displayName = se;
-var ze = "RadioGroupIndicator", ce = c.forwardRef(
+ue.displayName = ce;
+var oo = "RadioGroupIndicator", de = c.forwardRef(
   (e, t) => {
-    const { __scopeRadioGroup: o, ...r } = e, a = ae(o);
-    return /* @__PURE__ */ n(ee, { ...a, ...r, ref: t });
+    const { __scopeRadioGroup: o, ...r } = e, n = se(o);
+    return /* @__PURE__ */ a(te, { ...n, ...r, ref: t });
   }
 );
-ce.displayName = ze;
-var He = ne, ue = ie, $e = ce;
-const de = be({
-  orientation: "vertical",
-  variant: "default",
+de.displayName = oo;
+var to = ie, O = ue, q = de;
+function ro() {
+  !Pe.current && Te();
+  const [e] = ge(xe.current);
+  return process.env.NODE_ENV !== "production" && Ge(e !== !0, "You have Reduced Motion enabled on your device. Animations may not appear as expected.", "reduced-motion-disabled"), e;
+}
+const le = he({
   disabledValues: [],
-  groupDisabled: !1
-}), A = "pointer-events-none opacity-60", We = ({
-  ref: e,
-  className: t,
+  groupDisabled: !1,
+  orientation: "vertical",
+  variant: "default"
+}), A = "pointer-events-none opacity-60", ao = ({
+  className: e,
+  disabled: t,
   itemClassName: o,
   onValueChange: r,
-  orientation: a = "vertical",
-  disabled: s,
+  orientation: n = "vertical",
+  ref: s,
   selected: i,
   variant: m = "default",
-  ...b
+  ...v
 }) => {
-  const f = ge(
+  const f = ye(
     () => ({
-      orientation: a,
-      variant: m,
-      disabledValues: Array.isArray(s) ? s : [],
-      groupDisabled: typeof s == "boolean" ? s : !1,
+      disabledValues: Array.isArray(t) ? t : [],
+      groupDisabled: typeof t == "boolean" ? t : !1,
       itemClassName: o,
-      selected: i
+      orientation: n,
+      selected: i,
+      variant: m
     }),
-    [a, m, s, o, i]
+    [n, m, t, o, i]
   );
-  return /* @__PURE__ */ n(de.Provider, { value: f, children: /* @__PURE__ */ n(
-    He,
+  return /* @__PURE__ */ a(le.Provider, { value: f, children: /* @__PURE__ */ a(
+    to,
     {
-      className: F("text-text-primary flex w-full", a === "vertical" ? "flex-col gap-4" : "flex-row gap-5", m === "unstyled" && "w-fit gap-2.5", t),
+      className: E("text-text-primary flex w-full", n === "vertical" ? "flex-col gap-4" : "flex-row gap-5", m === "unstyled" && "w-fit gap-2.5", e),
       "data-testid": "spectral-radio-group",
       disabled: f.groupDisabled,
       onValueChange: r,
-      ref: e,
+      ref: s,
       value: i,
-      ...b
+      ...v
     }
   ) });
 };
-We.displayName = "RadioGroup";
-const M = Re(
+ao.displayName = "RadioGroup";
+const no = { type: "spring", stiffness: 200, damping: 16 }, fe = Ie(
   ({
-    ref: e,
-    value: t,
-    id: o,
-    isDisabled: r,
-    className: a,
-    ...s
-  }) => /* @__PURE__ */ n(
-    ue,
+    className: e,
+    id: t,
+    isDisabled: o,
+    ref: r,
+    transition: n = no,
+    value: s,
+    ...i
+  }) => ro() ? /* @__PURE__ */ a(
+    O,
     {
-      ref: e,
+      className: E(
+        "border-border-subtle bg-radio-bg relative aspect-square h-4.5 w-4.5 cursor-pointer rounded-full border-2 ring-black transition-colors",
+        "hover:border-radio-border--hover focus-visible:outline-accent focus-visible:outline-1 focus-visible:outline-offset-2",
+        "data-[state=checked]:border-radio-border--selected data-[state=checked]:bg-radio-bg",
+        o && A,
+        e
+      ),
       "data-testid": "spectral-radio-group-item",
-      className: F(
+      disabled: o,
+      id: t,
+      ref: r,
+      value: s,
+      ...i,
+      children: /* @__PURE__ */ a(q, { className: E("after:bg-radio-bg--selected after:absolute after:inset-0 after:m-auto after:h-2.5 after:w-2.5 after:rounded-full after:content-['']", o && A) })
+    }
+  ) : /* @__PURE__ */ a(O, { value: s, id: t, disabled: o, asChild: !0, ...i, children: /* @__PURE__ */ a(
+    V.button,
+    {
+      className: E(
         "border-border-subtle bg-radio-bg relative aspect-square h-4.5 w-4.5 cursor-pointer rounded-full border-2 ring-black transition-colors",
         "hover:border-radio-border--hover focus-visible:outline-accent focus-visible:outline-1 focus-visible:outline-offset-2",
-        "[&[data-state=checked]]:border-radio-border--selected [&[data-state=checked]]:bg-radio-bg",
-        r && A,
-        a
+        "data-[state=checked]:border-radio-border--selected data-[state=checked]:bg-radio-bg",
+        o && A,
+        e
       ),
-      disabled: r,
-      value: t,
-      id: o,
-      ...s,
-      children: /* @__PURE__ */ n($e, { className: "after:bg-radio-bg--selected transition-colors after:absolute after:inset-0 after:m-auto after:h-2.5 after:w-2.5 after:rounded-full after:content-['']" })
+      "data-testid": "spectral-radio-group-item",
+      ref: r,
+      whileHover: { scale: 1.05 },
+      whileTap: { scale: 0.95 },
+      children: /* @__PURE__ */ a(q, { className: "relative flex items-center justify-center", children: /* @__PURE__ */ a(ke, { children: /* @__PURE__ */ a(V.div, { animate: { opacity: 1, scale: 1 }, className: "bg-radio-bg--selected absolute h-2.5 w-2.5 rounded-full", exit: { opacity: 0, scale: 0 }, initial: { opacity: 0, scale: 0 }, transition: n }, "radio-indicator") }) })
     }
-  )
+  ) })
 );
-M.displayName = "RadioButton";
-const Xe = ({
-  ref: e,
+fe.displayName = "RadioButton";
+const so = ({
+  children: e,
   className: t,
-  children: o,
-  value: r,
-  description: a,
-  disabled: s,
-  ...i
+  disabled: o,
+  ref: r,
+  value: n,
+  ...s
 }) => {
-  const { disabledValues: m, groupDisabled: b, itemClassName: f, variant: d, selected: R, orientation: g } = he(de), l = r.toString(), p = i.id?.toString() || l, v = b || m.includes(l) || !!s, u = R === l;
-  return d === "tiles" ? /* @__PURE__ */ n(_, { htmlFor: p, className: F("border-border-subtle flex w-full cursor-pointer items-start rounded-xl border p-4", u && "border-tile-border--selected bg-tile-bg--selected", v && A, f, t), children: /* @__PURE__ */ N("div", { className: "flex w-full items-start justify-between gap-4", children: [
-    /* @__PURE__ */ n("div", { className: "relative top-0.75 mr-3 flex-shrink-0", children: /* @__PURE__ */ n(M, { ref: e, value: l, id: p, isDisabled: v, ...i }) }),
-    /* @__PURE__ */ N("div", { className: "flex flex-grow flex-col", children: [
-      /* @__PURE__ */ n("div", { className: "font-bold", children: o }),
-      a && /* @__PURE__ */ n("div", { className: "mt-1 text-sm", children: a })
-    ] })
-  ] }) }) : d === "unstyled" ? /* @__PURE__ */ n(ue, { ref: e, value: l, id: p, disabled: v, asChild: !0, ...i, children: /* @__PURE__ */ n(_, { htmlFor: p, className: F("[&[data-state=checked]]:border-radio-border--selected flex h-fit w-fit rounded border-2 border-transparent", v && A, f, t), children: o }) }) : /* @__PURE__ */ N("div", { className: F("flex items-center", v && A, f, t, g), children: [
-    /* @__PURE__ */ n(M, { ref: e, value: l, id: p, isDisabled: v, ...i }),
-    o && /* @__PURE__ */ n(_, { className: F("text-md cursor-pointer font-normal", g === "vertical" ? "ml-2" : "ml-1"), htmlFor: p, children: o })
+  const { disabledValues: i, groupDisabled: m, itemClassName: v, variant: f, orientation: u } = we(le), R = Ce(), b = n.toString(), l = s.id?.toString() ?? `${b}-${R}`, p = m || i.includes(b) || !!o;
+  return f === "unstyled" ? /* @__PURE__ */ a(O, { asChild: !0, "data-testid": "spectral-radio-group-item", disabled: p, id: l, ref: r, value: b, ...s, children: /* @__PURE__ */ a(D, { className: E("data-[state=checked]:border-radio-border--selected flex h-fit w-fit rounded border-2 border-transparent", p && A, v, t), "data-testid": "spectral-radio-group-item-label", htmlFor: l, children: e }) }) : /* @__PURE__ */ Y("div", { className: E("flex items-center", p && A, v, t, u), children: [
+    /* @__PURE__ */ a(fe, { ref: r, value: b, id: l, isDisabled: p, ...s }),
+    e && /* @__PURE__ */ a(D, { className: E("text-md cursor-pointer font-normal", u === "vertical" ? "ml-2" : "ml-1"), htmlFor: l, children: e })
   ] });
 };
-Xe.displayName = "RadioGroup.Item";
-const Je = ({
+so.displayName = "RadioGroup.Item";
+const io = ({
   ref: e,
   className: t,
   ...o
-}) => /* @__PURE__ */ n(_, { ref: e, "data-testid": "spectral-radio-group-label", className: F("text-md block font-medium", t), ...o });
-Je.displayName = "RadioGroup.Label";
+}) => /* @__PURE__ */ a(D, { ref: e, "data-testid": "spectral-radio-group-label", className: E("text-md block font-medium", t), ...o });
+io.displayName = "RadioGroup.Label";
 export {
-  We as RadioGroup,
-  Xe as RadioGroupItem,
-  Je as RadioGroupLabel
+  ao as RadioGroup,
+  so as RadioGroupItem,
+  io as RadioGroupLabel
 };