@moises.ai/design-system 3.11.17 → 3.11.18

package/dist/index.js

@@ -2,7 +2,7 @@
 import { jsx as a, jsxs as f, Fragment as fe } from "react/jsx-runtime";
 import { h as Wa, f as ar, ag as Ql, a as ks, g as Je, ah as Ml, P as we, i as ge, u as Et, ai as Ul, aj as ja, e as Ha, F as Ka, ak as Ol, E as Fl, al as Pl, am as zl, an as Wl, ao as jl, D as Hl, c as ys, ap as Kl, aq as Ll, J as or, ar as Vl, as as Gl, at as Re, au as bs, av as ql, aw as Yl, ax as Xl, ay as Zl, az as _l, aA as $l, aB as ec, aC as tc, aD as nc, aE as rc, aF as sc, aG as ac, aH as oc, aI as ic, R as lc, aJ as La, aK as Va, aL as Xr, aM as Zr, aN as cc, aO as dc, aP as uc, aQ as hc, aR as Ac, aS as pc, aT as gc, aU as mc, aV as fc, aW as Cc, aX as vc, aY as kc, aZ as yc, a_ as bc, a$ as Ic, b0 as Sc, b1 as Is, b2 as Ss, b3 as Es, b4 as Ec, b5 as wc, b6 as Ga, b7 as qa, b8 as Ya, H as Xa, O as Rc, Q as Nc, b9 as Bc, ba as xc, bb as Tc, bc as Jc, bd as Dc, be as Qc, bf as ws, bg as Rs, bh as Za, bi as Ns, bj as Bs, bk as _a, bl as $a, bm as eo, _ as to, bn as Mc, bo as Uc, bp as Oc, bq as Fc, br as la, bs as ca, a1 as Pc, b as zc, C as Wc, bt as jc, bu as Hc, bv as Kc, bw as Lc } from "./index-Dwaw5zqT.js";
 import * as h from "react";
-import Ee, { createContext as ln, useContext as dt, useCallback as J, memo as Ze, forwardRef as Vc, useState as K, useEffect as ie, useMemo as _, useRef as ee, Children as Gc, useLayoutEffect as qc, Fragment as Yc } from "react";
+import Ee, { createContext as ln, useContext as dt, useCallback as D, memo as Ze, forwardRef as Vc, useState as K, useEffect as ie, useMemo as _, useRef as ee, Children as Gc, useLayoutEffect as qc, Fragment as Yc } from "react";
 import { aZ as xs, dA as no, az as ro, j0 as Xc, gc as hr, bY as Zc, D as _c, w as $c, c2 as ed, aG as so, y as Ar, bA as td, dB as Mn, j1 as nd, j2 as rd, ef as sd, fq as ad, aK as od, hn as id, eX as _r, b as $r, cm as yt, bM as ld, ds as cd, i8 as dd, h9 as ud, dN as hd, dM as Ts, hM as Js, iX as ao, fV as oo, dH as rn, T as Ds, cj as Qs, iN as Ad, iL as es, hA as pd, eC as io, iy as gd, hD as md, hE as fd, j3 as Cd, gQ as Ms, eL as da, h2 as Mr, eK as ua, de as vd, gP as kd, ep as yd, gE as bd, cG as Id, ie as Sd, I as Ed, hp as wd, gd as lo, dz as co, ho as uo, dr as Rd, iO as ha, aF as Nd, aI as Bd, eP as xd, fR as Td, g9 as Jd, A as Dd } from "./MinusIcon-BS8c20DV.js";
 import { useSensors as Qd, useSensor as Md, PointerSensor as Ud, pointerWithin as Od, useDndMonitor as Fd, useDroppable as ho, DndContext as Pd, DragOverlay as zd } from "@dnd-kit/core";
 import { snapCenterToCursor as Wd } from "@dnd-kit/modifiers";
@@ -31,17 +31,17 @@ var Gd = [" ", "Enter", "ArrowUp", "ArrowDown"], qd = [" ", "Enter"], Lt = "Sele
     disabled: g,
     required: v,
     form: C
-  } = n, m = mr(t), [I, k] = h.useState(null), [E, S] = h.useState(null), [w, R] = h.useState(!1), B = Wa(u), [x, N] = ar({
+  } = n, m = mr(t), [I, k] = h.useState(null), [E, S] = h.useState(null), [R, w] = h.useState(!1), N = Wa(u), [B, x] = ar({
     prop: s,
     defaultProp: o ?? !1,
     onChange: i,
     caller: Lt
-  }), [T, D] = ar({
+  }), [J, T] = ar({
     prop: l,
     defaultProp: c,
     onChange: d,
     caller: Lt
-  }), Q = h.useRef(null), M = I ? C || !!I.closest("form") : !0, [F, U] = h.useState(/* @__PURE__ */ new Set()), O = Array.from(F).map((z) => z.props.value).join(";");
+  }), Q = h.useRef(null), M = I ? C || !!I.closest("form") : !0, [O, U] = h.useState(/* @__PURE__ */ new Set()), F = Array.from(O).map((z) => z.props.value).join(";");
   return /* @__PURE__ */ a(Ql, { ...m, children: /* @__PURE__ */ f(
     Xd,
     {
@@ -51,14 +51,14 @@ var Gd = [" ", "Enter", "ArrowUp", "ArrowDown"], qd = [" ", "Enter"], Lt = "Sele
       onTriggerChange: k,
       valueNode: E,
       onValueNodeChange: S,
-      valueNodeHasChildren: w,
-      onValueNodeHasChildrenChange: R,
+      valueNodeHasChildren: R,
+      onValueNodeHasChildrenChange: w,
       contentId: ks(),
-      value: T,
-      onValueChange: D,
-      open: x,
-      onOpenChange: N,
-      dir: B,
+      value: J,
+      onValueChange: T,
+      open: B,
+      onOpenChange: x,
+      dir: N,
       triggerPointerDownPosRef: Q,
       disabled: g,
       children: [
@@ -86,16 +86,16 @@ var Gd = [" ", "Enter", "ArrowUp", "ArrowDown"], qd = [" ", "Enter"], Lt = "Sele
             tabIndex: -1,
             name: p,
             autoComplete: A,
-            value: T,
-            onChange: (z) => D(z.target.value),
+            value: J,
+            onChange: (z) => T(z.target.value),
             disabled: g,
             form: C,
             children: [
-              T === void 0 ? /* @__PURE__ */ a("option", { value: "" }) : null,
-              Array.from(F)
+              J === void 0 ? /* @__PURE__ */ a("option", { value: "" }) : null,
+              Array.from(O)
             ]
           },
-          O
+          F
         ) : null
       ]
     }
@@ -210,9 +210,9 @@ var Xe = 10, [bo, Nt] = cn(Vt), tu = "SelectContentImpl", nu = Kl("SelectContent
       avoidCollisions: I,
       //
       ...k
-    } = n, E = Rt(Vt, r), [S, w] = h.useState(null), [R, B] = h.useState(null), x = Je(t, (j) => w(j)), [N, T] = h.useState(null), [D, Q] = h.useState(
+    } = n, E = Rt(Vt, r), [S, R] = h.useState(null), [w, N] = h.useState(null), B = Je(t, (j) => R(j)), [x, J] = h.useState(null), [T, Q] = h.useState(
       null
-    ), M = gr(r), [F, U] = h.useState(!1), O = h.useRef(!1);
+    ), M = gr(r), [O, U] = h.useState(!1), F = h.useRef(!1);
     h.useEffect(() => {
       if (S) return Pl(S);
     }, [S]), zl();
@@ -220,16 +220,16 @@ var Xe = 10, [bo, Nt] = cn(Vt), tu = "SelectContentImpl", nu = Kl("SelectContent
       (j) => {
         const [le, ...Ie] = M().map((oe) => oe.ref.current), [ce] = Ie.slice(-1), ae = document.activeElement;
         for (const oe of j)
-          if (oe === ae || (oe == null || oe.scrollIntoView({ block: "nearest" }), oe === le && R && (R.scrollTop = 0), oe === ce && R && (R.scrollTop = R.scrollHeight), oe == null || oe.focus(), document.activeElement !== ae)) return;
+          if (oe === ae || (oe == null || oe.scrollIntoView({ block: "nearest" }), oe === le && w && (w.scrollTop = 0), oe === ce && w && (w.scrollTop = w.scrollHeight), oe == null || oe.focus(), document.activeElement !== ae)) return;
       },
-      [M, R]
+      [M, w]
     ), X = h.useCallback(
-      () => z([N, S]),
-      [z, N, S]
+      () => z([x, S]),
+      [z, x, S]
     );
     h.useEffect(() => {
-      F && X();
-    }, [F, X]);
+      O && X();
+    }, [O, X]);
     const { onOpenChange: $, triggerPointerDownPosRef: W } = E;
     h.useEffect(() => {
       if (S) {
@@ -258,13 +258,13 @@ var Xe = 10, [bo, Nt] = cn(Vt), tu = "SelectContentImpl", nu = Kl("SelectContent
       ce && setTimeout(() => ce.ref.current.focus());
     }), ke = h.useCallback(
       (j, le, Ie) => {
-        const ce = !O.current && !Ie;
-        (E.value !== void 0 && E.value === le || ce) && (T(j), ce && (O.current = !0));
+        const ce = !F.current && !Ie;
+        (E.value !== void 0 && E.value === le || ce) && (J(j), ce && (F.current = !0));
       },
       [E.value]
     ), Le = h.useCallback(() => S == null ? void 0 : S.focus(), [S]), be = h.useCallback(
       (j, le, Ie) => {
-        const ce = !O.current && !Ie;
+        const ce = !F.current && !Ie;
         (E.value !== void 0 && E.value === le || ce) && Q(j);
       },
       [E.value]
@@ -285,16 +285,16 @@ var Xe = 10, [bo, Nt] = cn(Vt), tu = "SelectContentImpl", nu = Kl("SelectContent
       {
         scope: r,
         content: S,
-        viewport: R,
-        onViewportChange: B,
+        viewport: w,
+        onViewportChange: N,
         itemRefCallback: ke,
-        selectedItem: N,
+        selectedItem: x,
         onItemLeave: Le,
         itemTextRefCallback: be,
         focusSelectedItem: X,
-        selectedItemText: D,
+        selectedItemText: T,
         position: s,
-        isPositioned: F,
+        isPositioned: O,
         searchRef: re,
         children: /* @__PURE__ */ a(Wl, { as: nu, allowPinchZoom: !0, children: /* @__PURE__ */ a(
           jl,
@@ -328,7 +328,7 @@ var Xe = 10, [bo, Nt] = cn(Vt), tu = "SelectContentImpl", nu = Kl("SelectContent
                     ...k,
                     ...L,
                     onPlaced: () => U(!0),
-                    ref: x,
+                    ref: B,
                     style: {
                       // flex layout so we can place the scroll buttons properly
                       display: "flex",
@@ -360,11 +360,11 @@ var Xe = 10, [bo, Nt] = cn(Vt), tu = "SelectContentImpl", nu = Kl("SelectContent
 );
 Io.displayName = tu;
 var ru = "SelectItemAlignedPosition", So = h.forwardRef((n, t) => {
-  const { __scopeSelect: r, onPlaced: s, ...o } = n, i = Rt(Vt, r), l = Nt(Vt, r), [c, d] = h.useState(null), [u, p] = h.useState(null), A = Je(t, (x) => p(x)), g = gr(r), v = h.useRef(!1), C = h.useRef(!0), { viewport: m, selectedItem: I, selectedItemText: k, focusSelectedItem: E } = l, S = h.useCallback(() => {
+  const { __scopeSelect: r, onPlaced: s, ...o } = n, i = Rt(Vt, r), l = Nt(Vt, r), [c, d] = h.useState(null), [u, p] = h.useState(null), A = Je(t, (B) => p(B)), g = gr(r), v = h.useRef(!1), C = h.useRef(!0), { viewport: m, selectedItem: I, selectedItemText: k, focusSelectedItem: E } = l, S = h.useCallback(() => {
     if (i.trigger && i.valueNode && c && u && m && I && k) {
-      const x = i.trigger.getBoundingClientRect(), N = u.getBoundingClientRect(), T = i.valueNode.getBoundingClientRect(), D = k.getBoundingClientRect();
+      const B = i.trigger.getBoundingClientRect(), x = u.getBoundingClientRect(), J = i.valueNode.getBoundingClientRect(), T = k.getBoundingClientRect();
       if (i.dir !== "rtl") {
-        const ae = D.left - N.left, oe = T.left - ae, qe = x.left - oe, Ye = x.width + qe, Qe = Math.max(Ye, N.width), ut = window.innerWidth - Xe, at = or(oe, [
+        const ae = T.left - x.left, oe = J.left - ae, qe = B.left - oe, Ye = B.width + qe, Qe = Math.max(Ye, x.width), ut = window.innerWidth - Xe, at = or(oe, [
           Xe,
           // Prevents the content from going off the starting edge of the
           // viewport. It may still go off the ending edge, but this can be
@@ -375,13 +375,13 @@ var ru = "SelectItemAlignedPosition", So = h.forwardRef((n, t) => {
         ]);
         c.style.minWidth = Ye + "px", c.style.left = at + "px";
       } else {
-        const ae = N.right - D.right, oe = window.innerWidth - T.right - ae, qe = window.innerWidth - x.right - oe, Ye = x.width + qe, Qe = Math.max(Ye, N.width), ut = window.innerWidth - Xe, at = or(oe, [
+        const ae = x.right - T.right, oe = window.innerWidth - J.right - ae, qe = window.innerWidth - B.right - oe, Ye = B.width + qe, Qe = Math.max(Ye, x.width), ut = window.innerWidth - Xe, at = or(oe, [
           Xe,
           Math.max(Xe, ut - Qe)
         ]);
         c.style.minWidth = Ye + "px", c.style.right = at + "px";
       }
-      const Q = g(), M = window.innerHeight - Xe * 2, F = m.scrollHeight, U = window.getComputedStyle(u), O = parseInt(U.borderTopWidth, 10), z = parseInt(U.paddingTop, 10), X = parseInt(U.borderBottomWidth, 10), $ = parseInt(U.paddingBottom, 10), W = O + z + F + $ + X, re = Math.min(I.offsetHeight * 5, W), Ne = window.getComputedStyle(m), ke = parseInt(Ne.paddingTop, 10), Le = parseInt(Ne.paddingBottom, 10), be = x.top + x.height / 2 - Xe, se = M - be, L = I.offsetHeight / 2, j = I.offsetTop + L, le = O + z + j, Ie = W - le;
+      const Q = g(), M = window.innerHeight - Xe * 2, O = m.scrollHeight, U = window.getComputedStyle(u), F = parseInt(U.borderTopWidth, 10), z = parseInt(U.paddingTop, 10), X = parseInt(U.borderBottomWidth, 10), $ = parseInt(U.paddingBottom, 10), W = F + z + O + $ + X, re = Math.min(I.offsetHeight * 5, W), Ne = window.getComputedStyle(m), ke = parseInt(Ne.paddingTop, 10), Le = parseInt(Ne.paddingBottom, 10), be = B.top + B.height / 2 - Xe, se = M - be, L = I.offsetHeight / 2, j = I.offsetTop + L, le = F + z + j, Ie = W - le;
       if (le <= be) {
         const ae = Q.length > 0 && I === Q[Q.length - 1].ref.current;
         c.style.bottom = "0px";
@@ -396,7 +396,7 @@ var ru = "SelectItemAlignedPosition", So = h.forwardRef((n, t) => {
         c.style.top = "0px";
         const qe = Math.max(
           be,
-          O + m.offsetTop + // viewport might have padding top, include it to avoid a scrollable viewport
+          F + m.offsetTop + // viewport might have padding top, include it to avoid a scrollable viewport
           (ae ? ke : 0) + L
         ) + Ie;
         c.style.height = qe + "px", m.scrollTop = le - be + m.offsetTop;
@@ -416,13 +416,13 @@ var ru = "SelectItemAlignedPosition", So = h.forwardRef((n, t) => {
     s
   ]);
   Et(() => S(), [S]);
-  const [w, R] = h.useState();
+  const [R, w] = h.useState();
   Et(() => {
-    u && R(window.getComputedStyle(u).zIndex);
+    u && w(window.getComputedStyle(u).zIndex);
   }, [u]);
-  const B = h.useCallback(
-    (x) => {
-      x && C.current === !0 && (S(), E == null || E(), C.current = !1);
+  const N = h.useCallback(
+    (B) => {
+      B && C.current === !0 && (S(), E == null || E(), C.current = !1);
     },
     [S, E]
   );
@@ -432,7 +432,7 @@ var ru = "SelectItemAlignedPosition", So = h.forwardRef((n, t) => {
       scope: r,
       contentWrapper: c,
       shouldExpandOnScrollRef: v,
-      onScrollButtonChange: B,
+      onScrollButtonChange: N,
       children: /* @__PURE__ */ a(
         "div",
         {
@@ -441,7 +441,7 @@ var ru = "SelectItemAlignedPosition", So = h.forwardRef((n, t) => {
             display: "flex",
             flexDirection: "column",
             position: "fixed",
-            zIndex: w
+            zIndex: R
           },
           children: /* @__PURE__ */ a(
             we.div,
@@ -533,8 +533,8 @@ var [au, Us] = cn(Vt, {}), ns = "SelectViewport", Eo = h.forwardRef(
               if (v > 0) {
                 const C = window.innerHeight - Xe * 2, m = parseFloat(A.style.minHeight), I = parseFloat(A.style.height), k = Math.max(m, I);
                 if (k < C) {
-                  const E = k + v, S = Math.min(C, E), w = E - S;
-                  A.style.height = S + "px", A.style.bottom === "0px" && (p.scrollTop = w > 0 ? w : 0, A.style.justifyContent = "flex-end");
+                  const E = k + v, S = Math.min(C, E), R = E - S;
+                  A.style.height = S + "px", A.style.bottom === "0px" && (p.scrollTop = R > 0 ? R : 0, A.style.justifyContent = "flex-end");
                 }
               }
             }
@@ -632,8 +632,8 @@ var ir = "SelectItem", [lu, xo] = cn(ir), To = h.forwardRef(
                   E.currentTarget === document.activeElement && ((S = d.onItemLeave) == null || S.call(d));
                 }),
                 onKeyDown: ge(l.onKeyDown, (E) => {
-                  var w;
-                  ((w = d.searchRef) == null ? void 0 : w.current) !== "" && E.key === " " || (qd.includes(E.key) && k(), E.key === " " && E.preventDefault());
+                  var R;
+                  ((R = d.searchRef) == null ? void 0 : R.current) !== "" && E.key === " " || (qd.includes(E.key) && k(), E.key === " " && E.preventDefault());
                 })
               }
             )
@@ -842,33 +842,33 @@ var gu = po, mu = mo, fu = Co, Cu = vo, vu = ko, ku = yo, yu = Eo, bu = Ro, Iu =
       inverted: v = !1,
       form: C,
       ...m
-    } = n, I = h.useRef(/* @__PURE__ */ new Set()), k = h.useRef(0), S = l === "horizontal" ? Tu : Ju, [w = [], R] = ar({
+    } = n, I = h.useRef(/* @__PURE__ */ new Set()), k = h.useRef(0), S = l === "horizontal" ? Tu : Ju, [R = [], w] = ar({
       prop: p,
       defaultProp: u,
       onChange: (Q) => {
-        var F;
-        (F = [...I.current][k.current]) == null || F.focus(), A(Q);
+        var O;
+        (O = [...I.current][k.current]) == null || O.focus(), A(Q);
       }
-    }), B = h.useRef(w);
-    function x(Q) {
-      const M = Ou(w, Q);
-      D(Q, M);
+    }), N = h.useRef(R);
+    function B(Q) {
+      const M = Ou(R, Q);
+      T(Q, M);
     }
-    function N(Q) {
-      D(Q, k.current);
+    function x(Q) {
+      T(Q, k.current);
     }
-    function T() {
-      const Q = B.current[k.current];
-      w[k.current] !== Q && g(w);
+    function J() {
+      const Q = N.current[k.current];
+      R[k.current] !== Q && g(R);
     }
-    function D(Q, M, { commit: F } = { commit: !1 }) {
-      const U = Wu(i), O = ju(Math.round((Q - s) / i) * i + s, U), z = or(O, [s, o]);
-      R((X = []) => {
+    function T(Q, M, { commit: O } = { commit: !1 }) {
+      const U = Wu(i), F = ju(Math.round((Q - s) / i) * i + s, U), z = or(F, [s, o]);
+      w((X = []) => {
         const $ = Mu(X, z, M);
         if (zu($, d * i)) {
           k.current = $.indexOf(z);
           const W = String($) !== String(X);
-          return W && F && g($), W ? $ : X;
+          return W && O && g($), W ? $ : X;
         } else
           return X;
       });
@@ -883,7 +883,7 @@ var gu = po, mu = mo, fu = Co, Cu = vo, vu = ko, ku = yo, yu = Eo, bu = Ro, Iu =
         max: o,
         valueIndexToChangeRef: k,
         thumbs: I.current,
-        values: w,
+        values: R,
         orientation: l,
         form: C,
         children: /* @__PURE__ */ a(os.Provider, { scope: n.__scopeSlider, children: /* @__PURE__ */ a(os.Slot, { scope: n.__scopeSlider, children: /* @__PURE__ */ a(
@@ -894,20 +894,20 @@ var gu = po, mu = mo, fu = Co, Cu = vo, vu = ko, ku = yo, yu = Eo, bu = Ro, Iu =
             ...m,
             ref: t,
             onPointerDown: ge(m.onPointerDown, () => {
-              c || (B.current = w);
+              c || (N.current = R);
             }),
             min: s,
             max: o,
             inverted: v,
-            onSlideStart: c ? void 0 : x,
-            onSlideMove: c ? void 0 : N,
-            onSlideEnd: c ? void 0 : T,
-            onHomeKeyDown: () => !c && D(s, 0, { commit: !0 }),
-            onEndKeyDown: () => !c && D(o, w.length - 1, { commit: !0 }),
+            onSlideStart: c ? void 0 : B,
+            onSlideMove: c ? void 0 : x,
+            onSlideEnd: c ? void 0 : J,
+            onHomeKeyDown: () => !c && T(s, 0, { commit: !0 }),
+            onEndKeyDown: () => !c && T(o, R.length - 1, { commit: !0 }),
             onStepKeyDown: ({ event: Q, direction: M }) => {
               if (!c) {
-                const O = Wo.includes(Q.key) || Q.shiftKey && jo.includes(Q.key) ? 10 : 1, z = k.current, X = w[z], $ = i * O * M;
-                D(X + $, z, { commit: !0 });
+                const F = Wo.includes(Q.key) || Q.shiftKey && jo.includes(Q.key) ? 10 : 1, z = k.current, X = R[z], $ = i * F * M;
+                T(X + $, z, { commit: !0 });
               }
             }
           }
@@ -936,8 +936,8 @@ var [Vo, Go] = Ko(dn, {
       ...p
     } = n, [A, g] = h.useState(null), v = Je(t, (S) => g(S)), C = h.useRef(void 0), m = Wa(o), I = m === "ltr", k = I && !i || !I && i;
     function E(S) {
-      const w = C.current || A.getBoundingClientRect(), R = [0, w.width], x = Os(R, k ? [r, s] : [s, r]);
-      return C.current = w, x(S - w.left);
+      const R = C.current || A.getBoundingClientRect(), w = [0, R.width], B = Os(w, k ? [r, s] : [s, r]);
+      return C.current = R, B(S - R.left);
     }
     return /* @__PURE__ */ a(
       Vo,
@@ -959,19 +959,19 @@ var [Vo, Go] = Ko(dn, {
               "--radix-slider-thumb-transform": "translateX(-50%)"
             },
             onSlideStart: (S) => {
-              const w = E(S.clientX);
-              l == null || l(w);
+              const R = E(S.clientX);
+              l == null || l(R);
             },
             onSlideMove: (S) => {
-              const w = E(S.clientX);
-              c == null || c(w);
+              const R = E(S.clientX);
+              c == null || c(R);
             },
             onSlideEnd: () => {
               C.current = void 0, d == null || d();
             },
             onStepKeyDown: (S) => {
-              const R = Ho[k ? "from-left" : "from-right"].includes(S.key);
-              u == null || u({ event: S, direction: R ? -1 : 1 });
+              const w = Ho[k ? "from-left" : "from-right"].includes(S.key);
+              u == null || u({ event: S, direction: w ? -1 : 1 });
             }
           }
         )
@@ -1426,13 +1426,13 @@ const di = h.forwardRef((n, t) => {
   h.useEffect(() => k(i), [i]);
   const [E, S] = h.useState(l);
   h.useEffect(() => S(l), [l]);
-  const [w, R] = h.useState(c);
-  return h.useEffect(() => R(c), [c]), h.createElement(Ps, { ...u, ref: t, isRoot: !0, hasBackground: d, appearance: p, accentColor: g, grayColor: C, panelBackground: I, radius: E, scaling: w, onAppearanceChange: A, onAccentColorChange: v, onGrayColorChange: m, onPanelBackgroundChange: k, onRadiusChange: S, onScalingChange: R });
+  const [R, w] = h.useState(c);
+  return h.useEffect(() => w(c), [c]), h.createElement(Ps, { ...u, ref: t, isRoot: !0, hasBackground: d, appearance: p, accentColor: g, grayColor: C, panelBackground: I, radius: E, scaling: R, onAppearanceChange: A, onAccentColorChange: v, onGrayColorChange: m, onPanelBackgroundChange: k, onRadiusChange: S, onScalingChange: w });
 });
 di.displayName = "ThemeRoot";
 const Ps = h.forwardRef((n, t) => {
-  const r = h.useContext(lr), { asChild: s, isRoot: o, hasBackground: i, appearance: l = (r == null ? void 0 : r.appearance) ?? He.appearance.default, accentColor: c = (r == null ? void 0 : r.accentColor) ?? He.accentColor.default, grayColor: d = (r == null ? void 0 : r.resolvedGrayColor) ?? He.grayColor.default, panelBackground: u = (r == null ? void 0 : r.panelBackground) ?? He.panelBackground.default, radius: p = (r == null ? void 0 : r.radius) ?? He.radius.default, scaling: A = (r == null ? void 0 : r.scaling) ?? He.scaling.default, onAppearanceChange: g = Zt, onAccentColorChange: v = Zt, onGrayColorChange: C = Zt, onPanelBackgroundChange: m = Zt, onRadiusChange: I = Zt, onScalingChange: k = Zt, ...E } = n, S = s ? Re : "div", w = d === "auto" ? rh(c) : d, R = n.appearance === "light" || n.appearance === "dark", B = i === void 0 ? o || R : i;
-  return h.createElement(lr.Provider, { value: h.useMemo(() => ({ appearance: l, accentColor: c, grayColor: d, resolvedGrayColor: w, panelBackground: u, radius: p, scaling: A, onAppearanceChange: g, onAccentColorChange: v, onGrayColorChange: C, onPanelBackgroundChange: m, onRadiusChange: I, onScalingChange: k }), [l, c, d, w, u, p, A, g, v, C, m, I, k]) }, h.createElement(S, { "data-is-root-theme": o ? "true" : "false", "data-accent-color": c, "data-gray-color": w, "data-has-background": B ? "true" : "false", "data-panel-background": u, "data-radius": p, "data-scaling": A, ref: t, ...E, className: y("radix-themes", { light: l === "light", dark: l === "dark" }, E.className) }));
+  const r = h.useContext(lr), { asChild: s, isRoot: o, hasBackground: i, appearance: l = (r == null ? void 0 : r.appearance) ?? He.appearance.default, accentColor: c = (r == null ? void 0 : r.accentColor) ?? He.accentColor.default, grayColor: d = (r == null ? void 0 : r.resolvedGrayColor) ?? He.grayColor.default, panelBackground: u = (r == null ? void 0 : r.panelBackground) ?? He.panelBackground.default, radius: p = (r == null ? void 0 : r.radius) ?? He.radius.default, scaling: A = (r == null ? void 0 : r.scaling) ?? He.scaling.default, onAppearanceChange: g = Zt, onAccentColorChange: v = Zt, onGrayColorChange: C = Zt, onPanelBackgroundChange: m = Zt, onRadiusChange: I = Zt, onScalingChange: k = Zt, ...E } = n, S = s ? Re : "div", R = d === "auto" ? rh(c) : d, w = n.appearance === "light" || n.appearance === "dark", N = i === void 0 ? o || w : i;
+  return h.createElement(lr.Provider, { value: h.useMemo(() => ({ appearance: l, accentColor: c, grayColor: d, resolvedGrayColor: R, panelBackground: u, radius: p, scaling: A, onAppearanceChange: g, onAccentColorChange: v, onGrayColorChange: C, onPanelBackgroundChange: m, onRadiusChange: I, onScalingChange: k }), [l, c, d, R, u, p, A, g, v, C, m, I, k]) }, h.createElement(S, { "data-is-root-theme": o ? "true" : "false", "data-accent-color": c, "data-gray-color": R, "data-has-background": N ? "true" : "false", "data-panel-background": u, "data-radius": p, "data-scaling": A, ref: t, ...E, className: y("radix-themes", { light: l === "light", dark: l === "dark" }, E.className) }));
 });
 Ps.displayName = "ThemeImpl";
 const xt = (n) => {
@@ -2228,7 +2228,7 @@ const Gg = ({
 }) => {
   const u = () => {
     window.open(s, "_self"), o == null || o();
-  }, p = J(
+  }, p = D(
     (A) => {
       A.stopPropagation(), d == null || d();
     },
@@ -2950,25 +2950,25 @@ const uf = "_DataTable_kyf7f_1", hf = "_titleText_kyf7f_23", Af = "_artistText_k
   const r = (o = (s = n.active) == null ? void 0 : s.data) == null ? void 0 : o.current;
   return !((r == null ? void 0 : r.source) !== "data-table" || t && r.dndScopeId !== t);
 }, sC = ({ handlers: n, dndScopeId: t }) => (Fd({
-  onDragStart: J(
+  onDragStart: D(
     (r) => {
       Ln(r, t) && n.current.onDragStart(r);
     },
     [t, n]
   ),
-  onDragOver: J(
+  onDragOver: D(
     (r) => {
       Ln(r, t) && n.current.onDragOver(r);
     },
     [t, n]
   ),
-  onDragCancel: J(
+  onDragCancel: D(
     (r) => {
       Ln(r, t) && n.current.onDragCancel(r);
     },
     [t, n]
   ),
-  onDragEnd: J(
+  onDragEnd: D(
     (r) => {
       Ln(r, t) && n.current.onDragEnd(r);
     },
@@ -2989,56 +2989,56 @@ const uf = "_DataTable_kyf7f_1", hf = "_titleText_kyf7f_23", Af = "_artistText_k
       activationConstraint: { distance: 6 }
     })
   ), m = _(
-    () => new Map(n.map((x) => [x.id, x])),
+    () => new Map(n.map((B) => [B.id, B])),
     [n]
-  ), I = J(() => {
+  ), I = D(() => {
     u(null), A(null), v(null);
-  }, []), k = J(
-    (x) => {
-      var F;
-      const N = String(((F = x.active) == null ? void 0 : F.id) ?? "");
-      if (!N) return;
-      const T = m.get(N);
-      if (!T) return;
-      const D = t.has(N), Q = D && r.length > 0 ? r : [T], M = {
-        row: T,
+  }, []), k = D(
+    (B) => {
+      var O;
+      const x = String(((O = B.active) == null ? void 0 : O.id) ?? "");
+      if (!x) return;
+      const J = m.get(x);
+      if (!J) return;
+      const T = t.has(x), Q = T && r.length > 0 ? r : [J], M = {
+        row: J,
         selectedRows: Q,
-        isDraggedRowSelected: D
+        isDraggedRowSelected: T
       };
-      u(N), A(N), v(M), i == null || i(M, x.activatorEvent);
+      u(x), A(x), v(M), i == null || i(M, B.activatorEvent);
     },
     [i, m, r, t]
-  ), E = J((x) => {
-    var N;
-    A((N = x.over) != null && N.id ? String(x.over.id) : null);
-  }, []), S = J(
-    (x) => {
-      g != null && g.row && (l == null || l(g.row, x == null ? void 0 : x.activatorEvent)), I();
+  ), E = D((B) => {
+    var x;
+    A((x = B.over) != null && x.id ? String(B.over.id) : null);
+  }, []), S = D(
+    (B) => {
+      g != null && g.row && (l == null || l(g.row, B == null ? void 0 : B.activatorEvent)), I();
     },
     [g, l, I]
-  ), w = J(
-    (x) => {
+  ), R = D(
+    (B) => {
       var Q, M;
-      const N = String(((Q = x.active) == null ? void 0 : Q.id) ?? ""), T = (M = x.over) != null && M.id ? String(x.over.id) : null, D = m.get(N) ?? (g == null ? void 0 : g.row);
-      if (D && (l == null || l(D, x.activatorEvent)), s && T && N) {
-        const F = n.findIndex((O) => O.id === N);
+      const x = String(((Q = B.active) == null ? void 0 : Q.id) ?? ""), J = (M = B.over) != null && M.id ? String(B.over.id) : null, T = m.get(x) ?? (g == null ? void 0 : g.row);
+      if (T && (l == null || l(T, B.activatorEvent)), s && J && x) {
+        const O = n.findIndex((F) => F.id === x);
         let U = null;
-        if (T === us)
+        if (J === us)
           U = 0;
-        else if (T === hs)
+        else if (J === hs)
           U = n.length;
-        else if (N !== T) {
-          const O = n.findIndex((z) => z.id === T);
-          O >= 0 && (U = O > F ? O + 1 : O);
+        else if (x !== J) {
+          const F = n.findIndex((z) => z.id === J);
+          F >= 0 && (U = F > O ? F + 1 : F);
         }
-        if (F >= 0 && U != null) {
-          const O = tC({
+        if (O >= 0 && U != null) {
+          const F = tC({
             data: n,
             selectedSet: t,
-            order: F,
+            order: O,
             moveBefore: U
           });
-          O && (o == null || o(O));
+          F && (o == null || o(F));
         }
       }
       I();
@@ -3053,32 +3053,32 @@ const uf = "_DataTable_kyf7f_1", hf = "_titleText_kyf7f_23", Af = "_artistText_k
       m,
       t
     ]
-  ), R = _(
+  ), w = _(
     () => ({
       sensors: C,
       collisionDetection: Od,
       onDragStart: k,
       onDragOver: E,
       onDragCancel: S,
-      onDragEnd: w
+      onDragEnd: R
     }),
-    [S, w, E, k, C]
-  ), B = _(
+    [S, R, E, k, C]
+  ), N = _(
     () => ({
       onDragStart: k,
       onDragOver: E,
       onDragCancel: S,
-      onDragEnd: w
+      onDragEnd: R
     }),
-    [k, E, S, w]
+    [k, E, S, R]
   );
   return {
-    dndContextProps: R,
+    dndContextProps: w,
     activeDragRowId: d,
     overDragRowId: p,
     activeDragContext: g,
-    sortableItems: n.map((x) => x.id),
-    monitorHandlers: B
+    sortableItems: n.map((B) => B.id),
+    monitorHandlers: N
   };
 }, Vn = (n) => typeof n == "string" ? n.toUpperCase() : n, oC = ({
   columns: n,
@@ -3207,7 +3207,7 @@ const dC = Ee.memo(function({
   dndScopeId: S
 }) {
   var se;
-  const w = ee(!1), R = ee(!1), B = ee(!1), x = ee(!1), { listeners: N, setNodeRef: T, transform: D, transition: Q, isDragging: M } = jd({
+  const R = ee(!1), w = ee(!1), N = ee(!1), B = ee(!1), { listeners: x, setNodeRef: J, transform: T, transition: Q, isDragging: M } = jd({
     id: r,
     disabled: !Ca({ row: t, rowDraggable: I, reorderable: k }),
     data: {
@@ -3217,50 +3217,50 @@ const dC = Ee.memo(function({
       row: t,
       rowIndex: s
     }
-  }), F = {
-    ...D ? { transform: Ld.Transform.toString(D) } : {},
+  }), O = {
+    ...T ? { transform: Ld.Transform.toString(T) } : {},
     ...Q ? { transition: Q } : {}
-  }, U = i ? { ...F, "--row-bg": "var(--aqua-alpha-2)" } : F, O = (L) => {
-    if (R.current) {
-      R.current = !1;
+  }, U = i ? { ...O, "--row-bg": "var(--aqua-alpha-2)" } : O, F = (L) => {
+    if (w.current) {
+      w.current = !1;
       return;
     }
     L.shiftKey ? (L.preventDefault(), v == null || v(t, s)) : A == null || A(t);
   }, z = (L) => {
-    L.pointerType === "touch" && (R.current = !0, L.shiftKey ? v == null || v(t, s) : A == null || A(t));
+    L.pointerType === "touch" && (w.current = !0, L.shiftKey ? v == null || v(t, s) : A == null || A(t));
   }, X = (L) => {
-    L.stopPropagation(), L.shiftKey && (L.preventDefault(), w.current = !0, v == null || v(t, s), setTimeout(() => {
-      w.current = !1;
+    L.stopPropagation(), L.shiftKey && (L.preventDefault(), R.current = !0, v == null || v(t, s), setTimeout(() => {
+      R.current = !1;
     }, 0));
   }, $ = (L) => {
     if (L.key === "Enter") {
       if (L.preventDefault(), L.stopPropagation(), L.shiftKey) {
-        w.current = !0, v == null || v(t, s), setTimeout(() => {
-          w.current = !1;
+        R.current = !0, v == null || v(t, s), setTimeout(() => {
+          R.current = !1;
         }, 0);
         return;
       }
-      r != null && (x.current = !0, g == null || g(r, !i));
+      r != null && (B.current = !0, g == null || g(r, !i));
     }
   }, W = (L) => {
-    if (L.stopPropagation(), B.current) {
-      B.current = !1;
+    if (L.stopPropagation(), N.current) {
+      N.current = !1;
       return;
     }
     L.shiftKey ? (L.preventDefault(), v == null || v(t, s)) : r != null && (g == null || g(r, !i));
   }, re = (L) => {
-    L.pointerType === "touch" && (L.stopPropagation(), B.current = !0, L.shiftKey ? v == null || v(t, s) : r != null && (g == null || g(r, !i)));
+    L.pointerType === "touch" && (L.stopPropagation(), N.current = !0, L.shiftKey ? v == null || v(t, s) : r != null && (g == null || g(r, !i)));
   }, Ne = (L) => {
-    if (w.current) {
-      w.current = !1;
+    if (R.current) {
+      R.current = !1;
       return;
     }
-    if (B.current) {
-      B.current = !1;
+    if (N.current) {
+      N.current = !1;
       return;
     }
-    if (x.current) {
-      x.current = !1;
+    if (B.current) {
+      B.current = !1;
       return;
     }
     r != null && (g == null || g(r, L === !0));
@@ -3268,7 +3268,7 @@ const dC = Ee.memo(function({
   return /* @__PURE__ */ f(
     Fn,
     {
-      ref: T,
+      ref: J,
       "data-row-id": r ?? void 0,
       className: y({
         [V.rowSelected]: i,
@@ -3278,7 +3278,7 @@ const dC = Ee.memo(function({
         [V.rowReorderable]: be
       }),
       style: U,
-      ...Le ? N : {},
+      ...Le ? x : {},
       children: [
         /* @__PURE__ */ a(
           bt,
@@ -3315,14 +3315,14 @@ const dC = Ee.memo(function({
             ),
             "data-column-id": L.id,
             "data-sorted": d === L.id,
-            onClick: j === 0 ? void 0 : O,
+            onClick: j === 0 ? void 0 : F,
             onPointerUp: j === 0 ? void 0 : z,
             children: j === 0 ? /* @__PURE__ */ a(
               "button",
               {
                 type: "button",
                 className: V.rowActionButton,
-                onClick: O,
+                onClick: F,
                 onPointerUp: z,
                 children: C(t)
               }
@@ -3394,25 +3394,25 @@ const dC = Ee.memo(function({
   overDragRowId: m,
   dndScopeId: I
 }) => {
-  const k = t.length + 1 + (d ? 1 : 0), E = J((w) => /* @__PURE__ */ f(b, { align: "center", gap: "3", children: [
+  const k = t.length + 1 + (d ? 1 : 0), E = D((R) => /* @__PURE__ */ f(b, { align: "center", gap: "3", children: [
     /* @__PURE__ */ a(
       Jr,
       {
-        title: w.title,
+        title: R.title,
         size: 48,
         className: V.thumb,
-        type: w.type,
-        cover: w.thumb
+        type: R.type,
+        cover: R.thumb
       }
     ),
     /* @__PURE__ */ f(b, { direction: "column", style: { minWidth: 0, flex: 1 }, children: [
-      /* @__PURE__ */ a(H, { size: "2", className: V.titleText, children: w.title }),
-      /* @__PURE__ */ a(H, { size: "1", className: V.artistText, children: w.artist })
+      /* @__PURE__ */ a(H, { size: "2", className: V.titleText, children: R.title }),
+      /* @__PURE__ */ a(H, { size: "1", className: V.artistText, children: R.artist })
     ] })
-  ] }), []), S = J((w, R, B) => {
-    var D;
-    const x = (w == null ? void 0 : w[R.id]) ?? (w == null ? void 0 : w[`${R.id}Formatted`]), N = ((D = R.render) == null ? void 0 : D.call(R, { row: w, value: x, column: R, index: B })) ?? x;
-    return typeof N == "string" || typeof N == "number" || N == null ? /* @__PURE__ */ a(H, { size: "2", className: V.cellText, children: N }) : N;
+  ] }), []), S = D((R, w, N) => {
+    var T;
+    const B = (R == null ? void 0 : R[w.id]) ?? (R == null ? void 0 : R[`${w.id}Formatted`]), x = ((T = w.render) == null ? void 0 : T.call(w, { row: R, value: B, column: w, index: N })) ?? B;
+    return typeof x == "string" || typeof x == "number" || x == null ? /* @__PURE__ */ a(H, { size: "2", className: V.cellText, children: x }) : x;
   }, []);
   return /* @__PURE__ */ a(na, { children: /* @__PURE__ */ f(Hd, { items: r, strategy: Kd, children: [
     v && /* @__PURE__ */ a(
@@ -3423,14 +3423,14 @@ const dC = Ee.memo(function({
         colSpan: k
       }
     ),
-    n.map((w, R) => /* @__PURE__ */ a(
+    n.map((R, w) => /* @__PURE__ */ a(
       dC,
       {
-        rowId: w.id,
-        row: w,
-        rowIndex: R,
+        rowId: R.id,
+        row: R,
+        rowIndex: w,
         columns: t,
-        isSelected: s(w, R),
+        isSelected: s(R, w),
         anyRowSelected: o,
         selectedCount: i,
         sortedKey: l,
@@ -3443,10 +3443,10 @@ const dC = Ee.memo(function({
         renderDataCell: S,
         rowDraggable: g,
         reorderable: v,
-        isDragOver: v && m === w.id && C !== w.id,
+        isDragOver: v && m === R.id && C !== R.id,
         dndScopeId: I
       },
-      w.id
+      R.id
     )),
     v && /* @__PURE__ */ a(
       va,
@@ -3478,57 +3478,57 @@ const dC = Ee.memo(function({
   onRowDragMove: k,
   onRowDragEnd: E,
   getDragPreviewLabel: S,
-  getDragPreviewCountLabel: w,
-  renderDragPreview: R,
-  renderDndContext: B = !0,
-  dndScopeId: x,
-  ...N
+  getDragPreviewCountLabel: R,
+  renderDragPreview: w,
+  renderDndContext: N = !0,
+  dndScopeId: B,
+  ...x
 }) => {
   var Pe, $e;
-  const T = ee(null), D = c == null ? void 0 : c.field, Q = (Pe = t == null ? void 0 : t[0]) == null ? void 0 : Pe.id, M = ($e = t == null ? void 0 : t[1]) == null ? void 0 : $e.id, F = _(() => {
+  const J = ee(null), T = c == null ? void 0 : c.field, Q = (Pe = t == null ? void 0 : t[0]) == null ? void 0 : Pe.id, M = ($e = t == null ? void 0 : t[1]) == null ? void 0 : $e.id, O = _(() => {
     if (t != null && t.length)
-      return !D || D === Q ? M : D;
-  }, [t, D, Q, M]), U = _(
+      return !T || T === Q ? M : T;
+  }, [t, T, Q, M]), U = _(
     () => r.map((he, Ce) => _f(he, Ce)),
     [r]
-  ), O = _(
+  ), F = _(
     () => new Set((s ?? []).map((he) => String(he))),
     [s]
   ), z = _(
-    () => U.filter((he) => he.id && O.has(he.id)),
-    [U, O]
-  ), X = J(
+    () => U.filter((he) => he.id && F.has(he.id)),
+    [U, F]
+  ), X = D(
     (he, Ce) => {
       const Be = Ht(he, Ce);
-      return Be != null && O.has(Be);
+      return Be != null && F.has(Be);
     },
-    [O]
+    [F]
   ), $ = s.length, W = (r == null ? void 0 : r.length) ?? 0, re = $ > 0, Ne = W > 0 && $ === W, ke = _(
     () => r == null ? void 0 : r.some((he) => {
       var Ce;
       return (Ce = he.dropdownOptions) == null ? void 0 : Ce.length;
     }),
     [r]
-  ), Le = J(
+  ), Le = D(
     (he) => {
       i == null || i(he);
     },
     [i]
-  ), be = J(
+  ), be = D(
     (he, Ce) => {
       if (!p) return;
-      const Be = T.current, ze = Be != null ? Math.min(Be, Ce) : Ce, Qr = Be != null ? Math.max(Be, Ce) : Ce;
+      const Be = J.current, ze = Be != null ? Math.min(Be, Ce) : Ce, Qr = Be != null ? Math.max(Be, Ce) : Ce;
       for (let zn = ze; zn <= Qr; zn++) {
         const ia = Ht(r[zn], zn);
         ia != null && p(ia, !0);
       }
-      Be == null && (T.current = Ce);
+      Be == null && (J.current = Ce);
     },
     [r, p]
-  ), se = J(
+  ), se = D(
     (he, Ce) => {
       const Be = (r == null ? void 0 : r.findIndex((ze, Qr) => Ht(ze, Qr) === String(he))) ?? -1;
-      Be >= 0 && (T.current = Be), p == null || p(String(he), Ce);
+      Be >= 0 && (J.current = Be), p == null || p(String(he), Ce);
     },
     [r, p]
   ), {
@@ -3540,16 +3540,16 @@ const dC = Ee.memo(function({
     monitorHandlers: ae
   } = aC({
     rows: U,
-    selectedSet: O,
+    selectedSet: F,
     selectedRows: z,
     reorderable: v,
     onReorder: C,
     onRowDragStart: I,
     onRowDragEnd: E,
-    dndScopeId: x
+    dndScopeId: B
   }), oe = ee(ae);
   oe.current = ae;
-  const { style: qe, ...Ye } = N, Qe = typeof A == "number" ? `${A}px` : A, ut = typeof g == "number" ? `${g}px` : g, at = /* @__PURE__ */ f(
+  const { style: qe, ...Ye } = x, Qe = typeof A == "number" ? `${A}px` : A, ut = typeof g == "number" ? `${g}px` : g, at = /* @__PURE__ */ f(
     ea,
     {
       className: y(V.DataTable, n),
@@ -3565,9 +3565,9 @@ const dC = Ee.memo(function({
           oC,
           {
             columns: t,
-            sortedKey: D,
+            sortedKey: T,
             sorting: c,
-            mobileSecondaryColumnId: F,
+            mobileSecondaryColumnId: O,
             anyRowChecked: re,
             allRowsChecked: Ne,
             selectedFilesLabel: o,
@@ -3588,8 +3588,8 @@ const dC = Ee.memo(function({
             isRowSelected: X,
             anyRowChecked: re,
             selectedCount: $,
-            sortedKey: D,
-            mobileSecondaryColumnId: F,
+            sortedKey: T,
+            mobileSecondaryColumnId: O,
             hasDropdownOptions: ke,
             onClick: Le,
             onSelectRow: se,
@@ -3598,7 +3598,7 @@ const dC = Ee.memo(function({
             reorderable: v,
             activeDragRowId: j,
             overDragRowId: le,
-            dndScopeId: x
+            dndScopeId: B
           }
         )
       ]
@@ -3607,12 +3607,12 @@ const dC = Ee.memo(function({
     rC,
     {
       model: Ie,
-      renderDragPreview: R,
+      renderDragPreview: w,
       getDragPreviewLabel: S,
-      getDragPreviewCountLabel: w
+      getDragPreviewCountLabel: R
     }
   ) }) : null });
-  return B ? /* @__PURE__ */ f(Pd, { ...L, children: [
+  return N ? /* @__PURE__ */ f(Pd, { ...L, children: [
     at,
     q
   ] }) : /* @__PURE__ */ f(fe, { children: [
@@ -3620,7 +3620,7 @@ const dC = Ee.memo(function({
       sC,
       {
         handlers: oe,
-        dndScopeId: x
+        dndScopeId: B
       }
     ),
     at,
@@ -3753,10 +3753,10 @@ const ka = ra(Pc), on = Ze(
     wrapCloseMenu: A,
     ...g
   }) => {
-    const v = g.open !== void 0, [C, m] = K(!1), I = v ? g.open : C, k = J((R) => {
-      var B;
-      v || m(R), (B = g == null ? void 0 : g.onOpenChange) == null || B.call(g, R);
-    }, [v, g == null ? void 0 : g.onOpenChange]), E = J(() => k(!1), [k]), S = A ? A(E) : E, w = {
+    const v = g.open !== void 0, [C, m] = K(!1), I = v ? g.open : C, k = D((w) => {
+      var N;
+      v || m(w), (N = g == null ? void 0 : g.onOpenChange) == null || N.call(g, w);
+    }, [v, g == null ? void 0 : g.onOpenChange]), E = D(() => k(!1), [k]), S = A ? A(E) : E, R = {
       ...p && {
         width: "var(--radix-dropdown-menu-trigger-width)",
         boxSizing: "border-box"
@@ -3788,21 +3788,21 @@ const ka = ra(Pc), on = Ze(
               size: o,
               side: g.side,
               align: g.align,
-              style: w,
+              style: R,
               sideOffset: u,
               alignOffset: 0,
-              onCloseAutoFocus: (R) => {
-                R.preventDefault();
+              onCloseAutoFocus: (w) => {
+                w.preventDefault();
               },
-              onClick: (R) => R.stopPropagation(),
+              onClick: (w) => w.stopPropagation(),
               children: /* @__PURE__ */ a(
                 Xt,
                 {
                   scrollbars: "vertical",
                   style: { height: c },
                   children: t == null ? void 0 : t.map(
-                    (R) => ka(
-                      R,
+                    (w) => ka(
+                      w,
                       o,
                       i,
                       d,
@@ -3819,16 +3819,16 @@ const ka = ra(Pc), on = Ze(
               size: o,
               side: g.side,
               align: g.align,
-              style: w,
+              style: R,
               sideOffset: u,
               alignOffset: 0,
-              onCloseAutoFocus: (R) => {
-                R.preventDefault();
+              onCloseAutoFocus: (w) => {
+                w.preventDefault();
               },
-              onClick: (R) => R.stopPropagation(),
+              onClick: (w) => w.stopPropagation(),
               children: t == null ? void 0 : t.map(
-                (R) => ka(
-                  R,
+                (w) => ka(
+                  w,
                   o,
                   i,
                   d,
@@ -4041,54 +4041,54 @@ function zC({ initialScreen: n, animated: t, children: r }) {
     return Gc.forEach(r, (M) => {
       (M == null ? void 0 : M.type) === Al && (Q[M.props.name] = M.props);
     }), Q;
-  }, [r]), g = J((Q, M = null) => {
-    t && M && PC(p.current, M), o(Q), l({}), d((F) => F + 1);
-  }, [t]), v = J(
-    (Q, M = {}) => g((F) => [...F, { name: Q, params: M }], "forward"),
+  }, [r]), g = D((Q, M = null) => {
+    t && M && PC(p.current, M), o(Q), l({}), d((O) => O + 1);
+  }, [t]), v = D(
+    (Q, M = {}) => g((O) => [...O, { name: Q, params: M }], "forward"),
     [g]
-  ), C = J(
+  ), C = D(
     () => g((Q) => Q.length > 1 ? Q.slice(0, -1) : Q, "back"),
     [g]
-  ), m = J(
+  ), m = D(
     (Q) => g((M) => {
-      const F = M.findIndex((U) => U.name === Q);
-      if (F === -1) throw new Error(`Screen "${Q}" is not in the stack`);
-      return M.slice(0, F + 1);
+      const O = M.findIndex((U) => U.name === Q);
+      if (O === -1) throw new Error(`Screen "${Q}" is not in the stack`);
+      return M.slice(0, O + 1);
     }, "back"),
     [g]
-  ), I = J(
+  ), I = D(
     (Q) => g(() => [{ name: Q || n, params: {} }]),
     [g, n]
   ), k = s.length > 1, E = _(
     () => ({ push: v, pop: C, popTo: m, reset: I, canGoBack: k, stack: s }),
     [v, C, m, I, k, s]
-  ), S = s[s.length - 1], w = A[S.name];
-  if (!w) return null;
-  const R = _(
+  ), S = s[s.length - 1], R = A[S.name];
+  if (!R) return null;
+  const w = _(
     () => s.map((Q, M) => {
-      var F;
-      return (F = A[Q.name]) != null && F.keepMounted ? { entry: Q, stackIndex: M } : null;
+      var O;
+      return (O = A[Q.name]) != null && O.keepMounted ? { entry: Q, stackIndex: M } : null;
     }).filter(Boolean),
     [s, A]
-  ), B = (Q, M) => Q in i ? i[Q] : w[Q] ?? M, x = w.component, N = w.keepMounted === !0, T = J(
+  ), N = (Q, M) => Q in i ? i[Q] : R[Q] ?? M, B = R.component, x = R.keepMounted === !0, J = D(
     (Q) => {
-      u.current[u.current.length - 1].name === S.name && l((F) => ({ ...F, ...Q }));
+      u.current[u.current.length - 1].name === S.name && l((O) => ({ ...O, ...Q }));
     },
     [S.name]
-  ), D = _(
-    () => ({ name: S.name, params: S.params || {}, setOptions: T }),
-    [S.name, S.params, T]
+  ), T = _(
+    () => ({ name: S.name, params: S.params || {}, setOptions: J }),
+    [S.name, S.params, J]
   );
   return /* @__PURE__ */ a(ul.Provider, { value: E, children: /* @__PURE__ */ f("div", { style: { display: "flex", flexDirection: "column", flex: 1, minHeight: 0 }, children: [
     /* @__PURE__ */ a(
       hl,
       {
-        title: B("title"),
+        title: N("title"),
         onBack: k ? C : void 0,
-        headerLeft: B("headerLeft"),
-        headerRight: B("headerRight"),
-        allowClose: B("allowClose", !0),
-        onClose: B("onClose")
+        headerLeft: N("headerLeft"),
+        headerRight: N("headerRight"),
+        allowClose: N("allowClose", !0),
+        onClose: N("onClose")
       }
     ),
     /* @__PURE__ */ f(
@@ -4104,15 +4104,15 @@ function zC({ initialScreen: n, animated: t, children: r }) {
           overflow: "hidden"
         },
         children: [
-          R.map(({ entry: Q, stackIndex: M }) => {
-            const F = A[Q.name];
-            if (!(F != null && F.component)) return null;
-            const U = F.component, O = Q.name === S.name, z = O ? D : { name: Q.name, params: Q.params || {}, setOptions: () => {
+          w.map(({ entry: Q, stackIndex: M }) => {
+            const O = A[Q.name];
+            if (!(O != null && O.component)) return null;
+            const U = O.component, F = Q.name === S.name, z = F ? T : { name: Q.name, params: Q.params || {}, setOptions: () => {
             } };
             return /* @__PURE__ */ a(
               "div",
               {
-                style: O ? {
+                style: F ? {
                   position: "relative",
                   display: "flex",
                   flexDirection: "column",
@@ -4130,7 +4130,7 @@ function zC({ initialScreen: n, animated: t, children: r }) {
               `layer-${M}`
             );
           }),
-          !N && /* @__PURE__ */ a(As.Provider, { value: D, children: /* @__PURE__ */ a(x, {}) }, c)
+          !x && /* @__PURE__ */ a(As.Provider, { value: T, children: /* @__PURE__ */ a(B, {}) }, c)
         ]
       }
     )
@@ -4171,9 +4171,9 @@ const WC = "_floatingBanner_1jevw_1", jC = "_white_1jevw_12", HC = "_error_1jevw
   onDismiss: u,
   className: p
 }) => {
-  const A = J(() => {
+  const A = D(() => {
     u == null || u(n);
-  }, [n, u]), g = J(() => {
+  }, [n, u]), g = D(() => {
     d == null || d(n);
   }, [n, d]);
   return /* @__PURE__ */ f(
@@ -4554,38 +4554,38 @@ const lw = Tr, pv = "_sliderRoot_19e7a_23", gv = "_sliderTrack_19e7a_31", mv = "
   tooltipArrow: vv,
   sliderContainer: kv
 }, yv = ({ onChangeValue: n, volume: t, disabled: r }) => {
-  const [s, o] = K(!1), i = ee(), l = ee(0), c = J((w) => {
-    if (w < 1e-3) return -1 / 0;
-    const R = 20 * Math.log10(w);
-    return R < -60 ? -60 : R;
-  }, []), d = J((w) => w === -1 / 0 || w <= -60 ? 0 : Math.pow(10, w / 20), []), u = _(() => {
-    const w = c(t);
-    return w === -1 / 0 ? -60 : Math.max(-60, Math.min(6, w));
-  }, [t, c]), p = _(() => t < 1e-3, [t]), A = J(() => {
+  const [s, o] = K(!1), i = ee(), l = ee(0), c = D((R) => {
+    if (R < 1e-3) return -1 / 0;
+    const w = 20 * Math.log10(R);
+    return w < -60 ? -60 : w;
+  }, []), d = D((R) => R === -1 / 0 || R <= -60 ? 0 : Math.pow(10, R / 20), []), u = _(() => {
+    const R = c(t);
+    return R === -1 / 0 ? -60 : Math.max(-60, Math.min(6, R));
+  }, [t, c]), p = _(() => t < 1e-3, [t]), A = D(() => {
     clearTimeout(i.current), o(!0);
-  }, []), g = J(() => {
+  }, []), g = D(() => {
     i.current = setTimeout(() => {
       o(!1);
     }, 300);
-  }, []), v = J(
-    (w) => {
-      (w.key === "ArrowUp" || w.key === "ArrowDown") && A(), (w.key === "ArrowLeft" || w.key === "ArrowRight") && (w.preventDefault(), w.stopPropagation(), A());
+  }, []), v = D(
+    (R) => {
+      (R.key === "ArrowUp" || R.key === "ArrowDown") && A(), (R.key === "ArrowLeft" || R.key === "ArrowRight") && (R.preventDefault(), R.stopPropagation(), A());
     },
     [A]
-  ), C = J(
-    (w) => {
-      n(w.map(d));
+  ), C = D(
+    (R) => {
+      n(R.map(d));
     },
     [n, d]
-  ), m = J(() => {
+  ), m = D(() => {
     A();
-  }, [A]), I = J(() => {
+  }, [A]), I = D(() => {
     g();
-  }, [g]), k = J(() => {
+  }, [g]), k = D(() => {
     n([1]), A();
-  }, [n, A]), E = J(() => {
-    const w = Date.now();
-    w - l.current < 300 && k(), l.current = w;
+  }, [n, A]), E = D(() => {
+    const R = Date.now();
+    R - l.current < 300 && k(), l.current = R;
   }, [k]), S = _(
     () => /* @__PURE__ */ f(fe, { children: [
       p ? "-∞ dB" : `${u.toFixed(1)} dB`,
@@ -4703,24 +4703,24 @@ const aa = Ze(function({
   hover: l = !1,
   resetPeakHold: c
 }) {
-  const [d, u] = t, p = gs(Ia(d ?? 0)), A = gs(Ia(u ?? 0)), [g, v] = K(!1), C = ee(!1), m = ee(null), I = ee(0), k = ee(null), [E, S] = K(0), [w, R] = K(!1);
+  const [d, u] = t, p = gs(Ia(d ?? 0)), A = gs(Ia(u ?? 0)), [g, v] = K(!1), C = ee(!1), m = ee(null), I = ee(0), k = ee(null), [E, S] = K(0), [R, w] = K(!1);
   ie(() => {
     I.current = 0, S(0);
   }, [c]), ie(() => () => clearTimeout(k.current), []);
-  const B = Math.max(
+  const N = Math.max(
     0,
     Math.min(100, Fv(r) * 100)
-  ), x = ms(p), N = ms(A), T = Math.max(x, N);
+  ), B = ms(p), x = ms(A), J = Math.max(B, x);
   ie(() => {
-    T > I.current && (I.current = T, S(T), R(!0), clearTimeout(k.current), k.current = setTimeout(() => {
-      R(!1), requestAnimationFrame(() => {
+    J > I.current && (I.current = J, S(J), w(!0), clearTimeout(k.current), k.current = setTimeout(() => {
+      w(!1), requestAnimationFrame(() => {
         requestAnimationFrame(() => {
           I.current = 0, S(0);
         });
       });
-    }, 400)), T <= 0 && (I.current = 0, S(0));
-  }, [T]);
-  const D = Ov(E), Q = E > 0, M = J(
+    }, 400)), J <= 0 && (I.current = 0, S(0));
+  }, [J]);
+  const T = Ov(E), Q = E > 0, M = D(
     (X) => {
       var W;
       if (!s) return;
@@ -4735,7 +4735,7 @@ const aa = Ze(function({
       }
     },
     [s]
-  ), F = J(
+  ), O = D(
     (X) => {
       var W;
       if (!C.current || !s) return;
@@ -4749,11 +4749,11 @@ const aa = Ze(function({
       }
     },
     [s]
-  ), U = J(() => {
+  ), U = D(() => {
     C.current = !1, v(!1), document.body.style.cursor = "";
-  }, []), O = s && o, z = [
+  }, []), F = s && o, z = [
     Te.bars,
-    O ? Te.interactive : "",
+    F ? Te.interactive : "",
     g ? Te.pressed : ""
   ].filter(Boolean).join(" ");
   return /* @__PURE__ */ f(
@@ -4764,13 +4764,13 @@ const aa = Ze(function({
         g || v(!1);
       },
       onPointerDown: M,
-      onPointerMove: F,
+      onPointerMove: O,
       onPointerUp: U,
       children: [
         /* @__PURE__ */ f("div", { ref: m, className: z, children: [
           /* @__PURE__ */ a(Ea, { level: p }),
           /* @__PURE__ */ a(Ea, { level: A }),
-          O && /* @__PURE__ */ a(
+          F && /* @__PURE__ */ a(
             _e,
             {
               content: Pv(r),
@@ -4783,7 +4783,7 @@ const aa = Ze(function({
                 "div",
                 {
                   className: `${Te.thumb} ${g ? Te.pressed : l ? Te.hovered : ""}`,
-                  style: { left: `${B}%` }
+                  style: { left: `${N}%` }
                 }
               )
             }
@@ -4791,10 +4791,10 @@ const aa = Ze(function({
           /* @__PURE__ */ a(
             "div",
             {
-              className: `${Te.peakDotTop} ${w ? Te.peakRising : ""}`,
+              className: `${Te.peakDotTop} ${R ? Te.peakRising : ""}`,
               style: {
                 left: `min(calc(${E}% + 3px), calc(100% - 3px))`,
-                background: D,
+                background: T,
                 opacity: Q ? 1 : 0
               }
             }
@@ -4802,10 +4802,10 @@ const aa = Ze(function({
           /* @__PURE__ */ a(
             "div",
             {
-              className: `${Te.peakDotBottom} ${w ? Te.peakRising : ""}`,
+              className: `${Te.peakDotBottom} ${R ? Te.peakRising : ""}`,
               style: {
                 left: `min(calc(${E}% + 3px), calc(100% - 3px))`,
-                background: D,
+                background: T,
                 opacity: Q ? 1 : 0
               }
             }
@@ -4988,18 +4988,18 @@ const tr = 19.5, nr = 19.5, wa = 14, Ra = 18, Xv = [
   ie(() => {
     n == null && t(o);
   }, [n, t, o]);
-  const g = J(
+  const g = D(
     (S) => {
       if (S.preventDefault(), S.stopPropagation(), r) return;
-      const w = S.wheelDelta ?? -S.deltaY * 25;
-      if (!w || Math.abs(w) <= 50) return;
-      const R = Date.now();
-      if (R - A.current < 100) return;
-      const B = w > 0 ? 1 : -1, x = Ba(n, s, B);
-      t(x), A.current = R;
+      const R = S.wheelDelta ?? -S.deltaY * 25;
+      if (!R || Math.abs(R) <= 50) return;
+      const w = Date.now();
+      if (w - A.current < 100) return;
+      const N = R > 0 ? 1 : -1, B = Ba(n, s, N);
+      t(B), A.current = w;
     },
     [t, n, s, r]
-  ), v = J(
+  ), v = D(
     (S) => {
       if (r) {
         S.preventDefault();
@@ -5008,29 +5008,29 @@ const tr = 19.5, nr = 19.5, wa = 14, Ra = 18, Xv = [
       S.preventDefault(), d(!0), p(S.clientY);
     },
     [r]
-  ), C = J(
+  ), C = D(
     (S) => {
       if (!c || r) return;
-      const w = u - S.clientY;
-      if (Math.abs(w) <= 20) return;
-      const R = w > 0 ? 1 : -1, B = Ba(n, s, R);
-      t(B), p(S.clientY), A.current = Date.now();
+      const R = u - S.clientY;
+      if (Math.abs(R) <= 20) return;
+      const w = R > 0 ? 1 : -1, N = Ba(n, s, w);
+      t(N), p(S.clientY), A.current = Date.now();
     },
     [c, u, n, t, s, r]
-  ), m = J(() => {
+  ), m = D(() => {
     d(!1);
-  }, []), I = J(() => {
+  }, []), I = D(() => {
     d(!1);
-  }, []), k = J(
+  }, []), k = D(
     (S) => {
       S.detail === 2 && !r && t(o);
     },
     [t, o, r]
-  ), E = J(
+  ), E = D(
     (S) => {
       if (!i || r) return;
-      const w = Zv(s, S);
-      w && t(w);
+      const R = Zv(s, S);
+      R && t(R);
     },
     [i, r, t, s]
   );
@@ -5059,8 +5059,8 @@ const tr = 19.5, nr = 19.5, wa = 14, Ra = 18, Xv = [
     defaultDot: d,
     clickableDots: o
   }), v = _(() => typeof t == "object" && t !== null ? t.position : _v(t, i), [t, i]), { pointerRotation: C, pointerColor: m } = _(() => $v(v, s), [v, s]), I = (k) => {
-    const E = Na[k.color] || Na.neutral, S = k.position === v, w = l === k.position && o;
-    return s ? E.default : S ? E.active : w ? E.hover : E.default;
+    const E = Na[k.color] || Na.neutral, S = k.position === v, R = l === k.position && o;
+    return s ? E.default : S ? E.active : R ? E.hover : E.default;
   };
   return /* @__PURE__ */ a(
     "div",
@@ -5108,9 +5108,9 @@ const tr = 19.5, nr = 19.5, wa = 14, Ra = 18, Xv = [
             i == null ? void 0 : i.map((k) => {
               const E = fl[k.position];
               if (!E) return null;
-              const S = I(k), w = o && !s;
+              const S = I(k), R = o && !s;
               return /* @__PURE__ */ f(Ee.Fragment, { children: [
-                w && /* @__PURE__ */ a(
+                R && /* @__PURE__ */ a(
                   "circle",
                   {
                     cx: E.x,
@@ -5122,8 +5122,8 @@ const tr = 19.5, nr = 19.5, wa = 14, Ra = 18, Xv = [
                     },
                     onMouseEnter: () => c(k.position),
                     onMouseLeave: () => c(null),
-                    onClick: (R) => {
-                      R.stopPropagation(), g(k.position);
+                    onClick: (w) => {
+                      w.stopPropagation(), g(k.position);
                     }
                   }
                 ),
@@ -5135,18 +5135,18 @@ const tr = 19.5, nr = 19.5, wa = 14, Ra = 18, Xv = [
                     r: 1,
                     fill: S,
                     style: {
-                      cursor: w ? "pointer" : "default",
+                      cursor: R ? "pointer" : "default",
                       transition: "fill 0.2s ease",
-                      pointerEvents: w ? "none" : "all"
+                      pointerEvents: R ? "none" : "all"
                     },
                     onMouseEnter: () => {
-                      w && c(k.position);
+                      R && c(k.position);
                     },
                     onMouseLeave: () => {
-                      w && c(null);
+                      R && c(null);
                     },
-                    onClick: (R) => {
-                      w && (R.stopPropagation(), g(k.position));
+                    onClick: (w) => {
+                      R && (w.stopPropagation(), g(k.position));
                     }
                   }
                 )
@@ -5392,13 +5392,13 @@ const Ok = "_listCardsItem_rjypk_1", Fk = "_listCardsItemDescriptionWrappable_rj
   style: g,
   ...v
 }) => {
-  const C = (i == null ? void 0 : i.id) || o, m = (i == null ? void 0 : i.name) || r, I = (i == null ? void 0 : i.description) || s, k = (i == null ? void 0 : i.image) || t, E = (i == null ? void 0 : i.icon) || c, S = k && (k != null && k.startsWith("url(")) ? k == null ? void 0 : k.substring(4, (k == null ? void 0 : k.length) - 1).replace(/"/g, "") : k, w = (N) => {
-    N.stopPropagation(), N.preventDefault(), p == null || p();
-  }, R = {
+  const C = (i == null ? void 0 : i.id) || o, m = (i == null ? void 0 : i.name) || r, I = (i == null ? void 0 : i.description) || s, k = (i == null ? void 0 : i.image) || t, E = (i == null ? void 0 : i.icon) || c, S = k && (k != null && k.startsWith("url(")) ? k == null ? void 0 : k.substring(4, (k == null ? void 0 : k.length) - 1).replace(/"/g, "") : k, R = (x) => {
+    x.stopPropagation(), x.preventDefault(), p == null || p();
+  }, w = {
     1: { avatar: 60, icon: 15 },
     2: { avatar: 68, icon: 15 },
     3: { avatar: 80, icon: 15 }
-  }, B = typeof A == "string" ? parseInt(A, 10) : A, x = R[B] || R[1];
+  }, N = typeof A == "string" ? parseInt(A, 10) : A, B = w[N] || w[1];
   return /* @__PURE__ */ a(
     On,
     {
@@ -5410,10 +5410,10 @@ const Ok = "_listCardsItem_rjypk_1", Fk = "_listCardsItemDescriptionWrappable_rj
       ),
       style: { "--color-surface": "transparent", ...g },
       "data-state": u ? "checked" : "unchecked",
-      onClick: w,
+      onClick: R,
       ...v,
       children: /* @__PURE__ */ f(b, { gap: "2", children: [
-        /* @__PURE__ */ a(b, { width: `${x.avatar}px`, height: `${x.avatar}px`, children: l ? /* @__PURE__ */ a(
+        /* @__PURE__ */ a(b, { width: `${B.avatar}px`, height: `${B.avatar}px`, children: l ? /* @__PURE__ */ a(
           Cl,
           {
             id: C,
@@ -5421,8 +5421,8 @@ const Ok = "_listCardsItem_rjypk_1", Fk = "_listCardsItemDescriptionWrappable_rj
               ue.listCardsAvatar,
               ue[`listCardsAvatarSize${A}`]
             ),
-            width: x.avatar,
-            height: x.avatar
+            width: B.avatar,
+            height: B.avatar
           }
         ) : d ? /* @__PURE__ */ a(
           "div",
@@ -5431,7 +5431,7 @@ const Ok = "_listCardsItem_rjypk_1", Fk = "_listCardsItemDescriptionWrappable_rj
               ue.listCardsAvatarIcon,
               ue[`listCardsAvatarIconSize${A}`]
             ),
-            children: /* @__PURE__ */ a(d, { width: x.icon, height: x.icon })
+            children: /* @__PURE__ */ a(d, { width: B.icon, height: B.icon })
           }
         ) : E ? /* @__PURE__ */ a(
           "div",
@@ -5793,7 +5793,7 @@ const f1 = "_customCard_1klw4_2", C1 = "_selected_1klw4_18", v1 = "_disabled_1kl
   gridContainer: y1,
   icon: b1
 }, I1 = ({ item: n, value: t, onSelect: r, disabled: s, isLocked: o }) => {
-  const i = J(() => {
+  const i = D(() => {
     r == null || r(n);
   }, [r, n]), l = t == null ? void 0 : t.includes(n.value), c = s || n.disabled;
   return /* @__PURE__ */ a(me, { width: "100%", children: /* @__PURE__ */ a(
@@ -5879,69 +5879,69 @@ const S1 = "_content_13eu5_1", E1 = "_pan_13eu5_13", w1 = "_disabled_13eu5_26",
   const l = ee(null), [c, d] = K(!1), u = ee(null), p = ee(0), A = ee(t), g = ee(0);
   ie(() => {
     if (c) {
-      const N = document.createElement("style");
-      N.textContent = "* { cursor: ns-resize !important; }", document.head.appendChild(N), u.current = N;
+      const x = document.createElement("style");
+      x.textContent = "* { cursor: ns-resize !important; }", document.head.appendChild(x), u.current = x;
     } else
       u.current && (document.head.removeChild(u.current), u.current = null);
     return () => {
       u.current && (document.head.removeChild(u.current), u.current = null), g.current && cancelAnimationFrame(g.current);
     };
   }, [c]);
-  const v = J(
-    (N) => {
-      A.current = xa(N), !g.current && (g.current = requestAnimationFrame(() => {
+  const v = D(
+    (x) => {
+      A.current = xa(x), !g.current && (g.current = requestAnimationFrame(() => {
         g.current = 0, r(A.current);
       }));
     },
     [r]
-  ), C = J(
-    (N) => {
-      N.preventDefault(), N.stopPropagation();
-      const T = N.wheelDelta ?? -N.deltaY * 25;
-      if (!T) return;
-      const D = t + (T > 0 ? Wr : -Wr);
-      v(D);
+  ), C = D(
+    (x) => {
+      x.preventDefault(), x.stopPropagation();
+      const J = x.wheelDelta ?? -x.deltaY * 25;
+      if (!J) return;
+      const T = t + (J > 0 ? Wr : -Wr);
+      v(T);
     },
     [t, v]
   );
   sn("wheel", C, l);
-  const m = J(
-    (N) => {
-      var D;
+  const m = D(
+    (x) => {
+      var T;
       if (s) return;
-      N.preventDefault();
-      const T = N.currentTarget;
-      (D = T.setPointerCapture) == null || D.call(T, N.pointerId), d(!0), p.current = N.clientY;
+      x.preventDefault();
+      const J = x.currentTarget;
+      (T = J.setPointerCapture) == null || T.call(J, x.pointerId), d(!0), p.current = x.clientY;
     },
     [s]
-  ), I = J(
-    (N) => {
+  ), I = D(
+    (x) => {
       if (!c) return;
-      const T = p.current - N.clientY, D = t + T * Wr;
-      v(D), p.current = N.clientY;
+      const J = p.current - x.clientY, T = t + J * Wr;
+      v(T), p.current = x.clientY;
     },
     [c, t, v]
-  ), k = J((N) => {
-    var T, D;
-    (D = (T = N.currentTarget) == null ? void 0 : T.releasePointerCapture) == null || D.call(T, N.pointerId), d(!1);
-  }, []), E = J(
-    (N) => {
-      N.detail === 2 && v(0);
+  ), k = D((x) => {
+    var J, T;
+    (T = (J = x.currentTarget) == null ? void 0 : J.releasePointerCapture) == null || T.call(J, x.pointerId), d(!1);
+  }, []), E = D(
+    (x) => {
+      x.detail === 2 && v(0);
     },
     [v]
-  ), { arcPath: S, pointerRotation: w, arcColor: R, pointerColor: B } = _(() => {
-    const N = Ta(t, o, i), T = xa(N), D = zr + T * Math.PI, Q = Cn + Ft * Math.cos(zr), M = vn + Ft * Math.sin(zr), F = Cn + Ft * Math.cos(D), U = vn + Ft * Math.sin(D), O = 0, z = T > 0 ? 1 : 0;
+  ), { arcPath: S, pointerRotation: R, arcColor: w, pointerColor: N } = _(() => {
+    const x = Ta(t, o, i), J = xa(x), T = zr + J * Math.PI, Q = Cn + Ft * Math.cos(zr), M = vn + Ft * Math.sin(zr), O = Cn + Ft * Math.cos(T), U = vn + Ft * Math.sin(T), F = 0, z = J > 0 ? 1 : 0;
     return {
       arcPath: `M ${Q.toFixed(3)} ${M.toFixed(3)}
-                A ${Ft} ${Ft} 0 ${O} ${z}
-                ${F.toFixed(3)} ${U.toFixed(3)}`,
-      pointerRotation: T * 180,
+                A ${Ft} ${Ft} 0 ${F} ${z}
+                ${O.toFixed(3)} ${U.toFixed(3)}`,
+      pointerRotation: J * 180,
       arcColor: s ? "#5A6169" : "#19E4F1",
       pointerColor: s ? "#43484E" : "#B0B4BA"
     };
-  }, [t, s, o, i]), x = _(() => {
-    const N = Ta(t, o, i), T = Math.round(N * 100);
-    return `Pan: ${Math.abs(T) < 1 ? 0 : T}`;
+  }, [t, s, o, i]), B = _(() => {
+    const x = Ta(t, o, i), J = Math.round(x * 100);
+    return `Pan: ${Math.abs(J) < 1 ? 0 : J}`;
   }, [t, o, i]);
   return /* @__PURE__ */ a(
     "div",
@@ -5954,7 +5954,7 @@ const S1 = "_content_13eu5_1", E1 = "_pan_13eu5_13", w1 = "_disabled_13eu5_26",
       children: /* @__PURE__ */ a(
         _e,
         {
-          content: x,
+          content: B,
           open: c,
           side: "bottom",
           align: "center",
@@ -5988,7 +5988,7 @@ const S1 = "_content_13eu5_1", E1 = "_pan_13eu5_13", w1 = "_disabled_13eu5_26",
                   "path",
                   {
                     d: S,
-                    stroke: R,
+                    stroke: w,
                     strokeLinecap: "round",
                     strokeWidth: 1,
                     fill: "none"
@@ -5997,12 +5997,12 @@ const S1 = "_content_13eu5_1", E1 = "_pan_13eu5_13", w1 = "_disabled_13eu5_26",
                 /* @__PURE__ */ a(
                   "g",
                   {
-                    transform: `rotate(${w} ${Cn} ${vn})`,
+                    transform: `rotate(${R} ${Cn} ${vn})`,
                     children: /* @__PURE__ */ a(
                       "path",
                       {
                         d: "M10 0.5 L10 6",
-                        stroke: B,
+                        stroke: N,
                         strokeLinecap: "round",
                         strokeWidth: 1
                       }
@@ -6277,15 +6277,15 @@ const py = ({
     onProjectClick: g,
     openedItem: v,
     setOpenedItem: C
-  } = dt(Dr), [m, I] = K(!1), k = _(() => m ? i : i.slice(0, 6), [i, m]), E = J(() => {
+  } = dt(Dr), [m, I] = K(!1), k = _(() => m ? i : i.slice(0, 6), [i, m]), E = D(() => {
     if (c) return;
     I(!1);
-    const R = p.find((B) => B.id === n);
-    v === n ? (C(null), g == null || g(R, !1)) : (C(n), g == null || g(R, !0));
-  }, [n, v, C, g, p, c]), S = J((R) => {
-    R.preventDefault(), R.stopPropagation(), I(!m);
-  }, [m]), w = J((R) => {
-    R.stopPropagation(), A == null || A(i);
+    const w = p.find((N) => N.id === n);
+    v === n ? (C(null), g == null || g(w, !1)) : (C(n), g == null || g(w, !0));
+  }, [n, v, C, g, p, c]), S = D((w) => {
+    w.preventDefault(), w.stopPropagation(), I(!m);
+  }, [m]), R = D((w) => {
+    w.stopPropagation(), A == null || A(i);
   }, [A, i]);
   return /* @__PURE__ */ f(
     b,
@@ -6335,7 +6335,7 @@ const py = ({
                   variant: "ghost",
                   color: "gray",
                   style: { flex: "1" },
-                  onClick: w,
+                  onClick: R,
                   children: [
                     /* @__PURE__ */ a(Ar, { width: 16, height: 16 }),
                     " Insert all"
@@ -6411,7 +6411,7 @@ const py = ({
 }, By = ({
   ...n
 }) => {
-  const { onClickTrack: t } = dt(Dr), { id: r, title: s } = n, o = J((i) => {
+  const { onClickTrack: t } = dt(Dr), { id: r, title: s } = n, o = D((i) => {
     i.stopPropagation(), t == null || t(n);
   }, [t, n]);
   return /* @__PURE__ */ a(b, { direction: "column", gap: "1", children: /* @__PURE__ */ f(
@@ -6447,9 +6447,9 @@ const py = ({
   max: s = 10,
   onChange: o
 }) => {
-  const i = J((c) => {
+  const i = D((c) => {
     c.stopPropagation(), !(s != null && t >= s) && o(t + 1);
-  }, [s, o, t]), l = J((c) => {
+  }, [s, o, t]), l = D((c) => {
     c.stopPropagation(), !(r != null && t <= r) && o(t - 1);
   }, [r, o, t]);
   return /* @__PURE__ */ f(b, { direction: "row", gap: "1", align: "center", justify: "center", children: [
@@ -6507,16 +6507,16 @@ const py = ({
   ...n
 }) => {
   var k;
-  const { onClickTrack: t } = dt(Dr), { projectId: r, id: s, title: o, cover: i, transfers: l, audioUrl: c, onChangeTransfer: d } = n, u = _(() => l && l.length > 0, [l]), [p, A] = K(u ? parseInt(((k = l == null ? void 0 : l[0]) == null ? void 0 : k.pitchShift) ?? 0) : 0), g = _(() => u ? Math.min(...l == null ? void 0 : l.map((E) => parseInt(E.pitchShift))) : 0, [l]), v = _(() => u ? Math.max(...l == null ? void 0 : l.map((E) => parseInt(E.pitchShift))) : 0, [l]), C = J((E) => {
+  const { onClickTrack: t } = dt(Dr), { projectId: r, id: s, title: o, cover: i, transfers: l, audioUrl: c, onChangeTransfer: d } = n, u = _(() => l && l.length > 0, [l]), [p, A] = K(u ? parseInt(((k = l == null ? void 0 : l[0]) == null ? void 0 : k.pitchShift) ?? 0) : 0), g = _(() => u ? Math.min(...l == null ? void 0 : l.map((E) => parseInt(E.pitchShift))) : 0, [l]), v = _(() => u ? Math.max(...l == null ? void 0 : l.map((E) => parseInt(E.pitchShift))) : 0, [l]), C = D((E) => {
     var S;
-    return u ? (S = l == null ? void 0 : l.find((w) => parseInt(w.pitchShift) === E)) == null ? void 0 : S.audioUrl : c;
-  }, [u, l, c]), m = J((E) => {
+    return u ? (S = l == null ? void 0 : l.find((R) => parseInt(R.pitchShift) === E)) == null ? void 0 : S.audioUrl : c;
+  }, [u, l, c]), m = D((E) => {
     A(E), d == null || d(r, {
       id: s,
       title: o,
       audioUrl: C(E)
     });
-  }, [d, r, s, o, l]), I = J((E) => {
+  }, [d, r, s, o, l]), I = D((E) => {
     E.stopPropagation(), t == null || t({
       id: s,
       title: o,
@@ -6638,42 +6638,42 @@ const Hy = "_starButton_1a7x2_1", Ky = "_disabled_1a7x2_17", Ly = "_readOnly_1a7
   maxLabel: p,
   ...A
 }) => {
-  const [g, v] = K(r || 0), [C, m] = K(0), I = t !== void 0 ? t : g, k = t !== void 0, E = J(
-    (B) => {
+  const [g, v] = K(r || 0), [C, m] = K(0), I = t !== void 0 ? t : g, k = t !== void 0, E = D(
+    (N) => {
       if (s || o) return;
-      const x = B + 1, N = x === I ? 0 : x;
-      k || v(N), i == null || i({ value: N });
+      const B = N + 1, x = B === I ? 0 : B;
+      k || v(x), i == null || i({ value: x });
     },
     [s, o, k, i, I]
-  ), S = J(
-    (B) => {
+  ), S = D(
+    (N) => {
       if (s || o) return;
-      const x = B.currentTarget.getBoundingClientRect(), N = B.clientX - x.left, T = x.width / n, D = Math.floor(N / T), M = Math.max(0, Math.min(D, n - 1)) + 1;
+      const B = N.currentTarget.getBoundingClientRect(), x = N.clientX - B.left, J = B.width / n, T = Math.floor(x / J), M = Math.max(0, Math.min(T, n - 1)) + 1;
       M !== C && (m(M), l == null || l({ value: M }));
     },
     [s, o, n, C, l]
-  ), w = J(() => {
+  ), R = D(() => {
     s || o || (m(0), l == null || l({ value: 0 }));
-  }, [s, o, l]), R = (B) => {
-    const x = C > 0 ? B < C : B < I, N = C > 0 && B < C, T = B < I;
+  }, [s, o, l]), w = (N) => {
+    const B = C > 0 ? N < C : N < I, x = C > 0 && N < C, J = N < I;
     return /* @__PURE__ */ a(
       "button",
       {
         type: "button",
         className: y(je.starButton, {
-          [je.filled]: x,
-          [je.hovered]: N,
-          [je.active]: T,
+          [je.filled]: B,
+          [je.hovered]: x,
+          [je.active]: J,
           [je.disabled]: s,
           [je.readOnly]: o
         }),
-        onClick: () => E(B),
+        onClick: () => E(N),
         disabled: s || o,
-        "aria-label": `Rate ${B + 1} out of ${n}`,
+        "aria-label": `Rate ${N + 1} out of ${n}`,
         ...A,
-        children: x ? /* @__PURE__ */ a(md, { className: je.starIcon }) : /* @__PURE__ */ a(fd, { className: je.starIcon })
+        children: B ? /* @__PURE__ */ a(md, { className: je.starIcon }) : /* @__PURE__ */ a(fd, { className: je.starIcon })
       },
-      B
+      N
     );
   };
   return /* @__PURE__ */ f(
@@ -6698,8 +6698,8 @@ const Hy = "_starButton_1a7x2_1", Ky = "_disabled_1a7x2_17", Ly = "_readOnly_1a7
               role: "radiogroup",
               "aria-label": `Rating: ${I} out of ${n} stars`,
               onMouseMove: S,
-              onMouseLeave: w,
-              children: Array.from({ length: n }, (B, x) => R(x))
+              onMouseLeave: R,
+              children: Array.from({ length: n }, (N, B) => w(B))
             }
           ),
           (u || p) && /* @__PURE__ */ f(
@@ -6900,21 +6900,22 @@ const Cb = "_boxVertical_ujop8_21", vb = "_sliderRoot_ujop8_27", kb = "_sliderRo
   highContrast: g = !1,
   markers: v = [],
   orientation: C = "horizontal",
-  verticalHeight: m = 200,
-  scrollWheel: I = !1,
-  ...k
+  horizontalWidth: m = "100%",
+  verticalHeight: I = 200,
+  scrollWheel: k = !1,
+  ...E
 }) => {
-  const { onWheel: E, ...S } = k, w = C === "vertical", R = (N) => (N - c) / (d - c) * 100, B = J(
-    (N) => {
-      if (E == null || E(N), A || !r || N.defaultPrevented) return;
-      const T = w ? N.deltaY : Math.abs(N.deltaX) > Math.abs(N.deltaY) ? N.deltaX : N.deltaY;
-      if (T === 0) return;
-      N.preventDefault();
-      const D = (o == null ? void 0 : o[0]) ?? c, Q = T < 0 ? 1 : -1, M = Math.min(
+  const { onWheel: S, ...R } = E, w = C === "vertical", N = (T) => (T - c) / (d - c) * 100, B = D(
+    (T) => {
+      if (S == null || S(T), A || !r || T.defaultPrevented) return;
+      const Q = w ? T.deltaY : Math.abs(T.deltaX) > Math.abs(T.deltaY) ? T.deltaX : T.deltaY;
+      if (Q === 0) return;
+      T.preventDefault();
+      const M = (o == null ? void 0 : o[0]) ?? c, O = Q < 0 ? 1 : -1, U = Math.min(
         d,
-        Math.max(c, D + Q * u)
+        Math.max(c, M + O * u)
       );
-      M !== D && r([M]);
+      U !== M && r([U]);
     },
     [
       A,
@@ -6922,15 +6923,15 @@ const Cb = "_boxVertical_ujop8_21", vb = "_sliderRoot_ujop8_27", kb = "_sliderRo
       w,
       d,
       c,
-      E,
+      S,
       u,
       o
     ]
-  ), x = typeof m == "number" ? `${m}px` : m;
+  ), x = typeof I == "number" ? `${I}px` : I, J = typeof m == "number" ? `${m}px` : m;
   return /* @__PURE__ */ f(
     me,
     {
-      width: "100%",
+      width: w ? "100%" : J,
       className: y(w && de.boxVertical),
       style: w ? { "--slider-vertical-height": x } : void 0,
       children: [
@@ -6981,8 +6982,8 @@ const Cb = "_boxVertical_ujop8_21", vb = "_sliderRoot_ujop8_27", kb = "_sliderRo
             className: y(de.sliderRoot, n, {
               [de.sliderRootVertical]: w
             }),
-            onWheel: I ? B : E,
-            ...S,
+            onWheel: k ? B : S,
+            ...R,
             children: /* @__PURE__ */ f(
               b,
               {
@@ -7027,7 +7028,7 @@ const Cb = "_boxVertical_ujop8_21", vb = "_sliderRoot_ujop8_27", kb = "_sliderRo
                       ]
                     }
                   ),
-                  v.length > 0 && /* @__PURE__ */ a("div", { className: de.markersContainer, children: v.map((N, T) => /* @__PURE__ */ a(
+                  v.length > 0 && /* @__PURE__ */ a("div", { className: de.markersContainer, children: v.map((T, Q) => /* @__PURE__ */ a(
                     "div",
                     {
                       className: y(de.marker, {
@@ -7035,12 +7036,12 @@ const Cb = "_boxVertical_ujop8_21", vb = "_sliderRoot_ujop8_27", kb = "_sliderRo
                         [de.markerVertical]: w
                       }),
                       style: w ? {
-                        bottom: `${R(N)}%`
+                        bottom: `${N(T)}%`
                       } : {
-                        left: `${R(N)}%`
+                        left: `${N(T)}%`
                       }
                     },
-                    T
+                    Q
                   )) })
                 ]
               }
@@ -7415,25 +7416,25 @@ const bl = ({
   dndDroppableId: k,
   onDragEnter: E,
   onDragLeave: S,
-  onDragOver: w,
-  onDrop: R
+  onDragOver: R,
+  onDrop: w
 }) => {
-  const [B, x] = K(!1), N = !!k, { setNodeRef: T, isOver: D } = ho({
+  const [N, B] = K(!1), x = !!k, { setNodeRef: J, isOver: T } = ho({
     id: k ?? "__setlist-item-noop__",
-    disabled: !N
+    disabled: !x
   }), Q = () => {
-    x(!0);
+    B(!0);
   }, M = () => {
-    x(!1);
-  }, F = (O) => {
-    O.stopPropagation();
-  }, U = (O) => {
-    O.stopPropagation();
+    B(!1);
+  }, O = (F) => {
+    F.stopPropagation();
+  }, U = (F) => {
+    F.stopPropagation();
   };
   return /* @__PURE__ */ f(
     b,
     {
-      ref: N ? T : void 0,
+      ref: x ? J : void 0,
       gap: "3",
       align: "center",
       role: r ? "button" : void 0,
@@ -7443,17 +7444,17 @@ const bl = ({
         [Z.navItemSelected]: n,
         [Z.collapsed]: v,
         [Z.menuOpen]: u,
-        [Z.dropTarget]: m && I || D
+        [Z.dropTarget]: m && I || T
       }),
       onMouseEnter: Q,
       onMouseLeave: M,
       "data-setlist-id": t,
       onDragEnter: m ? E : void 0,
       onDragLeave: m ? S : void 0,
-      onDragOver: m ? w : void 0,
-      onDrop: m ? R : void 0,
-      onKeyDown: r ? (O) => {
-        (O.key === "Enter" || O.key === " ") && (O.preventDefault(), r == null || r());
+      onDragOver: m ? R : void 0,
+      onDrop: m ? w : void 0,
+      onKeyDown: r ? (F) => {
+        (F.key === "Enter" || F.key === " ") && (F.preventDefault(), r == null || r());
       } : void 0,
       style: o,
       children: [
@@ -7509,7 +7510,7 @@ const bl = ({
             ]
           }
         ),
-        d && !v && (B || u) && /* @__PURE__ */ a(
+        d && !v && (N || u) && /* @__PURE__ */ a(
           on,
           {
             open: u,
@@ -7522,7 +7523,7 @@ const bl = ({
                 className: y(Z.dropdownTriggerWrapper, {
                   [Z.dropdownTriggerWrapperMobile]: C
                 }),
-                onPointerDown: F,
+                onPointerDown: O,
                 onClick: U,
                 children: /* @__PURE__ */ a(Nr, { hovered: u })
               }
@@ -7552,42 +7553,42 @@ const bl = ({
 }) => {
   const { close: m, isMobile: I } = wr(), [k, E] = K(null), S = (q) => {
     r == null || r(q), I && m();
-  }, w = () => {
+  }, R = () => {
     c == null || c(), I && m();
-  }, [R, B] = K(!1), [x, N] = K(!1), [T, D] = K(!1), [Q, M] = K(!1), F = ee(null), U = ee(null), O = ee(null), z = ee(p), X = 50, $ = 200, W = 44, re = 4, Ne = p && c ? 1 : 0, ke = p && !R && !Q, Le = n, be = n.length + (c ? 1 : 0), se = Math.min(4, be), L = $ + Math.max(0, se - 1) * X, j = L, le = () => {
-    F.current && (clearTimeout(F.current), F.current = null), U.current && (clearTimeout(U.current), U.current = null), N(!1), D(!0), B(!0), U.current = setTimeout(() => {
-      D(!1), U.current = null;
+  }, [w, N] = K(!1), [B, x] = K(!1), [J, T] = K(!1), [Q, M] = K(!1), O = ee(null), U = ee(null), F = ee(null), z = ee(p), X = 50, $ = 200, W = 44, re = 4, Ne = p && c ? 1 : 0, ke = p && !w && !Q, Le = n, be = n.length + (c ? 1 : 0), se = Math.min(4, be), L = $ + Math.max(0, se - 1) * X, j = L, le = () => {
+    O.current && (clearTimeout(O.current), O.current = null), U.current && (clearTimeout(U.current), U.current = null), x(!1), T(!0), N(!0), U.current = setTimeout(() => {
+      T(!1), U.current = null;
     }, j);
   }, Ie = () => {
-    p && (F.current && (clearTimeout(F.current), F.current = null), x ? N(!1) : R || le());
+    p && (O.current && (clearTimeout(O.current), O.current = null), B ? x(!1) : w || le());
   }, ce = () => {
-    p && R && (U.current && (clearTimeout(U.current), U.current = null), D(!1), N(!0), F.current = setTimeout(() => {
-      F.current = null, B(!1), N(!1);
+    p && w && (U.current && (clearTimeout(U.current), U.current = null), T(!1), x(!0), O.current = setTimeout(() => {
+      O.current = null, N(!1), x(!1);
     }, j));
   }, ae = (q) => {
     p && (q.stopPropagation(), le());
   }, oe = () => {
-    p && !R && le();
+    p && !w && le();
   }, qe = () => {
     if (!p) return;
-    const q = O.current;
+    const q = F.current;
     q && setTimeout(() => {
-      q.contains(document.activeElement) || B(!1);
+      q.contains(document.activeElement) || N(!1);
     }, 0);
   };
   if (z.current !== p) {
     const q = z.current;
-    z.current = p, p && !q ? (M(!0), D(!1), N(!0)) : !p && q && (B(!1), M(!0), N(!1), D(!0));
+    z.current = p, p && !q ? (M(!0), T(!1), x(!0)) : !p && q && (N(!1), M(!0), x(!1), T(!0));
   }
   ie(() => {
     if (!Q) return;
-    F.current && (clearTimeout(F.current), F.current = null), U.current && (clearTimeout(U.current), U.current = null);
+    O.current && (clearTimeout(O.current), O.current = null), U.current && (clearTimeout(U.current), U.current = null);
     const q = setTimeout(() => {
-      M(!1), N(!1), D(!1);
+      M(!1), x(!1), T(!1);
     }, j);
     return () => clearTimeout(q);
   }, [Q, j]), ie(() => () => {
-    F.current && clearTimeout(F.current), U.current && clearTimeout(U.current);
+    O.current && clearTimeout(O.current), U.current && clearTimeout(U.current);
   }, []);
   const Ye = (q) => {
     if (!p) return;
@@ -7613,7 +7614,7 @@ const bl = ({
   }, Qe = p && !ke || Q, ut = p || Q, at = (q) => {
     if (!Qe) return;
     const Pe = q < se;
-    if (x) {
+    if (B) {
       if (Pe) {
         const $e = -(q * (W - re)), he = q === 0 ? 1 : (W - q * 2) / W;
         return {
@@ -7628,7 +7629,7 @@ const bl = ({
         zIndex: be - q
       };
     }
-    if (T) {
+    if (J) {
       if (Pe) {
         const $e = -(q * (W - re)), he = q === 0 ? 1 : (W - q * 2) / W;
         return {
@@ -7656,7 +7657,7 @@ const bl = ({
       children: /* @__PURE__ */ a(
         "div",
         {
-          ref: O,
+          ref: F,
           className: y(Z.hoverRegion, Z.scrollShadow),
           onMouseEnter: Ie,
           onMouseLeave: ce,
@@ -7687,11 +7688,11 @@ const bl = ({
                 ) : /* @__PURE__ */ a(
                   QI,
                   {
-                    onClick: w,
+                    onClick: R,
                     className: y({
                       [Z.staggerItem]: Qe,
-                      [Z.staggerAnimateIn]: Qe && T,
-                      [Z.staggerAnimateOut]: Qe && x
+                      [Z.staggerAnimateIn]: Qe && J,
+                      [Z.staggerAnimateOut]: Qe && B
                     }),
                     style: at(0),
                     collapsed: ut,
@@ -7736,11 +7737,11 @@ const bl = ({
                         [Z.collapsedStackItem]: ke,
                         [Z.collapsedTransition]: p && ke,
                         [Z.staggerItem]: Qe,
-                        [Z.staggerAnimateIn]: Qe && T && Ce,
-                        [Z.staggerAnimateOut]: Qe && x && Ce,
-                        [Z.fadeAnimateIn]: Qe && T && !Ce,
-                        [Z.fadeAnimateOut]: Qe && x && !Ce,
-                        [Z.fadeHidden]: !Ce && p && !R && !Q
+                        [Z.staggerAnimateIn]: Qe && J && Ce,
+                        [Z.staggerAnimateOut]: Qe && B && Ce,
+                        [Z.fadeAnimateIn]: Qe && J && !Ce,
+                        [Z.fadeAnimateOut]: Qe && B && !Ce,
+                        [Z.fadeHidden]: !Ce && p && !w && !Q
                       }),
                       style: {
                         ...Ye(Pe),
@@ -7786,7 +7787,7 @@ const bl = ({
   logoButton: l0,
   headerCollapsed: c0
 }, Il = (n) => {
-  const t = kl(n), [r, s] = K(!1), o = J(() => s(!0), []), i = J(() => s(!1), []), l = J(() => s((c) => !c), []);
+  const t = kl(n), [r, s] = K(!1), o = D(() => s(!0), []), i = D(() => s(!1), []), l = D(() => s((c) => !c), []);
   return ie(() => {
     t || s(!1);
   }, [t]), ie(() => {
@@ -7813,42 +7814,42 @@ const bl = ({
   tooltip: c = "Expand menu",
   ...d
 }) => {
-  const { isMobile: u, isOpen: p, open: A, close: g } = Il(), [v, C] = K(!1), [m, I] = K(!1), k = s ?? m, E = J(
+  const { isMobile: u, isOpen: p, open: A, close: g } = Il(), [v, C] = K(!1), [m, I] = K(!1), k = s ?? m, E = D(
     (z) => {
       s == null && I(z), o == null || o(z);
     },
     [s, o]
-  ), S = u ? !1 : r && !k, w = () => {
+  ), S = u ? !1 : r && !k, R = () => {
     u || (C(!1), E(!1), i((z) => !z));
-  }, R = () => {
+  }, w = () => {
     u || C(!0);
-  }, B = () => {
-    u || C(!1);
-  }, x = (z) => {
-    S ? w() : l && l(z);
   }, N = () => {
+    u || C(!1);
+  }, B = (z) => {
+    S ? R() : l && l(z);
+  }, x = () => {
     u || !r || E(!0);
-  }, T = () => {
+  }, J = () => {
     E(!1);
-  }, D = (z) => {
-    R(), z.buttons > 0 && N();
+  }, T = (z) => {
+    w(), z.buttons > 0 && x();
   }, Q = () => {
-    N();
+    x();
   }, M = (z) => {
-    u || !r || (z.preventDefault(), N());
-  }, F = S ? "Expand menu" : "Moises", U = "Moises";
+    u || !r || (z.preventDefault(), x());
+  }, O = S ? "Expand menu" : "Moises", U = "Moises";
   ie(() => {
     if (!k) return;
     const z = () => {
-      T();
+      J();
     }, X = () => {
-      T();
+      J();
     };
     return window.addEventListener("pointerup", z), window.addEventListener("dragend", X), window.addEventListener("drop", X), () => {
       window.removeEventListener("pointerup", z), window.removeEventListener("dragend", X), window.removeEventListener("drop", X);
     };
   }, [k]);
-  const O = /* @__PURE__ */ f(fe, { children: [
+  const F = /* @__PURE__ */ f(fe, { children: [
     /* @__PURE__ */ f(
       "div",
       {
@@ -7911,7 +7912,7 @@ const bl = ({
                 {
                   type: "button",
                   className: te.logoButton,
-                  onClick: x,
+                  onClick: B,
                   "aria-label": U,
                   children: /* @__PURE__ */ f(
                     b,
@@ -7967,11 +7968,11 @@ const bl = ({
           {
             direction: "column",
             className: te.desktopSidebar,
-            onMouseEnter: D,
-            onMouseLeave: B,
+            onMouseEnter: T,
+            onMouseLeave: N,
             onDragEnter: Q,
             onDragOver: M,
-            onDrop: T,
+            onDrop: J,
             children: [
               S ? /* @__PURE__ */ a("div", { className: te.headerWrapper, children: /* @__PURE__ */ a(_e, { content: c, side: "right", sideOffset: 5, align: "center", alignOffset: 0, children: /* @__PURE__ */ a("div", { className: te.tooltipTriggerWrapper, children: /* @__PURE__ */ f(
                 b,
@@ -7987,8 +7988,8 @@ const bl = ({
                       {
                         type: "button",
                         className: te.logoButton,
-                        onClick: x,
-                        "aria-label": F,
+                        onClick: B,
+                        "aria-label": O,
                         children: /* @__PURE__ */ a(
                           b,
                           {
@@ -7997,7 +7998,7 @@ const bl = ({
                             style: {
                               cursor: S || l ? "pointer" : "default"
                             },
-                            children: O
+                            children: F
                           }
                         )
                       }
@@ -8006,7 +8007,7 @@ const bl = ({
                       "button",
                       {
                         type: "button",
-                        onClick: w,
+                        onClick: R,
                         className: y(te.toggleButton, {
                           [te.toggleButtonHidden]: S
                         }),
@@ -8030,8 +8031,8 @@ const bl = ({
                       {
                         type: "button",
                         className: te.logoButton,
-                        onClick: x,
-                        "aria-label": F,
+                        onClick: B,
+                        "aria-label": O,
                         children: /* @__PURE__ */ a(
                           b,
                           {
@@ -8040,7 +8041,7 @@ const bl = ({
                             style: {
                               cursor: S || l ? "pointer" : "default"
                             },
-                            children: O
+                            children: F
                           }
                         )
                       }
@@ -8049,7 +8050,7 @@ const bl = ({
                       "button",
                       {
                         type: "button",
-                        onClick: w,
+                        onClick: R,
                         className: y(te.toggleButton, {
                           [te.toggleButtonHidden]: S
                         }),
@@ -8097,7 +8098,7 @@ const d0 = "_sectionTitle_bwlze_1", u0 = "_separator_bwlze_17", Ja = {
   sidebarTooltip: C,
   children: m
 }) => {
-  const [I, k] = K(!1), [E, S] = K(!1), { isMobile: w } = Il(), R = w ? !1 : I && !E;
+  const [I, k] = K(!1), [E, S] = K(!1), { isMobile: R } = Il(), w = R ? !1 : I && !E;
   return /* @__PURE__ */ f(fe, { children: [
     /* @__PURE__ */ f(
       Sl,
@@ -8109,14 +8110,14 @@ const d0 = "_sectionTitle_bwlze_1", u0 = "_separator_bwlze_17", Ja = {
         tooltip: C,
         children: [
           /* @__PURE__ */ f(b, { direction: "column", children: [
-            /* @__PURE__ */ a(Da, { title: "PRODUCTS", collapsed: R }),
+            /* @__PURE__ */ a(Da, { title: "PRODUCTS", collapsed: w }),
             /* @__PURE__ */ a(
               ny,
               {
                 products: o,
                 selectedProductId: i,
                 onProductClick: l,
-                collapsed: R
+                collapsed: w
               }
             )
           ] }),
@@ -8126,7 +8127,7 @@ const d0 = "_sectionTitle_bwlze_1", u0 = "_separator_bwlze_17", Ja = {
               direction: "column",
               style: { overflow: "hidden", flex: 1, minHeight: 0 },
               children: [
-                /* @__PURE__ */ a(Da, { title: "SETLISTS", collapsed: R }),
+                /* @__PURE__ */ a(Da, { title: "SETLISTS", collapsed: w }),
                 /* @__PURE__ */ a(
                   UI,
                   {
@@ -8136,8 +8137,8 @@ const d0 = "_sectionTitle_bwlze_1", u0 = "_separator_bwlze_17", Ja = {
                     onNewSetlistClick: p,
                     newSetlistButtonTooltip: A,
                     expandButtonTooltip: g,
-                    collapsed: R,
-                    isMobile: w
+                    collapsed: w,
+                    isMobile: R
                   }
                 )
               ]
@@ -8153,7 +8154,7 @@ const d0 = "_sectionTitle_bwlze_1", u0 = "_separator_bwlze_17", Ja = {
                 /* @__PURE__ */ a(
                   og,
                   {
-                    collapsed: R,
+                    collapsed: w,
                     additionalItems: n,
                     selectedAdditionalItemId: t
                   }
@@ -8163,7 +8164,7 @@ const d0 = "_sectionTitle_bwlze_1", u0 = "_separator_bwlze_17", Ja = {
                   {
                     user: r,
                     menuOptions: r == null ? void 0 : r.menuOptions,
-                    collapsed: R,
+                    collapsed: w,
                     tooltip: v
                   }
                 )
@@ -8304,16 +8305,16 @@ const Zn = (n) => {
   onFetchSuggestedTags: p,
   suggestedTagsLoading: A
 }) => {
-  const g = ee(null), v = ee(null), [C, m] = K(!1), I = J((R) => {
-    const B = R.target, x = B.scrollLeft + B.clientWidth >= B.scrollWidth - 2;
-    m(x);
-  }, []), k = !!l || !!d, E = J(
-    (R) => {
+  const g = ee(null), v = ee(null), [C, m] = K(!1), I = D((w) => {
+    const N = w.target, B = N.scrollLeft + N.clientWidth >= N.scrollWidth - 2;
+    m(B);
+  }, []), k = !!l || !!d, E = D(
+    (w) => {
       if (k) return;
-      const B = R.target.value;
-      t((x) => ({
-        ...x,
-        conditioningText: B
+      const N = w.target.value;
+      t((B) => ({
+        ...B,
+        conditioningText: N
       }));
     },
     [t, k]
@@ -8328,17 +8329,17 @@ const Zn = (n) => {
   }, [n.conditioningText, p]), ie(() => {
     m(!1);
   }, [u]);
-  const S = J(
-    (R) => {
-      t((B) => ({
-        ...B,
-        conditioningText: (B.conditioningText || "").trimEnd() + " " + R + " "
+  const S = D(
+    (w) => {
+      t((N) => ({
+        ...N,
+        conditioningText: (N.conditioningText || "").trimEnd() + " " + w + " "
       }));
     },
     [t]
-  ), w = J(() => {
-    t((R) => ({
-      ...R,
+  ), R = D(() => {
+    t((w) => ({
+      ...w,
       conditioningAudio: null,
       conditioningAudioName: null,
       conditioningAudioSize: null,
@@ -8433,13 +8434,13 @@ const Zn = (n) => {
                           children: /* @__PURE__ */ a(bd, { width: 14, height: 14 })
                         }
                       ),
-                      A && /* @__PURE__ */ a("div", { className: et.tagsWrapper, children: /* @__PURE__ */ a("div", { className: et.tagsContainer, children: D0.map((R, B) => /* @__PURE__ */ a(
+                      A && /* @__PURE__ */ a("div", { className: et.tagsWrapper, children: /* @__PURE__ */ a("div", { className: et.tagsContainer, children: D0.map((w, N) => /* @__PURE__ */ a(
                         "div",
                         {
                           className: et.skeletonChip,
-                          style: { width: R }
+                          style: { width: w }
                         },
-                        B
+                        N
                       )) }) }),
                       !A && (u == null ? void 0 : u.length) > 0 && /* @__PURE__ */ a(
                         "div",
@@ -8452,13 +8453,13 @@ const Zn = (n) => {
                               ref: v,
                               className: et.tagsContainer,
                               onScroll: I,
-                              children: u.map((R) => /* @__PURE__ */ a(
+                              children: u.map((w) => /* @__PURE__ */ a(
                                 Ue,
                                 {
                                   className: et.tagChip,
                                   variant: "ghost",
                                   size: "2",
-                                  onClick: () => S(R),
+                                  onClick: () => S(w),
                                   style: {
                                     borderRadius: "9999px",
                                     color: "rgba(241, 247, 254, 0.71)",
@@ -8466,9 +8467,9 @@ const Zn = (n) => {
                                     paddingLeft: 14,
                                     paddingRight: 14
                                   },
-                                  children: R
+                                  children: w
                                 },
-                                R
+                                w
                               ))
                             }
                           )
@@ -8503,7 +8504,7 @@ const Zn = (n) => {
                 y0(n),
                 ")"
               ] }),
-              /* @__PURE__ */ a(ye, { variant: "soft", onClick: w, children: /* @__PURE__ */ a(Sd, { width: 16, height: 16 }) })
+              /* @__PURE__ */ a(ye, { variant: "soft", onClick: R, children: /* @__PURE__ */ a(Sd, { width: 16, height: 16 }) })
             ]
           }
         ) : /* @__PURE__ */ f(
@@ -8583,7 +8584,7 @@ function O0({
   showAdvancedControlsPaywall: o
 }) {
   var c, d, u, p, A, g;
-  const i = n.customizeCreativeFreedom || !1, l = J(
+  const i = n.customizeCreativeFreedom || !1, l = D(
     async (v) => {
       var C, m, I;
       await o() || s({
@@ -8732,7 +8733,7 @@ function P0({
       ...n,
       useProjectChords: d
     });
-  }, c = J(
+  }, c = D(
     async (d) => {
       await i() || t({
         ...n,
@@ -8918,7 +8919,7 @@ const rr = {
     animationDuration: 200
   }
 }, oa = (n) => {
-  const [t, r] = K(!1), s = J(
+  const [t, r] = K(!1), s = D(
     async (...o) => {
       r(!0), await n(...o);
     },
@@ -8938,7 +8939,7 @@ const rr = {
   onAddConditioningAudio: s,
   showConditioningTextPaywall: o,
   showAdvancedControlsPaywall: i,
-  i18n: l = { _: (D) => D },
+  i18n: l = { _: (T) => T },
   loading: c,
   onSubmit: d,
   limitReached: u,
@@ -8952,14 +8953,14 @@ const rr = {
   onMountConcurrency: k,
   onClear: E,
   onInspireMe: S,
-  inspireMeLoading: w,
-  onBoost: R,
-  boostLoading: B,
-  suggestedTags: x,
-  onFetchSuggestedTags: N,
-  suggestedTagsLoading: T
+  inspireMeLoading: R,
+  onBoost: w,
+  boostLoading: N,
+  suggestedTags: B,
+  onFetchSuggestedTags: x,
+  suggestedTagsLoading: J
 }) => {
-  const [D, Q] = K(!1), [M, F] = K("2"), [U, O] = K(M), { submitted: z, handleSubmit: X } = oa(d), $ = _(() => [
+  const [T, Q] = K(!1), [M, O] = K("2"), [U, F] = K(M), { submitted: z, handleSubmit: X } = oa(d), $ = _(() => [
     { value: "2", label: l._("Presets") },
     { value: "1", label: l._("Custom") }
   ], []), W = (r ?? []).some(
@@ -8978,9 +8979,9 @@ const rr = {
   ]), Ne = _(
     () => I0(l),
     [l]
-  ), ke = J(
+  ), ke = D(
     (se) => {
-      F(se), t({
+      O(se), t({
         ...S0,
         instrument: n.instrument,
         contextAudio: null,
@@ -8989,7 +8990,7 @@ const rr = {
       });
     },
     [t, n.instrument]
-  ), Le = J(
+  ), Le = D(
     (se) => {
       t({
         ...n,
@@ -9006,7 +9007,7 @@ const rr = {
       v,
       m
     ]
-  ), be = J(
+  ), be = D(
     (se) => {
       const L = nt[se] || {};
       t((j) => ({
@@ -9026,7 +9027,7 @@ const rr = {
     if (M !== U) {
       Q(!0);
       const se = setTimeout(() => {
-        O(M), Q(!1);
+        F(M), Q(!1);
       }, rr.timeouts.animationDuration);
       return () => clearTimeout(se);
     }
@@ -9077,7 +9078,7 @@ const rr = {
                     top: "130px",
                     zIndex: 10,
                     backgroundColor: "var(--neutral-2)",
-                    opacity: D ? 0 : 1,
+                    opacity: T ? 0 : 1,
                     transition: `opacity ${rr.timeouts.animationDuration}ms ease-in-out`
                   }
                 }
@@ -9092,7 +9093,7 @@ const rr = {
             style: {
               position: "relative",
               flex: 1,
-              opacity: D ? 0 : 1,
+              opacity: T ? 0 : 1,
               transition: `opacity ${rr.timeouts.animationDuration}ms ease-in-out`,
               overflow: "hidden"
             },
@@ -9106,12 +9107,12 @@ const rr = {
                   onAddConditioningAudio: s,
                   onTextConditioningFocus: o,
                   onInspireMe: S,
-                  inspireMeLoading: w,
-                  onBoost: R,
-                  boostLoading: B,
-                  suggestedTags: x,
-                  onFetchSuggestedTags: N,
-                  suggestedTagsLoading: T
+                  inspireMeLoading: R,
+                  onBoost: w,
+                  boostLoading: N,
+                  suggestedTags: B,
+                  onFetchSuggestedTags: x,
+                  suggestedTagsLoading: J
                 }
               ),
               U === "2" && W && /* @__PURE__ */ a(
@@ -9341,7 +9342,7 @@ const Ma = {
   showStemsPaywall: v,
   showHiFiSwitch: C
 }) => {
-  var w;
+  var R;
   const { submitted: m, handleSubmit: I } = oa(l), k = [
     {
       value: "freeVocalInstruments",
@@ -9453,28 +9454,28 @@ const Ma = {
       name: n._("Other"),
       category: "paid"
     }
-  ], E = async (R) => {
-    if (R.isLocked) {
-      v(R.value);
+  ], E = async (w) => {
+    if (w.isLocked) {
+      v(w.value);
       return;
     }
-    const B = R.value;
-    d((x) => {
-      let N = [...x.selectedStems];
-      if (N.includes(B))
-        N = N.filter((T) => T !== B);
+    const N = w.value;
+    d((B) => {
+      let x = [...B.selectedStems];
+      if (x.includes(N))
+        x = x.filter((J) => J !== N);
       else {
-        const T = q0[B] || [];
-        N = N.filter(
-          (D) => !T.includes(D)
-        ), N.push(B);
+        const J = q0[N] || [];
+        x = x.filter(
+          (T) => !J.includes(T)
+        ), x.push(N);
       }
-      return N.includes("other") && N.length === 1 ? { ...x, selectedStems: [] } : { ...x, selectedStems: N };
+      return x.includes("other") && x.length === 1 ? { ...B, selectedStems: [] } : { ...B, selectedStems: x };
     });
-  }, S = (R) => {
-    d((B) => ({
-      ...B,
-      selectedStems: R.value
+  }, S = (w) => {
+    d((N) => ({
+      ...N,
+      selectedStems: w.value
     }));
   };
   return /* @__PURE__ */ f(b, { direction: "column", height: "100%", children: [
@@ -9483,10 +9484,10 @@ const Ma = {
       /* @__PURE__ */ a(
         vs,
         {
-          items: k.filter((R) => R.category === "free").map((R) => ({
-            name: R.name,
-            value: R.value,
-            icon: Ma[R.value]
+          items: k.filter((w) => w.category === "free").map((w) => ({
+            name: w.name,
+            value: w.value,
+            icon: Ma[w.value]
           })),
           value: c.selectedStems,
           onSelect: S
@@ -9497,14 +9498,14 @@ const Ma = {
     /* @__PURE__ */ a(
       vs,
       {
-        items: k.filter((R) => R.category === "paid").filter((R) => r.some((B) => B.value === R.value)).map((R) => {
-          var B;
+        items: k.filter((w) => w.category === "paid").filter((w) => r.some((N) => N.value === w.value)).map((w) => {
+          var N;
           return {
-            name: R.name,
-            value: R.value,
-            icon: Ma[R.value],
-            disabled: c.selectedStems.length === 0 && R.value === "Other",
-            isLocked: (B = r.find((x) => x.value === R.value)) == null ? void 0 : B.isLocked
+            name: w.name,
+            value: w.value,
+            icon: Ma[w.value],
+            disabled: c.selectedStems.length === 0 && w.value === "Other",
+            isLocked: (N = r.find((B) => B.value === w.value)) == null ? void 0 : N.isLocked
           };
         }),
         value: c.selectedStems,
@@ -9529,7 +9530,7 @@ const Ma = {
           xr,
           {
             title: n._("Separate Stems"),
-            disabled: !((w = c == null ? void 0 : c.selectedStems) != null && w.length) || !(c != null && c.trackName),
+            disabled: !((R = c == null ? void 0 : c.selectedStems) != null && R.length) || !(c != null && c.trackName),
             loading: u,
             onClick: I,
             besideFooter: /* @__PURE__ */ f(b, { align: "center", gap: "2", children: [
@@ -9859,25 +9860,25 @@ const en = 30, Kr = 200, cS = [
   counter: gS
 }, mS = Ze(
   ({ bpm: n, onTempoChange: t, i18n: r = { _: (s) => s } }) => {
-    const [s, o] = K(n), i = J(() => {
+    const [s, o] = K(n), i = D(() => {
       const g = (parseInt(s) || en) + 1;
       g > Kr || (o(g), t(g));
-    }, [s, t]), l = J(() => {
+    }, [s, t]), l = D(() => {
       const g = (parseInt(s) || en) - 1;
       g < en || (o(g), t(g));
-    }, [s, t]), c = J((A) => {
+    }, [s, t]), c = D((A) => {
       const g = parseInt(A, 10);
       return isNaN(g) || g < en ? en : g > Kr ? Kr : g;
-    }, []), d = J((A) => {
+    }, []), d = D((A) => {
       const g = A.target.value;
       (g === "" || /^\d+$/.test(g)) && o(g);
-    }, []), u = J(
+    }, []), u = D(
       (A) => {
         const g = c(A.target.value);
         o(g), t(g);
       },
       [c, t]
-    ), p = J(
+    ), p = D(
       (A) => {
         if (A.key === "Enter") {
           A.preventDefault();
@@ -9944,7 +9945,7 @@ const en = 30, Kr = 200, cS = [
     onRootKeyChange: l,
     i18n: c = { _: (d) => d }
   }) => {
-    const d = J(
+    const d = D(
       (A) => {
         t({
           top: parseInt(A),
@@ -9952,7 +9953,7 @@ const en = 30, Kr = 200, cS = [
         });
       },
       [t, o]
-    ), u = J(
+    ), u = D(
       (A) => {
         t({
           top: s,
@@ -10081,7 +10082,7 @@ const Vr = (n, t) => typeof n == "string" ? { title: n, description: "", variant
   maxToasts: r = 4,
   swipeDirection: s
 }) => {
-  const o = J((C) => C === "success" ? "success" : C === "error" ? "error" : "neutral", []), i = J((C) => {
+  const o = D((C) => C === "success" ? "success" : C === "error" ? "error" : "neutral", []), i = D((C) => {
     if (C === "success")
       return {
         backgroundColor: "#113B29",
@@ -10092,10 +10093,10 @@ const Vr = (n, t) => typeof n == "string" ? { title: n, description: "", variant
         backgroundColor: "#201314",
         color: "#FF9592"
       };
-  }, []), [l, c] = K([]), d = ee(/* @__PURE__ */ new Map()), u = J((C) => {
+  }, []), [l, c] = K([]), d = ee(/* @__PURE__ */ new Map()), u = D((C) => {
     const m = d.current.get(C);
     m && (clearTimeout(m), d.current.delete(C)), c((I) => I.filter((k) => k.id !== C));
-  }, []), p = J(
+  }, []), p = D(
     (C) => {
       const I = {
         ...Vr(C, "neutral"),
@@ -10104,20 +10105,20 @@ const Vr = (n, t) => typeof n == "string" ? { title: n, description: "", variant
         u(I.id);
       }, k);
       return d.current.set(I.id, E), c((S) => {
-        const w = [...S.slice(-(r - 1)), I], R = new Set(w.map((B) => B.id));
-        return S.forEach((B) => {
-          if (!R.has(B.id)) {
-            const x = d.current.get(B.id);
-            x && (clearTimeout(x), d.current.delete(B.id));
+        const R = [...S.slice(-(r - 1)), I], w = new Set(R.map((N) => N.id));
+        return S.forEach((N) => {
+          if (!w.has(N.id)) {
+            const B = d.current.get(N.id);
+            B && (clearTimeout(B), d.current.delete(N.id));
           }
-        }), w;
+        }), R;
       }), I.id;
     },
     [u, t, r]
-  ), A = J(
+  ), A = D(
     (C) => p(Vr(C, "success")),
     [p]
-  ), g = J(
+  ), g = D(
     (C) => p(Vr(C, "error")),
     [p]
   ), v = _(
@@ -10249,12 +10250,12 @@ function OS({
   inputLevel: c,
   children: d
 }) {
-  const [u, p] = K(!1), A = J(
+  const [u, p] = K(!1), A = D(
     (v) => {
       (!v || !n) && p(v);
     },
     [open, n]
-  ), g = J(() => {
+  ), g = D(() => {
     e.preventDefault(), p(!0);
   }, []);
   return /* @__PURE__ */ f(Ss, { open: u, onOpenChange: A, children: [
@@ -10333,23 +10334,23 @@ const FS = "_track_2k5w9_1", PS = "_name_2k5w9_11", zS = "_line_2k5w9_22", WS =
     isOpen: k,
     instrumentSelected: E,
     device: S,
-    channel: w,
+    channel: R,
     // State change listeners
-    onVolumeChange: R,
-    onPanChange: B,
-    onMutedChange: x,
-    onRecordChange: N,
-    onSoloChange: T,
-    onOpenChange: D,
+    onVolumeChange: w,
+    onPanChange: N,
+    onMutedChange: B,
+    onRecordChange: x,
+    onSoloChange: J,
+    onOpenChange: T,
     onInstrumentChange: Q,
     onDeviceChange: M,
-    onChannelChange: F,
+    onChannelChange: O,
     // Children (having content means group/takelanes)
     children: U
   }) => {
-    const O = !!U, z = J(
-      () => D == null ? void 0 : D(!k),
-      [k, D]
+    const F = !!U, z = D(
+      () => T == null ? void 0 : T(!k),
+      [k, T]
     );
     return /* @__PURE__ */ f(
       "div",
@@ -10360,7 +10361,7 @@ const FS = "_track_2k5w9_1", PS = "_name_2k5w9_11", zS = "_line_2k5w9_22", WS =
             "div",
             {
               className: y(Se.track, {
-                [Se.isParentTrack]: O,
+                [Se.isParentTrack]: F,
                 [Se.isCompact]: i
               }),
               style: { height: `${o}px` },
@@ -10430,7 +10431,7 @@ const FS = "_track_2k5w9_1", PS = "_name_2k5w9_11", zS = "_line_2k5w9_22", WS =
                                   {
                                     size: "2",
                                     className: Se.name,
-                                    onClick: O ? z : void 0,
+                                    onClick: F ? z : void 0,
                                     children: n
                                   }
                                 ) })
@@ -10453,15 +10454,15 @@ const FS = "_track_2k5w9_1", PS = "_name_2k5w9_11", zS = "_line_2k5w9_22", WS =
                                     device: S,
                                     onDeviceChange: M,
                                     channelOptions: u,
-                                    channel: w,
-                                    onChannelChange: F,
+                                    channel: R,
+                                    onChannelChange: O,
                                     inputLevel: p,
                                     children: /* @__PURE__ */ a(
                                       sr,
                                       {
                                         type: "record",
                                         selected: C,
-                                        onClick: () => N == null ? void 0 : N()
+                                        onClick: () => x == null ? void 0 : x()
                                       }
                                     )
                                   }
@@ -10471,7 +10472,7 @@ const FS = "_track_2k5w9_1", PS = "_name_2k5w9_11", zS = "_line_2k5w9_22", WS =
                                   {
                                     type: v ? "mute" : m ? "autoMute" : "mute",
                                     selected: v || !I && m,
-                                    onClick: x
+                                    onClick: B
                                   }
                                 ),
                                 /* @__PURE__ */ a(
@@ -10479,7 +10480,7 @@ const FS = "_track_2k5w9_1", PS = "_name_2k5w9_11", zS = "_line_2k5w9_22", WS =
                                   {
                                     type: "solo",
                                     selected: I,
-                                    onClick: T
+                                    onClick: J
                                   }
                                 )
                               ]
@@ -10516,7 +10517,7 @@ const FS = "_track_2k5w9_1", PS = "_name_2k5w9_11", zS = "_line_2k5w9_22", WS =
                         {
                           linear: p,
                           volume: A,
-                          onVolumeChange: R
+                          onVolumeChange: w
                         }
                       ),
                       r && /* @__PURE__ */ a(
@@ -10524,7 +10525,7 @@ const FS = "_track_2k5w9_1", PS = "_name_2k5w9_11", zS = "_line_2k5w9_22", WS =
                         {
                           className: Se.pan,
                           value: g,
-                          onChange: B,
+                          onChange: N,
                           minValue: -1,
                           maxValue: 1
                         }
@@ -10535,7 +10536,7 @@ const FS = "_track_2k5w9_1", PS = "_name_2k5w9_11", zS = "_line_2k5w9_22", WS =
               )
             }
           ),
-          O && k && /* @__PURE__ */ a("div", { className: Se.group, children: U })
+          F && k && /* @__PURE__ */ a("div", { className: Se.group, children: U })
         ]
       }
     );
@@ -10560,7 +10561,7 @@ function pw({ schema: n }) {
     }
     for (const m of l.current) m(t);
   }, [t]);
-  const d = J((m, I) => {
+  const d = D((m, I) => {
     if (typeof m == "string") {
       r((S) => ({ ...S, [m]: I })), o((S) => ({ ...S, [m]: null }));
       return;
@@ -10572,8 +10573,8 @@ function pw({ schema: n }) {
   }, []), u = (m, I) => {
     const k = t[m], E = (S) => d(m, S);
     return I === "checkbox" || I === "switch" ? { checked: !!k, onCheckedChange: E } : { value: k ?? "", onChange: (S) => {
-      var w;
-      return E(((w = S == null ? void 0 : S.target) == null ? void 0 : w.value) ?? S);
+      var R;
+      return E(((R = S == null ? void 0 : S.target) == null ? void 0 : R.value) ?? S);
     } };
   }, p = () => {
     const m = n.safeParse(t);
@@ -10585,14 +10586,14 @@ function pw({ schema: n }) {
       I[E] || (I[E] = k.message);
     }
     return o(I), { isValid: !1, data: t };
-  }, A = J((m) => (l.current.push(m), () => {
+  }, A = D((m) => (l.current.push(m), () => {
     l.current = l.current.filter((I) => I !== m);
   }), []), g = (m) => {
     const I = s[m];
     return I ? /* @__PURE__ */ a(H, { size: "1", color: "red", children: I }) : null;
   }, v = (m) => {
     r(m ?? n.parse({})), o({});
-  }, C = J(
+  }, C = D(
     (m) => /* @__PURE__ */ a(tE, { ...m, errorsRef: i }),
     []
   );
@@ -11024,26 +11025,26 @@ class uE extends Pn {
       const A = (g) => {
         if (g.button !== i || (d.set(g.pointerId, g), d.size > 1)) return;
         let v = g.clientX, C = g.clientY, m = !1;
-        const I = Date.now(), k = r.getBoundingClientRect(), { left: E, top: S } = k, w = (T) => {
-          if (T.defaultPrevented || d.size > 1 || u && Date.now() - I < l) return;
-          const D = T.clientX, Q = T.clientY, M = D - v, F = Q - C;
-          (m || Math.abs(M) > o || Math.abs(F) > o) && (T.preventDefault(), T.stopPropagation(), m || (c.set({ type: "start", x: v - E, y: C - S }), m = !0), c.set({ type: "move", x: D - E, y: Q - S, deltaX: M, deltaY: F }), v = D, C = Q);
-        }, R = (T) => {
-          if (d.delete(T.pointerId), m) {
-            const D = T.clientX, Q = T.clientY;
-            c.set({ type: "end", x: D - E, y: Q - S });
+        const I = Date.now(), k = r.getBoundingClientRect(), { left: E, top: S } = k, R = (J) => {
+          if (J.defaultPrevented || d.size > 1 || u && Date.now() - I < l) return;
+          const T = J.clientX, Q = J.clientY, M = T - v, O = Q - C;
+          (m || Math.abs(M) > o || Math.abs(O) > o) && (J.preventDefault(), J.stopPropagation(), m || (c.set({ type: "start", x: v - E, y: C - S }), m = !0), c.set({ type: "move", x: T - E, y: Q - S, deltaX: M, deltaY: O }), v = T, C = Q);
+        }, w = (J) => {
+          if (d.delete(J.pointerId), m) {
+            const T = J.clientX, Q = J.clientY;
+            c.set({ type: "end", x: T - E, y: Q - S });
           }
           p();
-        }, B = (T) => {
-          d.delete(T.pointerId), T.relatedTarget && T.relatedTarget !== document.documentElement || R(T);
-        }, x = (T) => {
-          m && (T.stopPropagation(), T.preventDefault());
-        }, N = (T) => {
-          T.defaultPrevented || d.size > 1 || m && T.preventDefault();
+        }, N = (J) => {
+          d.delete(J.pointerId), J.relatedTarget && J.relatedTarget !== document.documentElement || w(J);
+        }, B = (J) => {
+          m && (J.stopPropagation(), J.preventDefault());
+        }, x = (J) => {
+          J.defaultPrevented || d.size > 1 || m && J.preventDefault();
         };
-        document.addEventListener("pointermove", w), document.addEventListener("pointerup", R), document.addEventListener("pointerout", B), document.addEventListener("pointercancel", B), document.addEventListener("touchmove", N, { passive: !1 }), document.addEventListener("click", x, { capture: !0 }), p = () => {
-          document.removeEventListener("pointermove", w), document.removeEventListener("pointerup", R), document.removeEventListener("pointerout", B), document.removeEventListener("pointercancel", B), document.removeEventListener("touchmove", N), setTimeout(() => {
-            document.removeEventListener("click", x, { capture: !0 });
+        document.addEventListener("pointermove", R), document.addEventListener("pointerup", w), document.addEventListener("pointerout", N), document.addEventListener("pointercancel", N), document.addEventListener("touchmove", x, { passive: !1 }), document.addEventListener("click", B, { capture: !0 }), p = () => {
+          document.removeEventListener("pointermove", R), document.removeEventListener("pointerup", w), document.removeEventListener("pointerout", N), document.removeEventListener("pointercancel", N), document.removeEventListener("touchmove", x), setTimeout(() => {
+            document.removeEventListener("click", B, { capture: !0 });
           }, 10);
         };
       };
@@ -11207,21 +11208,21 @@ class uE extends Pn {
   }
   renderBarWaveform(t, r, s, o) {
     const { width: i, height: l } = s.canvas, { halfHeight: c, barWidth: d, barRadius: u, barIndexScale: p, barSpacing: A, barMinHeight: g } = function({ width: C, height: m, length: I, options: k, pixelRatio: E }) {
-      const S = m / 2, w = k.barWidth ? k.barWidth * E : 1, R = k.barGap ? k.barGap * E : k.barWidth ? w / 2 : 0, B = w + R || 1;
-      return { halfHeight: S, barWidth: w, barGap: R, barRadius: k.barRadius || 0, barMinHeight: k.barMinHeight ? k.barMinHeight * E : 0, barIndexScale: I > 0 ? C / B / I : 0, barSpacing: B };
-    }({ width: i, height: l, length: (t[0] || []).length, options: r, pixelRatio: this.getPixelRatio() }), v = function({ channelData: C, barIndexScale: m, barSpacing: I, barWidth: k, halfHeight: E, vScale: S, canvasHeight: w, barAlign: R, barMinHeight: B }) {
-      const x = C[0] || [], N = C[1] || x, T = x.length, D = [];
-      let Q = 0, M = 0, F = 0;
-      for (let U = 0; U <= T; U++) {
-        const O = Math.round(U * m);
-        if (O > Q) {
-          const { topHeight: $, totalHeight: W } = lE({ maxTop: M, maxBottom: F, halfHeight: E, vScale: S, barMinHeight: B, barAlign: R }), re = cE({ barAlign: R, halfHeight: E, topHeight: $, totalHeight: W, canvasHeight: w });
-          D.push({ x: Q * I, y: re, width: k, height: W }), Q = O, M = 0, F = 0;
+      const S = m / 2, R = k.barWidth ? k.barWidth * E : 1, w = k.barGap ? k.barGap * E : k.barWidth ? R / 2 : 0, N = R + w || 1;
+      return { halfHeight: S, barWidth: R, barGap: w, barRadius: k.barRadius || 0, barMinHeight: k.barMinHeight ? k.barMinHeight * E : 0, barIndexScale: I > 0 ? C / N / I : 0, barSpacing: N };
+    }({ width: i, height: l, length: (t[0] || []).length, options: r, pixelRatio: this.getPixelRatio() }), v = function({ channelData: C, barIndexScale: m, barSpacing: I, barWidth: k, halfHeight: E, vScale: S, canvasHeight: R, barAlign: w, barMinHeight: N }) {
+      const B = C[0] || [], x = C[1] || B, J = B.length, T = [];
+      let Q = 0, M = 0, O = 0;
+      for (let U = 0; U <= J; U++) {
+        const F = Math.round(U * m);
+        if (F > Q) {
+          const { topHeight: $, totalHeight: W } = lE({ maxTop: M, maxBottom: O, halfHeight: E, vScale: S, barMinHeight: N, barAlign: w }), re = cE({ barAlign: w, halfHeight: E, topHeight: $, totalHeight: W, canvasHeight: R });
+          T.push({ x: Q * I, y: re, width: k, height: W }), Q = F, M = 0, O = 0;
         }
-        const z = Math.abs(x[U] || 0), X = Math.abs(N[U] || 0);
-        z > M && (M = z), X > F && (F = X);
+        const z = Math.abs(B[U] || 0), X = Math.abs(x[U] || 0);
+        z > M && (M = z), X > O && (O = X);
       }
-      return D;
+      return T;
     }({ channelData: t, barIndexScale: p, barSpacing: A, barWidth: d, halfHeight: c, vScale: o, canvasHeight: l, barAlign: r.barAlign, barMinHeight: g });
     s.beginPath();
     for (const C of v) u && "roundRect" in s ? s.roundRect(C.x, C.y, C.width, C.height, u) : s.rect(C.x, C.y, C.width, C.height);
@@ -11231,18 +11232,18 @@ class uE extends Pn {
     const { width: i, height: l } = s.canvas, c = function({ channelData: d, width: u, height: p, vScale: A }) {
       const g = p / 2, v = d[0] || [];
       return [v, d[1] || v].map((C, m) => {
-        const I = C.length, k = I ? u / I : 0, E = g, S = m === 0 ? -1 : 1, w = [{ x: 0, y: E }];
-        let R = 0, B = 0;
-        for (let x = 0; x <= I; x++) {
-          const N = Math.round(x * k);
-          if (N > R) {
-            const D = E + (Math.round(B * g * A) || 1) * S;
-            w.push({ x: R, y: D }), R = N, B = 0;
+        const I = C.length, k = I ? u / I : 0, E = g, S = m === 0 ? -1 : 1, R = [{ x: 0, y: E }];
+        let w = 0, N = 0;
+        for (let B = 0; B <= I; B++) {
+          const x = Math.round(B * k);
+          if (x > w) {
+            const T = E + (Math.round(N * g * A) || 1) * S;
+            R.push({ x: w, y: T }), w = x, N = 0;
           }
-          const T = Math.abs(C[x] || 0);
-          T > B && (B = T);
+          const J = Math.abs(C[B] || 0);
+          J > N && (N = J);
         }
-        return w.push({ x: R, y: E }), w;
+        return R.push({ x: w, y: E }), R;
       });
     }({ channelData: t, width: i, height: l, vScale: o });
     s.beginPath();
@@ -11293,10 +11294,10 @@ class uE extends Pn {
       const m = C * p;
       let I = Math.min(u - m, p);
       if (I = Fa(I, r), I <= 0) return;
-      const k = function({ channelData: E, offset: S, clampedWidth: w, totalWidth: R }) {
-        return E.map((B) => {
-          const x = Math.floor(S / R * B.length), N = Math.floor((S + w) / R * B.length);
-          return B.slice(x, N);
+      const k = function({ channelData: E, offset: S, clampedWidth: R, totalWidth: w }) {
+        return E.map((N) => {
+          const B = Math.floor(S / w * N.length), x = Math.floor((S + R) / w * N.length);
+          return N.slice(B, x);
         });
       }({ channelData: t, offset: m, clampedWidth: I, totalWidth: u });
       this.renderSingleCanvas(k, r, I, o, m, i, l);
@@ -11554,10 +11555,10 @@ class Qn extends iE {
     super({ media: r, mediaControls: t.mediaControls, autoplay: t.autoplay, playbackRate: t.audioRate }), this.plugins = [], this.decodedData = null, this.stopAtPosition = null, this.subscriptions = [], this.mediaSubscriptions = [], this.abortController = null, this.reactiveCleanups = [], this.options = Object.assign({}, AE, t);
     const { state: s, actions: o } = function(c) {
       var d, u, p, A, g, v;
-      const C = (d = c == null ? void 0 : c.currentTime) !== null && d !== void 0 ? d : ve(0), m = (u = c == null ? void 0 : c.duration) !== null && u !== void 0 ? u : ve(0), I = (p = c == null ? void 0 : c.isPlaying) !== null && p !== void 0 ? p : ve(!1), k = (A = c == null ? void 0 : c.isSeeking) !== null && A !== void 0 ? A : ve(!1), E = (g = c == null ? void 0 : c.volume) !== null && g !== void 0 ? g : ve(1), S = (v = c == null ? void 0 : c.playbackRate) !== null && v !== void 0 ? v : ve(1), w = ve(null), R = ve(null), B = ve(""), x = ve(0), N = ve(0), T = Wt(() => !I.value, [I]), D = Wt(() => w.value !== null, [w]), Q = Wt(() => D.value && m.value > 0, [D, m]), M = Wt(() => C.value, [C]), F = Wt(() => m.value > 0 ? C.value / m.value : 0, [C, m]);
-      return { state: { currentTime: C, duration: m, isPlaying: I, isPaused: T, isSeeking: k, volume: E, playbackRate: S, audioBuffer: w, peaks: R, url: B, zoom: x, scrollPosition: N, canPlay: D, isReady: Q, progress: M, progressPercent: F }, actions: { setCurrentTime: (U) => {
-        const O = Math.max(0, Math.min(m.value || 1 / 0, U));
-        C.set(O);
+      const C = (d = c == null ? void 0 : c.currentTime) !== null && d !== void 0 ? d : ve(0), m = (u = c == null ? void 0 : c.duration) !== null && u !== void 0 ? u : ve(0), I = (p = c == null ? void 0 : c.isPlaying) !== null && p !== void 0 ? p : ve(!1), k = (A = c == null ? void 0 : c.isSeeking) !== null && A !== void 0 ? A : ve(!1), E = (g = c == null ? void 0 : c.volume) !== null && g !== void 0 ? g : ve(1), S = (v = c == null ? void 0 : c.playbackRate) !== null && v !== void 0 ? v : ve(1), R = ve(null), w = ve(null), N = ve(""), B = ve(0), x = ve(0), J = Wt(() => !I.value, [I]), T = Wt(() => R.value !== null, [R]), Q = Wt(() => T.value && m.value > 0, [T, m]), M = Wt(() => C.value, [C]), O = Wt(() => m.value > 0 ? C.value / m.value : 0, [C, m]);
+      return { state: { currentTime: C, duration: m, isPlaying: I, isPaused: J, isSeeking: k, volume: E, playbackRate: S, audioBuffer: R, peaks: w, url: N, zoom: B, scrollPosition: x, canPlay: T, isReady: Q, progress: M, progressPercent: O }, actions: { setCurrentTime: (U) => {
+        const F = Math.max(0, Math.min(m.value || 1 / 0, U));
+        C.set(F);
       }, setDuration: (U) => {
         m.set(Math.max(0, U));
       }, setPlaying: (U) => {
@@ -11565,21 +11566,21 @@ class Qn extends iE {
       }, setSeeking: (U) => {
         k.set(U);
       }, setVolume: (U) => {
-        const O = Math.max(0, Math.min(1, U));
-        E.set(O);
+        const F = Math.max(0, Math.min(1, U));
+        E.set(F);
       }, setPlaybackRate: (U) => {
-        const O = Math.max(0.1, Math.min(16, U));
-        S.set(O);
+        const F = Math.max(0.1, Math.min(16, U));
+        S.set(F);
       }, setAudioBuffer: (U) => {
-        w.set(U), U && m.set(U.duration);
+        R.set(U), U && m.set(U.duration);
       }, setPeaks: (U) => {
-        R.set(U);
+        w.set(U);
       }, setUrl: (U) => {
-        B.set(U);
+        N.set(U);
       }, setZoom: (U) => {
-        x.set(Math.max(0, U));
+        B.set(Math.max(0, U));
       }, setScrollPosition: (U) => {
-        N.set(Math.max(0, U));
+        x.set(Math.max(0, U));
       } } };
     }({ isPlaying: this.isPlayingSignal, currentTime: this.currentTimeSignal, duration: this.durationSignal, volume: this.volumeSignal, playbackRate: this.playbackRateSignal, isSeeking: this.seekingSignal });
     this.wavesurferState = s, this.wavesurferActions = o, this.timer = new hE();
@@ -11947,28 +11948,28 @@ function Dl({
   classNamesButton: v,
   onPlayStateChange: C
 }) {
-  const [m, I] = K(!1), [k, E] = K(!1), [S, w] = K(!1), [R, B] = K(!1);
+  const [m, I] = K(!1), [k, E] = K(!1), [S, R] = K(!1), [w, N] = K(!1);
   ie(() => {
-    typeof navigator < "u" && B(/^((?!chrome|android).)*safari/i.test(navigator.userAgent));
+    typeof navigator < "u" && N(/^((?!chrome|android).)*safari/i.test(navigator.userAgent));
   }, []);
-  const x = _(() => s, [s]), N = _(() => o ? !1 : !x || x && m, [x, m, o]), T = ee(null), D = ee(null);
+  const B = _(() => s, [s]), x = _(() => o ? !1 : !B || B && m, [B, m, o]), J = ee(null), T = ee(null);
   ie(() => {
-    S || (!p || i) && w(!0);
+    S || (!p || i) && R(!0);
   }, [p, i, S]);
-  const Q = J(() => {
+  const Q = D(() => {
     var W;
-    D.current && ((W = D.current) == null || W.pause());
-  }, []), M = J(() => {
+    T.current && ((W = T.current) == null || W.pause());
+  }, []), M = D(() => {
     var W, re;
-    D.current && (d && d.state.active && d.state.active !== D.current && d.state.active.pause(), R || (W = D.current) == null || W.setOptions({ progressColor: c }), (re = D.current) == null || re.play());
-  }, [R, c, d]);
+    T.current && (d && d.state.active && d.state.active !== T.current && d.state.active.pause(), w || (W = T.current) == null || W.setOptions({ progressColor: c }), (re = T.current) == null || re.play());
+  }, [w, c, d]);
   ie(() => {
     var W;
-    D.current && n && ((W = D.current) == null || W.load(n));
+    T.current && n && ((W = T.current) == null || W.load(n));
   }, [n]);
-  const F = J((W) => {
-    D.current = W, E(!0), I(!1);
-  }, []), U = J(
+  const O = D((W) => {
+    T.current = W, E(!0), I(!1);
+  }, []), U = D(
     (W) => {
       if (I(!0), r == null || r(!0), C == null || C(!0), d) {
         if (d.state.active && d.state.active !== W) {
@@ -11985,12 +11986,12 @@ function Dl({
       A == null || A();
     },
     [r, d, A, C]
-  ), O = J(() => {
+  ), F = D(() => {
     I(!1), r == null || r(!1), C == null || C(!1), d && d.setter((W) => ({
       ...W,
       isPlaying: !1
     }));
-  }, [r, d, C]), z = J(
+  }, [r, d, C]), z = D(
     (W) => {
       d && d.setter((re) => ({
         ...re,
@@ -11998,20 +11999,20 @@ function Dl({
       }));
     },
     [d]
-  ), X = J(() => {
+  ), X = D(() => {
     var W;
-    u ? (W = D.current) == null || W.play() : (I(!1), r == null || r(!1), C == null || C(!1), d && d.setter((re) => ({
+    u ? (W = T.current) == null || W.play() : (I(!1), r == null || r(!1), C == null || C(!1), d && d.setter((re) => ({
       ...re,
       isPlaying: !1,
       active: null
     })));
-  }, [u, r, d, C]), $ = J(() => {
+  }, [u, r, d, C]), $ = D(() => {
     var W, re, Ne;
-    (W = D.current) != null && W.isPlaying() ? Q() : D.current && ((re = d == null ? void 0 : d.state) != null && re.active && d.state.active !== D.current && (d.state.active.pause(), d.setter((ke) => ({
+    (W = T.current) != null && W.isPlaying() ? Q() : T.current && ((re = d == null ? void 0 : d.state) != null && re.active && d.state.active !== T.current && (d.state.active.pause(), d.setter((ke) => ({
       ...ke,
       isPlaying: !1,
       active: null
-    }))), (Ne = d == null ? void 0 : d.state) != null && Ne.active && d.state.active !== D.current && d.state.active.getCurrentTime && D.current.setTime(d.state.active.getCurrentTime()), M());
+    }))), (Ne = d == null ? void 0 : d.state) != null && Ne.active && d.state.active !== T.current && d.state.active.getCurrentTime && T.current.setTime(d.state.active.getCurrentTime()), M());
   }, [M, Q, d]);
   return /* @__PURE__ */ f(
     b,
@@ -12040,10 +12041,10 @@ function Dl({
           {
             width: "100%",
             style: {
-              display: N && k ? "block" : "none",
+              display: x && k ? "block" : "none",
               cursor: "pointer"
             },
-            ref: T,
+            ref: J,
             children: /* @__PURE__ */ a(
               CE,
               {
@@ -12055,12 +12056,12 @@ function Dl({
                 barHeight: 6,
                 cursorWidth: 0,
                 height: bE[t] || 36,
-                onReady: F,
+                onReady: O,
                 onSeeking: z,
                 onPlay: U,
-                onPause: O,
+                onPause: F,
                 onFinish: X,
-                backend: R ? "WebAudio" : "MediaElement"
+                backend: w ? "WebAudio" : "MediaElement"
               }
             )
           }
@@ -12070,7 +12071,7 @@ function Dl({
           {
             width: "100%",
             style: {
-              display: N && !k ? "block" : "none",
+              display: x && !k ? "block" : "none",
               cursor: "pointer"
             },
             children: /* @__PURE__ */ a("span", { className: Yr.waveform, children: /* @__PURE__ */ a(
@@ -12105,7 +12106,7 @@ const IE = "_customButton_14z6y_1", SE = "_descriptionVoiceList_14z6y_5", za = {
   style: d,
   i18n: u = { _: (p) => p }
 }) => {
-  const p = J(
+  const p = D(
     (A, g) => {
       A ? c(g == null ? void 0 : g.identifier) : s === (g == null ? void 0 : g.identifier) && c(null);
     },
@@ -12430,77 +12431,77 @@ const PE = "_footerVoiceForm_lsc2c_2", zE = {
   onClickUpgradeConcurrency: C,
   onRemoveTrack: m
 }) => {
-  const [I, k] = K(null), [E, S] = K(null), { submitted: w, handleSubmit: R } = oa(p), [B, x] = K({
+  const [I, k] = K(null), [E, S] = K(null), { submitted: R, handleSubmit: w } = oa(p), [N, B] = K({
     lastPlayed: null,
     active: null,
     isPlaying: !1,
     id: "voice-form"
-  }), N = J(
-    (O) => {
-      k(O);
-      const z = n.find((X) => X.identifier === O);
+  }), x = D(
+    (F) => {
+      k(F);
+      const z = n.find((X) => X.identifier === F);
       r((X) => ({
         ...X,
         selectedVoice: z
       }));
     },
     [n, r]
-  ), T = J(
-    (O) => {
-      E !== O && S(O);
+  ), J = D(
+    (F) => {
+      E !== F && S(F);
     },
     [E, S]
-  ), D = J(
-    (O) => {
-      S(null), B.active && B.active.pause(), x((z) => ({
+  ), T = D(
+    (F) => {
+      S(null), N.active && N.active.pause(), B((z) => ({
         ...z,
         isPlaying: !1,
         active: null
-      })), s(O);
+      })), s(F);
     },
-    [s, B]
+    [s, N]
   ), Q = _(
     () => ({
-      state: B,
-      setter: x
+      state: N,
+      setter: B
     }),
-    [B]
+    [N]
   ), M = _(
-    () => n.find((O) => O.identifier === i) || n[0],
+    () => n.find((F) => F.identifier === i) || n[0],
     [n, i]
-  ), F = _(
+  ), O = _(
     () => !!(t.trackName || t.trackId || t.customAudio),
     [t.trackName, t.trackId, t.customAudio]
-  ), U = J(() => {
+  ), U = D(() => {
     if (!i) {
-      R();
+      w();
       return;
     }
-    M && (N(M.identifier), o(), r((O) => {
+    M && (x(M.identifier), o(), r((F) => {
       var z;
-      return ((z = O.selectedVoice) == null ? void 0 : z.identifier) === M.identifier ? O : { ...O, selectedVoice: M };
-    })), F && (M ? R({ selectedVoice: M }) : R());
-  }, [i, R, M, N, o]);
+      return ((z = F.selectedVoice) == null ? void 0 : z.identifier) === M.identifier ? F : { ...F, selectedVoice: M };
+    })), O && (M ? w({ selectedVoice: M }) : w());
+  }, [i, w, M, x, o]);
   return ie(() => {
-    var O;
-    if (B.isPlaying === !1)
+    var F;
+    if (N.isPlaying === !1)
       S(null);
-    else if (B.isPlaying === !0 && B.active) {
-      const z = (O = n.find(
-        (X) => B.active && X.metadata.previewUrl === B.active.url
-      )) == null ? void 0 : O.identifier;
+    else if (N.isPlaying === !0 && N.active) {
+      const z = (F = n.find(
+        (X) => N.active && X.metadata.previewUrl === N.active.url
+      )) == null ? void 0 : F.identifier;
       z && S(z);
     }
-  }, [B, n]), /* @__PURE__ */ f(b, { direction: "column", height: "100%", children: [
+  }, [N, n]), /* @__PURE__ */ f(b, { direction: "column", height: "100%", children: [
     /* @__PURE__ */ a(
       EE,
       {
         voices: n,
         selectedId: I,
-        handleSelect: N,
+        handleSelect: x,
         playingItem: E,
-        handleAvatarClick: T,
-        handleDetailsClick: D,
+        handleAvatarClick: J,
+        handleDetailsClick: T,
         wavegroup: Q,
         setPlayingItem: S,
         style: { display: i ? "none" : "block" },
@@ -12548,7 +12549,7 @@ const PE = "_footerVoiceForm_lsc2c_2", zE = {
                   onMountConcurrency: g
                 }
               ),
-              !d && !w && !u && !i && /* @__PURE__ */ a(
+              !d && !R && !u && !i && /* @__PURE__ */ a(
                 FE,
                 {
                   trackId: t.trackId,
@@ -12558,7 +12559,7 @@ const PE = "_footerVoiceForm_lsc2c_2", zE = {
                   onRemoveTrack: m
                 }
               ),
-              !d && w && !u && !i && /* @__PURE__ */ a(Ke, { showIcon: !1, showBackground: !1, children: /* @__PURE__ */ a(P, { size: "2", children: l._("Voice conversion initialized!") }) }),
+              !d && R && !u && !i && /* @__PURE__ */ a(Ke, { showIcon: !1, showBackground: !1, children: /* @__PURE__ */ a(P, { size: "2", children: l._("Voice conversion initialized!") }) }),
               !d && u && !i && /* @__PURE__ */ a(
                 Ke,
                 {