asma-ui-core 3.106.0 → 3.107.1

package/dist/components/feedback/minimizable-dialog/v2/MinimizableDialogV2.js

@@ -1,47 +1,53 @@
-import { cn as c } from "../../../../helpers/cn.js";
-import { firstTabbable as I } from "../../../../helpers/focusable.js";
-import { StyledTooltip as G } from "../../../data-display/tooltip/StyledTooltip.js";
-import { DialogBusyContext as j, useDialogBusyBoundary as J } from "../../dialog/DialogBusyContext.js";
-import { useMobileMediaQuery as K } from "../../../../hooks/useMediaQuery.hook.js";
-import { useFocusTrap as X } from "../../../../hooks/useFocusTrap.hook.js";
-import { CloseBtn as D } from "../components/CloseBtn.js";
-import { MinimizeBtn as P } from "../components/MinimizeBtn.js";
-import { FullScreenBtn as Y } from "../components/FullscreenBtn.js";
-import p from "./MinimizableDialogV2.module.js";
-import { useTranslations as Z } from "./useTranslations.js";
-import { useControlledProps as ee } from "./useControlledProps.js";
-import te from "clsx";
-import { useLayoutEffect as A, useRef as u } from "react";
-import { Fragment as ie, jsx as e, jsxs as o } from "react/jsx-runtime";
-var ge = (y) => {
-  const { showCloseIcon: z = !0, showMinimizeIcon: O = !0, showExpandIcon: V = !0, enableFullscreen: q = !0, title: r, label: x, children: E, open: d, onClose: W, classNameOverrides: v = {
+import { cn as s } from "../../../../helpers/cn.js";
+import { firstTabbable as A } from "../../../../helpers/focusable.js";
+import { StyledTooltip as te } from "../../../data-display/tooltip/StyledTooltip.js";
+import { DialogBusyContext as $, useDialogBusyBoundary as ie } from "../../dialog/DialogBusyContext.js";
+import { useMobileMediaQuery as le } from "../../../../hooks/useMediaQuery.hook.js";
+import { useFocusTrap as ne } from "../../../../hooks/useFocusTrap.hook.js";
+import { CloseBtn as O } from "../components/CloseBtn.js";
+import { MinimizeBtn as V } from "../components/MinimizeBtn.js";
+import { FullScreenBtn as oe } from "../components/FullscreenBtn.js";
+import v from "./MinimizableDialogV2.module.js";
+import { useTranslations as re } from "./useTranslations.js";
+import { useControlledProps as se } from "./useControlledProps.js";
+import ce from "clsx";
+import { useId as q, useLayoutEffect as H, useRef as c } from "react";
+import { Fragment as ae, jsx as e, jsxs as n } from "react/jsx-runtime";
+var Se = (N) => {
+  const { showCloseIcon: R = !0, showMinimizeIcon: L = !0, showExpandIcon: W = !0, enableFullscreen: _ = !0, title: u, label: f, children: Q, open: o, onClose: U, classNameOverrides: h = {
     maximized: "",
     minimized: "",
     fullscreen: ""
-  }, dataTest: _, actionNode: $, locale: H = "en", busyReason: L, style: w, initialFocusRef: N } = y, s = K(), i = Z(H), m = u(null), f = u(null), R = u(null), C = u(null), S = u(!1), { minimized: t, setMinimized: F, fullScreen: l, setFullScreen: T } = ee(y), n = l && !t, { busy: h, busyReason: B, contextValue: M } = J(L ?? i.waitUntilSaved), b = () => {
-    h || (F(!1), W());
+  }, dataTest: G, actionNode: J, locale: K = "en", busyReason: X, style: C, initialFocusRef: S } = N, r = le(), i = re(K), a = c(null), p = c(null), F = c(null), T = c(null), b = c(!1), g = c(null), x = q(), I = q(), { minimized: t, setMinimized: M, fullScreen: l, setFullScreen: B } = se(N), d = l && !t, { busy: y, busyReason: E, contextValue: j } = ie(X ?? i.waitUntilSaved), z = () => {
+    y || (M(!1), U());
   };
-  A(() => {
-    m.current?.toggleAttribute("inert", t), f.current?.toggleAttribute("inert", !t);
-  }, [t]), A(() => {
-    const g = d && !S.current;
-    if (S.current = d, !g) return;
-    const a = t ? f.current : m.current, U = t ? C.current : R.current;
-    (N?.current ?? U ?? (a ? I(a) : void 0))?.focus({ preventScroll: !0 });
+  H(() => {
+    a.current?.toggleAttribute("inert", t), p.current?.toggleAttribute("inert", !t);
+  }, [t]), H(() => {
+    const w = o && !b.current, m = !o && b.current;
+    if (b.current = o, m) {
+      const P = g.current;
+      g.current = null, (!document.activeElement || document.activeElement === document.body) && P?.isConnected && P.focus({ preventScroll: !0 });
+      return;
+    }
+    if (!w) return;
+    g.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+    const D = t ? p.current : a.current, ee = t ? T.current : F.current;
+    (S?.current ?? ee ?? (D ? A(D) : void 0))?.focus({ preventScroll: !0 });
   }, [
-    N,
+    S,
     t,
-    d
+    o
   ]);
   const k = () => {
-    const g = t ? m : f;
-    F(!t), requestAnimationFrame(() => {
-      const a = g.current;
-      a && (a.querySelector('[data-testid="toggle-minimize-btn"]') ?? I(a))?.focus({ preventScroll: !0 });
+    const w = t ? a : p;
+    M(!t), requestAnimationFrame(() => {
+      const m = w.current;
+      m && (m.querySelector('[data-testid="toggle-minimize-btn"]') ?? A(m))?.focus({ preventScroll: !0 });
     });
   };
-  X(d && n, m, b);
-  const Q = n ? s ? {
+  ne(o && d, a, z);
+  const Y = d ? r ? {
     inset: 0,
     maxHeight: "100dvh",
     maxWidth: "100dvw",
@@ -58,115 +64,120 @@ var ge = (y) => {
     maxWidth: "min(1000px, calc(100vw - 32px))",
     height: "95dvh"
   } : void 0;
-  return d ? /* @__PURE__ */ o(ie, { children: [
+  if (!o) return null;
+  const Z = f ? `${I} ${x}` : x;
+  return /* @__PURE__ */ n(ae, { children: [
     /* @__PURE__ */ e("div", {
-      ref: f,
+      ref: p,
       style: {
         zIndex: 51,
-        ...w
+        ...C
       },
-      className: c(p["minimized-dialog"], !t && p.hidden, v.minimized),
-      children: /* @__PURE__ */ o("div", {
-        className: te("flex items-center justify-between", !t && "hidden"),
-        "data-testid": _,
+      className: s(v["minimized-dialog"], !t && v.hidden, h.minimized),
+      children: /* @__PURE__ */ n("div", {
+        className: ce("flex items-center justify-between", !t && "hidden"),
+        "data-testid": G,
         children: [/* @__PURE__ */ e("div", {
           className: "max-w-[303px] truncate pr-1 text-lg font-semibold text-delta-800",
-          children: /* @__PURE__ */ e(G, {
-            title: r,
+          children: /* @__PURE__ */ e(te, {
+            title: u,
             placement: "top",
             children: /* @__PURE__ */ e("div", {
               className: "truncate",
-              children: r
+              children: u
             })
           })
-        }), /* @__PURE__ */ o("div", {
+        }), /* @__PURE__ */ n("div", {
           className: "flex items-center gap-x-1",
-          children: [/* @__PURE__ */ e(P, {
+          children: [/* @__PURE__ */ e(V, {
             type: "expand",
-            visibility: V,
+            visibility: W,
             onClick: k,
             tooltipTitle: i.expand
-          }), /* @__PURE__ */ e(D, {
-            buttonRef: C,
-            showCloseIcon: z,
-            onClick: b,
-            disabledReason: h ? B : void 0,
+          }), /* @__PURE__ */ e(O, {
+            buttonRef: T,
+            showCloseIcon: R,
+            onClick: z,
+            disabledReason: y ? E : void 0,
             tooltipTitle: i.close
           })]
         })]
       })
     }),
-    n && /* @__PURE__ */ e("div", {
+    d && /* @__PURE__ */ e("div", {
       className: "fixed inset-0 z-[52] bg-[rgb(98,110,126)] bg-opacity-70",
       onClick: () => {
-        T(!1);
+        B(!1);
       }
     }),
-    /* @__PURE__ */ o("div", {
+    /* @__PURE__ */ n("div", {
       style: {
         zIndex: 51,
-        ...w,
-        ...Q
+        ...C,
+        ...Y
       },
-      ref: m,
-      role: n ? "dialog" : void 0,
-      "aria-modal": n ? !0 : void 0,
-      "aria-label": n && typeof r == "string" ? r : void 0,
-      className: c(p.dialog, t && p.hidden, !l && v.maximized, l && v.fullscreen, n && "fixed z-[53] duration-0"),
-      children: [/* @__PURE__ */ o("div", {
-        className: c("flex flex-col border-b-[1px] border-delta-200 px-4", s ? "py-3" : "py-4"),
-        children: [/* @__PURE__ */ o("div", {
+      ref: a,
+      role: "dialog",
+      "aria-modal": d ? !0 : void 0,
+      "aria-labelledby": Z,
+      className: s(v.dialog, t && v.hidden, !l && h.maximized, l && h.fullscreen, d && "fixed z-[53] duration-0"),
+      children: [/* @__PURE__ */ n("div", {
+        className: s("flex flex-col border-b-[1px] border-delta-200 px-4", r ? "py-3" : "py-4"),
+        children: [/* @__PURE__ */ n("div", {
           className: "flex items-center justify-between",
-          children: [x ? /* @__PURE__ */ e("div", {
+          children: [f ? /* @__PURE__ */ e("div", {
+            id: I,
             className: "text-sm text-delta-700",
-            children: x
+            children: f
           }) : /* @__PURE__ */ e("div", {
-            className: c("font-semibold text-delta-800", s ? "line-clamp-2 text-xl" : "line-clamp-1 text-2xl"),
-            children: r
-          }), /* @__PURE__ */ o("div", {
+            id: x,
+            className: s("font-semibold text-delta-800", r ? "line-clamp-2 text-xl" : "line-clamp-1 text-2xl"),
+            children: u
+          }), /* @__PURE__ */ n("div", {
             className: "flex items-center gap-x-1",
             children: [
-              /* @__PURE__ */ e(j.Provider, {
-                value: M,
-                children: $
+              /* @__PURE__ */ e($.Provider, {
+                value: j,
+                children: J
               }),
-              /* @__PURE__ */ e(P, {
-                visibility: O && !s && !l,
+              /* @__PURE__ */ e(V, {
+                visibility: L && !r && !l,
                 type: "minimize",
                 onClick: k,
                 tooltipTitle: i.minimize
               }),
-              /* @__PURE__ */ e(Y, {
-                showFullScreenIcon: q && !s,
+              /* @__PURE__ */ e(oe, {
+                showFullScreenIcon: _ && !r,
                 fullScreen: l,
                 onClick: () => {
-                  T(!l);
+                  B(!l);
                 },
                 tooltipTitle: l ? i.exitFullscreen : i.fullscreen
               }),
-              /* @__PURE__ */ e(D, {
-                buttonRef: R,
-                showCloseIcon: z,
-                onClick: b,
-                disabledReason: h ? B : void 0,
+              /* @__PURE__ */ e(O, {
+                buttonRef: F,
+                showCloseIcon: R,
+                onClick: z,
+                disabledReason: y ? E : void 0,
                 tooltipTitle: i.close
               })
             ]
           })]
-        }), x && /* @__PURE__ */ e("div", {
-          className: c("font-semibold text-delta-800", s ? "line-clamp-2 text-xl" : "line-clamp-1 text-2xl"),
-          children: r
+        }), f && /* @__PURE__ */ e("div", {
+          id: x,
+          className: s("font-semibold text-delta-800", r ? "line-clamp-2 text-xl" : "line-clamp-1 text-2xl"),
+          children: u
         })]
       }), /* @__PURE__ */ e("div", {
-        className: c(t && "hidden", "flex flex-grow flex-col overflow-y-auto overscroll-contain"),
-        children: /* @__PURE__ */ e(j.Provider, {
-          value: M,
-          children: E
+        className: s(t && "hidden", "flex flex-grow flex-col overflow-y-auto overscroll-contain"),
+        children: /* @__PURE__ */ e($.Provider, {
+          value: j,
+          children: Q
         })
       })]
     })
-  ] }) : null;
+  ] });
 };
 export {
-  ge as MinimizableDialogV2
+  Se as MinimizableDialogV2
 };

package/dist/components/inputs/dynamic-select/components/DynamicSelectAutocomplete.js

@@ -11,7 +11,7 @@ import { DynamicInteractiveChipGroup as ne } from "./DynamicInteractiveChipGroup
 import { createElement as F, forwardRef as se, useCallback as h, useState as de } from "react";
 import { Fragment as K, jsx as l, jsxs as T } from "react/jsx-runtime";
 var Ce = se((O, H) => {
-  const [_, S] = de(!1), { options: k, dataTest: f, value: g, readOnly: u, multiple: o, required: R, onChange: x, size: G, rowSize: v = "compact", title: y, noOptionsText: W, placeholder: J, disabled: I, helperText: M, disableHelperText: N, error: A, valueKey: P = "value", labelKey: Q = "label", renderLabel: s, getOptionTooltip: V, startAdornment: U, autocompleteProps: i, loading: m, maxTags: X, onFocus: Y, onBlur: Z } = O, d = (e) => typeof e == "object" ? e?.[Q]?.toString() ?? "" : e?.toString() ?? "", b = h((e) => typeof e == "object" ? e?.[P] : e, [P]), $ = h((e, t) => b(e) === b(t), [b]), w = (e) => {
+  const [_, S] = de(!1), { options: k, dataTest: f, value: g, readOnly: u, multiple: o, required: R, onChange: x, size: W, rowSize: y = "compact", title: v, noOptionsText: G, placeholder: J, disabled: I, helperText: M, disableHelperText: N, error: A, valueKey: P = "value", labelKey: Q = "label", renderLabel: s, getOptionTooltip: V, startAdornment: U, autocompleteProps: i, loading: m, maxTags: X, onFocus: Y, onBlur: Z } = O, d = (e) => typeof e == "object" ? e?.[Q]?.toString() ?? "" : e?.toString() ?? "", b = h((e) => typeof e == "object" ? e?.[P] : e, [P]), $ = h((e, t) => b(e) === b(t), [b]), w = (e) => {
     const t = b(e);
     return t == null ? "" : typeof t == "string" || typeof t == "number" || typeof t == "boolean" ? String(t) : e == null ? "" : d(e);
   }, B = h((e) => {
@@ -20,13 +20,13 @@ var Ce = se((O, H) => {
     S(!1), i?.onClose?.(e, t);
   }, [i]);
   if (o && u) return /* @__PURE__ */ l(ne, { ...O });
-  const C = y ? `${f}-title` : void 0;
+  const C = v ? `${f}-title` : void 0;
   return /* @__PURE__ */ T("div", {
     className: "flex w-full flex-col gap-y-1",
-    children: [y && /* @__PURE__ */ l("span", {
+    children: [v && /* @__PURE__ */ l("span", {
       id: C,
       className: "text-base font-semibold text-delta-800",
-      children: y
+      children: v
     }), /* @__PURE__ */ l(ie, {
       open: _,
       onOpen: B,
@@ -34,12 +34,12 @@ var Ce = se((O, H) => {
       disableCloseOnSelect: o,
       dataTest: f,
       disabled: !!I || !!m,
-      noOptionsText: W,
+      noOptionsText: G,
       loading: m,
       readOnly: u,
       value: g,
-      size: G,
-      rowSize: v,
+      size: W,
+      rowSize: y,
       disableClearable: R,
       options: k,
       fullWidth: !0,
@@ -99,7 +99,7 @@ var Ce = se((O, H) => {
             "aria-selected": L,
             key: e.id,
             onClick: r ? void 0 : e.onClick,
-            className: q("relative flex cursor-pointer items-center gap-x-1 bg-white px-2 text-base aria-selected:bg-gama-50 hover:bg-delta-50", v === "regular" ? "min-h-12" : "min-h-10", r && "cursor-not-allowed bg-delta-50 aria-selected:!bg-delta-50 hover:!bg-delta-50 [&_*]:cursor-not-allowed"),
+            className: q("relative box-border flex cursor-pointer items-center gap-x-1 bg-white px-2 py-2 text-base aria-selected:bg-gama-50 hover:bg-delta-50", y === "regular" ? "min-h-12" : "min-h-10", r && "cursor-not-allowed bg-delta-50 aria-selected:!bg-delta-50 hover:!bg-delta-50 [&_*]:cursor-not-allowed"),
             "aria-disabled": r,
             "aria-describedby": a
           }, j, e["data-active"] !== void 0 && /* @__PURE__ */ l("span", {
@@ -114,6 +114,7 @@ var Ce = se((O, H) => {
               dataTest: `${w(t)}-checkbox`,
               size: "small",
               decorative: !0,
+              hideWrapper: !0,
               className: "min-w-[36px]",
               checked: L
             }), s ? s(t) : /* @__PURE__ */ l("span", {
@@ -128,7 +129,7 @@ var Ce = se((O, H) => {
           role: "option",
           "aria-selected": D,
           key: e.id,
-          className: q("relative flex cursor-pointer items-center gap-x-1 px-2 text-base aria-selected:bg-gama-50 hover:bg-delta-50", v === "regular" ? "min-h-12" : "min-h-10", r && "cursor-not-allowed bg-delta-50 aria-selected:!bg-delta-50 hover:!bg-delta-50 [&_*]:cursor-not-allowed"),
+          className: q("relative box-border flex cursor-pointer items-center gap-x-1 px-2 py-2 text-base aria-selected:bg-gama-50 hover:bg-delta-50", y === "regular" ? "min-h-12" : "min-h-10", r && "cursor-not-allowed bg-delta-50 aria-selected:!bg-delta-50 hover:!bg-delta-50 [&_*]:cursor-not-allowed"),
           onClick: r ? void 0 : e.onClick,
           "aria-disabled": r,
           "aria-describedby": a

package/dist/components/inputs/select/StyledSelect.js

@@ -1,4 +1,4 @@
-import { cn as y } from "../../../helpers/cn.js";
+import { cn as h } from "../../../helpers/cn.js";
 import { resolveSx as je } from "../../../helpers/sx.js";
 import { TOP_LAYER_PROPS as Ue, TOP_LAYER_RESET_STYLE as Ve, getOpenModalDialogAncestor as re, shouldUsePopoverTopLayer as qe, useTopLayerRef as Ye } from "../../../hooks/useTopLayer.hook.js";
 import { ChevronDownIcon as ze } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
@@ -11,12 +11,12 @@ import { useFormControlContext as Xe } from "../../miscellaneous/FormControlCont
 import { Children as se, cloneElement as Ze, isValidElement as f, useEffect as B, useId as et, useRef as tt, useState as x } from "react";
 import { jsx as l, jsxs as L } from "react/jsx-runtime";
 import { FloatingPortal as ot, autoUpdate as rt, flip as st, offset as nt, shift as lt, size as it, useClick as at, useDismiss as ct, useFloating as dt, useInteractions as ut, useMergeRefs as ft, useRole as pt } from "@floating-ui/react";
-var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, errorText: ie, helperText: j, reserveHelperText: ae, expandHelperText: ce = !0, allowClear: U, disabled: de, readOnly: c, name: w, placeholder: S, displayEmpty: C, multiple: d, renderValue: V, fullWidth: ue, className: fe, style: pe, sx: me, variant: be, children: q, MenuProps: ge, onFocus: he, onBlur: ye, labelId: v }) => {
-  const u = Xe(), A = `${T}-listbox`, R = be === "standard", p = le ?? u?.error ?? !1, n = de ?? u?.disabled ?? !1, Y = p ? ie ?? j : j, { show: F, role: xe } = Je("StyledSelect", p, Y, ae, c), z = et(), { fieldRef: we, rowRef: ve, rowStyle: Ae } = Ge(ce && F), [r, K] = x(!1), [k, I] = x(!1), [m, b] = x(null), [Re, W] = x(ne), O = M !== void 0, o = O ? M : Re, i = Array.isArray(o) ? o.length > 0 : o !== void 0 && o !== "" && o !== null, g = se.toArray(q), G = (e) => d ? Array.isArray(o) && o.includes(e) : e === o, s = g.flatMap((e, t) => f(e) && !e.props.disabled ? [t] : []), E = g.findIndex((e) => f(e) && G(e.props.value)), ke = (e = 1) => s.includes(E) ? E : s[e === 1 ? 0 : s.length - 1] ?? null, D = m === null ? void 0 : `${A}-option-${m}`, P = tt(null), h = (e) => {
-    K(e), e || b(null);
-  }, { refs: { domReference: De, reference: J, setFloating: Se, setReference: Ce }, floatingStyles: Fe, context: N } = dt({
+var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, errorText: ie, helperText: j, reserveHelperText: ae, expandHelperText: ce = !0, allowClear: U, disabled: de, readOnly: c, name: w, placeholder: S, displayEmpty: C, multiple: d, renderValue: V, fullWidth: ue, className: fe, style: pe, sx: me, variant: ge, children: q, MenuProps: be, onFocus: ye, onBlur: he, labelId: v }) => {
+  const u = Xe(), A = `${T}-listbox`, R = ge === "standard", p = le ?? u?.error ?? !1, n = de ?? u?.disabled ?? !1, Y = p ? ie ?? j : j, { show: F, role: xe } = Je("StyledSelect", p, Y, ae, c), z = et(), { fieldRef: we, rowRef: ve, rowStyle: Ae } = Ge(ce && F), [r, K] = x(!1), [k, I] = x(!1), [m, g] = x(null), [Re, W] = x(ne), O = M !== void 0, o = O ? M : Re, i = Array.isArray(o) ? o.length > 0 : o !== void 0 && o !== "" && o !== null, b = se.toArray(q), G = (e) => d ? Array.isArray(o) && o.includes(e) : e === o, s = b.flatMap((e, t) => f(e) && !e.props.disabled ? [t] : []), _ = b.findIndex((e) => f(e) && G(e.props.value)), ke = (e = 1) => s.includes(_) ? _ : s[e === 1 ? 0 : s.length - 1] ?? null, D = m === null ? void 0 : `${A}-option-${m}`, E = tt(null), y = (e) => {
+    K(e), e || g(null);
+  }, { refs: { domReference: De, reference: J, setFloating: Se, setReference: Ce }, floatingStyles: Fe, context: P } = dt({
     open: r,
-    onOpenChange: h,
+    onOpenChange: y,
     placement: "bottom-start",
     strategy: "fixed",
     whileElementsMounted: rt,
@@ -29,10 +29,10 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
       } })
     ]
   }), { getReferenceProps: Ie, getFloatingProps: Oe } = ut([
-    at(N, { enabled: !n && !c }),
-    ct(N),
-    pt(N, { role: "listbox" })
-  ]), [Q, X] = x(), _ = qe(Q), Ee = ft([Ye(Se, _), P]);
+    at(P, { enabled: !n && !c }),
+    ct(P),
+    pt(P, { role: "listbox" })
+  ]), [Q, X] = x(), N = qe(Q), _e = ft([Ye(Se, N), E]);
   B(() => u?.setFocused(r || k), [
     r,
     k,
@@ -45,8 +45,8 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
   ]), B(() => {
     if (!r) return;
     const e = requestAnimationFrame(() => {
-      const t = D ? document.getElementById(D) : P.current?.querySelector('[role="option"][aria-selected="true"]');
-      t && P.current?.contains(t) && t.scrollIntoView({ block: "nearest" });
+      const t = D ? document.getElementById(D) : E.current?.querySelector('[role="option"][aria-selected="true"]');
+      t && E.current?.contains(t) && t.scrollIntoView({ block: "nearest" });
     });
     return () => cancelAnimationFrame(e);
   }, [D, r]);
@@ -55,14 +55,14 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
     O || W(oe), $?.({ target: {
       value: oe,
       name: w
-    } }, t), a && (h(!1), requestAnimationFrame(() => De.current?.focus()));
+    } }, t), a && (y(!1), requestAnimationFrame(() => De.current?.focus()));
   }, ee = () => {
     const e = d ? [] : "";
     O || W(e), $?.({ target: {
       value: e,
       name: w
-    } }, null), h(!1), I(!1);
-  }, Pe = se.map(q, (e, t) => {
+    } }, null), y(!1), I(!1);
+  }, Ee = se.map(q, (e, t) => {
     if (!f(e)) return e;
     const a = e.props.value;
     return Ze(e, {
@@ -70,22 +70,22 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
       active: t === m,
       selected: G(a),
       onClick: () => {
-        b(null), Z(a, e.props.children);
+        g(null), Z(a, e.props.children);
       }
     });
-  }), Ne = g.find((e) => f(e) && e.props.value === o), _e = V ? V(o) : d && Array.isArray(o) ? g.filter((e) => f(e) && o.includes(e.props.value)).map((e) => {
+  }), Pe = b.find((e) => f(e) && e.props.value === o), Ne = V ? V(o) : d && Array.isArray(o) ? b.filter((e) => f(e) && o.includes(e.props.value)).map((e) => {
     const t = e.props.children;
     return typeof t == "string" || typeof t == "number" ? String(t) : "";
-  }).join(", ") : Ne?.props.children, He = (e) => {
-    s.length !== 0 && b((t) => {
-      const a = s.indexOf(t ?? E ?? -1);
+  }).join(", ") : Pe?.props.children, He = (e) => {
+    s.length !== 0 && g((t) => {
+      const a = s.indexOf(t ?? _ ?? -1);
       return a === -1 ? s[e === 1 ? 0 : s.length - 1] ?? null : s[Math.min(Math.max(a + e, 0), s.length - 1)] ?? null;
     });
   }, te = (e) => {
-    const t = m === null ? void 0 : g[m];
+    const t = m === null ? void 0 : b[m];
     !f(t) || t.props.disabled || Z(t.props.value, t.props.children, e);
   }, Be = (e = 1) => {
-    X(re(J.current)), b(ke(e)), K(!0);
+    X(re(J.current)), g(ke(e)), K(!0);
   }, Le = (e) => {
     if ((e.key === "Backspace" || e.key === "Delete") && U && i && !n && !c) {
       e.preventDefault(), ee();
@@ -96,12 +96,12 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
         e.preventDefault(), Be(e.key === "ArrowDown" ? 1 : -1);
         return;
       }
-      r && (e.key === "ArrowDown" || e.key === "ArrowUp" ? (e.preventDefault(), He(e.key === "ArrowDown" ? 1 : -1)) : e.key === "Home" || e.key === "End" ? (e.preventDefault(), b(s[e.key === "Home" ? 0 : s.length - 1] ?? null)) : e.key === " " ? (e.preventDefault(), te(!1)) : e.key === "Enter" ? (e.preventDefault(), te(!0)) : e.key === "Escape" ? (e.preventDefault(), h(!1)) : e.key === "Tab" && h(!1));
+      r && (e.key === "ArrowDown" || e.key === "ArrowUp" ? (e.preventDefault(), He(e.key === "ArrowDown" ? 1 : -1)) : e.key === "Home" || e.key === "End" ? (e.preventDefault(), g(s[e.key === "Home" ? 0 : s.length - 1] ?? null)) : e.key === " " ? (e.preventDefault(), te(!1)) : e.key === "Enter" ? (e.preventDefault(), te(!0)) : e.key === "Escape" ? (e.preventDefault(), y(!1)) : e.key === "Tab" && y(!1));
     }
   }, H = R && (r || k), Te = n ? "text-delta-300" : H ? "text-gama-500" : "text-delta-800", Me = n ? "text-delta-300" : "text-delta-700";
   return /* @__PURE__ */ L("div", {
     ref: we,
-    className: y("group relative inline-flex flex-col", ue && "w-full", fe),
+    className: h("group relative inline-flex flex-col", ue && "w-full", fe),
     style: {
       fontFamily: "Roboto, Helvetica, Arial, sans-serif",
       ...je(me),
@@ -128,17 +128,17 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
         "aria-disabled": n ? !0 : void 0,
         disabled: n,
         onFocus: (e) => {
-          I(!0), he?.(e);
+          I(!0), ye?.(e);
         },
         onBlur: (e) => {
-          I(!1), ye?.(e);
+          I(!1), he?.(e);
         },
         style: { minWidth: i && !R ? 105 : void 0 },
-        className: y("relative flex w-full items-center justify-between text-left outline-none", "h-10 rounded-lg border-0 px-3 text-base transition-colors", "asma-touch-ready", H ? "bg-gama-50" : "bg-transparent", Te, R && "min-w-0", n && "cursor-not-allowed", c && "pointer-events-none"),
+        className: h("relative flex w-full items-center justify-between text-left outline-none", "h-10 rounded-lg border-0 px-3 text-base transition-colors", "asma-touch-ready", H ? "bg-gama-50" : "bg-transparent", Te, R && "min-w-0", n && "cursor-not-allowed", c && "pointer-events-none"),
         children: [
           /* @__PURE__ */ l("span", {
-            className: y("min-w-0 flex-1 truncate", !i && "text-delta-500"),
-            children: i || C ? _e : S
+            className: h("min-w-0 flex-1 truncate", !i && "text-delta-500"),
+            children: i || C ? Ne : S
           }),
           /* @__PURE__ */ L("span", {
             className: "flex items-center gap-1",
@@ -156,7 +156,7 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
             }), /* @__PURE__ */ l(ze, {
               width: 24,
               height: 24,
-              className: y("shrink-0 transition-transform", H ? "text-gama-500" : Me, r && "flip-180")
+              className: h("shrink-0 transition-transform", H ? "text-gama-500" : Me, r && "flip-180")
             })]
           }),
           /* @__PURE__ */ l("div", { className: Qe({
@@ -171,21 +171,21 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
       r && /* @__PURE__ */ l(ot, {
         root: Q,
         children: /* @__PURE__ */ l("ul", {
-          ref: Ee,
+          ref: _e,
           ...Oe(),
           id: A,
           role: "listbox",
           "aria-multiselectable": d ? !0 : void 0,
           "aria-labelledby": v,
           "aria-label": v ? void 0 : w,
-          ..._ ? Ue : {},
+          ...N ? Ue : {},
           style: {
-            ..._ ? Ve : {},
+            ...N ? Ve : {},
             ...Fe,
             fontFamily: "Roboto, Helvetica, Arial, sans-serif"
           },
-          className: y("z-[1300] m-0 max-h-72 list-none overflow-auto rounded border border-solid border-delta-300 bg-white px-0 py-2 shadow-[0px_2px_4px_0px_rgba(34,33,51,0.15)]", "[&>li:not(:last-child)]:border-0 [&>li:not(:last-child)]:border-b", "[&>li:not(:last-child)]:border-solid [&>li:not(:last-child)]:border-delta-200", ge?.className),
-          children: Pe
+          className: h("z-[1300] m-0 max-h-72 list-none overflow-auto rounded border border-solid border-delta-300 bg-white px-0 py-2 shadow-[0px_2px_4px_0px_rgba(34,33,51,0.15)]", "[&>li:not(:last-child)]:shadow-[inset_0_-1px_0_var(--colors-delta-200)]", be?.className),
+          children: Ee
         })
       }),
       F && /* @__PURE__ */ l(We, {