asma-ui-core 3.105.0 → 3.106.0

package/dist/table/components/columns/action-column/components/RowActionMenu.js

@@ -1,37 +1,27 @@
-import { DotsVerticalIcon as A } from "../../../../../components/icons/dots-vertical-icon/DotsVerticalIcon.js";
-import { CircleWarningOutlineIcon as O } from "../../../../../components/icons/warning-circle-icon/CircleWarningOutlineIcon.js";
-import { StyledPopover as j } from "../../../../../components/utils/popover/StyledPopover.js";
-import { StyledMenuList as k } from "../../../../../components/navigation/menu/StyledMenuList.js";
-import { isCustomAction as R } from "../../../../types.js";
-import { StyledTooltip as b } from "../../../../shared-components/tooltip/index.js";
-import { useToggleMenuVisibility as E } from "../../../../hooks/useToggleMenuVisibility.hook.js";
-import { StyledButton as B } from "../../../../shared-components/button/StyledButton.js";
-import { StyledMenuItem as I } from "../../../../shared-components/StyledMenuItem.js";
-import v, { useEffect as L, useMemo as V, useRef as z, useState as F } from "react";
-import { jsx as t, jsxs as x } from "react/jsx-runtime";
-function _({ tableData: r, actions: y, rowActionsState: T }) {
-  const { anchorEl: C, open: c, handleClose: i, handleOpen: M } = E(), a = y(r.row), o = T?.(r.row) ?? { state: "enabled" }, u = r.table.options.meta?.locale, P = u === "no" ? "Ingen handlinger tilgjengelig" : "No actions available", N = u === "no" ? "Radhandlinger" : "Row actions", D = V(() => a.every((e) => "component" in e ? !1 : e.hide), [a]), m = a.length > 0 && !D, f = o.state === "enabled" && !m, S = o.state !== "hidden" && (m || f || o.state === "disabled"), [p, l] = F(!1), h = z(!1), s = (e) => {
-    h.current = e, l(!0);
-  };
-  if (L(() => {
-    if (!p || !h.current) return;
-    const e = window.setTimeout(() => l(!1), 1600);
-    return () => window.clearTimeout(e);
-  }, [p]), !S) return /* @__PURE__ */ t("div", { className: "flex w-[40px] items-center justify-center" });
-  const d = o.state === "disabled", g = /* @__PURE__ */ t(B, {
+import { DotsVerticalIcon as y } from "../../../../../components/icons/dots-vertical-icon/DotsVerticalIcon.js";
+import { CircleWarningOutlineIcon as D } from "../../../../../components/icons/warning-circle-icon/CircleWarningOutlineIcon.js";
+import { StyledPopover as T } from "../../../../../components/utils/popover/StyledPopover.js";
+import { StyledMenuList as A } from "../../../../../components/navigation/menu/StyledMenuList.js";
+import { isCustomAction as S } from "../../../../types.js";
+import { StyledTooltip as f } 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 { StyledMenuItem as h } from "../../../../shared-components/StyledMenuItem.js";
+import g, { useMemo as O } from "react";
+import { jsx as t, jsxs as b } from "react/jsx-runtime";
+function q({ tableData: l, actions: v, rowActionsState: w }) {
+  const { anchorEl: P, open: s, handleClose: r, handleOpen: x } = j(), i = v(l.row), n = w?.(l.row) ?? { state: "enabled" }, d = l.table.options.meta?.locale, N = d === "no" ? "Ingen handlinger tilgjengelig" : "No actions available", C = d === "no" ? "Radhandlinger" : "Row actions", M = O(() => i.every((e) => "component" in e ? !1 : e.hide), [i]), c = i.length > 0 && !M, m = n.state === "enabled" && !c;
+  if (!(n.state !== "hidden" && (c || m || n.state === "disabled"))) return /* @__PURE__ */ t("div", { className: "flex w-[40px] items-center justify-center" });
+  const a = n.state === "disabled", u = /* @__PURE__ */ t(k, {
     dataTest: "row-actions-button",
-    "aria-label": N,
+    "aria-label": C,
     "aria-haspopup": "true",
-    "aria-expanded": c,
+    "aria-expanded": s,
     variant: "text",
     size: "small",
-    "aria-disabled": d ? !0 : void 0,
+    "aria-disabled": a || void 0,
     onClick: (e) => {
-      if (e.stopPropagation(), e.preventDefault(), d) {
-        s(!1);
-        return;
-      }
-      e.currentTarget.focus({ preventScroll: !0 }), c ? i() : M(e);
+      e.stopPropagation(), e.preventDefault(), !a && (e.currentTarget.focus({ preventScroll: !0 }), s ? r() : x(e));
     },
     onMouseDown: (e) => {
       e.stopPropagation(), e.preventDefault();
@@ -39,45 +29,37 @@ function _({ tableData: r, actions: y, rowActionsState: T }) {
     onMouseUp: (e) => {
       e.stopPropagation(), e.preventDefault();
     },
-    children: /* @__PURE__ */ t(A, {
-      className: d ? "text-delta-300" : "text-delta-700",
+    children: /* @__PURE__ */ t(y, {
+      className: a ? "text-delta-300" : "text-delta-700",
       width: 20,
       height: 20
     })
   });
   return /* @__PURE__ */ t("div", {
     className: "flex w-[40px] items-center justify-center",
-    children: /* @__PURE__ */ x("div", {
+    children: /* @__PURE__ */ b("div", {
       className: "flex items-center justify-center",
-      children: [o.state === "disabled" ? /* @__PURE__ */ t(b, {
-        title: o.tooltipTitle,
+      children: [n.state === "disabled" ? /* @__PURE__ */ t(f, {
+        title: n.tooltipTitle,
         arrow: !0,
-        placement: o.tooltipPlacement ?? "top",
-        open: p,
-        onOpen: () => s(!1),
-        onClose: () => l(!1),
+        placement: n.tooltipPlacement ?? "top",
+        openOnTap: !0,
+        persistentDescription: !0,
         children: /* @__PURE__ */ t("span", {
           className: "cursor-not-allowed",
-          onMouseEnter: () => s(!1),
-          onMouseLeave: () => l(!1),
-          onFocus: () => s(!1),
-          onBlur: () => l(!1),
-          onKeyDown: (e) => {
-            e.key === "Escape" && l(!1);
-          },
           onTouchStart: (e) => {
-            e.stopPropagation(), e.preventDefault(), s(!0);
+            e.stopPropagation(), e.preventDefault();
           },
           onClick: (e) => {
             e.stopPropagation(), e.preventDefault();
           },
-          children: g
+          children: u
         })
-      }) : g, o.state === "enabled" && /* @__PURE__ */ t(j, {
-        open: c,
-        anchorEl: C,
-        onClose: i,
-        onClick: i,
+      }) : u, n.state === "enabled" && /* @__PURE__ */ t(T, {
+        open: s,
+        anchorEl: P,
+        onClose: r,
+        onClick: r,
         anchorOrigin: {
           horizontal: "right",
           vertical: "bottom"
@@ -86,38 +68,50 @@ function _({ tableData: r, actions: y, rowActionsState: T }) {
           horizontal: "right",
           vertical: "top"
         },
-        children: f ? /* @__PURE__ */ x("div", {
+        children: m ? /* @__PURE__ */ b("div", {
           className: "flex items-center gap-2 p-3 text-base text-delta-700",
-          children: [/* @__PURE__ */ t(O, {
+          children: [/* @__PURE__ */ t(D, {
             width: 20,
             height: 20
-          }), /* @__PURE__ */ t("span", { children: P })]
-        }) : /* @__PURE__ */ t(k, {
+          }), /* @__PURE__ */ t("span", { children: N })]
+        }) : /* @__PURE__ */ t(A, {
           disablePadding: !0,
-          children: a.map((e, w) => {
-            if (R(e)) {
-              const n = e.component(r.row, i);
-              return v.isValidElement(n) ? /* @__PURE__ */ t(v.Fragment, { children: n }, w) : null;
+          children: i.map((e, p) => {
+            if (S(e)) {
+              const o = e.component(l.row, r);
+              return g.isValidElement(o) ? /* @__PURE__ */ t(g.Fragment, { children: o }, p) : null;
             }
-            return e.hide ? null : /* @__PURE__ */ t(b, {
+            return e.hide ? null : e.disabled && e.tooltipTitle ? /* @__PURE__ */ t(h, {
+              className: e.className,
+              disabled: !0,
+              disabledReason: e.tooltipTitle,
+              reasonPlacement: e.tooltipPlacement ?? "left",
+              onMouseDown: (o) => {
+                o.stopPropagation(), o.preventDefault();
+              },
+              onMouseUp: (o) => {
+                o.stopPropagation(), o.preventDefault();
+              },
+              children: e.label
+            }, p) : /* @__PURE__ */ t(f, {
               title: e?.tooltipTitle,
               arrow: !0,
               placement: e?.tooltipPlacement ?? "left",
-              children: /* @__PURE__ */ t("span", { children: /* @__PURE__ */ t(I, {
+              children: /* @__PURE__ */ t("span", { children: /* @__PURE__ */ t(h, {
                 className: e.className,
                 disabled: e.disabled,
                 onClick: () => {
-                  e.disabled || e.onClick?.(r.row);
+                  e.disabled || e.onClick?.(l.row);
                 },
-                onMouseDown: (n) => {
-                  n.stopPropagation(), n.preventDefault();
+                onMouseDown: (o) => {
+                  o.stopPropagation(), o.preventDefault();
                 },
-                onMouseUp: (n) => {
-                  n.stopPropagation(), n.preventDefault();
+                onMouseUp: (o) => {
+                  o.stopPropagation(), o.preventDefault();
                 },
                 children: e.label
               }) })
-            }, w);
+            }, p);
           })
         })
       })]
@@ -125,5 +119,5 @@ function _({ tableData: r, actions: y, rowActionsState: T }) {
   });
 }
 export {
-  _ as RowActionMenu
+  q as RowActionMenu
 };

package/dist/table/shared-components/StyledMenuItem.js

@@ -1,18 +1,30 @@
-import { cn as u } from "../../helpers/cn.js";
-import { jsx as x } from "react/jsx-runtime";
-var c = ({ children: o, disabled: e, selected: n, className: a, classes: i, onClick: t, onMouseDown: l, onMouseUp: m }) => /* @__PURE__ */ x("li", {
-  role: "menuitem",
-  "aria-disabled": e ? !0 : void 0,
-  tabIndex: -1,
-  onClick: e ? void 0 : t,
-  onKeyDown: (r) => {
-    e || (r.key === "Enter" || r.key === " ") && (r.preventDefault(), t?.(r));
-  },
-  onMouseDown: l,
-  onMouseUp: m,
-  className: u("box-border flex min-h-10 items-center px-3 py-2 text-base text-delta-700 outline-none", e ? "cursor-not-allowed" : "cursor-pointer hover:bg-delta-50", n && "bg-gama-50", i?.root, a, e && "aria-disabled:text-delta-300"),
-  children: o
-});
+import { cn as y } from "../../helpers/cn.js";
+import { StyledTooltip as d } from "../../components/data-display/tooltip/StyledTooltip.js";
+import { jsx as i } from "react/jsx-runtime";
+var D = ({ children: l, disabled: e, disabledReason: o, reasonPlacement: p = "left", selected: m, className: u, classes: s, onClick: r, onMouseDown: c, onMouseUp: f }) => {
+  const x = (t) => {
+    e || (t.key === "Enter" || t.key === " ") && (t.preventDefault(), r?.(t));
+  }, n = !!e && !!o, a = /* @__PURE__ */ i("li", {
+    role: "menuitem",
+    "aria-disabled": e ? !0 : void 0,
+    "data-has-reason": n || void 0,
+    tabIndex: -1,
+    onClick: e ? (t) => t.stopPropagation() : r,
+    onKeyDown: x,
+    onMouseDown: c,
+    onMouseUp: f,
+    className: y("box-border flex min-h-10 items-center px-3 py-2 text-base text-delta-700 outline-none", e ? "cursor-not-allowed" : "cursor-pointer hover:bg-delta-50", m && "bg-gama-50", s?.root, u, e && "aria-disabled:text-delta-300"),
+    children: l
+  });
+  return n ? /* @__PURE__ */ i(d, {
+    title: o,
+    arrow: !0,
+    placement: p,
+    openOnTap: !0,
+    persistentDescription: !0,
+    children: a
+  }) : a;
+};
 export {
-  c as StyledMenuItem
+  D as StyledMenuItem
 };

package/package.json

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