npm - asma-ui-core - Versions diffs - 3.58.3 → 3.58.5 - Mend

asma-ui-core 3.58.3 → 3.58.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

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

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

package/dist/src/components/inputs/input-field/StyledInputField.d.ts CHANGED Viewed

@@ -46,6 +46,11 @@ export interface StyledInputFieldProps {
     placeholder?: string;
     name?: string;
     id?: string;
+    /**
+     * Standard HTML `autocomplete`. Left unset the browser decides, which is what a plain text field
+     * wants; a component that owns its own suggestion list (a combobox) must pass `'off'` so the
+     * browser's dropdown doesn't cover it. Also readable from `slotProps.htmlInput.autoComplete`.
+     */
     autoComplete?: string;
     autoFocus?: boolean;
     multiline?: boolean;

package/package.json CHANGED Viewed

@@ -3,7 +3,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "version": "3.58.3",
+    "version": "3.58.5",
     "type": "module",
     "sideEffects": [
         "**/*.css",