asma-ui-core 3.73.1 → 3.74.1

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

@@ -1,25 +1,25 @@
-import { cn as $ } from "../../../../helpers/cn.js";
+import { cn as j } from "../../../../helpers/cn.js";
 import { LoadingIcon as Y } from "../../../icons/loading-icon/LoadingIcon.js";
 import { CheckIcon as Z } from "../../../icons/check-icon/CheckIcon.js";
 import { PlusIconCircle as ee } from "../../../icons/plus-icon-circle/PlusIconCircle.js";
-import { StyledChip as j } from "../../../data-display/chip/StyledChip.js";
+import { StyledChip as B } from "../../../data-display/chip/StyledChip.js";
 import { StyledCheckbox as te } from "../../checkbox/base-ui/StyledCheckbox.js";
-import { StyledTooltip as B } from "../../../data-display/tooltip/StyledTooltip.js";
+import { StyledTooltip as L } from "../../../data-display/tooltip/StyledTooltip.js";
 import { StyledInputField as le } from "../../input-field/StyledInputField.js";
-import { StyledSelectAutocomplete as ae } from "../../select-autocomplete/StyledSelectAutocomplete.js";
-import { DynamicInteractiveChipGroup as re } from "./DynamicInteractiveChipGroup.js";
-import { createElement as L, forwardRef as oe, useCallback as b, useState as ne } from "react";
-import { Fragment as q, jsx as l, jsxs as O } from "react/jsx-runtime";
-var ye = oe((S, E) => {
-  const [F, k] = ne(!1), { options: f, dataTest: g, value: x, readOnly: u, multiple: o, required: z, onChange: y, size: H, title: v, noOptionsText: K, placeholder: _, disabled: I, helperText: R, disableHelperText: A, error: G, valueKey: N = "value", labelKey: W = "label", renderLabel: i, getOptionTooltip: P, startAdornment: J, autocompleteProps: n, loading: m, maxTags: M, onFocus: Q, onBlur: U } = S, C = f.length < 11, s = (e) => typeof e == "object" ? e?.[W]?.toString() ?? "" : e?.toString() ?? "", p = b((e) => typeof e == "object" ? e?.[N] : e, [N]), V = b((e, t) => p(e) === p(t), [p]), w = (e) => {
-    const t = p(e);
+import { StyledSelectAutocomplete as re } from "../../select-autocomplete/StyledSelectAutocomplete.js";
+import { DynamicInteractiveChipGroup as ae } from "./DynamicInteractiveChipGroup.js";
+import { createElement as q, forwardRef as oe, useCallback as f, useState as ne } from "react";
+import { Fragment as E, jsx as l, jsxs as O } from "react/jsx-runtime";
+var ye = oe((k, F) => {
+  const [z, S] = ne(!1), { options: h, dataTest: g, value: x, readOnly: u, multiple: o, required: H, onChange: y, size: K, title: v, noOptionsText: _, placeholder: R, disabled: I, helperText: G, disableHelperText: A, error: N, valueKey: P = "value", labelKey: W = "label", renderLabel: i, getOptionTooltip: V, startAdornment: J, autocompleteProps: n, loading: m, maxTags: M, onFocus: Q, onBlur: U } = k, w = h.length < 11, s = (e) => typeof e == "object" ? e?.[W]?.toString() ?? "" : e?.toString() ?? "", b = f((e) => typeof e == "object" ? e?.[P] : e, [P]), D = f((e, t) => b(e) === b(t), [b]), C = (e) => {
+    const t = b(e);
     return t == null ? "" : typeof t == "string" || typeof t == "number" || typeof t == "boolean" ? String(t) : e == null ? "" : s(e);
-  }, D = b((e) => {
-    k(!0), n?.onOpen?.(e);
-  }, [n]), X = b((e, t) => {
-    k(!1), n?.onClose?.(e, t);
+  }, $ = f((e) => {
+    S(!0), n?.onOpen?.(e);
+  }, [n]), X = f((e, t) => {
+    S(!1), n?.onClose?.(e, t);
   }, [n]);
-  if (o && u) return /* @__PURE__ */ l(re, { ...S });
+  if (o && u) return /* @__PURE__ */ l(ae, { ...k });
   const T = v ? `${g}-title` : void 0;
   return /* @__PURE__ */ O("div", {
     className: "flex w-full flex-col gap-y-1",
@@ -27,20 +27,20 @@ var ye = oe((S, E) => {
       id: T,
       className: "text-base font-semibold text-delta-800",
       children: v
-    }), /* @__PURE__ */ l(ae, {
-      open: F,
-      onOpen: D,
+    }), /* @__PURE__ */ l(re, {
+      open: z,
+      onOpen: $,
       onClose: X,
       disableCloseOnSelect: o,
       dataTest: g,
       disabled: !!I || !!m,
-      noOptionsText: K,
+      noOptionsText: _,
       loading: m,
       readOnly: u,
       value: x,
-      size: H,
-      disableClearable: z,
-      options: f,
+      size: K,
+      disableClearable: H,
+      options: h,
       fullWidth: !0,
       classes: { listbox: "max-h-[300px]" },
       getOptionLabel: n?.getOptionLabel ?? s,
@@ -48,30 +48,30 @@ var ye = oe((S, E) => {
         y(t);
       },
       filterSelectedOptions: !1,
-      isOptionEqualToValue: n?.isOptionEqualToValue ?? V,
+      isOptionEqualToValue: n?.isOptionEqualToValue ?? D,
       autoHeight: !0,
       multiple: o,
       renderValue: o ? (e) => {
         if (!Array.isArray(e)) return null;
-        const t = e, d = M ?? f.length, a = t.slice(0, d), c = t.length - d;
-        return [...a.map((r) => /* @__PURE__ */ l(j, {
-          dataTest: `${w(r)}-chip`,
+        const t = e, d = M ?? h.length, r = t.slice(0, d), c = t.length - d;
+        return [...r.map((a) => /* @__PURE__ */ l(B, {
+          dataTest: `${C(a)}-chip`,
           readOnly: u,
           variant: "outlined",
-          label: i ? i(r) : s(r),
+          label: i ? i(a) : s(a),
           classes: {
             root: "h-fit w-fit min-h-[32px]",
             label: "block whitespace-normal"
           },
           disabled: !!I || !!m,
           onDelete: () => {
-            Array.isArray(x) && y(x.filter((h) => !V(h, r)));
+            Array.isArray(x) && y(x.filter((p) => !D(p, a)));
           }
-        }, w(r))), c > 0 ? /* @__PURE__ */ l(j, {
+        }, C(a))), c > 0 ? /* @__PURE__ */ l(B, {
           dataTest: "remaining-count-tag-chip",
           label: `+${c}`,
           variant: "outlined",
-          onClick: D
+          onClick: $
         }, "remaining-count") : null];
       } : void 0,
       popupIcon: m ? /* @__PURE__ */ l(Y, {
@@ -82,54 +82,54 @@ var ye = oe((S, E) => {
         width: 24
       }) : void 0,
       renderOption: (e, t, d) => {
-        const a = typeof t == "object" ? !!t?.disabled : !1, c = P ? P(t) : null;
+        const r = typeof t == "object" ? !!t?.disabled : !1, c = V ? V(t) : null;
         if (o) {
-          const h = d.selected;
-          return /* @__PURE__ */ L("li", {
+          const p = d.selected;
+          return /* @__PURE__ */ q("li", {
             ...e,
             role: "option",
-            "aria-selected": h,
+            "aria-selected": p,
             key: e.id,
-            onClick: a ? void 0 : e.onClick,
-            className: $("flex min-h-10 cursor-pointer items-center gap-x-1 bg-white px-2 text-base aria-selected:bg-gama-50 hover:bg-gama-50", a && "cursor-not-allowed bg-delta-50 aria-selected:!bg-delta-50 hover:!bg-delta-50 [&_*]:cursor-not-allowed"),
-            "aria-disabled": a
-          }, /* @__PURE__ */ l(B, {
+            onClick: r ? void 0 : e.onClick,
+            className: j("flex min-h-10 cursor-pointer items-center gap-x-1 bg-white px-2 text-base aria-selected:bg-gama-50 hover:bg-gama-50", "border-0 border-b border-solid border-delta-200 last:border-b-0", r && "cursor-not-allowed bg-delta-50 aria-selected:!bg-delta-50 hover:!bg-delta-50 [&_*]:cursor-not-allowed"),
+            "aria-disabled": r
+          }, /* @__PURE__ */ l(L, {
             arrow: !0,
             title: c,
-            children: /* @__PURE__ */ O(q, { children: [/* @__PURE__ */ l(te, {
-              disabled: a,
-              dataTest: `${w(t)}-checkbox`,
+            children: /* @__PURE__ */ O(E, { children: [/* @__PURE__ */ l(te, {
+              disabled: r,
+              dataTest: `${C(t)}-checkbox`,
               size: "small",
               decorative: !0,
               className: "min-w-[36px]",
-              checked: h
+              checked: p
             }), i ? i(t) : /* @__PURE__ */ l("span", {
-              className: "h-fit text-base text-delta-800",
+              className: "line-clamp-2 h-fit min-w-0 flex-1 break-words text-base text-delta-800",
               children: s(t)
             })] })
           }));
         }
-        const r = d.selected;
-        return /* @__PURE__ */ L("li", {
+        const a = d.selected;
+        return /* @__PURE__ */ q("li", {
           ...e,
           role: "option",
-          "aria-selected": r,
+          "aria-selected": a,
           key: e.id,
-          className: $("flex min-h-10 cursor-pointer items-center gap-x-1 px-2 text-base aria-selected:bg-gama-50 hover:bg-gama-50", a && "cursor-not-allowed bg-delta-50 aria-selected:!bg-delta-50 hover:!bg-delta-50 [&_*]:cursor-not-allowed"),
-          onClick: a ? void 0 : e.onClick,
-          "aria-disabled": a
-        }, /* @__PURE__ */ l(B, {
+          className: j("flex min-h-10 cursor-pointer items-center gap-x-1 px-2 text-base aria-selected:bg-gama-50 hover:bg-gama-50", "border-0 border-b border-solid border-delta-200 last:border-b-0", 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
+        }, /* @__PURE__ */ l(L, {
           arrow: !0,
           title: c,
-          children: /* @__PURE__ */ O(q, { children: [/* @__PURE__ */ l("span", {
+          children: /* @__PURE__ */ O(E, { children: [/* @__PURE__ */ l("span", {
             className: "w-5 min-w-5",
-            children: r && /* @__PURE__ */ l(Z, {
+            children: a && /* @__PURE__ */ l(Z, {
               className: "size-5 min-h-5 min-w-5 text-gama-500",
               height: 20,
               width: 20
             })
           }), i ? i(t) : /* @__PURE__ */ l("span", {
-            className: "text-base text-delta-800",
+            className: "line-clamp-2 min-w-0 flex-1 break-words text-base text-delta-800",
             children: s(t)
           })] })
         }));
@@ -137,29 +137,29 @@ var ye = oe((S, E) => {
       renderInput: (e) => /* @__PURE__ */ l(le, {
         dataTest: `${g}-input-field`,
         ...e,
-        inputRef: E,
-        error: G,
-        helperText: A ? void 0 : R,
-        reserveHelperText: !A,
+        inputRef: F,
+        error: N,
+        helperText: A ? void 0 : G,
+        reserveHelperText: A ? !1 : N !== void 0,
         variant: "outlined",
         label: "",
-        placeholder: _,
+        placeholder: R,
         readOnly: u,
         onFocus: Q,
         onBlur: U,
-        onKeyDown: C ? (t) => t.preventDefault() : void 0,
+        onKeyDown: w ? (t) => t.preventDefault() : void 0,
         autoComplete: "off",
         slotProps: {
           ...e.slotProps,
           input: {
             ...e.slotProps?.input ?? {},
             startAdornment: J ?? e.slotProps?.input?.startAdornment,
-            style: C ? { caretColor: "transparent" } : {}
+            style: w ? { caretColor: "transparent" } : {}
           },
           htmlInput: {
             ...e.slotProps?.htmlInput ?? {},
             ...T ? { "aria-labelledby": T } : {},
-            style: C ? { caretColor: "transparent" } : {}
+            style: w ? { caretColor: "transparent" } : {}
           }
         }
       }),

package/dist/components/inputs/input-field/StyledInputField.js

@@ -1,125 +1,122 @@
-import { cn as s } from "../../../helpers/cn.js";
-import { resolveSx as E } from "../../../helpers/sx.js";
+import { cn as a } from "../../../helpers/cn.js";
+import { resolveSx as D } from "../../../helpers/sx.js";
 import { CloseIcon as Qe } from "../../icons/close-icon/CloseIcon.js";
-import { ErrorOutlineIcon as Xe } from "../../icons/error-outline-icon/ErrorOutlineIcon.js";
-import { useHelperAlertRole as Ze } from "../../../helpers/useHelperAlertRole.js";
-import { useHelperRowBudget as qe } from "../../../helpers/useHelperRowBudget.js";
-import { warnMissingErrorMessage as Oe } from "../../../helpers/warnMissingErrorMessage.js";
-import { floatingLabelClass as et, floatingLabelLayoutStyle as tt, notchedLegendClass as nt, notchedOutlineClass as X, singleLineInputLayoutStyle as ot, singleLineShellLayoutStyle as it } from "../field-styles.js";
-import S from "./StyledInputField.module.js";
-import { Children as lt, useCallback as at, useId as st, useLayoutEffect as Z, useRef as q, useState as k } from "react";
-import { jsx as i, jsxs as p } from "react/jsx-runtime";
-import { useMergeRefs as O } from "@floating-ui/react";
-var Ft = ({ dataTest: h, label: a, value: u, defaultValue: b, onChange: ee, onBlur: te, onFocus: ne, error: o, helperText: I, reserveHelperText: D = !0, expandHelperText: oe = !0, disabled: r, readOnly: t, required: v, allowClear: ie, onClear: le, type: ae = "text", placeholder: se, name: re, id: de, autoComplete: ce, autoFocus: me, multiline: d, rows: R, minRows: L, maxRows: A, size: pe = "medium", fullWidth: he, className: ue, style: ge, sx: fe, inputRef: xe, slotProps: n, InputProps: P, onKeyDown: T, onClick: ye, variant: rt }) => {
-  const Se = st(), w = de ?? Se, $ = `${w}-helper-text`, j = q(null), z = q(null), [be, Ie] = k(void 0), [H, K] = k(!1), [Le, U] = k(b != null && b !== ""), C = u !== void 0, V = C ? u !== "" && u != null : Le, He = !!r || !!t, _ = n?.input?.startAdornment ?? P?.startAdornment, g = lt.count(_) > 0, c = g && Array.isArray(_), f = n?.input?.endAdornment ?? P?.endAdornment, M = !!(ie && V && !He), { ref: Ne, ...l } = n?.htmlInput ?? {}, ve = xe ?? Ne, { className: Re, style: B, ref: Ae } = n?.input ?? {}, we = O([Ae]), Ce = n?.input?.onMouseDown, _e = ce ?? l.autoComplete, Me = re ?? l.name, N = H || V || g, Be = (e) => {
-    t || (C || U(e.target.value !== ""), ee?.(e));
-  }, Fe = (e) => {
-    !r && !t && K(!0), ne?.(e);
-  }, Ee = (e) => {
-    !r && !t && K(!1), te?.(e);
+import { HelperRow as Xe } from "../../../helpers/HelperRow.js";
+import { useHelperRowBudget as Ze } from "../../../helpers/useHelperRowBudget.js";
+import { useHelperSlot as qe } from "../../../helpers/useHelperSlot.js";
+import { floatingLabelClass as Oe, floatingLabelLayoutStyle as et, notchedLegendClass as tt, notchedOutlineClass as Q, singleLineInputLayoutStyle as nt, singleLineShellLayoutStyle as ot } from "../field-styles.js";
+import y from "./StyledInputField.module.js";
+import { Children as it, useCallback as lt, useId as at, useLayoutEffect as X, useRef as Z, useState as E } from "react";
+import { jsx as o, jsxs as S } from "react/jsx-runtime";
+import { useMergeRefs as q } from "@floating-ui/react";
+var Bt = ({ dataTest: h, label: l, value: m, defaultValue: b, onChange: O, onBlur: ee, onFocus: te, error: c, helperText: P, reserveHelperText: ne, expandHelperText: oe = !0, disabled: s, readOnly: t, required: v, allowClear: ie, onClear: le, type: ae = "text", placeholder: se, name: re, id: de, autoComplete: ce, autoFocus: pe, multiline: r, rows: N, minRows: H, maxRows: R, size: he = "medium", fullWidth: me, className: ue, style: ge, sx: fe, inputRef: xe, slotProps: n, InputProps: T, onKeyDown: k, onClick: ye, variant: st }) => {
+  const Se = at(), A = de ?? Se, $ = `${A}-helper-text`, j = Z(null), z = Z(null), [be, He] = E(void 0), [L, K] = E(!1), [Le, U] = E(b != null && b !== ""), C = m !== void 0, V = C ? m !== "" && m != null : Le, Ie = !!s || !!t, w = n?.input?.startAdornment ?? T?.startAdornment, u = it.count(w) > 0, d = u && Array.isArray(w), g = n?.input?.endAdornment ?? T?.endAdornment, _ = !!(ie && V && !Ie), { ref: ve, ...i } = n?.htmlInput ?? {}, Ne = xe ?? ve, { className: Re, style: B, ref: Ae } = n?.input ?? {}, Ce = q([Ae]), we = n?.input?.onMouseDown, _e = ce ?? i.autoComplete, Be = re ?? i.name, I = L || V || u, Fe = (e) => {
+    t || (C || U(e.target.value !== ""), O?.(e));
+  }, Me = (e) => {
+    !s && !t && K(!0), te?.(e);
+  }, De = (e) => {
+    !s && !t && K(!1), ee?.(e);
   };
-  Z(() => {
+  X(() => {
     const e = j.current;
-    if (!d || R != null || !e) return;
+    if (!r || N != null || !e) return;
     e.style.height = "auto";
-    const m = getComputedStyle(e), y = Number.parseFloat(m.lineHeight) || 24, Q = Number.parseFloat(m.paddingTop) + Number.parseFloat(m.paddingBottom), Ge = L ? L * y + Q : 0, Je = A ? A * y + Q : Number.POSITIVE_INFINITY;
+    const p = getComputedStyle(e), x = Number.parseFloat(p.lineHeight) || 24, J = Number.parseFloat(p.paddingTop) + Number.parseFloat(p.paddingBottom), Ge = H ? H * x + J : 0, Je = R ? R * x + J : Number.POSITIVE_INFINITY;
     e.style.height = `${Math.min(Je, Math.max(Ge, e.scrollHeight))}px`;
   }, [
     b,
-    A,
-    L,
-    d,
     R,
-    u
+    H,
+    r,
+    N,
+    m
   ]);
-  const W = O([ve, at((e) => {
+  const W = q([Ne, lt((e) => {
     j.current = e instanceof HTMLTextAreaElement ? e : null;
-  }, [])]), { style: F, ...ke } = l, x = !d && !c, { height: dt, minHeight: ct, maxHeight: mt, paddingTop: pt, paddingBottom: ht, ...De } = B ?? {}, Pe = x ? {
-    ...De,
-    ...it()
-  } : c ? {
+  }, [])]), { style: F, ...Ee } = i, f = !r && !d, { height: rt, minHeight: dt, maxHeight: ct, paddingTop: pt, paddingBottom: ht, ...Pe } = B ?? {}, Te = f ? {
+    ...Pe,
+    ...ot()
+  } : d ? {
     boxSizing: "border-box",
     minHeight: 40,
     ...B
-  } : B, { height: ut, minHeight: gt, maxHeight: ft, paddingTop: xt, paddingBottom: yt, paddingLeft: St, paddingRight: Te, ...$e } = F ?? {}, je = x ? {
+  } : B, { height: mt, minHeight: ut, maxHeight: gt, paddingTop: ft, paddingBottom: xt, paddingLeft: yt, paddingRight: ke, ...$e } = F ?? {}, je = f ? {
     ...$e,
-    ...ot({
-      paddingLeft: g ? 40 : 14,
-      paddingRight: Te ?? be ?? (M || f ? 40 : 14)
+    ...nt({
+      paddingLeft: u ? 40 : 14,
+      paddingRight: ke ?? be ?? (_ || g ? 40 : 14)
     })
   } : F;
-  Z(() => {
-    if (!x) return;
-    const e = z.current, m = e ? Math.ceil(e.getBoundingClientRect().width) + 20 : void 0;
-    Ie((y) => y === m ? y : m);
+  X(() => {
+    if (!f) return;
+    const e = z.current, p = e ? Math.ceil(e.getBoundingClientRect().width) + 20 : void 0;
+    He((x) => x === p ? x : p);
   });
-  const ze = N || !a, Y = !t && (D || I != null || !!o);
-  Oe("StyledInputField", o, I);
-  const Ke = Ze(o), { fieldRef: Ue, rowRef: Ve, rowStyle: We } = qe(oe && Y), G = {
-    ...ke,
-    style: x ? je : F,
-    id: l.id ?? w,
-    name: Me,
+  const ze = I || !l, { show: M, role: Ke } = qe("StyledInputField", c, P, ne, t), { fieldRef: Ue, rowRef: Ve, rowStyle: We } = Ze(oe && M), Y = {
+    ...Ee,
+    style: f ? je : F,
+    id: i.id ?? A,
+    name: Be,
     placeholder: ze ? se : void 0,
-    disabled: r,
+    disabled: s,
     readOnly: t,
     required: v,
     autoComplete: _e,
-    autoFocus: me,
-    value: u,
+    autoFocus: pe,
+    value: m,
     defaultValue: b,
-    "aria-invalid": o ? !0 : void 0,
-    "aria-label": l["aria-label"] ?? (l["aria-labelledby"] ? void 0 : typeof a == "string" && a !== "" ? a : void 0),
-    "aria-describedby": !t && (D || I != null || o) ? $ : l["aria-describedby"],
-    onChange: Be,
-    onFocus: Fe,
-    onBlur: Ee,
-    onKeyDown: l.onKeyDown || T ? (e) => {
-      T?.(e), e.defaultPrevented || l.onKeyDown?.(e);
+    "aria-invalid": c ? !0 : void 0,
+    "aria-label": i["aria-label"] ?? (i["aria-labelledby"] ? void 0 : typeof l == "string" && l !== "" ? l : void 0),
+    "aria-describedby": M ? $ : i["aria-describedby"],
+    onChange: Fe,
+    onFocus: Me,
+    onBlur: De,
+    onKeyDown: i.onKeyDown || k ? (e) => {
+      k?.(e), e.defaultPrevented || i.onKeyDown?.(e);
     } : void 0
-  }, J = s(S.Input, "peer border-0 bg-transparent text-base tracking-[0.00938em] text-delta-800 outline-none placeholder:text-delta-500", c ? "box-border h-8 min-w-[60px] flex-1 py-0 pl-0 pr-0 leading-[23px]" : d ? "w-full resize-none overflow-hidden p-0 pl-0 pr-0 leading-[23px]" : s("w-full", S["Input--singleLine"]), "disabled:text-delta-300", t && "text-delta-800", Re), Ye = !d && !c ? {
-    "data-start-adornment": g ? "true" : void 0,
-    "data-end-adornment": M || f ? "true" : void 0
+  }, G = a(y.Input, "peer border-0 bg-transparent text-base tracking-[0.00938em] text-delta-800 outline-none placeholder:text-delta-500", d ? "box-border h-8 min-w-[60px] flex-1 py-0 pl-0 pr-0 leading-[23px]" : r ? "w-full resize-none overflow-hidden p-0 pl-0 pr-0 leading-[23px]" : a("w-full", y["Input--singleLine"]), "disabled:text-delta-300", t && "text-delta-800", Re), Ye = !r && !d ? {
+    "data-start-adornment": u ? "true" : void 0,
+    "data-end-adornment": _ || g ? "true" : void 0
   } : {};
-  return /* @__PURE__ */ p("div", {
+  return /* @__PURE__ */ S("div", {
     ref: Ue,
-    className: s("group relative inline-flex flex-col", ue),
+    className: a("group relative inline-flex flex-col", ue),
     onClick: ye,
     style: {
-      width: he ? "100%" : 235,
+      width: me ? "100%" : 235,
       fontFamily: "Roboto, Helvetica, Arial, sans-serif",
       letterSpacing: "0.00938em",
-      ...E(fe),
+      ...D(fe),
       ...ge
     },
-    children: [/* @__PURE__ */ p("div", {
+    children: [/* @__PURE__ */ S("div", {
       className: "relative overflow-visible",
-      children: [/* @__PURE__ */ p("div", {
-        className: s("relative flex", x && S.InputShell, d && "box-border items-center px-[14px] py-[16.5px]", c && s(S.AdornmentList, f && S["AdornmentList--endAdornment"]), t && "rounded bg-delta-50"),
-        ref: we,
-        onMouseDown: Ce,
-        style: Pe,
-        "data-testid": c ? `${h}-adornment-list` : `${h}-shell`,
+      children: [/* @__PURE__ */ S("div", {
+        className: a("relative flex", f && y.InputShell, r && "box-border items-center px-[14px] py-[16.5px]", d && a(y.AdornmentList, g && y["AdornmentList--endAdornment"]), t && "rounded bg-delta-50"),
+        ref: Ce,
+        onMouseDown: we,
+        style: Te,
+        "data-testid": d ? `${h}-adornment-list` : `${h}-shell`,
         children: [
-          g && /* @__PURE__ */ i("span", {
-            className: s("items-center text-delta-500", c ? "contents" : "absolute left-3 flex"),
-            children: _
+          u && /* @__PURE__ */ o("span", {
+            className: a("items-center text-delta-500", d ? "contents" : "absolute left-3 flex"),
+            children: w
           }),
-          d ? /* @__PURE__ */ i("textarea", {
-            ...G,
+          r ? /* @__PURE__ */ o("textarea", {
+            ...Y,
             ref: W,
             "data-testid": h,
-            rows: R ?? L ?? 2,
-            className: J
-          }) : /* @__PURE__ */ i("input", {
-            ...G,
+            rows: N ?? H ?? 2,
+            className: G
+          }) : /* @__PURE__ */ o("input", {
+            ...Y,
             ...Ye,
             ref: W,
             "data-testid": h,
             type: ae,
-            className: J
+            className: G
           }),
-          M ? /* @__PURE__ */ i("button", {
+          _ ? /* @__PURE__ */ o("button", {
             type: "button",
             "aria-label": "Clear",
             "data-testid": `${h}-clear`,
@@ -127,79 +124,74 @@ var Ft = ({ dataTest: h, label: a, value: u, defaultValue: b, onChange: ee, onBl
             onClick: (e) => {
               e.stopPropagation(), e.preventDefault(), C || U(!1), le?.();
             },
-            children: /* @__PURE__ */ i(Qe, {
+            children: /* @__PURE__ */ o(Qe, {
               width: 18,
               height: 18
             })
-          }) : f && /* @__PURE__ */ i("span", {
+          }) : g && /* @__PURE__ */ o("span", {
             ref: z,
             className: "absolute inset-y-0 right-[14px] flex max-w-[calc(100%-28px)] items-center gap-1",
-            children: f
+            children: g
           }),
-          a ? /* @__PURE__ */ i("fieldset", {
+          l ? /* @__PURE__ */ o("fieldset", {
             "aria-hidden": !0,
-            className: X({
-              focused: H,
-              error: o,
-              disabled: r,
+            className: Q({
+              focused: L,
+              error: c,
+              disabled: s,
               readOnly: t,
               notched: !0
             }),
-            children: /* @__PURE__ */ i("legend", {
-              className: nt(N),
-              children: /* @__PURE__ */ p("span", {
+            children: /* @__PURE__ */ o("legend", {
+              className: tt(I),
+              children: /* @__PURE__ */ S("span", {
                 className: "inline-block px-[5px]",
-                children: [a, v && " *"]
+                children: [l, v && " *"]
               })
             })
-          }) : /* @__PURE__ */ i("div", {
+          }) : /* @__PURE__ */ o("div", {
             "aria-hidden": !0,
-            className: X({
-              focused: H,
-              error: o,
-              disabled: r,
+            className: Q({
+              focused: L,
+              error: c,
+              disabled: s,
               readOnly: t,
               notched: !1
             })
           })
         ]
-      }), a && /* @__PURE__ */ p("label", {
-        htmlFor: w,
-        className: s(et({
-          shrink: N,
-          focused: H,
-          error: o,
-          disabled: r,
+      }), l && /* @__PURE__ */ S("label", {
+        htmlFor: A,
+        className: a(Oe({
+          shrink: I,
+          focused: L,
+          error: c,
+          disabled: s,
           readOnly: t,
-          size: pe
+          size: he
         }), n?.inputLabel?.className),
         style: {
-          ...E(n?.inputLabel?.sx),
+          ...D(n?.inputLabel?.sx),
           ...n?.inputLabel?.style,
-          ...tt(N)
+          ...et(I)
         },
-        children: [a, v && " *"]
+        children: [l, v && " *"]
       })]
-    }), !t && Y && /* @__PURE__ */ p("div", {
+    }), M && /* @__PURE__ */ o(Xe, {
       ref: Ve,
       id: $,
       role: Ke,
-      className: s("mr-[14px] box-border flex min-h-[24px] items-start gap-1 pt-1", o && !n?.formHelperText?.hideErrorIcon && "text-error-500", !o && "text-delta-600", n?.formHelperText?.className),
+      error: c,
+      message: P,
+      hideErrorIcon: n?.formHelperText?.hideErrorIcon,
+      className: a("mr-[14px] box-border items-start", n?.formHelperText?.className),
       style: {
         ...We,
-        ...E(n?.formHelperText?.sx)
-      },
-      children: [o && !n?.formHelperText?.hideErrorIcon && /* @__PURE__ */ i(Xe, {
-        width: 20,
-        height: 20,
-        className: "min-w-5 shrink-0"
-      }), /* @__PURE__ */ i("span", {
-        className: "text-sm leading-5 tracking-[0.03333em]",
-        children: I
-      })]
+        ...D(n?.formHelperText?.sx)
+      }
     })]
   });
 };
 export {
-  Ft as StyledInputField
+  Bt as StyledInputField
 };