asma-ui-core 3.88.0 → 3.89.0

package/dist/src/components/utils/popover/story/popoverStoryFixtures.d.ts

@@ -0,0 +1,21 @@
+/** Sample data lifted from the Figma "Popover" frames so the stories read like the design. */
+export declare const KARTLEGGING: string[];
+export declare const EGENRAPPORTERING: string[];
+export interface FilterState {
+    kartlegging: string[];
+    egenrapportering: string | undefined;
+}
+export declare const EMPTY_FILTER: FilterState;
+export declare const noop: () => void;
+/** How many results the mock list reports for a given number of active criteria. */
+export declare const matchCountFor: (activeCount: number) => number;
+export declare const countActive: (filter: FilterState) => number;
+export declare const toggleInList: (list: string[], option: string) => string[];
+/** The Figma "Chips select" group — a heading plus a wrapping row of checkbox/radio chips. */
+export declare const ChipGroup: ({ heading, options, isSelected, onToggle, type, }: {
+    heading: string;
+    options: string[];
+    isSelected: (option: string) => boolean;
+    onToggle: (option: string) => void;
+    type: "checkbox" | "radio";
+}) => JSX.Element;

package/dist/table/components/TableRow.js

@@ -1,37 +1,37 @@
 import { ACTIONS_COLUMN_ID as j } from "../types.js";
-import { useRootContext as ge } from "../context/RootContext.js";
+import { useRootContext as he } from "../context/RootContext.js";
 import n from "./StyledTable.module.js";
-import { compact as he } from "../../helpers/arrays.js";
+import { compact as pe } from "../../helpers/arrays.js";
 import q from "clsx";
-import { Fragment as pe, useCallback as K, useEffect as xe, useLayoutEffect as be, useMemo as m, useRef as Ce, useState as Re } from "react";
-import { Fragment as Se, jsx as s, jsxs as C } from "react/jsx-runtime";
-import { useSortable as De } from "@dnd-kit/sortable";
+import { Fragment as xe, useCallback as K, useEffect as be, useLayoutEffect as Ce, useMemo as m, useRef as Re, useState as Se } from "react";
+import { Fragment as De, jsx as s, jsxs as C } from "react/jsx-runtime";
+import { useSortable as ve } from "@dnd-kit/sortable";
 import { flexRender as ye } from "@tanstack/react-table";
 import { CSS as Ne } from "@dnd-kit/utilities";
-var ve = (R) => {
+var Fe = (R) => {
   const t = R.closest("table");
   if (!t) return !1;
   const r = Array.from(document.querySelectorAll('a[href], button:not(:disabled), input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex="-1"])')).find((g) => !t.contains(g) && !!(t.compareDocumentPosition(g) & Node.DOCUMENT_POSITION_FOLLOWING));
   return r ? (r.focus(), document.activeElement === r) : !1;
 };
-function Oe({ styledTableProps: R, row: t, index: r, hasFocusedRow: g, columnWindow: { paddingLeft: h, paddingRight: p, indexes: T } }) {
-  const { loading: G, getRowClassName: l, rowHeight: x, onRowClick: S, expandArrow: V, enableDnd: w, disableDndForRow: Y, tdClassName: A, customSubRowData: B, renderSubRows: J, defaultExpanded: Q, actions: D, customActionsNode: X, textExpandArrow: L, enableMultiRowSelection: Z, enableRowSelection: ee, singleSelectionRow: te } = R, y = Y?.(t), { transform: ne, transition: oe, setNodeRef: M, isDragging: H } = De({
+function Ue({ styledTableProps: R, row: t, index: r, hasFocusedRow: g, columnWindow: { paddingLeft: h, paddingRight: p, indexes: T } }) {
+  const { loading: G, getRowClassName: l, rowHeight: x, onRowClick: S, expandArrow: V, enableDnd: w, disableDndForRow: Y, tdClassName: A, customSubRowData: B, renderSubRows: J, defaultExpanded: Q, actions: D, customActionsNode: X, textExpandArrow: L, enableMultiRowSelection: Z, enableRowSelection: ee, singleSelectionRow: te } = R, v = Y?.(t), { transform: ne, transition: oe, setNodeRef: M, isDragging: H } = ve({
     id: t.original.id,
-    disabled: !w || y
+    disabled: !w || v
   }), ie = {
     transform: Ne.Transform.toString(ne),
     transition: oe,
     opacity: H ? 0.8 : 1,
     zIndex: H ? 1 : 0,
     position: "relative"
-  }, { isResizing: se, disableResizingFlag: le } = ge(), N = t.isExpanded(), b = Ce(null), [ae, ce] = Re(void 0);
-  be(() => {
-    !N && b.current && ce(b.current.cells[0]?.clientHeight ?? b.current.offsetHeight);
-  }, [N]);
+  }, { isResizing: se, disableResizingFlag: le } = he(), y = t.isExpanded(), b = Re(null), [ae, ce] = Se(void 0);
+  Ce(() => {
+    !y && b.current && ce(b.current.cells[0]?.clientHeight ?? b.current.offsetHeight);
+  }, [y]);
   const de = K((e) => {
-    b.current = e, y || M(e);
-  }, [y, M]), O = N ? ae ?? x : x;
-  xe(() => {
+    b.current = e, v || M(e);
+  }, [v, M]), O = y ? ae ?? x : x;
+  be(() => {
     Q && t.getCanExpand() && !t.getIsExpanded() && t.toggleExpand();
   }, []);
   const U = (e) => {
@@ -40,16 +40,39 @@ function Oe({ styledTableProps: R, row: t, index: r, hasFocusedRow: g, columnWin
     !i && L && o ? t.toggleExpand() : i && o && S(e, t), le();
   }, re = (e) => {
     e.target.classList.contains("MuiModal-backdrop") || e.target.nodeName === "INPUT" || e.target.nodeName === "BUTTON" || e.target.nodeName === "LI" || e.target.closest("li") || U(e);
+  }, ue = (e) => {
+    if (e.target === e.currentTarget)
+      switch (e.key) {
+        case "Tab":
+          if (e.shiftKey) {
+            if (t.focusPrevRow()) {
+              e.preventDefault();
+              break;
+            }
+            const o = e.currentTarget.closest("table")?.querySelector('thead tr[tabindex="0"]');
+            o && (e.preventDefault(), o.focus());
+          } else (t.focusNextRow() || Fe(e.currentTarget)) && e.preventDefault();
+          break;
+        case "ArrowDown":
+          t.focusNextRow() && e.preventDefault();
+          break;
+        case "ArrowUp":
+          t.focusPrevRow() && e.preventDefault();
+          break;
+        case "Enter":
+          e.preventDefault(), U(e);
+          break;
+      }
   }, u = t.getVisibleCells().map((e, o, i) => ({
     ...e,
     left: i.slice(0, o).reduce((c, d) => c + (d.column.getSize() ?? 0), 0)
   })), W = m(() => u.filter((e) => !e.column.columnDef.fixedLeft && !e.column.columnDef.fixedRight && e.column.id !== "actions"), [u]), a = m(() => u.filter((e) => !!e.column.columnDef.fixedRight || e.column.id === "actions").map((e, o, i) => ({
     ...e,
     right: i.slice(o + 1).reduce((c, d) => c + (d.column.getSize() ?? 0), 0)
-  })), [u]), _ = m(() => a.some((e) => e.column.id === j), [a]), z = !!D || !!X, P = m(() => a.some((e) => !!e.column.columnDef.fixedRight), [a]), f = m(() => u.filter((e) => e.column.columnDef.fixedLeft), [u]), v = !Z && !ee && te, F = t.getIsSelected() && v, k = S instanceof Function, $ = T.length > 0 ? he(T.map((e) => W[e])) : W, E = K((e, o) => {
-    const i = e.column.id === j, c = e.column.columnDef.fixedLeft, d = !!e.column.columnDef.fixedRight, ue = e.id === f.at(-1)?.id, fe = e.id === a.at(0)?.id && !i, me = t.isExpanded(), I = o === 0;
+  })), [u]), _ = m(() => a.some((e) => e.column.id === j), [a]), z = !!D || !!X, P = m(() => a.some((e) => !!e.column.columnDef.fixedRight), [a]), f = m(() => u.filter((e) => e.column.columnDef.fixedLeft), [u]), N = !Z && !ee && te, F = t.getIsSelected() && N, k = S instanceof Function, $ = T.length > 0 ? pe(T.map((e) => W[e])) : W, E = K((e, o) => {
+    const i = e.column.id === j, c = e.column.columnDef.fixedLeft, d = !!e.column.columnDef.fixedRight, fe = e.id === f.at(-1)?.id, me = e.id === a.at(0)?.id && !i, ge = t.isExpanded(), I = o === 0;
     return /* @__PURE__ */ s("td", {
-      className: q(n["t-cell"], k && "cursor-pointer", A, i && n["action-cell"], i && (!z || P) && n["action-cell--no-shadow"], i && !!D && f.length && n.shadowed, i && (l?.(t) ? l?.(t) : n["action-cell-default-background"]), c && n["fixed-cell"], d && n["fixed-right-cell"], ue && n.shadowed, fe && n["shadowed-right"], t.getIsSelected() && n.selected, c && (l?.(t) ? l?.(t) : n["fixed-cell-default-background"]), d && (l?.(t) ? l?.(t) : n["fixed-right-cell-default-background"]), me && n.expanded_row, !!F && n["single-selection"]),
+      className: q(n["t-cell"], k && "cursor-pointer", A, i && n["action-cell"], i && (!z || P) && n["action-cell--no-shadow"], i && !!D && f.length && n.shadowed, i && (l?.(t) ? l?.(t) : n["action-cell-default-background"]), c && n["fixed-cell"], d && n["fixed-right-cell"], fe && n.shadowed, me && n["shadowed-right"], t.getIsSelected() && n.selected, c && (l?.(t) ? l?.(t) : n["fixed-cell-default-background"]), d && (l?.(t) ? l?.(t) : n["fixed-right-cell-default-background"]), ge && n.expanded_row, !!F && n["single-selection"]),
       style: {
         left: c ? e.left : void 0,
         right: d ? e.right + (_ ? -1 : 0) : void 0
@@ -71,10 +94,10 @@ function Oe({ styledTableProps: R, row: t, index: r, hasFocusedRow: g, columnWin
             top: "50%",
             transform: "translateY(-50%)"
           },
-          children: /* @__PURE__ */ s(Fe, {})
+          children: /* @__PURE__ */ s(ke, {})
         }), /* @__PURE__ */ s("span", {
           style: {
-            marginLeft: I && v ? 30 : 0,
+            marginLeft: I && N ? 30 : 0,
             width: "100%"
           },
           children: ye(e.column.columnDef.cell, e.getContext())
@@ -93,10 +116,10 @@ function Oe({ styledTableProps: R, row: t, index: r, hasFocusedRow: g, columnWin
     a,
     t,
     z,
-    v,
+    N,
     A
   ]);
-  return /* @__PURE__ */ C(pe, { children: [/* @__PURE__ */ C("tr", {
+  return /* @__PURE__ */ C(xe, { children: [/* @__PURE__ */ C("tr", {
     "aria-selected": t.getIsSelected() || t.isFocused() ? "true" : "false",
     tabIndex: t.isFocused() || r === 0 && !g ? 0 : -1,
     "data-index": r,
@@ -115,29 +138,7 @@ function Oe({ styledTableProps: R, row: t, index: r, hasFocusedRow: g, columnWin
     onMouseDown: (e) => {
       e.detail > 1 && !k && L && e.preventDefault();
     },
-    onKeyDown: (e) => {
-      switch (e.key) {
-        case "Tab":
-          if (e.shiftKey) {
-            if (t.focusPrevRow()) {
-              e.preventDefault();
-              break;
-            }
-            const o = e.currentTarget.closest("table")?.querySelector('thead tr[tabindex="0"]');
-            o && (e.preventDefault(), o.focus());
-          } else (t.focusNextRow() || ve(e.currentTarget)) && e.preventDefault();
-          break;
-        case "ArrowDown":
-          t.focusNextRow() && e.preventDefault();
-          break;
-        case "ArrowUp":
-          t.focusPrevRow() && e.preventDefault();
-          break;
-        case "Enter":
-          U(e);
-          break;
-      }
-    },
+    onKeyDownCapture: ue,
     children: [
       f.map((e, o) => E(e, o)),
       h > 0 && /* @__PURE__ */ s("td", {
@@ -165,12 +166,12 @@ function Oe({ styledTableProps: R, row: t, index: r, hasFocusedRow: g, columnWin
       }),
       a.map((e, o) => E(e, f.length + $.length + o))
     ]
-  }), t.getIsExpanded() && /* @__PURE__ */ s(Se, { children: B && J?.({
+  }), t.getIsExpanded() && /* @__PURE__ */ s(De, { children: B && J?.({
     rows: B.get(t.original.id.toString()) ?? [],
     row: t.original
   }) })] }, t.id);
 }
-var Fe = () => /* @__PURE__ */ C("svg", {
+var ke = () => /* @__PURE__ */ C("svg", {
   xmlns: "http://www.w3.org/2000/svg",
   width: "20",
   height: "20",
@@ -182,5 +183,5 @@ var Fe = () => /* @__PURE__ */ C("svg", {
   })]
 });
 export {
-  Oe as TableRow
+  Ue as TableRow
 };

package/package.json

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