asma-ui-core 3.68.6 → 3.69.0

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

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

package/dist/components/inputs/radio-button/base-ui/StyledRadioGroup.js

@@ -1,44 +1,49 @@
-import { ErrorOutlineIcon as q } from "../../../icons/error-outline-icon/ErrorOutlineIcon.js";
-import { RadioGroupContext as B } from "./RadioGroupContext.js";
-import f from "clsx";
-import { forwardRef as E, useId as s, useMemo as H, useState as M } from "react";
-import { jsx as x, jsxs as h } from "react/jsx-runtime";
-var F = E(({ value: i, defaultValue: v, onValueChange: g, disabled: a, readOnly: t, dataTest: N, error: e, errorText: I, helperText: n, children: R, name: b, ...o }, w) => {
-  const l = s(), c = s(), y = s(), r = b ?? y, d = i !== void 0, [S, j] = M(v ?? null), m = d ? i : S, C = (p) => {
-    t || (d || j(p), g?.(p));
-  }, D = H(() => ({
-    name: r,
+import { ErrorOutlineIcon as H } from "../../../icons/error-outline-icon/ErrorOutlineIcon.js";
+import { RadioGroupContext as y } from "./RadioGroupContext.js";
+import { useHelperAlertRole as B } from "../../../../helpers/useHelperAlertRole.js";
+import { warnMissingErrorMessage as D } from "../../../../helpers/warnMissingErrorMessage.js";
+import u from "clsx";
+import { forwardRef as P, useId as f, useMemo as U, useState as V } from "react";
+import { jsx as x, jsxs as g } from "react/jsx-runtime";
+var W = P(({ value: i, defaultValue: h, onValueChange: v, disabled: r, readOnly: o, dataTest: N, error: e, errorText: R, helperText: n, reserveHelperText: w = !0, children: S, name: b, ...t }, G) => {
+  const l = f(), I = f(), a = b ?? I, c = i !== void 0, [M, j] = V(h ?? null), m = c ? i : M, k = (p) => {
+    o || (c || j(p), v?.(p));
+  }, A = U(() => ({
+    name: a,
     value: m,
-    disabled: a,
-    onSelect: C
+    disabled: r,
+    onSelect: k
   }), [
-    r,
+    a,
     m,
-    a
-  ]), u = (e ?? !1) || (n ?? !1), G = e ? I ?? "Required" : n, T = u ? e ? c : l : void 0, k = /\bflex-(?:row|col)\b/.test(o.className ?? "");
-  return /* @__PURE__ */ h("div", {
-    ...o,
-    ref: w,
+    r
+  ]), s = e ? R ?? n : n, d = !o && (w || s != null || !!e);
+  D("StyledRadioGroup", e, s);
+  const C = B(e), E = /\bflex-(?:row|col)\b/.test(t.className ?? "");
+  return /* @__PURE__ */ g("div", {
+    ...t,
+    ref: G,
     role: "radiogroup",
     "data-testid": N,
-    "aria-describedby": T,
+    "aria-describedby": d ? l : void 0,
     "aria-invalid": e,
-    "aria-readonly": t ? !0 : void 0,
-    className: f("flex items-start", !k && "flex-col", t && "pointer-events-none", o.className),
-    children: [/* @__PURE__ */ x(B.Provider, {
-      value: D,
-      children: R
-    }), u && /* @__PURE__ */ h("p", {
-      id: e ? c : l,
-      role: e ? "alert" : "status",
-      className: f("m-0 flex min-h-5 items-center gap-1 pt-1 text-sm leading-5 tracking-[0.03333em]", e ? "font-medium text-error-500" : "text-delta-600"),
-      children: [e && /* @__PURE__ */ x(q, {
+    "aria-readonly": o ? !0 : void 0,
+    className: u("flex items-start", !E && "flex-col", o && "pointer-events-none", t.className),
+    children: [/* @__PURE__ */ x(y.Provider, {
+      value: A,
+      children: S
+    }), d && /* @__PURE__ */ g("p", {
+      id: l,
+      role: C,
+      className: u("m-0 flex min-h-[24px] items-center gap-1 pt-1 text-sm leading-5 tracking-[0.03333em]", e ? "font-medium text-error-500" : "text-delta-600"),
+      children: [e && /* @__PURE__ */ x(H, {
         width: 20,
-        height: 20
-      }), G]
+        height: 20,
+        className: "min-w-5 shrink-0"
+      }), s]
     })]
   });
 });
 export {
-  F as StyledRadioGroup
+  W as StyledRadioGroup
 };

package/dist/components/inputs/search-field/StyledSearchField.js

@@ -4,21 +4,22 @@ import { CloseIcon as f } from "../../icons/close-icon/CloseIcon.js";
 import { StyledInputField as u } from "../input-field/StyledInputField.js";
 import { useState as v } from "react";
 import { jsx as t } from "react/jsx-runtime";
-var I = ({ value: o, onClear: s, label: n, onFocus: d, onBlur: c, ...r }) => {
-  const [h, a] = v(!1), i = h || o, l = typeof n == "string" ? n : void 0;
+var I = ({ value: o, onClear: s, label: i, onFocus: d, onBlur: c, ...r }) => {
+  const [h, l] = v(!1), a = h || o, n = typeof i == "string" ? i : void 0;
   return /* @__PURE__ */ t("div", {
     className: "relative w-full",
     children: /* @__PURE__ */ t(u, {
       size: "small",
       variant: "outlined",
       value: o,
-      label: i ? n : void 0,
-      placeholder: i ? void 0 : l,
+      reserveHelperText: !1,
+      label: a ? i : void 0,
+      placeholder: a ? void 0 : n,
       onFocus: (e) => {
-        a(!0), d?.(e);
+        l(!0), d?.(e);
       },
       onBlur: (e) => {
-        a(!1), c?.(e);
+        l(!1), c?.(e);
       },
       slotProps: {
         htmlInput: {
@@ -28,7 +29,7 @@ var I = ({ value: o, onClear: s, label: n, onFocus: d, onBlur: c, ...r }) => {
             whiteSpace: "nowrap",
             ...o ? { paddingRight: 40 } : {}
           },
-          "aria-label": i ? void 0 : l
+          "aria-label": a ? void 0 : n
         },
         input: {
           endAdornment: o ? /* @__PURE__ */ t("button", {
@@ -51,7 +52,7 @@ var I = ({ value: o, onClear: s, label: n, onFocus: d, onBlur: c, ...r }) => {
               className: "pointer-events-none"
             })
           }) : null,
-          startAdornment: i ? void 0 : /* @__PURE__ */ t("span", {
+          startAdornment: a ? void 0 : /* @__PURE__ */ t("span", {
             "data-testid": "styled-search-icon",
             className: "flex items-center",
             children: /* @__PURE__ */ t(m, {