@protonradio/proton-ui 0.6.18-beta.10 → 0.6.18-beta.12

package/dist/index.es.js

@@ -1,13 +1,13 @@
 import g, { useLayoutEffect as pr, useState as D, useRef as S, createElement as Qt, useEffect as F, createContext as O, useContext as A, useMemo as oe, isValidElement as hr, forwardRef as fe, useCallback as ne, cloneElement as vr } from "react";
 import en, { createPortal as tn } from "react-dom";
-import { useMenu as nn, useOverlay as mr, FocusScope as pt, useMenuItem as rn, useButton as De, useRadioGroup as br, useRadio as gr, VisuallyHidden as on, useDialog as yr, useTextField as xr, useClipboard as _r, useSearchField as $r, useOverlayTrigger as Sr, usePopover as Er, Overlay as wr, DismissButton as Cr, useFocusRing as we, useHover as Rr, useId as Lt, mergeProps as me, useMenuTrigger as Pr, useMenuSection as Tr, useTooltipTrigger as jr, OverlayContainer as Nr, useOverlayPosition as Mr, useTooltip as kr, useListBox as Ar, useOption as Or, useSelect as an, HiddenSelect as ln, useSwitch as Ir, useTableHeaderRow as Dr, useTableColumnHeader as Lr, useTableRowGroup as Br, useTableRow as Vr, useTableCell as Hr, useTable as Kr } from "react-aria";
+import { useMenu as nn, useOverlay as mr, FocusScope as pt, useMenuItem as rn, useButton as De, useRadioGroup as br, useRadio as gr, VisuallyHidden as on, useDialog as yr, useTextField as xr, useClipboard as $r, useSearchField as _r, useOverlayTrigger as Sr, usePopover as Er, Overlay as wr, DismissButton as Cr, useFocusRing as we, useHover as Rr, useId as Lt, mergeProps as me, useMenuTrigger as Pr, useMenuSection as Tr, useTooltipTrigger as jr, OverlayContainer as Nr, useOverlayPosition as Mr, useTooltip as kr, useListBox as Ar, useOption as Or, useSelect as an, HiddenSelect as ln, useSwitch as Ir, useTableHeaderRow as Dr, useTableColumnHeader as Lr, useTableRowGroup as Br, useTableRow as Vr, useTableCell as Hr, useTable as Kr } from "react-aria";
 import { useTreeState as sn, Item as ht, useRadioGroupState as Wr, useOverlayTriggerState as Fr, useMenuTriggerState as Gr, useTooltipTriggerState as cn, useSelectState as un, useToggleState as Ur, useTableState as zr } from "react-stately";
-import { b as E, i as vt, h as dn } from "./utils-D71CUDBU.mjs";
+import { b as w, i as vt, h as dn } from "./utils-B5na7vwh.mjs";
 import { THEMES as le, BREAKPOINTS as fn } from "./constants.es.js";
 import { transparentize as de, toRgba as Xe } from "color2k";
 import { G as Q, S as Ne, W as Me, D as ke, B as Yr } from "./colors-Dwh4VIMR.mjs";
 import { c as Na } from "./colors-Dwh4VIMR.mjs";
-var rt = { exports: {} }, _e = {};
+var rt = { exports: {} }, $e = {};
 /**
  * @license React
  * react-jsx-runtime.production.min.js
@@ -19,7 +19,7 @@ var rt = { exports: {} }, _e = {};
  */
 var Bt;
 function qr() {
-  if (Bt) return _e;
+  if (Bt) return $e;
   Bt = 1;
   var t = g, e = Symbol.for("react.element"), n = Symbol.for("react.fragment"), r = Object.prototype.hasOwnProperty, o = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, i = { key: !0, ref: !0, __self: !0, __source: !0 };
   function l(c, u, f) {
@@ -29,9 +29,9 @@ function qr() {
     if (c && c.defaultProps) for (d in u = c.defaultProps, u) h[d] === void 0 && (h[d] = u[d]);
     return { $$typeof: e, type: c, key: p, ref: v, props: h, _owner: o.current };
   }
-  return _e.Fragment = n, _e.jsx = l, _e.jsxs = l, _e;
+  return $e.Fragment = n, $e.jsx = l, $e.jsxs = l, $e;
 }
-var $e = {};
+var _e = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -45,23 +45,23 @@ var Vt;
 function Jr() {
   return Vt || (Vt = 1, process.env.NODE_ENV !== "production" && function() {
     var t = g, e = Symbol.for("react.element"), n = Symbol.for("react.portal"), r = Symbol.for("react.fragment"), o = Symbol.for("react.strict_mode"), i = Symbol.for("react.profiler"), l = Symbol.for("react.provider"), c = Symbol.for("react.context"), u = Symbol.for("react.forward_ref"), f = Symbol.for("react.suspense"), d = Symbol.for("react.suspense_list"), h = Symbol.for("react.memo"), p = Symbol.for("react.lazy"), v = Symbol.for("react.offscreen"), y = Symbol.iterator, x = "@@iterator";
-    function _(a) {
+    function $(a) {
       if (a === null || typeof a != "object")
         return null;
       var m = y && a[y] || a[x];
       return typeof m == "function" ? m : null;
     }
-    var w = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+    var E = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
     function R(a) {
       {
-        for (var m = arguments.length, b = new Array(m > 1 ? m - 1 : 0), $ = 1; $ < m; $++)
-          b[$ - 1] = arguments[$];
+        for (var m = arguments.length, b = new Array(m > 1 ? m - 1 : 0), _ = 1; _ < m; _++)
+          b[_ - 1] = arguments[_];
         j("error", a, b);
       }
     }
     function j(a, m, b) {
       {
-        var $ = w.ReactDebugCurrentFrame, N = $.getStackAddendum();
+        var _ = E.ReactDebugCurrentFrame, N = _.getStackAddendum();
         N !== "" && (m += "%s", b = b.concat([N]));
         var k = b.map(function(T) {
           return String(T);
@@ -79,9 +79,9 @@ function Jr() {
       a.$$typeof === W || a.getModuleId !== void 0));
     }
     function ce(a, m, b) {
-      var $ = a.displayName;
-      if ($)
-        return $;
+      var _ = a.displayName;
+      if (_)
+        return _;
       var N = m.displayName || m.name || "";
       return N !== "" ? b + "(" + N + ")" : b;
     }
@@ -120,8 +120,8 @@ function Jr() {
           case u:
             return ce(a, a.render, "ForwardRef");
           case h:
-            var $ = a.displayName || null;
-            return $ !== null ? $ : H(a.type) || "Memo";
+            var _ = a.displayName || null;
+            return _ !== null ? _ : H(a.type) || "Memo";
           case p: {
             var N = a, k = N._payload, T = N._init;
             try {
@@ -133,14 +133,14 @@ function Jr() {
         }
       return null;
     }
-    var Z = Object.assign, B = 0, U, Y, q, ae, pe, _t, $t;
+    var Z = Object.assign, B = 0, U, Y, q, ae, pe, $t, _t;
     function St() {
     }
     St.__reactDisabledLog = !0;
     function Vn() {
       {
         if (B === 0) {
-          U = console.log, Y = console.info, q = console.warn, ae = console.error, pe = console.group, _t = console.groupCollapsed, $t = console.groupEnd;
+          U = console.log, Y = console.info, q = console.warn, ae = console.error, pe = console.group, $t = console.groupCollapsed, _t = console.groupEnd;
           var a = {
             configurable: !0,
             enumerable: !0,
@@ -185,25 +185,25 @@ function Jr() {
               value: pe
             }),
             groupCollapsed: Z({}, a, {
-              value: _t
+              value: $t
             }),
             groupEnd: Z({}, a, {
-              value: $t
+              value: _t
             })
           });
         }
         B < 0 && R("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
       }
     }
-    var Ke = w.ReactCurrentDispatcher, We;
+    var Ke = E.ReactCurrentDispatcher, We;
     function Re(a, m, b) {
       {
         if (We === void 0)
           try {
             throw Error();
           } catch (N) {
-            var $ = N.stack.trim().match(/\n( *(at )?)/);
-            We = $ && $[1] || "";
+            var _ = N.stack.trim().match(/\n( *(at )?)/);
+            We = _ && _[1] || "";
           }
         return `
 ` + We + a;
@@ -222,7 +222,7 @@ function Jr() {
         if (b !== void 0)
           return b;
       }
-      var $;
+      var _;
       Fe = !0;
       var N = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
@@ -241,14 +241,14 @@ function Jr() {
             try {
               Reflect.construct(T, []);
             } catch (X) {
-              $ = X;
+              _ = X;
             }
             Reflect.construct(a, [], T);
           } else {
             try {
               T.call();
             } catch (X) {
-              $ = X;
+              _ = X;
             }
             a.call(T.prototype);
           }
@@ -256,14 +256,14 @@ function Jr() {
           try {
             throw Error();
           } catch (X) {
-            $ = X;
+            _ = X;
           }
           a();
         }
       } catch (X) {
-        if (X && $ && typeof X.stack == "string") {
+        if (X && _ && typeof X.stack == "string") {
           for (var C = X.stack.split(`
-`), J = $.stack.split(`
+`), J = _.stack.split(`
 `), V = C.length - 1, K = J.length - 1; V >= 1 && K >= 0 && C[V] !== J[K]; )
             K--;
           for (; V >= 1 && K >= 0; V--, K--)
@@ -312,7 +312,7 @@ function Jr() {
           case h:
             return Te(a.type, m, b);
           case p: {
-            var $ = a, N = $._payload, k = $._init;
+            var _ = a, N = _._payload, k = _._init;
             try {
               return Te(k(N), m, b);
             } catch {
@@ -321,7 +321,7 @@ function Jr() {
         }
       return "";
     }
-    var ye = Object.prototype.hasOwnProperty, wt = {}, Ct = w.ReactDebugCurrentFrame;
+    var ye = Object.prototype.hasOwnProperty, wt = {}, Ct = E.ReactDebugCurrentFrame;
     function je(a) {
       if (a) {
         var m = a._owner, b = Te(a.type, a._source, m ? m.type : null);
@@ -329,7 +329,7 @@ function Jr() {
       } else
         Ct.setExtraStackFrame(null);
     }
-    function Gn(a, m, b, $, N) {
+    function Gn(a, m, b, _, N) {
       {
         var k = Function.call.bind(ye);
         for (var T in a)
@@ -337,14 +337,14 @@ function Jr() {
             var C = void 0;
             try {
               if (typeof a[T] != "function") {
-                var J = Error(($ || "React class") + ": " + b + " type `" + T + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof a[T] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
+                var J = Error((_ || "React class") + ": " + b + " type `" + T + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof a[T] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
                 throw J.name = "Invariant Violation", J;
               }
-              C = a[T](m, T, $, b, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+              C = a[T](m, T, _, b, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
             } catch (V) {
               C = V;
             }
-            C && !(C instanceof Error) && (je(N), R("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", $ || "React class", b, T, typeof C), je(null)), C instanceof Error && !(C.message in wt) && (wt[C.message] = !0, je(N), R("Failed %s type: %s", b, C.message), je(null));
+            C && !(C instanceof Error) && (je(N), R("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", _ || "React class", b, T, typeof C), je(null)), C instanceof Error && !(C.message in wt) && (wt[C.message] = !0, je(N), R("Failed %s type: %s", b, C.message), je(null));
           }
       }
     }
@@ -372,7 +372,7 @@ function Jr() {
       if (Yn(a))
         return R("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", zn(a)), Rt(a);
     }
-    var xe = w.ReactCurrentOwner, qn = {
+    var xe = E.ReactCurrentOwner, qn = {
       key: !0,
       ref: !0,
       __self: !0,
@@ -423,7 +423,7 @@ function Jr() {
         });
       }
     }
-    var tr = function(a, m, b, $, N, k, T) {
+    var tr = function(a, m, b, _, N, k, T) {
       var C = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: e,
@@ -444,7 +444,7 @@ function Jr() {
         configurable: !1,
         enumerable: !1,
         writable: !1,
-        value: $
+        value: _
       }), Object.defineProperty(C, "_source", {
         configurable: !1,
         enumerable: !1,
@@ -452,7 +452,7 @@ function Jr() {
         value: N
       }), Object.freeze && (Object.freeze(C.props), Object.freeze(C)), C;
     };
-    function nr(a, m, b, $, N) {
+    function nr(a, m, b, _, N) {
       {
         var k, T = {}, C = null, J = null;
         b !== void 0 && (Pt(b), C = "" + b), Xn(m) && (Pt(m.key), C = "" + m.key), Jn(m) && (J = m.ref, Zn(m, N));
@@ -467,10 +467,10 @@ function Jr() {
           var K = typeof a == "function" ? a.displayName || a.name || "Unknown" : a;
           C && Qn(T, K), J && er(T, K);
         }
-        return tr(a, C, J, N, $, xe.current, T);
+        return tr(a, C, J, N, _, xe.current, T);
       }
     }
-    var ze = w.ReactCurrentOwner, Nt = w.ReactDebugCurrentFrame;
+    var ze = E.ReactCurrentOwner, Nt = E.ReactDebugCurrentFrame;
     function he(a) {
       if (a) {
         var m = a._owner, b = Te(a.type, a._source, m ? m.type : null);
@@ -520,8 +520,8 @@ Check the top-level render call using <` + b + ">.");
         if (kt[b])
           return;
         kt[b] = !0;
-        var $ = "";
-        a && a._owner && a._owner !== ze.current && ($ = " It was passed a child from " + H(a._owner.type) + "."), he(a), R('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', b, $), he(null);
+        var _ = "";
+        a && a._owner && a._owner !== ze.current && (_ = " It was passed a child from " + H(a._owner.type) + "."), he(a), R('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', b, _), he(null);
       }
     }
     function Ot(a, m) {
@@ -530,13 +530,13 @@ Check the top-level render call using <` + b + ">.");
           return;
         if (Ge(a))
           for (var b = 0; b < a.length; b++) {
-            var $ = a[b];
-            qe($) && At($, m);
+            var _ = a[b];
+            qe(_) && At(_, m);
           }
         else if (qe(a))
           a._store && (a._store.validated = !0);
         else if (a) {
-          var N = _(a);
+          var N = $(a);
           if (typeof N == "function" && N !== a.entries)
             for (var k = N.call(a), T; !(T = k.next()).done; )
               qe(T.value) && At(T.value, m);
@@ -558,8 +558,8 @@ Check the top-level render call using <` + b + ">.");
         else
           return;
         if (b) {
-          var $ = H(m);
-          Gn(b, a.props, "prop", $, a);
+          var _ = H(m);
+          Gn(b, a.props, "prop", _, a);
         } else if (m.PropTypes !== void 0 && !Ye) {
           Ye = !0;
           var N = H(m);
@@ -571,9 +571,9 @@ Check the top-level render call using <` + b + ">.");
     function ar(a) {
       {
         for (var m = Object.keys(a.props), b = 0; b < m.length; b++) {
-          var $ = m[b];
-          if ($ !== "children" && $ !== "key") {
-            he(a), R("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", $), he(null);
+          var _ = m[b];
+          if (_ !== "children" && _ !== "key") {
+            he(a), R("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", _), he(null);
             break;
           }
         }
@@ -581,7 +581,7 @@ Check the top-level render call using <` + b + ">.");
       }
     }
     var It = {};
-    function Dt(a, m, b, $, N, k) {
+    function Dt(a, m, b, _, N, k) {
       {
         var T = te(a);
         if (!T) {
@@ -598,7 +598,7 @@ Check the top-level render call using <` + b + ">.");
         if (T) {
           var ee = m.children;
           if (ee !== void 0)
-            if ($)
+            if (_)
               if (Ge(ee)) {
                 for (var ve = 0; ve < ee.length; ve++)
                   Ot(ee[ve], a);
@@ -632,8 +632,8 @@ React keys must be passed directly to JSX without using spread:
       return Dt(a, m, b, !1);
     }
     var cr = sr, ur = lr;
-    $e.Fragment = r, $e.jsx = cr, $e.jsxs = ur;
-  }()), $e;
+    _e.Fragment = r, _e.jsx = cr, _e.jsxs = ur;
+  }()), _e;
 }
 process.env.NODE_ENV === "production" ? rt.exports = qr() : rt.exports = Jr();
 var s = rt.exports;
@@ -669,8 +669,8 @@ const Zr = ({ children: t }) => {
   "data-testid": h
 }) => {
   Xr(e);
-  const { className: p, theme: v } = ie(), [y, x] = D(!1), [_, w] = D(0), R = S(null), j = S(null), P = S(window.location.pathname), L = c && c.length > 0, M = () => {
-    x(!0), w(0), setTimeout(() => {
+  const { className: p, theme: v } = ie(), [y, x] = D(!1), [$, E] = D(0), R = S(null), j = S(null), P = S(window.location.pathname), L = c && c.length > 0, M = () => {
+    x(!0), E(0), setTimeout(() => {
       d == null || d(), x(!1);
     }, 300);
   }, G = L ? sn({
@@ -706,7 +706,7 @@ const Zr = ({ children: t }) => {
     j
   );
   F(() => {
-    e && R.current && w(R.current.scrollHeight);
+    e && R.current && E(R.current.scrollHeight);
   }, [e, R]), F(() => {
     const I = (H) => {
       H.key === "Escape" && M();
@@ -724,7 +724,7 @@ const Zr = ({ children: t }) => {
       {
         ...W,
         className: "proton-ActionMenu__background",
-        style: { opacity: _ > 0 ? 1 : 0 },
+        style: { opacity: $ > 0 ? 1 : 0 },
         onClick: M,
         id: t,
         children: /* @__PURE__ */ s.jsx(
@@ -741,22 +741,22 @@ const Zr = ({ children: t }) => {
       "div",
       {
         "data-testid": h || "ActionMenu-wrapper",
-        className: E(
+        className: w(
           "proton-ActionMenu__wrapper",
           te && "proton-ActionMenu__wrapper--scrollable"
         ),
         children: /* @__PURE__ */ s.jsx(
           "div",
           {
-            className: E("proton-ActionMenu__card", p),
+            className: w("proton-ActionMenu__card", p),
             "data-testid": "ActionMenu-content",
-            style: { height: `${_}px` },
+            style: { height: `${$}px` },
             children: /* @__PURE__ */ s.jsx("div", { ref: j, children: /* @__PURE__ */ s.jsx("div", { ...z, ref: R, children: ce ? /* @__PURE__ */ s.jsxs(pt, { autoFocus: !0, contain: !0, children: [
               i && /* @__PURE__ */ s.jsx("div", { className: "proton-ActionMenu__content", children: typeof i == "function" ? i({ close: M }) : i }),
               L && /* @__PURE__ */ s.jsx(
                 "div",
                 {
-                  className: E(
+                  className: w(
                     "proton-ActionMenu__list",
                     n === "none" && "proton-ActionMenu__list--disabled"
                   ),
@@ -902,7 +902,7 @@ const ua = {
       role: "status",
       "aria-live": "polite",
       "data-testid": n["data-testid"],
-      className: E(
+      className: w(
         "proton-Badge",
         t && `proton-Badge--${t}`,
         r
@@ -937,7 +937,7 @@ function vn({
     {
       ...d,
       ...u,
-      className: E(
+      className: w(
         "proton-Button",
         `proton-Button--${t}`,
         o && "proton-Button--disabled"
@@ -1019,7 +1019,7 @@ const mn = {
   {
     role: "status",
     "aria-live": "polite",
-    className: E(
+    className: w(
       "proton-Banner",
       `proton-Banner--${t}`,
       e && "proton-Banner--rounded"
@@ -1028,7 +1028,7 @@ const mn = {
     children: /* @__PURE__ */ s.jsxs(
       "div",
       {
-        className: E(
+        className: w(
           "proton-Banner__wrapper",
           r && "proton-Banner__wrapper--compact"
         ),
@@ -1045,7 +1045,7 @@ const mn = {
   return /* @__PURE__ */ s.jsx(
     "h3",
     {
-      className: E(
+      className: w(
         "proton-Banner",
         "proton-Banner__title",
         `proton-Banner--${n}__title`
@@ -1060,7 +1060,7 @@ const mn = {
   return /* @__PURE__ */ s.jsx(
     "p",
     {
-      className: E(
+      className: w(
         "proton-Banner",
         "proton-Banner__content",
         `proton-Banner--${n}__content`
@@ -1078,7 +1078,7 @@ const mn = {
     {
       "aria-hidden": "true",
       "data-testid": n["data-testid"],
-      className: E("proton-Banner__icon", `proton-Banner--${r}__icon`),
+      className: w("proton-Banner__icon", `proton-Banner--${r}__icon`),
       children: i
     }
   ) : null;
@@ -1116,7 +1116,7 @@ co.Option = function(e) {
   return /* @__PURE__ */ s.jsxs(
     "label",
     {
-      className: E(
+      className: w(
         "proton-ButtonGroup__option",
         l && "proton-ButtonGroup__option--selected"
       ),
@@ -1132,7 +1132,7 @@ co.Option = function(e) {
 function fa({ title: t, children: e, ...n }) {
   let r = S(null), { dialogProps: o, titleProps: i } = yr(n, r);
   const { className: l } = ie();
-  return /* @__PURE__ */ s.jsxs("div", { ...o, ref: r, className: E("proton-Dialog", l), children: [
+  return /* @__PURE__ */ s.jsxs("div", { ...o, ref: r, className: w("proton-Dialog", l), children: [
     t && /* @__PURE__ */ s.jsx("h3", { ...i, className: "proton-Dialog__header", children: t }),
     e
   ] });
@@ -1178,7 +1178,7 @@ const po = fe(
     autoComplete: v,
     "data-testid": y
   }, x) => {
-    const _ = S(null), { className: w, palette: R, theme: j } = ie(), P = x || _, { labelProps: L, inputProps: M, descriptionProps: G, errorMessageProps: z } = xr(
+    const $ = S(null), { className: E, palette: R, theme: j } = ie(), P = x || $, { labelProps: L, inputProps: M, descriptionProps: G, errorMessageProps: z } = xr(
       {
         label: c,
         name: u,
@@ -1195,7 +1195,7 @@ const po = fe(
         onChange: l
       },
       P
-    ), { clipboardProps: W } = _r({
+    ), { clipboardProps: W } = $r({
       getItems() {
         return [{ "text/plain": h }];
       }
@@ -1203,7 +1203,7 @@ const po = fe(
       "--input-background": (() => {
         switch (j) {
           case le.CUSTOM_DARK:
-            return de(R.PRIMARY.PRIMARY_SUPER_LIGHT, 0.6);
+            return de(R.PRIMARY.PRIMARY_LIGHTEST, 0.6);
           case le.DARK:
             return de(Q.GRAY_MEDIUM, 0.5);
           default:
@@ -1217,7 +1217,7 @@ const po = fe(
         t && /* @__PURE__ */ s.jsx(
           "div",
           {
-            className: E(
+            className: w(
               "proton-Input__descriptor",
               "proton-Input__prefix"
             ),
@@ -1234,11 +1234,11 @@ const po = fe(
             "aria-invalid": !!i,
             ref: P,
             style: te,
-            className: E(
+            className: w(
               "proton-Input",
               i && "proton-Input--error",
               c && !f && "proton-Input__label-top",
-              w
+              E
             )
           }
         ),
@@ -1246,7 +1246,7 @@ const po = fe(
           "label",
           {
             ...L,
-            className: E(
+            className: w(
               "proton-Input__label",
               f && "proton-Input__label--hide",
               h && "proton-Input__label--filled"
@@ -1257,7 +1257,7 @@ const po = fe(
         e && /* @__PURE__ */ s.jsx(
           "div",
           {
-            className: E(
+            className: w(
               "proton-Input__descriptor",
               "proton-Input__suffix"
             ),
@@ -1270,7 +1270,7 @@ const po = fe(
         {
           ...z,
           role: "alert",
-          className: E("proton-Input__error", "proton-Input__text"),
+          className: w("proton-Input__error", "proton-Input__text"),
           id: `${u}-error`,
           children: i
         }
@@ -1330,14 +1330,14 @@ const ha = ({
   const d = vo({
     defaultValue: i,
     value: l,
-    onChange: (w) => u == null ? void 0 : u(w),
+    onChange: (E) => u == null ? void 0 : u(E),
     onClear: () => f == null ? void 0 : f(),
     label: e
-  }), h = S(null), { inputProps: p, clearButtonProps: v } = $r(
+  }), h = S(null), { inputProps: p, clearButtonProps: v } = _r(
     { ...d, placeholder: e },
     d,
     h
-  ), { value: y, setValue: x } = d, _ = () => {
+  ), { value: y, setValue: x } = d, $ = () => {
     f && f(), u == null || u(""), x("");
   };
   return /* @__PURE__ */ s.jsx(
@@ -1351,7 +1351,7 @@ const ha = ({
         {
           ...p,
           type: "search",
-          onChange: (w) => d.setValue(w),
+          onChange: (E) => d.setValue(E),
           value: y,
           name: t,
           placeholder: e,
@@ -1366,8 +1366,8 @@ const ha = ({
               height: "1.6em",
               viewBox: "0 0 24 24",
               onClick: () => {
-                var w;
-                return (w = h.current) == null ? void 0 : w.focus();
+                var E;
+                return (E = h.current) == null ? void 0 : E.focus();
               },
               children: [
                 /* @__PURE__ */ s.jsx("title", { children: "Magnifying Glass" }),
@@ -1386,7 +1386,7 @@ const ha = ({
             {
               "aria-label": v["aria-label"],
               type: "button",
-              className: E(
+              className: w(
                 "proton-SearchInput__button",
                 "proton-Input__descriptor",
                 "proton-Input__suffix",
@@ -1394,8 +1394,8 @@ const ha = ({
               ),
               "data-testid": `${c}-clear`,
               onClick: () => {
-                var w;
-                _(), (w = h.current) == null || w.focus();
+                var E;
+                $(), (E = h.current) == null || E.focus();
               },
               children: /* @__PURE__ */ s.jsxs(
                 "svg",
@@ -1461,7 +1461,7 @@ function mt({
       {
         ...f,
         ref: l,
-        className: E("proton-Popover", c),
+        className: w("proton-Popover", c),
         style: { ...u, ...f.style },
         "data-testid": o["data-testid"] || void 0,
         children: [
@@ -1810,13 +1810,13 @@ function xo(t = !1) {
   }
   return n.current;
 }
-function _o(t) {
+function $o(t) {
   let e = A(xn);
   e === Oe && !yo && console.warn("When server rendering, you must wrap your application in an <SSRProvider> to ensure consistent ids are generated between the client and server.");
   let n = xo(!!t), r = e === Oe && process.env.NODE_ENV === "test" ? "react-aria" : `react-aria${e.prefix}`;
   return t || `${r}-${n}`;
 }
-function $o(t) {
+function _o(t) {
   let e = g.useId(), [n] = D(Be()), r = n || process.env.NODE_ENV === "test" ? "react-aria" : `react-aria${Oe.prefix}`;
   return t || `${r}-${e}`;
 }
@@ -1891,20 +1891,20 @@ const No = (t) => {
   var e;
   return (e = t == null ? void 0 : t.ownerDocument) !== null && e !== void 0 ? e : document;
 };
-function _n(t) {
+function $n(t) {
   var e, n, r = "";
   if (typeof t == "string" || typeof t == "number") r += t;
   else if (typeof t == "object") if (Array.isArray(t)) {
     var o = t.length;
-    for (e = 0; e < o; e++) t[e] && (n = _n(t[e])) && (r && (r += " "), r += n);
+    for (e = 0; e < o; e++) t[e] && (n = $n(t[e])) && (r && (r += " "), r += n);
   } else for (n in t) t[n] && (r && (r += " "), r += n);
   return r;
 }
 function Mo() {
-  for (var t, e, n = 0, r = "", o = arguments.length; n < o; n++) (t = arguments[n]) && (e = _n(t)) && (r && (r += " "), r += e);
+  for (var t, e, n = 0, r = "", o = arguments.length; n < o; n++) (t = arguments[n]) && (e = $n(t)) && (r && (r += " "), r += e);
   return r;
 }
-function $n(...t) {
+function _n(...t) {
   let e = {
     ...t[0]
   };
@@ -2015,12 +2015,12 @@ function Ho() {
   }
   var n = typeof Object.is == "function" ? Object.is : e, r = t.useState, o = t.useEffect, i = t.useLayoutEffect, l = t.useDebugValue;
   function c(h, p) {
-    var v = p(), y = r({ inst: { value: v, getSnapshot: p } }), x = y[0].inst, _ = y[1];
+    var v = p(), y = r({ inst: { value: v, getSnapshot: p } }), x = y[0].inst, $ = y[1];
     return i(function() {
-      x.value = v, x.getSnapshot = p, u(x) && _({ inst: x });
+      x.value = v, x.getSnapshot = p, u(x) && $({ inst: x });
     }, [h, v, p]), o(function() {
-      return u(x) && _({ inst: x }), h(function() {
-        u(x) && _({ inst: x });
+      return u(x) && $({ inst: x }), h(function() {
+        u(x) && $({ inst: x });
       });
     }, [h]), l(v), v;
   }
@@ -2117,7 +2117,7 @@ function Ko() {
     function y(j, P, L) {
       return P();
     }
-    var x = typeof window < "u" && typeof window.document < "u" && typeof window.document.createElement < "u", _ = !x, w = _ ? y : p, R = t.useSyncExternalStore !== void 0 ? t.useSyncExternalStore : w;
+    var x = typeof window < "u" && typeof window.document < "u" && typeof window.document.createElement < "u", $ = !x, E = $ ? y : p, R = t.useSyncExternalStore !== void 0 ? t.useSyncExternalStore : E;
     tt.useSyncExternalStore = R, typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error());
   }()), tt;
 }
@@ -2332,7 +2332,7 @@ function Ce(t, e, n) {
   let r = wn(n, t.slot) || {}, { ref: o, ...i } = r, l = Ve(oe(() => ko(e, o), [
     e,
     o
-  ])), c = $n(i, t);
+  ])), c = _n(i, t);
   return "style" in i && i.style && "style" in t && t.style && (typeof i.style == "function" || typeof t.style == "function" ? c.style = (u) => {
     let f = typeof i.style == "function" ? i.style(u) : i.style, d = {
       ...u.defaultStyle,
@@ -2469,12 +2469,12 @@ function ui(t, e) {
     defaultClassName: "react-aria-Button"
   }), v = Lt(o.id), y = Lt(), x = o["aria-labelledby"];
   r && (x ? x = `${x} ${y}` : o["aria-label"] && (x = `${v} ${y}`));
-  let _ = S(r);
+  let $ = S(r);
   return F(() => {
-    let w = {
+    let E = {
       "aria-labelledby": x || v
     };
-    (!_.current && c && r || _.current && c && !r) && qt(w, "assertive"), _.current = r;
+    (!$.current && c && r || $.current && c && !r) && qt(E, "assertive"), $.current = r;
   }, [
     r,
     c,
@@ -2514,7 +2514,7 @@ lt.displayName = "PressResponderContext";
 const pi = /* @__PURE__ */ g.forwardRef(({ children: t, ...e }, n) => {
   let r = S(!1), o = A(lt);
   n = Ve(n || (o == null ? void 0 : o.ref));
-  let i = $n(o || {}, {
+  let i = _n(o || {}, {
     ...e,
     ref: n,
     register() {
@@ -2658,10 +2658,10 @@ function gi(t, e) {
   }, n);
 }
 let yi = /* @__PURE__ */ g.forwardRef(gi);
-const xi = /* @__PURE__ */ O({}), _i = /* @__PURE__ */ O({}), Tn = /* @__PURE__ */ O({
+const xi = /* @__PURE__ */ O({}), $i = /* @__PURE__ */ O({}), Tn = /* @__PURE__ */ O({
   placement: "bottom"
 });
-function $i(t, e) {
+function _i(t, e) {
   [t, e] = Ce(t, e, Tn);
   let n = t.placement, r = {
     position: "absolute",
@@ -2685,7 +2685,7 @@ function $i(t, e) {
     "data-placement": n
   });
 }
-const Si = /* @__PURE__ */ fe($i), ct = /* @__PURE__ */ O(null), Ei = /* @__PURE__ */ O(null), wi = /* @__PURE__ */ O({});
+const Si = /* @__PURE__ */ fe(_i), ct = /* @__PURE__ */ O(null), Ei = /* @__PURE__ */ O(null), wi = /* @__PURE__ */ O({});
 function jn(t) {
   return null;
 }
@@ -2790,8 +2790,8 @@ function Ti({ props: t, collection: e, menuRef: n }) {
   }, r, n), f = A(Mn), d = A(ct), h = (d == null ? void 0 : d.trigger) === "SubmenuTrigger";
   mi({
     ref: n,
-    onInteractOutside: (_) => {
-      f && !(o != null && o.contains(_.target)) && f.close();
+    onInteractOutside: ($) => {
+      f && !(o != null && o.contains($.target)) && f.close();
     },
     isDisabled: h || (f == null ? void 0 : f.expandedKeysStack.length) === 0
   });
@@ -2801,9 +2801,9 @@ function Ti({ props: t, collection: e, menuRef: n }) {
   F(() => {
     if (o && p.current !== o && v.left === 0) {
       p.current = o;
-      let { left: _ } = o.getBoundingClientRect();
+      let { left: $ } = o.getBoundingClientRect();
       y({
-        left: -1 * _
+        left: -1 * $
       });
     }
   }, [
@@ -2830,7 +2830,7 @@ function Ti({ props: t, collection: e, menuRef: n }) {
         r
       ],
       [
-        _i,
+        $i,
         {
           elementType: "div"
         }
@@ -2908,16 +2908,16 @@ const ut = /* @__PURE__ */ O(null), Mi = /* @__PURE__ */ Jo("item", function(e,
     ...e,
     id: i,
     key: r.key
-  }, l, c), { isFocusVisible: v, focusProps: y } = we(), { hoverProps: x, isHovered: _ } = vi({
+  }, l, c), { isFocusVisible: v, focusProps: y } = we(), { hoverProps: x, isHovered: $ } = vi({
     isDisabled: p.isDisabled
-  }), w = ge({
+  }), E = ge({
     ...e,
     id: void 0,
     children: r.rendered,
     defaultClassName: "react-aria-MenuItem",
     values: {
       ...p,
-      isHovered: _,
+      isHovered: $,
       isFocusVisible: v,
       selectionMode: l.selectionManager.selectionMode,
       selectionBehavior: l.selectionManager.selectionBehavior,
@@ -2927,10 +2927,10 @@ const ut = /* @__PURE__ */ O(null), Mi = /* @__PURE__ */ Jo("item", function(e,
   }), R = e.href ? "a" : "div";
   return /* @__PURE__ */ g.createElement(R, {
     ...me(u, y, x),
-    ...w,
+    ...E,
     ref: c,
     "data-disabled": p.isDisabled || void 0,
-    "data-hovered": _ || void 0,
+    "data-hovered": $ || void 0,
     "data-focused": p.isFocused || void 0,
     "data-focus-visible": v || void 0,
     "data-pressed": p.isPressed || void 0,
@@ -2954,7 +2954,7 @@ const ut = /* @__PURE__ */ O(null), Mi = /* @__PURE__ */ Jo("item", function(e,
         h
       ]
     ]
-  }, w.children));
+  }, E.children));
 });
 function kn(t) {
   return null;
@@ -3238,13 +3238,13 @@ function xa({
     {
       ...v,
       ref: p,
-      onPress: () => h((_) => !_),
+      onPress: () => h(($) => !$),
       isDisabled: o,
       className: `proton-ResponsiveMenuTrigger__button ${u}`,
       children: /* @__PURE__ */ s.jsx(Bi, { size: n })
     }
   ), x = t ? t(
-    { ...v, onClick: () => h((_) => !_) },
+    { ...v, onClick: () => h(($) => !$) },
     d
   ) : y;
   return F(() => () => {
@@ -3285,22 +3285,22 @@ function xa({
             id: e,
             autoFocus: !0,
             "data-testid": c,
-            children: r.map((_) => /* @__PURE__ */ s.jsx(
+            children: r.map(($) => /* @__PURE__ */ s.jsx(
               Mi,
               {
-                href: _.to,
+                href: $.to,
                 target: "_blank",
                 rel: "noopener noreferrer",
                 onAction: () => {
-                  var w;
-                  (w = _.onAction) == null || w.call(_, _.key), setTimeout(() => {
+                  var E;
+                  (E = $.onAction) == null || E.call($, $.key), setTimeout(() => {
                     h(!1);
                   }, 200);
                 },
                 className: "proton-ListBox__item proton-ResponsiveMenuTrigger__menu-item",
-                children: _.label
+                children: $.label
               },
-              _.key
+              $.key
             ))
           }
         )
@@ -3331,7 +3331,7 @@ function Vi({ item: t, state: e }) {
     "li",
     {
       ...r,
-      className: E(
+      className: w(
         "proton-ListBox__item",
         i && "proton-ListBox__item--focused",
         o && "proton-ListBox__item--selected",
@@ -3356,7 +3356,7 @@ const Bn = fe(
       {
         ...n,
         ref: e,
-        className: E(
+        className: w(
           "proton-Select__trigger",
           t.disabled && "proton-Select__trigger--disabled",
           !t.isOpen && "proton-Select__trigger--closed",
@@ -3392,7 +3392,7 @@ function Hi({
     onOpenChange: (j) => {
       j ? l == null || l() : c == null || c();
     }
-  }, p = un(h), v = S(null), y = S(null), { labelProps: x, triggerProps: _, valueProps: w, menuProps: R } = an(
+  }, p = un(h), v = S(null), y = S(null), { labelProps: x, triggerProps: $, valueProps: E, menuProps: R } = an(
     { ...h, label: t || e },
     p,
     v
@@ -3432,17 +3432,17 @@ function Hi({
         /* @__PURE__ */ s.jsxs(
           Bn,
           {
-            ..._,
+            ...$,
             isOpen: p.isOpen,
             ref: v,
             disabled: n,
             "data-testid": f,
             children: [
-              /* @__PURE__ */ s.jsx("div", { ...w, className: "proton-Select__value", children: p.selectedItem ? p.selectedItem.rendered : "Select an option" }),
+              /* @__PURE__ */ s.jsx("div", { ...E, className: "proton-Select__value", children: p.selectedItem ? p.selectedItem.rendered : "Select an option" }),
               /* @__PURE__ */ s.jsx(
                 "div",
                 {
-                  className: E(
+                  className: w(
                     "proton-Select__trigger_icon",
                     p.isOpen && "proton-Select__trigger_icon--flipped"
                   ),
@@ -3477,7 +3477,7 @@ function Hi({
     }
   );
 }
-const _a = {
+const $a = {
   Menu: Hi,
   Option: ht
 };
@@ -3506,7 +3506,7 @@ function Ki({
     items: u,
     "data-testid": f,
     children: d
-  }, p = un(h), v = Ln(fn.MEDIUM), y = S(null), x = S(null), { labelProps: _, triggerProps: w, valueProps: R, menuProps: j } = an(
+  }, p = un(h), v = Ln(fn.MEDIUM), y = S(null), x = S(null), { labelProps: $, triggerProps: E, valueProps: R, menuProps: j } = an(
     { ...h, label: t || e },
     p,
     y
@@ -3523,14 +3523,14 @@ function Ki({
         t ? /* @__PURE__ */ s.jsx(
           "div",
           {
-            ..._,
+            ...$,
             className: "proton-Select__label",
             "data-testid": "select-label",
             children: t
           }
         ) : (
           // If no label is provided, render an invisible label for a11y
-          /* @__PURE__ */ s.jsx("div", { ..._ })
+          /* @__PURE__ */ s.jsx("div", { ...$ })
         ),
         /* @__PURE__ */ s.jsx(
           ln,
@@ -3546,7 +3546,7 @@ function Ki({
         /* @__PURE__ */ s.jsxs(
           Bn,
           {
-            ...w,
+            ...E,
             isOpen: p.isOpen,
             ref: y,
             disabled: n,
@@ -3556,7 +3556,7 @@ function Ki({
               /* @__PURE__ */ s.jsx(
                 "div",
                 {
-                  className: E(
+                  className: w(
                     "proton-Select__trigger_icon",
                     p.isOpen && "proton-Select__trigger_icon--flipped"
                   ),
@@ -3591,7 +3591,7 @@ function Ki({
     }
   );
 }
-const $a = {
+const _a = {
   Menu: Ki,
   Option: ht
 };
@@ -3604,7 +3604,7 @@ function Sa(t) {
   return /* @__PURE__ */ s.jsxs(
     "label",
     {
-      className: E(
+      className: w(
         "proton-Switch",
         t.isDisabled && "proton-Switch--disabled",
         r.isSelected && "proton-Switch--on"
@@ -3626,7 +3626,7 @@ function Sa(t) {
 }
 function Wi({ item: t, state: e, children: n }) {
   let r = S(), { rowProps: o } = Dr({ node: t }, e, r);
-  return /* @__PURE__ */ s.jsx("tr", { className: E("proton-Table__headerRow"), ...o, ref: r, children: n });
+  return /* @__PURE__ */ s.jsx("tr", { className: w("proton-Table__headerRow"), ...o, ref: r, children: n });
 }
 function Fi({ column: t, state: e }) {
   var u, f;
@@ -3642,7 +3642,7 @@ function Fi({ column: t, state: e }) {
     {
       ...me(r, l),
       colSpan: t.colspan,
-      className: E(
+      className: w(
         "proton-Table__header",
         `proton-Table__header--${o}`,
         i ? "proton-Table__header--focused" : null
@@ -3654,7 +3654,7 @@ function Fi({ column: t, state: e }) {
           "span",
           {
             "aria-hidden": "true",
-            className: E("proton-Table__headerSortIcon"),
+            className: w("proton-Table__headerSortIcon"),
             style: {
               visibility: ((f = e.sortDescriptor) == null ? void 0 : f.column) === t.key ? "visible" : "hidden"
             },
@@ -3671,7 +3671,7 @@ function Xt({ type: t, children: e }) {
     t,
     {
       ...n,
-      className: E(
+      className: w(
         "proton-Table__rowGroup",
         t === "thead" ? "proton-Table__rowGroup--header" : "proton-Table__rowGroup--body"
       ),
@@ -3690,7 +3690,7 @@ function Gi({ item: t, children: e, state: n }) {
   return /* @__PURE__ */ s.jsx(
     "tr",
     {
-      className: E(
+      className: w(
         "proton-Table__row",
         o ? "proton-Table__row--selected" : null,
         l ? "proton-Table__row--pressed" : null,
@@ -3709,7 +3709,7 @@ function Ui({ cell: t, state: e, ...n }) {
     "td",
     {
       ...me(o, l),
-      className: E(
+      className: w(
         "proton-Table__cell",
         i ? "proton-Table__cell--focused" : null,
         `proton-Table__cell--${c}`
@@ -3728,7 +3728,7 @@ function Ca(t) {
     e,
     n
   );
-  return /* @__PURE__ */ s.jsxs("table", { ...o, ref: n, className: E("proton-Table"), children: [
+  return /* @__PURE__ */ s.jsxs("table", { ...o, ref: n, className: w("proton-Table"), children: [
     /* @__PURE__ */ s.jsx(Xt, { type: "thead", children: r.headerRows.map((i) => /* @__PURE__ */ s.jsx(Wi, { item: i, state: e, children: Array.from(r.getChildren(i.key)).map((l) => /* @__PURE__ */ s.jsx(
       Fi,
       {
@@ -3746,10 +3746,10 @@ function zi({ children: t, arrow: e, ...n }) {
     Di,
     {
       ...n,
-      className: E("proton__Tooltip", "proton-Dialog", r),
+      className: `proton__Tooltip proton-Dialog ${r}`,
       style: o,
       children: [
-        e && /* @__PURE__ */ s.jsx(Si, { className: E("proton__TooltipArrow", r), children: /* @__PURE__ */ s.jsx("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ s.jsx("path", { d: "M0 0 L4 4 L8 0" }) }) }),
+        e && /* @__PURE__ */ s.jsx(Si, { className: `proton__TooltipArrow ${r}`, children: /* @__PURE__ */ s.jsx("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ s.jsx("path", { d: "M0 0 L4 4 L8 0" }) }) }),
         t
       ]
     }
@@ -3769,7 +3769,7 @@ function Yi({
   ...u
 }) {
   const [f, d] = D(!1), h = S(!1), p = S(!1);
-  return /* @__PURE__ */ s.jsxs(
+  return console.log(u), /* @__PURE__ */ s.jsxs(
     Oi,
     {
       delay: e,
@@ -3811,7 +3811,7 @@ const Ra = ({
     return /* @__PURE__ */ s.jsx(
       "span",
       {
-        className: E(
+        className: w(
           "proton-TextEmphasis",
           n && "proton-TextEmphasis--tooltip",
           o
@@ -3834,7 +3834,7 @@ const Ra = ({
   return /* @__PURE__ */ s.jsx(
     "span",
     {
-      className: E(
+      className: w(
         "proton-TextEmphasis",
         n && "proton-TextEmphasis--tooltip",
         o
@@ -3860,7 +3860,7 @@ function qi({
   return /* @__PURE__ */ s.jsxs(
     "div",
     {
-      className: E("proton-Waveform__bar-wrapper"),
+      className: w("proton-Waveform__bar-wrapper"),
       style: {
         width: `${l}px`,
         marginRight: `${c}px`
@@ -3869,7 +3869,7 @@ function qi({
         /* @__PURE__ */ s.jsx(
           "div",
           {
-            className: E(
+            className: w(
               "proton-Waveform__bar",
               "proton-Waveform__bar--upper",
               e && "proton-Waveform__bar--disabled",
@@ -3886,7 +3886,7 @@ function qi({
         /* @__PURE__ */ s.jsx(
           "div",
           {
-            className: E(
+            className: w(
               "proton-Waveform__bar",
               "proton-Waveform__bar--lower",
               e && "proton-Waveform__bar--disabled",
@@ -3927,7 +3927,7 @@ function Pa({
   "data-testid": f
 }) {
   var Z;
-  const { className: d, palette: h, theme: p } = ie(), v = S(null), [y, x] = D([]), [_, w] = D(null), [R, j] = D(!1), [P, L] = D(!1), M = t || Ji, G = u || (p === "custom-dark" ? h.BRAND.PRIMARY : void 0), z = e;
+  const { className: d, palette: h, theme: p } = ie(), v = S(null), [y, x] = D([]), [$, E] = D(null), [R, j] = D(!1), [P, L] = D(!1), M = t || Ji, G = u || (p === "custom-dark" ? h.BRAND.PRIMARY : void 0), z = e;
   F(() => {
     if (!v.current) return;
     const B = (q) => {
@@ -3948,15 +3948,15 @@ function Pa({
   const W = (B) => {
     if (!v.current) return;
     const U = v.current.getBoundingClientRect(), q = (B.clientX - U.left) / U.width * l;
-    w(q);
+    E(q);
   }, te = () => {
-    w(null);
+    E(null);
   }, ce = e + z, I = (B, U) => {
     var ae;
     const Y = B / l * 100;
     return (U === "start" ? Math.floor(Y / 100 * y.length) : Math.ceil(Y / 100 * y.length)) * ce / ((ae = v.current) == null ? void 0 : ae.clientWidth) * 100;
   }, H = (Z = v.current) == null ? void 0 : Z.clientWidth;
-  return /* @__PURE__ */ s.jsxs("div", { className: E("proton-Waveform", d), "data-testid": f, children: [
+  return /* @__PURE__ */ s.jsxs("div", { className: w("proton-Waveform", d), "data-testid": f, children: [
     i && /* @__PURE__ */ s.jsx(
       Zt,
       {
@@ -3988,17 +3988,17 @@ function Pa({
               }
             }
           ),
-          _ !== null && /* @__PURE__ */ s.jsx(
+          $ !== null && /* @__PURE__ */ s.jsx(
             "div",
             {
               className: "proton-Waveform__hover-line",
               style: {
-                left: `${_ / l * 100}%`
+                left: `${$ / l * 100}%`
               }
             }
           ),
           y.map((B, U) => {
-            const Y = U / y.length * l, q = n !== void 0 && r !== void 0 && (Y < n || Y > r), ae = o === 0 ? !1 : Y <= o, pe = _ !== null && Y <= _;
+            const Y = U / y.length * l, q = n !== void 0 && r !== void 0 && (Y < n || Y > r), ae = o === 0 ? !1 : Y <= o, pe = $ !== null && Y <= $;
             return /* @__PURE__ */ s.jsx(
               qi,
               {
@@ -4047,7 +4047,7 @@ function Zt({
   return /* @__PURE__ */ s.jsx(
     "div",
     {
-      className: E(
+      className: w(
         "proton-Waveform__timestamp",
         `proton-Waveform__timestamp--${t}`
       ),
@@ -4095,11 +4095,11 @@ export {
   po as Input,
   mt as Popover,
   xa as ResponsiveMenuTrigger,
-  $a as ResponsiveSelect,
+  _a as ResponsiveSelect,
   ya as Row,
   ha as SearchInput,
   ma as Section,
-  _a as Select,
+  $a as Select,
   Sa as Switch,
   le as THEMES,
   Ca as Table,