@kosdev-code/base-ui-components 0.1.0-dev.5699 → 0.1.0-dev.5706

package/index.js

@@ -3,9 +3,9 @@ var $a = (e, t, o) => t in e ? ka(e, t, { enumerable: !0, configurable: !0, writ
 var M = (e, t, o) => ($a(e, typeof t != "symbol" ? t + "" : t, o), o);
 import { jsx as c, jsxs as $, Fragment as pe } from "@emotion/react/jsx-runtime";
 import * as Eo from "react";
-import T, { forwardRef as ue, createContext as ve, useContext as be, useMemo as j, memo as F, useReducer as Ca, useState as W, useRef as V, useLayoutEffect as Ie, useEffect as U, useCallback as I, cloneElement as Ut, isValidElement as Ct, useId as _e, Children as Xn, Suspense as Hr, Fragment as Ur } from "react";
+import T, { forwardRef as ue, createContext as ve, useContext as be, useMemo as V, memo as A, useReducer as Ca, useState as W, useRef as H, useLayoutEffect as Ie, useEffect as U, useCallback as I, cloneElement as Ut, isValidElement as Ct, useId as _e, Children as Xn, Suspense as Hr, Fragment as Ur } from "react";
 import g from "@emotion/styled";
-import { css as K, ClassNames as Q, keyframes as St, createElement as Sa } from "@emotion/react";
+import { css as q, ClassNames as Q, keyframes as St, createElement as Sa } from "@emotion/react";
 import { flushSync as Gr } from "react-dom";
 import { useMergeRefs as Gt, useFloating as go, useClick as Fo, useDismiss as fo, useInteractions as mo, useTransitionStatus as Ia, FloatingPortal as Yt, FloatingFocusManager as Ao, FloatingOverlay as Yr, flip as Bo, size as _a, autoUpdate as Lo, useListNavigation as za, useRole as Wo, FloatingList as Da, useListItem as Ta, offset as Kr, shift as qr, arrow as Ea, useHover as Ma, useFocus as Oa, FloatingArrow as Na } from "@floating-ui/react";
 import { useDrag as Ra } from "@use-gesture/react";
@@ -46,7 +46,7 @@ const bl = (e) => {
   return Array.isArray(n) || (n = [n]), xl(
     n.map((r) => vl(r) ? wl(r, t, o) : r)
   );
-}, qt = (e, t) => t ? e : `var(${e})`, B = (e, t) => qt(`--studio-g-${e}`, t), l = (e, t) => qt(`--studio-s-${e}`, t), $l = {
+}, qt = (e, t) => t ? e : `var(${e})`, L = (e, t) => qt(`--studio-g-${e}`, t), l = (e, t) => qt(`--studio-s-${e}`, t), $l = {
   "actionable-blurb": {
     "row-gap": l("spacing-4"),
     "icon-column-width": l("spacing-20")
@@ -984,75 +984,75 @@ const bl = (e) => {
   // TODO: Talk to bndigital about a more semantic naming
   // convention for these tokens.
   color: {
-    white: B("color-grey0"),
-    grey10: B("color-grey10"),
-    grey15: B("color-grey15"),
-    grey20: B("color-grey20"),
-    grey30: B("color-grey30"),
-    grey40: B("color-grey40"),
-    grey50: B("color-grey50"),
-    grey60: B("color-grey60"),
-    grey65: B("color-grey65"),
-    grey70: B("color-grey70"),
-    grey80: B("color-grey80"),
-    black: B("color-grey100"),
-    primary: B("color-blue30"),
-    primaryLight: B("color-blue0"),
-    additional1: B("color-blue20"),
-    additional2: B("color-blue40"),
-    additional3: B("color-blue10"),
-    green: B("color-green0"),
-    orange: B("color-orange0"),
-    red: B("color-red0"),
-    purple: B("color-purple0"),
-    blue: B("color-blue30"),
-    yellow: B("color-yellow0")
+    white: L("color-grey0"),
+    grey10: L("color-grey10"),
+    grey15: L("color-grey15"),
+    grey20: L("color-grey20"),
+    grey30: L("color-grey30"),
+    grey40: L("color-grey40"),
+    grey50: L("color-grey50"),
+    grey60: L("color-grey60"),
+    grey65: L("color-grey65"),
+    grey70: L("color-grey70"),
+    grey80: L("color-grey80"),
+    black: L("color-grey100"),
+    primary: L("color-blue30"),
+    primaryLight: L("color-blue0"),
+    additional1: L("color-blue20"),
+    additional2: L("color-blue40"),
+    additional3: L("color-blue10"),
+    green: L("color-green0"),
+    orange: L("color-orange0"),
+    red: L("color-red0"),
+    purple: L("color-purple0"),
+    blue: L("color-blue30"),
+    yellow: L("color-yellow0")
   }
 }, kc = {
   "font-size": {
-    sm: B("font-size-10px"),
-    med: B("font-size-12px"),
-    lrg: B("font-size-14px"),
-    xlrg: B("font-size-16px")
+    sm: L("font-size-10px"),
+    med: L("font-size-12px"),
+    lrg: L("font-size-14px"),
+    xlrg: L("font-size-16px")
   },
   "font-weight": {
-    normal: B("font-weight-400"),
-    bold: B("font-weight-700")
+    normal: L("font-weight-400"),
+    bold: L("font-weight-700")
   },
   "font-family": {
-    default: B("font-family-Arial")
+    default: L("font-family-Arial")
   },
   "line-height": {
-    default: B("line-height-120")
+    default: L("line-height-120")
   }
 }, $c = {
   spacing: {
-    2: B("spacing-2px"),
-    4: B("spacing-4px"),
-    6: B("spacing-6px"),
-    7: B("spacing-7px"),
-    8: B("spacing-8px"),
-    10: B("spacing-10px"),
-    12: B("spacing-12px"),
-    14: B("spacing-14px"),
-    16: B("spacing-16px"),
-    18: B("spacing-18px"),
-    20: B("spacing-20px"),
-    22: B("spacing-22px"),
-    24: B("spacing-24px"),
-    26: B("spacing-26px"),
-    28: B("spacing-28px"),
-    30: B("spacing-30px"),
-    32: B("spacing-32px"),
-    34: B("spacing-34px"),
-    36: B("spacing-36px"),
-    40: B("spacing-40px")
+    2: L("spacing-2px"),
+    4: L("spacing-4px"),
+    6: L("spacing-6px"),
+    7: L("spacing-7px"),
+    8: L("spacing-8px"),
+    10: L("spacing-10px"),
+    12: L("spacing-12px"),
+    14: L("spacing-14px"),
+    16: L("spacing-16px"),
+    18: L("spacing-18px"),
+    20: L("spacing-20px"),
+    22: L("spacing-22px"),
+    24: L("spacing-24px"),
+    26: L("spacing-26px"),
+    28: L("spacing-28px"),
+    30: L("spacing-30px"),
+    32: L("spacing-32px"),
+    34: L("spacing-34px"),
+    36: L("spacing-36px"),
+    40: L("spacing-40px")
   },
   border: {
-    xsm: B("spacing-0-5px"),
-    sm: B("spacing-1px"),
-    med: B("spacing-2px"),
-    lrg: B("spacing-3px")
+    xsm: L("spacing-0-5px"),
+    sm: L("spacing-1px"),
+    med: L("spacing-2px"),
+    lrg: L("spacing-3px")
   }
 }, Cc = {
   ...wc,
@@ -1068,7 +1068,7 @@ const bl = (e) => {
     a.map(
       (s) => (d, u) => qt(`--${o}-${String(s)}-${d}`, u)
     )
-  ), i = K`
+  ), i = q`
     ${n} {
       ${ii(e, o).join(`;
       `)};
@@ -1080,7 +1080,7 @@ const bl = (e) => {
   };
 }, Xv = (e, t = "studio-c") => (o, n) => qt(`--${t}-${e}-${o}`, n), Jv = (e, t = {}) => {
   const { prefix: o = "studio-c" } = t;
-  return K`
+  return q`
     ${ii(e, o).join(`;
     `)};
   `;
@@ -1093,26 +1093,26 @@ const bl = (e) => {
   (o) => Object.keys(e[o]).map(
     (n) => `${t(`${o}-${n}`, !0)}: ${e[o][n]}`
   )
-), Qv = K`
+), Qv = q`
   :root {
     ${Dn(Cc, l)}
   }
-`, ex = K`
+`, ex = q`
   :root {
     .rdp-root {
       --rdp-accent-color: ${l("color-primary")};
     }
 
-    ${Dn(xc, B)}
+    ${Dn(xc, L)}
   }
-`, tx = K`
+`, tx = q`
   :root {
     ${Dn(
   mc,
   (e, t) => qt(`--studio-c-${e}`, t)
 )}
   }
-`, Sc = K`
+`, Sc = q`
   :root {
     // viewable list item
     --studio-component-viewable-list-item-padding-inline: var(
@@ -1137,7 +1137,7 @@ const bl = (e) => {
       --studio-generic-padding-x-small
     );
   }
-`, Ic = K`
+`, Ic = q`
   :root {
     // button
     --studio-component-button-background-color-active: var(
@@ -1203,7 +1203,7 @@ const bl = (e) => {
     --studio-component-button-gap: var(--studio-semantic-control-gap);
     --studio-component-button-padding: 10px 40px;
   }
-`, _c = K`
+`, _c = q`
   :root {
     // list item
     --studio-component-list-item-border-color-selected: var(
@@ -1236,14 +1236,14 @@ const bl = (e) => {
       --studio-semantic-component-list-padding-inline
     );
   }
-`, zc = K`
+`, zc = q`
   :root {
     //list
     --studio-component-list-border-color-default: var(
       --studio-generic-color-grey-20
     );
   }
-`, Dc = K`
+`, Dc = q`
   :root {
   }
 `, Jn = [
@@ -1252,7 +1252,7 @@ const bl = (e) => {
   Ic,
   _c,
   zc
-], Qn = K`
+], Qn = q`
   :root {
     /* radius */
     --studio-generic-border-radius-small: 4px;
@@ -1351,7 +1351,7 @@ const bl = (e) => {
     --studio-generic-center-text-align: center;
     // --studio-generic-center-text-align: var(--studio-generic-color-white, #f0f0f0);
   }
-`, er = K`
+`, er = q`
   :root {
     // colour
     --studio-semantic-color-system-green: var(--studio-generic-color-green-100);
@@ -1605,7 +1605,7 @@ const bl = (e) => {
       )
       var(--studio-generic-padding-small);
   }
-`, tr = K`
+`, tr = q`
   ::-webkit-scrollbar {
     background-color: transparent;
     height: 8px;
@@ -2078,14 +2078,14 @@ const bl = (e) => {
   "--kos-font-weight-heading-small": "700",
   "--kos-font-weight-heading-medium": "700",
   "--kos-font-weight-heading-large": "700"
-}, nx = K`
+}, nx = q`
   scrollbar-gutter: stable;
   //AUTO might be the one that overlays things
 
   /* Hide scrollbar for IE, Edge, Firefox, and other browsers */
   scrollbar-width: thin; /* Firefox */
   overflow-y: auto;
-`, rx = () => K`
+`, rx = () => q`
   :root {
     --kos-font-size-base: 10px;
     --kos-font-size-small: 10px;
@@ -2094,11 +2094,11 @@ const bl = (e) => {
     font-size: var(--kos-base-font-size);
   }
   :root {
-    ${K(Tc)}
-    ${K(Fc)}
-    ${K(Rc)}
-    ${K(Oc)}
-    ${K(Nc)}
+    ${q(Tc)}
+    ${q(Fc)}
+    ${q(Rc)}
+    ${q(Oc)}
+    ${q(Nc)}
   }
 
   ::-webkit-scrollbar {
@@ -2173,17 +2173,17 @@ const bl = (e) => {
 
   @media (-webkit-max-device-pixel-ratio: 1.25) {
     :root {
-      ${K(or)}
+      ${q(or)}
     }
   }
   @media (-webkit-min-device-pixel-ratio: 1.25) {
     :root {
-      ${K(or)}
+      ${q(or)}
     }
   }
   @media (prefers-color-scheme: light) {
     :root {
-      ${K(Ec)}
+      ${q(Ec)}
     }
   }
   :root {
@@ -2202,7 +2202,7 @@ const bl = (e) => {
   }
   @media (prefers-color-scheme: dark) {
     :root {
-      ${K(Mc)}
+      ${q(Mc)}
     }
     :root {
       --ant-primary-color: var(--kos-primary-color);
@@ -2322,7 +2322,7 @@ const [We] = O(["text"]), si = [
     "span",
     {
       ref: i,
-      css: K`
+      css: q`
         ${Wc}
         font-size: ${kt(`font-size-${o}`)};
       `,
@@ -2332,7 +2332,7 @@ const [We] = O(["text"]), si = [
       children: e
     }
   )
-), Wc = K`
+), Wc = q`
   font-weight: ${kt("font-weight")};
   font-family: ${kt("font-family")};
   line-height: ${kt("line-height")};
@@ -2372,7 +2372,7 @@ const [We] = O(["text"]), si = [
   children: e,
   publicPath: t
 }) => {
-  const o = j(() => ({
+  const o = V(() => ({
     basePath: t ?? "/ui/"
   }), [t]);
   return /* @__PURE__ */ c(li.Provider, { value: o, children: e });
@@ -2399,7 +2399,7 @@ const [We] = O(["text"]), si = [
       }
     );
   }
-), N = F(Vc);
+), N = A(Vc);
 N.displayName = "Icon";
 const Hc = g.svg`
   fill: currentColor;
@@ -2421,7 +2421,7 @@ const Hc = g.svg`
           min-width: ${Qt(`size-${e}`)};
         }`
 ).join("")}
-`, [ci] = O(["actionable-blurb"]), sx = F(
+`, [ci] = O(["actionable-blurb"]), sx = A(
   ({
     text: e,
     actions: t,
@@ -2431,7 +2431,7 @@ const Hc = g.svg`
     iconSize: i,
     className: a
   }) => {
-    const s = j(() => {
+    const s = V(() => {
       if (!t)
         return e;
       let d = e;
@@ -2471,7 +2471,7 @@ const Hc = g.svg`
   row-gap: ${ci("row-gap")};
 `, Xe = () => {
 }, Kc = (e) => (t, o) => e[t][o] ?? t, qc = (e, t) => Ca(Kc(t), e), Co = (e) => (e == null ? void 0 : e.animationName) || "none", Zc = (e, t) => {
-  const [o, n] = W(), r = V(), i = V(e), a = V("none"), s = V(
+  const [o, n] = W(), r = H(), i = H(e), a = H("none"), s = H(
     t
   );
   Ie(() => {
@@ -2528,7 +2528,7 @@ const Hc = g.svg`
     isPresent: p,
     ref: h
   };
-}, Xc = F(
+}, Xc = A(
   ({ present: e, children: t, onPresenceChange: o }) => {
     const n = Zc(e, o);
     return n.isPresent ? Ut(t, { ref: n.ref, present: e }) : null;
@@ -2583,7 +2583,7 @@ const ax = ({
   ${({ $back: e }) => e && `
     transform: rotateX(180deg) translateZ(20px);
   `}
-`, [R, Ee] = O(["button", "icon"]), ed = ue(
+`, [F, Ee] = O(["button", "icon"]), ed = ue(
   ({ variant: e, text: t, disabled: o, className: n, icon: r, ...i }, a) => /* @__PURE__ */ c(Q, { children: ({ cx: s }) => /* @__PURE__ */ $(
     td,
     {
@@ -2597,87 +2597,87 @@ const ax = ({
       ]
     }
   ) })
-), at = F(ed);
+), at = A(ed);
 at.displayName = "StudioButton";
 const td = g.button`
-  font-weight: ${R("font-weight")};
-  font-size: ${R("font-size")};
-  line-height: ${R("line-height")};
-  border-radius: ${R("br")};
-  border-width: ${R("border-width")};
-  cursor: ${R("cursor")};
-  padding: ${`${R("ypadding")} ${R("xpadding")}`};
+  font-weight: ${F("font-weight")};
+  font-size: ${F("font-size")};
+  line-height: ${F("line-height")};
+  border-radius: ${F("br")};
+  border-width: ${F("border-width")};
+  cursor: ${F("cursor")};
+  padding: ${`${F("ypadding")} ${F("xpadding")}`};
   border-style: solid;
   transition: border 0.125s ease-in-out, background 0.125s ease-in-out,
     color 0.125s ease-in-out;
 
-  background-color: ${R("bg")};
-  color: ${R("color")};
-  border-color: ${R("border")};
+  background-color: ${F("bg")};
+  color: ${F("color")};
+  border-color: ${F("border")};
   display: flex;
   align-items: center;
   justify-content: flex-start;
   white-space: nowrap;
   // This token will let us flip the icon and text if we want to
-  flex-direction: ${R("flex-direction")};
+  flex-direction: ${F("flex-direction")};
 
-  ${`${Ee("fill-white", !0)}: ${R("color")}`};
+  ${`${Ee("fill-white", !0)}: ${F("color")}`};
 
   &.primary-small,
   &.secondary-small,
   &.text-small {
-    padding-top: ${R("ypadding-small")};
-    padding-bottom: ${R("ypadding-small")};
+    padding-top: ${F("ypadding-small")};
+    padding-bottom: ${F("ypadding-small")};
   }
 
   &:hover {
-    border-color: ${R("border-hover")};
-    color: ${R("color-hover")};
-    background-color: ${R("bg-hover")};
-    ${`${Ee("fill-white", !0)}: ${R("color-hover")}`};
+    border-color: ${F("border-hover")};
+    color: ${F("color-hover")};
+    background-color: ${F("bg-hover")};
+    ${`${Ee("fill-white", !0)}: ${F("color-hover")}`};
   }
 
   &:active {
-    border-color: ${R("border-active")};
-    color: ${R("color-active")};
-    background-color: ${R("bg-active")};
-    ${`${Ee("fill-white", !0)}: ${R("color-active")}`};
+    border-color: ${F("border-active")};
+    color: ${F("color-active")};
+    background-color: ${F("bg-active")};
+    ${`${Ee("fill-white", !0)}: ${F("color-active")}`};
   }
 
   &:disabled {
     cursor: not-allowed;
-    border-color: ${R("border-disabled")};
-    color: ${R("color-disabled")};
-    background-color: ${R("bg-disabled")};
-    ${`${Ee("fill-white", !0)}: ${R("color-disabled")}`};
+    border-color: ${F("border-disabled")};
+    color: ${F("color-disabled")};
+    background-color: ${F("bg-disabled")};
+    ${`${Ee("fill-white", !0)}: ${F("color-disabled")}`};
   }
 
   // Re-assign bg and color vars for secondary buttons.
   &.secondary,
   &.secondary-small {
-    background-color: ${R("bg-secondary")};
-    color: ${R("color-secondary")};
-    border-color: ${R("border-secondary")};
-    ${`${Ee("fill-white", !0)}: ${R("color-secondary")}`};
+    background-color: ${F("bg-secondary")};
+    color: ${F("color-secondary")};
+    border-color: ${F("border-secondary")};
+    ${`${Ee("fill-white", !0)}: ${F("color-secondary")}`};
     &:hover {
-      border-color: ${R("border-hover-secondary")};
-      color: ${R("color-hover-secondary")};
-      background-color: ${R("bg-hover-secondary")};
-      ${`${Ee("fill-white", !0)}: ${R("color-hover-secondary")}`};
+      border-color: ${F("border-hover-secondary")};
+      color: ${F("color-hover-secondary")};
+      background-color: ${F("bg-hover-secondary")};
+      ${`${Ee("fill-white", !0)}: ${F("color-hover-secondary")}`};
     }
 
     &:active {
-      border-color: ${R("border-active-secondary")};
-      color: ${R("color-active-secondary")};
-      background-color: ${R("bg-active-secondary")};
-      ${`${Ee("fill-white", !0)}: ${R("color-active-secondary")}`};
+      border-color: ${F("border-active-secondary")};
+      color: ${F("color-active-secondary")};
+      background-color: ${F("bg-active-secondary")};
+      ${`${Ee("fill-white", !0)}: ${F("color-active-secondary")}`};
     }
 
     &:disabled {
-      border-color: ${R("border-disabled-secondary")};
-      color: ${R("color-disabled-secondary")};
-      background-color: ${R("bg-disabled-secondary")};
-      ${`${Ee("fill-white", !0)}: ${R(
+      border-color: ${F("border-disabled-secondary")};
+      color: ${F("color-disabled-secondary")};
+      background-color: ${F("bg-disabled-secondary")};
+      ${`${Ee("fill-white", !0)}: ${F(
   "color-disabled-secondary"
 )}`};
     }
@@ -2686,39 +2686,39 @@ const td = g.button`
   // Re-assign bg, color, and border vars for borderless buttons.
   &.borderless,
   &.borderless-small {
-    background-color: ${R("bg-borderless")};
-    color: ${R("color-borderless")};
-    border-color: ${R("border-borderless")};
-    ${`${Ee("fill-white", !0)}: ${R("color-borderless")}`};
+    background-color: ${F("bg-borderless")};
+    color: ${F("color-borderless")};
+    border-color: ${F("border-borderless")};
+    ${`${Ee("fill-white", !0)}: ${F("color-borderless")}`};
     &:hover {
-      border-color: ${R("border-hover-borderless")};
-      color: ${R("color-hover-borderless")};
-      background-color: ${R("bg-hover-borderless")};
-      ${`${Ee("fill-white", !0)}: ${R("color-hover-borderless")}`};
+      border-color: ${F("border-hover-borderless")};
+      color: ${F("color-hover-borderless")};
+      background-color: ${F("bg-hover-borderless")};
+      ${`${Ee("fill-white", !0)}: ${F("color-hover-borderless")}`};
     }
 
     &:active {
-      border-color: ${R("border-active-borderless")};
-      color: ${R("color-active-borderless")};
-      background-color: ${R("bg-active-borderless")};
-      ${`${Ee("fill-white", !0)}: ${R(
+      border-color: ${F("border-active-borderless")};
+      color: ${F("color-active-borderless")};
+      background-color: ${F("bg-active-borderless")};
+      ${`${Ee("fill-white", !0)}: ${F(
   "color-active-borderless"
 )}`};
     }
 
     &:disabled {
       cursor: not-allowed;
-      border-color: ${R("border-disabled-borderless")};
-      color: ${R("color-disabled-borderless")};
-      background-color: ${R("bg-disabled-borderless")};
-      ${`${Ee("fill-white", !0)}: ${R(
+      border-color: ${F("border-disabled-borderless")};
+      color: ${F("color-disabled-borderless")};
+      background-color: ${F("bg-disabled-borderless")};
+      ${`${Ee("fill-white", !0)}: ${F(
   "color-disabled-borderless"
 )}`};
     }
   }
 `, od = g.span`
   display: flex;
-  margin: ${R("icon-margin")};
+  margin: ${F("icon-margin")};
 `, di = ve(void 0);
 function nd() {
   const e = be(di);
@@ -2735,7 +2735,7 @@ const [Ft] = O(["button-group"]), lx = ({
   children: n,
   className: r
 }) => {
-  const [i, a] = W(t), s = e ?? i, d = o ?? a, u = j(() => ({ value: s, setValue: d }), [s, d]);
+  const [i, a] = W(t), s = e ?? i, d = o ?? a, u = V(() => ({ value: s, setValue: d }), [s, d]);
   return /* @__PURE__ */ c(di.Provider, { value: u, children: /* @__PURE__ */ c(rd, { className: r, children: n }) });
 }, rd = g.div`
   display: inline-flex;
@@ -2745,7 +2745,7 @@ const [Ft] = O(["button-group"]), lx = ({
   border-radius: ${Ft("border-radius")};
   border: ${Ft("border-width")} solid ${Ft("border-color")};
   padding: ${Ft("padding")};
-`, [xt, id] = O(["button-group", "icon"]), sd = F(
+`, [xt, id] = O(["button-group", "icon"]), sd = A(
   ({ value: e, iconId: t, label: o, tooltip: n, disabled: r }) => {
     const { value: i, setValue: a } = nd(), s = i === e, d = I(() => {
       r || a(e);
@@ -2890,7 +2890,7 @@ const ad = g.button`
   onOpenChange: o
 }) => {
   const [n, r] = W(e), i = t ?? n, a = o ?? r;
-  return j(() => ({
+  return V(() => ({
     open: i,
     setOpen: a
   }), [i, a]);
@@ -2995,74 +2995,77 @@ const bd = /* @__PURE__ */ pi(md), yd = 250, vd = 500, cx = ({
   onMouseOut: a,
   onMouseOver: s,
   style: d,
-  ...u
+  className: u,
+  textClassName: h,
+  ...p
 }) => {
-  const h = V(), p = V(), f = V(null), m = V(null), [b, y] = W(!1), [x, v] = W(!1), C = I(
+  const f = H(), m = H(), b = H(null), y = H(null), [x, v] = W(!1), [C, w] = W(!1), S = I(
     (z) => {
-      let _ = n;
-      _ || (_ = typeof e == "string" ? String(e) : ""), y(!0), bd(_);
-      const D = () => {
-        y(!1);
+      let R = n;
+      R || (R = typeof e == "string" ? String(e) : ""), v(!0), bd(R);
+      const G = () => {
+        v(!1);
       };
-      clearTimeout(h.current), h.current = setTimeout(D, vd), r == null || r(z);
+      clearTimeout(f.current), f.current = setTimeout(G, vd), r == null || r(z);
     },
     [e, n, r]
   ), k = I(
     (z) => {
-      if (!f.current || !m.current) {
+      if (!b.current || !y.current) {
         i == null || i(z);
         return;
       }
-      const _ = m.current.getBoundingClientRect(), D = z.clientX - _.left + 9, L = z.clientY - _.top + 9;
-      f.current.style.transform = `translate(${D}px, ${L}px)`, i == null || i(z);
+      const R = y.current.getBoundingClientRect(), G = z.clientX - R.left + 9, j = z.clientY - R.top + 9;
+      b.current.style.transform = `translate(${G}px, ${j}px)`, i == null || i(z);
     },
     [i]
-  ), S = I(
+  ), D = I(
     (z) => {
-      y(!1), v(!1), clearTimeout(p.current), a == null || a(z);
+      v(!1), w(!1), clearTimeout(m.current), a == null || a(z);
     },
     [a]
-  ), w = I(
+  ), _ = I(
     (z) => {
-      const _ = () => {
-        v(!0);
+      const R = () => {
+        w(!0);
       };
-      return clearTimeout(p.current), p.current = setTimeout(_, yd), s == null || s(z), () => {
-        clearTimeout(p.current);
+      return clearTimeout(m.current), m.current = setTimeout(R, yd), s == null || s(z), () => {
+        clearTimeout(m.current);
       };
     },
     [s]
   );
-  return /* @__PURE__ */ $("div", { style: { position: "relative" }, children: [
+  return /* @__PURE__ */ $("div", { className: u, style: { position: "relative" }, children: [
     /* @__PURE__ */ c(
       xd,
       {
-        ref: m,
+        ref: y,
         children: e,
-        onClick: o ? C : r,
+        onClick: o ? S : r,
         onMouseMove: o ? k : i,
-        onMouseOut: o ? S : a,
-        onMouseOver: o ? w : s,
-        style: o ? b ? {
+        onMouseOut: o ? D : a,
+        onMouseOver: o ? _ : s,
+        className: h,
+        style: o ? x ? {
           ...d,
           opacity: 0.5,
           cursor: "default",
           userSelect: "none"
         } : { ...d, cursor: "default", userSelect: "none" } : { ...d, cursor: "default", userSelect: "none" },
-        ...u
+        ...p
       }
     ),
     o && /* @__PURE__ */ c(
       N,
       {
-        ref: f,
+        ref: b,
         iconId: "CopyFilled",
         style: {
           position: "absolute",
           transition: "opacity 150ms ease-in-out",
           top: "0px",
           left: "0px",
-          opacity: x && !b ? "1" : "0"
+          opacity: C && !x ? "1" : "0"
         }
       }
     )
@@ -3111,14 +3114,14 @@ function kd({
     u,
     n ? { outsidePressEvent: "mousedown", ...n } : { outsidePressEvent: "mousedown" }
   ), f = mo([h, p]);
-  return j(() => ({
+  return V(() => ({
     open: a,
     setOpen: s,
     ...f,
     ...d
   }), [a, s, f, d]);
 }
-const $d = K`
+const $d = q`
   background: rgba(0, 0, 0, 0.8);
   display: grid;
   place-items: center;
@@ -3128,7 +3131,7 @@ const $d = K`
   if (e == null)
     throw new Error("Dialog components must be wrapped in <Dialog />");
   return e;
-}, fi = F(({ children: e, ...t }) => {
+}, fi = A(({ children: e, ...t }) => {
   const o = kd(t);
   return /* @__PURE__ */ c(gi.Provider, { value: o, children: e });
 }), mi = ue(
@@ -3188,7 +3191,7 @@ const $d = K`
   }
 ), Mn = 300;
 function yi() {
-  const e = V(null), [t, o] = W();
+  const e = H(null), [t, o] = W();
   return U(() => {
     const n = new ResizeObserver(([r]) => {
       r && o(r.contentRect.width);
@@ -3224,7 +3227,7 @@ const Cd = g.div`
   size: r,
   ...i
 }) => {
-  const a = V(0), s = Ra(({ down: d, movement: [u], first: h }) => {
+  const a = H(0), s = Ra(({ down: d, movement: [u], first: h }) => {
     if (!d)
       return;
     h && (a.current = r);
@@ -3241,7 +3244,7 @@ const Cd = g.div`
   size: i = 440
 }) => {
   const [a, s] = W(e), [d, u] = W(i), h = r ?? a, p = n ?? s;
-  return j(() => ({
+  return V(() => ({
     mode: o,
     open: h,
     setOpen: p,
@@ -3261,15 +3264,15 @@ const Cd = g.div`
   width: 100%;
   z-index: 1;
   pointer-events: none;
-`, vi = K`
+`, vi = q`
   pointer-events: none;
   display: grid;
   overflow: hidden !important;
   z-index: 1;
-`, dx = K`
+`, dx = q`
   place-items: start;
   ${vi};
-`, ux = K`
+`, ux = q`
   place-items: end;
   ${vi};
 `, xi = g.div`
@@ -3478,7 +3481,7 @@ const Cd = g.div`
 `, Ad = {
   escapeKey: !0,
   outsidePress: !1
-}, xx = F(({ children: e, ...t }) => {
+}, xx = A(({ children: e, ...t }) => {
   const o = Sd(t);
   return t.mode === "dialog" ? /* @__PURE__ */ c(xn.Provider, { value: o, children: /* @__PURE__ */ c(
     fi,
@@ -3490,7 +3493,7 @@ const Cd = g.div`
       children: e
     }
   ) }) : /* @__PURE__ */ c(xn.Provider, { value: o, children: e });
-}), wx = F(({ children: e }) => {
+}), wx = A(({ children: e }) => {
   const { mode: t, open: o, setOpen: n } = Nt(), r = I(() => {
     n(!o);
   }, [o, n]);
@@ -3505,7 +3508,7 @@ const Cd = g.div`
       "data-state": o ? "open" : "closed"
     });
   throw new Error("Passed DialogTrigger an invalid element");
-}), kx = F(
+}), kx = A(
   ({ children: e, OverlayStyles: t, ...o }) => {
     const { mode: n, open: r } = Nt();
     if (n === "dialog")
@@ -3655,7 +3658,7 @@ const Rt = /* @__PURE__ */ pi(Bd), [Ye] = O(["icon-button"]), fe = ue(
   &.isLocked {
     cursor: url("/ui/custom-cursors/locked-cursor.png"), not-allowed !important;
   }
-`, [eo] = O(["drawer"]), Cx = F(
+`, [eo] = O(["drawer"]), Cx = A(
   ({
     children: e,
     className: t,
@@ -3725,36 +3728,36 @@ const Rt = /* @__PURE__ */ pi(Bd), [Ye] = O(["icon-button"]), fe = ue(
     onClear: x,
     ...v
   }, C) => {
-    const k = t === "password", [S, w] = W(!1), [z, _] = W(t), D = I(() => {
-      _(S ? "password" : "text"), w(!S);
-    }, [S]), L = (q) => {
-      q.key === "Enter" && (b == null || b()), y == null || y(q);
+    const w = t === "password", [S, k] = W(!1), [D, _] = W(t), z = I(() => {
+      _(S ? "password" : "text"), k(!S);
+    }, [S]), R = (G) => {
+      G.key === "Enter" && (b == null || b()), y == null || y(G);
     };
     if (U(() => {
       _(t);
-    }, [t]), x && k)
+    }, [t]), x && w)
       throw new Error("Password inputs cannot have an onClear handler.");
-    if (h && k)
+    if (h && w)
       throw new Error("Password inputs cannot have a suffix icon.");
     if (x && h)
       throw new Error(
         "Inputs with an onClear handler cannot have a suffix icon."
       );
-    return /* @__PURE__ */ c(Q, { children: ({ cx: q }) => /* @__PURE__ */ $(jd, { children: [
+    return /* @__PURE__ */ c(Q, { children: ({ cx: G }) => /* @__PURE__ */ $(jd, { children: [
       /* @__PURE__ */ c(
         Vd,
         {
-          type: z,
-          className: q(e, {
+          type: D,
+          className: G(e, {
             isSmall: i,
             hasLeftIcon: !!o,
-            hasRightIcon: !!k || !!p || !!h
+            hasRightIcon: !!w || !!p || !!h
           }),
           ref: C,
-          autoCapitalize: k ? "off" : a,
-          autoComplete: k ? "current-password" : s,
-          autoCorrect: k ? "off" : d,
-          onKeyDown: L,
+          autoCapitalize: w ? "off" : a,
+          autoComplete: w ? "current-password" : s,
+          autoCorrect: w ? "off" : d,
+          onKeyDown: R,
           ...v
         }
       ),
@@ -3766,7 +3769,7 @@ const Rt = /* @__PURE__ */ pi(Bd), [Ye] = O(["icon-button"]), fe = ue(
           size: r || "sm"
         }
       ),
-      (k || !!p || !!h || x && !!v.value) && /* @__PURE__ */ c(Ud, { children: h || (p ? /* @__PURE__ */ c(
+      (w || !!p || !!h || x && !!v.value) && /* @__PURE__ */ c(Ud, { children: h || (p ? /* @__PURE__ */ c(
         N,
         {
           iconId: p,
@@ -3785,7 +3788,7 @@ const Rt = /* @__PURE__ */ pi(Bd), [Ye] = O(["icon-button"]), fe = ue(
       ) : /* @__PURE__ */ c(
         fe,
         {
-          onClick: D,
+          onClick: z,
           iconId: S ? "Eye" : "EyeInvisible",
           size: "sm",
           color: n ?? "black"
@@ -3892,7 +3895,7 @@ const Gd = ue(
       value: o
     }
   )
-), [Yd] = O(["label"]), Di = K`
+), [Yd] = O(["label"]), Di = q`
   align-items: center;
   display: flex;
   gap: ${Yd("gap")};
@@ -3905,7 +3908,7 @@ const Gd = ue(
   t,
   e,
   o
-] }), [qd] = O(["label-with-action"]), Zd = K([Di, { gap: qd("gap") }]), Ix = ({
+] }), [qd] = O(["label-with-action"]), Zd = q([Di, { gap: qd("gap") }]), Ix = ({
   action: e,
   variant: t = "h2",
   ...o
@@ -3917,7 +3920,7 @@ const Gd = ue(
     variant: t,
     ...o
   }
-), [Xd] = O(["label-with-content-link"]), Jd = K`
+), [Xd] = O(["label-with-content-link"]), Jd = q`
   color: ${Xd("color")};
 `, _x = (e) => /* @__PURE__ */ c(Ti, { css: Jd, ...e }), zx = new RegExp(/^[a-zA-Z0-9 _.-]*$/), Qd = new RegExp(
   /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
@@ -3978,7 +3981,7 @@ const Nx = (e, t) => ({
 };
 let nn;
 const ru = () => nn || (nn = nu()), iu = (e, t) => {
-  const o = ru(), n = V(t);
+  const o = ru(), n = H(t);
   return Ie(() => {
     n.current = t;
   }, [t]), Ie(() => {
@@ -3994,7 +3997,7 @@ const ru = () => nn || (nn = nu()), iu = (e, t) => {
     };
   }, [e, o]), o.observer;
 }, On = (e) => {
-  const t = V(null), o = V(null), n = I(() => {
+  const t = H(null), o = H(null), n = I(() => {
     if (!t.current)
       return;
     const a = o.current, s = t.current;
@@ -4003,8 +4006,8 @@ const ru = () => nn || (nn = nu()), iu = (e, t) => {
       s.textContent !== d && (s.textContent = d);
       const h = s.textContent, p = s.offsetWidth, f = a.offsetWidth;
       if (p > f && h) {
-        const m = h.length, b = p / m, x = Math.ceil((p - f) / b) / 2 + 1.5, v = Math.floor(m / 2 - x), C = Math.ceil(m / 2 + x), k = h.substr(0, v), S = h.substr(C);
-        s.textContent = `${k.trim()}...${S.trim()}`;
+        const m = h.length, b = p / m, x = Math.ceil((p - f) / b) / 2 + 1.5, v = Math.floor(m / 2 - x), C = Math.ceil(m / 2 + x), w = h.substr(0, v), S = h.substr(C);
+        s.textContent = `${w.trim()}...${S.trim()}`;
       }
     }
   }, []), r = I(
@@ -4065,16 +4068,16 @@ const Fx = ({
   orientation: a = "horizontal"
   // Default to horizontal orientation
 }) => {
-  const s = V(null), [d, u] = W(null);
+  const s = H(null), [d, u] = W(null);
   U(() => {
     if (s.current && d === null) {
       const y = s.current.getBoundingClientRect(), x = a === "horizontal" ? y.width : y.height, v = e / 100 * x, C = Math.max(
         t,
         v
-      ), k = C / x * 100;
+      ), w = C / x * 100;
       u(C);
-      const S = k, w = 100 - k;
-      a === "horizontal" ? s.current.style.gridTemplateColumns = `${S}% 2px ${w}%` : s.current.style.gridTemplateRows = `${S}% 2px ${w}%`;
+      const S = w, k = 100 - w;
+      a === "horizontal" ? s.current.style.gridTemplateColumns = `${S}% 2px ${k}%` : s.current.style.gridTemplateRows = `${S}% 2px ${k}%`;
     }
   }, [e, t, d, a]);
   const h = I(() => {
@@ -4084,17 +4087,17 @@ const Fx = ({
     let v = Math.round(d / x * 100), C = 100 - v;
     if (C < n) {
       C = n, v = 100 - C;
-      const k = Math.round(
+      const w = Math.round(
         v / 100 * x
       );
-      u(k);
+      u(w);
     }
     if (v < o) {
       v = o, C = 100 - v;
-      const k = Math.round(
+      const w = Math.round(
         v / 100 * x
       );
-      u(k);
+      u(w);
     }
     a === "horizontal" ? s.current.style.gridTemplateColumns = `${d}px 2px auto` : s.current.style.gridTemplateRows = `${d}px 2px auto`;
   }, [d, o, n, a]), p = I(uu(h, 50), [
@@ -4106,8 +4109,8 @@ const Fx = ({
   }, m = (y) => {
     if (!s.current)
       return;
-    const x = s.current.getBoundingClientRect(), v = a === "horizontal" ? x.width : x.height, C = a === "horizontal" ? y.clientX - x.left : y.clientY - x.top, k = Math.max(t, C), S = Math.round(k / v * 100), w = 100 - S;
-    S >= o && w >= n && (u(C), a === "horizontal" ? s.current.style.gridTemplateColumns = `${S}% 2px ${w}%` : s.current.style.gridTemplateRows = `${S}% 2px ${w}%`);
+    const x = s.current.getBoundingClientRect(), v = a === "horizontal" ? x.width : x.height, C = a === "horizontal" ? y.clientX - x.left : y.clientY - x.top, w = Math.max(t, C), S = Math.round(w / v * 100), k = 100 - S;
+    S >= o && k >= n && (u(C), a === "horizontal" ? s.current.style.gridTemplateColumns = `${S}% 2px ${k}%` : s.current.style.gridTemplateRows = `${S}% 2px ${k}%`);
   }, b = () => {
     document.removeEventListener("mousemove", m), document.removeEventListener("mouseup", b);
   };
@@ -4281,7 +4284,7 @@ const gu = (e) => e.type.startsWith("mouse"), fu = (e) => e.type.startsWith("poi
   direction: t,
   onResizeEnd: o
 }) => {
-  const n = _e(), r = V(null), [i, a] = W(null), s = V({
+  const n = _e(), r = H(null), [i, a] = W(null), s = H({
     dragState: i,
     id: n,
     initialResizePanelSize: null,
@@ -4317,8 +4320,8 @@ const gu = (e) => e.type.startsWith("mouse"), fu = (e) => e.type.startsWith("poi
         r.current
       );
       if (C) {
-        const { element: k, panelPosition: S } = C, w = k.getBoundingClientRect();
-        s.current.initialResizePanelSize = y === "vertical" ? w.height : w.width, s.current.lastResizedPanelId = k.dataset.resizablePanelId ?? null, s.current.panelPosition = S;
+        const { element: w, panelPosition: S } = C, k = w.getBoundingClientRect();
+        s.current.initialResizePanelSize = y === "vertical" ? k.height : k.width, s.current.lastResizedPanelId = w.dataset.resizablePanelId ?? null, s.current.panelPosition = S;
       }
     },
     []
@@ -4345,11 +4348,11 @@ const gu = (e) => e.type.startsWith("mouse"), fu = (e) => e.type.startsWith("poi
       (v) => v.dataset.resizablePanelId === m
     );
     if (x) {
-      const v = x.parentElement, C = b === "horizontal" ? v == null ? void 0 : v.getBoundingClientRect().width : v == null ? void 0 : v.getBoundingClientRect().height, k = x.dataset.collapsed === "true", S = lo(
+      const v = x.parentElement, C = b === "horizontal" ? v == null ? void 0 : v.getBoundingClientRect().width : v == null ? void 0 : v.getBoundingClientRect().height, w = x.dataset.collapsed === "true", S = lo(
         x,
         "resizablePanelMinSize",
         C
-      ), w = lo(
+      ), k = lo(
         x,
         "resizablePanelCollapsedSize",
         C
@@ -4357,8 +4360,8 @@ const gu = (e) => e.type.startsWith("mouse"), fu = (e) => e.type.startsWith("poi
       sn(
         x,
         b,
-        k ? S : w,
-        !k
+        w ? S : k,
+        !w
       );
     }
   }, []);
@@ -4382,28 +4385,28 @@ const gu = (e) => e.type.startsWith("mouse"), fu = (e) => e.type.startsWith("poi
       if (!y)
         return () => null;
       const { direction: x, dragState: v, panelPosition: C } = s.current;
-      let k = bu(
+      let w = bu(
         b,
         m,
         x,
         v,
         y
       );
-      if (C === "right" && (k = -k), k !== 0 && r.current) {
+      if (C === "right" && (w = -w), w !== 0 && r.current) {
         const S = lr(
           m,
           s.current.id,
           r.current
         );
         if (S && s.current.initialResizePanelSize !== null) {
-          const { element: w } = S, z = s.current.initialResizePanelSize;
-          let _ = z + k;
-          _ = _ < 0 ? 0 : _, sn(w, x, _, z > _);
+          const { element: k } = S, D = s.current.initialResizePanelSize;
+          let _ = D + w;
+          _ = _ < 0 ? 0 : _, sn(k, x, _, D > _);
         }
       }
     },
     []
-  ), f = j(() => ({
+  ), f = V(() => ({
     id: n,
     startDragging: d,
     stopDragging: u,
@@ -4672,7 +4675,7 @@ const Eu = () => {
     const { direction: n } = o;
     n === "horizontal" ? e = !0 : t = !0;
   }), e && t ? an("intersection") : e ? an("horizontal") : t ? an("vertical") : Su();
-}, [ln] = O(["resizable-panels"]), Nu = F(
+}, [ln] = O(["resizable-panels"]), Nu = A(
   ({ className: e, disabled: t }) => {
     const {
       id: o,
@@ -4682,7 +4685,7 @@ const Eu = () => {
       registerResizeHandle: a
     } = Fi(), s = _e(), [d, u] = W("inactive"), [h, p] = W(
       null
-    ), f = V(null), m = V({
+    ), f = H(null), m = H({
       state: d
     });
     return Ie(() => {
@@ -4713,8 +4716,8 @@ const Eu = () => {
                 break;
               }
               case "move": {
-                const { state: k } = m.current;
-                k !== "drag" && u("hover"), bt(C, 'Expected event to be defined for "move" action'), h(C);
+                const { state: w } = m.current;
+                w !== "drag" && u("hover"), bt(C, 'Expected event to be defined for "move" action'), h(C);
                 break;
               }
               case "up": {
@@ -4812,47 +4815,47 @@ const Eu = () => {
   onBeforeOpen: p = Lu,
   showOpenState: f = !1
 }) => {
-  const [m, b] = W(!1), [y, x] = W(null), [v, C] = W(null), k = r ?? v, S = i ?? C, w = I(
+  const [m, b] = W(!1), [y, x] = W(null), [v, C] = W(null), w = r ?? v, S = i ?? C, k = I(
     (oe) => {
       oe ? p().then(() => {
         b(oe), h && h(oe);
       }) : (b(oe), h && h(oe));
     },
     [p, h]
-  ), { refs: z, floatingStyles: _, context: D } = go({
+  ), { refs: D, floatingStyles: _, context: z } = go({
     placement: u || "bottom-end",
     open: m,
-    onOpenChange: w,
+    onOpenChange: k,
     whileElementsMounted: Lo,
     middleware: s ? Li : Bu
-  }), L = V([]), q = V([]), H = I(
+  }), R = H([]), G = H([]), j = I(
     (oe) => {
       var Z;
-      S(oe), oe !== null && t(((Z = L.current[oe]) == null ? void 0 : Z.dataset.key) || ""), b(!1), h && h(!1);
+      S(oe), oe !== null && t(((Z = R.current[oe]) == null ? void 0 : Z.dataset.key) || ""), b(!1), h && h(!1);
     },
     [h, t, S]
-  ), P = za(D, {
-    listRef: L,
+  ), P = za(z, {
+    listRef: R,
     activeIndex: y,
-    selectedIndex: k,
+    selectedIndex: w,
     focusItemOnHover: !d,
     focusItemOnOpen: !d,
     onNavigate: x
-  }), J = Fo(D, { enabled: !n }), he = fo(D), te = Wo(D, { role: "listbox" }), { getReferenceProps: ee, getFloatingProps: Le, getItemProps: ye } = mo(
+  }), J = Fo(z, { enabled: !n }), he = fo(z), te = Wo(z, { role: "listbox" }), { getReferenceProps: ee, getFloatingProps: Le, getItemProps: ye } = mo(
     [P, J, he, te]
-  ), $e = j(() => ({
+  ), $e = V(() => ({
     activeIndex: y,
-    selectedIndex: k,
+    selectedIndex: w,
     open: m,
     getItemProps: ye,
-    handleSelect: H,
+    handleSelect: j,
     setIsOpen: b
-  }), [y, m, k, ye, H]);
+  }), [y, m, w, ye, j]);
   return /* @__PURE__ */ $(Wi.Provider, { value: $e, children: [
     /* @__PURE__ */ c(
       Wu,
       {
-        ref: z.setReference,
+        ref: D.setReference,
         tabIndex: 0,
         ...ee({
           onClick(oe) {
@@ -4885,16 +4888,16 @@ const Eu = () => {
       Ao,
       {
         disabled: d,
-        context: D,
+        context: z,
         modal: !1,
         children: /* @__PURE__ */ c(
           Pu,
           {
-            ref: z.setFloating,
+            ref: D.setFloating,
             style: _,
             className: a,
             ...Le(),
-            children: /* @__PURE__ */ c(Da, { elementsRef: L, labelsRef: q, children: e })
+            children: /* @__PURE__ */ c(Da, { elementsRef: R, labelsRef: G, children: e })
           }
         )
       }
@@ -4920,7 +4923,7 @@ const Eu = () => {
   align-items: center;
   justify-content: flex-start;
   gap: 2px;
-`, [et, pr] = O(["option", "text"]), Et = F(
+`, [et, pr] = O(["option", "text"]), Et = A(
   ({
     label: e,
     optionKey: t,
@@ -4934,7 +4937,7 @@ const Eu = () => {
     disableSelectionStyle: u,
     disableEnterSelection: h
   }) => {
-    const { activeIndex: p, selectedIndex: f, getItemProps: m, handleSelect: b } = Pi(), { ref: y, index: x } = Ta({ label: t }), v = p !== null && p !== -1 && p === x, C = !u && f !== null && f !== -1 && f === x, k = I(
+    const { activeIndex: p, selectedIndex: f, getItemProps: m, handleSelect: b } = Pi(), { ref: y, index: x } = Ta({ label: t }), v = p !== null && p !== -1 && p === x, C = !u && f !== null && f !== -1 && f === x, w = I(
       (S) => {
         o || (S.stopPropagation(), b(x));
       },
@@ -4951,9 +4954,9 @@ const Eu = () => {
         "aria-selected": v && C,
         tabIndex: v ? 0 : -1,
         ...m({
-          onClick: (w) => k(w),
-          onKeyDown: !h && !o ? (w) => {
-            w.code === "Enter" && b(x);
+          onClick: (k) => w(k),
+          onKeyDown: !h && !o ? (k) => {
+            k.code === "Enter" && b(x);
           } : void 0
         }),
         children: [
@@ -5020,7 +5023,7 @@ const Eu = () => {
   disabled: t,
   onSelect: o
 }) => {
-  const n = j(
+  const n = V(
     () => e.map((r) => /* @__PURE__ */ c(
       Et,
       {
@@ -5056,7 +5059,7 @@ const Eu = () => {
     default:
       return;
   }
-}, Uu = F(
+}, Uu = A(
   ({ label: e, iconId: t, level: o, disabled: n, iconSize: r }) => /* @__PURE__ */ $(Gu, { children: [
     /* @__PURE__ */ c(
       N,
@@ -5089,7 +5092,7 @@ const Eu = () => {
   if (e === null)
     throw new Error("Unable to use TabContext outside of a TabProvider");
   return e;
-}, Lx = F(
+}, Lx = A(
   ({
     children: e,
     activeTab: t,
@@ -5099,14 +5102,14 @@ const Eu = () => {
   }) => {
     const [i, a] = W(
       n
-    ), s = o ?? a, d = t ?? i, u = j(() => ({
+    ), s = o ?? a, d = t ?? i, u = V(() => ({
       onTabChange: s,
       activeTab: d,
       variant: r
     }), [d, s, r]);
     return /* @__PURE__ */ c(ji.Provider, { value: u, children: e });
   }
-), [ce] = O(["tab"]), Wx = F(
+), [ce] = O(["tab"]), Wx = A(
   ({
     value: e,
     text: t,
@@ -5269,7 +5272,7 @@ const Eu = () => {
   children: e,
   className: t
 }) => {
-  const { activeTab: o, variant: n } = Fn(), r = V(null), i = V(null), a = n === "underline";
+  const { activeTab: o, variant: n } = Fn(), r = H(null), i = H(null), a = n === "underline";
   return U(() => {
     if (a && i.current && r.current) {
       const s = i.current.querySelector(
@@ -5391,7 +5394,7 @@ const Eu = () => {
   /* @__PURE__ */ c(E, { variant: "body", children: e }),
   /* @__PURE__ */ c(N, { size: "xxsm", iconId: "Close", onClick: () => t(e) })
 ] }, `key-tag-${e}`), Hx = ({ search: e, style: t, children: o, highlightColor: n, highlightTextColor: r }) => {
-  const i = n || "yellow", a = j(
+  const i = n || "yellow", a = V(
     () => Array.isArray(e) ? e : [e].filter(Boolean),
     [e]
   );
@@ -5726,7 +5729,7 @@ const [lh, Ve, Oe] = O([
   offset: s,
   disabled: d
 }) => {
-  const u = V(null), [h, p] = W(n);
+  const u = H(null), [h, p] = W(n);
   U(() => {
     n !== void 0 && p(n);
   }, [n]);
@@ -5742,7 +5745,7 @@ const [lh, Ve, Oe] = O([
       qr(),
       Ea({ element: u })
     ]
-  }), y = Ma(b, { move: !1, restMs: r }), x = Oa(b), v = fo(b), C = Wo(b, { role: "tooltip" }), { getReferenceProps: k, getFloatingProps: S } = mo(
+  }), y = Ma(b, { move: !1, restMs: r }), x = Oa(b), v = fo(b), C = Wo(b, { role: "tooltip" }), { getReferenceProps: w, getFloatingProps: S } = mo(
     d ? [] : [y, x, v, C]
   );
   return /* @__PURE__ */ $(pe, { children: [
@@ -5751,7 +5754,7 @@ const [lh, Ve, Oe] = O([
       {
         className: i,
         ref: f.setReference,
-        ...k(),
+        ...w(),
         children: t
       }
     ),
@@ -5956,9 +5959,9 @@ const [lh, Ve, Oe] = O([
   &:hover {
     background-color: ${oo("item-hover-bg")};
   }
-`, [Io] = O(["multi-select"]), Mh = F(
+`, [Io] = O(["multi-select"]), Mh = A(
   ({ SelectAllItemTemplate: e, options: t }) => {
-    const { selected: o, onSetSelected: n, setOpen: r } = Eh(), i = V(null), { isAllSelected: a, isPartiallySelected: s } = j(() => {
+    const { selected: o, onSetSelected: n, setOpen: r } = Eh(), i = H(null), { isAllSelected: a, isPartiallySelected: s } = V(() => {
       const u = t.every(
         (h) => o.some((p) => p.value === h.value)
       );
@@ -5990,7 +5993,7 @@ const [lh, Ve, Oe] = O([
   z-index: 2;
   padding-top: calc(${Io("item-padding-y")} * 2);
   background-color: ${Io("background")};
-`, Nh = F(
+`, Nh = A(
   ({
     value: e,
     label: t,
@@ -6001,7 +6004,7 @@ const [lh, Ve, Oe] = O([
     /* @__PURE__ */ c(Xt, { onChange: Xe, checked: o }),
     /* @__PURE__ */ c(E, { variant: "body", color: "dark", children: t })
   ] })
-), [Bt] = O(["multi-select"]), Rh = F(
+), [Bt] = O(["multi-select"]), Rh = A(
   ({
     value: e,
     label: t,
@@ -6031,7 +6034,7 @@ const [lh, Ve, Oe] = O([
   :hover {
     background-color: ${Bt("selected-item-background-hover")};
   }
-`, [we] = O(["multi-select"]), Ah = F(
+`, [we] = O(["multi-select"]), Ah = A(
   ({
     options: e,
     selected: t,
@@ -6055,30 +6058,30 @@ const [lh, Ve, Oe] = O([
     }), x = Fo(y, {
       enabled: !i,
       toggle: !!n
-    }), v = fo(y), C = Wo(y, { role: "listbox" }), { getReferenceProps: k, getFloatingProps: S } = mo([
+    }), v = fo(y), C = Wo(y, { role: "listbox" }), { getReferenceProps: w, getFloatingProps: S } = mo([
       x,
       v,
       C
-    ]), w = I(
+    ]), k = I(
       (_) => {
-        t.some((D) => D.value === _.value) ? r(
-          t.filter((D) => D.value !== _.value)
+        t.some((z) => z.value === _.value) ? r(
+          t.filter((z) => z.value !== _.value)
         ) : r([...t, _]);
       },
       [r, t]
-    ), z = j(() => ({
+    ), D = V(() => ({
       open: h,
       setOpen: p,
       selected: t,
-      onToggleSelect: w,
+      onToggleSelect: k,
       onSetSelected: r
-    }), [w, h, t, r]);
-    return console.log({ open: h }), /* @__PURE__ */ c(Th, { value: z, children: /* @__PURE__ */ $(
+    }), [k, h, t, r]);
+    return console.log({ open: h }), /* @__PURE__ */ c(Th, { value: D, children: /* @__PURE__ */ $(
       Bh,
       {
         ref: m.setReference,
         className: o,
-        ...k({
+        ...w({
           onClick(_) {
             _.stopPropagation();
           }
@@ -6090,7 +6093,7 @@ const [lh, Ve, Oe] = O([
               SelectedItemTemplate: u,
               ..._,
               key: _.value,
-              onRemove: w
+              onRemove: k
             }
           )),
           h && /* @__PURE__ */ c(Yt, { children: /* @__PURE__ */ c(Ao, { context: y, modal: !1, children: /* @__PURE__ */ $(
@@ -6115,9 +6118,9 @@ const [lh, Ve, Oe] = O([
                   {
                     label: _.label,
                     value: _.value,
-                    onToggleSelect: w,
+                    onToggleSelect: k,
                     isSelected: t.some(
-                      (D) => _.value === D.value
+                      (z) => _.value === z.value
                     ),
                     ListItemTemplate: d
                   },
@@ -6164,7 +6167,7 @@ const [lh, Ve, Oe] = O([
   &.selectAllHidden {
     padding-top: ${we("list-padding")};
   }
-`, Gx = F(({ className: e }) => {
+`, Gx = A(({ className: e }) => {
   const t = _e();
   return /* @__PURE__ */ $(
     "svg",
@@ -6330,7 +6333,7 @@ const Uh = g.div`
 g.img`
   height: 100%;
 `;
-const qi = K`
+const qi = q`
   ${jh.map(
   ({ start: e, end: t }) => `&[data-gradient="${e}-${t}"] {
         background: linear-gradient(
@@ -6392,7 +6395,7 @@ const Zh = g.div`
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
-`, Jh = (e) => /* @__PURE__ */ c(Xh, { ...e, variant: "body", color: "dark" }), Yx = F(
+`, Jh = (e) => /* @__PURE__ */ c(Xh, { ...e, variant: "body", color: "dark" }), Yx = A(
   ({
     color: e,
     title: t,
@@ -6413,7 +6416,7 @@ const Zh = g.div`
       !!r && /* @__PURE__ */ c(r, {})
     ] })
   ] }) }) })
-), Qh = F(
+), Qh = A(
   ({ description: e }) => {
     const { open: t } = Vo();
     return /* @__PURE__ */ c(
@@ -6437,7 +6440,7 @@ const Zh = g.div`
     white-space: normal;
     word-break: break-word;
   }
-`, [rt] = O(["collapsible-artifact"]), Kx = F(
+`, [rt] = O(["collapsible-artifact"]), Kx = A(
   ({
     onExternalClick: e,
     id: t,
@@ -6465,7 +6468,7 @@ const Zh = g.div`
             /* @__PURE__ */ c(
               E,
               {
-                css: K`
+                css: q`
                     word-break: break-all;
                   `,
                 variant: "small",
@@ -6534,7 +6537,7 @@ const Zh = g.div`
 `, lp = g.div`
   padding: ${rt("name-and-selected-spacing")};
   width: 100%;
-`, [He] = O(["collapsible-artifact-version"]), qx = F(
+`, [He] = O(["collapsible-artifact-version"]), qx = A(
   ({
     onListItemAction: e,
     isSelected: t,
@@ -6664,7 +6667,7 @@ const Zh = g.div`
     border-bottom: ${co("border-width")} solid
       ${co("border-color")};
   }
-`, [fr] = O(["combobox"]), bp = F(
+`, [fr] = O(["combobox"]), bp = A(
   ({
     isDeletable: e,
     inputText: t,
@@ -6726,7 +6729,7 @@ const Zh = g.div`
   &.isDeletable {
     padding-right: ${l("spacing-32")};
   }
-`, wp = F(
+`, wp = A(
   ({ name: e }) => /* @__PURE__ */ $(pe, { children: [
     /* @__PURE__ */ c(
       N,
@@ -6755,7 +6758,7 @@ const Zh = g.div`
 }) => {
   const { setIsOpen: f, selectedIndex: m } = Pi(), b = I(() => {
     o("create", { id: t, name: t }), f(!1);
-  }, [t, f, o]), y = j(
+  }, [t, f, o]), y = V(
     () => !e.length || !e.some(
       (v) => v.name.toLowerCase() === t.toLowerCase()
     ),
@@ -6807,7 +6810,7 @@ const Zh = g.div`
   requiresSelection: a,
   ...s
 }) => {
-  const d = V(n == null ? void 0 : n.id), [u, h] = W(
+  const d = H(n == null ? void 0 : n.id), [u, h] = W(
     a ? "" : (n == null ? void 0 : n.name) ?? ""
   ), p = !!n && n.name === u, f = t !== void 0 ? t : p && !a;
   Ie(() => {
@@ -6819,22 +6822,22 @@ const Zh = g.div`
     },
     [r]
   ), b = I(
-    (C, k) => {
-      d.current = k == null ? void 0 : k.id, h(a ? "" : (k == null ? void 0 : k.name) ?? ""), i(C, k == null ? void 0 : k.id);
+    (C, w) => {
+      d.current = w == null ? void 0 : w.id, h(a ? "" : (w == null ? void 0 : w.name) ?? ""), i(C, w == null ? void 0 : w.id);
     },
     [i, a]
   ), y = I(
     (C) => {
-      const k = o.find((S) => S.id === C);
-      k && b("select", k);
+      const w = o.find((S) => S.id === C);
+      w && b("select", w);
     },
     [b, o]
-  ), x = j(
+  ), x = V(
     () => p ? o : o.filter(
       (C) => C.name.toLowerCase().includes(u.toLowerCase()) || C.isHeader
     ),
     [u, o, p]
-  ), v = j(
+  ), v = V(
     () => x.findIndex((C) => C.id === (n == null ? void 0 : n.id)),
     [x, n == null ? void 0 : n.id]
   );
@@ -7019,7 +7022,7 @@ function Zi(e) {
   const f = Dt(e.timeZone, e), m = f > 0 ? Math.floor(f) : Math.ceil(f), y = -(/* @__PURE__ */ new Date(+e)).getTimezoneOffset() - m, x = m !== o, v = y - d;
   if (x && v) {
     Date.prototype.setUTCMinutes.call(e, Date.prototype.getUTCMinutes.call(e) + v);
-    const C = Dt(e.timeZone, e), k = C > 0 ? Math.floor(C) : Math.ceil(C), S = m - k;
+    const C = Dt(e.timeZone, e), w = C > 0 ? Math.floor(C) : Math.ceil(C), S = m - w;
     S && (e.internal.setUTCMinutes(e.internal.getUTCMinutes() + S), Date.prototype.setUTCMinutes.call(e, Date.prototype.getUTCMinutes.call(e) + S));
   }
 }
@@ -7734,10 +7737,10 @@ function wg(e) {
     o.focused && ((i = r.current) == null || i.focus());
   }, [o.focused]), T.createElement("button", { ref: r, ...n });
 }
-var A;
+var B;
 (function(e) {
   e.Root = "root", e.Chevron = "chevron", e.Day = "day", e.DayButton = "day_button", e.CaptionLabel = "caption_label", e.Dropdowns = "dropdowns", e.Dropdown = "dropdown", e.DropdownRoot = "dropdown_root", e.Footer = "footer", e.MonthGrid = "month_grid", e.MonthCaption = "month_caption", e.MonthsDropdown = "months_dropdown", e.Month = "month", e.Months = "months", e.Nav = "nav", e.NextMonthButton = "button_next", e.PreviousMonthButton = "button_previous", e.Week = "week", e.Weeks = "weeks", e.Weekday = "weekday", e.Weekdays = "weekdays", e.WeekNumber = "week_number", e.WeekNumberHeader = "week_number_header", e.YearsDropdown = "years_dropdown";
-})(A || (A = {}));
+})(B || (B = {}));
 var de;
 (function(e) {
   e.disabled = "disabled", e.hidden = "hidden", e.outside = "outside", e.focused = "focused", e.today = "today";
@@ -7751,16 +7754,16 @@ var De;
   e.weeks_before_enter = "weeks_before_enter", e.weeks_before_exit = "weeks_before_exit", e.weeks_after_enter = "weeks_after_enter", e.weeks_after_exit = "weeks_after_exit", e.caption_after_enter = "caption_after_enter", e.caption_after_exit = "caption_after_exit", e.caption_before_enter = "caption_before_enter", e.caption_before_exit = "caption_before_exit";
 })(De || (De = {}));
 function kg(e) {
-  const { options: t, className: o, components: n, classNames: r, ...i } = e, a = [r[A.Dropdown], o].join(" "), s = t == null ? void 0 : t.find(({ value: d }) => d === i.value);
+  const { options: t, className: o, components: n, classNames: r, ...i } = e, a = [r[B.Dropdown], o].join(" "), s = t == null ? void 0 : t.find(({ value: d }) => d === i.value);
   return T.createElement(
     "span",
-    { "data-disabled": i.disabled, className: r[A.DropdownRoot] },
+    { "data-disabled": i.disabled, className: r[B.DropdownRoot] },
     T.createElement(n.Select, { className: a, ...i }, t == null ? void 0 : t.map(({ value: d, label: u, disabled: h }) => T.createElement(n.Option, { key: d, value: d, disabled: h }, u))),
     T.createElement(
       "span",
-      { className: r[A.CaptionLabel], "aria-hidden": !0 },
+      { className: r[B.CaptionLabel], "aria-hidden": !0 },
       s == null ? void 0 : s.label,
-      T.createElement(n.Chevron, { orientation: "down", size: 18, className: r[A.Chevron] })
+      T.createElement(n.Chevron, { orientation: "down", size: 18, className: r[B.Chevron] })
     )
   );
 }
@@ -7806,13 +7809,13 @@ function Tg(e) {
     { ...i },
     T.createElement(
       a.PreviousMonthButton,
-      { type: "button", className: s[A.PreviousMonthButton], tabIndex: n ? void 0 : -1, "aria-disabled": n ? void 0 : !0, "aria-label": d(n), onClick: p },
-      T.createElement(a.Chevron, { disabled: n ? void 0 : !0, className: s[A.Chevron], orientation: "left" })
+      { type: "button", className: s[B.PreviousMonthButton], tabIndex: n ? void 0 : -1, "aria-disabled": n ? void 0 : !0, "aria-label": d(n), onClick: p },
+      T.createElement(a.Chevron, { disabled: n ? void 0 : !0, className: s[B.Chevron], orientation: "left" })
     ),
     T.createElement(
       a.NextMonthButton,
-      { type: "button", className: s[A.NextMonthButton], tabIndex: r ? void 0 : -1, "aria-disabled": r ? void 0 : !0, "aria-label": u(r), onClick: h },
-      T.createElement(a.Chevron, { disabled: r ? void 0 : !0, orientation: "right", className: s[A.Chevron] })
+      { type: "button", className: s[B.NextMonthButton], tabIndex: r ? void 0 : -1, "aria-disabled": r ? void 0 : !0, "aria-label": u(r), onClick: h },
+      T.createElement(a.Chevron, { disabled: r ? void 0 : !0, orientation: "right", className: s[B.Chevron] })
     )
   );
 }
@@ -7935,44 +7938,44 @@ function mt(e, t, o = lt) {
   });
 }
 function Hg(e, t, o, n, r) {
-  const { disabled: i, hidden: a, modifiers: s, showOutsideDays: d, broadcastCalendar: u, today: h } = t, { isSameDay: p, isSameMonth: f, startOfMonth: m, isBefore: b, endOfMonth: y, isAfter: x } = r, v = o && m(o), C = n && y(n), k = {
+  const { disabled: i, hidden: a, modifiers: s, showOutsideDays: d, broadcastCalendar: u, today: h } = t, { isSameDay: p, isSameMonth: f, startOfMonth: m, isBefore: b, endOfMonth: y, isAfter: x } = r, v = o && m(o), C = n && y(n), w = {
     [de.focused]: [],
     [de.outside]: [],
     [de.disabled]: [],
     [de.hidden]: [],
     [de.today]: []
   }, S = {};
-  for (const w of e) {
-    const { date: z, displayMonth: _ } = w, D = !!(_ && !f(z, _)), L = !!(v && b(z, v)), q = !!(C && x(z, C)), H = !!(i && mt(z, i, r)), P = !!(a && mt(z, a, r)) || L || q || // Broadcast calendar will show outside days as default
-    !u && !d && D || u && d === !1 && D, J = p(z, h ?? r.today());
-    D && k.outside.push(w), H && k.disabled.push(w), P && k.hidden.push(w), J && k.today.push(w), s && Object.keys(s).forEach((he) => {
+  for (const k of e) {
+    const { date: D, displayMonth: _ } = k, z = !!(_ && !f(D, _)), R = !!(v && b(D, v)), G = !!(C && x(D, C)), j = !!(i && mt(D, i, r)), P = !!(a && mt(D, a, r)) || R || G || // Broadcast calendar will show outside days as default
+    !u && !d && z || u && d === !1 && z, J = p(D, h ?? r.today());
+    z && w.outside.push(k), j && w.disabled.push(k), P && w.hidden.push(k), J && w.today.push(k), s && Object.keys(s).forEach((he) => {
       const te = s == null ? void 0 : s[he];
-      te && mt(z, te, r) && (S[he] ? S[he].push(w) : S[he] = [w]);
+      te && mt(D, te, r) && (S[he] ? S[he].push(k) : S[he] = [k]);
     });
   }
-  return (w) => {
-    const z = {
+  return (k) => {
+    const D = {
       [de.focused]: !1,
       [de.disabled]: !1,
       [de.hidden]: !1,
       [de.outside]: !1,
       [de.today]: !1
     }, _ = {};
-    for (const D in k) {
-      const L = k[D];
-      z[D] = L.some((q) => q === w);
+    for (const z in w) {
+      const R = w[z];
+      D[z] = R.some((G) => G === k);
     }
-    for (const D in S)
-      _[D] = S[D].some((L) => L === w);
+    for (const z in S)
+      _[z] = S[z].some((R) => R === k);
     return {
-      ...z,
+      ...D,
       // custom modifiers should override all the previous ones
       ..._
     };
   };
 }
 function Ug(e, t, o = {}) {
-  return Object.entries(e).filter(([, r]) => r === !0).reduce((r, [i]) => (o[i] ? r.push(o[i]) : t[de[i]] ? r.push(t[de[i]]) : t[qe[i]] && r.push(t[qe[i]]), r), [t[A.Day]]);
+  return Object.entries(e).filter(([, r]) => r === !0).reduce((r, [i]) => (o[i] ? r.push(o[i]) : t[de[i]] ? r.push(t[de[i]]) : t[qe[i]] && r.push(t[qe[i]]), r), [t[B.Day]]);
 }
 function Gg(e) {
   return {
@@ -7995,8 +7998,8 @@ function Yg(e) {
 }
 function Kg() {
   const e = {};
-  for (const t in A)
-    e[A[t]] = `rdp-${A[t]}`;
+  for (const t in B)
+    e[B[t]] = `rdp-${B[t]}`;
   for (const t in de)
     e[de[t]] = `rdp-${de[t]}`;
   for (const t in qe)
@@ -8056,7 +8059,7 @@ function rf(e, t, o, n, r) {
   });
 }
 function sf(e, t = {}, o = {}) {
-  let n = { ...t == null ? void 0 : t[A.Day] };
+  let n = { ...t == null ? void 0 : t[B.Day] };
   return Object.entries(e).filter(([, r]) => r === !0).forEach(([r]) => {
     n = {
       ...n,
@@ -8144,7 +8147,7 @@ const xf = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   ...e.querySelectorAll("[data-animated-month]") ?? []
 ], wf = (e) => xo(e.querySelector("[data-animated-month]")), pn = (e) => xo(e.querySelector("[data-animated-caption]")), gn = (e) => xo(e.querySelector("[data-animated-weeks]")), kf = (e) => xo(e.querySelector("[data-animated-nav]")), $f = (e) => xo(e.querySelector("[data-animated-weekdays]"));
 function Cf(e, t, { classNames: o, months: n, focused: r, dateLib: i }) {
-  const a = V(null), s = V(n), d = V(!1);
+  const a = H(null), s = H(n), d = H(!1);
   Ie(() => {
     const u = s.current;
     if (s.current = n, !t || !e.current || // safety check because the ref can be set to anything by consumers
@@ -8152,15 +8155,15 @@ function Cf(e, t, { classNames: o, months: n, focused: r, dateLib: i }) {
     n.length === 0 || u.length === 0 || n.length !== u.length)
       return;
     const h = i.isSameMonth(n[0].date, u[0].date), p = i.isAfter(n[0].date, u[0].date), f = p ? o[De.caption_after_enter] : o[De.caption_before_enter], m = p ? o[De.weeks_after_enter] : o[De.weeks_before_enter], b = a.current, y = e.current.cloneNode(!0);
-    if (y instanceof HTMLElement ? (hn(y).forEach((k) => {
-      if (!(k instanceof HTMLElement))
+    if (y instanceof HTMLElement ? (hn(y).forEach((w) => {
+      if (!(w instanceof HTMLElement))
         return;
-      const S = wf(k);
-      S && k.contains(S) && k.removeChild(S);
-      const w = pn(k);
-      w && w.classList.remove(f);
-      const z = gn(k);
-      z && z.classList.remove(m);
+      const S = wf(w);
+      S && w.contains(S) && w.removeChild(S);
+      const k = pn(w);
+      k && k.classList.remove(f);
+      const D = gn(w);
+      D && D.classList.remove(m);
     }), a.current = y) : a.current = null, d.current || h || // skip animation if a day is focused because it can cause issues to the animation and is better for a11y
     r)
       return;
@@ -8168,46 +8171,46 @@ function Cf(e, t, { classNames: o, months: n, focused: r, dateLib: i }) {
     if (v != null && v.every((C) => C instanceof HTMLElement) && x && x.every((C) => C instanceof HTMLElement)) {
       d.current = !0, e.current.style.isolation = "isolate";
       const C = kf(e.current);
-      C && (C.style.zIndex = "1"), v.forEach((k, S) => {
-        const w = x[S];
-        if (!w)
+      C && (C.style.zIndex = "1"), v.forEach((w, S) => {
+        const k = x[S];
+        if (!k)
           return;
-        k.style.position = "relative", k.style.overflow = "hidden";
-        const z = pn(k);
-        z && z.classList.add(f);
-        const _ = gn(k);
+        w.style.position = "relative", w.style.overflow = "hidden";
+        const D = pn(w);
+        D && D.classList.add(f);
+        const _ = gn(w);
         _ && _.classList.add(m);
-        const D = () => {
-          d.current = !1, e.current && (e.current.style.isolation = ""), C && (C.style.zIndex = ""), z && z.classList.remove(f), _ && _.classList.remove(m), k.style.position = "", k.style.overflow = "", k.contains(w) && k.removeChild(w);
+        const z = () => {
+          d.current = !1, e.current && (e.current.style.isolation = ""), C && (C.style.zIndex = ""), D && D.classList.remove(f), _ && _.classList.remove(m), w.style.position = "", w.style.overflow = "", w.contains(k) && w.removeChild(k);
         };
-        w.style.pointerEvents = "none", w.style.position = "absolute", w.style.overflow = "hidden", w.setAttribute("aria-hidden", "true");
-        const L = $f(w);
-        L && (L.style.opacity = "0");
-        const q = pn(w);
-        q && (q.classList.add(p ? o[De.caption_before_exit] : o[De.caption_after_exit]), q.addEventListener("animationend", D));
-        const H = gn(w);
-        H && H.classList.add(p ? o[De.weeks_before_exit] : o[De.weeks_after_exit]), k.insertBefore(w, k.firstChild);
+        k.style.pointerEvents = "none", k.style.position = "absolute", k.style.overflow = "hidden", k.setAttribute("aria-hidden", "true");
+        const R = $f(k);
+        R && (R.style.opacity = "0");
+        const G = pn(k);
+        G && (G.classList.add(p ? o[De.caption_before_exit] : o[De.caption_after_exit]), G.addEventListener("animationend", z));
+        const j = gn(k);
+        j && j.classList.add(p ? o[De.weeks_before_exit] : o[De.weeks_after_exit]), w.insertBefore(k, w.firstChild);
       });
     }
   });
 }
 function Sf(e, t, o, n) {
-  const r = e[0], i = e[e.length - 1], { ISOWeek: a, fixedWeeks: s, broadcastCalendar: d } = o ?? {}, { addDays: u, differenceInCalendarDays: h, differenceInCalendarMonths: p, endOfBroadcastWeek: f, endOfISOWeek: m, endOfMonth: b, endOfWeek: y, isAfter: x, startOfBroadcastWeek: v, startOfISOWeek: C, startOfWeek: k } = n, S = d ? v(r, n) : a ? C(r) : k(r), w = d ? f(i) : a ? m(b(i)) : y(b(i)), z = h(w, S), _ = p(i, r) + 1, D = [];
-  for (let H = 0; H <= z; H++) {
-    const P = u(S, H);
+  const r = e[0], i = e[e.length - 1], { ISOWeek: a, fixedWeeks: s, broadcastCalendar: d } = o ?? {}, { addDays: u, differenceInCalendarDays: h, differenceInCalendarMonths: p, endOfBroadcastWeek: f, endOfISOWeek: m, endOfMonth: b, endOfWeek: y, isAfter: x, startOfBroadcastWeek: v, startOfISOWeek: C, startOfWeek: w } = n, S = d ? v(r, n) : a ? C(r) : w(r), k = d ? f(i) : a ? m(b(i)) : y(b(i)), D = h(k, S), _ = p(i, r) + 1, z = [];
+  for (let j = 0; j <= D; j++) {
+    const P = u(S, j);
     if (t && x(P, t))
       break;
-    D.push(P);
-  }
-  const q = (d ? 35 : 42) * _;
-  if (s && D.length < q) {
-    const H = q - D.length;
-    for (let P = 0; P < H; P++) {
-      const J = u(D[D.length - 1], 1);
-      D.push(J);
+    z.push(P);
+  }
+  const G = (d ? 35 : 42) * _;
+  if (s && z.length < G) {
+    const j = G - z.length;
+    for (let P = 0; P < j; P++) {
+      const J = u(z[z.length - 1], 1);
+      z.push(J);
     }
   }
-  return D;
+  return z;
 }
 function If(e) {
   const t = [];
@@ -8238,19 +8241,19 @@ function vr(e, t, o, n) {
 }
 function zf(e, t, o, n) {
   const { addDays: r, endOfBroadcastWeek: i, endOfISOWeek: a, endOfMonth: s, endOfWeek: d, getISOWeek: u, getWeek: h, startOfBroadcastWeek: p, startOfISOWeek: f, startOfWeek: m } = n, b = e.reduce((y, x) => {
-    const v = o.broadcastCalendar ? p(x, n) : o.ISOWeek ? f(x) : m(x), C = o.broadcastCalendar ? i(x) : o.ISOWeek ? a(s(x)) : d(s(x)), k = t.filter((_) => _ >= v && _ <= C), S = o.broadcastCalendar ? 35 : 42;
-    if (o.fixedWeeks && k.length < S) {
-      const _ = t.filter((D) => {
-        const L = S - k.length;
-        return D > C && D <= r(C, L);
+    const v = o.broadcastCalendar ? p(x, n) : o.ISOWeek ? f(x) : m(x), C = o.broadcastCalendar ? i(x) : o.ISOWeek ? a(s(x)) : d(s(x)), w = t.filter((_) => _ >= v && _ <= C), S = o.broadcastCalendar ? 35 : 42;
+    if (o.fixedWeeks && w.length < S) {
+      const _ = t.filter((z) => {
+        const R = S - w.length;
+        return z > C && z <= r(C, R);
       });
-      k.push(..._);
+      w.push(..._);
     }
-    const w = k.reduce((_, D) => {
-      const L = o.ISOWeek ? u(D) : h(D), q = _.find((P) => P.weekNumber === L), H = new Qi(D, x, n);
-      return q ? q.days.push(H) : _.push(new mg(L, [H])), _;
-    }, []), z = new fg(x, w);
-    return y.push(z), y;
+    const k = w.reduce((_, z) => {
+      const R = o.ISOWeek ? u(z) : h(z), G = _.find((P) => P.weekNumber === R), j = new Qi(z, x, n);
+      return G ? G.days.push(j) : _.push(new mg(R, [j])), _;
+    }, []), D = new fg(x, k);
+    return y.push(D), y;
   }, []);
   return o.reverseMonths ? b.reverse() : b;
 }
@@ -8297,13 +8300,13 @@ function Of(e, t) {
     e.month ? a : void 0
   );
   U(() => {
-    const z = vr(e, o, n, t);
-    d(z);
+    const D = vr(e, o, n, t);
+    d(D);
   }, [e.timeZone]);
-  const u = _f(s, n, e, t), h = Sf(u, e.endMonth ? i(e.endMonth) : void 0, e, t), p = zf(u, h, e, t), f = Mf(p), m = If(p), b = Ef(s, o, e, t), y = Tf(s, n, e, t), { disableNavigation: x, onMonthChange: v } = e, C = (z) => f.some((_) => _.days.some((D) => D.isEqualTo(z))), k = (z) => {
+  const u = _f(s, n, e, t), h = Sf(u, e.endMonth ? i(e.endMonth) : void 0, e, t), p = zf(u, h, e, t), f = Mf(p), m = If(p), b = Ef(s, o, e, t), y = Tf(s, n, e, t), { disableNavigation: x, onMonthChange: v } = e, C = (D) => f.some((_) => _.days.some((z) => z.isEqualTo(D))), w = (D) => {
     if (x)
       return;
-    let _ = r(z);
+    let _ = r(D);
     o && _ < r(o) && (_ = r(o)), n && _ > r(n) && (_ = r(n)), d(_), v == null || v(_);
   };
   return {
@@ -8314,9 +8317,9 @@ function Of(e, t) {
     navEnd: n,
     previousMonth: b,
     nextMonth: y,
-    goToMonth: k,
-    goToDay: (z) => {
-      C(z) || k(z.date);
+    goToMonth: w,
+    goToDay: (D) => {
+      C(D) || w(D.date);
     }
   };
 }
@@ -8336,16 +8339,16 @@ function Nf(e, t, o, n) {
   return r || (r = e.find((a) => xr(t(a)))), r;
 }
 function Rf(e, t, o, n, r, i, a) {
-  const { ISOWeek: s, broadcastCalendar: d } = i, { addDays: u, addMonths: h, addWeeks: p, addYears: f, endOfBroadcastWeek: m, endOfISOWeek: b, endOfWeek: y, max: x, min: v, startOfBroadcastWeek: C, startOfISOWeek: k, startOfWeek: S } = a;
-  let z = {
+  const { ISOWeek: s, broadcastCalendar: d } = i, { addDays: u, addMonths: h, addWeeks: p, addYears: f, endOfBroadcastWeek: m, endOfISOWeek: b, endOfWeek: y, max: x, min: v, startOfBroadcastWeek: C, startOfISOWeek: w, startOfWeek: S } = a;
+  let D = {
     day: u,
     week: p,
     month: h,
     year: f,
-    startOfWeek: (_) => d ? C(_, a) : s ? k(_) : S(_),
+    startOfWeek: (_) => d ? C(_, a) : s ? w(_) : S(_),
     endOfWeek: (_) => d ? m(_) : s ? b(_) : y(_)
   }[e](o, t === "after" ? 1 : -1);
-  return t === "before" && n ? z = x([n, z]) : t === "after" && r && (z = v([r, z])), z;
+  return t === "before" && n ? D = x([n, D]) : t === "after" && r && (D = v([r, D])), D;
 }
 function ds(e, t, o, n, r, i, a, s = 0) {
   if (s > 365)
@@ -8488,15 +8491,15 @@ function Hf(e) {
   let t = e;
   t.timeZone && (t = {
     ...e
-  }, t.today && (t.today = new xe(t.today, t.timeZone)), t.month && (t.month = new xe(t.month, t.timeZone)), t.defaultMonth && (t.defaultMonth = new xe(t.defaultMonth, t.timeZone)), t.startMonth && (t.startMonth = new xe(t.startMonth, t.timeZone)), t.endMonth && (t.endMonth = new xe(t.endMonth, t.timeZone)), t.mode === "single" && t.selected ? t.selected = new xe(t.selected, t.timeZone) : t.mode === "multiple" && t.selected ? t.selected = (Zn = t.selected) == null ? void 0 : Zn.map((Y) => new xe(Y, t.timeZone)) : t.mode === "range" && t.selected && (t.selected = {
+  }, t.today && (t.today = new xe(t.today, t.timeZone)), t.month && (t.month = new xe(t.month, t.timeZone)), t.defaultMonth && (t.defaultMonth = new xe(t.defaultMonth, t.timeZone)), t.startMonth && (t.startMonth = new xe(t.startMonth, t.timeZone)), t.endMonth && (t.endMonth = new xe(t.endMonth, t.timeZone)), t.mode === "single" && t.selected ? t.selected = new xe(t.selected, t.timeZone) : t.mode === "multiple" && t.selected ? t.selected = (Zn = t.selected) == null ? void 0 : Zn.map((K) => new xe(K, t.timeZone)) : t.mode === "range" && t.selected && (t.selected = {
     from: t.selected.from ? new xe(t.selected.from, t.timeZone) : void 0,
     to: t.selected.to ? new xe(t.selected.to, t.timeZone) : void 0
   }));
-  const { components: o, formatters: n, labels: r, dateLib: i, locale: a, classNames: s } = j(() => {
-    const Y = { ...Xi, ...t.locale };
+  const { components: o, formatters: n, labels: r, dateLib: i, locale: a, classNames: s } = V(() => {
+    const K = { ...Xi, ...t.locale };
     return {
       dateLib: new yt({
-        locale: Y,
+        locale: K,
         weekStartsOn: t.broadcastCalendar ? 1 : t.weekStartsOn,
         firstWeekContainsDate: t.firstWeekContainsDate,
         useAdditionalWeekYearTokens: t.useAdditionalWeekYearTokens,
@@ -8507,7 +8510,7 @@ function Hf(e) {
       components: Gg(t.components),
       formatters: nf(t.formatters),
       labels: { ...xf, ...t.labels },
-      locale: Y,
+      locale: K,
       classNames: { ...Kg(), ...t.classNames }
     };
   }, [
@@ -8524,53 +8527,53 @@ function Hf(e) {
     t.formatters,
     t.labels,
     t.classNames
-  ]), { captionLayout: d, mode: u, navLayout: h, numberOfMonths: p = 1, onDayBlur: f, onDayClick: m, onDayFocus: b, onDayKeyDown: y, onDayMouseEnter: x, onDayMouseLeave: v, onNextClick: C, onPrevClick: k, showWeekNumber: S, styles: w } = t, { formatCaption: z, formatDay: _, formatMonthDropdown: D, formatWeekNumber: L, formatWeekNumberHeader: q, formatWeekdayName: H, formatYearDropdown: P } = n, J = Of(t, i), { days: he, months: te, navStart: ee, navEnd: Le, previousMonth: ye, nextMonth: $e, goToMonth: oe } = J, Z = Hg(he, t, ee, Le, i), { isSelected: ne, select: ut, selected: Qe } = Vf(t, i) ?? {}, { blur: Un, focused: ko, isFocusTarget: qs, moveFocus: Gn, setFocused: $o } = Ff(t, J, Z, ne ?? (() => !1), i), { labelDayButton: Zs, labelGridcell: Xs, labelGrid: Js, labelMonthDropdown: Qs, labelNav: Yn, labelPrevious: ea, labelNext: ta, labelWeekday: oa, labelWeekNumber: na, labelWeekNumberHeader: ra, labelYearDropdown: ia } = r, sa = j(() => af(i, t.ISOWeek), [i, t.ISOWeek]), Kn = u !== void 0 || m !== void 0, Jo = I(() => {
-    ye && (oe(ye), k == null || k(ye));
-  }, [ye, oe, k]), Qo = I(() => {
+  ]), { captionLayout: d, mode: u, navLayout: h, numberOfMonths: p = 1, onDayBlur: f, onDayClick: m, onDayFocus: b, onDayKeyDown: y, onDayMouseEnter: x, onDayMouseLeave: v, onNextClick: C, onPrevClick: w, showWeekNumber: S, styles: k } = t, { formatCaption: D, formatDay: _, formatMonthDropdown: z, formatWeekNumber: R, formatWeekNumberHeader: G, formatWeekdayName: j, formatYearDropdown: P } = n, J = Of(t, i), { days: he, months: te, navStart: ee, navEnd: Le, previousMonth: ye, nextMonth: $e, goToMonth: oe } = J, Z = Hg(he, t, ee, Le, i), { isSelected: ne, select: ut, selected: Qe } = Vf(t, i) ?? {}, { blur: Un, focused: ko, isFocusTarget: qs, moveFocus: Gn, setFocused: $o } = Ff(t, J, Z, ne ?? (() => !1), i), { labelDayButton: Zs, labelGridcell: Xs, labelGrid: Js, labelMonthDropdown: Qs, labelNav: Yn, labelPrevious: ea, labelNext: ta, labelWeekday: oa, labelWeekNumber: na, labelWeekNumberHeader: ra, labelYearDropdown: ia } = r, sa = V(() => af(i, t.ISOWeek), [i, t.ISOWeek]), Kn = u !== void 0 || m !== void 0, Jo = I(() => {
+    ye && (oe(ye), w == null || w(ye));
+  }, [ye, oe, w]), Qo = I(() => {
     $e && (oe($e), C == null || C($e));
-  }, [oe, $e, C]), aa = I((Y, re) => (G) => {
-    G.preventDefault(), G.stopPropagation(), $o(Y), ut == null || ut(Y.date, re, G), m == null || m(Y.date, re, G);
-  }, [ut, m, $o]), la = I((Y, re) => (G) => {
-    $o(Y), b == null || b(Y.date, re, G);
-  }, [b, $o]), ca = I((Y, re) => (G) => {
-    Un(), f == null || f(Y.date, re, G);
-  }, [Un, f]), da = I((Y, re) => (G) => {
+  }, [oe, $e, C]), aa = I((K, re) => (Y) => {
+    Y.preventDefault(), Y.stopPropagation(), $o(K), ut == null || ut(K.date, re, Y), m == null || m(K.date, re, Y);
+  }, [ut, m, $o]), la = I((K, re) => (Y) => {
+    $o(K), b == null || b(K.date, re, Y);
+  }, [b, $o]), ca = I((K, re) => (Y) => {
+    Un(), f == null || f(K.date, re, Y);
+  }, [Un, f]), da = I((K, re) => (Y) => {
     const ae = {
       ArrowLeft: [
-        G.shiftKey ? "month" : "day",
+        Y.shiftKey ? "month" : "day",
         t.dir === "rtl" ? "after" : "before"
       ],
       ArrowRight: [
-        G.shiftKey ? "month" : "day",
+        Y.shiftKey ? "month" : "day",
         t.dir === "rtl" ? "before" : "after"
       ],
-      ArrowDown: [G.shiftKey ? "year" : "week", "after"],
-      ArrowUp: [G.shiftKey ? "year" : "week", "before"],
-      PageUp: [G.shiftKey ? "year" : "month", "before"],
-      PageDown: [G.shiftKey ? "year" : "month", "after"],
+      ArrowDown: [Y.shiftKey ? "year" : "week", "after"],
+      ArrowUp: [Y.shiftKey ? "year" : "week", "before"],
+      PageUp: [Y.shiftKey ? "year" : "month", "before"],
+      PageDown: [Y.shiftKey ? "year" : "month", "after"],
       Home: ["startOfWeek", "before"],
       End: ["endOfWeek", "after"]
     };
-    if (ae[G.key]) {
-      G.preventDefault(), G.stopPropagation();
-      const [Te, X] = ae[G.key];
+    if (ae[Y.key]) {
+      Y.preventDefault(), Y.stopPropagation();
+      const [Te, X] = ae[Y.key];
       Gn(Te, X);
     }
-    y == null || y(Y.date, re, G);
-  }, [Gn, y, t.dir]), ua = I((Y, re) => (G) => {
-    x == null || x(Y.date, re, G);
-  }, [x]), ha = I((Y, re) => (G) => {
-    v == null || v(Y.date, re, G);
-  }, [v]), pa = I((Y) => (re) => {
-    const G = Number(re.target.value), ae = i.setMonth(i.startOfMonth(Y), G);
+    y == null || y(K.date, re, Y);
+  }, [Gn, y, t.dir]), ua = I((K, re) => (Y) => {
+    x == null || x(K.date, re, Y);
+  }, [x]), ha = I((K, re) => (Y) => {
+    v == null || v(K.date, re, Y);
+  }, [v]), pa = I((K) => (re) => {
+    const Y = Number(re.target.value), ae = i.setMonth(i.startOfMonth(K), Y);
     oe(ae);
-  }, [i, oe]), ga = I((Y) => (re) => {
-    const G = Number(re.target.value), ae = i.setYear(i.startOfMonth(Y), G);
+  }, [i, oe]), ga = I((K) => (re) => {
+    const Y = Number(re.target.value), ae = i.setYear(i.startOfMonth(K), Y);
     oe(ae);
-  }, [i, oe]), { className: fa, style: ma } = j(() => ({
-    className: [s[A.Root], t.className].filter(Boolean).join(" "),
-    style: { ...w == null ? void 0 : w[A.Root], ...t.style }
-  }), [s, t.className, t.style, w]), ba = Yg(t), qn = V(null);
+  }, [i, oe]), { className: fa, style: ma } = V(() => ({
+    className: [s[B.Root], t.className].filter(Boolean).join(" "),
+    style: { ...k == null ? void 0 : k[B.Root], ...t.style }
+  }), [s, t.className, t.style, k]), ba = Yg(t), qn = H(null);
   Cf(qn, !!t.animate, {
     classNames: s,
     months: te,
@@ -8589,7 +8592,7 @@ function Hf(e) {
     getModifiers: Z,
     components: o,
     classNames: s,
-    styles: w,
+    styles: k,
     labels: r,
     formatters: n
   };
@@ -8601,29 +8604,29 @@ function Hf(e) {
       { rootRef: t.animate ? qn : void 0, className: fa, style: ma, dir: t.dir, id: t.id, lang: t.lang, nonce: t.nonce, title: t.title, role: t.role, "aria-label": t["aria-label"], ...ba },
       T.createElement(
         o.Months,
-        { className: s[A.Months], style: w == null ? void 0 : w[A.Months] },
-        !t.hideNavigation && !h && T.createElement(o.Nav, { "data-animated-nav": t.animate ? "true" : void 0, className: s[A.Nav], style: w == null ? void 0 : w[A.Nav], "aria-label": Yn(), onPreviousClick: Jo, onNextClick: Qo, previousMonth: ye, nextMonth: $e }),
-        te.map((Y, re) => T.createElement(
+        { className: s[B.Months], style: k == null ? void 0 : k[B.Months] },
+        !t.hideNavigation && !h && T.createElement(o.Nav, { "data-animated-nav": t.animate ? "true" : void 0, className: s[B.Nav], style: k == null ? void 0 : k[B.Nav], "aria-label": Yn(), onPreviousClick: Jo, onNextClick: Qo, previousMonth: ye, nextMonth: $e }),
+        te.map((K, re) => T.createElement(
           o.Month,
           {
             "data-animated-month": t.animate ? "true" : void 0,
-            className: s[A.Month],
-            style: w == null ? void 0 : w[A.Month],
+            className: s[B.Month],
+            style: k == null ? void 0 : k[B.Month],
             // biome-ignore lint/suspicious/noArrayIndexKey: breaks animation
             key: re,
             displayIndex: re,
-            calendarMonth: Y
+            calendarMonth: K
           },
           h === "around" && !t.hideNavigation && re === 0 && T.createElement(
             o.PreviousMonthButton,
-            { type: "button", className: s[A.PreviousMonthButton], tabIndex: ye ? void 0 : -1, "aria-disabled": ye ? void 0 : !0, "aria-label": ea(ye), onClick: Jo, "data-animated-button": t.animate ? "true" : void 0 },
-            T.createElement(o.Chevron, { disabled: ye ? void 0 : !0, className: s[A.Chevron], orientation: t.dir === "rtl" ? "right" : "left" })
+            { type: "button", className: s[B.PreviousMonthButton], tabIndex: ye ? void 0 : -1, "aria-disabled": ye ? void 0 : !0, "aria-label": ea(ye), onClick: Jo, "data-animated-button": t.animate ? "true" : void 0 },
+            T.createElement(o.Chevron, { disabled: ye ? void 0 : !0, className: s[B.Chevron], orientation: t.dir === "rtl" ? "right" : "left" })
           ),
-          T.createElement(o.MonthCaption, { "data-animated-caption": t.animate ? "true" : void 0, className: s[A.MonthCaption], style: w == null ? void 0 : w[A.MonthCaption], calendarMonth: Y, displayIndex: re }, d != null && d.startsWith("dropdown") ? T.createElement(
+          T.createElement(o.MonthCaption, { "data-animated-caption": t.animate ? "true" : void 0, className: s[B.MonthCaption], style: k == null ? void 0 : k[B.MonthCaption], calendarMonth: K, displayIndex: re }, d != null && d.startsWith("dropdown") ? T.createElement(
             o.DropdownNav,
-            { className: s[A.Dropdowns], style: w == null ? void 0 : w[A.Dropdowns] },
-            d === "dropdown" || d === "dropdown-months" ? T.createElement(o.MonthsDropdown, { className: s[A.MonthsDropdown], "aria-label": Qs(), classNames: s, components: o, disabled: !!t.disableNavigation, onChange: pa(Y.date), options: rf(Y.date, ee, Le, n, i), style: w == null ? void 0 : w[A.Dropdown], value: i.getMonth(Y.date) }) : T.createElement("span", null, D(Y.date, i)),
-            d === "dropdown" || d === "dropdown-years" ? T.createElement(o.YearsDropdown, { className: s[A.YearsDropdown], "aria-label": ia(i.options), classNames: s, components: o, disabled: !!t.disableNavigation, onChange: ga(Y.date), options: lf(ee, Le, n, i, !!t.reverseYears), style: w == null ? void 0 : w[A.Dropdown], value: i.getYear(Y.date) }) : T.createElement("span", null, P(Y.date, i)),
+            { className: s[B.Dropdowns], style: k == null ? void 0 : k[B.Dropdowns] },
+            d === "dropdown" || d === "dropdown-months" ? T.createElement(o.MonthsDropdown, { className: s[B.MonthsDropdown], "aria-label": Qs(), classNames: s, components: o, disabled: !!t.disableNavigation, onChange: pa(K.date), options: rf(K.date, ee, Le, n, i), style: k == null ? void 0 : k[B.Dropdown], value: i.getMonth(K.date) }) : T.createElement("span", null, z(K.date, i)),
+            d === "dropdown" || d === "dropdown-years" ? T.createElement(o.YearsDropdown, { className: s[B.YearsDropdown], "aria-label": ia(i.options), classNames: s, components: o, disabled: !!t.disableNavigation, onChange: ga(K.date), options: lf(ee, Le, n, i, !!t.reverseYears), style: k == null ? void 0 : k[B.Dropdown], value: i.getYear(K.date) }) : T.createElement("span", null, P(K.date, i)),
             T.createElement("span", { role: "status", "aria-live": "polite", style: {
               border: 0,
               clip: "rect(0 0 0 0)",
@@ -8635,43 +8638,43 @@ function Hf(e) {
               width: "1px",
               whiteSpace: "nowrap",
               wordWrap: "normal"
-            } }, z(Y.date, i.options, i))
+            } }, D(K.date, i.options, i))
           ) : (
             // biome-ignore lint/a11y/useSemanticElements: breaking change
-            T.createElement(o.CaptionLabel, { className: s[A.CaptionLabel], role: "status", "aria-live": "polite" }, z(Y.date, i.options, i))
+            T.createElement(o.CaptionLabel, { className: s[B.CaptionLabel], role: "status", "aria-live": "polite" }, D(K.date, i.options, i))
           )),
           h === "around" && !t.hideNavigation && re === p - 1 && T.createElement(
             o.NextMonthButton,
-            { type: "button", className: s[A.NextMonthButton], tabIndex: $e ? void 0 : -1, "aria-disabled": $e ? void 0 : !0, "aria-label": ta($e), onClick: Qo, "data-animated-button": t.animate ? "true" : void 0 },
-            T.createElement(o.Chevron, { disabled: $e ? void 0 : !0, className: s[A.Chevron], orientation: t.dir === "rtl" ? "left" : "right" })
+            { type: "button", className: s[B.NextMonthButton], tabIndex: $e ? void 0 : -1, "aria-disabled": $e ? void 0 : !0, "aria-label": ta($e), onClick: Qo, "data-animated-button": t.animate ? "true" : void 0 },
+            T.createElement(o.Chevron, { disabled: $e ? void 0 : !0, className: s[B.Chevron], orientation: t.dir === "rtl" ? "left" : "right" })
           ),
-          re === p - 1 && h === "after" && !t.hideNavigation && T.createElement(o.Nav, { "data-animated-nav": t.animate ? "true" : void 0, className: s[A.Nav], style: w == null ? void 0 : w[A.Nav], "aria-label": Yn(), onPreviousClick: Jo, onNextClick: Qo, previousMonth: ye, nextMonth: $e }),
+          re === p - 1 && h === "after" && !t.hideNavigation && T.createElement(o.Nav, { "data-animated-nav": t.animate ? "true" : void 0, className: s[B.Nav], style: k == null ? void 0 : k[B.Nav], "aria-label": Yn(), onPreviousClick: Jo, onNextClick: Qo, previousMonth: ye, nextMonth: $e }),
           T.createElement(
             o.MonthGrid,
-            { role: "grid", "aria-multiselectable": u === "multiple" || u === "range", "aria-label": Js(Y.date, i.options, i) || void 0, className: s[A.MonthGrid], style: w == null ? void 0 : w[A.MonthGrid] },
+            { role: "grid", "aria-multiselectable": u === "multiple" || u === "range", "aria-label": Js(K.date, i.options, i) || void 0, className: s[B.MonthGrid], style: k == null ? void 0 : k[B.MonthGrid] },
             !t.hideWeekdays && T.createElement(
               o.Weekdays,
-              { "data-animated-weekdays": t.animate ? "true" : void 0, className: s[A.Weekdays], style: w == null ? void 0 : w[A.Weekdays] },
-              S && T.createElement(o.WeekNumberHeader, { "aria-label": ra(i.options), className: s[A.WeekNumberHeader], style: w == null ? void 0 : w[A.WeekNumberHeader], scope: "col" }, q()),
-              sa.map((G) => T.createElement(o.Weekday, { "aria-label": oa(G, i.options, i), className: s[A.Weekday], key: String(G), style: w == null ? void 0 : w[A.Weekday], scope: "col" }, H(G, i.options, i)))
+              { "data-animated-weekdays": t.animate ? "true" : void 0, className: s[B.Weekdays], style: k == null ? void 0 : k[B.Weekdays] },
+              S && T.createElement(o.WeekNumberHeader, { "aria-label": ra(i.options), className: s[B.WeekNumberHeader], style: k == null ? void 0 : k[B.WeekNumberHeader], scope: "col" }, G()),
+              sa.map((Y) => T.createElement(o.Weekday, { "aria-label": oa(Y, i.options, i), className: s[B.Weekday], key: String(Y), style: k == null ? void 0 : k[B.Weekday], scope: "col" }, j(Y, i.options, i)))
             ),
-            T.createElement(o.Weeks, { "data-animated-weeks": t.animate ? "true" : void 0, className: s[A.Weeks], style: w == null ? void 0 : w[A.Weeks] }, Y.weeks.map((G) => T.createElement(
+            T.createElement(o.Weeks, { "data-animated-weeks": t.animate ? "true" : void 0, className: s[B.Weeks], style: k == null ? void 0 : k[B.Weeks] }, K.weeks.map((Y) => T.createElement(
               o.Week,
-              { className: s[A.Week], key: G.weekNumber, style: w == null ? void 0 : w[A.Week], week: G },
+              { className: s[B.Week], key: Y.weekNumber, style: k == null ? void 0 : k[B.Week], week: Y },
               S && // biome-ignore lint/a11y/useSemanticElements: react component
-              T.createElement(o.WeekNumber, { week: G, style: w == null ? void 0 : w[A.WeekNumber], "aria-label": na(G.weekNumber, {
+              T.createElement(o.WeekNumber, { week: Y, style: k == null ? void 0 : k[B.WeekNumber], "aria-label": na(Y.weekNumber, {
                 locale: a
-              }), className: s[A.WeekNumber], scope: "row", role: "rowheader" }, L(G.weekNumber, i)),
-              G.days.map((ae) => {
+              }), className: s[B.WeekNumber], scope: "row", role: "rowheader" }, R(Y.weekNumber, i)),
+              Y.days.map((ae) => {
                 const { date: Te } = ae, X = Z(ae);
                 if (X[de.focused] = !X.hidden && !!(ko != null && ko.isEqualTo(ae)), X[qe.selected] = (ne == null ? void 0 : ne(Te)) || X.selected, Wn(Qe)) {
                   const { from: en, to: tn } = Qe;
                   X[qe.range_start] = !!(en && tn && i.isSameDay(Te, en)), X[qe.range_end] = !!(en && tn && i.isSameDay(Te, tn)), X[qe.range_middle] = ft(Qe, Te, !0, i);
                 }
-                const va = sf(X, w, t.modifiersStyles), xa = Ug(X, s, t.modifiersClassNames), wa = !Kn && !X.hidden ? Xs(Te, X, i.options, i) : void 0;
+                const va = sf(X, k, t.modifiersStyles), xa = Ug(X, s, t.modifiersClassNames), wa = !Kn && !X.hidden ? Xs(Te, X, i.options, i) : void 0;
                 return (
                   // biome-ignore lint/a11y/useSemanticElements: react component
-                  T.createElement(o.Day, { key: `${i.format(Te, "yyyy-MM-dd")}_${i.format(ae.displayMonth, "yyyy-MM")}`, day: ae, modifiers: X, className: xa.join(" "), style: va, role: "gridcell", "aria-selected": X.selected || void 0, "aria-label": wa, "data-day": i.format(Te, "yyyy-MM-dd"), "data-month": ae.outside ? i.format(Te, "yyyy-MM") : void 0, "data-selected": X.selected || void 0, "data-disabled": X.disabled || void 0, "data-hidden": X.hidden || void 0, "data-outside": ae.outside || void 0, "data-focused": X.focused || void 0, "data-today": X.today || void 0 }, !X.hidden && Kn ? T.createElement(o.DayButton, { className: s[A.DayButton], style: w == null ? void 0 : w[A.DayButton], type: "button", day: ae, modifiers: X, disabled: X.disabled || void 0, tabIndex: qs(ae) ? 0 : -1, "aria-label": Zs(Te, X, i.options, i), onClick: aa(ae, X), onBlur: ca(ae, X), onFocus: la(ae, X), onKeyDown: da(ae, X), onMouseEnter: ua(ae, X), onMouseLeave: ha(ae, X) }, _(Te, i.options, i)) : !X.hidden && _(ae.date, i.options, i))
+                  T.createElement(o.Day, { key: `${i.format(Te, "yyyy-MM-dd")}_${i.format(ae.displayMonth, "yyyy-MM")}`, day: ae, modifiers: X, className: xa.join(" "), style: va, role: "gridcell", "aria-selected": X.selected || void 0, "aria-label": wa, "data-day": i.format(Te, "yyyy-MM-dd"), "data-month": ae.outside ? i.format(Te, "yyyy-MM") : void 0, "data-selected": X.selected || void 0, "data-disabled": X.disabled || void 0, "data-hidden": X.hidden || void 0, "data-outside": ae.outside || void 0, "data-focused": X.focused || void 0, "data-today": X.today || void 0 }, !X.hidden && Kn ? T.createElement(o.DayButton, { className: s[B.DayButton], style: k == null ? void 0 : k[B.DayButton], type: "button", day: ae, modifiers: X, disabled: X.disabled || void 0, tabIndex: qs(ae) ? 0 : -1, "aria-label": Zs(Te, X, i.options, i), onClick: aa(ae, X), onBlur: ca(ae, X), onFocus: la(ae, X), onKeyDown: da(ae, X), onMouseEnter: ua(ae, X), onMouseLeave: ha(ae, X) }, _(Te, i.options, i)) : !X.hidden && _(ae.date, i.options, i))
                 );
               })
             )))
@@ -8679,11 +8682,11 @@ function Hf(e) {
         ))
       ),
       t.footer && // biome-ignore lint/a11y/useSemanticElements: react component
-      T.createElement(o.Footer, { className: s[A.Footer], style: w == null ? void 0 : w[A.Footer], role: "status", "aria-live": "polite" }, t.footer)
+      T.createElement(o.Footer, { className: s[B.Footer], style: k == null ? void 0 : k[B.Footer], role: "status", "aria-live": "polite" }, t.footer)
     )
   );
 }
-const Xx = F(({ ...e }) => /* @__PURE__ */ c(Uf, { mode: "single", ...e })), Uf = g(Hf)`
+const Xx = A(({ ...e }) => /* @__PURE__ */ c(Uf, { mode: "single", ...e })), Uf = g(Hf)`
   font-family: ${l("font-family-default")};
 `, Gf = ({
   disabled: e,
@@ -8700,25 +8703,25 @@ const Xx = F(({ ...e }) => /* @__PURE__ */ c(Uf, { mode: "single", ...e })), Uf
   onSelect: p,
   onKeyDown: f
 }) => {
-  var z, _;
-  const m = V(n);
+  var D, _;
+  const m = H(n);
   U(() => {
     m.current = n;
   }, [n]);
   const b = I(
-    (D) => {
-      let L = h == null ? void 0 : h(D), q = u == null ? void 0 : u(D), H;
-      return D && Xn.forEach(o, (P) => {
-        Ct(P) && P.props.optionKey && P.props.optionKey === D && (H = P);
-      }), H !== void 0 && Ct(H) && H.props.label && (q = q ?? H.props.label, L = L ?? H.props.prefixIconId), { label: q ?? "", iconId: L };
+    (z) => {
+      let R = h == null ? void 0 : h(z), G = u == null ? void 0 : u(z), j;
+      return z && Xn.forEach(o, (P) => {
+        Ct(P) && P.props.optionKey && P.props.optionKey === z && (j = P);
+      }), j !== void 0 && Ct(j) && j.props.label && (G = G ?? j.props.label, R = R ?? j.props.prefixIconId), { label: G ?? "", iconId: R };
     },
     [o, h, u]
   ), y = I(
-    (D, L) => {
-      let q = null;
-      return Xn.forEach(D, (H, P) => {
-        Ct(H) && H.props.optionKey && H.props.optionKey === L && (q = P);
-      }), q;
+    (z, R) => {
+      let G = null;
+      return Xn.forEach(z, (j, P) => {
+        Ct(j) && j.props.optionKey && j.props.optionKey === R && (G = P);
+      }), G;
     },
     []
   ), [x, v] = W(
@@ -8727,15 +8730,15 @@ const Xx = F(({ ...e }) => /* @__PURE__ */ c(Uf, { mode: "single", ...e })), Uf
   U(() => {
     v(y(o, m.current));
   }, [o, y]);
-  const [C, k] = W(
-    (z = b(n)) == null ? void 0 : z.label
-  ), [S, w] = W(
+  const [C, w] = W(
+    (D = b(n)) == null ? void 0 : D.label
+  ), [S, k] = W(
     (_ = b(n)) == null ? void 0 : _.iconId
   );
   return U(() => {
-    const D = b(n);
-    k(D == null ? void 0 : D.label), w(D == null ? void 0 : D.iconId);
-  }, [n, b]), /* @__PURE__ */ c(Q, { children: ({ cx: D }) => /* @__PURE__ */ c(
+    const z = b(n);
+    w(z == null ? void 0 : z.label), k(z == null ? void 0 : z.iconId);
+  }, [n, b]), /* @__PURE__ */ c(Q, { children: ({ cx: z }) => /* @__PURE__ */ c(
     Kf,
     {
       onSelect: p,
@@ -8757,7 +8760,7 @@ const Xx = F(({ ...e }) => /* @__PURE__ */ c(Uf, { mode: "single", ...e })), Uf
           type: "text",
           placeholder: i,
           autoComplete: "off",
-          className: D(d, "form-input"),
+          className: z(d, "form-input"),
           suffixIconId: "Down",
           suffixIconColor: e ? "grey" : "black"
         }
@@ -8796,7 +8799,7 @@ const Xx = F(({ ...e }) => /* @__PURE__ */ c(Uf, { mode: "single", ...e })), Uf
   cursor: default;
   border-bottom: 0.5px solid ${l("color-grey60")};
   pointer-events: none;
-`, Qx = F(
+`, Qx = A(
   ({ title: e, message: t }) => /* @__PURE__ */ $(Xf, { children: [
     /* @__PURE__ */ c(E, { variant: "body", bold: !0, children: e }),
     /* @__PURE__ */ c(E, { variant: "body", color: "grey", children: t })
@@ -8827,7 +8830,7 @@ const Xx = F(({ ...e }) => /* @__PURE__ */ c(Uf, { mode: "single", ...e })), Uf
       return t(r, s);
     },
     [t]
-  ), n = j(() => ({
+  ), n = V(() => ({
     ...e.control,
     register: o
   }), [e.control, o]);
@@ -8871,7 +8874,7 @@ function em({
     }
   ) });
 }
-const tm = F(() => /* @__PURE__ */ c(
+const tm = A(() => /* @__PURE__ */ c(
   "svg",
   {
     width: "12",
@@ -8887,7 +8890,7 @@ const tm = F(() => /* @__PURE__ */ c(
       }
     )
   }
-)), om = (e) => e === void 0 ? /* @__PURE__ */ c(tm, {}) : e ? /* @__PURE__ */ c(N, { iconId: "Check", color: "green", size: "sm" }) : /* @__PURE__ */ c(N, { iconId: "Close", color: "red", size: "sm" }), nm = F(
+)), om = (e) => e === void 0 ? /* @__PURE__ */ c(tm, {}) : e ? /* @__PURE__ */ c(N, { iconId: "Check", color: "green", size: "sm" }) : /* @__PURE__ */ c(N, { iconId: "Close", color: "red", size: "sm" }), nm = A(
   ({
     isBlank: e,
     requirements: t,
@@ -8943,9 +8946,9 @@ const tm = F(() => /* @__PURE__ */ c(
     id: "tooSimilar"
   },
   ...ps
-], e1 = F(
+], e1 = A(
   ({ name: e, t, hasLabel: o, includeTooSimilar: n }) => {
-    const { getFieldState: r, formState: i } = lm(), { error: a, isDirty: s } = r(e ?? "password", i), d = j(() => {
+    const { getFieldState: r, formState: i } = lm(), { error: a, isDirty: s } = r(e ?? "password", i), d = V(() => {
       const u = (a == null ? void 0 : a.types) ?? {}, h = [];
       return !u.minLength && !u.required && h.push("length"), !u.tooSimilar && n && h.push("tooSimilar"), !u[Do.noDigit] && !u[Do.noUpperCase] && h.push("uppercaseAndNumber"), u[Do.noSpecialCharacter] || h.push("specialCharacter"), h;
     }, [a == null ? void 0 : a.types, n]);
@@ -8997,7 +9000,7 @@ const tm = F(() => /* @__PURE__ */ c(
   }
 `;
 Be.displayName = "FormLabel";
-const [mn] = O(["form"]), vt = F(
+const [mn] = O(["form"]), vt = A(
   ({ handleError: e, name: t, hasLabel: o }) => {
     const { getFieldState: n, formState: r } = Se(), { error: i } = n(t, r);
     if (!i)
@@ -9196,13 +9199,13 @@ const [mn] = O(["form"]), vt = F(
     field: { ref: m, ...b },
     fieldState: { error: y }
   } = Ae({ name: e, control: f, rules: p, disabled: t }), x = _e(), { onChange: v } = b, C = I(
-    (k) => {
-      v(k), h && h(k);
+    (w) => {
+      v(w), h && h(w);
     },
     [v, h]
   );
-  return /* @__PURE__ */ c(Q, { children: ({ cx: k }) => /* @__PURE__ */ $(ct, { children: [
-    /* @__PURE__ */ $(dt, { className: k({ hasLabel: !!o }), children: [
+  return /* @__PURE__ */ c(Q, { children: ({ cx: w }) => /* @__PURE__ */ $(ct, { children: [
+    /* @__PURE__ */ $(dt, { className: w({ hasLabel: !!o }), children: [
       o && /* @__PURE__ */ c(
         Be,
         {
@@ -9253,15 +9256,15 @@ const [mn] = O(["form"]), vt = F(
   ...y
 }, x) => {
   const { control: v } = Se(), {
-    field: { ref: C, ...k },
+    field: { ref: C, ...w },
     fieldState: { error: S }
-  } = Ae({ name: e, control: v, rules: y, disabled: t }), w = _e(), z = Gt([C, x]);
+  } = Ae({ name: e, control: v, rules: y, disabled: t }), k = _e(), D = Gt([C, x]);
   return /* @__PURE__ */ c(Q, { children: ({ cx: _ }) => /* @__PURE__ */ $(ct, { children: [
     /* @__PURE__ */ $(dt, { className: _({ hasLabel: !!o }), children: [
       o && /* @__PURE__ */ c(
         Be,
         {
-          formItemId: w,
+          formItemId: k,
           isValid: !S,
           required: !!y.required,
           children: o
@@ -9270,15 +9273,15 @@ const [mn] = O(["form"]), vt = F(
       /* @__PURE__ */ c(
         bo,
         {
-          ...k,
-          onChange: (D) => {
-            y.autoTrim ? k.onChange(D.target.value.trim()) : k.onChange(D.target.value);
+          ...w,
+          onChange: (z) => {
+            y.autoTrim ? w.onChange(z.target.value.trim()) : w.onChange(z.target.value);
           },
-          id: w,
+          id: k,
           type: r,
           autoFocus: f,
           placeholder: n,
-          ref: z,
+          ref: D,
           autoComplete: "off",
           prefixIconColor: d,
           prefixIconId: s,
@@ -9470,7 +9473,7 @@ const [mn] = O(["form"]), vt = F(
   align-items: center;
   justify-content: flex-start;
   column-gap: ${uo("label-column-gap")};
-`, a1 = F(
+`, a1 = A(
   ({ nameBlackList: e, maxLength: t, t: o, ...n }) => {
     const r = I(
       (i) => eu.test(i) ? t && i.length > t ? (o == null ? void 0 : o("form.tooLongName")) ?? `Cannot be longer than ${t}.` : e && e.includes(i) ? (o == null ? void 0 : o("form.duplicateName")) ?? "This name is already taken" : !0 : (o == null ? void 0 : o("form.noLeadingOrTrailingSpacesName")) ?? "Cannot have leading or trailing spaces.",
@@ -9506,13 +9509,13 @@ const [mn] = O(["form"]), vt = F(
 }) => {
   const { control: x } = Se(), {
     field: { ref: v, ...C },
-    fieldState: { error: k }
-  } = Ae({ name: e, control: x, rules: y, disabled: t }), S = _e(), w = I(
-    (_, D) => {
-      C.onChange(D ?? "");
+    fieldState: { error: w }
+  } = Ae({ name: e, control: x, rules: y, disabled: t }), S = _e(), k = I(
+    (_, z) => {
+      C.onChange(z ?? "");
     },
     [C]
-  ), z = j(() => {
+  ), D = V(() => {
     if (C.value)
       return {
         id: C.value,
@@ -9525,7 +9528,7 @@ const [mn] = O(["form"]), vt = F(
         Be,
         {
           formItemId: S,
-          isValid: !k,
+          isValid: !w,
           required: !!y.required,
           children: o
         }
@@ -9534,8 +9537,8 @@ const [mn] = O(["form"]), vt = F(
         Cp,
         {
           options: m,
-          selected: z,
-          onSelectionChange: w,
+          selected: D,
+          onSelectionChange: k,
           children: /* @__PURE__ */ $(km, { children: [
             /* @__PURE__ */ c(On, { variant: "body", color: "dark", children: C.value }),
             /* @__PURE__ */ c($m, { children: /* @__PURE__ */ c(N, { iconId: "Down", size: "sm", color: "black" }) })
@@ -9571,7 +9574,7 @@ const [mn] = O(["form"]), vt = F(
   placeholder: i,
   ...a
 }) => {
-  const { control: s } = Se(), d = V(null), {
+  const { control: s } = Se(), d = H(null), {
     field: { ref: u, value: h, onChange: p, ...f },
     fieldState: { error: m }
   } = Ae({ name: e, control: s, rules: a, disabled: t }), b = _e(), y = Gt([u, d]), x = I(() => {
@@ -9581,18 +9584,18 @@ const [mn] = O(["form"]), vt = F(
   }, []), C = I(
     (S) => {
       S.preventDefault();
-      let w = !1;
+      let k = !1;
       if (S.dataTransfer.items.length)
-        for (let z = 0; z < S.dataTransfer.items.length && !w; z++) {
-          const _ = S.dataTransfer.items[z];
+        for (let D = 0; D < S.dataTransfer.items.length && !k; D++) {
+          const _ = S.dataTransfer.items[D];
           if (_.kind === "file") {
-            const D = _.getAsFile();
-            D && (w = !0, p(D));
+            const z = _.getAsFile();
+            z && (k = !0, p(z));
           }
         }
     },
     [p]
-  ), k = I(() => {
+  ), w = I(() => {
     p(void 0);
   }, [p]);
   return /* @__PURE__ */ c(Q, { children: ({ cx: S }) => /* @__PURE__ */ $(ct, { children: [
@@ -9612,7 +9615,7 @@ const [mn] = O(["form"]), vt = F(
         /* @__PURE__ */ c(
           _m,
           {
-            onClick: k,
+            onClick: w,
             iconId: "Close",
             size: "sm",
             color: "black"
@@ -9636,8 +9639,8 @@ const [mn] = O(["form"]), vt = F(
           value: h == null ? void 0 : h.fileName,
           ...f,
           id: b,
-          onChange: (w) => {
-            w.target.files && p(w.target.files[0]);
+          onChange: (k) => {
+            k.target.files && p(k.target.files[0]);
           },
           type: "file",
           ref: y
@@ -9697,13 +9700,13 @@ const [mn] = O(["form"]), vt = F(
     field: { value: b, onChange: y },
     fieldState: { error: x }
   } = Ae({ name: e, control: m, rules: f, disabled: t }), v = _e(), C = I(
-    (k) => {
-      y(k);
+    (w) => {
+      y(w);
     },
     [y]
   );
-  return /* @__PURE__ */ c(Q, { children: ({ cx: k }) => /* @__PURE__ */ $(ct, { children: [
-    /* @__PURE__ */ $(dt, { className: k({ hasLabel: !!o }), children: [
+  return /* @__PURE__ */ c(Q, { children: ({ cx: w }) => /* @__PURE__ */ $(ct, { children: [
+    /* @__PURE__ */ $(dt, { className: w({ hasLabel: !!o }), children: [
       o && /* @__PURE__ */ c(
         Be,
         {
@@ -9840,14 +9843,14 @@ const Mm = se(
     disableSelectionStyling: s = !1
   }) => {
     var x;
-    const d = be(Jt), u = j(() => {
+    const d = be(Jt), u = V(() => {
       if (!n)
         return;
       if (typeof n == "function")
         return n(e);
       const v = e.type;
       return v ? n[v] : void 0;
-    }, [n, e]), h = j(() => {
+    }, [n, e]), h = V(() => {
       if (!(r != null && r.length))
         return;
       const v = t.originalItems.get(e.id);
@@ -9911,7 +9914,7 @@ const Mm = se(
         b && !y && x,
         !b && !y && v,
         (() => {
-          const C = e.items, k = (_) => /* @__PURE__ */ c(
+          const C = e.items, w = (_) => /* @__PURE__ */ c(
             Mm,
             {
               item: _,
@@ -9926,25 +9929,25 @@ const Mm = se(
             _.id
           );
           if (!p)
-            return C.map(k);
-          const S = [], w = /* @__PURE__ */ new Map();
+            return C.map(w);
+          const S = [], k = /* @__PURE__ */ new Map();
           for (const _ of C) {
-            const D = p(_);
-            if (D === void 0)
+            const z = p(_);
+            if (z === void 0)
               S.push(_);
             else {
-              const L = w.get(D);
-              L ? L.push(_) : w.set(D, [_]);
+              const R = k.get(z);
+              R ? R.push(_) : k.set(z, [_]);
             }
           }
-          const z = Array.from(w.keys()).sort(
-            (_, D) => _.localeCompare(D)
+          const D = Array.from(k.keys()).sort(
+            (_, z) => _.localeCompare(z)
           );
           return /* @__PURE__ */ $(pe, { children: [
-            S.map(k),
-            z.map((_) => /* @__PURE__ */ $(T.Fragment, { children: [
+            S.map(w),
+            D.map((_) => /* @__PURE__ */ $(T.Fragment, { children: [
               /* @__PURE__ */ c(xs, { groupName: _ }),
-              (w.get(_) ?? []).map(k)
+              (k.get(_) ?? []).map(w)
             ] }, `group-${_}`))
           ] });
         })()
@@ -9968,12 +9971,12 @@ const Mm = se(
     viewAction: n,
     ...r
   }) => {
-    const i = j(() => ({
+    const i = V(() => ({
       selected: e,
       isSelected: (d) => e.includes(d),
       toggleSelection: t,
       isDisabled: !!o
-    }), [e, t, o]), a = j(() => {
+    }), [e, t, o]), a = V(() => {
       if (n)
         return {
           viewing: n.viewing,
@@ -9983,9 +9986,9 @@ const Mm = se(
     let s = /* @__PURE__ */ c(Jt.Provider, { value: i, children: /* @__PURE__ */ c(Om, { ...r }) });
     return a && (s = /* @__PURE__ */ c(ws.Provider, { value: a, children: s })), s;
   }
-), [bn, Rm] = O(["option", "select"]), Cr = 3, wo = F(
+), [bn, Rm] = O(["option", "select"]), Cr = 3, wo = A(
   ({ actions: e, isSelected: t = !1, disableSelectionStyling: o = !1 }) => {
-    const { inlinePrimary: n, overflowPrimary: r, secondary: i } = j(() => {
+    const { inlinePrimary: n, overflowPrimary: r, secondary: i } = V(() => {
       const p = e.filter((m) => m.isPrimary), f = e.filter((m) => !m.isPrimary);
       return {
         // First MAX_PRIMARY_ACTIONS primary actions shown inline
@@ -9995,7 +9998,7 @@ const Mm = se(
         // All secondary actions go to overflow
         secondary: f
       };
-    }, [e]), a = r.length > 0 || i.length > 0, s = t && !o ? "white" : void 0, d = j(() => {
+    }, [e]), a = r.length > 0 || i.length > 0, s = t && !o ? "white" : void 0, d = V(() => {
       const p = /* @__PURE__ */ new Map();
       for (const f of e)
         p.set(f.id, f);
@@ -10154,7 +10157,7 @@ const ks = T.createContext(
   dataProvider: t,
   onListItemAction: o
 }) => {
-  const [n, r] = W(), i = j(() => t ? {
+  const [n, r] = W(), i = V(() => t ? {
     action: o,
     data: n
   } : {
@@ -10201,7 +10204,7 @@ const ks = T.createContext(
       isDisabled: b
     } = Je(), y = f.includes(e), x = u || b, v = I(() => {
       x || m(e);
-    }, [e, m, x]), C = typeof p == "string" ? Number(p) : p, k = h > 0 ? { marginLeft: `${h * C}px` } : void 0;
+    }, [e, m, x]), C = typeof p == "string" ? Number(p) : p, w = h > 0 ? { marginLeft: `${h * C}px` } : void 0;
     return /* @__PURE__ */ $(
       Pm,
       {
@@ -10210,7 +10213,7 @@ const ks = T.createContext(
         $isSelected: y,
         $isDisabled: x,
         "data-depth": h,
-        style: k,
+        style: w,
         children: [
           /* @__PURE__ */ c(
             Xt,
@@ -10305,7 +10308,7 @@ const Pm = g.div`
       isDisabled: y
     } = Je(), x = I(() => {
       !u && !y && b(e);
-    }, [e, b, u, y]), v = m.includes(e), C = u || y, k = typeof p == "string" ? Number(p) : p, S = h > 0 ? { marginLeft: `${h * k}px` } : void 0;
+    }, [e, b, u, y]), v = m.includes(e), C = u || y, w = typeof p == "string" ? Number(p) : p, S = h > 0 ? { marginLeft: `${h * w}px` } : void 0;
     return /* @__PURE__ */ $(
       Km,
       {
@@ -10322,15 +10325,15 @@ const Pm = g.div`
             /* @__PURE__ */ c(E, { variant: "body", bold: v, children: t }),
             o && /* @__PURE__ */ c(Zm, { variant: "small", color: "dark", children: o })
           ] }) }),
-          s && s.length > 0 && /* @__PURE__ */ c(Xm, { children: s.map((w) => /* @__PURE__ */ c(
+          s && s.length > 0 && /* @__PURE__ */ c(Xm, { children: s.map((k) => /* @__PURE__ */ c(
             Jm,
             {
               size: "sm",
-              iconId: w.iconId,
-              color: v && !f ? "white" : w.color,
-              title: w.tooltip
+              iconId: k.iconId,
+              color: v && !f ? "white" : k.color,
+              title: k.tooltip
             },
-            w.id
+            k.id
           )) }),
           a && a.length > 0 && /* @__PURE__ */ c(
             wo,
@@ -10409,24 +10412,24 @@ const Km = g.div`
       selected: f,
       toggleSelection: m,
       isDisabled: b
-    } = Je(), { viewing: y, onItemView: x } = Nm(), v = V(null), C = f.includes(e), k = y === e, S = u || b, w = I(() => {
+    } = Je(), { viewing: y, onItemView: x } = Nm(), v = H(null), C = f.includes(e), w = y === e, S = u || b, k = I(() => {
       S || m(e);
-    }, [e, m, S]), z = I(
-      (L) => {
-        v.current && v.current.contains(L.target) || S || x(e);
+    }, [e, m, S]), D = I(
+      (R) => {
+        v.current && v.current.contains(R.target) || S || x(e);
       },
       [e, x, S]
-    ), _ = typeof p == "string" ? Number(p) : p, D = h > 0 ? { marginLeft: `${h * _}px` } : void 0;
+    ), _ = typeof p == "string" ? Number(p) : p, z = h > 0 ? { marginLeft: `${h * _}px` } : void 0;
     return /* @__PURE__ */ $(
       tb,
       {
         className: d,
-        onClick: z,
+        onClick: D,
         $isSelected: C,
-        $isViewing: k,
+        $isViewing: w,
         $isDisabled: S,
         "data-depth": h,
-        style: D,
+        style: z,
         children: [
           /* @__PURE__ */ c(
             Mi,
@@ -10434,7 +10437,7 @@ const Km = g.div`
               ref: v,
               checked: C,
               disabled: S,
-              onChange: w
+              onChange: k
             }
           ),
           r && /* @__PURE__ */ c(N, { size: "sm", iconId: r, color: i }),
@@ -10442,15 +10445,15 @@ const Km = g.div`
             /* @__PURE__ */ c(E, { variant: "body", bold: C, children: t }),
             o && /* @__PURE__ */ c(nb, { variant: "small", color: "dark", children: o })
           ] }) }),
-          s && s.length > 0 && /* @__PURE__ */ c(rb, { children: s.map((L) => /* @__PURE__ */ c(
+          s && s.length > 0 && /* @__PURE__ */ c(rb, { children: s.map((R) => /* @__PURE__ */ c(
             ib,
             {
               size: "sm",
-              iconId: L.iconId,
-              color: L.color,
-              title: L.tooltip
+              iconId: R.iconId,
+              color: R.color,
+              title: R.tooltip
             },
-            L.id
+            R.id
           )) }),
           a && a.length > 0 && /* @__PURE__ */ c(wo, { actions: a, isSelected: C }),
           /* @__PURE__ */ c(sb, { children: /* @__PURE__ */ c(N, { iconId: "Right", color: "blue", size: "sm" }) })
@@ -11190,7 +11193,7 @@ const ub = g.div`
   }) => {
     const [u, h] = W(
       o ?? []
-    ), p = V(u ?? []);
+    ), p = H(u ?? []);
     Ie(() => {
       p.current = u;
     }, [u]), U(() => {
@@ -11207,7 +11210,7 @@ const ub = g.div`
     ), m = I(
       (y) => p.current.includes(y),
       []
-    ), b = j(() => ({
+    ), b = V(() => ({
       isSelected: m,
       selected: u,
       toggleSelection: f,
@@ -11278,7 +11281,7 @@ function v1(e) {
   U(() => {
     n(e.openedGroups ?? []);
   }, [e.openedGroups]);
-  const i = j(() => ({ openedGroups: o, toggleGroup: r }), [o, r]);
+  const i = V(() => ({ openedGroups: o, toggleGroup: r }), [o, r]);
   return /* @__PURE__ */ c(_s.Provider, { value: i, children: /* @__PURE__ */ c(
     Pn,
     {
@@ -11368,7 +11371,7 @@ const fb = () => {
 `, kb = g(Vn)`
   height: initial;
   padding: 0;
-`, $b = F(
+`, $b = A(
   ({
     className: e,
     disabled: t,
@@ -11436,7 +11439,7 @@ const fb = () => {
     ) }),
     /* @__PURE__ */ c(Ib, { children: /* @__PURE__ */ c(E, { variant: "body", children: e.name }) })
   ] });
-}, [ot] = O(["named-list-item"]), $1 = F(
+}, [ot] = O(["named-list-item"]), $1 = A(
   ({
     id: e,
     iconId: t,
@@ -11650,7 +11653,7 @@ const Ts = ve(null), Ob = se(
     setOpenedBranches: n,
     dataProvider: r
   }) => {
-    const [i, a] = W([]), s = o ?? i, d = n ?? a, u = V(s);
+    const [i, a] = W([]), s = o ?? i, d = n ?? a, u = H(s);
     Ie(() => {
       u.current = s;
     }, [s]);
@@ -11659,15 +11662,15 @@ const Ts = ve(null), Ob = se(
         if (!(r != null && r.tree))
           return;
         const m = f[r.idKey], b = u.current.includes(m), y = (v) => v.branches.flatMap((C) => {
-          const k = C[r.idKey];
-          return C.branches.length ? [k, ...y(C)] : [];
+          const w = C[r.idKey];
+          return C.branches.length ? [w, ...y(C)] : [];
         }), x = y(f);
         if (t) {
-          const v = [], C = (k) => {
-            const S = k[r.parentIdKey];
+          const v = [], C = (w) => {
+            const S = w[r.parentIdKey];
             if (S) {
-              const w = r.itemsById[S];
-              w && (v.push(S), C(w));
+              const k = r.itemsById[S];
+              k && (v.push(S), C(k));
             }
           };
           C(f), d(
@@ -11688,7 +11691,7 @@ const Ts = ve(null), Ob = se(
         d,
         t
       ]
-    ), p = j(() => ({ openedBranches: s, toggleBranch: h }), [s, h]);
+    ), p = V(() => ({ openedBranches: s, toggleBranch: h }), [s, h]);
     return (
       // @ts-expect-error Generics and context dont play well together, since context has to be statically typed.
       /* @__PURE__ */ c(Ts.Provider, { value: p, children: e })
@@ -11822,7 +11825,7 @@ const Ms = ve(null), Ab = () => {
     isNodeSelectable: x,
     branchContentRenderer: v,
     itemContentRenderer: C,
-    disableSelectionStyling: k = !1
+    disableSelectionStyling: w = !1
   }) => {
     const S = Ab();
     U(() => {
@@ -11839,14 +11842,14 @@ const Ms = ve(null), Ab = () => {
       t,
       b
     ]);
-    const w = j(() => {
+    const k = V(() => {
       if (!p)
         return;
       if (typeof p == "function")
         return p(e);
       const Z = e.type;
       return Z ? p[Z] : void 0;
-    }, [p, e]), z = j(() => {
+    }, [p, e]), D = V(() => {
       if (!(f != null && f.length))
         return;
       const Z = t.originalItems.get(e.id);
@@ -11872,7 +11875,7 @@ const Ms = ve(null), Ab = () => {
           color: Z.color,
           tooltip: Z.tooltip
         }));
-    })(), D = async () => {
+    })(), z = async () => {
       if (S.openedBranches.includes(e.id))
         i == null || i(e.id);
       else if (e.loadingState.status === "idle") {
@@ -11880,12 +11883,12 @@ const Ms = ve(null), Ab = () => {
         ne && (await (r == null ? void 0 : r(e.id, ne)), await t.expandBranch(e.id, ne));
       }
       S.toggleBranch(e.id);
-    }, L = () => {
+    }, R = () => {
       const Z = t.originalItems.get(e.id);
       Z && (s == null || s(e.id, Z));
-    }, q = Je();
+    }, G = Je();
     if (e.isLeaf) {
-      const Z = Fb(n) ? n.build(e) : n, ne = q.selected.includes(e.id), ut = C ? C(e, ne) : void 0, Qe = Ro(e);
+      const Z = Fb(n) ? n.build(e) : n, ne = G.selected.includes(e.id), ut = C ? C(e, ne) : void 0, Qe = Ro(e);
       return /* @__PURE__ */ c(
         Z,
         {
@@ -11895,17 +11898,17 @@ const Ms = ve(null), Ab = () => {
           onListItemAction: a,
           "data-depth": h,
           "data-indent-size": y,
-          "data-disable-selection-styling": k,
-          iconId: w == null ? void 0 : w.iconId,
-          iconColor: w == null ? void 0 : w.color,
-          actions: z,
+          "data-disable-selection-styling": w,
+          iconId: k == null ? void 0 : k.iconId,
+          iconColor: k == null ? void 0 : k.color,
+          actions: D,
           decorators: _,
           children: ut
         },
         e.id
       );
     }
-    const H = Es(o) ? o.build(e) : o, P = b || S.openedBranches.includes(e.id), J = e.loadingState.status === "loading", he = e.loadingState.status === "error", te = e.loadingState.status === "loaded", ee = d === e.id, Le = P ? e.branches.length > 0 ? e.branches.map((Z) => /* @__PURE__ */ c(
+    const j = Es(o) ? o.build(e) : o, P = b || S.openedBranches.includes(e.id), J = e.loadingState.status === "loading", he = e.loadingState.status === "error", te = e.loadingState.status === "loaded", ee = d === e.id, Le = P ? e.branches.length > 0 ? e.branches.map((Z) => /* @__PURE__ */ c(
       Os,
       {
         branch: Z,
@@ -11927,18 +11930,18 @@ const Ms = ve(null), Ab = () => {
         isNodeSelectable: x,
         branchContentRenderer: v,
         itemContentRenderer: C,
-        disableSelectionStyling: k
+        disableSelectionStyling: w
       },
       Z.id
     )) : te && u ? [u] : [] : [], ye = v ? v(e, ee) : void 0, $e = x ? x(e) : !0, oe = Ro(e);
     return /* @__PURE__ */ c(Kt, { children: () => /* @__PURE__ */ c(
-      H,
+      j,
       {
         className: e.className,
         ...e,
         ...oe !== void 0 ? { [No]: oe } : {},
-        onClick: b ? L : D,
-        onSelect: L,
+        onClick: b ? R : z,
+        onSelect: R,
         "data-loading": J,
         "data-error": he,
         "data-open": P,
@@ -11947,10 +11950,10 @@ const Ms = ve(null), Ab = () => {
         "data-depth": h,
         "data-indent-size": y,
         "data-selectable": $e,
-        "data-disable-selection-styling": k,
-        iconId: w == null ? void 0 : w.iconId,
-        iconColor: w == null ? void 0 : w.color,
-        actions: z,
+        "data-disable-selection-styling": w,
+        iconId: k == null ? void 0 : k.iconId,
+        iconColor: k == null ? void 0 : k.color,
+        actions: D,
         decorators: _,
         content: ye,
         children: Le
@@ -11978,14 +11981,14 @@ const Ms = ve(null), Ab = () => {
     nodeDecorators: x,
     expandedMode: v = !1,
     indentSize: C,
-    isNodeSelectable: k,
+    isNodeSelectable: w,
     branchContentRenderer: S,
-    itemContentRenderer: w,
-    disableSelectionStyling: z = !1
+    itemContentRenderer: k,
+    disableSelectionStyling: D = !1
   }) => {
-    const [_, D] = W(!1), [L, q] = W([]), H = f ?? L, P = m ?? q;
+    const [_, z] = W(!1), [R, G] = W([]), j = f ?? R, P = m ?? G;
     U(() => e ? ((async () => {
-      await e.init(), D(!0);
+      await e.init(), z(!0);
     })(), () => {
       e.dispose();
     }) : void 0, [e]), U(() => {
@@ -11994,14 +11997,14 @@ const Ms = ve(null), Ab = () => {
     }, [v, _, e]);
     const J = I(
       (ee) => {
-        const Le = H.includes(ee);
-        P(p ? Le ? [] : [ee] : Le ? H.filter((ye) => ye !== ee) : [...H, ee]);
+        const Le = j.includes(ee);
+        P(p ? Le ? [] : [ee] : Le ? j.filter((ye) => ye !== ee) : [...j, ee]);
       },
-      [H, P, p]
-    ), he = j(() => ({
-      openedBranches: H,
+      [j, P, p]
+    ), he = V(() => ({
+      openedBranches: j,
       toggleBranch: J
-    }), [H, J]);
+    }), [j, J]);
     if (!_ || !e)
       return d || null;
     const te = f && f.length > 0 && e.tree.some((ee) => f.includes(ee.id) && !ee.isLeaf && ee.loadingState.status !== "loaded");
@@ -12030,10 +12033,10 @@ const Ms = ve(null), Ab = () => {
               nodeDecorators: x,
               expandedMode: v,
               indentSize: C,
-              isNodeSelectable: k,
+              isNodeSelectable: w,
               branchContentRenderer: S,
-              itemContentRenderer: w,
-              disableSelectionStyling: z
+              itemContentRenderer: k,
+              disableSelectionStyling: D
             },
             ee.id
           ))
@@ -12053,7 +12056,7 @@ const Ms = ve(null), Ab = () => {
   }) => {
     const [s, d] = W(
       o ?? []
-    ), u = V(s ?? []);
+    ), u = H(s ?? []);
     Ie(() => {
       u.current = s;
     }, [s]), U(() => {
@@ -12070,7 +12073,7 @@ const Ms = ve(null), Ab = () => {
     ), p = I(
       (m) => u.current.includes(m),
       []
-    ), f = j(() => ({
+    ), f = V(() => ({
       isSelected: p,
       selected: s,
       toggleSelection: h,
@@ -12122,43 +12125,43 @@ const Ms = ve(null), Ab = () => {
     const {
       isSelected: v,
       toggleSelection: C,
-      selected: k
-    } = Je(), S = u && k.includes(x.id), w = (L) => {
-      L.stopPropagation(), o == null || o();
-    }, z = () => {
+      selected: w
+    } = Je(), S = u && w.includes(x.id), k = (R) => {
+      R.stopPropagation(), o == null || o();
+    }, D = () => {
       u ? (C(x.id), n == null || n()) : o == null || o();
-    }, _ = typeof d == "string" ? Number(d) : d, D = s > 0 ? { marginLeft: `${s * _}px` } : void 0;
+    }, _ = typeof d == "string" ? Number(d) : d, z = s > 0 ? { marginLeft: `${s * _}px` } : void 0;
     return /* @__PURE__ */ $(
       Hb,
       {
         className: t,
         isOpen: i,
-        style: D,
+        style: z,
         children: [
           /* @__PURE__ */ $(
             Ub,
             {
               "data-loading": r,
               "data-selected": S,
-              onClick: z,
+              onClick: D,
               $isSelected: S,
               $disableSelectionStyling: h,
               children: [
-                !a && /* @__PURE__ */ c(Pb, { onClick: w, type: "button", children: /* @__PURE__ */ c(jb, { iconId: "CaretRight", size: "xxsm", $isOpen: i }) }),
+                !a && /* @__PURE__ */ c(Pb, { onClick: k, type: "button", children: /* @__PURE__ */ c(jb, { iconId: "CaretRight", size: "xxsm", $isOpen: i }) }),
                 p && /* @__PURE__ */ c(N, { size: "sm", iconId: p, color: f }),
                 /* @__PURE__ */ $(Vb, { children: [
                   y || /* @__PURE__ */ c(E, { variant: "body", bold: !0, children: x.name }),
                   r && /* @__PURE__ */ c(E, { variant: "body", children: "(Loading...)" })
                 ] }),
-                b && b.length > 0 && /* @__PURE__ */ c(Kb, { children: b.map((L) => /* @__PURE__ */ c(
+                b && b.length > 0 && /* @__PURE__ */ c(Kb, { children: b.map((R) => /* @__PURE__ */ c(
                   qb,
                   {
                     size: "sm",
-                    iconId: L.iconId,
-                    color: S && !h ? "white" : L.color,
-                    title: L.tooltip
+                    iconId: R.iconId,
+                    color: S && !h ? "white" : R.color,
+                    title: R.tooltip
                   },
-                  L.id
+                  R.id
                 )) }),
                 m && m.length > 0 && /* @__PURE__ */ c(
                   wo,
@@ -12280,7 +12283,7 @@ const Ms = ve(null), Ab = () => {
   display: flex;
   flex-direction: column;
   row-gap: 4px;
-`, e0 = F(
+`, e0 = A(
   ({
     autoScrollToBottom: e = !1,
     className: t,
@@ -12290,43 +12293,43 @@ const Ms = ve(null), Ab = () => {
     overscanAmount: i,
     renderRow: a
   }) => {
-    const [s, d] = W(0), [u, h] = W(0), p = V(null), f = V(null), m = o * n, b = Math.ceil(u / n), y = Math.max(
+    const [s, d] = W(0), [u, h] = W(0), p = H(null), f = H(null), m = o * n, b = Math.ceil(u / n), y = Math.max(
       Math.floor(s / n - (i ?? 0)),
       0
     ), x = Math.min(
       o - 1,
       y + b + (i ?? 0)
-    ), v = (k) => {
-      d(k.currentTarget.scrollTop);
+    ), v = (w) => {
+      d(w.currentTarget.scrollTop);
     };
     Ie(() => {
-      const k = () => {
+      const w = () => {
         p.current && h(p.current.clientHeight);
       };
-      return k(), window.addEventListener("resize", k), () => window.removeEventListener("resize", k);
+      return w(), window.addEventListener("resize", w), () => window.removeEventListener("resize", w);
     }, []), U(() => {
       e && f.current && (f.current.scrollTop = f.current.scrollHeight);
     }, [o, e]);
     const C = [];
-    for (let k = y; k <= x; k++)
+    for (let w = y; w <= x; w++)
       C.push(
-        a(k, {
-          top: k * n,
+        a(w, {
+          top: w * n,
           height: n,
           position: "absolute",
           width: "100%"
         })
       );
     return U(() => {
-      const k = () => {
-        const w = f.current;
-        if (!w)
+      const w = () => {
+        const k = f.current;
+        if (!k)
           return;
-        const z = w.scrollHeight - w.scrollTop <= w.clientHeight + n;
-        !e && z && (r == null || r());
+        const D = k.scrollHeight - k.scrollTop <= k.clientHeight + n;
+        !e && D && (r == null || r());
       }, S = f.current;
-      return S && S.addEventListener("scroll", k), () => {
-        S && S.removeEventListener("scroll", k);
+      return S && S.addEventListener("scroll", w), () => {
+        S && S.removeEventListener("scroll", w);
       };
     }, [e, n, r]), /* @__PURE__ */ c(t0, { ref: p, children: /* @__PURE__ */ c(
       o0,
@@ -12409,7 +12412,7 @@ const Ms = ve(null), Ab = () => {
   }) => {
     const [d, u] = W(
       o ?? []
-    ), h = V(d ?? []);
+    ), h = H(d ?? []);
     Ie(() => {
       h.current = d;
     }, [d]), U(() => {
@@ -12426,7 +12429,7 @@ const Ms = ve(null), Ab = () => {
     ), f = I(
       (b) => h.current.includes(b),
       []
-    ), m = j(() => ({
+    ), m = V(() => ({
       isSelected: f,
       selected: d,
       toggleSelection: p,
@@ -12445,7 +12448,7 @@ const Ms = ve(null), Ab = () => {
       p
     ]), /* @__PURE__ */ c(Jt.Provider, { value: m, children: /* @__PURE__ */ c(r0, { dataProvider: i, ...s }) });
   }
-), [gt] = O(["ingredient-card"]), R1 = F(
+), [gt] = O(["ingredient-card"]), R1 = A(
   ({
     id: e,
     name: t,
@@ -12456,7 +12459,7 @@ const Ms = ve(null), Ab = () => {
     blocked: a,
     isSmall: s
   }) => {
-    const { selected: d, toggleSelection: u } = Je(), { t: h } = fl("dispenser"), p = j(() => d.includes(e), [d, e]), f = I(() => {
+    const { selected: d, toggleSelection: u } = Je(), { t: h } = fl("dispenser"), p = V(() => d.includes(e), [d, e]), f = I(() => {
       i && i(e, "delete");
     }, [e, i]), m = I(
       (y) => {
@@ -12606,7 +12609,7 @@ const Ms = ve(null), Ab = () => {
   &.isCollapsed {
     border-bottom-width: 0px;
   }
-`, d0 = F(
+`, d0 = A(
   ({ children: e }) => {
     const { setOpen: t, open: o } = Vo(), n = I(
       (r) => {
@@ -12634,7 +12637,7 @@ const Ms = ve(null), Ab = () => {
     );
   }
 ), [pt] = O(["named-section"]), u0 = (e) => e.variant === "selectable", h0 = (e) => {
-  const { variant: t, className: o, children: n, header: r, isCollapsible: i } = e, a = V(null), [s, d, u] = u0(e) ? [e.disabled, e.isSelected, e.onClick] : [e.disabled, !1, void 0], h = e.ContentWrapper ?? g0, p = I(
+  const { variant: t, className: o, children: n, header: r, isCollapsible: i } = e, a = H(null), [s, d, u] = u0(e) ? [e.disabled, e.isSelected, e.onClick] : [e.disabled, !1, void 0], h = e.ContentWrapper ?? g0, p = I(
     (f) => {
       u && a.current && a.current.contains(f.target) && u();
     },
@@ -12695,7 +12698,7 @@ const Ms = ve(null), Ab = () => {
 `, g0 = g.div`
   display: flex;
   width: 100%;
-`, [qo] = O(["named-section-header"]), F1 = F(
+`, [qo] = O(["named-section-header"]), F1 = A(
   ({
     name: e,
     description: t,
@@ -12746,7 +12749,7 @@ const Ms = ve(null), Ab = () => {
   align-items: center;
   justify-content: flex-end;
   row-gap: ${qo("row-gap")};
-`, Rs = ve(!1), v0 = () => be(Rs), x0 = F(
+`, Rs = ve(!1), v0 = () => be(Rs), x0 = A(
   ({
     title: e,
     disabled: t,
@@ -12769,7 +12772,7 @@ const Ms = ve(null), Ab = () => {
   display: flex;
   align-items: center;
   gap: ${l("spacing-4")};
-`, $0 = F(
+`, $0 = A(
   (e) => {
     const { selected: t } = Je(), o = v0(), n = t.includes(e.id);
     return o && !n ? null : /* @__PURE__ */ c($b, { ...e });
@@ -12794,7 +12797,7 @@ const Ms = ve(null), Ab = () => {
   }) => {
     const [h, p] = W(
       e ?? !1
-    ), f = V(null), m = I((y) => {
+    ), f = H(null), m = I((y) => {
       p(y);
     }, []);
     U(() => {
@@ -12971,7 +12974,7 @@ const L1 = ({
     acceptButtonText: r,
     onAccept: i
   }, a) => {
-    const s = j(() => {
+    const s = V(() => {
       if (e === "error")
         return { iconId: "ExclamationCircle", color: "red" };
       if (e === "warn")
@@ -13060,12 +13063,12 @@ const L1 = ({
   }
 ), O0 = g(Hn)`
   column-gap: ${E0("footerGap")};
-`, N0 = F(
+`, N0 = A(
   ({ headerText: e }) => /* @__PURE__ */ $(pe, { children: [
     /* @__PURE__ */ c(N, { iconId: "ExclamationCircle", color: "red", size: "lrg" }),
     /* @__PURE__ */ c(E, { variant: "h2", color: "dark", children: e })
   ] })
-), R0 = F(
+), R0 = A(
   ({ contentText: e, compareText: t, errorText: o }) => {
     const n = I(
       (i) => i.message && i.message !== "" ? i.message : o ?? "That does not match.",
@@ -13093,7 +13096,7 @@ const L1 = ({
   justify-content: flex-start;
   flex-direction: column;
   row-gap: 8px;
-`, A0 = F(
+`, A0 = A(
   ({ onSubmit: e }) => {
     const { setOpen: t } = Ot(), o = I(() => {
       t(!1);
@@ -13171,20 +13174,20 @@ const L1 = ({
     disabled: m,
     ...b,
     mode: p === "blur" ? "onBlur" : b.mode
-  }), { setOpen: v } = Ot(), { setError: C, reset: k } = x, S = I(
-    (D) => {
+  }), { setOpen: v } = Ot(), { setError: C, reset: w } = x, S = I(
+    (z) => {
       s({
-        data: D,
+        data: z,
         closeModal: () => v(!1),
         setError: C,
-        resetForm: k
+        resetForm: w
       });
     },
-    [s, k, C, v]
-  ), w = I(() => {
-    i == null || i(k), v(!1);
-  }, [i, k, v]), z = I(
-    (D) => S(D),
+    [s, w, C, v]
+  ), k = I(() => {
+    i == null || i(w), v(!1);
+  }, [i, w, v]), D = I(
+    (z) => S(z),
     [S]
   ), _ = f ?? Bs;
   return /* @__PURE__ */ c(Xr, { ...x, children: /* @__PURE__ */ $(
@@ -13203,7 +13206,7 @@ const L1 = ({
             at,
             {
               text: r ?? "Cancel",
-              onClick: w,
+              onClick: k,
               type: "button",
               variant: h ?? "borderless"
             }
@@ -13211,7 +13214,7 @@ const L1 = ({
           p !== "blur" && /* @__PURE__ */ c(
             ms,
             {
-              onSubmit: z,
+              onSubmit: D,
               variant: u ?? "primary",
               text: n ?? "Submit",
               enabledIfClean: a,
@@ -13259,7 +13262,7 @@ function P1(e) {
     }
   );
 }
-const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
+const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = q`
   background: ${V0("overlay-background")};
   display: grid;
   place-items: center;
@@ -13404,7 +13407,7 @@ const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
       }
     );
   }
-), [Lt] = O(["button"]), U1 = F(
+), [Lt] = O(["button"]), U1 = A(
   ({ onClick: e, open: t, buttonText: o, text: n }) => /* @__PURE__ */ c(oy, { open: t, children: /* @__PURE__ */ $(ny, { children: [
     /* @__PURE__ */ c(E, { variant: "h2", color: "light", children: n }),
     /* @__PURE__ */ c(at, { variant: "borderless", text: o, onClick: e })
@@ -13456,17 +13459,17 @@ const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
     onOpenChange: f,
     whileElementsMounted: Lo,
     middleware: [Kr(4), Bo(), qr({ padding: 8 })]
-  }), k = Fo(C, { enabled: !d }), S = fo(C), w = Wo(C), { getReferenceProps: z, getFloatingProps: _ } = mo([
-    k,
+  }), w = Fo(C, { enabled: !d }), S = fo(C), k = Wo(C), { getReferenceProps: D, getFloatingProps: _ } = mo([
+    w,
     S,
-    w
-  ]), D = I(
+    k
+  ]), z = I(
     (P, J) => {
       const he = { ...m }, te = new Set(m[P]);
       te.has(J) ? te.delete(J) : te.add(J), he[P] = te, y(he);
     },
     [m, y]
-  ), L = I(
+  ), R = I(
     (P) => {
       const J = e.find((te) => te.id === P);
       if (!J)
@@ -13475,12 +13478,12 @@ const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
       he[P] = new Set(J.options.map((te) => te.value)), y(he);
     },
     [e, m, y]
-  ), q = I(() => {
+  ), G = I(() => {
     const P = {};
     e.forEach((J) => {
       P[J.id] = /* @__PURE__ */ new Set();
     }), y(P);
-  }, [e, y]), H = j(
+  }, [e, y]), j = V(
     () => Object.values(m).some((P) => P.size > 0),
     [m]
   );
@@ -13490,19 +13493,19 @@ const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
       {
         ref: x.setReference,
         className: a,
-        $isActive: H,
+        $isActive: j,
         $isDisabled: d,
-        ...z(),
+        ...D(),
         children: s || /* @__PURE__ */ $(pe, { children: [
           /* @__PURE__ */ c(
             N,
             {
               iconId: "Filter",
               size: "sm",
-              color: H ? "blue" : "grey"
+              color: j ? "blue" : "grey"
             }
           ),
-          H && /* @__PURE__ */ c(iy, {})
+          j && /* @__PURE__ */ c(iy, {})
         ] })
       }
     ),
@@ -13516,7 +13519,7 @@ const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
           /* @__PURE__ */ $(ay, { children: [
             /* @__PURE__ */ c(E, { variant: "body", bold: !0, children: "Filters" }),
             /* @__PURE__ */ $(ly, { children: [
-              r && H && /* @__PURE__ */ c(cy, { onClick: q, children: /* @__PURE__ */ c(E, { variant: "small", color: "blue", children: "Clear all" }) }),
+              r && j && /* @__PURE__ */ c(cy, { onClick: G, children: /* @__PURE__ */ c(E, { variant: "small", color: "blue", children: "Clear all" }) }),
               /* @__PURE__ */ c(dy, { onClick: () => f(!1), children: /* @__PURE__ */ c(N, { iconId: "Close", size: "sm", color: "grey" }) })
             ] })
           ] }),
@@ -13526,7 +13529,7 @@ const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
               n && /* @__PURE__ */ c(
                 gy,
                 {
-                  onClick: () => L(P.id),
+                  onClick: () => R(P.id),
                   children: /* @__PURE__ */ c(E, { variant: "small", color: "blue", children: "Select all" })
                 }
               )
@@ -13538,7 +13541,7 @@ const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
                 my,
                 {
                   $isSelected: he,
-                  onClick: () => D(P.id, J.value),
+                  onClick: () => z(P.id, J.value),
                   children: [
                     /* @__PURE__ */ c(by, { $isChecked: he, children: he && /* @__PURE__ */ c(N, { iconId: "Check", size: "xsm", color: "white" }) }),
                     /* @__PURE__ */ c(E, { variant: "small", children: J.label })
@@ -13676,8 +13679,8 @@ const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
   "view-header",
   "option",
   "select"
-]), Tr = 3, Ls = F(({ actions: e }) => {
-  const { inlinePrimary: t, overflowPrimary: o, secondary: n } = j(() => {
+]), Tr = 3, Ls = A(({ actions: e }) => {
+  const { inlinePrimary: t, overflowPrimary: o, secondary: n } = V(() => {
     const s = e.filter((u) => u.isPrimary), d = e.filter((u) => !u.isPrimary);
     return {
       // First MAX_PRIMARY_ACTIONS primary actions shown inline
@@ -13687,7 +13690,7 @@ const j1 = ({ children: e }) => /* @__PURE__ */ c(mi, { children: e }), U0 = K`
       // All secondary actions go to overflow
       secondary: d
     };
-  }, [e]), r = o.length > 0 || n.length > 0, i = j(() => {
+  }, [e]), r = o.length > 0 || n.length > 0, i = V(() => {
     const s = /* @__PURE__ */ new Map();
     for (const d of e)
       s.set(d.id, d);
@@ -13816,7 +13819,7 @@ const xy = g.div`
 `, $y = g.div`
   width: 16px;
   height: 16px;
-`, [st] = O(["view-header"]), Ws = F(
+`, [st] = O(["view-header"]), Ws = A(
   ({
     title: e,
     subtitle: t,
@@ -13827,7 +13830,7 @@ const xy = g.div`
     collapsed: a,
     onToggleCollapse: s
   }) => {
-    const d = j(
+    const d = V(
       () => n && n.length > 0,
       [n]
     );
@@ -13908,7 +13911,7 @@ const Cy = g.div`
   align-items: center;
   gap: ${st("actions-gap")};
   flex-shrink: 0;
-`, [Tt] = O(["view"]), Ey = F(
+`, [Tt] = O(["view"]), Ey = A(
   ({
     title: e,
     subtitle: t,
@@ -13973,7 +13976,7 @@ const My = g.div`
   flex: 1;
   overflow: auto;
   padding: ${Tt("content-padding")};
-`, Ry = F(
+`, Ry = A(
   ({
     searchValue: e,
     onSearchChange: t,
@@ -14006,7 +14009,7 @@ const Fy = g.div`
   flex-shrink: 0;
   display: flex;
   align-items: center;
-`, [_o] = O(["view-container"]), Ly = F(
+`, [_o] = O(["view-container"]), Ly = A(
   ({ id: e, direction: t = "vertical", gap: o, children: n, className: r }) => /* @__PURE__ */ c(Wy, { id: e, direction: t, gap: o, className: r, children: n })
 );
 Ly.displayName = "ViewContainer";
@@ -14052,9 +14055,9 @@ const Nr = new IntersectionObserver(
     return e;
   const n = e.replace(/\\/g, "/").split(/[/\\]+/);
   return t !== !1 && n[n.length - 1] === "" && n.pop(), n.join("/");
-}, [Ce] = O(["select-view-list"]), jy = F(
+}, [Ce] = O(["select-view-list"]), jy = A(
   ({ id: e, name: t, icon: o, onListItemAction: n, isSelectDisabled: r }) => {
-    const { selected: i, viewing: a } = Py(), s = V(null), d = V(null), u = V(!1), h = i === e, p = a === e;
+    const { selected: i, viewing: a } = Py(), s = H(null), d = H(null), u = H(!1), h = i === e, p = a === e;
     U(() => {
       d.current && (h ? (Nr.observe(d.current), u.current = !0) : u.current && (u.current = !1, Nr.unobserve(d.current)));
     }, [h]);
@@ -14165,7 +14168,7 @@ const Nr = new IntersectionObserver(
   selected: a,
   viewing: s
 }) => {
-  const d = j(() => ({
+  const d = V(() => ({
     selected: a,
     viewing: s
   }), [a, s]);
@@ -14214,7 +14217,7 @@ const Nr = new IntersectionObserver(
   display: flex;
   height: 100%;
   justify-content: flex-start;
-`, [Fr] = O(["shell-menu"]), X1 = F(
+`, [Fr] = O(["shell-menu"]), X1 = A(
   ({ text: e, onClick: t, isActive: o }) => /* @__PURE__ */ c(
     Ky,
     {
@@ -14236,7 +14239,7 @@ const Nr = new IntersectionObserver(
     isSortable: o,
     onListItemAction: n
   }) => {
-    const r = j(() => ({
+    const r = V(() => ({
       t,
       isSortable: !!o,
       onListItemAction: n
@@ -14260,7 +14263,7 @@ const Nr = new IntersectionObserver(
   &:first-of-type {
     padding-left: ${wt("cell-padding-left-first-in-row")};
   }
-`, Us = F(({ cell: e }) => {
+`, Us = A(({ cell: e }) => {
   const { isSortable: t } = Hs();
   return /* @__PURE__ */ c(
     Xo,
@@ -14273,7 +14276,7 @@ const Nr = new IntersectionObserver(
 }), [Ar] = O(["table"]), Ht = g.tr`
   width: 100%;
   border-bottom: ${Ar("row-border-bottom-size")} solid ${Ar("border-color")};
-`, qy = F(({ row: e, TdComponent: t }) => {
+`, qy = A(({ row: e, TdComponent: t }) => {
   const o = t ?? Us;
   return /* @__PURE__ */ c(Ht, { children: e.getVisibleCells().map((n) => /* @__PURE__ */ c(o, { cell: n }, n.id)) });
 }), [Zy] = O(["table"]), Xy = (e) => e.id, Jy = ({
@@ -14380,7 +14383,7 @@ const Nr = new IntersectionObserver(
 })) ?? "Click to sort ascending" : (t == null ? void 0 : t("table.cancelSort", { defaultValue: "Cancel sort" })) ?? "Cancel sort" : (t == null ? void 0 : t("table.sort", {
   direction: t == null ? void 0 : t("table.descending"),
   defaultValue: "Click to sort descending"
-})) ?? "Click to sort descending", Br = F(
+})) ?? "Click to sort descending", Br = A(
   ({
     width: e,
     isBlank: t,
@@ -14529,8 +14532,8 @@ function Wt(e, t, o) {
     n = p;
     let m;
     if (o.key && ((s = o.debug) != null && s.call(o)) && (m = Date.now()), r = t(...p), o.key && ((d = o.debug) != null && d.call(o))) {
-      const b = Math.round((Date.now() - h) * 100) / 100, y = Math.round((Date.now() - m) * 100) / 100, x = y / 16, v = (C, k) => {
-        for (C = String(C); C.length < k; )
+      const b = Math.round((Date.now() - h) * 100) / 100, y = Math.round((Date.now() - m) * 100) / 100, x = y / 16, v = (C, w) => {
+        for (C = String(C); C.length < w; )
           C = " " + C;
         return C;
       };
@@ -15079,7 +15082,7 @@ const [Ys] = O(["table"]), yv = (e) => e.id, vv = ({
   renderEmptyAsStandalone: d,
   ...u
 }) => {
-  const h = V(null), [p, f] = W([]), m = oi({
+  const h = H(null), [p, f] = W([]), m = oi({
     columns: t,
     data: e,
     getCoreRowModel: ri(),
@@ -15239,7 +15242,7 @@ const [Ys] = O(["table"]), yv = (e) => e.id, vv = ({
   z-index: 1;
 `, Iv = g.tbody`
   width: 100%;
-`, tw = F(
+`, tw = A(
   ({
     listMaxSize: e,
     listMinSize: t,
@@ -15297,66 +15300,66 @@ const ow = () => zn, nw = ({
   onDragOver: s,
   onDragLeave: d
 }) => {
-  const [u, h] = W(!1), [p, f] = W(!1), m = (k) => {
-    k.preventDefault(), k.stopPropagation();
+  const [u, h] = W(!1), [p, f] = W(!1), m = (w) => {
+    w.preventDefault(), w.stopPropagation();
   }, b = I(
-    (k) => {
-      m(k), f(!0), k.dataTransfer && (k.dataTransfer.dropEffect = "move"), s == null || s(k);
+    (w) => {
+      m(w), f(!0), w.dataTransfer && (w.dataTransfer.dropEffect = "move"), s == null || s(w);
     },
     [s]
   ), y = I(
-    (k) => {
-      m(k), f(!1), d == null || d(k);
+    (w) => {
+      m(w), f(!1), d == null || d(w);
     },
     [d]
   ), x = I(
-    (k) => {
-      m(k), h(!1), f(!1), zn = null, a == null || a(k);
+    (w) => {
+      m(w), h(!1), f(!1), zn = null, a == null || a(w);
     },
     [a]
   ), v = I(
-    (k) => {
-      var w;
-      m(k), h(!1), f(!1);
+    (w) => {
+      var k;
+      m(w), h(!1), f(!1);
       let S = null;
       try {
         S = JSON.parse(
-          ((w = k.dataTransfer) == null ? void 0 : w.getData("application/json")) ?? "null"
+          ((k = w.dataTransfer) == null ? void 0 : k.getData("application/json")) ?? "null"
         );
-      } catch (z) {
-        console.error("Invalid drag data:", z);
+      } catch (D) {
+        console.error("Invalid drag data:", D);
       }
-      S && (r == null || r(S, k));
+      S && (r == null || r(S, w));
     },
     [r]
   ), C = I(
-    (k) => {
-      var w;
+    (w) => {
+      var k;
       if (!o)
         return;
-      k.stopPropagation(), h(!0), f(!1), k.dataTransfer && (k.dataTransfer.effectAllowed = "move");
+      w.stopPropagation(), h(!0), f(!1), w.dataTransfer && (w.dataTransfer.effectAllowed = "move");
       const S = n(t);
-      zn = S, (w = k.dataTransfer) == null || w.setData(
+      zn = S, (k = w.dataTransfer) == null || k.setData(
         "application/json",
         JSON.stringify(S)
-      ), i == null || i(t, k);
+      ), i == null || i(t, w);
     },
     [o, t, i, n]
   );
   return U(() => {
-    const k = e.current, S = {
-      dragover: (w) => b(w),
-      dragenter: (w) => b(w),
-      dragleave: (w) => y(w),
-      drop: (w) => v(w),
-      dragstart: (w) => C(w),
-      dragend: (w) => x(w)
+    const w = e.current, S = {
+      dragover: (k) => b(k),
+      dragenter: (k) => b(k),
+      dragleave: (k) => y(k),
+      drop: (k) => v(k),
+      dragstart: (k) => C(k),
+      dragend: (k) => x(k)
     };
-    return k && Object.entries(S).forEach(
-      ([w, z]) => k.addEventListener(w, z)
+    return w && Object.entries(S).forEach(
+      ([k, D]) => w.addEventListener(k, D)
     ), () => {
-      Object.entries(S).forEach(([w, z]) => {
-        k && k.removeEventListener(w, z);
+      Object.entries(S).forEach(([k, D]) => {
+        w && w.removeEventListener(k, D);
       });
     };
   }, [
@@ -16164,7 +16167,7 @@ export {
   ow as getCurrentDragData,
   Mx as getEmailValidation,
   Rx as getErrorMessage,
-  B as getGlobalToken,
+  L as getGlobalToken,
   Nx as getPasswordValidation,
   p1 as getPropertyWithFallback,
   l as getSemanticToken,