asma-ui-core 3.58.2 → 3.58.4

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

@@ -8,44 +8,44 @@ import { StyledTooltip as j } from "../../../data-display/tooltip/StyledTooltip.
 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 B, forwardRef as oe, useCallback as f, useState as ne } from "react";
+import { createElement as B, forwardRef as oe, useCallback as b, useState as ne } from "react";
 import { Fragment as L, jsx as l, jsxs as T } from "react/jsx-runtime";
 var ye = oe((S, q) => {
-  const [E, k] = ne(!1), { options: g, dataTest: x, value: y, readOnly: u, multiple: o, required: F, onChange: C, size: z, title: v, noOptionsText: K, placeholder: _, disabled: I, helperText: H, disableHelperText: R, error: G, valueKey: A = "value", labelKey: W = "label", renderLabel: i, getOptionTooltip: N, startAdornment: J, autocompleteProps: n, loading: m, maxTags: M, onFocus: Q, onBlur: U } = S, p = g.length < 11, s = (e) => typeof e == "object" ? e?.[W]?.toString() ?? "" : e?.toString() ?? "", h = f((e) => typeof e == "object" ? e?.[A] : e, [A]), P = f((e, t) => h(e) === h(t), [h]), w = (e) => {
-    const t = h(e);
+  const [E, k] = ne(!1), { options: f, dataTest: g, value: x, readOnly: u, multiple: o, required: F, onChange: y, size: z, title: C, noOptionsText: K, placeholder: _, disabled: I, helperText: H, disableHelperText: R, error: G, valueKey: A = "value", labelKey: W = "label", renderLabel: i, getOptionTooltip: N, startAdornment: J, autocompleteProps: n, loading: m, maxTags: M, onFocus: Q, onBlur: U } = S, v = f.length < 11, s = (e) => typeof e == "object" ? e?.[W]?.toString() ?? "" : e?.toString() ?? "", p = b((e) => typeof e == "object" ? e?.[A] : e, [A]), P = b((e, t) => p(e) === p(t), [p]), w = (e) => {
+    const t = p(e);
     return t == null ? "" : typeof t == "string" || typeof t == "number" || typeof t == "boolean" ? String(t) : e == null ? "" : s(e);
-  }, V = f((e) => {
+  }, V = b((e) => {
     k(!0), n?.onOpen?.(e);
-  }, [n]), X = f((e, t) => {
+  }, [n]), X = b((e, t) => {
     k(!1), n?.onClose?.(e, t);
   }, [n]);
   if (o && u) return /* @__PURE__ */ l(re, { ...S });
-  const O = v ? `${x}-title` : void 0;
+  const O = C ? `${g}-title` : void 0;
   return /* @__PURE__ */ T("div", {
     className: "flex w-full flex-col gap-y-1",
-    children: [v && /* @__PURE__ */ l("span", {
+    children: [C && /* @__PURE__ */ l("span", {
       id: O,
       className: "text-base font-semibold text-delta-800",
-      children: v
+      children: C
     }), /* @__PURE__ */ l(ae, {
       open: E,
       onOpen: V,
       onClose: X,
       disableCloseOnSelect: o,
-      dataTest: x,
+      dataTest: g,
       disabled: !!I || !!m,
       noOptionsText: K,
       loading: m,
       readOnly: u,
-      value: y,
+      value: x,
       size: z,
       disableClearable: F,
-      options: g,
+      options: f,
       fullWidth: !0,
       classes: { listbox: "max-h-[300px]" },
       getOptionLabel: n?.getOptionLabel ?? s,
       onChange: (e, t) => {
-        C(t);
+        y(t);
       },
       filterSelectedOptions: !1,
       isOptionEqualToValue: n?.isOptionEqualToValue ?? P,
@@ -53,7 +53,7 @@ var ye = oe((S, q) => {
       multiple: o,
       renderValue: o ? (e) => {
         if (!Array.isArray(e)) return null;
-        const t = e, c = M ?? g.length, a = t.slice(0, c), d = t.length - c;
+        const t = e, c = M ?? f.length, a = t.slice(0, c), d = t.length - c;
         return [...a.map((r) => /* @__PURE__ */ l($, {
           dataTest: `${w(r)}-chip`,
           readOnly: u,
@@ -65,7 +65,7 @@ var ye = oe((S, q) => {
           },
           disabled: !!I || !!m,
           onDelete: () => {
-            Array.isArray(y) && C(y.filter((b) => !P(b, r)));
+            Array.isArray(x) && y(x.filter((h) => !P(h, r)));
           }
         }, w(r))), d > 0 ? /* @__PURE__ */ l($, {
           dataTest: "remaining-count-tag-chip",
@@ -84,11 +84,11 @@ var ye = oe((S, q) => {
       renderOption: (e, t, c) => {
         const a = typeof t == "object" ? !!t?.disabled : !1, d = N ? N(t) : null;
         if (o) {
-          const b = c.selected;
+          const h = c.selected;
           return /* @__PURE__ */ B("li", {
             ...e,
             role: "option",
-            "aria-selected": b,
+            "aria-selected": h,
             key: e.id,
             onClick: a ? void 0 : e.onClick,
             className: D("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"),
@@ -102,7 +102,7 @@ var ye = oe((S, q) => {
               size: "small",
               decorative: !0,
               className: "min-w-[36px]",
-              checked: b
+              checked: h
             }), i ? i(t) : /* @__PURE__ */ l("span", {
               className: "h-fit text-base text-delta-700",
               children: s(t)
@@ -135,7 +135,7 @@ var ye = oe((S, q) => {
         }));
       },
       renderInput: (e) => /* @__PURE__ */ l(le, {
-        dataTest: `${x}-input-field`,
+        dataTest: `${g}-input-field`,
         ...e,
         inputRef: q,
         error: G,
@@ -146,19 +146,19 @@ var ye = oe((S, q) => {
         readOnly: u,
         onFocus: Q,
         onBlur: U,
-        onKeyDown: p ? (t) => t.preventDefault() : void 0,
-        autoComplete: p ? "off" : "on",
+        onKeyDown: v ? (t) => t.preventDefault() : void 0,
+        autoComplete: "off",
         slotProps: {
           ...e.slotProps,
           input: {
             ...e.slotProps?.input ?? {},
             startAdornment: J ?? e.slotProps?.input?.startAdornment,
-            style: p ? { caretColor: "transparent" } : {}
+            style: v ? { caretColor: "transparent" } : {}
           },
           htmlInput: {
             ...e.slotProps?.htmlInput ?? {},
             ...O ? { "aria-labelledby": O } : {},
-            style: p ? { caretColor: "transparent" } : {}
+            style: v ? { caretColor: "transparent" } : {}
           }
         }
       }),

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

@@ -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

@@ -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/dist/table/components/columns/action-column/components/RowActionMenu.js

@@ -4,28 +4,28 @@ import { isCustomAction as O } from "../../../../types.js";
 import { StyledTooltip as g } from "../../../../shared-components/tooltip/index.js";
 import { useToggleMenuVisibility as j } from "../../../../hooks/useToggleMenuVisibility.hook.js";
 import { StyledButton as k } from "../../../../shared-components/button/StyledButton.js";
-import { DotsVerticalIcon as D } from "../../../../shared-components/DotsVerticalIcon.js";
-import { StyledMenuItem as F } from "../../../../shared-components/StyledMenuItem.js";
-import { CircleWarningOutlineIcon as I } from "../../../../shared-components/CircleWarningOutlineIcon.js";
-import w, { useEffect as R, useMemo as V, useState as z } from "react";
+import { DotsVerticalIcon as F } from "../../../../shared-components/DotsVerticalIcon.js";
+import { StyledMenuItem as I } from "../../../../shared-components/StyledMenuItem.js";
+import { CircleWarningOutlineIcon as R } from "../../../../shared-components/CircleWarningOutlineIcon.js";
+import w, { useEffect as V, useMemo as z, useState as D } from "react";
 import { jsx as t, jsxs as b } from "react/jsx-runtime";
 function X({ tableData: o, actions: v, rowActionsState: C }) {
-  const { anchorEl: x, open: d, handleClose: s, handleOpen: P } = j(), i = v(o.row), n = C?.(o.row) ?? { state: "enabled" }, p = o.table.options.meta?.locale, y = p === "no" ? "Ingen handlinger tilgjengelig" : "No actions available", N = p === "no" ? "Radhandlinger" : "Row actions", T = V(() => i.every((e) => "component" in e ? !1 : e.hide), [i]), u = i.length > 0 && !T, m = n.state === "enabled" && !u, M = n.state !== "hidden" && (u || m || n.state === "disabled"), [a, l] = z(!1);
-  if (R(() => {
-    if (!a) return;
-    const e = window.setTimeout(() => l(!1), 1600);
+  const { anchorEl: x, open: a, handleClose: i, handleOpen: P } = j(), l = v(o.row), n = C?.(o.row) ?? { state: "enabled" }, p = o.table.options.meta?.locale, y = p === "no" ? "Ingen handlinger tilgjengelig" : "No actions available", N = p === "no" ? "Radhandlinger" : "Row actions", T = z(() => l.every((e) => "component" in e ? !1 : e.hide), [l]), u = l.length > 0 && !T, m = n.state === "enabled" && !u, M = n.state !== "hidden" && (u || m || n.state === "disabled"), [c, s] = D(!1);
+  if (V(() => {
+    if (!c) return;
+    const e = window.setTimeout(() => s(!1), 1600);
     return () => window.clearTimeout(e);
-  }, [a]), !M) return /* @__PURE__ */ t("div", { className: "flex w-[40px] items-center justify-center" });
-  const c = n.state === "disabled", f = /* @__PURE__ */ t(k, {
+  }, [c]), !M) return /* @__PURE__ */ t("div", { className: "flex w-[40px] items-center justify-center" });
+  const d = n.state === "disabled", f = /* @__PURE__ */ t(k, {
     dataTest: "row-actions-button",
     "aria-label": N,
     "aria-haspopup": "true",
-    "aria-expanded": d,
+    "aria-expanded": a,
     variant: "text",
     size: "small",
-    disabled: c,
+    disabled: d,
     onClick: (e) => {
-      e.stopPropagation(), e.preventDefault(), !c && (P(e), o.row.onChangeFocused(!0));
+      e.stopPropagation(), e.preventDefault(), !d && (a ? (i(), o.row.onChangeFocused(!1)) : (P(e), o.row.onChangeFocused(!0)));
     },
     onMouseDown: (e) => {
       e.stopPropagation(), e.preventDefault();
@@ -33,8 +33,8 @@ function X({ tableData: o, actions: v, rowActionsState: C }) {
     onMouseUp: (e) => {
       e.stopPropagation(), e.preventDefault();
     },
-    children: /* @__PURE__ */ t(D, {
-      className: c ? "text-delta-300" : "text-delta-700",
+    children: /* @__PURE__ */ t(F, {
+      className: d ? "text-delta-300" : "text-delta-700",
       width: 20,
       height: 20
     })
@@ -47,13 +47,13 @@ function X({ tableData: o, actions: v, rowActionsState: C }) {
         title: n.tooltipTitle,
         arrow: !0,
         placement: n.tooltipPlacement ?? "top",
-        open: a,
-        onOpen: () => l(!0),
-        onClose: () => l(!1),
+        open: c,
+        onOpen: () => s(!0),
+        onClose: () => s(!1),
         children: /* @__PURE__ */ t("span", {
           className: "cursor-not-allowed",
           onTouchStart: (e) => {
-            e.stopPropagation(), e.preventDefault(), l(!0);
+            e.stopPropagation(), e.preventDefault(), s(!0);
           },
           onClick: (e) => {
             e.stopPropagation(), e.preventDefault();
@@ -61,40 +61,40 @@ function X({ tableData: o, actions: v, rowActionsState: C }) {
           children: f
         })
       }) : f, n.state === "enabled" && /* @__PURE__ */ t(S, {
-        open: d,
+        open: a,
         anchorEl: x,
         onClose: () => {
-          s(), o.row.onChangeFocused(!1);
+          i(), o.row.onChangeFocused(!1);
         },
         onClick: () => {
-          s(), o.row.onChangeFocused(!1);
+          i(), o.row.onChangeFocused(!1);
         },
         anchorOrigin: {
-          horizontal: "center",
+          horizontal: "right",
           vertical: "bottom"
         },
         transformOrigin: {
-          vertical: "top",
-          horizontal: "right"
+          horizontal: "right",
+          vertical: "top"
         },
         children: m ? /* @__PURE__ */ b("div", {
           className: "flex items-center gap-2 p-3 text-base text-delta-700",
-          children: [/* @__PURE__ */ t(I, {
+          children: [/* @__PURE__ */ t(R, {
             width: 20,
             height: 20
           }), /* @__PURE__ */ t("span", { children: y })]
         }) : /* @__PURE__ */ t(A, {
           disablePadding: !0,
-          children: i.map((e, h) => {
+          children: l.map((e, h) => {
             if (O(e)) {
-              const r = e.component(o.row, s);
+              const r = e.component(o.row, i);
               return w.isValidElement(r) ? /* @__PURE__ */ t(w.Fragment, { children: r }, h) : null;
             }
             return e.hide ? null : /* @__PURE__ */ t(g, {
               title: e?.tooltipTitle,
               arrow: !0,
               placement: e?.tooltipPlacement ?? "left",
-              children: /* @__PURE__ */ t("span", { children: /* @__PURE__ */ t(F, {
+              children: /* @__PURE__ */ t("span", { children: /* @__PURE__ */ t(I, {
                 className: e.className,
                 disabled: e.disabled,
                 onClick: () => {

package/package.json

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