@moises.ai/design-system 3.6.24 → 3.6.25

package/dist/index.js

@@ -26,8 +26,8 @@ var jc = [" ", "Enter", "ArrowUp", "ArrowDown"], Wc = [" ", "Enter"], Bt = "Sele
     autoComplete: A,
     disabled: p,
     required: k,
-    form: v
-  } = n, m = Vn(e), [f, E] = d.useState(null), [B, I] = d.useState(null), [S, b] = d.useState(!1), w = ta(u), [Q, O] = xn({
+    form: f
+  } = n, m = Vn(e), [C, E] = d.useState(null), [b, I] = d.useState(null), [S, B] = d.useState(!1), w = ta(u), [Q, O] = xn({
     prop: s,
     defaultProp: a ?? !1,
     onChange: o,
@@ -37,18 +37,18 @@ var jc = [" ", "Enter", "ArrowUp", "ArrowDown"], Wc = [" ", "Enter"], Bt = "Sele
     defaultProp: l,
     onChange: c,
     caller: Bt
-  }), z = d.useRef(null), M = f ? v || !!f.closest("form") : !0, [U, J] = d.useState(/* @__PURE__ */ new Set()), x = Array.from(U).map((L) => L.props.value).join(";");
+  }), z = d.useRef(null), M = C ? f || !!C.closest("form") : !0, [U, J] = d.useState(/* @__PURE__ */ new Set()), x = Array.from(U).map((L) => L.props.value).join(";");
   return /* @__PURE__ */ r(Vi, { ...m, children: /* @__PURE__ */ g(
     Vc,
     {
       required: k,
       scope: e,
-      trigger: f,
+      trigger: C,
       onTriggerChange: E,
-      valueNode: B,
+      valueNode: b,
       onValueNodeChange: I,
       valueNodeHasChildren: S,
-      onValueNodeHasChildrenChange: b,
+      onValueNodeHasChildrenChange: B,
       contentId: js(),
       value: T,
       onValueChange: D,
@@ -85,7 +85,7 @@ var jc = [" ", "Enter", "ArrowUp", "ArrowDown"], Wc = [" ", "Enter"], Bt = "Sele
             value: T,
             onChange: (L) => D(L.target.value),
             disabled: p,
-            form: v,
+            form: f,
             children: [
               T === void 0 ? /* @__PURE__ */ r("option", { value: "" }) : null,
               Array.from(U)
@@ -101,9 +101,9 @@ Ia.displayName = Bt;
 var ba = "SelectTrigger", Ba = d.forwardRef(
   (n, e) => {
     const { __scopeSelect: t, disabled: s = !1, ...a } = n, o = Vn(t), i = lt(ba, t), l = i.disabled || s, c = Se(e, i.onTriggerChange), u = Ln(t), h = d.useRef("touch"), [A, p, k] = Xa((m) => {
-      const f = u().filter((I) => !I.disabled), E = f.find((I) => I.value === i.value), B = Ya(f, m, E);
-      B !== void 0 && i.onValueChange(B.value);
-    }), v = (m) => {
+      const C = u().filter((I) => !I.disabled), E = C.find((I) => I.value === i.value), b = Ya(C, m, E);
+      b !== void 0 && i.onValueChange(b.value);
+    }), f = (m) => {
       l || (i.onOpenChange(!0), k()), m && (i.triggerPointerDownPosRef.current = {
         x: Math.round(m.pageX),
         y: Math.round(m.pageY)
@@ -126,16 +126,16 @@ var ba = "SelectTrigger", Ba = d.forwardRef(
         ...a,
         ref: c,
         onClick: ie(a.onClick, (m) => {
-          m.currentTarget.focus(), h.current !== "mouse" && v(m);
+          m.currentTarget.focus(), h.current !== "mouse" && f(m);
         }),
         onPointerDown: ie(a.onPointerDown, (m) => {
           h.current = m.pointerType;
-          const f = m.target;
-          f.hasPointerCapture(m.pointerId) && f.releasePointerCapture(m.pointerId), m.button === 0 && m.ctrlKey === !1 && m.pointerType === "mouse" && (v(m), m.preventDefault());
+          const C = m.target;
+          C.hasPointerCapture(m.pointerId) && C.releasePointerCapture(m.pointerId), m.button === 0 && m.ctrlKey === !1 && m.pointerType === "mouse" && (f(m), m.preventDefault());
         }),
         onKeyDown: ie(a.onKeyDown, (m) => {
-          const f = A.current !== "";
-          !(m.ctrlKey || m.altKey || m.metaKey) && m.key.length === 1 && p(m.key), !(f && m.key === " ") && jc.includes(m.key) && (v(), m.preventDefault());
+          const C = A.current !== "";
+          !(m.ctrlKey || m.altKey || m.metaKey) && m.key.length === 1 && p(m.key), !(C && m.key === " ") && jc.includes(m.key) && (f(), m.preventDefault());
         })
       }
     ) });
@@ -201,12 +201,12 @@ var Me = 10, [Ta, ct] = Lt(wt), Yc = "SelectContentImpl", Zc = tl("SelectContent
       arrowPadding: A,
       collisionBoundary: p,
       collisionPadding: k,
-      sticky: v,
+      sticky: f,
       hideWhenDetached: m,
-      avoidCollisions: f,
+      avoidCollisions: C,
       //
       ...E
-    } = n, B = lt(wt, t), [I, S] = d.useState(null), [b, w] = d.useState(null), Q = Se(e, (V) => S(V)), [O, T] = d.useState(null), [D, z] = d.useState(
+    } = n, b = lt(wt, t), [I, S] = d.useState(null), [B, w] = d.useState(null), Q = Se(e, (V) => S(V)), [O, T] = d.useState(null), [D, z] = d.useState(
       null
     ), M = Ln(t), [U, J] = d.useState(!1), x = d.useRef(!1);
     d.useEffect(() => {
@@ -216,9 +216,9 @@ var Me = 10, [Ta, ct] = Lt(wt), Yc = "SelectContentImpl", Zc = tl("SelectContent
       (V) => {
         const [ue, ...Te] = M().map((ne) => ne.ref.current), [ce] = Te.slice(-1), te = document.activeElement;
         for (const ne of V)
-          if (ne === te || (ne == null || ne.scrollIntoView({ block: "nearest" }), ne === ue && b && (b.scrollTop = 0), ne === ce && b && (b.scrollTop = b.scrollHeight), ne == null || ne.focus(), document.activeElement !== te)) return;
+          if (ne === te || (ne == null || ne.scrollIntoView({ block: "nearest" }), ne === ue && B && (B.scrollTop = 0), ne === ce && B && (B.scrollTop = B.scrollHeight), ne == null || ne.focus(), document.activeElement !== te)) return;
       },
-      [M, b]
+      [M, B]
     ), G = d.useCallback(
       () => L([O, I]),
       [L, O, I]
@@ -226,7 +226,7 @@ var Me = 10, [Ta, ct] = Lt(wt), Yc = "SelectContentImpl", Zc = tl("SelectContent
     d.useEffect(() => {
       U && G();
     }, [U, G]);
-    const { onOpenChange: Z, triggerPointerDownPosRef: R } = B;
+    const { onOpenChange: Z, triggerPointerDownPosRef: R } = b;
     d.useEffect(() => {
       if (I) {
         let V = { x: 0, y: 0 };
@@ -255,15 +255,15 @@ var Me = 10, [Ta, ct] = Lt(wt), Yc = "SelectContentImpl", Zc = tl("SelectContent
     }), Re = d.useCallback(
       (V, ue, Te) => {
         const ce = !x.current && !Te;
-        (B.value !== void 0 && B.value === ue || ce) && (T(V), ce && (x.current = !0));
+        (b.value !== void 0 && b.value === ue || ce) && (T(V), ce && (x.current = !0));
       },
-      [B.value]
+      [b.value]
     ), xe = d.useCallback(() => I == null ? void 0 : I.focus(), [I]), Qe = d.useCallback(
       (V, ue, Te) => {
         const ce = !x.current && !Te;
-        (B.value !== void 0 && B.value === ue || ce) && z(V);
+        (b.value !== void 0 && b.value === ue || ce) && z(V);
       },
-      [B.value]
+      [b.value]
     ), le = s === "popper" ? Rs : Ja, be = le === Rs ? {
       side: l,
       sideOffset: c,
@@ -272,16 +272,16 @@ var Me = 10, [Ta, ct] = Lt(wt), Yc = "SelectContentImpl", Zc = tl("SelectContent
       arrowPadding: A,
       collisionBoundary: p,
       collisionPadding: k,
-      sticky: v,
+      sticky: f,
       hideWhenDetached: m,
-      avoidCollisions: f
+      avoidCollisions: C
     } : {};
     return /* @__PURE__ */ r(
       Ta,
       {
         scope: t,
         content: I,
-        viewport: b,
+        viewport: B,
         onViewportChange: w,
         itemRefCallback: Re,
         selectedItem: O,
@@ -296,13 +296,13 @@ var Me = 10, [Ta, ct] = Lt(wt), Yc = "SelectContentImpl", Zc = tl("SelectContent
           $i,
           {
             asChild: !0,
-            trapped: B.open,
+            trapped: b.open,
             onMountAutoFocus: (V) => {
               V.preventDefault();
             },
             onUnmountAutoFocus: ie(a, (V) => {
               var ue;
-              (ue = B.trigger) == null || ue.focus({ preventScroll: !0 }), V.preventDefault();
+              (ue = b.trigger) == null || ue.focus({ preventScroll: !0 }), V.preventDefault();
             }),
             children: /* @__PURE__ */ r(
               el,
@@ -312,14 +312,14 @@ var Me = 10, [Ta, ct] = Lt(wt), Yc = "SelectContentImpl", Zc = tl("SelectContent
                 onEscapeKeyDown: o,
                 onPointerDownOutside: i,
                 onFocusOutside: (V) => V.preventDefault(),
-                onDismiss: () => B.onOpenChange(!1),
+                onDismiss: () => b.onOpenChange(!1),
                 children: /* @__PURE__ */ r(
                   le,
                   {
                     role: "listbox",
-                    id: B.contentId,
-                    "data-state": B.open ? "open" : "closed",
-                    dir: B.dir,
+                    id: b.contentId,
+                    "data-state": b.open ? "open" : "closed",
+                    dir: b.dir,
                     onContextMenu: (V) => V.preventDefault(),
                     ...E,
                     ...be,
@@ -356,8 +356,8 @@ var Me = 10, [Ta, ct] = Lt(wt), Yc = "SelectContentImpl", Zc = tl("SelectContent
 );
 Da.displayName = Yc;
 var _c = "SelectItemAlignedPosition", Ja = d.forwardRef((n, e) => {
-  const { __scopeSelect: t, onPlaced: s, ...a } = n, o = lt(wt, t), i = ct(wt, t), [l, c] = d.useState(null), [u, h] = d.useState(null), A = Se(e, (Q) => h(Q)), p = Ln(t), k = d.useRef(!1), v = d.useRef(!0), { viewport: m, selectedItem: f, selectedItemText: E, focusSelectedItem: B } = i, I = d.useCallback(() => {
-    if (o.trigger && o.valueNode && l && u && m && f && E) {
+  const { __scopeSelect: t, onPlaced: s, ...a } = n, o = lt(wt, t), i = ct(wt, t), [l, c] = d.useState(null), [u, h] = d.useState(null), A = Se(e, (Q) => h(Q)), p = Ln(t), k = d.useRef(!1), f = d.useRef(!0), { viewport: m, selectedItem: C, selectedItemText: E, focusSelectedItem: b } = i, I = d.useCallback(() => {
+    if (o.trigger && o.valueNode && l && u && m && C && E) {
       const Q = o.trigger.getBoundingClientRect(), O = u.getBoundingClientRect(), T = o.valueNode.getBoundingClientRect(), D = E.getBoundingClientRect();
       if (o.dir !== "rtl") {
         const te = D.left - O.left, ne = T.left - te, At = Q.left - ne, ht = Q.width + At, is = Math.max(ht, O.width), ls = window.innerWidth - Me, cs = Qn(ne, [
@@ -377,9 +377,9 @@ var _c = "SelectItemAlignedPosition", Ja = d.forwardRef((n, e) => {
         ]);
         l.style.minWidth = ht + "px", l.style.right = cs + "px";
       }
-      const z = p(), M = window.innerHeight - Me * 2, U = m.scrollHeight, J = window.getComputedStyle(u), x = parseInt(J.borderTopWidth, 10), L = parseInt(J.paddingTop, 10), G = parseInt(J.borderBottomWidth, 10), Z = parseInt(J.paddingBottom, 10), R = x + L + U + Z + G, H = Math.min(f.offsetHeight * 5, R), ae = window.getComputedStyle(m), Re = parseInt(ae.paddingTop, 10), xe = parseInt(ae.paddingBottom, 10), Qe = Q.top + Q.height / 2 - Me, le = M - Qe, be = f.offsetHeight / 2, V = f.offsetTop + be, ue = x + L + V, Te = R - ue;
+      const z = p(), M = window.innerHeight - Me * 2, U = m.scrollHeight, J = window.getComputedStyle(u), x = parseInt(J.borderTopWidth, 10), L = parseInt(J.paddingTop, 10), G = parseInt(J.borderBottomWidth, 10), Z = parseInt(J.paddingBottom, 10), R = x + L + U + Z + G, H = Math.min(C.offsetHeight * 5, R), ae = window.getComputedStyle(m), Re = parseInt(ae.paddingTop, 10), xe = parseInt(ae.paddingBottom, 10), Qe = Q.top + Q.height / 2 - Me, le = M - Qe, be = C.offsetHeight / 2, V = C.offsetTop + be, ue = x + L + V, Te = R - ue;
       if (ue <= Qe) {
-        const te = z.length > 0 && f === z[z.length - 1].ref.current;
+        const te = z.length > 0 && C === z[z.length - 1].ref.current;
         l.style.bottom = "0px";
         const ne = u.clientHeight - m.offsetTop - m.offsetHeight, At = Math.max(
           le,
@@ -388,7 +388,7 @@ var _c = "SelectItemAlignedPosition", Ja = d.forwardRef((n, e) => {
         ), ht = ue + At;
         l.style.height = ht + "px";
       } else {
-        const te = z.length > 0 && f === z[0].ref.current;
+        const te = z.length > 0 && C === z[0].ref.current;
         l.style.top = "0px";
         const At = Math.max(
           Qe,
@@ -406,21 +406,21 @@ var _c = "SelectItemAlignedPosition", Ja = d.forwardRef((n, e) => {
     l,
     u,
     m,
-    f,
+    C,
     E,
     o.dir,
     s
   ]);
   ot(() => I(), [I]);
-  const [S, b] = d.useState();
+  const [S, B] = d.useState();
   ot(() => {
-    u && b(window.getComputedStyle(u).zIndex);
+    u && B(window.getComputedStyle(u).zIndex);
   }, [u]);
   const w = d.useCallback(
     (Q) => {
-      Q && v.current === !0 && (I(), B == null || B(), v.current = !1);
+      Q && f.current === !0 && (I(), b == null || b(), f.current = !1);
     },
-    [I, B]
+    [I, b]
   );
   return /* @__PURE__ */ r(
     ed,
@@ -527,9 +527,9 @@ var [ed, Zs] = Lt(wt, {}), Ns = "SelectViewport", Pa = d.forwardRef(
             if (p != null && p.current && A) {
               const k = Math.abs(c.current - h.scrollTop);
               if (k > 0) {
-                const v = window.innerHeight - Me * 2, m = parseFloat(A.style.minHeight), f = parseFloat(A.style.height), E = Math.max(m, f);
-                if (E < v) {
-                  const B = E + k, I = Math.min(v, B), S = B - I;
+                const f = window.innerHeight - Me * 2, m = parseFloat(A.style.minHeight), C = parseFloat(A.style.height), E = Math.max(m, C);
+                if (E < f) {
+                  const b = E + k, I = Math.min(f, b), S = b - I;
                   A.style.height = I + "px", A.style.bottom === "0px" && (h.scrollTop = S > 0 ? S : 0, A.style.justifyContent = "flex-end");
                 }
               }
@@ -564,13 +564,13 @@ var Tn = "SelectItem", [sd, Fa] = Lt(Tn), Ha = d.forwardRef(
       disabled: a = !1,
       textValue: o,
       ...i
-    } = n, l = lt(Tn, t), c = ct(Tn, t), u = l.value === s, [h, A] = d.useState(o ?? ""), [p, k] = d.useState(!1), v = Se(
+    } = n, l = lt(Tn, t), c = ct(Tn, t), u = l.value === s, [h, A] = d.useState(o ?? ""), [p, k] = d.useState(!1), f = Se(
       e,
-      (B) => {
+      (b) => {
         var I;
-        return (I = c.itemRefCallback) == null ? void 0 : I.call(c, B, s, a);
+        return (I = c.itemRefCallback) == null ? void 0 : I.call(c, b, s, a);
       }
-    ), m = js(), f = d.useRef("touch"), E = () => {
+    ), m = js(), C = d.useRef("touch"), E = () => {
       a || (l.onValueChange(s), l.onOpenChange(!1));
     };
     if (s === "")
@@ -585,8 +585,8 @@ var Tn = "SelectItem", [sd, Fa] = Lt(Tn), Ha = d.forwardRef(
         disabled: a,
         textId: m,
         isSelected: u,
-        onItemTextChange: d.useCallback((B) => {
-          A((I) => I || ((B == null ? void 0 : B.textContent) ?? "").trim());
+        onItemTextChange: d.useCallback((b) => {
+          A((I) => I || ((b == null ? void 0 : b.textContent) ?? "").trim());
         }, []),
         children: /* @__PURE__ */ r(
           Wn.ItemSlot,
@@ -607,29 +607,29 @@ var Tn = "SelectItem", [sd, Fa] = Lt(Tn), Ha = d.forwardRef(
                 "data-disabled": a ? "" : void 0,
                 tabIndex: a ? void 0 : -1,
                 ...i,
-                ref: v,
+                ref: f,
                 onFocus: ie(i.onFocus, () => k(!0)),
                 onBlur: ie(i.onBlur, () => k(!1)),
                 onClick: ie(i.onClick, () => {
-                  f.current !== "mouse" && E();
+                  C.current !== "mouse" && E();
                 }),
                 onPointerUp: ie(i.onPointerUp, () => {
-                  f.current === "mouse" && E();
+                  C.current === "mouse" && E();
                 }),
-                onPointerDown: ie(i.onPointerDown, (B) => {
-                  f.current = B.pointerType;
+                onPointerDown: ie(i.onPointerDown, (b) => {
+                  C.current = b.pointerType;
                 }),
-                onPointerMove: ie(i.onPointerMove, (B) => {
+                onPointerMove: ie(i.onPointerMove, (b) => {
                   var I;
-                  f.current = B.pointerType, a ? (I = c.onItemLeave) == null || I.call(c) : f.current === "mouse" && B.currentTarget.focus({ preventScroll: !0 });
+                  C.current = b.pointerType, a ? (I = c.onItemLeave) == null || I.call(c) : C.current === "mouse" && b.currentTarget.focus({ preventScroll: !0 });
                 }),
-                onPointerLeave: ie(i.onPointerLeave, (B) => {
+                onPointerLeave: ie(i.onPointerLeave, (b) => {
                   var I;
-                  B.currentTarget === document.activeElement && ((I = c.onItemLeave) == null || I.call(c));
+                  b.currentTarget === document.activeElement && ((I = c.onItemLeave) == null || I.call(c));
                 }),
-                onKeyDown: ie(i.onKeyDown, (B) => {
+                onKeyDown: ie(i.onKeyDown, (b) => {
                   var S;
-                  ((S = c.searchRef) == null ? void 0 : S.current) !== "" && B.key === " " || (Wc.includes(B.key) && E(), B.key === " " && B.preventDefault());
+                  ((S = c.searchRef) == null ? void 0 : S.current) !== "" && b.key === " " || (Wc.includes(b.key) && E(), b.key === " " && b.preventDefault());
                 })
               }
             )
@@ -647,14 +647,14 @@ var rn = "SelectItemText", ja = d.forwardRef(
       (E) => A(E),
       c.onItemTextChange,
       (E) => {
-        var B;
-        return (B = l.itemTextRefCallback) == null ? void 0 : B.call(l, E, c.value, c.disabled);
+        var b;
+        return (b = l.itemTextRefCallback) == null ? void 0 : b.call(l, E, c.value, c.disabled);
       }
-    ), k = h == null ? void 0 : h.textContent, v = d.useMemo(
+    ), k = h == null ? void 0 : h.textContent, f = d.useMemo(
       () => /* @__PURE__ */ r("option", { value: c.value, disabled: c.disabled, children: k }, c.value),
       [c.disabled, c.value, k]
-    ), { onNativeOptionAdd: m, onNativeOptionRemove: f } = u;
-    return ot(() => (m(v), () => f(v)), [m, f, v]), /* @__PURE__ */ g(pe, { children: [
+    ), { onNativeOptionAdd: m, onNativeOptionRemove: C } = u;
+    return ot(() => (m(f), () => C(f)), [m, C, f]), /* @__PURE__ */ g(pe, { children: [
       /* @__PURE__ */ r(fe.span, { id: c.textId, ...o, ref: p }),
       c.isSelected && i.valueNode && !i.valueNodeHasChildren ? Sa.createPortal(o.children, i.valueNode) : null
     ] });
@@ -836,14 +836,14 @@ var dd = Ia, ud = Ba, Ad = Ra, hd = Na, pd = xa, md = Qa, gd = Pa, fd = za, vd =
       onValueCommit: p = () => {
       },
       inverted: k = !1,
-      form: v,
+      form: f,
       ...m
-    } = n, f = d.useRef(/* @__PURE__ */ new Set()), E = d.useRef(0), I = i === "horizontal" ? Bd : wd, [S = [], b] = xn({
+    } = n, C = d.useRef(/* @__PURE__ */ new Set()), E = d.useRef(0), I = i === "horizontal" ? Bd : wd, [S = [], B] = xn({
       prop: h,
       defaultProp: u,
       onChange: (z) => {
         var U;
-        (U = [...f.current][E.current]) == null || U.focus(), A(z);
+        (U = [...C.current][E.current]) == null || U.focus(), A(z);
       }
     }), w = d.useRef(S);
     function Q(z) {
@@ -859,7 +859,7 @@ var dd = Ia, ud = Ba, Ad = Ra, hd = Na, pd = xa, md = Qa, gd = Pa, fd = za, vd =
     }
     function D(z, M, { commit: U } = { commit: !1 }) {
       const J = Ud(o), x = zd(Math.round((z - s) / o) * o + s, J), L = Qn(x, [s, a]);
-      b((G = []) => {
+      B((G = []) => {
         const Z = xd(G, L, M);
         if (Pd(Z, c * o)) {
           E.current = Z.indexOf(L);
@@ -878,10 +878,10 @@ var dd = Ia, ud = Ba, Ad = Ra, hd = Na, pd = xa, md = Qa, gd = Pa, fd = za, vd =
         min: s,
         max: a,
         valueIndexToChangeRef: E,
-        thumbs: f.current,
+        thumbs: C.current,
         values: S,
         orientation: i,
-        form: v,
+        form: f,
         children: /* @__PURE__ */ r(Ds.Provider, { scope: n.__scopeSlider, children: /* @__PURE__ */ r(Ds.Slot, { scope: n.__scopeSlider, children: /* @__PURE__ */ r(
           I,
           {
@@ -930,10 +930,10 @@ var [no, so] = eo(Vt, {
       onSlideEnd: c,
       onStepKeyDown: u,
       ...h
-    } = n, [A, p] = d.useState(null), k = Se(e, (I) => p(I)), v = d.useRef(void 0), m = ta(a), f = m === "ltr", E = f && !o || !f && o;
-    function B(I) {
-      const S = v.current || A.getBoundingClientRect(), b = [0, S.width], Q = _s(b, E ? [t, s] : [s, t]);
-      return v.current = S, Q(I - S.left);
+    } = n, [A, p] = d.useState(null), k = Se(e, (I) => p(I)), f = d.useRef(void 0), m = ta(a), C = m === "ltr", E = C && !o || !C && o;
+    function b(I) {
+      const S = f.current || A.getBoundingClientRect(), B = [0, S.width], Q = _s(B, E ? [t, s] : [s, t]);
+      return f.current = S, Q(I - S.left);
     }
     return /* @__PURE__ */ r(
       no,
@@ -955,19 +955,19 @@ var [no, so] = eo(Vt, {
               "--radix-slider-thumb-transform": "translateX(-50%)"
             },
             onSlideStart: (I) => {
-              const S = B(I.clientX);
+              const S = b(I.clientX);
               i == null || i(S);
             },
             onSlideMove: (I) => {
-              const S = B(I.clientX);
+              const S = b(I.clientX);
               l == null || l(S);
             },
             onSlideEnd: () => {
-              v.current = void 0, c == null || c();
+              f.current = void 0, c == null || c();
             },
             onStepKeyDown: (I) => {
-              const b = $a[E ? "from-left" : "from-right"].includes(I.key);
-              u == null || u({ event: I, direction: b ? -1 : 1 });
+              const B = $a[E ? "from-left" : "from-right"].includes(I.key);
+              u == null || u({ event: I, direction: B ? -1 : 1 });
             }
           }
         )
@@ -986,9 +986,9 @@ var [no, so] = eo(Vt, {
       onStepKeyDown: c,
       ...u
     } = n, h = d.useRef(null), A = Se(e, h), p = d.useRef(void 0), k = !a;
-    function v(m) {
-      const f = p.current || h.current.getBoundingClientRect(), E = [0, f.height], I = _s(E, k ? [s, t] : [t, s]);
-      return p.current = f, I(m - f.top);
+    function f(m) {
+      const C = p.current || h.current.getBoundingClientRect(), E = [0, C.height], I = _s(E, k ? [s, t] : [t, s]);
+      return p.current = C, I(m - C.top);
     }
     return /* @__PURE__ */ r(
       no,
@@ -1009,12 +1009,12 @@ var [no, so] = eo(Vt, {
               "--radix-slider-thumb-transform": "translateY(50%)"
             },
             onSlideStart: (m) => {
-              const f = v(m.clientY);
-              o == null || o(f);
+              const C = f(m.clientY);
+              o == null || o(C);
             },
             onSlideMove: (m) => {
-              const f = v(m.clientY);
-              i == null || i(f);
+              const C = f(m.clientY);
+              i == null || i(C);
             },
             onSlideEnd: () => {
               p.current = void 0, l == null || l();
@@ -1109,7 +1109,7 @@ var Ps = "SliderThumb", lo = d.forwardRef(
   }
 ), Rd = d.forwardRef(
   (n, e) => {
-    const { __scopeSlider: t, index: s, name: a, ...o } = n, i = qn(Ps, t), l = so(Ps, t), [c, u] = d.useState(null), h = Se(e, (B) => u(B)), A = c ? i.form || !!c.closest("form") : !0, p = rl(c), k = i.values[s], v = k === void 0 ? 0 : uo(k, i.min, i.max), m = Qd(s, i.values.length), f = p == null ? void 0 : p[l.size], E = f ? Dd(f, v, l.direction) : 0;
+    const { __scopeSlider: t, index: s, name: a, ...o } = n, i = qn(Ps, t), l = so(Ps, t), [c, u] = d.useState(null), h = Se(e, (b) => u(b)), A = c ? i.form || !!c.closest("form") : !0, p = rl(c), k = i.values[s], f = k === void 0 ? 0 : uo(k, i.min, i.max), m = Qd(s, i.values.length), C = p == null ? void 0 : p[l.size], E = C ? Dd(C, f, l.direction) : 0;
     return d.useEffect(() => {
       if (c)
         return i.thumbs.add(c), () => {
@@ -1121,7 +1121,7 @@ var Ps = "SliderThumb", lo = d.forwardRef(
         style: {
           transform: "var(--radix-slider-thumb-transform)",
           position: "absolute",
-          [l.startEdge]: `calc(${v}% + ${E}px)`
+          [l.startEdge]: `calc(${f}% + ${E}px)`
         },
         children: [
           /* @__PURE__ */ r(Ds.ItemSlot, { scope: n.__scopeSlider, children: /* @__PURE__ */ r(
@@ -1263,7 +1263,7 @@ var Ao = to, ho = oo, po = io, mo = lo, go = { exports: {} };
   })();
 })(go);
 var Md = go.exports;
-const C = /* @__PURE__ */ Hc(Md), re = { asChild: { type: "boolean" } }, ye = { width: { type: "string", className: "rt-r-w", customProperties: ["--width"], responsive: !0 }, minWidth: { type: "string", className: "rt-r-min-w", customProperties: ["--min-width"], responsive: !0 }, maxWidth: { type: "string", className: "rt-r-max-w", customProperties: ["--max-width"], responsive: !0 } }, qt = { height: { type: "string", className: "rt-r-h", customProperties: ["--height"], responsive: !0 }, minHeight: { type: "string", className: "rt-r-min-h", customProperties: ["--min-height"], responsive: !0 }, maxHeight: { type: "string", className: "rt-r-max-h", customProperties: ["--max-height"], responsive: !0 } }, Od = ["1", "2", "3", "4"], fo = { ...re, align: { type: "enum", className: "rt-r-align", values: ["start", "center"], default: "center" }, size: { type: "enum", className: "rt-r-size", values: Od, default: "3", responsive: !0 }, width: ye.width, minWidth: ye.minWidth, maxWidth: { ...ye.maxWidth, default: "600px" }, ...qt }, vo = ["gray", "gold", "bronze", "brown", "yellow", "amber", "orange", "tomato", "red", "ruby", "crimson", "pink", "plum", "purple", "violet", "iris", "indigo", "blue", "cyan", "teal", "jade", "green", "grass", "lime", "mint", "sky"], we = { color: { type: "enum", values: vo, default: void 0 } }, Kt = { color: { type: "enum", values: vo, default: "" } }, Ie = { highContrast: { type: "boolean", className: "rt-high-contrast", default: void 0 } }, Fd = ["normal", "start", "end", "both"], Kn = { trim: { type: "enum", className: "rt-r-lt", values: Fd, responsive: !0 } }, Hd = ["left", "center", "right"], Co = { align: { type: "enum", className: "rt-r-ta", values: Hd, responsive: !0 } }, jd = ["wrap", "nowrap", "pretty", "balance"], Nt = { wrap: { type: "enum", className: "rt-r-tw", values: jd, responsive: !0 } }, xt = { truncate: { type: "boolean", className: "rt-truncate" } }, Wd = ["light", "regular", "medium", "bold"], Gn = { weight: { type: "enum", className: "rt-r-weight", values: Wd, responsive: !0 } }, Ld = ["h1", "h2", "h3", "h4", "h5", "h6"], Vd = ["1", "2", "3", "4", "5", "6", "7", "8", "9"], qd = { as: { type: "enum", values: Ld, default: "h1" }, ...re, size: { type: "enum", className: "rt-r-size", values: Vd, default: "6", responsive: !0 }, ...Gn, ...Co, ...Kn, ...xt, ...Nt, ...we, ...Ie }, $s = ["initial", "xs", "sm", "md", "lg", "xl"];
+const v = /* @__PURE__ */ Hc(Md), re = { asChild: { type: "boolean" } }, ye = { width: { type: "string", className: "rt-r-w", customProperties: ["--width"], responsive: !0 }, minWidth: { type: "string", className: "rt-r-min-w", customProperties: ["--min-width"], responsive: !0 }, maxWidth: { type: "string", className: "rt-r-max-w", customProperties: ["--max-width"], responsive: !0 } }, qt = { height: { type: "string", className: "rt-r-h", customProperties: ["--height"], responsive: !0 }, minHeight: { type: "string", className: "rt-r-min-h", customProperties: ["--min-height"], responsive: !0 }, maxHeight: { type: "string", className: "rt-r-max-h", customProperties: ["--max-height"], responsive: !0 } }, Od = ["1", "2", "3", "4"], fo = { ...re, align: { type: "enum", className: "rt-r-align", values: ["start", "center"], default: "center" }, size: { type: "enum", className: "rt-r-size", values: Od, default: "3", responsive: !0 }, width: ye.width, minWidth: ye.minWidth, maxWidth: { ...ye.maxWidth, default: "600px" }, ...qt }, vo = ["gray", "gold", "bronze", "brown", "yellow", "amber", "orange", "tomato", "red", "ruby", "crimson", "pink", "plum", "purple", "violet", "iris", "indigo", "blue", "cyan", "teal", "jade", "green", "grass", "lime", "mint", "sky"], we = { color: { type: "enum", values: vo, default: void 0 } }, Kt = { color: { type: "enum", values: vo, default: "" } }, Ie = { highContrast: { type: "boolean", className: "rt-high-contrast", default: void 0 } }, Fd = ["normal", "start", "end", "both"], Kn = { trim: { type: "enum", className: "rt-r-lt", values: Fd, responsive: !0 } }, Hd = ["left", "center", "right"], Co = { align: { type: "enum", className: "rt-r-ta", values: Hd, responsive: !0 } }, jd = ["wrap", "nowrap", "pretty", "balance"], Nt = { wrap: { type: "enum", className: "rt-r-tw", values: jd, responsive: !0 } }, xt = { truncate: { type: "boolean", className: "rt-truncate" } }, Wd = ["light", "regular", "medium", "bold"], Gn = { weight: { type: "enum", className: "rt-r-weight", values: Wd, responsive: !0 } }, Ld = ["h1", "h2", "h3", "h4", "h5", "h6"], Vd = ["1", "2", "3", "4", "5", "6", "7", "8", "9"], qd = { as: { type: "enum", values: Ld, default: "h1" }, ...re, size: { type: "enum", className: "rt-r-size", values: Vd, default: "6", responsive: !0 }, ...Gn, ...Co, ...Kn, ...xt, ...Nt, ...we, ...Ie }, $s = ["initial", "xs", "sm", "md", "lg", "xl"];
 function yo(n, e) {
   return Object.prototype.hasOwnProperty.call(n, e);
 }
@@ -1340,30 +1340,30 @@ function F(n, ...e) {
       if (!l || on(l) && !u) continue;
       if (on(l) && (c.default !== void 0 && l.initial === void 0 && (l.initial = c.default), c.type === "enum" && ([c.default, ...c.values].includes(l.initial) || (l.initial = c.default))), c.type === "enum") {
         const h = dn({ allowArbitraryValues: !1, value: l, className: c.className, propValues: c.values, parseValue: c.parseValue });
-        t = C(t, h);
+        t = v(t, h);
         continue;
       }
       if (c.type === "string" || c.type === "enum | string") {
         const h = c.type === "string" ? [] : c.values, [A, p] = nt({ className: c.className, customProperties: c.customProperties, propValues: h, parseValue: c.parseValue, value: l });
-        s = un(s, p), t = C(t, A);
+        s = un(s, p), t = v(t, A);
         continue;
       }
       if (c.type === "boolean" && l) {
-        t = C(t, c.className);
+        t = v(t, c.className);
         continue;
       }
     }
   }
-  return a.className = C(t, n.className), a.style = un(s, n.style), a;
+  return a.className = v(t, n.className), a.style = un(s, n.style), a;
 }
 const pt = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "-1", "-2", "-3", "-4", "-5", "-6", "-7", "-8", "-9"], X = { m: { type: "enum | string", values: pt, responsive: !0, className: "rt-r-m", customProperties: ["--m"] }, mx: { type: "enum | string", values: pt, responsive: !0, className: "rt-r-mx", customProperties: ["--ml", "--mr"] }, my: { type: "enum | string", values: pt, responsive: !0, className: "rt-r-my", customProperties: ["--mt", "--mb"] }, mt: { type: "enum | string", values: pt, responsive: !0, className: "rt-r-mt", customProperties: ["--mt"] }, mr: { type: "enum | string", values: pt, responsive: !0, className: "rt-r-mr", customProperties: ["--mr"] }, mb: { type: "enum | string", values: pt, responsive: !0, className: "rt-r-mb", customProperties: ["--mb"] }, ml: { type: "enum | string", values: pt, responsive: !0, className: "rt-r-ml", customProperties: ["--ml"] } }, Xn = d.forwardRef((n, e) => {
   const { children: t, className: s, asChild: a, as: o = "h1", color: i, ...l } = F(n, qd, X);
-  return d.createElement(ve, { "data-accent-color": i, ...l, ref: e, className: C("rt-Heading", s) }, a ? t : d.createElement(o, null, t));
+  return d.createElement(ve, { "data-accent-color": i, ...l, ref: e, className: v("rt-Heading", s) }, a ? t : d.createElement(o, null, t));
 });
 Xn.displayName = "Heading";
 const Xd = ["span", "div", "label", "p"], Yd = ["1", "2", "3", "4", "5", "6", "7", "8", "9"], Zd = { as: { type: "enum", values: Xd, default: "span" }, ...re, size: { type: "enum", className: "rt-r-size", values: Yd, responsive: !0 }, ...Gn, ...Co, ...Kn, ...xt, ...Nt, ...we, ...Ie }, P = d.forwardRef((n, e) => {
   const { children: t, className: s, asChild: a, as: o = "span", color: i, ...l } = F(n, Zd, X);
-  return d.createElement(ve, { "data-accent-color": i, ...l, ref: e, className: C("rt-Text", s) }, a ? t : d.createElement(o, null, t));
+  return d.createElement(ve, { "data-accent-color": i, ...l, ref: e, className: v("rt-Text", s) }, a ? t : d.createElement(o, null, t));
 });
 P.displayName = "Text";
 function _d(n) {
@@ -1416,19 +1416,19 @@ const ko = d.forwardRef((n, e) => {
   d.useEffect(() => A(t), [t]);
   const [p, k] = d.useState(s);
   d.useEffect(() => k(s), [s]);
-  const [v, m] = d.useState(a);
+  const [f, m] = d.useState(a);
   d.useEffect(() => m(a), [a]);
-  const [f, E] = d.useState(o);
+  const [C, E] = d.useState(o);
   d.useEffect(() => E(o), [o]);
-  const [B, I] = d.useState(i);
+  const [b, I] = d.useState(i);
   d.useEffect(() => I(i), [i]);
-  const [S, b] = d.useState(l);
-  return d.useEffect(() => b(l), [l]), d.createElement(er, { ...u, ref: e, isRoot: !0, hasBackground: c, appearance: h, accentColor: p, grayColor: v, panelBackground: f, radius: B, scaling: S, onAppearanceChange: A, onAccentColorChange: k, onGrayColorChange: m, onPanelBackgroundChange: E, onRadiusChange: I, onScalingChange: b });
+  const [S, B] = d.useState(l);
+  return d.useEffect(() => B(l), [l]), d.createElement(er, { ...u, ref: e, isRoot: !0, hasBackground: c, appearance: h, accentColor: p, grayColor: f, panelBackground: C, radius: b, scaling: S, onAppearanceChange: A, onAccentColorChange: k, onGrayColorChange: m, onPanelBackgroundChange: E, onRadiusChange: I, onScalingChange: B });
 });
 ko.displayName = "ThemeRoot";
 const er = d.forwardRef((n, e) => {
-  const t = d.useContext(Dn), { asChild: s, isRoot: a, hasBackground: o, appearance: i = (t == null ? void 0 : t.appearance) ?? Je.appearance.default, accentColor: l = (t == null ? void 0 : t.accentColor) ?? Je.accentColor.default, grayColor: c = (t == null ? void 0 : t.resolvedGrayColor) ?? Je.grayColor.default, panelBackground: u = (t == null ? void 0 : t.panelBackground) ?? Je.panelBackground.default, radius: h = (t == null ? void 0 : t.radius) ?? Je.radius.default, scaling: A = (t == null ? void 0 : t.scaling) ?? Je.scaling.default, onAppearanceChange: p = Tt, onAccentColorChange: k = Tt, onGrayColorChange: v = Tt, onPanelBackgroundChange: m = Tt, onRadiusChange: f = Tt, onScalingChange: E = Tt, ...B } = n, I = s ? ve : "div", S = c === "auto" ? _d(l) : c, b = n.appearance === "light" || n.appearance === "dark", w = o === void 0 ? a || b : o;
-  return d.createElement(Dn.Provider, { value: d.useMemo(() => ({ appearance: i, accentColor: l, grayColor: c, resolvedGrayColor: S, panelBackground: u, radius: h, scaling: A, onAppearanceChange: p, onAccentColorChange: k, onGrayColorChange: v, onPanelBackgroundChange: m, onRadiusChange: f, onScalingChange: E }), [i, l, c, S, u, h, A, p, k, v, m, f, E]) }, d.createElement(I, { "data-is-root-theme": a ? "true" : "false", "data-accent-color": l, "data-gray-color": S, "data-has-background": w ? "true" : "false", "data-panel-background": u, "data-radius": h, "data-scaling": A, ref: e, ...B, className: C("radix-themes", { light: i === "light", dark: i === "dark" }, B.className) }));
+  const t = d.useContext(Dn), { asChild: s, isRoot: a, hasBackground: o, appearance: i = (t == null ? void 0 : t.appearance) ?? Je.appearance.default, accentColor: l = (t == null ? void 0 : t.accentColor) ?? Je.accentColor.default, grayColor: c = (t == null ? void 0 : t.resolvedGrayColor) ?? Je.grayColor.default, panelBackground: u = (t == null ? void 0 : t.panelBackground) ?? Je.panelBackground.default, radius: h = (t == null ? void 0 : t.radius) ?? Je.radius.default, scaling: A = (t == null ? void 0 : t.scaling) ?? Je.scaling.default, onAppearanceChange: p = Tt, onAccentColorChange: k = Tt, onGrayColorChange: f = Tt, onPanelBackgroundChange: m = Tt, onRadiusChange: C = Tt, onScalingChange: E = Tt, ...b } = n, I = s ? ve : "div", S = c === "auto" ? _d(l) : c, B = n.appearance === "light" || n.appearance === "dark", w = o === void 0 ? a || B : o;
+  return d.createElement(Dn.Provider, { value: d.useMemo(() => ({ appearance: i, accentColor: l, grayColor: c, resolvedGrayColor: S, panelBackground: u, radius: h, scaling: A, onAppearanceChange: p, onAccentColorChange: k, onGrayColorChange: f, onPanelBackgroundChange: m, onRadiusChange: C, onScalingChange: E }), [i, l, c, S, u, h, A, p, k, f, m, C, E]) }, d.createElement(I, { "data-is-root-theme": a ? "true" : "false", "data-accent-color": l, "data-gray-color": S, "data-has-background": w ? "true" : "false", "data-panel-background": u, "data-radius": h, "data-scaling": A, ref: e, ...b, className: v("radix-themes", { light: i === "light", dark: i === "dark" }, b.className) }));
 });
 er.displayName = "ThemeImpl";
 const ut = (n) => {
@@ -1440,7 +1440,7 @@ const So = d.forwardRef(({ children: n, ...e }, t) => d.createElement(pl, { ...e
 So.displayName = "AlertDialog.Trigger";
 const Io = d.forwardRef(({ align: n, ...e }, t) => {
   const { align: s, ...a } = fo, { className: o } = F({ align: n }, { align: s }), { className: i, forceMount: l, container: c, ...u } = F(e, a);
-  return d.createElement(ll, { container: c, forceMount: l }, d.createElement(dt, { asChild: !0 }, d.createElement(cl, { className: "rt-BaseDialogOverlay rt-AlertDialogOverlay" }, d.createElement("div", { className: "rt-BaseDialogScroll rt-AlertDialogScroll" }, d.createElement("div", { className: `rt-BaseDialogScrollPadding rt-AlertDialogScrollPadding ${o}` }, d.createElement(dl, { ...u, ref: t, className: C("rt-BaseDialogContent", "rt-AlertDialogContent", i) }))))));
+  return d.createElement(ll, { container: c, forceMount: l }, d.createElement(dt, { asChild: !0 }, d.createElement(cl, { className: "rt-BaseDialogOverlay rt-AlertDialogOverlay" }, d.createElement("div", { className: "rt-BaseDialogScroll rt-AlertDialogScroll" }, d.createElement("div", { className: `rt-BaseDialogScrollPadding rt-AlertDialogScrollPadding ${o}` }, d.createElement(dl, { ...u, ref: t, className: v("rt-BaseDialogContent", "rt-AlertDialogContent", i) }))))));
 });
 Io.displayName = "AlertDialog.Content";
 const bo = d.forwardRef((n, e) => d.createElement(hl, { asChild: !0 }, d.createElement(Xn, { size: "5", mb: "3", trim: "start", ...n, asChild: !1, ref: e })));
@@ -1469,12 +1469,12 @@ function tr(n, e) {
 }
 const We = d.forwardRef((n, e) => {
   const { asChild: t, children: s, className: a, style: o, color: i, radius: l, ...c } = F(n, su, X);
-  return d.createElement(gl, { "data-accent-color": i, "data-radius": l, className: C("rt-reset", "rt-AvatarRoot", a), style: o, asChild: t }, tr({ asChild: t, children: s }, d.createElement(No, { ref: e, ...c })));
+  return d.createElement(gl, { "data-accent-color": i, "data-radius": l, className: v("rt-reset", "rt-AvatarRoot", a), style: o, asChild: t }, tr({ asChild: t, children: s }, d.createElement(No, { ref: e, ...c })));
 });
 We.displayName = "Avatar";
 const No = d.forwardRef(({ fallback: n, ...e }, t) => {
   const [s, a] = d.useState("idle");
-  return d.createElement(d.Fragment, null, s === "idle" || s === "loading" ? d.createElement("span", { className: "rt-AvatarFallback" }) : null, s === "error" ? d.createElement(fl, { className: C("rt-AvatarFallback", { "rt-one-letter": typeof n == "string" && n.length === 1, "rt-two-letters": typeof n == "string" && n.length === 2 }), delayMs: 0 }, n) : null, d.createElement(vl, { ref: t, className: "rt-AvatarImage", ...e, onLoadingStatusChange: (o) => {
+  return d.createElement(d.Fragment, null, s === "idle" || s === "loading" ? d.createElement("span", { className: "rt-AvatarFallback" }) : null, s === "error" ? d.createElement(fl, { className: v("rt-AvatarFallback", { "rt-one-letter": typeof n == "string" && n.length === 1, "rt-two-letters": typeof n == "string" && n.length === 2 }), delayMs: 0 }, n) : null, d.createElement(vl, { ref: t, className: "rt-AvatarImage", ...e, onLoadingStatusChange: (o) => {
     var i;
     (i = e.onLoadingStatusChange) == null || i.call(e, o), a(o);
   } }));
@@ -1482,17 +1482,17 @@ const No = d.forwardRef(({ fallback: n, ...e }, t) => {
 No.displayName = "AvatarImpl";
 const ru = ["1", "2", "3"], au = ["solid", "soft", "surface", "outline"], ou = { ...re, size: { type: "enum", className: "rt-r-size", values: ru, default: "1", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: au, default: "soft" }, ...Kt, ...Ie, ...Le }, nr = d.forwardRef((n, e) => {
   const { asChild: t, className: s, color: a, radius: o, ...i } = F(n, ou, X), l = t ? ve : "span";
-  return d.createElement(l, { "data-accent-color": a, "data-radius": o, ...i, ref: e, className: C("rt-reset", "rt-Badge", s) });
+  return d.createElement(l, { "data-accent-color": a, "data-radius": o, ...i, ref: e, className: v("rt-reset", "rt-Badge", s) });
 });
 nr.displayName = "Badge";
 const iu = d.forwardRef((n, e) => {
   const { asChild: t, children: s, className: a, ...o } = n, i = t ? ve : "blockquote";
-  return d.createElement(P, { asChild: !0, ...o, ref: e, className: C("rt-Blockquote", a) }, d.createElement(i, null, s));
+  return d.createElement(P, { asChild: !0, ...o, ref: e, className: v("rt-Blockquote", a) }, d.createElement(i, null, s));
 });
 iu.displayName = "Blockquote";
 const sr = ve, lu = ["div", "span"], cu = ["none", "inline", "inline-block", "block", "contents"], du = { as: { type: "enum", values: lu, default: "div" }, ...re, display: { type: "enum", className: "rt-r-display", values: cu, responsive: !0 } }, mt = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], ln = { p: { type: "enum | string", className: "rt-r-p", customProperties: ["--p"], values: mt, responsive: !0 }, px: { type: "enum | string", className: "rt-r-px", customProperties: ["--pl", "--pr"], values: mt, responsive: !0 }, py: { type: "enum | string", className: "rt-r-py", customProperties: ["--pt", "--pb"], values: mt, responsive: !0 }, pt: { type: "enum | string", className: "rt-r-pt", customProperties: ["--pt"], values: mt, responsive: !0 }, pr: { type: "enum | string", className: "rt-r-pr", customProperties: ["--pr"], values: mt, responsive: !0 }, pb: { type: "enum | string", className: "rt-r-pb", customProperties: ["--pb"], values: mt, responsive: !0 }, pl: { type: "enum | string", className: "rt-r-pl", customProperties: ["--pl"], values: mt, responsive: !0 } }, ds = ["visible", "hidden", "clip", "scroll", "auto"], uu = ["static", "relative", "absolute", "fixed", "sticky"], Xt = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "-1", "-2", "-3", "-4", "-5", "-6", "-7", "-8", "-9"], Au = ["0", "1"], hu = ["0", "1"], pn = { ...ln, ...ye, ...qt, position: { type: "enum", className: "rt-r-position", values: uu, responsive: !0 }, inset: { type: "enum | string", className: "rt-r-inset", customProperties: ["--inset"], values: Xt, responsive: !0 }, top: { type: "enum | string", className: "rt-r-top", customProperties: ["--top"], values: Xt, responsive: !0 }, right: { type: "enum | string", className: "rt-r-right", customProperties: ["--right"], values: Xt, responsive: !0 }, bottom: { type: "enum | string", className: "rt-r-bottom", customProperties: ["--bottom"], values: Xt, responsive: !0 }, left: { type: "enum | string", className: "rt-r-left", customProperties: ["--left"], values: Xt, responsive: !0 }, overflow: { type: "enum", className: "rt-r-overflow", values: ds, responsive: !0 }, overflowX: { type: "enum", className: "rt-r-ox", values: ds, responsive: !0 }, overflowY: { type: "enum", className: "rt-r-oy", values: ds, responsive: !0 }, flexBasis: { type: "string", className: "rt-r-fb", customProperties: ["--flex-basis"], responsive: !0 }, flexShrink: { type: "enum | string", className: "rt-r-fs", customProperties: ["--flex-shrink"], values: Au, responsive: !0 }, flexGrow: { type: "enum | string", className: "rt-r-fg", customProperties: ["--flex-grow"], values: hu, responsive: !0 }, gridArea: { type: "string", className: "rt-r-ga", customProperties: ["--grid-area"], responsive: !0 }, gridColumn: { type: "string", className: "rt-r-gc", customProperties: ["--grid-column"], responsive: !0 }, gridColumnStart: { type: "string", className: "rt-r-gcs", customProperties: ["--grid-column-start"], responsive: !0 }, gridColumnEnd: { type: "string", className: "rt-r-gce", customProperties: ["--grid-column-end"], responsive: !0 }, gridRow: { type: "string", className: "rt-r-gr", customProperties: ["--grid-row"], responsive: !0 }, gridRowStart: { type: "string", className: "rt-r-grs", customProperties: ["--grid-row-start"], responsive: !0 }, gridRowEnd: { type: "string", className: "rt-r-gre", customProperties: ["--grid-row-end"], responsive: !0 } }, he = d.forwardRef((n, e) => {
   const { className: t, asChild: s, as: a = "div", ...o } = F(n, du, pn, X);
-  return d.createElement(s ? sr : a, { ...o, ref: e, className: C("rt-Box", t) });
+  return d.createElement(s ? sr : a, { ...o, ref: e, className: v("rt-Box", t) });
 });
 he.displayName = "Box";
 const pu = ["1", "2", "3", "4"], mu = ["classic", "solid", "soft", "surface", "outline", "ghost"], Tr = { ...re, size: { type: "enum", className: "rt-r-size", values: pu, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: mu, default: "solid" }, ...Kt, ...Ie, ...Le, loading: { type: "boolean", className: "rt-loading", default: !1 } }, us = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], xo = { gap: { type: "enum | string", className: "rt-r-gap", customProperties: ["--gap"], values: us, responsive: !0 }, gapX: { type: "enum | string", className: "rt-r-cg", customProperties: ["--column-gap"], values: us, responsive: !0 }, gapY: { type: "enum | string", className: "rt-r-rg", customProperties: ["--row-gap"], values: us, responsive: !0 } }, gu = ["div", "span"], fu = ["none", "inline-flex", "flex"], vu = ["row", "column", "row-reverse", "column-reverse"], Cu = ["start", "center", "end", "baseline", "stretch"], yu = ["start", "center", "end", "between"], ku = ["nowrap", "wrap", "wrap-reverse"], Qo = { as: { type: "enum", values: gu, default: "div" }, ...re, display: { type: "enum", className: "rt-r-display", values: fu, responsive: !0 }, direction: { type: "enum", className: "rt-r-fd", values: vu, responsive: !0 }, align: { type: "enum", className: "rt-r-ai", values: Cu, responsive: !0 }, justify: { type: "enum", className: "rt-r-jc", values: yu, parseValue: Eu, responsive: !0 }, wrap: { type: "enum", className: "rt-r-fw", values: ku, responsive: !0 }, ...xo };
@@ -1501,13 +1501,13 @@ function Eu(n) {
 }
 const y = d.forwardRef((n, e) => {
   const { className: t, asChild: s, as: a = "div", ...o } = F(n, Qo, pn, X);
-  return d.createElement(s ? sr : a, { ...o, ref: e, className: C("rt-Flex", t) });
+  return d.createElement(s ? sr : a, { ...o, ref: e, className: v("rt-Flex", t) });
 });
 y.displayName = "Flex";
 const Su = ["1", "2", "3"], Iu = { size: { type: "enum", className: "rt-r-size", values: Su, default: "2", responsive: !0 }, loading: { type: "boolean", default: !0 } }, rr = d.forwardRef((n, e) => {
   const { className: t, children: s, loading: a, ...o } = F(n, Iu, X);
   if (!a) return s;
-  const i = d.createElement("span", { ...o, ref: e, className: C("rt-Spinner", t) }, d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }));
+  const i = d.createElement("span", { ...o, ref: e, className: v("rt-Spinner", t) }, d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }));
   return s === void 0 ? i : d.createElement(y, { asChild: !0, position: "relative", align: "center", justify: "center" }, d.createElement("span", null, d.createElement("span", { "aria-hidden": !0, style: { display: "contents", visibility: "hidden" }, inert: void 0 }, s), d.createElement(y, { asChild: !0, align: "center", justify: "center", position: "absolute", inset: "0" }, d.createElement("span", null, i))));
 });
 rr.displayName = "Spinner";
@@ -1531,26 +1531,26 @@ function wu(n) {
 }
 const ar = d.forwardRef((n, e) => {
   const { size: t = Tr.size.default } = n, { className: s, children: a, asChild: o, color: i, radius: l, disabled: c = n.loading, ...u } = F(n, Tr, X), h = o ? ve : "button";
-  return d.createElement(h, { "data-disabled": c || void 0, "data-accent-color": i, "data-radius": l, ...u, ref: e, className: C("rt-reset", "rt-BaseButton", s), disabled: c }, n.loading ? d.createElement(d.Fragment, null, d.createElement("span", { style: { display: "contents", visibility: "hidden" }, "aria-hidden": !0 }, a), d.createElement(bu, null, a), d.createElement(y, { asChild: !0, align: "center", justify: "center", position: "absolute", inset: "0" }, d.createElement("span", null, d.createElement(rr, { size: To(t, wu) })))) : a);
+  return d.createElement(h, { "data-disabled": c || void 0, "data-accent-color": i, "data-radius": l, ...u, ref: e, className: v("rt-reset", "rt-BaseButton", s), disabled: c }, n.loading ? d.createElement(d.Fragment, null, d.createElement("span", { style: { display: "contents", visibility: "hidden" }, "aria-hidden": !0 }, a), d.createElement(bu, null, a), d.createElement(y, { asChild: !0, align: "center", justify: "center", position: "absolute", inset: "0" }, d.createElement("span", null, d.createElement(rr, { size: To(t, wu) })))) : a);
 });
 ar.displayName = "BaseButton";
-const Do = d.forwardRef(({ className: n, ...e }, t) => d.createElement(ar, { ...e, ref: t, className: C("rt-Button", n) }));
+const Do = d.forwardRef(({ className: n, ...e }, t) => d.createElement(ar, { ...e, ref: t, className: v("rt-Button", n) }));
 Do.displayName = "Button";
 const Ru = ["1", "2", "3"], Nu = ["soft", "surface", "outline"], Dr = { ...re, size: { type: "enum", className: "rt-r-size", values: Ru, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: Nu, default: "soft" }, ...Kt, ...Ie }, Jo = d.createContext({}), or = d.forwardRef((n, e) => {
   const { size: t = Dr.size.default } = n, { asChild: s, children: a, className: o, color: i, ...l } = F(n, Dr, X), c = s ? ve : "div";
-  return d.createElement(c, { "data-accent-color": i, ...l, className: C("rt-CalloutRoot", o), ref: e }, d.createElement(Jo.Provider, { value: d.useMemo(() => ({ size: t }), [t]) }, a));
+  return d.createElement(c, { "data-accent-color": i, ...l, className: v("rt-CalloutRoot", o), ref: e }, d.createElement(Jo.Provider, { value: d.useMemo(() => ({ size: t }), [t]) }, a));
 });
 or.displayName = "Callout.Root";
-const ir = d.forwardRef(({ className: n, ...e }, t) => d.createElement("div", { ...e, className: C("rt-CalloutIcon", n), ref: t }));
+const ir = d.forwardRef(({ className: n, ...e }, t) => d.createElement("div", { ...e, className: v("rt-CalloutIcon", n), ref: t }));
 ir.displayName = "Callout.Icon";
 const lr = d.forwardRef(({ className: n, ...e }, t) => {
   const { size: s } = d.useContext(Jo);
-  return d.createElement(P, { as: "p", size: To(s, Bu), ...e, asChild: !1, ref: t, className: C("rt-CalloutText", n) });
+  return d.createElement(P, { as: "p", size: To(s, Bu), ...e, asChild: !1, ref: t, className: v("rt-CalloutText", n) });
 });
 lr.displayName = "Callout.Text";
 const xu = ["1", "2", "3", "4", "5"], Qu = ["surface", "classic", "ghost"], Tu = { ...re, size: { type: "enum", className: "rt-r-size", values: xu, default: "1", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: Qu, default: "surface" } }, cr = d.forwardRef((n, e) => {
   const { asChild: t, className: s, ...a } = F(n, Tu, X), o = t ? ve : "div";
-  return d.createElement(o, { ref: e, ...a, className: C("rt-reset", "rt-BaseCard", "rt-Card", s) });
+  return d.createElement(o, { ref: e, ...a, className: v("rt-reset", "rt-BaseCard", "rt-Card", s) });
 });
 cr.displayName = "Card";
 const Du = ["div", "span"], Ju = ["none", "inline-grid", "grid"], Pu = ["1", "2", "3", "4", "5", "6", "7", "8", "9"], Uu = ["1", "2", "3", "4", "5", "6", "7", "8", "9"], zu = ["row", "column", "dense", "row-dense", "column-dense"], Mu = ["start", "center", "end", "baseline", "stretch"], Ou = ["start", "center", "end", "between"], Jn = { as: { type: "enum", values: Du, default: "div" }, ...re, display: { type: "enum", className: "rt-r-display", values: Ju, responsive: !0 }, areas: { type: "string", className: "rt-r-gta", customProperties: ["--grid-template-areas"], responsive: !0 }, columns: { type: "enum | string", className: "rt-r-gtc", customProperties: ["--grid-template-columns"], values: Pu, parseValue: Jr, responsive: !0 }, rows: { type: "enum | string", className: "rt-r-gtr", customProperties: ["--grid-template-rows"], values: Uu, parseValue: Jr, responsive: !0 }, flow: { type: "enum", className: "rt-r-gaf", values: zu, responsive: !0 }, align: { type: "enum", className: "rt-r-ai", values: Mu, responsive: !0 }, justify: { type: "enum", className: "rt-r-jc", values: Ou, parseValue: Fu, responsive: !0 }, ...xo };
@@ -1562,7 +1562,7 @@ function Fu(n) {
 }
 const Po = d.forwardRef((n, e) => {
   const { className: t, asChild: s, as: a = "div", ...o } = F(n, Jn, pn, X);
-  return d.createElement(s ? sr : a, { ...o, ref: e, className: C("rt-Grid", t) });
+  return d.createElement(s ? sr : a, { ...o, ref: e, className: v("rt-Grid", t) });
 });
 Po.displayName = "Grid";
 const Hu = ge.forwardRef((n, e) => ge.createElement("svg", { width: "9", height: "9", viewBox: "0 0 9 9", fill: "currentcolor", xmlns: "http://www.w3.org/2000/svg", ...n, ref: e }, ge.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.75 4.5C0.75 4.08579 1.08579 3.75 1.5 3.75H7.5C7.91421 3.75 8.25 4.08579 8.25 4.5C8.25 4.91421 7.91421 5.25 7.5 5.25H1.5C1.08579 5.25 0.75 4.91421 0.75 4.5Z" })));
@@ -1575,7 +1575,7 @@ const ju = ge.forwardRef((n, e) => ge.createElement("svg", { width: "9", height:
 ju.displayName = "ThickChevronRightIcon";
 const Wu = ["1", "2", "3", "4", "5", "6", "7", "8", "9"], Lu = ["solid", "soft", "outline", "ghost"], Vu = { ...re, size: { type: "enum", className: "rt-r-size", values: Wu, responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: Lu, default: "soft" }, ...Gn, ...Kt, ...Ie, ...xt, ...Nt }, qu = d.forwardRef((n, e) => {
   const { asChild: t, className: s, color: a, ...o } = F(n, Vu, X), i = n.variant === "ghost" ? a || void 0 : a, l = t ? ve : "code";
-  return d.createElement(l, { "data-accent-color": i, ...o, ref: e, className: C("rt-reset", "rt-Code", s) });
+  return d.createElement(l, { "data-accent-color": i, ...o, ref: e, className: v("rt-reset", "rt-Code", s) });
 });
 qu.displayName = "Code";
 const Ku = ["1", "2", "3", "4"], Gu = ["none", "initial"], Xu = ["left", "center", "right"], Yu = { ...re, size: { type: "enum", className: "rt-r-size", values: Ku, default: "4", responsive: !0 }, display: { type: "enum", className: "rt-r-display", values: Gu, parseValue: Zu, responsive: !0 }, align: { type: "enum", className: "rt-r-ai", values: Xu, parseValue: _u, responsive: !0 } };
@@ -1586,8 +1586,8 @@ function _u(n) {
   return n === "left" ? "start" : n === "right" ? "end" : n;
 }
 const $u = d.forwardRef(({ width: n, minWidth: e, maxWidth: t, height: s, minHeight: a, maxHeight: o, ...i }, l) => {
-  const { asChild: c, children: u, className: h, ...A } = F(i, Yu, pn, X), { className: p, style: k } = F({ width: n, minWidth: e, maxWidth: t, height: s, minHeight: a, maxHeight: o }, ye, qt), v = c ? ve : "div";
-  return d.createElement(v, { ...A, ref: l, className: C("rt-Container", h) }, tr({ asChild: c, children: u }, (m) => d.createElement("div", { className: C("rt-ContainerInner", p), style: k }, m)));
+  const { asChild: c, children: u, className: h, ...A } = F(i, Yu, pn, X), { className: p, style: k } = F({ width: n, minWidth: e, maxWidth: t, height: s, minHeight: a, maxHeight: o }, ye, qt), f = c ? ve : "div";
+  return d.createElement(f, { ...A, ref: l, className: v("rt-Container", h) }, tr({ asChild: c, children: u }, (m) => d.createElement("div", { className: v("rt-ContainerInner", p), style: k }, m)));
 });
 $u.displayName = "Container";
 const eA = ["1", "2", "3"], Yt = { ...re, size: { values: eA, default: "1" }, ...Le, scrollbars: { default: "both" } };
@@ -1597,30 +1597,30 @@ function tA(n) {
 }
 const gt = X.m.values;
 function nA(n) {
-  const [e, t] = nt({ className: "rt-r-m", customProperties: ["--margin"], propValues: gt, value: n.m }), [s, a] = nt({ className: "rt-r-mx", customProperties: ["--margin-left", "--margin-right"], propValues: gt, value: n.mx }), [o, i] = nt({ className: "rt-r-my", customProperties: ["--margin-top", "--margin-bottom"], propValues: gt, value: n.my }), [l, c] = nt({ className: "rt-r-mt", customProperties: ["--margin-top"], propValues: gt, value: n.mt }), [u, h] = nt({ className: "rt-r-mr", customProperties: ["--margin-right"], propValues: gt, value: n.mr }), [A, p] = nt({ className: "rt-r-mb", customProperties: ["--margin-bottom"], propValues: gt, value: n.mb }), [k, v] = nt({ className: "rt-r-ml", customProperties: ["--margin-left"], propValues: gt, value: n.ml });
-  return [C(e, s, o, l, u, A, k), un(t, a, i, c, h, p, v)];
+  const [e, t] = nt({ className: "rt-r-m", customProperties: ["--margin"], propValues: gt, value: n.m }), [s, a] = nt({ className: "rt-r-mx", customProperties: ["--margin-left", "--margin-right"], propValues: gt, value: n.mx }), [o, i] = nt({ className: "rt-r-my", customProperties: ["--margin-top", "--margin-bottom"], propValues: gt, value: n.my }), [l, c] = nt({ className: "rt-r-mt", customProperties: ["--margin-top"], propValues: gt, value: n.mt }), [u, h] = nt({ className: "rt-r-mr", customProperties: ["--margin-right"], propValues: gt, value: n.mr }), [A, p] = nt({ className: "rt-r-mb", customProperties: ["--margin-bottom"], propValues: gt, value: n.mb }), [k, f] = nt({ className: "rt-r-ml", customProperties: ["--margin-left"], propValues: gt, value: n.ml });
+  return [v(e, s, o, l, u, A, k), un(t, a, i, c, h, p, f)];
 }
 const Qt = d.forwardRef((n, e) => {
-  const { rest: t, ...s } = tA(n), [a, o] = nA(s), { asChild: i, children: l, className: c, style: u, type: h, scrollHideDelay: A = h !== "scroll" ? 0 : void 0, dir: p, size: k = Yt.size.default, radius: v = Yt.radius.default, scrollbars: m = Yt.scrollbars.default, ...f } = t;
-  return d.createElement(aa, { type: h, scrollHideDelay: A, className: C("rt-ScrollAreaRoot", a, c), style: un(o, u), asChild: i }, tr({ asChild: i, children: l }, (E) => d.createElement(d.Fragment, null, d.createElement(oa, { ...f, ref: e, className: "rt-ScrollAreaViewport" }, E), d.createElement("div", { className: "rt-ScrollAreaViewportFocusRing" }), m !== "vertical" ? d.createElement(Es, { "data-radius": v, orientation: "horizontal", className: C("rt-ScrollAreaScrollbar", dn({ className: "rt-r-size", value: k, propValues: Yt.size.values })) }, d.createElement(Ss, { className: "rt-ScrollAreaThumb" })) : null, m !== "horizontal" ? d.createElement(Es, { "data-radius": v, orientation: "vertical", className: C("rt-ScrollAreaScrollbar", dn({ className: "rt-r-size", value: k, propValues: Yt.size.values })) }, d.createElement(Ss, { className: "rt-ScrollAreaThumb" })) : null, m === "both" ? d.createElement(yl, { className: "rt-ScrollAreaCorner" }) : null)));
+  const { rest: t, ...s } = tA(n), [a, o] = nA(s), { asChild: i, children: l, className: c, style: u, type: h, scrollHideDelay: A = h !== "scroll" ? 0 : void 0, dir: p, size: k = Yt.size.default, radius: f = Yt.radius.default, scrollbars: m = Yt.scrollbars.default, ...C } = t;
+  return d.createElement(aa, { type: h, scrollHideDelay: A, className: v("rt-ScrollAreaRoot", a, c), style: un(o, u), asChild: i }, tr({ asChild: i, children: l }, (E) => d.createElement(d.Fragment, null, d.createElement(oa, { ...C, ref: e, className: "rt-ScrollAreaViewport" }, E), d.createElement("div", { className: "rt-ScrollAreaViewportFocusRing" }), m !== "vertical" ? d.createElement(Es, { "data-radius": f, orientation: "horizontal", className: v("rt-ScrollAreaScrollbar", dn({ className: "rt-r-size", value: k, propValues: Yt.size.values })) }, d.createElement(Ss, { className: "rt-ScrollAreaThumb" })) : null, m !== "horizontal" ? d.createElement(Es, { "data-radius": f, orientation: "vertical", className: v("rt-ScrollAreaScrollbar", dn({ className: "rt-r-size", value: k, propValues: Yt.size.values })) }, d.createElement(Ss, { className: "rt-ScrollAreaThumb" })) : null, m === "both" ? d.createElement(yl, { className: "rt-ScrollAreaCorner" }) : null)));
 });
 Qt.displayName = "ScrollArea";
 const sA = ["start", "center", "end", "baseline", "stretch"], rA = ["horizontal", "vertical"], aA = ["1", "2", "3"], oA = { orientation: { type: "enum", className: "rt-r-orientation", values: rA, default: "horizontal", responsive: !0 }, size: { type: "enum", className: "rt-r-size", values: aA, default: "2", responsive: !0 }, trim: { ...Kn.trim, className: "rt-r-trim" } }, iA = { align: { type: "enum", className: "rt-r-ai", values: sA, responsive: !0 } }, lA = { ...ye, ...we, ...Ie }, Mo = d.forwardRef((n, e) => {
   const { className: t, ...s } = F(n, oA, X);
-  return d.createElement(P, { asChild: !0 }, d.createElement("dl", { ...s, ref: e, className: C("rt-DataListRoot", t) }));
+  return d.createElement(P, { asChild: !0 }, d.createElement("dl", { ...s, ref: e, className: v("rt-DataListRoot", t) }));
 });
 Mo.displayName = "DataList.Root";
 const Oo = d.forwardRef((n, e) => {
   const { className: t, ...s } = F(n, iA);
-  return d.createElement("div", { ...s, ref: e, className: C("rt-DataListItem", t) });
+  return d.createElement("div", { ...s, ref: e, className: v("rt-DataListItem", t) });
 });
 Oo.displayName = "DataList.Item";
 const Fo = d.forwardRef((n, e) => {
   const { className: t, color: s, ...a } = F(n, lA);
-  return d.createElement("dt", { ...a, "data-accent-color": s, ref: e, className: C("rt-DataListLabel", t) });
+  return d.createElement("dt", { ...a, "data-accent-color": s, ref: e, className: v("rt-DataListLabel", t) });
 });
 Fo.displayName = "DataList.Label";
-const Ho = d.forwardRef(({ children: n, className: e, ...t }, s) => d.createElement("dd", { ...t, ref: s, className: C(e, "rt-DataListValue") }, n));
+const Ho = d.forwardRef(({ children: n, className: e, ...t }, s) => d.createElement("dd", { ...t, ref: s, className: v(e, "rt-DataListValue") }, n));
 Ho.displayName = "DataList.Value";
 const PS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
@@ -1634,7 +1634,7 @@ const Wo = d.forwardRef(({ children: n, ...e }, t) => d.createElement(Rl, { ...e
 Wo.displayName = "Dialog.Trigger";
 const Lo = d.forwardRef(({ align: n, ...e }, t) => {
   const { align: s, ...a } = fo, { className: o } = F({ align: n }, { align: s }), { className: i, forceMount: l, container: c, ...u } = F(e, a);
-  return d.createElement(El, { container: c, forceMount: l }, d.createElement(dt, { asChild: !0 }, d.createElement(Sl, { className: "rt-BaseDialogOverlay rt-DialogOverlay" }, d.createElement("div", { className: "rt-BaseDialogScroll rt-DialogScroll" }, d.createElement("div", { className: `rt-BaseDialogScrollPadding rt-DialogScrollPadding ${o}` }, d.createElement(Il, { ...u, ref: t, className: C("rt-BaseDialogContent", "rt-DialogContent", i) }))))));
+  return d.createElement(El, { container: c, forceMount: l }, d.createElement(dt, { asChild: !0 }, d.createElement(Sl, { className: "rt-BaseDialogOverlay rt-DialogOverlay" }, d.createElement("div", { className: "rt-BaseDialogScroll rt-DialogScroll" }, d.createElement("div", { className: `rt-BaseDialogScrollPadding rt-DialogScrollPadding ${o}` }, d.createElement(Il, { ...u, ref: t, className: v("rt-BaseDialogContent", "rt-DialogContent", i) }))))));
 });
 Lo.displayName = "Dialog.Content";
 const Vo = d.forwardRef((n, e) => d.createElement(wl, { asChild: !0 }, d.createElement(Xn, { size: "5", mb: "3", trim: "start", ...n, asChild: !1, ref: e })));
@@ -1653,16 +1653,16 @@ const US = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   Trigger: Wo
 }, Symbol.toStringTag, { value: "Module" })), cA = { ...re, ...xt, ...Nt }, dA = d.forwardRef((n, e) => {
   const { asChild: t, className: s, ...a } = F(n, cA), o = t ? ve : "em";
-  return d.createElement(o, { ...a, ref: e, className: C("rt-Em", s) });
+  return d.createElement(o, { ...a, ref: e, className: v("rt-Em", s) });
 });
 dA.displayName = "Em";
 const uA = ["1", "2", "3"], AA = { ...re, size: { type: "enum", className: "rt-r-size", values: uA, default: "2", responsive: !0 }, width: ye.width, minWidth: ye.minWidth, maxWidth: { ...ye.maxWidth, default: "480px" }, ...qt }, Go = (n) => d.createElement(Ql, { closeDelay: 150, openDelay: 200, ...n });
 Go.displayName = "HoverCard.Root";
-const Xo = d.forwardRef(({ children: n, className: e, ...t }, s) => d.createElement(Tl, { ref: s, className: C("rt-HoverCardTrigger", e), ...t, asChild: !0 }, ut(n)));
+const Xo = d.forwardRef(({ children: n, className: e, ...t }, s) => d.createElement(Tl, { ref: s, className: v("rt-HoverCardTrigger", e), ...t, asChild: !0 }, ut(n)));
 Xo.displayName = "HoverCard.Trigger";
 const Yo = d.forwardRef((n, e) => {
   const { className: t, forceMount: s, container: a, ...o } = F(n, AA);
-  return d.createElement(Nl, { container: a, forceMount: s }, d.createElement(dt, { asChild: !0 }, d.createElement(xl, { align: "start", sideOffset: 8, collisionPadding: 10, ...o, ref: e, className: C("rt-PopperContent", "rt-HoverCardContent", t) })));
+  return d.createElement(Nl, { container: a, forceMount: s }, d.createElement(dt, { asChild: !0 }, d.createElement(xl, { align: "start", sideOffset: 8, collisionPadding: 10, ...o, ref: e, className: v("rt-PopperContent", "rt-HoverCardContent", t) })));
 });
 Yo.displayName = "HoverCard.Content";
 const zS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
@@ -1670,7 +1670,7 @@ const zS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   Content: Yo,
   Root: Go,
   Trigger: Xo
-}, Symbol.toStringTag, { value: "Module" })), dr = d.forwardRef(({ className: n, ...e }, t) => d.createElement(ar, { ...e, ref: t, className: C("rt-IconButton", n) }));
+}, Symbol.toStringTag, { value: "Module" })), dr = d.forwardRef(({ className: n, ...e }, t) => d.createElement(ar, { ...e, ref: t, className: v("rt-IconButton", n) }));
 dr.displayName = "IconButton";
 const hA = ["all", "x", "y", "top", "bottom", "left", "right"], pA = ["border-box", "padding-box"], ft = ["current", "0"], mA = { ...re, side: { type: "enum", className: "rt-r-side", values: hA, default: "all", responsive: !0 }, clip: { type: "enum", className: "rt-r-clip", values: pA, default: "border-box", responsive: !0 }, p: { type: "enum", className: "rt-r-p", values: ft, parseValue: vt, responsive: !0 }, px: { type: "enum", className: "rt-r-px", values: ft, parseValue: vt, responsive: !0 }, py: { type: "enum", className: "rt-r-py", values: ft, parseValue: vt, responsive: !0 }, pt: { type: "enum", className: "rt-r-pt", values: ft, parseValue: vt, responsive: !0 }, pr: { type: "enum", className: "rt-r-pr", values: ft, parseValue: vt, responsive: !0 }, pb: { type: "enum", className: "rt-r-pb", values: ft, parseValue: vt, responsive: !0 }, pl: { type: "enum", className: "rt-r-pl", values: ft, parseValue: vt, responsive: !0 } };
 function vt(n) {
@@ -1678,17 +1678,17 @@ function vt(n) {
 }
 const gA = d.forwardRef((n, e) => {
   const { asChild: t, className: s, ...a } = F(n, mA, X), o = t ? ve : "div";
-  return d.createElement(o, { ...a, ref: e, className: C("rt-Inset", s) });
+  return d.createElement(o, { ...a, ref: e, className: v("rt-Inset", s) });
 });
 gA.displayName = "Inset";
 const fA = ["1", "2", "3", "4", "5", "6", "7", "8", "9"], vA = { ...re, size: { type: "enum", className: "rt-r-size", values: fA, responsive: !0 } }, CA = d.forwardRef((n, e) => {
   const { asChild: t, className: s, ...a } = F(n, vA, X), o = t ? ve : "kbd";
-  return d.createElement(o, { ...a, ref: e, className: C("rt-reset", "rt-Kbd", s) });
+  return d.createElement(o, { ...a, ref: e, className: v("rt-reset", "rt-Kbd", s) });
 });
 CA.displayName = "Kbd";
 const yA = ["1", "2", "3", "4", "5", "6", "7", "8", "9"], kA = ["auto", "always", "hover", "none"], EA = { ...re, size: { type: "enum", className: "rt-r-size", values: yA, responsive: !0 }, ...Gn, ...Kn, ...xt, ...Nt, underline: { type: "enum", className: "rt-underline", values: kA, default: "auto" }, ...Kt, ...Ie }, SA = d.forwardRef((n, e) => {
   const { children: t, className: s, color: a, asChild: o, ...i } = F(n, EA);
-  return d.createElement(P, { ...i, "data-accent-color": a, ref: e, asChild: !0, className: C("rt-reset", "rt-Link", s) }, o ? t : d.createElement("a", null, t));
+  return d.createElement(P, { ...i, "data-accent-color": a, ref: e, asChild: !0, className: v("rt-reset", "rt-Link", s) }, o ? t : d.createElement("a", null, t));
 });
 SA.displayName = "Link";
 const IA = ["1", "2", "3", "4"], bA = { ...re, size: { type: "enum", className: "rt-r-size", values: IA, default: "2", responsive: !0 }, width: ye.width, minWidth: ye.minWidth, maxWidth: { ...ye.maxWidth, default: "480px" }, ...qt }, Yn = (n) => d.createElement(la, { ...n });
@@ -1697,7 +1697,7 @@ const Zn = d.forwardRef(({ children: n, ...e }, t) => d.createElement(ca, { ...e
 Zn.displayName = "Popover.Trigger";
 const _n = d.forwardRef((n, e) => {
   const { className: t, forceMount: s, container: a, ...o } = F(n, bA);
-  return d.createElement(Pl, { container: a, forceMount: s }, d.createElement(dt, { asChild: !0 }, d.createElement(ia, { align: "start", sideOffset: 8, collisionPadding: 10, ...o, ref: e, className: C("rt-PopperContent", "rt-PopoverContent", t) })));
+  return d.createElement(Pl, { container: a, forceMount: s }, d.createElement(dt, { asChild: !0 }, d.createElement(ia, { align: "start", sideOffset: 8, collisionPadding: 10, ...o, ref: e, className: v("rt-PopperContent", "rt-PopoverContent", t) })));
 });
 _n.displayName = "Popover.Content";
 const Zo = d.forwardRef(({ children: n, ...e }, t) => d.createElement(Jl, { ...e, ref: t, asChild: !0 }, ut(n)));
@@ -1713,34 +1713,34 @@ const MS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   Trigger: Zn
 }, Symbol.toStringTag, { value: "Module" })), BA = ["1", "2", "3"], wA = ["classic", "surface", "soft"], RA = { size: { type: "enum", className: "rt-r-size", values: BA, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: wA, default: "surface" }, ...we, ...Ie, ...Le, duration: { type: "string" } }, NA = d.forwardRef((n, e) => {
   const { className: t, style: s, color: a, radius: o, duration: i, ...l } = F(n, RA, X);
-  return d.createElement(Ul, { "data-accent-color": a, "data-radius": o, ref: e, className: C("rt-ProgressRoot", t), style: un({ "--progress-duration": "value" in l ? void 0 : i, "--progress-value": "value" in l ? l.value : void 0, "--progress-max": "max" in l ? l.max : void 0 }, s), ...l, asChild: !1 }, d.createElement(zl, { className: "rt-ProgressIndicator" }));
+  return d.createElement(Ul, { "data-accent-color": a, "data-radius": o, ref: e, className: v("rt-ProgressRoot", t), style: un({ "--progress-duration": "value" in l ? void 0 : i, "--progress-value": "value" in l ? l.value : void 0, "--progress-max": "max" in l ? l.max : void 0 }, s), ...l, asChild: !1 }, d.createElement(zl, { className: "rt-ProgressIndicator" }));
 });
 NA.displayName = "Progress";
 const xA = { ...re, ...xt, ...Nt }, QA = d.forwardRef((n, e) => {
   const { asChild: t, className: s, ...a } = F(n, xA), o = t ? ve : "q";
-  return d.createElement(o, { ...a, ref: e, className: C("rt-Quote", s) });
+  return d.createElement(o, { ...a, ref: e, className: v("rt-Quote", s) });
 });
 QA.displayName = "Quote";
 const TA = ["1", "2", "3"], DA = ["surface", "classic"], JA = { ...re, size: { type: "enum", className: "rt-r-size", values: TA, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: DA, default: "surface" }, ...we, ...Ie, columns: { ...Jn.columns, default: "repeat(auto-fit, minmax(160px, 1fr))" }, gap: { ...Jn.gap, default: "4" } }, $n = d.forwardRef((n, e) => {
   const { className: t, color: s, ...a } = F(n, JA, X);
-  return d.createElement(Po, { asChild: !0 }, d.createElement(da, { "data-accent-color": s, ...a, ref: e, className: C("rt-RadioCardsRoot", t) }));
+  return d.createElement(Po, { asChild: !0 }, d.createElement(da, { "data-accent-color": s, ...a, ref: e, className: v("rt-RadioCardsRoot", t) }));
 });
 $n.displayName = "RadioCards.Root";
-const mn = d.forwardRef(({ className: n, ...e }, t) => d.createElement(ua, { ...e, asChild: !1, ref: t, className: C("rt-reset", "rt-BaseCard", "rt-RadioCardsItem", n) }));
+const mn = d.forwardRef(({ className: n, ...e }, t) => d.createElement(ua, { ...e, asChild: !1, ref: t, className: v("rt-reset", "rt-BaseCard", "rt-RadioCardsItem", n) }));
 mn.displayName = "RadioCards.Item";
 const PA = ["1", "2", "3"], UA = ["classic", "surface", "soft"], an = { ...re, size: { type: "enum", className: "rt-r-size", values: PA, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: UA, default: "surface" }, ...we, ...Ie }, $o = "RadioGroup", [zA] = Ws($o, [Aa]), ei = Aa(), [MA, ti] = zA($o), ni = d.forwardRef(({ color: n = an.color.default, highContrast: e = an.highContrast.default, size: t = an.size.default, variant: s = an.variant.default, ...a }, o) => {
   const { __scopeRadioGroup: i, className: l, ...c } = F(a, X), u = ei(i);
-  return d.createElement(MA, { scope: i, color: n, highContrast: e, size: t, variant: s }, d.createElement(da, { ...u, ...c, ref: o, className: C("rt-RadioGroupRoot", l) }));
+  return d.createElement(MA, { scope: i, color: n, highContrast: e, size: t, variant: s }, d.createElement(da, { ...u, ...c, ref: o, className: v("rt-RadioGroupRoot", l) }));
 });
 ni.displayName = "RadioGroup.Root";
 const si = d.forwardRef((n, e) => {
   const { __scopeRadioGroup: t, children: s, className: a, style: o, ...i } = n, { size: l } = ti("RadioGroupItem", t);
-  return s ? d.createElement(P, { as: "label", size: l, className: C("rt-RadioGroupItem", a), style: o }, d.createElement(Us, { __scopeRadioGroup: t, ...i, ref: e }), s && d.createElement("span", { className: "rt-RadioGroupItemInner" }, s)) : d.createElement(Us, { __scopeRadioGroup: t, ...i, ref: e, className: a, style: o });
+  return s ? d.createElement(P, { as: "label", size: l, className: v("rt-RadioGroupItem", a), style: o }, d.createElement(Us, { __scopeRadioGroup: t, ...i, ref: e }), s && d.createElement("span", { className: "rt-RadioGroupItemInner" }, s)) : d.createElement(Us, { __scopeRadioGroup: t, ...i, ref: e, className: a, style: o });
 });
 si.displayName = "RadioGroup.Item";
 const Us = d.forwardRef(({ __scopeRadioGroup: n, ...e }, t) => {
   const s = ti("RadioGroupItemRadio", n), a = ei(n), { color: o, className: i } = F({ ...e, ...s }, an, X);
-  return d.createElement(ua, { ...a, "data-accent-color": o, ...e, asChild: !1, ref: t, className: C("rt-reset", "rt-BaseRadioRoot", i) });
+  return d.createElement(ua, { ...a, "data-accent-color": o, ...e, asChild: !1, ref: t, className: v("rt-reset", "rt-BaseRadioRoot", i) });
 });
 Us.displayName = "RadioGroup.ItemRadio";
 const OS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
@@ -1749,17 +1749,17 @@ const OS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   Root: ni
 }, Symbol.toStringTag, { value: "Module" })), OA = ["1", "2", "3"], FA = ["classic", "surface", "soft"], HA = { size: { type: "enum", className: "rt-r-size", values: OA, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: FA, default: "surface" }, ...we, ...Ie }, jA = d.forwardRef((n, e) => {
   const t = d.useRef(null), { className: s, color: a, onChange: o, onValueChange: i, ...l } = F(n, HA, X);
-  return d.createElement("input", { type: "radio", "data-accent-color": a, ...l, onChange: ie(o, (c) => i == null ? void 0 : i(c.currentTarget.value)), ref: ha(t, e), className: C("rt-reset", "rt-BaseRadioRoot", "rt-RadioRoot", s) });
+  return d.createElement("input", { type: "radio", "data-accent-color": a, ...l, onChange: ie(o, (c) => i == null ? void 0 : i(c.currentTarget.value)), ref: ha(t, e), className: v("rt-reset", "rt-BaseRadioRoot", "rt-RadioRoot", s) });
 });
 jA.displayName = "Radio";
 const WA = ["1", "2", "3"], LA = ["surface", "classic"], VA = { disabled: { type: "boolean", className: "disabled", default: !1 }, size: { type: "enum", className: "rt-r-size", values: WA, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: LA, default: "surface" }, ...Le }, ri = d.forwardRef((n, e) => {
   const { className: t, children: s, radius: a, value: o, defaultValue: i, onValueChange: l, ...c } = F(n, VA, X), [u, h] = xn({ prop: o, onChange: l, defaultProp: i });
-  return d.createElement(Ml, { "data-disabled": n.disabled || void 0, "data-radius": a, ref: e, className: C("rt-SegmentedControlRoot", t), onValueChange: (A) => {
+  return d.createElement(Ml, { "data-disabled": n.disabled || void 0, "data-radius": a, ref: e, className: v("rt-SegmentedControlRoot", t), onValueChange: (A) => {
     A && h(A);
   }, ...c, type: "single", value: u, asChild: !1, disabled: !!n.disabled }, s, d.createElement("div", { className: "rt-SegmentedControlIndicator" }));
 });
 ri.displayName = "SegmentedControl.Root";
-const ai = d.forwardRef(({ children: n, className: e, ...t }, s) => d.createElement(Ol, { ref: s, className: C("rt-reset", "rt-SegmentedControlItem", e), ...t, disabled: !1, asChild: !1 }, d.createElement("span", { className: "rt-SegmentedControlItemSeparator" }), d.createElement("span", { className: "rt-SegmentedControlItemLabel" }, d.createElement("span", { className: "rt-SegmentedControlItemLabelActive" }, n), d.createElement("span", { className: "rt-SegmentedControlItemLabelInactive", "aria-hidden": !0 }, n))));
+const ai = d.forwardRef(({ children: n, className: e, ...t }, s) => d.createElement(Ol, { ref: s, className: v("rt-reset", "rt-SegmentedControlItem", e), ...t, disabled: !1, asChild: !1 }, d.createElement("span", { className: "rt-SegmentedControlItemSeparator" }), d.createElement("span", { className: "rt-SegmentedControlItemLabel" }, d.createElement("span", { className: "rt-SegmentedControlItemLabelActive" }, n), d.createElement("span", { className: "rt-SegmentedControlItemLabelInactive", "aria-hidden": !0 }, n))));
 ai.displayName = "SegmentedControl.Item";
 const qA = ["1", "2", "3", "4"], KA = ["none", "initial"], GA = { ...re, size: { type: "enum", className: "rt-r-size", values: qA, default: "3", responsive: !0 }, display: { type: "enum", className: "rt-r-display", values: KA, parseValue: XA, responsive: !0 } };
 function XA(n) {
@@ -1767,7 +1767,7 @@ function XA(n) {
 }
 const YA = d.forwardRef((n, e) => {
   const { asChild: t, className: s, ...a } = F(n, GA, pn, X), o = t ? ve : "section";
-  return d.createElement(o, { ...a, ref: e, className: C("rt-Section", s) });
+  return d.createElement(o, { ...a, ref: e, className: v("rt-Section", s) });
 });
 YA.displayName = "Section";
 const ZA = ["1", "2", "3"], ur = { size: { type: "enum", className: "rt-r-size", values: ZA, default: "2", responsive: !0 } }, _A = ["classic", "surface", "soft", "ghost"], $A = { variant: { type: "enum", className: "rt-variant", values: _A, default: "surface" }, ...we, ...Le, placeholder: { type: "string" } }, eh = ["solid", "soft"], th = { variant: { type: "enum", className: "rt-variant", values: eh, default: "solid" }, ...we, ...Ie }, Ar = d.createContext({}), hr = (n) => {
@@ -1777,45 +1777,45 @@ const ZA = ["1", "2", "3"], ur = { size: { type: "enum", className: "rt-r-size",
 hr.displayName = "Select.Root";
 const pr = d.forwardRef((n, e) => {
   const t = d.useContext(Ar), { children: s, className: a, color: o, radius: i, placeholder: l, ...c } = F({ size: t == null ? void 0 : t.size, ...n }, { size: ur.size }, $A, X);
-  return d.createElement(ud, { asChild: !0 }, d.createElement("button", { "data-accent-color": o, "data-radius": i, ...c, ref: e, className: C("rt-reset", "rt-SelectTrigger", a) }, d.createElement("span", { className: "rt-SelectTriggerInner" }, d.createElement(Ad, { placeholder: l }, s)), d.createElement(hd, { asChild: !0 }, d.createElement(zo, { className: "rt-SelectIcon" }))));
+  return d.createElement(ud, { asChild: !0 }, d.createElement("button", { "data-accent-color": o, "data-radius": i, ...c, ref: e, className: v("rt-reset", "rt-SelectTrigger", a) }, d.createElement("span", { className: "rt-SelectTriggerInner" }, d.createElement(Ad, { placeholder: l }, s)), d.createElement(hd, { asChild: !0 }, d.createElement(zo, { className: "rt-SelectIcon" }))));
 });
 pr.displayName = "Select.Trigger";
 const mr = d.forwardRef((n, e) => {
   const t = d.useContext(Ar), { className: s, children: a, color: o, container: i, ...l } = F({ size: t == null ? void 0 : t.size, ...n }, { size: ur.size }, th), c = eu(), u = o || c.accentColor;
-  return d.createElement(pd, { container: i }, d.createElement(dt, { asChild: !0 }, d.createElement(md, { "data-accent-color": u, sideOffset: 4, ...l, asChild: !1, ref: e, className: C({ "rt-PopperContent": l.position === "popper" }, "rt-SelectContent", s) }, d.createElement(aa, { type: "auto", className: "rt-ScrollAreaRoot" }, d.createElement(gd, { asChild: !0, className: "rt-SelectViewport" }, d.createElement(oa, { className: "rt-ScrollAreaViewport", style: { overflowY: void 0 } }, a)), d.createElement(Es, { className: "rt-ScrollAreaScrollbar rt-r-size-1", orientation: "vertical" }, d.createElement(Ss, { className: "rt-ScrollAreaThumb" }))))));
+  return d.createElement(pd, { container: i }, d.createElement(dt, { asChild: !0 }, d.createElement(md, { "data-accent-color": u, sideOffset: 4, ...l, asChild: !1, ref: e, className: v({ "rt-PopperContent": l.position === "popper" }, "rt-SelectContent", s) }, d.createElement(aa, { type: "auto", className: "rt-ScrollAreaRoot" }, d.createElement(gd, { asChild: !0, className: "rt-SelectViewport" }, d.createElement(oa, { className: "rt-ScrollAreaViewport", style: { overflowY: void 0 } }, a)), d.createElement(Es, { className: "rt-ScrollAreaScrollbar rt-r-size-1", orientation: "vertical" }, d.createElement(Ss, { className: "rt-ScrollAreaThumb" }))))));
 });
 mr.displayName = "Select.Content";
 const oi = d.forwardRef((n, e) => {
   const { className: t, children: s, ...a } = n;
-  return d.createElement(Cd, { ...a, asChild: !1, ref: e, className: C("rt-SelectItem", t) }, d.createElement(kd, { className: "rt-SelectItemIndicator" }, d.createElement(Uo, { className: "rt-SelectItemIndicatorIcon" })), d.createElement(yd, null, s));
+  return d.createElement(Cd, { ...a, asChild: !1, ref: e, className: v("rt-SelectItem", t) }, d.createElement(kd, { className: "rt-SelectItemIndicator" }, d.createElement(Uo, { className: "rt-SelectItemIndicatorIcon" })), d.createElement(yd, null, s));
 });
 oi.displayName = "Select.Item";
-const gr = d.forwardRef(({ className: n, ...e }, t) => d.createElement(fd, { ...e, asChild: !1, ref: t, className: C("rt-SelectGroup", n) }));
+const gr = d.forwardRef(({ className: n, ...e }, t) => d.createElement(fd, { ...e, asChild: !1, ref: t, className: v("rt-SelectGroup", n) }));
 gr.displayName = "Select.Group";
-const nh = d.forwardRef(({ className: n, ...e }, t) => d.createElement(vd, { ...e, asChild: !1, ref: t, className: C("rt-SelectLabel", n) }));
+const nh = d.forwardRef(({ className: n, ...e }, t) => d.createElement(vd, { ...e, asChild: !1, ref: t, className: v("rt-SelectLabel", n) }));
 nh.displayName = "Select.Label";
-const sh = d.forwardRef(({ className: n, ...e }, t) => d.createElement(Ed, { ...e, asChild: !1, ref: t, className: C("rt-SelectSeparator", n) }));
+const sh = d.forwardRef(({ className: n, ...e }, t) => d.createElement(Ed, { ...e, asChild: !1, ref: t, className: v("rt-SelectSeparator", n) }));
 sh.displayName = "Select.Separator";
 const rh = ["horizontal", "vertical"], ah = ["1", "2", "3", "4"], oh = { orientation: { type: "enum", className: "rt-r-orientation", values: rh, default: "horizontal", responsive: !0 }, size: { type: "enum", className: "rt-r-size", values: ah, default: "1", responsive: !0 }, color: { ...we.color, default: "gray" }, decorative: { type: "boolean", default: !0 } }, Ge = d.forwardRef((n, e) => {
   const { className: t, color: s, decorative: a, ...o } = F(n, oh, X);
-  return d.createElement("span", { "data-accent-color": s, role: a ? void 0 : "separator", ...o, ref: e, className: C("rt-Separator", t) });
+  return d.createElement("span", { "data-accent-color": s, role: a ? void 0 : "separator", ...o, ref: e, className: v("rt-Separator", t) });
 });
 Ge.displayName = "Separator";
 const ih = parseFloat(d.version) >= 19 || "", lh = { loading: { type: "boolean", default: !0 }, ...ye, ...qt }, ch = d.forwardRef((n, e) => {
   const { children: t, className: s, loading: a, ...o } = F(n, lh, X);
   if (!a) return t;
   const i = d.isValidElement(t) ? ve : "span";
-  return d.createElement(i, { ref: e, "aria-hidden": !0, className: C("rt-Skeleton", s), "data-inline-skeleton": d.isValidElement(t) ? void 0 : !0, tabIndex: -1, inert: ih, ...o }, t);
+  return d.createElement(i, { ref: e, "aria-hidden": !0, className: v("rt-Skeleton", s), "data-inline-skeleton": d.isValidElement(t) ? void 0 : !0, tabIndex: -1, inert: ih, ...o }, t);
 });
 ch.displayName = "Skeleton";
 const dh = { ...re, ...xt, ...Nt }, uh = d.forwardRef((n, e) => {
   const { asChild: t, className: s, ...a } = F(n, dh), o = t ? ve : "strong";
-  return d.createElement(o, { ...a, ref: e, className: C("rt-Strong", s) });
+  return d.createElement(o, { ...a, ref: e, className: v("rt-Strong", s) });
 });
 uh.displayName = "Strong";
 const Ah = ["1", "2", "3"], hh = ["classic", "surface", "soft"], ph = { size: { type: "enum", className: "rt-r-size", values: Ah, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: hh, default: "surface" }, ...we, ...Ie, ...Le }, it = d.forwardRef((n, e) => {
   const { className: t, color: s, radius: a, ...o } = F(n, ph, X);
-  return d.createElement(Fl, { "data-accent-color": s, "data-radius": a, ...o, asChild: !1, ref: e, className: C("rt-reset", "rt-SwitchRoot", t) }, d.createElement(Hl, { className: C("rt-SwitchThumb", { "rt-high-contrast": n.highContrast }) }));
+  return d.createElement(Fl, { "data-accent-color": s, "data-radius": a, ...o, asChild: !1, ref: e, className: v("rt-reset", "rt-SwitchRoot", t) }, d.createElement(Hl, { className: v("rt-SwitchThumb", { "rt-high-contrast": n.highContrast }) }));
 });
 it.displayName = "Switch";
 const mh = ["1", "2"], gh = ["nowrap", "wrap", "wrap-reverse"], fh = ["start", "center", "end"], vh = { size: { type: "enum", className: "rt-r-size", values: mh, default: "2", responsive: !0 }, wrap: { type: "enum", className: "rt-r-fw", values: gh, responsive: !0 }, justify: { type: "enum", className: "rt-r-jc", values: fh, responsive: !0 }, ...we, ...Ie }, Ch = ["1", "2", "3"], yh = ["surface", "ghost"], kh = ["auto", "fixed"], As = { size: { type: "enum", className: "rt-r-size", values: Ch, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: yh, default: "ghost" }, layout: { type: "enum", className: "rt-r-tl", values: kh, responsive: !0 } }, Eh = ["start", "center", "end", "baseline"], Sh = { align: { type: "enum", className: "rt-r-va", values: Eh, parseValue: Ih, responsive: !0 } };
@@ -1828,31 +1828,31 @@ function Bh(n) {
 }
 const vr = d.forwardRef((n, e) => {
   const { layout: t, ...s } = As, { className: a, children: o, layout: i, ...l } = F(n, s, X), c = dn({ value: i, className: As.layout.className, propValues: As.layout.values });
-  return d.createElement("div", { ref: e, className: C("rt-TableRoot", a), ...l }, d.createElement(Qt, null, d.createElement("table", { className: C("rt-TableRootTable", c) }, o)));
+  return d.createElement("div", { ref: e, className: v("rt-TableRoot", a), ...l }, d.createElement(Qt, null, d.createElement("table", { className: v("rt-TableRootTable", c) }, o)));
 });
 vr.displayName = "Table.Root";
-const Cr = d.forwardRef(({ className: n, ...e }, t) => d.createElement("thead", { ...e, ref: t, className: C("rt-TableHeader", n) }));
+const Cr = d.forwardRef(({ className: n, ...e }, t) => d.createElement("thead", { ...e, ref: t, className: v("rt-TableHeader", n) }));
 Cr.displayName = "Table.Header";
-const yr = d.forwardRef(({ className: n, ...e }, t) => d.createElement("tbody", { ...e, ref: t, className: C("rt-TableBody", n) }));
+const yr = d.forwardRef(({ className: n, ...e }, t) => d.createElement("tbody", { ...e, ref: t, className: v("rt-TableBody", n) }));
 yr.displayName = "Table.Body";
 const es = d.forwardRef((n, e) => {
   const { className: t, ...s } = F(n, Sh);
-  return d.createElement("tr", { ...s, ref: e, className: C("rt-TableRow", t) });
+  return d.createElement("tr", { ...s, ref: e, className: v("rt-TableRow", t) });
 });
 es.displayName = "Table.Row";
 const Ht = d.forwardRef((n, e) => {
   const { className: t, ...s } = F(n, fr);
-  return d.createElement("td", { className: C("rt-TableCell", t), ref: e, ...s });
+  return d.createElement("td", { className: v("rt-TableCell", t), ref: e, ...s });
 });
 Ht.displayName = "Table.Cell";
 const Pn = d.forwardRef((n, e) => {
   const { className: t, ...s } = F(n, fr);
-  return d.createElement("th", { className: C("rt-TableCell", "rt-TableColumnHeaderCell", t), scope: "col", ref: e, ...s });
+  return d.createElement("th", { className: v("rt-TableCell", "rt-TableColumnHeaderCell", t), scope: "col", ref: e, ...s });
 });
 Pn.displayName = "Table.ColumnHeaderCell";
 const ii = d.forwardRef((n, e) => {
   const { className: t, ...s } = F(n, fr);
-  return d.createElement("th", { className: C("rt-TableCell", "rt-TableRowHeaderCell", t), scope: "row", ref: e, ...s });
+  return d.createElement("th", { className: v("rt-TableCell", "rt-TableRowHeaderCell", t), scope: "row", ref: e, ...s });
 });
 ii.displayName = "Table.RowHeaderCell";
 const FS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
@@ -1866,22 +1866,22 @@ const FS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   RowHeaderCell: ii
 }, Symbol.toStringTag, { value: "Module" })), li = d.forwardRef((n, e) => {
   const { className: t, ...s } = F(n, X);
-  return d.createElement(Ll, { ...s, ref: e, className: C("rt-TabsRoot", t) });
+  return d.createElement(Ll, { ...s, ref: e, className: v("rt-TabsRoot", t) });
 });
 li.displayName = "Tabs.Root";
 const ci = d.forwardRef((n, e) => {
   const { className: t, color: s, ...a } = F(n, vh, X);
-  return d.createElement(Wl, { "data-accent-color": s, ...a, asChild: !1, ref: e, className: C("rt-BaseTabList", "rt-TabsList", t) });
+  return d.createElement(Wl, { "data-accent-color": s, ...a, asChild: !1, ref: e, className: v("rt-BaseTabList", "rt-TabsList", t) });
 });
 ci.displayName = "Tabs.List";
 const di = d.forwardRef((n, e) => {
   const { className: t, children: s, ...a } = n;
-  return d.createElement(Vl, { ...a, asChild: !1, ref: e, className: C("rt-reset", "rt-BaseTabListTrigger", "rt-TabsTrigger", t) }, d.createElement("span", { className: "rt-BaseTabListTriggerInner rt-TabsTriggerInner" }, s), d.createElement("span", { className: "rt-BaseTabListTriggerInnerHidden rt-TabsTriggerInnerHidden" }, s));
+  return d.createElement(Vl, { ...a, asChild: !1, ref: e, className: v("rt-reset", "rt-BaseTabListTrigger", "rt-TabsTrigger", t) }, d.createElement("span", { className: "rt-BaseTabListTriggerInner rt-TabsTriggerInner" }, s), d.createElement("span", { className: "rt-BaseTabListTriggerInnerHidden rt-TabsTriggerInnerHidden" }, s));
 });
 di.displayName = "Tabs.Trigger";
 const ui = d.forwardRef((n, e) => {
   const { className: t, ...s } = F(n, X);
-  return d.createElement(jl, { ...s, ref: e, className: C("rt-TabsContent", t) });
+  return d.createElement(jl, { ...s, ref: e, className: v("rt-TabsContent", t) });
 });
 ui.displayName = "Tabs.Content";
 const HS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
@@ -1892,12 +1892,12 @@ const HS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   Trigger: di
 }, Symbol.toStringTag, { value: "Module" })), wh = ["1", "2", "3"], Rh = ["classic", "surface", "soft"], Nh = ["none", "vertical", "horizontal", "both"], xh = { size: { type: "enum", className: "rt-r-size", values: wh, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: Rh, default: "surface" }, resize: { type: "enum", className: "rt-r-resize", values: Nh, responsive: !0 }, ...we, ...Le }, Ai = d.forwardRef((n, e) => {
   const { className: t, color: s, radius: a, style: o, ...i } = F(n, xh, X);
-  return d.createElement("div", { "data-accent-color": s, "data-radius": a, className: C("rt-TextAreaRoot", t), style: o }, d.createElement("textarea", { className: "rt-reset rt-TextAreaInput", ref: e, ...i }));
+  return d.createElement("div", { "data-accent-color": s, "data-radius": a, className: v("rt-TextAreaRoot", t), style: o }, d.createElement("textarea", { className: "rt-reset rt-TextAreaInput", ref: e, ...i }));
 });
 Ai.displayName = "TextArea";
 const Qh = ["1", "2", "3"], Th = ["classic", "surface", "soft"], Dh = { size: { type: "enum", className: "rt-r-size", values: Qh, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: Th, default: "surface" }, ...we, ...Le }, Jh = ["left", "right"], Ph = { side: { type: "enum", values: Jh }, ...we, gap: Qo.gap, px: ln.px, pl: ln.pl, pr: ln.pr }, hi = d.forwardRef((n, e) => {
   const t = d.useRef(null), { children: s, className: a, color: o, radius: i, style: l, ...c } = F(n, Dh, X);
-  return d.createElement("div", { "data-accent-color": o, "data-radius": i, style: l, className: C("rt-TextFieldRoot", a), onPointerDown: (u) => {
+  return d.createElement("div", { "data-accent-color": o, "data-radius": i, style: l, className: v("rt-TextFieldRoot", a), onPointerDown: (u) => {
     const h = u.target;
     if (h.closest("input, button, a")) return;
     const A = t.current;
@@ -1918,12 +1918,12 @@ const Qh = ["1", "2", "3"], Th = ["classic", "surface", "soft"], Dh = { size: {
 hi.displayName = "TextField.Root";
 const pi = d.forwardRef((n, e) => {
   const { className: t, color: s, side: a, ...o } = F(n, Ph);
-  return d.createElement("div", { "data-accent-color": s, "data-side": a, ...o, ref: e, className: C("rt-TextFieldSlot", t) });
+  return d.createElement("div", { "data-accent-color": s, "data-side": a, ...o, ref: e, className: v("rt-TextFieldSlot", t) });
 });
 pi.displayName = "TextField.Slot";
 const Uh = { content: { type: "ReactNode", required: !0 }, width: ye.width, minWidth: ye.minWidth, maxWidth: { ...ye.maxWidth, default: "360px" } }, Gt = d.forwardRef((n, e) => {
   const { children: t, className: s, open: a, defaultOpen: o, onOpenChange: i, delayDuration: l, disableHoverableContent: c, content: u, container: h, forceMount: A, ...p } = F(n, Uh), k = { open: a, defaultOpen: o, onOpenChange: i, delayDuration: l, disableHoverableContent: c };
-  return d.createElement(Mn, { ...k }, d.createElement(On, { asChild: !0 }, t), d.createElement(pa, { container: h, forceMount: A }, d.createElement(dt, { asChild: !0 }, d.createElement(Fn, { sideOffset: 4, collisionPadding: 10, ...p, asChild: !1, ref: e, className: C("rt-TooltipContent", s) }, d.createElement(P, { as: "p", className: "rt-TooltipText", size: "1" }, u), d.createElement(Hn, { className: "rt-TooltipArrow" })))));
+  return d.createElement(Mn, { ...k }, d.createElement(On, { asChild: !0 }, t), d.createElement(pa, { container: h, forceMount: A }, d.createElement(dt, { asChild: !0 }, d.createElement(Fn, { sideOffset: 4, collisionPadding: 10, ...p, asChild: !1, ref: e, className: v("rt-TooltipContent", s) }, d.createElement(P, { as: "p", className: "rt-TooltipText", size: "1" }, u), d.createElement(Hn, { className: "rt-TooltipArrow" })))));
 });
 Gt.displayName = "Tooltip";
 const zh = "_upgradeItem_1isop_1", Mh = "_upgradeItemCollapsed_1isop_12", Oh = "_upgradeIcon_1isop_26", Fh = "_upgradeText_1isop_30", Hh = "_upgradeContent_1isop_44", jh = "_upgradeContentCollapsed_1isop_58", Wh = "_upgradeItemSelected_1isop_71", Ct = {
@@ -1955,7 +1955,7 @@ const zh = "_upgradeItem_1isop_1", Mh = "_upgradeItemCollapsed_1isop_12", Oh = "
         align: "center",
         role: "button",
         tabIndex: 0,
-        className: C(Ct.upgradeItem, {
+        className: v(Ct.upgradeItem, {
           [Ct.upgradeItemCollapsed]: e,
           [Ct.upgradeItemSelected]: l
         }),
@@ -1968,7 +1968,7 @@ const zh = "_upgradeItem_1isop_1", Mh = "_upgradeItemCollapsed_1isop_12", Oh = "
           /* @__PURE__ */ r(
             "div",
             {
-              className: C(Ct.upgradeContent, {
+              className: v(Ct.upgradeContent, {
                 [Ct.upgradeContentCollapsed]: e
               }),
               children: /* @__PURE__ */ r(P, { size: "2", className: Ct.upgradeText, children: o.label })
@@ -2024,7 +2024,7 @@ const zh = "_upgradeItem_1isop_1", Mh = "_upgradeItemCollapsed_1isop_12", Oh = "
       variant: t,
       color: A,
       size: a,
-      className: C(Ze.Button, e, Ze.button, {
+      className: v(Ze.Button, e, Ze.button, {
         [Ze[A]]: !0,
         [Ze[`size${a}`]]: !0,
         [Ze[t]]: !0,
@@ -2076,7 +2076,7 @@ const mp = "_iconButton_dxvji_1", gp = "_ghost_dxvji_7", fp = "_mint_dxvji_7", v
   dr,
   {
     onClick: n,
-    className: C(
+    className: v(
       yt.iconButton,
       {
         [yt[a]]: !0,
@@ -2128,7 +2128,7 @@ const Qp = ({
           size: "1",
           variant: "solid",
           color: e.color,
-          className: C(Ye.badge, {
+          className: v(Ye.badge, {
             [Ye.badgeGreen]: e.color === "green",
             [Ye.badgeNeutral]: e.color === "neutral"
           }),
@@ -2186,7 +2186,7 @@ const Tp = "_size1_18z9r_1", Dp = "_accent_18z9r_5", Jp = "_neutral_18z9r_15", P
     color: s,
     variant: "soft",
     highContrast: a,
-    className: C(
+    className: v(
       vn.Callout,
       e,
       vn[s],
@@ -2232,12 +2232,12 @@ const Fp = "_card_qkexv_1", Hp = "_iconContainer_qkexv_15", jp = "_icon_qkexv_15
       size: "3",
       color: t,
       onClick: i,
-      className: C(u, e, Ve.card, s && Ve.drop, a && Ve.dropHover),
+      className: v(u, e, Ve.card, s && Ve.drop, a && Ve.dropHover),
       ...l,
       children: /* @__PURE__ */ g(y, { gap: "5", align: "center", children: [
         /* @__PURE__ */ g(y, { className: Ve.iconContainer, children: [
-          o ? /* @__PURE__ */ r(o, { width: 16, height: 16, className: C(Ve.iconDefault, c) }) : /* @__PURE__ */ r(ma, { width: 16, height: 16, className: C(Ve.iconDefault, c) }),
-          /* @__PURE__ */ r(Vs, { width: 16, height: 16, className: C(Ve.iconHover, c) })
+          o ? /* @__PURE__ */ r(o, { width: 16, height: 16, className: v(Ve.iconDefault, c) }) : /* @__PURE__ */ r(ma, { width: 16, height: 16, className: v(Ve.iconDefault, c) }),
+          /* @__PURE__ */ r(Vs, { width: 16, height: 16, className: v(Ve.iconHover, c) })
         ] }),
         /* @__PURE__ */ r(he, { children: /* @__PURE__ */ r(P, { as: "div", size: "2", weight: "bold", children: n }) })
       ] })
@@ -2256,7 +2256,7 @@ const Gp = "_Checkbox_1hm4q_1", Xp = "_CheckboxIndicator_1hm4q_61", Yp = "_Check
     ql,
     {
       ...e,
-      className: C(Cn.Checkbox, n),
+      className: v(Cn.Checkbox, n),
       size: t,
       children: /* @__PURE__ */ g(Kl, { className: Cn.CheckboxIndicator, children: [
         /* @__PURE__ */ r(
@@ -2318,35 +2318,35 @@ const _p = "_clock_1g00b_2", $p = "_column_1g00b_10", em = "_sm_1g00b_18", tm =
     [se.md]: u === "md",
     [se.lg]: u === "lg"
   };
-  return l ? /* @__PURE__ */ r("div", { className: C(se.skeletonBox, p, h), children: /* @__PURE__ */ r("div", { className: se.skeleton }) }) : /* @__PURE__ */ g("div", { className: C(se.clock, h), children: [
+  return l ? /* @__PURE__ */ r("div", { className: v(se.skeletonBox, p, h), children: /* @__PURE__ */ r("div", { className: se.skeleton }) }) : /* @__PURE__ */ g("div", { className: v(se.clock, h), children: [
     A && t > 0 && /* @__PURE__ */ g(pe, { children: [
       /* @__PURE__ */ g(
         "div",
         {
-          className: C(se.column, p, {
+          className: v(se.column, p, {
             [se.days]: t > 0
           }),
           children: [
-            /* @__PURE__ */ r("p", { className: C(se.labelBig, p), children: yn(t) }),
-            /* @__PURE__ */ r("p", { className: C(se.labelSmall, p), children: n._("Days") })
+            /* @__PURE__ */ r("p", { className: v(se.labelBig, p), children: yn(t) }),
+            /* @__PURE__ */ r("p", { className: v(se.labelSmall, p), children: n._("Days") })
           ]
         }
       ),
-      /* @__PURE__ */ r("p", { className: C(se.colon, p), children: ":" })
+      /* @__PURE__ */ r("p", { className: v(se.colon, p), children: ":" })
     ] }),
-    /* @__PURE__ */ g("div", { className: C(se.column, p), children: [
-      /* @__PURE__ */ r("p", { className: C(se.labelBig, p), children: yn(s) }),
-      /* @__PURE__ */ r("p", { className: C(se.labelSmall, p), children: n._("Hours") })
+    /* @__PURE__ */ g("div", { className: v(se.column, p), children: [
+      /* @__PURE__ */ r("p", { className: v(se.labelBig, p), children: yn(s) }),
+      /* @__PURE__ */ r("p", { className: v(se.labelSmall, p), children: n._("Hours") })
     ] }),
-    /* @__PURE__ */ r("p", { className: C(se.colon, p), children: ":" }),
-    /* @__PURE__ */ g("div", { className: C(se.column, p), children: [
-      /* @__PURE__ */ r("p", { className: C(se.labelBig, p), children: yn(a) }),
-      /* @__PURE__ */ r("p", { className: C(se.labelSmall, p), children: n._("Minutes") })
+    /* @__PURE__ */ r("p", { className: v(se.colon, p), children: ":" }),
+    /* @__PURE__ */ g("div", { className: v(se.column, p), children: [
+      /* @__PURE__ */ r("p", { className: v(se.labelBig, p), children: yn(a) }),
+      /* @__PURE__ */ r("p", { className: v(se.labelSmall, p), children: n._("Minutes") })
     ] }),
-    (t <= 0 || !A) && /* @__PURE__ */ r("p", { className: C(se.colon, p), children: ":" }),
-    (t <= 0 || !A) && /* @__PURE__ */ g("div", { className: C(se.column, p), children: [
-      /* @__PURE__ */ r("p", { className: C(se.labelBig, p), children: yn(o) }),
-      /* @__PURE__ */ r("p", { className: C(se.labelSmall, p), children: n._("Sec") })
+    (t <= 0 || !A) && /* @__PURE__ */ r("p", { className: v(se.colon, p), children: ":" }),
+    (t <= 0 || !A) && /* @__PURE__ */ g("div", { className: v(se.column, p), children: [
+      /* @__PURE__ */ r("p", { className: v(se.labelBig, p), children: yn(o) }),
+      /* @__PURE__ */ r("p", { className: v(se.labelSmall, p), children: n._("Sec") })
     ] })
   ] });
 };
@@ -2385,7 +2385,7 @@ const dm = "_container_1k1mq_1", um = "_content_1k1mq_19", Am = "_title_1k1mq_26
     return () => clearInterval(c);
   }, [s]);
   const l = s && o && !o.ended;
-  return /* @__PURE__ */ g("div", { className: C(Zt.container, n), children: [
+  return /* @__PURE__ */ g("div", { className: v(Zt.container, n), children: [
     /* @__PURE__ */ g("div", { className: Zt.content, children: [
       /* @__PURE__ */ r("p", { className: Zt.title, children: e }),
       t && /* @__PURE__ */ r("p", { className: Zt.description, children: t })
@@ -2451,7 +2451,7 @@ const gm = "_menuContent_1j71o_1", fm = "_menuSubContent_1j71o_2", vm = "_slideD
         return /* @__PURE__ */ r(
           "div",
           {
-            className: C(
+            className: v(
               W.menuItem,
               W[`menuItem-size-${s}`]
             ),
@@ -2472,7 +2472,7 @@ const gm = "_menuContent_1j71o_1", fm = "_menuSubContent_1j71o_2", vm = "_slideD
         return /* @__PURE__ */ r(
           n.Label,
           {
-            className: C(
+            className: v(
               W.menuLabel,
               W[`menuLabel-size-${s}`]
             ),
@@ -2485,7 +2485,7 @@ const gm = "_menuContent_1j71o_1", fm = "_menuSubContent_1j71o_2", vm = "_slideD
           /* @__PURE__ */ g(
             n.SubTrigger,
             {
-              className: C(
+              className: v(
                 W.menuSubTrigger,
                 W[`menuSubTrigger-size-${s}`],
                 {
@@ -2507,7 +2507,7 @@ const gm = "_menuContent_1j71o_1", fm = "_menuSubContent_1j71o_2", vm = "_slideD
         return /* @__PURE__ */ g(
           n.Item,
           {
-            className: C(
+            className: v(
               W.menuItem,
               W[`menuItem-size-${s}`],
               {
@@ -2547,7 +2547,7 @@ const gm = "_menuContent_1j71o_1", fm = "_menuSubContent_1j71o_2", vm = "_slideD
             onSelect: (l) => {
               o || l.preventDefault();
             },
-            className: C(
+            className: v(
               W.menuItem,
               W.menuCheckboxItem,
               {
@@ -2606,7 +2606,7 @@ const gm = "_menuContent_1j71o_1", fm = "_menuSubContent_1j71o_2", vm = "_slideD
     (e == null ? void 0 : e.length) > 0 && /* @__PURE__ */ r(
       Yl,
       {
-        className: C(W.menuContent, t),
+        className: v(W.menuContent, t),
         side: l.side,
         align: l.align,
         sideOffset: 5,
@@ -2641,7 +2641,7 @@ const Km = "_MoreButton_ats8z_1", Gm = "_hovered_ats8z_29", Xm = "_icon_ats8z_39
   "button",
   {
     type: "button",
-    className: C(hs.MoreButton, n, {
+    className: v(hs.MoreButton, n, {
       [hs.hovered]: t
     }),
     "aria-label": e,
@@ -2689,25 +2689,25 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
   renderDataCell: k
 }) {
   var S;
-  const v = ee(!1), m = (b) => {
-    b.shiftKey ? (b.preventDefault(), A == null || A(e, t)) : u == null || u(e);
-  }, f = (b) => {
-    b.stopPropagation(), b.shiftKey && (b.preventDefault(), v.current = !0, A == null || A(e, t), setTimeout(() => {
-      v.current = !1;
+  const f = ee(!1), m = (B) => {
+    B.shiftKey ? (B.preventDefault(), A == null || A(e, t)) : u == null || u(e);
+  }, C = (B) => {
+    B.stopPropagation(), B.shiftKey && (B.preventDefault(), f.current = !0, A == null || A(e, t), setTimeout(() => {
+      f.current = !1;
     }, 0));
-  }, E = (b) => {
-    b.stopPropagation(), b.shiftKey ? (b.preventDefault(), A == null || A(e, t)) : h == null || h(e.id, !a);
-  }, B = (b) => {
-    if (v.current) {
-      v.current = !1;
+  }, E = (B) => {
+    B.stopPropagation(), B.shiftKey ? (B.preventDefault(), A == null || A(e, t)) : h == null || h(e.id, !a);
+  }, b = (B) => {
+    if (f.current) {
+      f.current = !1;
       return;
     }
-    h == null || h(e.id, b === !0);
+    h == null || h(e.id, B === !0);
   }, I = a && i === 1;
   return /* @__PURE__ */ g(
     es,
     {
-      className: C({
+      className: v({
         [Y.rowSelected]: a,
         [Y.showDropdownOnSelect]: I
       }),
@@ -2725,34 +2725,34 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
               {
                 size: "1",
                 checked: a,
-                onClick: f,
-                onCheckedChange: B,
-                className: C(Y.checkboxCell, {
+                onClick: C,
+                onCheckedChange: b,
+                className: v(Y.checkboxCell, {
                   [Y.showCheckboxCell]: a || o
                 })
               }
             )
           }
         ),
-        s.map((b, w) => /* @__PURE__ */ r(
+        s.map((B, w) => /* @__PURE__ */ r(
           Ht,
           {
-            className: C(
+            className: v(
               Y.projectCell,
               w === 0 ? Y.columnProject : Y.dataColumn,
-              { [Y.sortedColumn]: l === b.id }
+              { [Y.sortedColumn]: l === B.id }
             ),
-            "data-column-id": b.id,
-            "data-sorted": l === b.id,
+            "data-column-id": B.id,
+            "data-sorted": l === B.id,
             onClick: m,
-            children: w === 0 ? p(e) : k(e, b, w)
+            children: w === 0 ? p(e) : k(e, B, w)
           },
-          b.id
+          B.id
         )),
         c && /* @__PURE__ */ r(
           Ht,
           {
-            className: C(Y.projectCell, Y.dropdownColumn, Y.dropdownColumnCell),
+            className: v(Y.projectCell, Y.dropdownColumn, Y.dropdownColumnCell),
             "data-column-id": "actions",
             children: (S = e.dropdownOptions) != null && S.length ? /* @__PURE__ */ r(
               gn,
@@ -2761,7 +2761,7 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
                   ss,
                   {
                     "aria-label": `More options for ${e.title}`,
-                    className: C(Y.dropdownTriggerWrapperIcon, Y.dropdownColumnCell)
+                    className: v(Y.dropdownTriggerWrapperIcon, Y.dropdownColumnCell)
                   }
                 ) }),
                 options: e.dropdownOptions,
@@ -2789,7 +2789,7 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
   stickyBodyOffset: A = 0,
   ...p
 }) => {
-  const [k, v] = q(!1), m = ee(null), f = i == null ? void 0 : i.field, E = _(() => new Set(s), [s]), B = N((R) => E.has(R), [E]), I = s.length, S = (t == null ? void 0 : t.length) ?? 0, b = I > 0, w = S > 0 && I === S, Q = _(
+  const [k, f] = q(!1), m = ee(null), C = i == null ? void 0 : i.field, E = _(() => new Set(s), [s]), b = N((R) => E.has(R), [E]), I = s.length, S = (t == null ? void 0 : t.length) ?? 0, B = I > 0, w = S > 0 && I === S, Q = _(
     () => t == null ? void 0 : t.some((R) => {
       var H;
       return (H = R.dropdownOptions) == null ? void 0 : H.length;
@@ -2838,9 +2838,9 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
     ] })
   ] }), []), U = N(
     (R) => {
-      b && !w ? c == null || c(!1) : c == null || c(R === !0);
+      B && !w ? c == null || c(!1) : c == null || c(R === !0);
     },
-    [b, w, c]
+    [B, w, c]
   ), J = N((R, H, ae) => {
     var le;
     const Re = (R == null ? void 0 : R[H.id]) ?? (R == null ? void 0 : R[`${H.id}Formatted`]), xe = ((le = H.render) == null ? void 0 : le.call(H, { row: R, value: Re, column: H, index: ae })) ?? Re;
@@ -2849,7 +2849,7 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
   return /* @__PURE__ */ g(
     vr,
     {
-      className: C(Y.DataTable, n),
+      className: v(Y.DataTable, n),
       size: "1",
       style: {
         "--datatable-sticky-offset": G,
@@ -2861,14 +2861,14 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
         /* @__PURE__ */ r(
           Cr,
           {
-            onMouseEnter: () => v(!0),
-            onMouseLeave: () => v(!1),
+            onMouseEnter: () => f(!0),
+            onMouseLeave: () => f(!1),
             children: /* @__PURE__ */ g(es, { className: Y.headerRow, children: [
               /* @__PURE__ */ r(
                 Ht,
                 {
-                  className: C(Y.checkboxCell, Y.selectColumn, {
-                    [Y.showCheckboxHeader]: k || b
+                  className: v(Y.checkboxCell, Y.selectColumn, {
+                    [Y.showCheckboxHeader]: k || B
                   }),
                   children: /* @__PURE__ */ r(
                     ns,
@@ -2876,7 +2876,7 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
                       size: "1",
                       checked: w,
                       onCheckedChange: U,
-                      ...b && !w ? { checked: "indeterminate" } : {}
+                      ...B && !w ? { checked: "indeterminate" } : {}
                     }
                   )
                 }
@@ -2884,10 +2884,10 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
               e.map((R, H) => /* @__PURE__ */ r(
                 Pn,
                 {
-                  className: C(Y.columnHeaderCell, {
+                  className: v(Y.columnHeaderCell, {
                     [Y.columnProject]: H === 0,
                     [Y.dataColumn]: H !== 0,
-                    [Y.sortedColumn]: Ur(f) === Ur(R.id)
+                    [Y.sortedColumn]: Ur(C) === Ur(R.id)
                   }),
                   children: /* @__PURE__ */ g(y, { align: "center", gap: "3", height: "24px", children: [
                     H === 0 ? /* @__PURE__ */ r(j, { size: "2", className: Y.headerTextFirst, children: R.label }) : /* @__PURE__ */ g(
@@ -2898,14 +2898,14 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
                         onClick: () => O(R.id),
                         children: [
                           /* @__PURE__ */ r(j, { size: "2", children: R.label }),
-                          f === R.id && ((i == null ? void 0 : i.sort) === "DESC" ? /* @__PURE__ */ r(oc, { width: 16, height: 16 }) : /* @__PURE__ */ r(ic, { width: 16, height: 16 }))
+                          C === R.id && ((i == null ? void 0 : i.sort) === "DESC" ? /* @__PURE__ */ r(oc, { width: 16, height: 16 }) : /* @__PURE__ */ r(ic, { width: 16, height: 16 }))
                         ]
                       }
                     ),
                     H === 0 && o && /* @__PURE__ */ r(y, { gap: "2", className: Y.headerActions, children: o({
                       selectedCount: I,
                       total: S,
-                      anySelected: b,
+                      anySelected: B,
                       allSelected: w
                     }) })
                   ] })
@@ -2927,10 +2927,10 @@ const Ym = "_DataTable_17x9s_1", Zm = "_titleText_17x9s_23", _m = "_artistText_1
             row: R,
             rowIndex: H,
             columns: e,
-            isSelected: B(R.id),
-            anyRowSelected: b,
+            isSelected: b(R.id),
+            anyRowSelected: B,
             selectedCount: I,
-            sortedKey: f,
+            sortedKey: C,
             hasDropdownOptions: Q,
             onRowClick: T,
             onSelectRow: z,
@@ -2968,12 +2968,12 @@ const yg = "_hasTriggerWithoutClick_4fnob_1", kg = "_hasLeftColor_4fnob_10", Eg
   const [u, h] = q(!1), A = (p) => {
     a && (p.preventDefault(), p.stopPropagation(), a(p));
   };
-  return /* @__PURE__ */ r(y, { className: C(Ue.container, t), ...c, children: /* @__PURE__ */ g(la, { open: o, onOpenChange: i, modal: !0, children: [
+  return /* @__PURE__ */ r(y, { className: v(Ue.container, t), ...c, children: /* @__PURE__ */ g(la, { open: o, onOpenChange: i, modal: !0, children: [
     a && /* @__PURE__ */ r(
       y,
       {
         as: "button",
-        className: C({
+        className: v({
           [Ue.triggerWithClick]: a,
           [Ue.hasLeftColor]: l
         }),
@@ -3003,7 +3003,7 @@ const yg = "_hasTriggerWithoutClick_4fnob_1", kg = "_hasLeftColor_4fnob_10", Eg
     /* @__PURE__ */ r(ca, { asChild: !0, children: /* @__PURE__ */ g(
       "div",
       {
-        className: C({
+        className: v({
           [Ue.hover]: u,
           [Ue.hasLeftColor]: l,
           [Ue.hasTriggerWithClick]: a,
@@ -3032,7 +3032,7 @@ const yg = "_hasTriggerWithoutClick_4fnob_1", kg = "_hasLeftColor_4fnob_10", Eg
           s && /* @__PURE__ */ r(
             "span",
             {
-              className: C(Ue.separator, {
+              className: v(Ue.separator, {
                 [Ue.hasLeftColor]: l
               })
             }
@@ -3042,7 +3042,7 @@ const yg = "_hasTriggerWithoutClick_4fnob_1", kg = "_hasLeftColor_4fnob_10", Eg
             {
               width: 8,
               height: 8,
-              className: C(Ue.chevron, {
+              className: v(Ue.chevron, {
                 [Ue.hover]: u
               })
             }
@@ -3096,7 +3096,7 @@ const zs = ({ children: n, ...e }) => /* @__PURE__ */ r(
             $l,
             {
               asChild: !0,
-              className: C(W.menuTrigger, {
+              className: v(W.menuTrigger, {
                 [W.showActiveTrigger]: s
               }),
               disabled: i,
@@ -3106,7 +3106,7 @@ const zs = ({ children: n, ...e }) => /* @__PURE__ */ r(
           l ? /* @__PURE__ */ r(br, { className: W.menuPortal, children: /* @__PURE__ */ r(zs, { asChild: !0, children: /* @__PURE__ */ r(
             Br,
             {
-              className: C(W.menuContent, t),
+              className: v(W.menuContent, t),
               size: a,
               side: A.side,
               align: A.align,
@@ -3136,7 +3136,7 @@ const zs = ({ children: n, ...e }) => /* @__PURE__ */ r(
           ) }) }) : /* @__PURE__ */ r(br, { className: W.menuPortal, children: /* @__PURE__ */ r(zs, { asChild: !0, children: /* @__PURE__ */ r(
             Br,
             {
-              className: C(W.menuContent, t),
+              className: v(W.menuContent, t),
               size: a,
               side: A.side,
               align: A.align,
@@ -3275,7 +3275,7 @@ function Dg({ initialScreen: n, animated: e, children: t }) {
   }, [e]), k = N(
     (T, D = {}) => p((z) => [...z, { name: T, params: D }], "forward"),
     [p]
-  ), v = N(
+  ), f = N(
     () => p((T) => T.length > 1 ? T.slice(0, -1) : T, "back"),
     [p]
   ), m = N(
@@ -3285,15 +3285,15 @@ function Dg({ initialScreen: n, animated: e, children: t }) {
       return D.slice(0, z + 1);
     }, "back"),
     [p]
-  ), f = N(
+  ), C = N(
     (T) => p(() => [{ name: T || n, params: {} }]),
     [p, n]
-  ), E = s.length > 1, B = _(
-    () => ({ push: k, pop: v, popTo: m, reset: f, canGoBack: E, stack: s }),
-    [k, v, m, f, E, s]
+  ), E = s.length > 1, b = _(
+    () => ({ push: k, pop: f, popTo: m, reset: C, canGoBack: E, stack: s }),
+    [k, f, m, C, E, s]
   ), I = s[s.length - 1], S = A[I.name];
   if (!S) return null;
-  const b = (T, D) => T in o ? o[T] : S[T] ?? D, w = S.component, Q = N(
+  const B = (T, D) => T in o ? o[T] : S[T] ?? D, w = S.component, Q = N(
     (T) => {
       u.current[u.current.length - 1].name === I.name && i((z) => ({ ...z, ...T }));
     },
@@ -3302,16 +3302,16 @@ function Dg({ initialScreen: n, animated: e, children: t }) {
     () => ({ name: I.name, params: I.params || {}, setOptions: Q }),
     [I.name, I.params, Q]
   );
-  return /* @__PURE__ */ r(vi.Provider, { value: B, children: /* @__PURE__ */ g("div", { style: { display: "flex", flexDirection: "column", flex: 1, minHeight: 0 }, children: [
+  return /* @__PURE__ */ r(vi.Provider, { value: b, children: /* @__PURE__ */ g("div", { style: { display: "flex", flexDirection: "column", flex: 1, minHeight: 0 }, children: [
     /* @__PURE__ */ r(
       yi,
       {
-        title: b("title"),
-        onBack: E ? v : void 0,
-        headerLeft: b("headerLeft"),
-        headerRight: b("headerRight"),
-        allowClose: b("allowClose", !0),
-        onClose: b("onClose")
+        title: B("title"),
+        onBack: E ? f : void 0,
+        headerLeft: B("headerLeft"),
+        headerRight: B("headerRight"),
+        allowClose: B("allowClose", !0),
+        onClose: B("onClose")
       }
     ),
     /* @__PURE__ */ r(
@@ -3367,7 +3367,7 @@ const Jg = "_floatingBanner_uvpwv_1", Pg = "_white_uvpwv_12", Ug = "_error_uvpwv
   return /* @__PURE__ */ g(
     "div",
     {
-      className: C(Ne.floatingBanner, h, {
+      className: v(Ne.floatingBanner, h, {
         [Ne.white]: e === "white",
         [Ne.error]: e === "error",
         [Ne.warning]: e === "warning",
@@ -3378,7 +3378,7 @@ const Jg = "_floatingBanner_uvpwv_1", Pg = "_white_uvpwv_12", Ug = "_error_uvpwv
         /* @__PURE__ */ g(
           "div",
           {
-            className: C(Ne.container, {
+            className: v(Ne.container, {
               [Ne.column]: l
             }),
             children: [
@@ -3386,7 +3386,7 @@ const Jg = "_floatingBanner_uvpwv_1", Pg = "_white_uvpwv_12", Ug = "_error_uvpwv
                 t && /* @__PURE__ */ r(
                   "p",
                   {
-                    className: C(Ne.title, {
+                    className: v(Ne.title, {
                       [Ne.strong]: !!i
                     }),
                     children: t
@@ -3507,7 +3507,7 @@ const Zg = "_messageWithActionInfo_152jv_1", _g = "_messageWithAction_152jv_1",
   {
     size: "1",
     color: n === "error" ? "red" : n === "warn" ? "yellow" : "gray",
-    className: C(a, {
+    className: v(a, {
       [Or.messageWithActionInfo]: !o,
       [Or.messageWithAction]: o
     }),
@@ -3556,7 +3556,7 @@ function at({
             {
               size: "2",
               truncate: !0,
-              className: C(_e.neutral12, _e.truncate, {
+              className: v(_e.neutral12, _e.truncate, {
                 [_e.trucateWithInterval]: s
               }),
               children: n
@@ -3609,7 +3609,7 @@ const af = "_group_1wxsi_1", kn = {
     },
     u
   ) });
-  return /* @__PURE__ */ g(y, { className: C(n), style: s, gap: "3", children: [
+  return /* @__PURE__ */ g(y, { className: v(n), style: s, gap: "3", children: [
     o.length > 0 && o.map((c, u) => /* @__PURE__ */ r(
       y,
       {
@@ -3744,8 +3744,8 @@ const VS = os, lf = "_sliderRoot_7wkh4_23", cf = "_sliderTrack_7wkh4_31", df = "
 }, Ii = ({ onChangeValue: n, volume: e, disabled: t }) => {
   const [s, a] = q(!1), o = ee(), i = ee(0), l = N((S) => {
     if (S < 1e-3) return -1 / 0;
-    const b = 20 * Math.log10(S);
-    return b < -60 ? -60 : b;
+    const B = 20 * Math.log10(S);
+    return B < -60 ? -60 : B;
   }, []), c = N((S) => S === -1 / 0 || S <= -60 ? 0 : Math.pow(10, S / 20), []), u = _(() => {
     const S = l(e);
     return S === -1 / 0 ? -60 : Math.max(-60, Math.min(6, S));
@@ -3760,18 +3760,18 @@ const VS = os, lf = "_sliderRoot_7wkh4_23", cf = "_sliderTrack_7wkh4_31", df = "
       (S.key === "ArrowUp" || S.key === "ArrowDown") && A(), (S.key === "ArrowLeft" || S.key === "ArrowRight") && (S.preventDefault(), S.stopPropagation(), A());
     },
     [A]
-  ), v = N(
+  ), f = N(
     (S) => {
       n(S.map(c));
     },
     [n, c]
   ), m = N(() => {
     A();
-  }, [A]), f = N(() => {
+  }, [A]), C = N(() => {
     p();
   }, [p]), E = N(() => {
     n([1]), A();
-  }, [n, A]), B = N(() => {
+  }, [n, A]), b = N(() => {
     const S = Date.now();
     S - i.current < 300 && E(), i.current = S;
   }, [E]), I = _(
@@ -3789,9 +3789,9 @@ const VS = os, lf = "_sliderRoot_7wkh4_23", cf = "_sliderTrack_7wkh4_31", df = "
       max: 6,
       step: 0.1,
       value: [h ? -60 : u],
-      onValueChange: v,
+      onValueChange: f,
       onPointerDown: m,
-      onPointerUp: f,
+      onPointerUp: C,
       disabled: t,
       children: /* @__PURE__ */ g("div", { className: kt.sliderContainer, children: [
         /* @__PURE__ */ r(ho, { className: kt.sliderTrack, children: /* @__PURE__ */ r(po, { className: kt.sliderRange }) }),
@@ -3802,8 +3802,8 @@ const VS = os, lf = "_sliderRoot_7wkh4_23", cf = "_sliderTrack_7wkh4_31", df = "
               className: kt.sliderThumb,
               onPointerDown: m,
               onKeyDown: k,
-              onBlur: f,
-              onClick: B
+              onBlur: C,
+              onClick: b
             }
           ) }),
           /* @__PURE__ */ r(
@@ -3842,7 +3842,7 @@ const VS = os, lf = "_sliderRoot_7wkh4_23", cf = "_sliderTrack_7wkh4_31", df = "
   return /* @__PURE__ */ g(
     $n,
     {
-      className: C(_t.RadioCardsRoot, c),
+      className: v(_t.RadioCardsRoot, c),
       columns: a,
       defaultValue: e,
       value: h,
@@ -3850,7 +3850,7 @@ const VS = os, lf = "_sliderRoot_7wkh4_23", cf = "_sliderTrack_7wkh4_31", df = "
       ...u,
       children: [
         n.map((p, k) => {
-          const v = p.Icon ?? p.icon, m = p.text ?? p.label ?? p.children;
+          const f = p.Icon ?? p.icon, m = p.text ?? p.label ?? p.children;
           return /* @__PURE__ */ r(
             mn,
             {
@@ -3858,7 +3858,7 @@ const VS = os, lf = "_sliderRoot_7wkh4_23", cf = "_sliderTrack_7wkh4_31", df = "
               disabled: p.disabled || !1,
               className: _t.RadioCardsItem,
               children: /* @__PURE__ */ g(y, { align: "center", gap: "3", className: _t.RadioCardsContent, children: [
-                v && /* @__PURE__ */ r("span", { className: _t.icon, children: typeof v == "function" ? /* @__PURE__ */ r(v, {}) : v }),
+                f && /* @__PURE__ */ r("span", { className: _t.icon, children: typeof f == "function" ? /* @__PURE__ */ r(f, {}) : f }),
                 m && /* @__PURE__ */ r(P, { as: "span", size: "2", weight: "regular", className: _t.text, children: m }),
                 p.children
               ] })
@@ -3991,10 +3991,10 @@ const wn = 19.5, Rn = 19.5, Fr = 14, Hr = 18, bf = [
       if (I.preventDefault(), I.stopPropagation(), t) return;
       const S = I.wheelDelta ?? -I.deltaY * 25;
       if (!S || Math.abs(S) <= 50) return;
-      const b = Date.now();
-      if (b - A.current < 100) return;
+      const B = Date.now();
+      if (B - A.current < 100) return;
       const w = S > 0 ? 1 : -1, Q = Wr(n, s, w);
-      e(Q), A.current = b;
+      e(Q), A.current = B;
     },
     [e, n, s, t]
   ), k = N(
@@ -4006,25 +4006,25 @@ const wn = 19.5, Rn = 19.5, Fr = 14, Hr = 18, bf = [
       I.preventDefault(), c(!0), h(I.clientY);
     },
     [t]
-  ), v = N(
+  ), f = N(
     (I) => {
       if (!l || t) return;
       const S = u - I.clientY;
       if (Math.abs(S) <= 20) return;
-      const b = S > 0 ? 1 : -1, w = Wr(n, s, b);
+      const B = S > 0 ? 1 : -1, w = Wr(n, s, B);
       e(w), h(I.clientY), A.current = Date.now();
     },
     [l, u, n, e, s, t]
   ), m = N(() => {
     c(!1);
-  }, []), f = N(() => {
+  }, []), C = N(() => {
     c(!1);
   }, []), E = N(
     (I) => {
       I.detail === 2 && !t && e(a);
     },
     [e, a, t]
-  ), B = N(
+  ), b = N(
     (I) => {
       if (!o || t) return;
       const S = Bf(s, I);
@@ -4032,11 +4032,11 @@ const wn = 19.5, Rn = 19.5, Fr = 14, Hr = 18, bf = [
     },
     [o, t, e, s]
   );
-  return Ot("wheel", p, i), Ot("mousedown", k, i), Ot("mousemove", v), Ot("mouseup", m), Ot("mouseleave", f), {
+  return Ot("wheel", p, i), Ot("mousedown", k, i), Ot("mousemove", f), Ot("mouseup", m), Ot("mouseleave", C), {
     containerRef: i,
     isDragging: l,
     handleClick: E,
-    handleDotClick: B
+    handleDotClick: b
   };
 }, xf = ({
   className: n,
@@ -4056,22 +4056,22 @@ const wn = 19.5, Rn = 19.5, Fr = 14, Hr = 18, bf = [
     dots: o || [],
     defaultDot: c,
     clickableDots: a
-  }), k = _(() => typeof e == "object" && e !== null ? e.position : wf(e, o), [e, o]), { pointerRotation: v, pointerColor: m } = _(() => Rf(k, s), [k, s]), f = (E) => {
-    const B = jr[E.color] || jr.neutral, I = E.position === k, S = i === E.position && a;
-    return s ? B.default : I ? B.active : S ? B.hover : B.default;
+  }), k = _(() => typeof e == "object" && e !== null ? e.position : wf(e, o), [e, o]), { pointerRotation: f, pointerColor: m } = _(() => Rf(k, s), [k, s]), C = (E) => {
+    const b = jr[E.color] || jr.neutral, I = E.position === k, S = i === E.position && a;
+    return s ? b.default : I ? b.active : S ? b.hover : b.default;
   };
   return /* @__PURE__ */ r(
     "div",
     {
       ref: u,
-      className: C(En.content, n),
+      className: v(En.content, n),
       "data-no-drag": "true",
       onClick: A,
       style: { cursor: s ? "default" : "ns-resize" },
       children: /* @__PURE__ */ r(
         "div",
         {
-          className: C(
+          className: v(
             En.pan,
             h && En.active,
             s && En.disabled
@@ -4091,7 +4091,7 @@ const wn = 19.5, Rn = 19.5, Fr = 14, Hr = 18, bf = [
             /* @__PURE__ */ r(
               "g",
               {
-                transform: `rotate(${v} ${wn} ${Rn})`,
+                transform: `rotate(${f} ${wn} ${Rn})`,
                 children: /* @__PURE__ */ r(
                   "path",
                   {
@@ -4104,15 +4104,15 @@ const wn = 19.5, Rn = 19.5, Fr = 14, Hr = 18, bf = [
               }
             ),
             o == null ? void 0 : o.map((E) => {
-              const B = Bi[E.position];
-              if (!B) return null;
-              const I = f(E), S = a && !s;
+              const b = Bi[E.position];
+              if (!b) return null;
+              const I = C(E), S = a && !s;
               return /* @__PURE__ */ g(ge.Fragment, { children: [
                 S && /* @__PURE__ */ r(
                   "circle",
                   {
-                    cx: B.x,
-                    cy: B.y,
+                    cx: b.x,
+                    cy: b.y,
                     r: 4,
                     style: {
                       cursor: "pointer",
@@ -4120,16 +4120,16 @@ const wn = 19.5, Rn = 19.5, Fr = 14, Hr = 18, bf = [
                     },
                     onMouseEnter: () => l(E.position),
                     onMouseLeave: () => l(null),
-                    onClick: (b) => {
-                      b.stopPropagation(), p(E.position);
+                    onClick: (B) => {
+                      B.stopPropagation(), p(E.position);
                     }
                   }
                 ),
                 /* @__PURE__ */ r(
                   "circle",
                   {
-                    cx: B.x,
-                    cy: B.y,
+                    cx: b.x,
+                    cy: b.y,
                     r: 1,
                     fill: I,
                     style: {
@@ -4143,8 +4143,8 @@ const wn = 19.5, Rn = 19.5, Fr = 14, Hr = 18, bf = [
                     onMouseLeave: () => {
                       S && l(null);
                     },
-                    onClick: (b) => {
-                      S && (b.stopPropagation(), p(E.position));
+                    onClick: (B) => {
+                      S && (B.stopPropagation(), p(E.position));
                     }
                   }
                 )
@@ -4340,20 +4340,20 @@ const wi = ({
   ...i
 }) => {
   const l = _(() => Object.keys(Os), []), c = _(() => Object.keys(Ms), []), { color: u, graphic: h } = _(() => {
-    let v = n, m = e;
+    let f = n, m = e;
     if (a) {
-      const f = Pv(a);
-      v = v || f.color, m = m || f.graphic;
+      const C = Pv(a);
+      f = f || C.color, m = m || C.graphic;
     }
-    if (!v) {
-      const f = Math.floor(Math.random() * l.length);
-      v = l[f];
+    if (!f) {
+      const C = Math.floor(Math.random() * l.length);
+      f = l[C];
     }
     if (!m) {
-      const f = Math.floor(Math.random() * c.length);
-      m = c[f];
+      const C = Math.floor(Math.random() * c.length);
+      m = c[C];
     }
-    return { color: v, graphic: m };
+    return { color: f, graphic: m };
   }, [n, e, a, l, c]), A = Os[u], p = Ms[h], k = _(
     () => ({
       background: A.gradient,
@@ -4366,7 +4366,7 @@ const wi = ({
     {
       width: t + "px",
       height: s + "px",
-      className: C(o),
+      className: v(o),
       style: k,
       ...i,
       children: /* @__PURE__ */ r("img", { src: p, alt: h, width: t, height: s })
@@ -4389,18 +4389,18 @@ const Uv = ({
   size: A = "1",
   ...p
 }) => {
-  const k = (o == null ? void 0 : o.id) || a, v = (o == null ? void 0 : o.name) || t, m = (o == null ? void 0 : o.description) || s, f = (o == null ? void 0 : o.image) || e, E = (o == null ? void 0 : o.icon) || l, B = f && (f != null && f.startsWith("url(")) ? f == null ? void 0 : f.substring(4, (f == null ? void 0 : f.length) - 1).replace(/"/g, "") : f, I = (Q) => {
+  const k = (o == null ? void 0 : o.id) || a, f = (o == null ? void 0 : o.name) || t, m = (o == null ? void 0 : o.description) || s, C = (o == null ? void 0 : o.image) || e, E = (o == null ? void 0 : o.icon) || l, b = C && (C != null && C.startsWith("url(")) ? C == null ? void 0 : C.substring(4, (C == null ? void 0 : C.length) - 1).replace(/"/g, "") : C, I = (Q) => {
     Q.stopPropagation(), Q.preventDefault(), h == null || h();
   }, S = {
     1: { avatar: 60, icon: 15 },
     2: { avatar: 68, icon: 15 },
     3: { avatar: 80, icon: 15 }
-  }, b = typeof A == "string" ? parseInt(A, 10) : A, w = S[b] || S[1];
+  }, B = typeof A == "string" ? parseInt(A, 10) : A, w = S[B] || S[1];
   return /* @__PURE__ */ r(
     mn,
     {
       value: k,
-      className: C(
+      className: v(
         n,
         $.listCardsItem,
         $[`listCardsItemSize${A}`]
@@ -4414,7 +4414,7 @@ const Uv = ({
           wi,
           {
             id: k,
-            className: C(
+            className: v(
               $.listCardsAvatar,
               $[`listCardsAvatarSize${A}`]
             ),
@@ -4424,7 +4424,7 @@ const Uv = ({
         ) : c ? /* @__PURE__ */ r(
           "div",
           {
-            className: C(
+            className: v(
               $.listCardsAvatarIcon,
               $[`listCardsAvatarIconSize${A}`]
             ),
@@ -4433,7 +4433,7 @@ const Uv = ({
         ) : E ? /* @__PURE__ */ r(
           "div",
           {
-            className: C(
+            className: v(
               $.listCardsAvatarIcon,
               $[`listCardsAvatarIconSize${A}`]
             ),
@@ -4442,15 +4442,15 @@ const Uv = ({
         ) : /* @__PURE__ */ r(
           We,
           {
-            src: B,
-            className: C(
+            src: b,
+            className: v(
               $.listCardsAvatar,
               $[`listCardsAvatarSize${A}`]
             )
           }
         ) }),
         /* @__PURE__ */ g(y, { direction: "column", justify: "center", gap: "1", children: [
-          /* @__PURE__ */ r(P, { as: "div", size: "2", className: $.listCardsItemText, children: v }),
+          /* @__PURE__ */ r(P, { as: "div", size: "2", className: $.listCardsItemText, children: f }),
           /* @__PURE__ */ r(
             P,
             {
@@ -4479,13 +4479,13 @@ const Uv = ({
   children: A,
   ...p
 }) => {
-  const k = (a == null ? void 0 : a.id) || s, v = (a == null ? void 0 : a.name) || t, m = (a == null ? void 0 : a.avatar) || e, f = m && (m != null && m.startsWith("url(")) ? m == null ? void 0 : m.substring(4, (m == null ? void 0 : m.length) - 1).replace(/"/g, "") : m;
+  const k = (a == null ? void 0 : a.id) || s, f = (a == null ? void 0 : a.name) || t, m = (a == null ? void 0 : a.avatar) || e, C = m && (m != null && m.startsWith("url(")) ? m == null ? void 0 : m.substring(4, (m == null ? void 0 : m.length) - 1).replace(/"/g, "") : m;
   return /* @__PURE__ */ g("div", { className: $.cardWrapper, children: [
     /* @__PURE__ */ r(
       mn,
       {
         value: k,
-        className: C(n, $.listCardsItem),
+        className: v(n, $.listCardsItem),
         style: {
           "--color-surface": "transparent",
           width: "100%",
@@ -4503,9 +4503,9 @@ const Uv = ({
               overflow: "hidden"
             },
             children: [
-              !c && /* @__PURE__ */ r(We, { src: f, className: $.listCardsAvatar }),
+              !c && /* @__PURE__ */ r(We, { src: C, className: $.listCardsAvatar }),
               /* @__PURE__ */ g(y, { direction: "column", justify: "center", children: [
-                /* @__PURE__ */ r(P, { as: "div", size: "2", className: $.listCardsItemText, children: v }),
+                /* @__PURE__ */ r(P, { as: "div", size: "2", className: $.listCardsItemText, children: f }),
                 /* @__PURE__ */ r(
                   y,
                   {
@@ -4534,7 +4534,7 @@ const Uv = ({
         onClick: c ? (E) => {
           E.stopPropagation(), E.preventDefault(), c(E);
         } : void 0,
-        children: u ? /* @__PURE__ */ r("div", { className: $.avatarContent, children: u }) : /* @__PURE__ */ r(We, { src: f, className: $.listCardsAvatar })
+        children: u ? /* @__PURE__ */ r("div", { className: $.avatarContent, children: u }) : /* @__PURE__ */ r(We, { src: C, className: $.listCardsAvatar })
       }
     ) }),
     /* @__PURE__ */ r("div", { className: $.cardActions, children: /* @__PURE__ */ g(
@@ -4549,7 +4549,7 @@ const Uv = ({
           i && /* @__PURE__ */ r(
             "div",
             {
-              className: C(
+              className: v(
                 $.favoriteButton,
                 $.seeDetailsButton
               ),
@@ -4562,7 +4562,7 @@ const Uv = ({
           l && /* @__PURE__ */ r(
             "div",
             {
-              className: C(
+              className: v(
                 $.buttonGhost,
                 $.seeDetailsButton
               ),
@@ -4683,8 +4683,8 @@ const qS = ({
   placeholder: A = "Select options...",
   ...p
 }) => {
-  const k = (v) => {
-    t && t(v);
+  const k = (f) => {
+    t && t(f);
   };
   return /* @__PURE__ */ g(he, { width: "100%", children: [
     e && /* @__PURE__ */ g(y, { mb: "2", align: "center", gap: "2", children: [
@@ -4694,7 +4694,7 @@ const qS = ({
     /* @__PURE__ */ r(y, { direction: "column", maxWidth: h, children: /* @__PURE__ */ g(
       hr,
       {
-        className: C(n),
+        className: v(n),
         disabled: l || c,
         ...p,
         children: [
@@ -4705,25 +4705,25 @@ const qS = ({
               color: "gray",
               size: o,
               placeholder: A,
-              className: C($e.selectTrigger, {
+              className: v($e.selectTrigger, {
                 [$e.ghost]: i === "ghost",
                 [$e.soft]: i === "soft"
               }),
               children: A
             }
           ),
-          /* @__PURE__ */ r(mr, { position: "popper", style: { height: u }, children: /* @__PURE__ */ r(gr, { children: s.map((v) => /* @__PURE__ */ g(
+          /* @__PURE__ */ r(mr, { position: "popper", style: { height: u }, children: /* @__PURE__ */ r(gr, { children: s.map((f) => /* @__PURE__ */ g(
             y,
             {
               align: "center",
               gap: "2",
               p: "2",
-              className: C($e.selectItem, {
+              className: v($e.selectItem, {
                 [$e.hideIndicator]: !0,
                 [$e.size1]: o === "1",
                 [$e.size2]: o === "2"
               }),
-              onClick: () => k(v.value),
+              onClick: () => k(f.value),
               style: {
                 cursor: l || c ? "not-allowed" : "pointer",
                 width: "100%"
@@ -4733,13 +4733,13 @@ const qS = ({
                   ns,
                   {
                     disabled: l || c,
-                    checked: v.isActived || !1,
+                    checked: f.isActived || !1,
                     size: o
                   }
                 ),
                 /* @__PURE__ */ g(y, { align: "center", gap: "1", style: { flex: 1 }, children: [
-                  /* @__PURE__ */ r(P, { size: o, style: { color: "var(--neutral-12)" }, children: v.label }),
-                  v.aiDetected && /* @__PURE__ */ r(
+                  /* @__PURE__ */ r(P, { size: o, style: { color: "var(--neutral-12)" }, children: f.label }),
+                  f.aiDetected && /* @__PURE__ */ r(
                     P,
                     {
                       size: "1",
@@ -4750,7 +4750,7 @@ const qS = ({
                       children: "✦"
                     }
                   ),
-                  v.extra && /* @__PURE__ */ g(
+                  f.extra && /* @__PURE__ */ g(
                     P,
                     {
                       size: o,
@@ -4760,14 +4760,14 @@ const qS = ({
                       },
                       children: [
                         " ",
-                        v.extra
+                        f.extra
                       ]
                     }
                   )
                 ] })
               ]
             },
-            v.value
+            f.value
           )) }) })
         ]
       }
@@ -4790,7 +4790,7 @@ const qv = "_customCard_1klw4_2", Kv = "_selected_1klw4_18", Gv = "_disabled_1kl
     cr,
     {
       onClick: l ? void 0 : o,
-      className: C(Ft.customCard, {
+      className: v(Ft.customCard, {
         [Ft.selected]: i,
         [Ft.disabled]: l
       }),
@@ -4835,7 +4835,7 @@ const qv = "_customCard_1klw4_2", Kv = "_selected_1klw4_18", Gv = "_disabled_1kl
 }) => /* @__PURE__ */ r(Qt, { height: "100%", width: "100%", scrollbars: "vertical", children: /* @__PURE__ */ r(
   he,
   {
-    className: C(Ft.gridContainer, s),
+    className: v(Ft.gridContainer, s),
     pr: "3",
     ...o,
     children: n.map((i) => /* @__PURE__ */ r(
@@ -4867,7 +4867,7 @@ const $v = "_content_15nbm_1", eC = "_pan_15nbm_13", tC = "_disabled_15nbm_26",
   minValue: a = -0.65,
   maxValue: o = 0.65
 }) => {
-  const i = ee(null), [l, c] = q(!1), u = ee(), [h, A] = q(!1), p = ee(null), k = ee(0), v = ee(e), m = ee(0), f = N(() => {
+  const i = ee(null), [l, c] = q(!1), u = ee(), [h, A] = q(!1), p = ee(null), k = ee(0), f = ee(e), m = ee(0), C = N(() => {
     clearTimeout(u.current), c(!0);
   }, []), E = N(() => {
     h || (u.current = setTimeout(() => c(!1), 300));
@@ -4875,17 +4875,17 @@ const $v = "_content_15nbm_1", eC = "_pan_15nbm_13", tC = "_disabled_15nbm_26",
   de(() => {
     if (h) {
       const U = document.createElement("style");
-      U.textContent = "* { cursor: ns-resize !important; }", document.head.appendChild(U), p.current = U, f();
+      U.textContent = "* { cursor: ns-resize !important; }", document.head.appendChild(U), p.current = U, C();
     } else
       p.current && (document.head.removeChild(p.current), p.current = null), E();
     return () => {
       p.current && (document.head.removeChild(p.current), p.current = null), E(), m.current && cancelAnimationFrame(m.current);
     };
-  }, [h, f, E]);
-  const B = N(
+  }, [h, C, E]);
+  const b = N(
     (U) => {
-      v.current = Lr(U), !m.current && (m.current = requestAnimationFrame(() => {
-        m.current = 0, t(v.current);
+      f.current = Lr(U), !m.current && (m.current = requestAnimationFrame(() => {
+        m.current = 0, t(f.current);
       }));
     },
     [t]
@@ -4895,9 +4895,9 @@ const $v = "_content_15nbm_1", eC = "_pan_15nbm_13", tC = "_disabled_15nbm_26",
       const J = U.wheelDelta ?? -U.deltaY * 25;
       if (!J) return;
       const x = e + (J > 0 ? ms : -ms);
-      B(x);
+      b(x);
     },
-    [e, B]
+    [e, b]
   );
   Ot("wheel", I, i);
   const S = N(
@@ -4909,21 +4909,21 @@ const $v = "_content_15nbm_1", eC = "_pan_15nbm_13", tC = "_disabled_15nbm_26",
       (x = J.setPointerCapture) == null || x.call(J, U.pointerId), A(!0), k.current = U.clientY;
     },
     [s]
-  ), b = N(
+  ), B = N(
     (U) => {
       if (!h) return;
       const J = k.current - U.clientY, x = e + J * ms;
-      B(x), k.current = U.clientY;
+      b(x), k.current = U.clientY;
     },
-    [h, e, B]
+    [h, e, b]
   ), w = N((U) => {
     var J, x;
     (x = (J = U.currentTarget) == null ? void 0 : J.releasePointerCapture) == null || x.call(J, U.pointerId), A(!1);
   }, []), Q = N(
     (U) => {
-      U.detail === 2 && B(0);
+      U.detail === 2 && b(0);
     },
-    [B]
+    [b]
   ), { arcPath: O, pointerRotation: T, arcColor: D, pointerColor: z } = _(() => {
     const U = Vr(e, a, o), J = Lr(U), x = ps + J * Math.PI, L = $t + Et * Math.cos(ps), G = en + Et * Math.sin(ps), Z = $t + Et * Math.cos(x), R = en + Et * Math.sin(x), H = 0, ae = J > 0 ? 1 : 0;
     return {
@@ -4942,7 +4942,7 @@ const $v = "_content_15nbm_1", eC = "_pan_15nbm_13", tC = "_disabled_15nbm_26",
     "div",
     {
       ref: i,
-      className: C(Dt.content, n),
+      className: v(Dt.content, n),
       "data-no-drag": "true",
       onClick: Q,
       style: { cursor: s ? "default" : "ns-resize" },
@@ -4950,13 +4950,13 @@ const $v = "_content_15nbm_1", eC = "_pan_15nbm_13", tC = "_disabled_15nbm_26",
         /* @__PURE__ */ r(On, { asChild: !0, children: /* @__PURE__ */ r(
           "div",
           {
-            className: C(
+            className: v(
               Dt.pan,
               h && Dt.active,
               s && Dt.disabled
             ),
             onPointerDown: S,
-            onPointerMove: b,
+            onPointerMove: B,
             onPointerUp: w,
             onPointerCancel: w,
             children: /* @__PURE__ */ g("svg", { width: 20, height: 20, viewBox: "0 0 20 20", fill: "none", children: [
@@ -5039,7 +5039,7 @@ const aC = "data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEAkACQAAD/2wBDAAEBAQEBAQEBA
       width: e,
       height: e,
       draggable: !1,
-      className: C(n),
+      className: v(n),
       ...a
     }
   );
@@ -5073,7 +5073,7 @@ const dC = "_navItem_6drgg_1", uC = "_navItemIcon_6drgg_12", AC = "_navItemConte
         py: "2",
         role: "button",
         tabIndex: 0,
-        className: C(et.navItem, {
+        className: v(et.navItem, {
           [et.navItemSelected]: c,
           [et.collapsed]: s
         }),
@@ -5086,7 +5086,7 @@ const dC = "_navItem_6drgg_1", uC = "_navItemIcon_6drgg_12", AC = "_navItemConte
           /* @__PURE__ */ g(
             "div",
             {
-              className: C(et.navItemContent, {
+              className: v(et.navItemContent, {
                 [et.navItemContentCollapsed]: s
               }),
               children: [
@@ -5141,7 +5141,7 @@ function NC({ className: n, user: e, collapsed: t, ...s }) {
       onMouseLeave: () => {
         o(!1);
       },
-      className: C(Ke.userProfile, { [Ke.collapsed]: t }, n),
+      className: v(Ke.userProfile, { [Ke.collapsed]: t }, n),
       align: "center",
       justify: t ? "center" : "between",
       ...s,
@@ -5181,7 +5181,7 @@ const xC = ({
   return /* @__PURE__ */ r(
     gn,
     {
-      className: C(Ke.profileMenu, n),
+      className: v(Ke.profileMenu, n),
       trigger: /* @__PURE__ */ r(NC, { user: e, collapsed: s }),
       options: t,
       side: i ? "top" : "right",
@@ -5248,6 +5248,7 @@ const xC = ({
       return /* @__PURE__ */ r(Ac, { width: 16, height: 16 });
   }
 }, xi = hn({
+  projects: [],
   onClickTrack: null,
   onInsertAllTracks: null,
   onProjectClick: null,
@@ -5266,6 +5267,7 @@ const xC = ({
     xi.Provider,
     {
       value: {
+        projects: e,
         onClickTrack: t,
         onInsertAllTracks: s,
         onProjectClick: a,
@@ -5284,21 +5286,21 @@ const xC = ({
   tracks: o = [],
   ...i
 }) => {
-  const { onClickTrack: l, onInsertAllTracks: c, onProjectClick: u, openedItem: h, setOpenedItem: A } = Wt(xi), [p, k] = q(!1), v = N(() => {
-    k(!1);
-    const f = projects.find((E) => E.id === n);
-    h === n ? (A(null), u == null || u(f, !1)) : (A(n), u == null || u(f, !0));
-  }, [n, h, A, u, projects]), m = N((f) => {
-    f.preventDefault(), f.stopPropagation(), k(!p);
-  }, [p]);
+  const { projects: l, onClickTrack: c, onInsertAllTracks: u, onProjectClick: h, openedItem: A, setOpenedItem: p } = Wt(xi), [k, f] = q(!1), m = N(() => {
+    f(!1);
+    const E = l.find((b) => b.id === n);
+    A === n ? (p(null), h == null || h(E, !1)) : (p(n), h == null || h(E, !0));
+  }, [n, A, p, h, l]), C = N((E) => {
+    E.preventDefault(), E.stopPropagation(), f(!k);
+  }, [k]);
   return /* @__PURE__ */ g(
     y,
     {
       direction: "column",
       gap: "2",
       p: "1",
-      className: `${Oe.item} ${h === n ? Oe.opened : ""}`,
-      onClick: v,
+      className: `${Oe.item} ${A === n ? Oe.opened : ""}`,
+      onClick: m,
       ...i,
       children: [
         /* @__PURE__ */ g(y, { direction: "row", gap: "3", children: [
@@ -5308,30 +5310,30 @@ const xC = ({
             t && /* @__PURE__ */ r(P, { size: "1", className: Oe.projectArtist, children: t })
           ] })
         ] }),
-        h === n && /* @__PURE__ */ g(y, { direction: "column", children: [
+        A === n && /* @__PURE__ */ g(y, { direction: "column", children: [
           o.length === 0 && /* @__PURE__ */ g(y, { direction: "row", gap: "3", p: "5", pt: "2", align: "center", justify: "center", children: [
             /* @__PURE__ */ r(yc, { width: 16, height: 16, style: { color: "var(--neutral-alpha-10)" } }),
             /* @__PURE__ */ r(P, { size: "2", style: { color: "var(--neutral-alpha-10)" }, children: "This file has no tracks" })
           ] }),
           o.length > 0 && /* @__PURE__ */ g(y, { direction: "column", gap: "1", children: [
-            o.slice(0, p ? o.length : 6).map((f) => /* @__PURE__ */ g(
+            o.slice(0, k ? o.length : 6).map((E) => /* @__PURE__ */ g(
               y,
               {
                 direction: "row",
                 gap: "3",
                 className: Oe.itemTrack,
-                onClick: (E) => {
-                  E.stopPropagation(), l == null || l(f);
+                onClick: (b) => {
+                  b.stopPropagation(), c == null || c(E);
                 },
                 children: [
                   /* @__PURE__ */ g("div", { className: Oe.icon, children: [
-                    /* @__PURE__ */ r(y, { className: Oe.iconTrack, children: HC(f.id) }),
+                    /* @__PURE__ */ r(y, { className: Oe.iconTrack, children: HC(E.id) }),
                     /* @__PURE__ */ r(Is, { width: 16, height: 16, className: Oe.iconArrowLeft })
                   ] }),
-                  /* @__PURE__ */ r(y, { direction: "column", gap: "1", align: "start", justify: "center", children: /* @__PURE__ */ r(P, { size: "2", className: Oe.trackTitle, children: f.title }) })
+                  /* @__PURE__ */ r(y, { direction: "column", gap: "1", align: "start", justify: "center", children: /* @__PURE__ */ r(P, { size: "2", className: Oe.trackTitle, children: E.title }) })
                 ]
               },
-              f.id
+              E.id
             )),
             /* @__PURE__ */ g(y, { direction: "row", gap: "3", p: "2", align: "center", justify: "center", children: [
               /* @__PURE__ */ g(
@@ -5340,8 +5342,8 @@ const xC = ({
                   variant: "ghost",
                   color: "neutral",
                   style: { flex: "1" },
-                  onClick: (f) => {
-                    f.stopPropagation(), c == null || c(o);
+                  onClick: (E) => {
+                    E.stopPropagation(), u == null || u(o);
                   },
                   children: [
                     /* @__PURE__ */ r(Is, { width: 16, height: 16 }),
@@ -5351,9 +5353,9 @@ const xC = ({
               ),
               o.length > 6 && /* @__PURE__ */ g(pe, { children: [
                 /* @__PURE__ */ r(Ge, { orientation: "vertical" }),
-                /* @__PURE__ */ g(ke, { variant: "ghost", color: "gray", style: { flex: "1" }, onClick: m, children: [
-                  p ? "Show less" : "Show more",
-                  p ? /* @__PURE__ */ r(kc, { width: 16, height: 16 }) : /* @__PURE__ */ r(fa, { width: 16, height: 16 })
+                /* @__PURE__ */ g(ke, { variant: "ghost", color: "gray", style: { flex: "1" }, onClick: C, children: [
+                  k ? "Show less" : "Show more",
+                  k ? /* @__PURE__ */ r(kc, { width: 16, height: 16 }) : /* @__PURE__ */ r(fa, { width: 16, height: 16 })
                 ] })
               ] })
             ] })
@@ -5380,7 +5382,7 @@ const LC = "_RadioCardsGroup_95mfr_1", VC = "_RadioCardsGroupItem_95mfr_5", qC =
 }) => /* @__PURE__ */ r(
   $n,
   {
-    className: C(tn.RadioCardsGroup, n, {
+    className: v(tn.RadioCardsGroup, n, {
       [tn.showRadio]: t
     }),
     columns: a,
@@ -5419,36 +5421,36 @@ const YC = "_starButton_azi6g_1", ZC = "_disabled_azi6g_17", _C = "_readOnly_azi
   maxLabel: h,
   ...A
 }) => {
-  const [p, k] = q(t || 0), [v, m] = q(0), f = e !== void 0 ? e : p, E = e !== void 0, B = N(
+  const [p, k] = q(t || 0), [f, m] = q(0), C = e !== void 0 ? e : p, E = e !== void 0, b = N(
     (w) => {
       if (s || a) return;
-      const Q = w + 1, O = Q === f ? 0 : Q;
+      const Q = w + 1, O = Q === C ? 0 : Q;
       E || k(O), o == null || o({ value: O });
     },
-    [s, a, E, o, f]
+    [s, a, E, o, C]
   ), I = N(
     (w) => {
       if (s || a) return;
       const Q = w.currentTarget.getBoundingClientRect(), O = w.clientX - Q.left, T = Q.width / n, D = Math.floor(O / T), M = Math.max(0, Math.min(D, n - 1)) + 1;
-      M !== v && (m(M), i == null || i({ value: M }));
+      M !== f && (m(M), i == null || i({ value: M }));
     },
-    [s, a, n, v, i]
+    [s, a, n, f, i]
   ), S = N(() => {
     s || a || (m(0), i == null || i({ value: 0 }));
-  }, [s, a, i]), b = (w) => {
-    const Q = v > 0 ? w < v : w < f, O = v > 0 && w < v, T = w < f;
+  }, [s, a, i]), B = (w) => {
+    const Q = f > 0 ? w < f : w < C, O = f > 0 && w < f, T = w < C;
     return /* @__PURE__ */ r(
       "button",
       {
         type: "button",
-        className: C(De.starButton, {
+        className: v(De.starButton, {
           [De.filled]: Q,
           [De.hovered]: O,
           [De.active]: T,
           [De.disabled]: s,
           [De.readOnly]: a
         }),
-        onClick: () => B(w),
+        onClick: () => b(w),
         disabled: s || a,
         "aria-label": `Rate ${w + 1} out of ${n}`,
         ...A,
@@ -5464,7 +5466,7 @@ const YC = "_starButton_azi6g_1", ZC = "_disabled_azi6g_17", _C = "_readOnly_azi
       align: "center",
       gap: "2",
       width: "100%",
-      className: C(l),
+      className: v(l),
       children: [
         c && /* @__PURE__ */ r(P, { size: "2", weight: "medium", className: De.label, children: c }),
         /* @__PURE__ */ g(y, { direction: "column", gap: "1", width: "100%", children: [
@@ -5477,10 +5479,10 @@ const YC = "_starButton_azi6g_1", ZC = "_disabled_azi6g_17", _C = "_readOnly_azi
               justify: "center",
               className: De.starsContainer,
               role: "radiogroup",
-              "aria-label": `Rating: ${f} out of ${n} stars`,
+              "aria-label": `Rating: ${C} out of ${n} stars`,
               onMouseMove: I,
               onMouseLeave: S,
-              children: Array.from({ length: n }, (w, Q) => b(Q))
+              children: Array.from({ length: n }, (w, Q) => B(Q))
             }
           ),
           (u || h) && /* @__PURE__ */ g(
@@ -5520,7 +5522,7 @@ const l1 = "_select_egrq6_1", c1 = "_levelMeter_egrq6_5", d1 = "_levelMeterTrack
     P,
     {
       size: a ? void 0 : n,
-      className: C(e, a && v1.textSize0),
+      className: v(e, a && v1.textSize0),
       ...s,
       children: t
     }
@@ -5551,7 +5553,7 @@ const C1 = "_selectContent_183an_2", y1 = "_selectTrigger_183an_68", k1 = "_soft
   showSelectIndicator: A = !0,
   maxWidth: p = "100%",
   placeholder: k = null,
-  ...v
+  ...f
 }) => /* @__PURE__ */ g(he, { width: "100%", children: [
   e && /* @__PURE__ */ g(y, { mb: "2", align: "center", gap: "2", children: [
     /* @__PURE__ */ r(P, { size: "1", weight: "bold", children: e }),
@@ -5562,9 +5564,9 @@ const C1 = "_selectContent_183an_2", y1 = "_selectTrigger_183an_68", k1 = "_soft
     {
       onValueChange: t,
       defaultValue: s,
-      className: C(n),
+      className: v(n),
       disabled: c || u,
-      ...v,
+      ...f,
       children: [
         /* @__PURE__ */ r(
           pr,
@@ -5572,7 +5574,7 @@ const C1 = "_selectContent_183an_2", y1 = "_selectTrigger_183an_68", k1 = "_soft
             variant: l,
             color: "gray",
             size: i,
-            className: C(qe.selectTrigger, {
+            className: v(qe.selectTrigger, {
               [qe.ghost]: l === "ghost",
               [qe.soft]: l === "soft"
             }),
@@ -5608,7 +5610,7 @@ const C1 = "_selectContent_183an_2", y1 = "_selectTrigger_183an_68", k1 = "_soft
                 oi,
                 {
                   value: m.value,
-                  className: C(qe.selectItem, {
+                  className: v(qe.selectItem, {
                     [qe.hideIndicator]: !A,
                     [qe.size1]: i === "1",
                     [qe.size2]: i === "2"
@@ -5686,9 +5688,9 @@ const w1 = "_sliderTrack_bq3k4_29", R1 = "_sliderTrackSize1_bq3k4_40", N1 = "_sl
   disabled: A = !1,
   highContrast: p = !1,
   markers: k = [],
-  ...v
+  ...f
 }) => {
-  const m = (f) => (f - l) / (c - l) * 100;
+  const m = (C) => (C - l) / (c - l) * 100;
   return /* @__PURE__ */ g(he, { width: "100%", children: [
     e && /* @__PURE__ */ g(y, { mb: "2", justify: "between", align: "center", children: [
       /* @__PURE__ */ g(y, { align: "center", gap: "2", children: [
@@ -5715,12 +5717,12 @@ const w1 = "_sliderTrack_bq3k4_29", R1 = "_sliderTrackSize1_bq3k4_40", N1 = "_sl
         onValueChange: t,
         disabled: A,
         className: n,
-        ...v,
+        ...f,
         children: /* @__PURE__ */ g(y, { className: Ce.sliderContainer, children: [
           /* @__PURE__ */ g(
             ho,
             {
-              className: C(Ce.sliderTrack, {
+              className: v(Ce.sliderTrack, {
                 [Ce.sliderTrackSize1]: h === "1",
                 [Ce.sliderTrackSize2]: h === "2",
                 [Ce.sliderTrackSize3]: h === "3"
@@ -5729,7 +5731,7 @@ const w1 = "_sliderTrack_bq3k4_29", R1 = "_sliderTrackSize1_bq3k4_40", N1 = "_sl
                 /* @__PURE__ */ r(
                   po,
                   {
-                    className: C(Ce.sliderRange, {
+                    className: v(Ce.sliderRange, {
                       [Ce.sliderRangeAccent]: s === "accent",
                       [Ce.sliderRangeNeutral]: s === "neutral",
                       [Ce.sliderRangeHighContrastNeutral]: p && s === "neutral",
@@ -5740,7 +5742,7 @@ const w1 = "_sliderTrack_bq3k4_29", R1 = "_sliderTrackSize1_bq3k4_40", N1 = "_sl
                 /* @__PURE__ */ r(
                   mo,
                   {
-                    className: C(Ce.sliderThumb, {
+                    className: v(Ce.sliderThumb, {
                       [Ce.sliderThumbSize1]: h === "1",
                       [Ce.sliderThumbSize2]: h === "2",
                       [Ce.sliderThumbSize3]: h === "3"
@@ -5750,14 +5752,14 @@ const w1 = "_sliderTrack_bq3k4_29", R1 = "_sliderTrackSize1_bq3k4_40", N1 = "_sl
               ]
             }
           ),
-          k.length > 0 && /* @__PURE__ */ r("div", { className: Ce.markersContainer, children: k.map((f, E) => /* @__PURE__ */ r(
+          k.length > 0 && /* @__PURE__ */ r("div", { className: Ce.markersContainer, children: k.map((C, E) => /* @__PURE__ */ r(
             "div",
             {
-              className: C(Ce.marker, {
+              className: v(Ce.marker, {
                 [Ce.markerSize3]: h === "3"
               }),
               style: {
-                left: `${m(f)}%`
+                left: `${m(C)}%`
               }
             },
             E
@@ -5783,7 +5785,7 @@ const L1 = ({
   inputVolume: A,
   onInputVolumeChange: p,
   inputVolumeDb: k,
-  inputLevel: v
+  inputLevel: f
 }) => /* @__PURE__ */ g(y, { direction: "column", gap: "4", width: "200px", children: [
   /* @__PURE__ */ g(y, { gap: "1", direction: "column", children: [
     /* @__PURE__ */ r(j, { size: "2", mb: "1", weight: "medium", children: n._("Source") }),
@@ -5814,15 +5816,15 @@ const L1 = ({
   ] }),
   /* @__PURE__ */ g(y, { gap: "2", direction: "column", children: [
     /* @__PURE__ */ r(j, { size: "2", weight: "medium", children: n._("Input Level") }),
-    /* @__PURE__ */ r("div", { className: tt.levelMeter, children: /* @__PURE__ */ r("div", { className: tt.levelMeterTrack, children: /* @__PURE__ */ r("div", { className: tt.levelMeterRow, children: Array.from({ length: 17 }, (m, f) => {
-      const E = Math.max(0, (v - 5) / 25) * 17, B = f < E;
+    /* @__PURE__ */ r("div", { className: tt.levelMeter, children: /* @__PURE__ */ r("div", { className: tt.levelMeterTrack, children: /* @__PURE__ */ r("div", { className: tt.levelMeterRow, children: Array.from({ length: 17 }, (m, C) => {
+      const E = Math.max(0, (f - 5) / 25) * 17, b = C < E;
       let I = "low";
-      return f >= 15 ? I = "high" : f >= 11 && (I = "mid"), /* @__PURE__ */ r(
+      return C >= 15 ? I = "high" : C >= 11 && (I = "mid"), /* @__PURE__ */ r(
         "div",
         {
-          className: `${tt.levelMeterSegment} ${B ? `${tt.active} ${tt[I]}` : ""}`
+          className: `${tt.levelMeterSegment} ${b ? `${tt.active} ${tt[I]}` : ""}`
         },
-        `level-${f}`
+        `level-${C}`
       );
     }) }) }) })
   ] }),
@@ -5903,7 +5905,7 @@ const V1 = "_sectionExpander_t40ea_1", q1 = "_sectionExpanderHeader_t40ea_6", K1
     {
       width: "100%",
       direction: "column",
-      className: C(Jt.sectionExpander, t),
+      className: v(Jt.sectionExpander, t),
       ...s,
       children: [
         /* @__PURE__ */ g(
@@ -5928,7 +5930,7 @@ const V1 = "_sectionExpander_t40ea_1", q1 = "_sectionExpanderHeader_t40ea_6", K1
                 /* @__PURE__ */ r(
                   Ic,
                   {
-                    className: C(Jt.sectionExpanderIcon, {
+                    className: v(Jt.sectionExpanderIcon, {
                       [Jt.expanded]: a
                     }),
                     width: 16,
@@ -5962,7 +5964,7 @@ const Un = ({
     onValueChange: s,
     variant: "surface",
     radius: "medium",
-    className: C("customSegmentedControl", n, {
+    className: v("customSegmentedControl", n, {
       hasIconSegmentedControl: a.some((l) => l.icon)
     }),
     ...i,
@@ -5970,7 +5972,7 @@ const Un = ({
       ai,
       {
         value: l.value,
-        className: C("customSegmentedControlItem", {
+        className: v("customSegmentedControlItem", {
           hasIcon: l.icon
         }),
         children: [
@@ -6054,7 +6056,7 @@ const _1 = "_tooltipTriggerWrapper_1hj63_1", $1 = "_newSetlistItem_1hj63_6", ey
     /* @__PURE__ */ r(pa, { children: /* @__PURE__ */ r(zs, { asChild: !0, children: /* @__PURE__ */ g(
       Fn,
       {
-        className: C(
+        className: v(
           Pt.TooltipContent,
           Pt[`TooltipContent--${s}`]
         ),
@@ -6062,7 +6064,7 @@ const _1 = "_tooltipTriggerWrapper_1hj63_1", $1 = "_newSetlistItem_1hj63_6", ey
         ...A,
         children: [
           /* @__PURE__ */ r(j, { size: "1", className: Pt.TooltipText, children: e }),
-          t && /* @__PURE__ */ r(j, { size: "0", className: C(
+          t && /* @__PURE__ */ r(j, { size: "0", className: v(
             Pt.TooltipShortcut,
             Pt[`TooltipShortcut--${s}`]
           ), children: t }),
@@ -6079,7 +6081,7 @@ function Jy({ onExpand: n, className: e, style: t, collapsed: s = !1 }) {
     "button",
     {
       type: "button",
-      className: C(
+      className: v(
         K.newSetlistItem,
         K.collapsedStackItem,
         K.collapsedTransition,
@@ -6107,11 +6109,11 @@ function Py({ onClick: n, className: e, collapsed: t = !1 }) {
         {
           width: 16,
           height: 16,
-          className: C(K.iconSwapLayer, K.iconVisible, K.plusIcon)
+          className: v(K.iconSwapLayer, K.iconVisible, K.plusIcon)
         }
       ) }),
       text: "New Setlist",
-      className: C(K.newSetlistItemButton, K.collapsedTransition, e),
+      className: v(K.newSetlistItemButton, K.collapsedTransition, e),
       collapsed: t
     }
   );
@@ -6162,11 +6164,11 @@ const Qi = ({
   collapsed: p = !1,
   isMobile: k = !1
 }) => {
-  const [v, m] = q(!1), f = () => {
+  const [f, m] = q(!1), C = () => {
     m(!0);
   }, E = () => {
     m(!1);
-  }, B = (S) => {
+  }, b = (S) => {
     S.stopPropagation();
   }, I = (S) => {
     S.stopPropagation();
@@ -6179,12 +6181,12 @@ const Qi = ({
       role: e ? "button" : void 0,
       tabIndex: e ? 0 : void 0,
       onClick: e,
-      className: C(K.newSetlistItem, t, {
+      className: v(K.newSetlistItem, t, {
         [K.navItemSelected]: n,
         [K.collapsed]: p,
         [K.menuOpen]: c
       }),
-      onMouseEnter: f,
+      onMouseEnter: C,
       onMouseLeave: E,
       onKeyDown: e ? (S) => {
         (S.key === "Enter" || S.key === " ") && (S.preventDefault(), e == null || e());
@@ -6196,7 +6198,7 @@ const Qi = ({
           {
             gap: "3",
             align: "center",
-            className: C(K.contentInner, {
+            className: v(K.contentInner, {
               [K.collapsedInner]: p
             }),
             children: [
@@ -6213,7 +6215,7 @@ const Qi = ({
                 y,
                 {
                   direction: "column",
-                  className: C(K.textWrapper, {
+                  className: v(K.textWrapper, {
                     [K.textWrapperHidden]: p
                   }),
                   children: [
@@ -6243,7 +6245,7 @@ const Qi = ({
             ]
           }
         ),
-        l && !p && (v || c) && /* @__PURE__ */ r(
+        l && !p && (f || c) && /* @__PURE__ */ r(
           gn,
           {
             open: c,
@@ -6251,10 +6253,10 @@ const Qi = ({
             trigger: /* @__PURE__ */ r(
               y,
               {
-                className: C(K.dropdownTriggerWrapper, {
+                className: v(K.dropdownTriggerWrapper, {
                   [K.dropdownTriggerWrapperMobile]: k
                 }),
-                onPointerDown: B,
+                onPointerDown: b,
                 onClick: I,
                 children: /* @__PURE__ */ r(ss, { hovered: c })
               }
@@ -6277,27 +6279,27 @@ const Qi = ({
     t == null || t(x), l && i();
   }, A = () => {
     s == null || s(), l && i();
-  }, [p, k] = q(!1), [v, m] = q(!1), f = ee(null), E = ee(null), B = ee(null), I = 260, S = 4, b = a && s ? 1 : 0, w = a && !p, Q = w ? n.slice(0, S) : n, O = 2750, T = () => {
-    a && (f.current && (clearTimeout(f.current), f.current = null), E.current && (clearTimeout(E.current), E.current = null), m(!1));
+  }, [p, k] = q(!1), [f, m] = q(!1), C = ee(null), E = ee(null), b = ee(null), I = 260, S = 4, B = a && s ? 1 : 0, w = a && !p, Q = w ? n.slice(0, S) : n, O = 2750, T = () => {
+    a && (C.current && (clearTimeout(C.current), C.current = null), E.current && (clearTimeout(E.current), E.current = null), m(!1));
   }, D = () => {
-    a && p && (f.current && clearTimeout(f.current), f.current = setTimeout(() => {
-      f.current = null, m(!0), E.current = setTimeout(() => {
+    a && p && (C.current && clearTimeout(C.current), C.current = setTimeout(() => {
+      C.current = null, m(!0), E.current = setTimeout(() => {
         E.current = null, k(!1), m(!1);
       }, I);
     }, O));
   }, z = (x) => {
-    a && (x.stopPropagation(), f.current && (clearTimeout(f.current), f.current = null), m(!1), k(!0));
+    a && (x.stopPropagation(), C.current && (clearTimeout(C.current), C.current = null), m(!1), k(!0));
   }, M = () => {
     a && k(!0);
   }, U = () => {
     if (!a) return;
-    const x = B.current;
+    const x = b.current;
     x && setTimeout(() => {
       x.contains(document.activeElement) || k(!1);
     }, 0);
   };
   de(() => () => {
-    f.current && clearTimeout(f.current), E.current && clearTimeout(E.current);
+    C.current && clearTimeout(C.current), E.current && clearTimeout(E.current);
   }, []);
   const J = (x) => {
     if (!a) return;
@@ -6307,7 +6309,7 @@ const Qi = ({
         marginTop: 0,
         zIndex: "auto"
       };
-    const L = x + b, G = n.length + b - L;
+    const L = x + B, G = n.length + B - L;
     return {
       position: "relative",
       marginTop: L === 0 ? 0 : -40,
@@ -6326,13 +6328,13 @@ const Qi = ({
       type: "scroll",
       scrollbars: "vertical",
       style: { flex: 1, minHeight: 0 },
-      className: C({
+      className: v({
         [K.setlistsScrollArea]: a
       }),
       children: /* @__PURE__ */ r(
         "div",
         {
-          ref: B,
+          ref: b,
           className: K.hoverRegion,
           onMouseEnter: T,
           onMouseLeave: D,
@@ -6342,10 +6344,10 @@ const Qi = ({
             y,
             {
               direction: "column",
-              className: C(K.setlistsContent, {
+              className: v(K.setlistsContent, {
                 [K.collapsedStack]: w,
                 [K.collapsedMask]: a,
-                [K.collapsedShrinking]: v
+                [K.collapsedShrinking]: f
               }),
               children: [
                 s && (w ? /* @__PURE__ */ r(
@@ -6386,7 +6388,7 @@ const Qi = ({
                       dropdownMenuOptions: x.dropdownMenuOptions,
                       collapsed: a,
                       isMobile: o,
-                      className: C({
+                      className: v({
                         [K.collapsedStackItem]: w,
                         [K.collapsedTransition]: a
                       }),
@@ -6454,17 +6456,17 @@ const Qi = ({
 }) => {
   const { isMobile: i, isOpen: l, open: c, close: u } = Ti(), [h, A] = q(!1), p = i ? !1 : t, k = () => {
     i || (A(!1), s((E) => !E));
-  }, v = () => {
+  }, f = () => {
     i || A(!0);
   }, m = () => {
     i || A(!1);
-  }, f = (E) => {
+  }, C = (E) => {
     p ? k() : a && a(E);
   };
   return /* @__PURE__ */ r(Lh, { value: { close: u, isMobile: i }, children: /* @__PURE__ */ g(
     "div",
     {
-      className: C(oe.root, {
+      className: v(oe.root, {
         [oe.rootCollapsed]: p
       }),
       ...o,
@@ -6474,7 +6476,7 @@ const Qi = ({
           {
             align: "center",
             justify: "between",
-            className: C(oe.mobileTopBar, {
+            className: v(oe.mobileTopBar, {
               [oe.mobileTopBarOpen]: i && l
             }),
             children: [
@@ -6509,14 +6511,14 @@ const Qi = ({
         /* @__PURE__ */ r(
           "div",
           {
-            className: C(oe.mobileDrawer, {
+            className: v(oe.mobileDrawer, {
               [oe.mobileDrawerOpen]: i && l
             }),
             children: /* @__PURE__ */ r(
               y,
               {
                 direction: "column",
-                className: C(oe.mobileDrawerContent, {
+                className: v(oe.mobileDrawerContent, {
                   [oe.mobileDrawerContentOpen]: i && l
                 }),
                 children: e
@@ -6529,7 +6531,7 @@ const Qi = ({
           {
             direction: "column",
             className: oe.desktopSidebar,
-            onMouseEnter: v,
+            onMouseEnter: f,
             onMouseLeave: m,
             children: [
               /* @__PURE__ */ g(
@@ -6537,7 +6539,7 @@ const Qi = ({
                 {
                   align: "center",
                   justify: "between",
-                  className: C(oe.header, {
+                  className: v(oe.header, {
                     [oe.headerCollapsed]: p
                   }),
                   children: [
@@ -6546,13 +6548,13 @@ const Qi = ({
                       {
                         align: "center",
                         gap: "2",
-                        onClick: f,
+                        onClick: C,
                         style: { cursor: "pointer" },
                         children: [
                           /* @__PURE__ */ g(
                             "div",
                             {
-                              className: C(oe.logoToggleContainer, {
+                              className: v(oe.logoToggleContainer, {
                                 [oe.logoToggleContainerCollapsed]: p
                               }),
                               children: [
@@ -6561,7 +6563,7 @@ const Qi = ({
                                   {
                                     width: 32,
                                     height: 17,
-                                    className: C(oe.logoInContainer, {
+                                    className: v(oe.logoInContainer, {
                                       [oe.logoInContainerHidden]: p && h
                                     })
                                   }
@@ -6571,7 +6573,7 @@ const Qi = ({
                                   {
                                     width: 16,
                                     height: 16,
-                                    className: C(oe.toggleInContainer, {
+                                    className: v(oe.toggleInContainer, {
                                       [oe.toggleInContainerVisible]: p && h
                                     })
                                   }
@@ -6583,7 +6585,7 @@ const Qi = ({
                             Rr,
                             {
                               height: 12.269,
-                              className: C(oe.moisesIcon, {
+                              className: v(oe.moisesIcon, {
                                 [oe.moisesIconHidden]: p
                               })
                             }
@@ -6597,7 +6599,7 @@ const Qi = ({
                         align: "center",
                         justify: "center",
                         onClick: k,
-                        className: C(oe.toggleButton, {
+                        className: v(oe.toggleButton, {
                           [oe.toggleButtonHidden]: p
                         }),
                         children: /* @__PURE__ */ r(Nr, { width: 16, height: 16 })
@@ -6639,7 +6641,7 @@ const lk = "_sectionTitle_bwlze_1", ck = "_separator_bwlze_17", qr = {
   onNewSetlistClick: h,
   children: A
 }) => {
-  const [p, k] = q(!1), { isMobile: v } = Ti(), m = v ? !1 : p;
+  const [p, k] = q(!1), { isMobile: f } = Ti(), m = f ? !1 : p;
   return /* @__PURE__ */ g(pe, { children: [
     /* @__PURE__ */ g(Di, { isCollapsed: p, onCollapsedChange: k, children: [
       /* @__PURE__ */ g(y, { direction: "column", children: [
@@ -6669,7 +6671,7 @@ const lk = "_sectionTitle_bwlze_1", ck = "_separator_bwlze_17", qr = {
                 onSetlistClick: u,
                 onNewSetlistClick: h,
                 collapsed: m,
-                isMobile: v
+                isMobile: f
               }
             )
           ]
@@ -6742,7 +6744,7 @@ const lk = "_sectionTitle_bwlze_1", ck = "_separator_bwlze_17", qr = {
       onChange: e,
       placeholder: t,
       disabled: c,
-      className: C(St.textArea, o, {
+      className: v(St.textArea, o, {
         [St.variantClassic]: i === "classic",
         [St.variantSoft]: i === "soft",
         [St.disabled]: c,
@@ -6833,13 +6835,13 @@ const In = (n) => {
   onFetchSuggestedTags: h,
   suggestedTagsLoading: A
 }) => {
-  const p = ee(null), k = ee(null), [v, m] = q(!1), f = N((b) => {
-    const w = b.target, Q = w.scrollLeft + w.clientWidth >= w.scrollWidth - 2;
+  const p = ee(null), k = ee(null), [f, m] = q(!1), C = N((B) => {
+    const w = B.target, Q = w.scrollLeft + w.clientWidth >= w.scrollWidth - 2;
     m(Q);
-  }, []), E = !!i || !!c, B = N(
-    (b) => {
+  }, []), E = !!i || !!c, b = N(
+    (B) => {
       if (E) return;
-      const w = b.target.value;
+      const w = B.target.value;
       e((Q) => ({
         ...Q,
         conditioningText: w
@@ -6858,16 +6860,16 @@ const In = (n) => {
     m(!1);
   }, [u]);
   const I = N(
-    (b) => {
+    (B) => {
       e((w) => ({
         ...w,
-        conditioningText: (w.conditioningText || "").trimEnd() + " " + b + " "
+        conditioningText: (w.conditioningText || "").trimEnd() + " " + B + " "
       }));
     },
     [e]
   ), S = N(() => {
-    e((b) => ({
-      ...b,
+    e((B) => ({
+      ...B,
       conditioningAudio: null,
       conditioningAudioName: null,
       conditioningAudioSize: null,
@@ -6908,7 +6910,7 @@ const In = (n) => {
                     {
                       value: n.conditioningText,
                       onFocus: a,
-                      onChange: B,
+                      onChange: b,
                       placeholder: t._(
                         `Describe your desired sound characteristics (ex: ${yk(
                           n.instrument,
@@ -6962,11 +6964,11 @@ const In = (n) => {
                           children: /* @__PURE__ */ r(Rc, { width: 14, height: 14 })
                         }
                       ),
-                      A && /* @__PURE__ */ r("div", { className: Fe.tagsWrapper, children: /* @__PURE__ */ r("div", { className: Fe.tagsContainer, children: Qk.map((b, w) => /* @__PURE__ */ r(
+                      A && /* @__PURE__ */ r("div", { className: Fe.tagsWrapper, children: /* @__PURE__ */ r("div", { className: Fe.tagsContainer, children: Qk.map((B, w) => /* @__PURE__ */ r(
                         "div",
                         {
                           className: Fe.skeletonChip,
-                          style: { width: b }
+                          style: { width: B }
                         },
                         w
                       )) }) }),
@@ -6974,20 +6976,20 @@ const In = (n) => {
                         "div",
                         {
                           className: Fe.tagsWrapper,
-                          "data-scrolled-end": v || void 0,
+                          "data-scrolled-end": f || void 0,
                           children: /* @__PURE__ */ r(
                             "div",
                             {
                               ref: k,
                               className: Fe.tagsContainer,
-                              onScroll: f,
-                              children: u.map((b) => /* @__PURE__ */ r(
+                              onScroll: C,
+                              children: u.map((B) => /* @__PURE__ */ r(
                                 ke,
                                 {
                                   className: Fe.tagChip,
                                   variant: "ghost",
                                   size: "2",
-                                  onClick: () => I(b),
+                                  onClick: () => I(B),
                                   style: {
                                     borderRadius: "9999px",
                                     color: "rgba(241, 247, 254, 0.71)",
@@ -6995,9 +6997,9 @@ const In = (n) => {
                                     paddingLeft: 14,
                                     paddingRight: 14
                                   },
-                                  children: b
+                                  children: B
                                 },
-                                b
+                                B
                               ))
                             }
                           )
@@ -7114,14 +7116,14 @@ function Pk({
   var l, c, u, h, A, p;
   const o = n.customizeCreativeFreedom || !1, i = N(
     async (k) => {
-      var v, m, f;
+      var f, m, C;
       await a() || s({
         ...n,
         customizeCreativeFreedom: k,
         // initialize defaults for sliders when enabling
-        guidanceClap: k ? n.guidanceClap ?? ((v = je[n.instrument]) == null ? void 0 : v.clap) ?? 4 : null,
+        guidanceClap: k ? n.guidanceClap ?? ((f = je[n.instrument]) == null ? void 0 : f.clap) ?? 4 : null,
         guidanceContextAudio: k ? n.guidanceContextAudio ?? ((m = je[n.instrument]) == null ? void 0 : m.context) ?? 4 : null,
-        guidanceContextChroma: k ? n.instrument === "drums" ? null : n.guidanceContextChroma ?? ((f = je[n.instrument]) == null ? void 0 : f.chroma) ?? 4 : null
+        guidanceContextChroma: k ? n.instrument === "drums" ? null : n.guidanceContextChroma ?? ((C = je[n.instrument]) == null ? void 0 : C.chroma) ?? 4 : null
       });
     },
     [n, s, a]
@@ -7277,7 +7279,7 @@ function zk({
         variant: "soft",
         size: "2",
         disabled: s,
-        className: C([Gr.customIconButton], {
+        className: v([Gr.customIconButton], {
           [Gr.disabledIconButton]: s
         }),
         children: /* @__PURE__ */ r(ya, { width: 16, height: 16 })
@@ -7475,14 +7477,14 @@ const Nn = {
   onClickUpgradeConcurrency: A,
   error: p,
   generateFromTrack: k,
-  inpaintingTrack: v,
+  inpaintingTrack: f,
   generateFromSelectionTrack: m,
-  unmutedTracksCount: f,
+  unmutedTracksCount: C,
   onMountConcurrency: E,
-  onClear: B,
+  onClear: b,
   onInspireMe: I,
   inspireMeLoading: S,
-  onBoost: b,
+  onBoost: B,
   boostLoading: w,
   suggestedTags: Q,
   onFetchSuggestedTags: O,
@@ -7495,10 +7497,10 @@ const Nn = {
     (le) => le.instrument === n.instrument
   ), H = _(() => {
     const le = M === "2" && R, be = M === "1" || !R;
-    return u || f === 0 || le && !n.presetId || be && !n.conditioningText && !n.conditioningAudio;
+    return u || C === 0 || le && !n.presetId || be && !n.conditioningText && !n.conditioningAudio;
   }, [
     u,
-    f,
+    C,
     M,
     R,
     n.presetId,
@@ -7636,7 +7638,7 @@ const Nn = {
                   onTextConditioningFocus: a,
                   onInspireMe: I,
                   inspireMeLoading: S,
-                  onBoost: b,
+                  onBoost: B,
                   boostLoading: w,
                   suggestedTags: Q,
                   onFetchSuggestedTags: O,
@@ -7711,10 +7713,10 @@ const Nn = {
                         Wk,
                         {
                           generateFromTrack: k,
-                          inpaintingTrack: v,
+                          inpaintingTrack: f,
                           generateFromSelectionTrack: m,
-                          unmutedTracksCount: f,
-                          onClear: B,
+                          unmutedTracksCount: C,
+                          onClear: b,
                           i18n: i
                         }
                       ) }),
@@ -7740,7 +7742,7 @@ const Nn = {
                         Pe,
                         {
                           type: "error",
-                          onClick: B,
+                          onClick: b,
                           ctaLabel: i._("Clear"),
                           showBackground: !1,
                           showIcon: !1,
@@ -7868,10 +7870,10 @@ const Xr = {
   showHiFiPaywall: A,
   onClearTrack: p,
   showStemsPaywall: k,
-  showHiFiSwitch: v
+  showHiFiSwitch: f
 }) => {
   var S;
-  const { submitted: m, handleSubmit: f } = Ir(i), E = [
+  const { submitted: m, handleSubmit: C } = Ir(i), E = [
     {
       value: "freeVocalInstruments",
       name: n._("Vocals & Instruments"),
@@ -7982,12 +7984,12 @@ const Xr = {
       name: n._("Other"),
       category: "paid"
     }
-  ], B = async (b) => {
-    if (b.isLocked) {
-      k(b.value);
+  ], b = async (B) => {
+    if (B.isLocked) {
+      k(B.value);
       return;
     }
-    const w = b.value;
+    const w = B.value;
     c((Q) => {
       let O = [...Q.selectedStems];
       if (O.includes(w))
@@ -8000,10 +8002,10 @@ const Xr = {
       }
       return O.includes("other") && O.length === 1 ? { ...Q, selectedStems: [] } : { ...Q, selectedStems: O };
     });
-  }, I = (b) => {
+  }, I = (B) => {
     c((w) => ({
       ...w,
-      selectedStems: b.value
+      selectedStems: B.value
     }));
   };
   return /* @__PURE__ */ g(y, { direction: "column", height: "100%", children: [
@@ -8012,10 +8014,10 @@ const Xr = {
       /* @__PURE__ */ r(
         Fs,
         {
-          items: E.filter((b) => b.category === "free").map((b) => ({
-            name: b.name,
-            value: b.value,
-            icon: Xr[b.value]
+          items: E.filter((B) => B.category === "free").map((B) => ({
+            name: B.name,
+            value: B.value,
+            icon: Xr[B.value]
           })),
           value: l.selectedStems,
           onSelect: I
@@ -8026,18 +8028,18 @@ const Xr = {
     /* @__PURE__ */ r(
       Fs,
       {
-        items: E.filter((b) => b.category === "paid").filter((b) => t.some((w) => w.value === b.value)).map((b) => {
+        items: E.filter((B) => B.category === "paid").filter((B) => t.some((w) => w.value === B.value)).map((B) => {
           var w;
           return {
-            name: b.name,
-            value: b.value,
-            icon: Xr[b.value],
-            disabled: l.selectedStems.length === 0 && b.value === "Other",
-            isLocked: (w = t.find((Q) => Q.value === b.value)) == null ? void 0 : w.isLocked
+            name: B.name,
+            value: B.value,
+            icon: Xr[B.value],
+            disabled: l.selectedStems.length === 0 && B.value === "Other",
+            isLocked: (w = t.find((Q) => Q.value === B.value)) == null ? void 0 : w.isLocked
           };
         }),
         value: l.selectedStems,
-        onSelect: B,
+        onSelect: b,
         style: {
           marginBottom: "12px"
         }
@@ -8060,9 +8062,9 @@ const Xr = {
             title: n._("Separate Stems"),
             disabled: !((S = l == null ? void 0 : l.selectedStems) != null && S.length) || !(l != null && l.trackName),
             loading: u,
-            onClick: f,
+            onClick: C,
             besideFooter: /* @__PURE__ */ g(y, { align: "center", gap: "2", children: [
-              v && /* @__PURE__ */ r(it, { checked: !1, onCheckedChange: A }),
+              f && /* @__PURE__ */ r(it, { checked: !1, onCheckedChange: A }),
               /* @__PURE__ */ r(Dc, {})
             ] }),
             color: "cyan",
@@ -8268,10 +8270,10 @@ const Xr = {
   startSlot: A,
   endSlot: p,
   error: k,
-  secondaryText: v,
+  secondaryText: f,
   ...m
 }) => {
-  const f = A || (u ? /* @__PURE__ */ r(u, { width: 16, height: 16, className: He.icon }) : null);
+  const C = A || (u ? /* @__PURE__ */ r(u, { width: 16, height: 16, className: He.icon }) : null);
   return /* @__PURE__ */ g(y, { direction: "column", width: "100%", height: "100%", gap: "1", children: [
     s && /* @__PURE__ */ g(y, { align: "center", gap: "2", children: [
       /* @__PURE__ */ r(P, { size: c, weight: "medium", children: s }),
@@ -8284,7 +8286,7 @@ const Xr = {
         value: n,
         onChange: e,
         placeholder: t,
-        className: C(He.TextField, o, {
+        className: v(He.TextField, o, {
           [He.Disabled]: i,
           [He.ReadOnly]: l,
           [He.focusRing]: h || k,
@@ -8295,20 +8297,20 @@ const Xr = {
         disabled: i,
         ...m,
         children: [
-          f && /* @__PURE__ */ r(pi, { children: f }),
+          C && /* @__PURE__ */ r(pi, { children: C }),
           p && /* @__PURE__ */ r("div", { className: He.endSlot, children: p })
         ]
       }
     ),
-    v && /* @__PURE__ */ r(
+    f && /* @__PURE__ */ r(
       P,
       {
         size: "1",
         weight: "regular",
-        className: C(He.secondaryText, {
+        className: v(He.secondaryText, {
           [He.errorText]: k
         }),
-        children: v
+        children: f
       }
     )
   ] });
@@ -8603,7 +8605,7 @@ const fE = "_button_1270x_1", vE = "_active_1270x_7", CE = "_mute_1270x_16", yE
     return /* @__PURE__ */ r(
       ke,
       {
-        className: C(bn.button, t, {
+        className: v(bn.button, t, {
           [bn.mute]: a,
           [bn.solo]: !a,
           [bn.active]: e
@@ -8656,19 +8658,19 @@ const kE = "_track_1xe9y_1", EE = "_leftIcon_1xe9y_9", SE = "_name_1xe9y_15", IE
     // State change listeners
     onVolumeChange: p,
     onPanChange: k,
-    onMutedChange: v,
+    onMutedChange: f,
     onSoloChange: m,
-    onOpenChange: f,
+    onOpenChange: C,
     // Children (having content means group/takelanes)
     children: E
   }) => {
-    const B = !!E, I = N(() => f == null ? void 0 : f(!A), [A, f]);
-    return /* @__PURE__ */ g("div", { className: C(me.container, { [me.isOpen]: A }), children: [
+    const b = !!E, I = N(() => C == null ? void 0 : C(!A), [A, C]);
+    return /* @__PURE__ */ g("div", { className: v(me.container, { [me.isOpen]: A }), children: [
       /* @__PURE__ */ g(
         "div",
         {
-          className: C(me.track, {
-            [me.isParentTrack]: B,
+          className: v(me.track, {
+            [me.isParentTrack]: b,
             [me.isCompact]: i
           }),
           style: { height: `${o}px` },
@@ -8691,7 +8693,7 @@ const kE = "_track_1xe9y_1", EE = "_leftIcon_1xe9y_9", SE = "_name_1xe9y_15", IE
                     {
                       size: "2",
                       className: me.name,
-                      onClick: B ? I : void 0,
+                      onClick: b ? I : void 0,
                       children: n
                     }
                   ) })
@@ -8747,7 +8749,7 @@ const kE = "_track_1xe9y_1", EE = "_leftIcon_1xe9y_9", SE = "_name_1xe9y_15", IE
                       className: me.rightButton,
                       variant: "mute",
                       isActive: u,
-                      onChange: v
+                      onChange: f
                     }
                   ),
                   /* @__PURE__ */ r(
@@ -8765,7 +8767,7 @@ const kE = "_track_1xe9y_1", EE = "_leftIcon_1xe9y_9", SE = "_name_1xe9y_15", IE
           ]
         }
       ),
-      B && A && /* @__PURE__ */ r("div", { className: me.group, children: E })
+      b && A && /* @__PURE__ */ r("div", { className: me.group, children: E })
     ] });
   }
 );
@@ -8788,36 +8790,36 @@ function XS({ schema: n }) {
     }
     for (const m of i.current) m(e);
   }, [e]);
-  const c = N((m, f) => {
-    t((E) => ({ ...E, [m]: f })), a((E) => ({ ...E, [m]: null }));
-  }, []), u = (m, f) => {
-    const E = e[m], B = (I) => c(m, I);
-    return f === "checkbox" || f === "switch" ? { checked: !!E, onCheckedChange: B } : { value: E ?? "", onChange: (I) => {
+  const c = N((m, C) => {
+    t((E) => ({ ...E, [m]: C })), a((E) => ({ ...E, [m]: null }));
+  }, []), u = (m, C) => {
+    const E = e[m], b = (I) => c(m, I);
+    return C === "checkbox" || C === "switch" ? { checked: !!E, onCheckedChange: b } : { value: E ?? "", onChange: (I) => {
       var S;
-      return B(((S = I == null ? void 0 : I.target) == null ? void 0 : S.value) ?? I);
+      return b(((S = I == null ? void 0 : I.target) == null ? void 0 : S.value) ?? I);
     } };
   }, h = () => {
     const m = n.safeParse(e);
     if (m.success)
       return a({}), { isValid: !0, data: m.data };
-    const f = {};
+    const C = {};
     for (const E of m.error.issues) {
-      const B = E.path.join(".");
-      f[B] || (f[B] = E.message);
+      const b = E.path.join(".");
+      C[b] || (C[b] = E.message);
     }
-    return a(f), { isValid: !1, data: e };
+    return a(C), { isValid: !1, data: e };
   }, A = N((m) => (i.current.push(m), () => {
-    i.current = i.current.filter((f) => f !== m);
+    i.current = i.current.filter((C) => C !== m);
   }), []), p = (m) => {
-    const f = s[m];
-    return f ? /* @__PURE__ */ r(j, { size: "1", color: "red", children: f }) : null;
+    const C = s[m];
+    return C ? /* @__PURE__ */ r(j, { size: "1", color: "red", children: C }) : null;
   }, k = (m) => {
     t(m ?? n.parse({})), a({});
-  }, v = N(
+  }, f = N(
     (m) => /* @__PURE__ */ r(jE, { ...m, errorsRef: o }),
     []
   );
-  return { connectField: u, Field: v, error: p, values: e, set: c, reset: k, getValues: h, watchValues: A };
+  return { connectField: u, Field: f, error: p, values: e, set: c, reset: k, getValues: h, watchValues: A };
 }
 const WE = "_overlay_9c05p_1", LE = "_showOverlay_9c05p_18", Cs = {
   overlay: WE,
@@ -8853,7 +8855,7 @@ const VE = ({ isPlaying: n, image: e, name: t, children: s }) => {
         /* @__PURE__ */ r(
           "div",
           {
-            className: C(Cs.overlay, {
+            className: v(Cs.overlay, {
               [Cs.showOverlay]: n || a
             }),
             children: s
@@ -9235,26 +9237,26 @@ class _E extends fn {
       };
       const A = (p) => {
         if (p.button !== o || (c.set(p.pointerId, p), c.size > 1)) return;
-        let k = p.clientX, v = p.clientY, m = !1;
-        const f = Date.now(), E = t.getBoundingClientRect(), { left: B, top: I } = E, S = (T) => {
-          if (T.defaultPrevented || c.size > 1 || u && Date.now() - f < i) return;
-          const D = T.clientX, z = T.clientY, M = D - k, U = z - v;
-          (m || Math.abs(M) > a || Math.abs(U) > a) && (T.preventDefault(), T.stopPropagation(), m || (l.set({ type: "start", x: k - B, y: v - I }), m = !0), l.set({ type: "move", x: D - B, y: z - I, deltaX: M, deltaY: U }), k = D, v = z);
-        }, b = (T) => {
+        let k = p.clientX, f = p.clientY, m = !1;
+        const C = Date.now(), E = t.getBoundingClientRect(), { left: b, top: I } = E, S = (T) => {
+          if (T.defaultPrevented || c.size > 1 || u && Date.now() - C < i) return;
+          const D = T.clientX, z = T.clientY, M = D - k, U = z - f;
+          (m || Math.abs(M) > a || Math.abs(U) > a) && (T.preventDefault(), T.stopPropagation(), m || (l.set({ type: "start", x: k - b, y: f - I }), m = !0), l.set({ type: "move", x: D - b, y: z - I, deltaX: M, deltaY: U }), k = D, f = z);
+        }, B = (T) => {
           if (c.delete(T.pointerId), m) {
             const D = T.clientX, z = T.clientY;
-            l.set({ type: "end", x: D - B, y: z - I });
+            l.set({ type: "end", x: D - b, y: z - I });
           }
           h();
         }, w = (T) => {
-          c.delete(T.pointerId), T.relatedTarget && T.relatedTarget !== document.documentElement || b(T);
+          c.delete(T.pointerId), T.relatedTarget && T.relatedTarget !== document.documentElement || B(T);
         }, Q = (T) => {
           m && (T.stopPropagation(), T.preventDefault());
         }, O = (T) => {
           T.defaultPrevented || c.size > 1 || m && T.preventDefault();
         };
-        document.addEventListener("pointermove", S), document.addEventListener("pointerup", b), document.addEventListener("pointerout", w), document.addEventListener("pointercancel", w), document.addEventListener("touchmove", O, { passive: !1 }), document.addEventListener("click", Q, { capture: !0 }), h = () => {
-          document.removeEventListener("pointermove", S), document.removeEventListener("pointerup", b), document.removeEventListener("pointerout", w), document.removeEventListener("pointercancel", w), document.removeEventListener("touchmove", O), setTimeout(() => {
+        document.addEventListener("pointermove", S), document.addEventListener("pointerup", B), document.addEventListener("pointerout", w), document.addEventListener("pointercancel", w), document.addEventListener("touchmove", O, { passive: !1 }), document.addEventListener("click", Q, { capture: !0 }), h = () => {
+          document.removeEventListener("pointermove", S), document.removeEventListener("pointerup", B), document.removeEventListener("pointerout", w), document.removeEventListener("pointercancel", w), document.removeEventListener("touchmove", O), setTimeout(() => {
             document.removeEventListener("click", Q, { capture: !0 });
           }, 10);
         };
@@ -9417,17 +9419,17 @@ class _E extends fn {
     var e;
   }
   renderBarWaveform(e, t, s, a) {
-    const { width: o, height: i } = s.canvas, { halfHeight: l, barWidth: c, barRadius: u, barIndexScale: h, barSpacing: A, barMinHeight: p } = function({ width: v, height: m, length: f, options: E, pixelRatio: B }) {
-      const I = m / 2, S = E.barWidth ? E.barWidth * B : 1, b = E.barGap ? E.barGap * B : E.barWidth ? S / 2 : 0, w = S + b || 1;
-      return { halfHeight: I, barWidth: S, barGap: b, barRadius: E.barRadius || 0, barMinHeight: E.barMinHeight ? E.barMinHeight * B : 0, barIndexScale: f > 0 ? v / w / f : 0, barSpacing: w };
-    }({ width: o, height: i, length: (e[0] || []).length, options: t, pixelRatio: this.getPixelRatio() }), k = function({ channelData: v, barIndexScale: m, barSpacing: f, barWidth: E, halfHeight: B, vScale: I, canvasHeight: S, barAlign: b, barMinHeight: w }) {
-      const Q = v[0] || [], O = v[1] || Q, T = Q.length, D = [];
+    const { width: o, height: i } = s.canvas, { halfHeight: l, barWidth: c, barRadius: u, barIndexScale: h, barSpacing: A, barMinHeight: p } = function({ width: f, height: m, length: C, options: E, pixelRatio: b }) {
+      const I = m / 2, S = E.barWidth ? E.barWidth * b : 1, B = E.barGap ? E.barGap * b : E.barWidth ? S / 2 : 0, w = S + B || 1;
+      return { halfHeight: I, barWidth: S, barGap: B, barRadius: E.barRadius || 0, barMinHeight: E.barMinHeight ? E.barMinHeight * b : 0, barIndexScale: C > 0 ? f / w / C : 0, barSpacing: w };
+    }({ width: o, height: i, length: (e[0] || []).length, options: t, pixelRatio: this.getPixelRatio() }), k = function({ channelData: f, barIndexScale: m, barSpacing: C, barWidth: E, halfHeight: b, vScale: I, canvasHeight: S, barAlign: B, barMinHeight: w }) {
+      const Q = f[0] || [], O = f[1] || Q, T = Q.length, D = [];
       let z = 0, M = 0, U = 0;
       for (let J = 0; J <= T; J++) {
         const x = Math.round(J * m);
         if (x > z) {
-          const { topHeight: Z, totalHeight: R } = XE({ maxTop: M, maxBottom: U, halfHeight: B, vScale: I, barMinHeight: w, barAlign: b }), H = YE({ barAlign: b, halfHeight: B, topHeight: Z, totalHeight: R, canvasHeight: S });
-          D.push({ x: z * f, y: H, width: E, height: R }), z = x, M = 0, U = 0;
+          const { topHeight: Z, totalHeight: R } = XE({ maxTop: M, maxBottom: U, halfHeight: b, vScale: I, barMinHeight: w, barAlign: B }), H = YE({ barAlign: B, halfHeight: b, topHeight: Z, totalHeight: R, canvasHeight: S });
+          D.push({ x: z * C, y: H, width: E, height: R }), z = x, M = 0, U = 0;
         }
         const L = Math.abs(Q[J] || 0), G = Math.abs(O[J] || 0);
         L > M && (M = L), G > U && (U = G);
@@ -9435,25 +9437,25 @@ class _E extends fn {
       return D;
     }({ channelData: e, barIndexScale: h, barSpacing: A, barWidth: c, halfHeight: l, vScale: a, canvasHeight: i, barAlign: t.barAlign, barMinHeight: p });
     s.beginPath();
-    for (const v of k) u && "roundRect" in s ? s.roundRect(v.x, v.y, v.width, v.height, u) : s.rect(v.x, v.y, v.width, v.height);
+    for (const f of k) u && "roundRect" in s ? s.roundRect(f.x, f.y, f.width, f.height, u) : s.rect(f.x, f.y, f.width, f.height);
     s.fill(), s.closePath();
   }
   renderLineWaveform(e, t, s, a) {
     const { width: o, height: i } = s.canvas, l = function({ channelData: c, width: u, height: h, vScale: A }) {
       const p = h / 2, k = c[0] || [];
-      return [k, c[1] || k].map((v, m) => {
-        const f = v.length, E = f ? u / f : 0, B = p, I = m === 0 ? -1 : 1, S = [{ x: 0, y: B }];
-        let b = 0, w = 0;
-        for (let Q = 0; Q <= f; Q++) {
+      return [k, c[1] || k].map((f, m) => {
+        const C = f.length, E = C ? u / C : 0, b = p, I = m === 0 ? -1 : 1, S = [{ x: 0, y: b }];
+        let B = 0, w = 0;
+        for (let Q = 0; Q <= C; Q++) {
           const O = Math.round(Q * E);
-          if (O > b) {
-            const D = B + (Math.round(w * p * A) || 1) * I;
-            S.push({ x: b, y: D }), b = O, w = 0;
+          if (O > B) {
+            const D = b + (Math.round(w * p * A) || 1) * I;
+            S.push({ x: B, y: D }), B = O, w = 0;
           }
-          const T = Math.abs(v[Q] || 0);
+          const T = Math.abs(f[Q] || 0);
           T > w && (w = T);
         }
-        return S.push({ x: b, y: B }), S;
+        return S.push({ x: B, y: b }), S;
       });
     }({ channelData: e, width: o, height: i, vScale: a });
     s.beginPath();
@@ -9476,7 +9478,7 @@ class _E extends fn {
       if (!A || A.length === 0) return h;
       let p = c ?? 0;
       if (!c) for (let k = 0; k < A.length; k++) {
-        const v = (u = A[k]) !== null && u !== void 0 ? u : 0, m = Math.abs(v);
+        const f = (u = A[k]) !== null && u !== void 0 ? u : 0, m = Math.abs(f);
         m > p && (p = m);
       }
       return p ? h / p : h;
@@ -9493,35 +9495,35 @@ class _E extends fn {
     }
   }
   renderMultiCanvas(e, t, s, a, o, i) {
-    const l = this.getPixelRatio(), { clientWidth: c } = this.scrollContainer, u = s / l, h = function({ clientWidth: v, totalWidth: m, options: f }) {
-      return _r(Math.min(8e3, v, m), f);
+    const l = this.getPixelRatio(), { clientWidth: c } = this.scrollContainer, u = s / l, h = function({ clientWidth: f, totalWidth: m, options: C }) {
+      return _r(Math.min(8e3, f, m), C);
     }({ clientWidth: c, totalWidth: u, options: t });
     let A = {};
     if (h === 0) return;
-    const p = (v) => {
-      if (v < 0 || v >= k || A[v]) return;
-      A[v] = !0;
-      const m = v * h;
-      let f = Math.min(u - m, h);
-      if (f = _r(f, t), f <= 0) return;
-      const E = function({ channelData: B, offset: I, clampedWidth: S, totalWidth: b }) {
-        return B.map((w) => {
-          const Q = Math.floor(I / b * w.length), O = Math.floor((I + S) / b * w.length);
+    const p = (f) => {
+      if (f < 0 || f >= k || A[f]) return;
+      A[f] = !0;
+      const m = f * h;
+      let C = Math.min(u - m, h);
+      if (C = _r(C, t), C <= 0) return;
+      const E = function({ channelData: b, offset: I, clampedWidth: S, totalWidth: B }) {
+        return b.map((w) => {
+          const Q = Math.floor(I / B * w.length), O = Math.floor((I + S) / B * w.length);
           return w.slice(Q, O);
         });
-      }({ channelData: e, offset: m, clampedWidth: f, totalWidth: u });
-      this.renderSingleCanvas(E, t, f, a, m, o, i);
+      }({ channelData: e, offset: m, clampedWidth: C, totalWidth: u });
+      this.renderSingleCanvas(E, t, C, a, m, o, i);
     }, k = Math.ceil(u / h);
     if (!this.isScrollable) {
-      for (let v = 0; v < k; v++) p(v);
+      for (let f = 0; f < k; f++) p(f);
       return;
     }
-    if ($r({ scrollLeft: this.scrollContainer.scrollLeft, totalWidth: u, numCanvases: k }).forEach((v) => p(v)), k > 1) {
-      const v = this.on("scroll", () => {
+    if ($r({ scrollLeft: this.scrollContainer.scrollLeft, totalWidth: u, numCanvases: k }).forEach((f) => p(f)), k > 1) {
+      const f = this.on("scroll", () => {
         const { scrollLeft: m } = this.scrollContainer;
-        Object.keys(A).length > 10 && (o.innerHTML = "", i.innerHTML = "", A = {}), $r({ scrollLeft: m, totalWidth: u, numCanvases: k }).forEach((f) => p(f));
+        Object.keys(A).length > 10 && (o.innerHTML = "", i.innerHTML = "", A = {}), $r({ scrollLeft: m, totalWidth: u, numCanvases: k }).forEach((C) => p(C));
       });
-      this.unsubscribeOnScroll.push(v);
+      this.unsubscribeOnScroll.push(f);
     }
   }
   renderChannel(e, t, s, a) {
@@ -9529,8 +9531,8 @@ class _E extends fn {
       var p = {};
       for (var k in h) Object.prototype.hasOwnProperty.call(h, k) && A.indexOf(k) < 0 && (p[k] = h[k]);
       if (h != null && typeof Object.getOwnPropertySymbols == "function") {
-        var v = 0;
-        for (k = Object.getOwnPropertySymbols(h); v < k.length; v++) A.indexOf(k[v]) < 0 && Object.prototype.propertyIsEnumerable.call(h, k[v]) && (p[k[v]] = h[k[v]]);
+        var f = 0;
+        for (k = Object.getOwnPropertySymbols(h); f < k.length; f++) A.indexOf(k[f]) < 0 && Object.prototype.propertyIsEnumerable.call(h, k[f]) && (p[k[f]] = h[k[f]]);
       }
       return p;
     }(t, ["overlay"]);
@@ -9544,8 +9546,8 @@ class _E extends fn {
       var t;
       this.timeouts.forEach((u) => u()), this.timeouts = [], this.canvasWrapper.innerHTML = "", this.progressWrapper.innerHTML = "", this.options.width != null && (this.scrollContainer.style.width = typeof this.options.width == "number" ? `${this.options.width}px` : this.options.width);
       const s = this.getPixelRatio(), a = this.scrollContainer.clientWidth, { scrollWidth: o, isScrollable: i, useParentWidth: l, width: c } = function({ duration: u, minPxPerSec: h = 0, parentWidth: A, fillParent: p, pixelRatio: k }) {
-        const v = Math.ceil(u * h), m = v > A, f = !!(p && !m);
-        return { scrollWidth: v, isScrollable: m, useParentWidth: f, width: (f ? A : v) * k };
+        const f = Math.ceil(u * h), m = f > A, C = !!(p && !m);
+        return { scrollWidth: f, isScrollable: m, useParentWidth: C, width: (C ? A : f) * k };
       }({ duration: e.duration, minPxPerSec: this.options.minPxPerSec || 0, parentWidth: a, fillParent: this.options.fillParent, pixelRatio: s });
       if (this.isScrollable = i, this.wrapper.style.width = l ? "100%" : `${o}px`, this.scrollContainer.style.overflowX = this.isScrollable ? "auto" : "hidden", this.scrollContainer.classList.toggle("noScrollbar", !!this.options.hideScrollbar), this.cursor.style.backgroundColor = `${this.options.cursorColor || this.options.progressColor}`, this.cursor.style.width = `${this.options.cursorWidth}px`, this.audioData = e, this.emit("render"), this.options.splitChannels) for (let u = 0; u < e.numberOfChannels; u++) {
         const h = Object.assign(Object.assign({}, this.options), (t = this.options.splitChannels) === null || t === void 0 ? void 0 : t[u]);
@@ -9758,26 +9760,26 @@ class An extends GE {
     super({ media: t, mediaControls: e.mediaControls, autoplay: e.autoplay, playbackRate: e.audioRate }), this.plugins = [], this.decodedData = null, this.stopAtPosition = null, this.subscriptions = [], this.mediaSubscriptions = [], this.abortController = null, this.reactiveCleanups = [], this.options = Object.assign({}, eS, e);
     const { state: s, actions: a } = function(l) {
       var c, u, h, A, p, k;
-      const v = (c = l == null ? void 0 : l.currentTime) !== null && c !== void 0 ? c : Ae(0), m = (u = l == null ? void 0 : l.duration) !== null && u !== void 0 ? u : Ae(0), f = (h = l == null ? void 0 : l.isPlaying) !== null && h !== void 0 ? h : Ae(!1), E = (A = l == null ? void 0 : l.isSeeking) !== null && A !== void 0 ? A : Ae(!1), B = (p = l == null ? void 0 : l.volume) !== null && p !== void 0 ? p : Ae(1), I = (k = l == null ? void 0 : l.playbackRate) !== null && k !== void 0 ? k : Ae(1), S = Ae(null), b = Ae(null), w = Ae(""), Q = Ae(0), O = Ae(0), T = It(() => !f.value, [f]), D = It(() => S.value !== null, [S]), z = It(() => D.value && m.value > 0, [D, m]), M = It(() => v.value, [v]), U = It(() => m.value > 0 ? v.value / m.value : 0, [v, m]);
-      return { state: { currentTime: v, duration: m, isPlaying: f, isPaused: T, isSeeking: E, volume: B, playbackRate: I, audioBuffer: S, peaks: b, url: w, zoom: Q, scrollPosition: O, canPlay: D, isReady: z, progress: M, progressPercent: U }, actions: { setCurrentTime: (J) => {
+      const f = (c = l == null ? void 0 : l.currentTime) !== null && c !== void 0 ? c : Ae(0), m = (u = l == null ? void 0 : l.duration) !== null && u !== void 0 ? u : Ae(0), C = (h = l == null ? void 0 : l.isPlaying) !== null && h !== void 0 ? h : Ae(!1), E = (A = l == null ? void 0 : l.isSeeking) !== null && A !== void 0 ? A : Ae(!1), b = (p = l == null ? void 0 : l.volume) !== null && p !== void 0 ? p : Ae(1), I = (k = l == null ? void 0 : l.playbackRate) !== null && k !== void 0 ? k : Ae(1), S = Ae(null), B = Ae(null), w = Ae(""), Q = Ae(0), O = Ae(0), T = It(() => !C.value, [C]), D = It(() => S.value !== null, [S]), z = It(() => D.value && m.value > 0, [D, m]), M = It(() => f.value, [f]), U = It(() => m.value > 0 ? f.value / m.value : 0, [f, m]);
+      return { state: { currentTime: f, duration: m, isPlaying: C, isPaused: T, isSeeking: E, volume: b, playbackRate: I, audioBuffer: S, peaks: B, url: w, zoom: Q, scrollPosition: O, canPlay: D, isReady: z, progress: M, progressPercent: U }, actions: { setCurrentTime: (J) => {
         const x = Math.max(0, Math.min(m.value || 1 / 0, J));
-        v.set(x);
+        f.set(x);
       }, setDuration: (J) => {
         m.set(Math.max(0, J));
       }, setPlaying: (J) => {
-        f.set(J);
+        C.set(J);
       }, setSeeking: (J) => {
         E.set(J);
       }, setVolume: (J) => {
         const x = Math.max(0, Math.min(1, J));
-        B.set(x);
+        b.set(x);
       }, setPlaybackRate: (J) => {
         const x = Math.max(0.1, Math.min(16, J));
         I.set(x);
       }, setAudioBuffer: (J) => {
         S.set(J), J && m.set(J.duration);
       }, setPeaks: (J) => {
-        b.set(J);
+        B.set(J);
       }, setUrl: (J) => {
         w.set(J);
       }, setZoom: (J) => {
@@ -9996,8 +9998,8 @@ class An extends GE {
         const A = l.slice(Math.floor(h * u), Math.ceil((h + 1) * u));
         let p = 0;
         for (let k = 0; k < A.length; k++) {
-          const v = A[k];
-          Math.abs(v) > Math.abs(p) && (p = v);
+          const f = A[k];
+          Math.abs(f) > Math.abs(p) && (p = f);
         }
         c.push(Math.round(p * s) / s);
       }
@@ -10149,9 +10151,9 @@ function Hi({
   eventPlayed: A,
   showSkeleton: p = !1,
   classNamesButton: k,
-  onPlayStateChange: v
+  onPlayStateChange: f
 }) {
-  const [m, f] = q(!1), [E, B] = q(!1), [I, S] = q(!1), [b, w] = q(!1);
+  const [m, C] = q(!1), [E, b] = q(!1), [I, S] = q(!1), [B, w] = q(!1);
   de(() => {
     typeof navigator < "u" && w(/^((?!chrome|android).)*safari/i.test(navigator.userAgent));
   }, []);
@@ -10164,17 +10166,17 @@ function Hi({
     D.current && ((R = D.current) == null || R.pause());
   }, []), M = N(() => {
     var R, H;
-    D.current && (c && c.state.active && c.state.active !== D.current && c.state.active.pause(), b || (R = D.current) == null || R.setOptions({ progressColor: l }), (H = D.current) == null || H.play());
-  }, [b, l, c]);
+    D.current && (c && c.state.active && c.state.active !== D.current && c.state.active.pause(), B || (R = D.current) == null || R.setOptions({ progressColor: l }), (H = D.current) == null || H.play());
+  }, [B, l, c]);
   de(() => {
     var R;
     D.current && n && ((R = D.current) == null || R.load(n));
   }, [n]);
   const U = N((R) => {
-    D.current = R, B(!0), f(!1);
+    D.current = R, b(!0), C(!1);
   }, []), J = N(
     (R) => {
-      if (f(!0), t == null || t(!0), v == null || v(!0), c) {
+      if (C(!0), t == null || t(!0), f == null || f(!0), c) {
         if (c.state.active && c.state.active !== R) {
           const H = c.state.active.getCurrentTime();
           c.state.active.pause(), R.setTime(H);
@@ -10188,13 +10190,13 @@ function Hi({
       }
       A == null || A();
     },
-    [t, c, A, v]
+    [t, c, A, f]
   ), x = N(() => {
-    f(!1), t == null || t(!1), v == null || v(!1), c && c.setter((R) => ({
+    C(!1), t == null || t(!1), f == null || f(!1), c && c.setter((R) => ({
       ...R,
       isPlaying: !1
     }));
-  }, [t, c, v]), L = N(
+  }, [t, c, f]), L = N(
     (R) => {
       c && c.setter((H) => ({
         ...H,
@@ -10204,12 +10206,12 @@ function Hi({
     [c]
   ), G = N(() => {
     var R;
-    u ? (R = D.current) == null || R.play() : (f(!1), t == null || t(!1), v == null || v(!1), c && c.setter((H) => ({
+    u ? (R = D.current) == null || R.play() : (C(!1), t == null || t(!1), f == null || f(!1), c && c.setter((H) => ({
       ...H,
       isPlaying: !1,
       active: null
     })));
-  }, [u, t, c, v]), Z = N(() => {
+  }, [u, t, c, f]), Z = N(() => {
     var R, H, ae;
     (R = D.current) != null && R.isPlaying() ? z() : D.current && ((H = c == null ? void 0 : c.state) != null && H.active && c.state.active !== D.current && (c.state.active.pause(), c.setter((Re) => ({
       ...Re,
@@ -10235,7 +10237,7 @@ function Hi({
             size: "2",
             variant: "soft",
             color: "gray",
-            className: C(k, ks.customButton),
+            className: v(k, ks.customButton),
             children: m ? /* @__PURE__ */ r(Mc, { width: 20, height: 20 }) : /* @__PURE__ */ r(Oc, { width: 20, height: 20 })
           }
         ),
@@ -10264,7 +10266,7 @@ function Hi({
                 onPlay: J,
                 onPause: x,
                 onFinish: G,
-                backend: b ? "WebAudio" : "MediaElement"
+                backend: B ? "WebAudio" : "MediaElement"
               }
             )
           }
@@ -10331,7 +10333,7 @@ const dS = "_customButton_14z6y_1", uS = "_descriptionVoiceList_14z6y_5", ea = {
           onSelect: t,
           className: "voice-list",
           children: n.map((A) => {
-            var p, k, v;
+            var p, k, f;
             return /* @__PURE__ */ r(
               Rt.CardDetails,
               {
@@ -10368,7 +10370,7 @@ const dS = "_customButton_14z6y_1", uS = "_descriptionVoiceList_14z6y_5", ea = {
                     weight: "regular",
                     className: ea.descriptionVoiceList,
                     children: [
-                      (v = A == null ? void 0 : A.metadata) == null ? void 0 : v.vocalRange,
+                      (f = A == null ? void 0 : A.metadata) == null ? void 0 : f.vocalRange,
                       " ",
                       /* @__PURE__ */ r("span", { children: "|" }),
                       " ",
@@ -10623,7 +10625,7 @@ const BS = "_footerVoiceForm_lsc2c_2", wS = {
   onVoiceDetailsClick: s,
   onBackToList: a,
   voiceDetailsId: o,
-  i18n: i = { _: (f) => f },
+  i18n: i = { _: (C) => C },
   isLoading: l,
   limitReached: c,
   error: u,
@@ -10631,10 +10633,10 @@ const BS = "_footerVoiceForm_lsc2c_2", wS = {
   onSelectTrack: A,
   onMountConcurrency: p,
   showUpgradeConcurrency: k,
-  onClickUpgradeConcurrency: v,
+  onClickUpgradeConcurrency: f,
   onRemoveTrack: m
 }) => {
-  const [f, E] = q(null), [B, I] = q(null), { submitted: S, handleSubmit: b } = Ir(h), [w, Q] = q({
+  const [C, E] = q(null), [b, I] = q(null), { submitted: S, handleSubmit: B } = Ir(h), [w, Q] = q({
     lastPlayed: null,
     active: null,
     isPlaying: !1,
@@ -10651,9 +10653,9 @@ const BS = "_footerVoiceForm_lsc2c_2", wS = {
     [n, t]
   ), T = N(
     (x) => {
-      B !== x && I(x);
+      b !== x && I(x);
     },
-    [B, I]
+    [b, I]
   ), D = N(
     (x) => {
       I(null), w.active && w.active.pause(), Q((L) => ({
@@ -10677,14 +10679,14 @@ const BS = "_footerVoiceForm_lsc2c_2", wS = {
     [e.trackName, e.trackId, e.customAudio]
   ), J = N(() => {
     if (!o) {
-      b();
+      B();
       return;
     }
     M && (O(M.identifier), a(), t((x) => {
       var L;
       return ((L = x.selectedVoice) == null ? void 0 : L.identifier) === M.identifier ? x : { ...x, selectedVoice: M };
-    })), U && (M ? b({ selectedVoice: M }) : b());
-  }, [o, b, M, O, a]);
+    })), U && (M ? B({ selectedVoice: M }) : B());
+  }, [o, B, M, O, a]);
   return de(() => {
     var x;
     if (w.isPlaying === !1)
@@ -10700,9 +10702,9 @@ const BS = "_footerVoiceForm_lsc2c_2", wS = {
       AS,
       {
         voices: n,
-        selectedId: f,
+        selectedId: C,
         handleSelect: O,
-        playingItem: B,
+        playingItem: b,
         handleAvatarClick: T,
         handleDetailsClick: D,
         wavegroup: z,
@@ -10747,7 +10749,7 @@ const BS = "_footerVoiceForm_lsc2c_2", wS = {
                 IS,
                 {
                   showUpgrade: k,
-                  onClickUpgrade: v,
+                  onClickUpgrade: f,
                   i18n: i,
                   onMountConcurrency: p
                 }