asma-ui-core 3.98.0 → 3.98.2

package/dist/components/custom/widget/widget-title/StyledWidgetTitle.js

@@ -1,14 +1,14 @@
 import { cn as i } from "../../../../helpers/cn.js";
-import r from "./StyledWidgetTitle.module.js";
-import { forwardRef as d } from "react";
-import { jsx as l } from "react/jsx-runtime";
-var n = d(function(e, t) {
-  return /* @__PURE__ */ l("div", {
+import l from "./StyledWidgetTitle.module.js";
+import { forwardRef as r } from "react";
+import { jsx as d } from "react/jsx-runtime";
+var c = r(function(e, t) {
+  return /* @__PURE__ */ d(e.component ?? "h2", {
     ref: t,
-    className: i(r["styled-widget-title"], e.className),
+    className: i(l["styled-widget-title"], e.className),
     children: e.children
   });
 });
 export {
-  n as StyledWidgetTitle
+  c as StyledWidgetTitle
 };

package/dist/components/custom/widget/widget-title/StyledWidgetTitle.module.js

@@ -1,4 +1,4 @@
-var t = { "styled-widget-title": "_styled-widget-title_1o7tp_1" };
+var t = { "styled-widget-title": "_styled-widget-title_gfsr3_1" };
 export {
   t as default
 };

package/dist/components/inputs/phone-field/StyledPhoneField.js

@@ -3,66 +3,67 @@ import { StyledInputField as M } from "../input-field/StyledInputField.js";
 import { StyledLink as V } from "../../navigation/link/StyledLink.js";
 import { CountryCodeSelect as W } from "./CountryCodeSelect.js";
 import { useId as z } from "react";
-import { jsx as t, jsxs as r } from "react/jsx-runtime";
-var E = (e) => e.replace(/\D/g, ""), U = ({ dataTest: e, label: l, countries: h, country: n, onCountryChange: x, value: s, onChange: f, onBlur: N, error: v, helperText: y, reserveHelperText: g = !0, disabled: d, readOnly: $, readOnlyText: i, readOnlyHref: m, required: c, placeholder: b, formatNationalNumber: I, renderFlag: C, selectCountryLabel: S, searchPlaceholder: F, id: j, name: P, size: k = "medium", fieldClassName: p, helperTextClassName: w, className: A }) => {
-  const B = z(), a = j ?? `${B}-phone`, u = `${a}-label`, o = I?.(s, n) ?? s;
-  return /* @__PURE__ */ r("div", {
+import { jsx as t, jsxs as d } from "react/jsx-runtime";
+var E = (e) => e.replace(/\D/g, ""), U = ({ dataTest: e, label: l, countries: h, country: n, onCountryChange: x, value: s, onChange: f, onBlur: v, error: y, helperText: N, reserveHelperText: b = !0, disabled: i, readOnly: g, readOnlyText: m, readOnlyHref: c, required: p, placeholder: $, formatNationalNumber: I, renderFlag: C, selectCountryLabel: S, searchPlaceholder: F, id: j, name: P, size: k = "medium", fieldClassName: u, helperTextClassName: w, className: A }) => {
+  const B = z(), a = j ?? `${B}-phone`, o = `${a}-label`, r = I?.(s, n) ?? s;
+  return /* @__PURE__ */ d("div", {
     className: L("flex flex-col", A),
     "data-testid": `${e}-root`,
-    children: [l != null && /* @__PURE__ */ r("label", {
-      id: u,
+    children: [l != null && /* @__PURE__ */ d("label", {
+      id: o,
       htmlFor: a,
       className: "pb-1 text-base font-semibold text-delta-800",
-      children: [l, c === !0 && /* @__PURE__ */ t("span", {
+      children: [l, p === !0 && /* @__PURE__ */ t("span", {
         "aria-hidden": "true",
         children: " *"
       })]
-    }), $ === !0 ? /* @__PURE__ */ t("span", {
+    }), g === !0 ? /* @__PURE__ */ t("span", {
       className: "py-2 text-base text-delta-800",
-      children: m === void 0 ? /* @__PURE__ */ t("span", {
+      children: c === void 0 ? /* @__PURE__ */ t("span", {
         "data-testid": `${e}-readonly`,
-        children: i ?? o
+        children: m ?? r
       }) : /* @__PURE__ */ t(V, {
         dataTest: `${e}-readonly`,
-        href: m,
+        href: c,
         className: "-ml-1",
-        contentNode: i ?? o
+        contentNode: m ?? r
       })
-    }) : /* @__PURE__ */ r("div", {
+    }) : /* @__PURE__ */ d("div", {
       className: "flex items-start gap-2.5",
       children: [/* @__PURE__ */ t(W, {
         dataTest: `${e}-country`,
         countries: h,
         value: n,
         onChange: x,
-        disabled: d,
+        disabled: i,
         selectCountryLabel: S,
         searchPlaceholder: F,
         renderFlag: C,
-        labelledBy: l == null ? void 0 : u,
-        className: p
+        labelledBy: l == null ? void 0 : o,
+        className: u
       }), /* @__PURE__ */ t(M, {
         dataTest: `${e}-number`,
         className: "max-w-[200px]",
         id: a,
         name: P,
-        value: o,
+        value: r,
         onChange: (D) => f(E(D.target.value)),
-        onBlur: N,
-        placeholder: b,
-        error: v,
-        disabled: d,
-        required: c,
+        onBlur: v,
+        placeholder: $,
+        error: y,
+        disabled: i,
+        required: p,
         fullWidth: !0,
-        helperText: y,
-        reserveHelperText: g,
+        helperText: N,
+        reserveHelperText: b,
         size: k,
         slotProps: {
           htmlInput: {
             inputMode: "tel",
-            autoComplete: "tel"
+            autoComplete: "tel",
+            "aria-labelledby": l == null ? void 0 : o
           },
-          input: { className: p },
+          input: { className: u },
           formHelperText: { className: w }
         }
       })]

package/dist/components/utils/popover/PopoverSheet.js

@@ -1,6 +1,6 @@
 import { cn as re } from "../../../helpers/cn.js";
 import { firstTabbable as ne } from "../../../helpers/focusable.js";
-import { TOP_LAYER_PROPS as ie, TOP_LAYER_RESET_STYLE as se, getOpenModalDialogAncestor as ae, shouldUsePopoverTopLayer as ce, useTopLayerRef as le } from "../../../hooks/useTopLayer.hook.js";
+import { TOP_LAYER_PROPS as ie, TOP_LAYER_RESET_STYLE as se, getOpenModalDialogAncestor as ae, shouldUsePopoverTopLayer as le, useTopLayerRef as ce } from "../../../hooks/useTopLayer.hook.js";
 import { StyledButton as ue } from "../../inputs/button/StyledButton.js";
 import { useMobileMediaQuery as de } from "../../../hooks/useMediaQuery.hook.js";
 import { useDebouncedValue as fe } from "../../../hooks/useDebouncedValue.hook.js";
@@ -8,47 +8,47 @@ import { useFocusTrap as pe } from "../../../hooks/useFocusTrap.hook.js";
 import { formatResultsLabel as me } from "../bottom-sheet/formatResultsLabel.js";
 import { StyledBottomSheet as ge } from "../bottom-sheet/StyledBottomSheet.js";
 import { PopoverAnatomy as ve } from "./PopoverAnatomy.js";
-import { useCallback as m, useEffect as b, useId as he, useRef as y, useState as g } from "react";
-import { Fragment as N, jsx as c, jsxs as W } from "react/jsx-runtime";
-import { FloatingPortal as xe, autoUpdate as _e, flip as Pe, offset as be, shift as ye, size as Re, useDismiss as Ee, useFloating as Se, useInteractions as Te, useMergeRefs as Ae } from "@floating-ui/react";
-var Me = 240, we = {
+import { useCallback as v, useEffect as y, useId as he, useRef as T, useState as h } from "react";
+import { Fragment as N, jsx as l, jsxs as W } from "react/jsx-runtime";
+import { FloatingPortal as xe, autoUpdate as _e, flip as Pe, offset as be, shift as Re, size as ye, useDismiss as Te, useFloating as Ee, useInteractions as Me, useMergeRefs as Se } from "@floating-ui/react";
+var we = 240, Ae = {
   info: 472,
   action: 472
-}, Fe = 0.6, B = "calc(100vw - 32px)", qe = ({ dataTest: s, renderTrigger: R, variant: E = "info", title: l, children: S, viewResultsAction: T, resetAction: A, footerActions: M, resultCount: v, closeLabel: w = "Lukk", ariaLabel: F, onOpenChange: I, className: O }) => {
-  const a = he(), L = `${a}-title`, [o, X] = g(!1), [H, U] = g(), [Y, $] = g(), u = de(), t = E === "action", j = u && !t, k = u && t, d = m((e) => {
+}, Fe = 0.6, B = "calc(100vw - 32px)", Ie = (n, c, u) => _e(n, c, u, { elementResize: !1 }), qe = ({ dataTest: n, renderTrigger: c, variant: u = "info", title: d, children: E, viewResultsAction: M, resetAction: S, footerActions: w, resultCount: x, closeLabel: A = "Lukk", ariaLabel: F, onOpenChange: I, className: O }) => {
+  const a = he(), L = `${a}-title`, [o, X] = h(!1), [H, z] = h(), [U, Y] = h(), f = de(), t = u === "action", $ = f && !t, k = f && t, p = v((e) => {
     X(e), I?.(e);
-  }, [I]), { refs: h, floatingStyles: q, context: z } = Se({
+  }, [I]), { refs: _, floatingStyles: j, context: q } = Ee({
     open: o,
-    onOpenChange: d,
+    onOpenChange: p,
     placement: "bottom-start",
     strategy: "fixed",
-    whileElementsMounted: _e,
+    whileElementsMounted: Ie,
     middleware: [
       be(8),
-      ...j ? [] : [Pe({ padding: 8 })],
-      ye({ padding: 8 }),
-      Re({
+      ...$ ? [] : [Pe({ padding: 8 })],
+      Re({ padding: 8 }),
+      ye({
         padding: 8,
         apply({ availableHeight: e }) {
-          $(Math.min(e, Math.round(window.innerHeight * Fe)));
+          Y(Math.min(e, Math.round(window.innerHeight * Fe)));
         }
       })
     ]
-  }), { getFloatingProps: V } = Te([Ee(z, {
+  }), { getFloatingProps: V } = Me([Te(q, {
     enabled: !k,
     escapeKey: !0,
     outsidePress: (e) => {
-      const i = f.current;
-      return !(i && e.target instanceof Node && i.contains(e.target));
+      const s = m.current;
+      return !(s && e.target instanceof Node && s.contains(e.target));
     }
-  })]), x = ce(H), C = y(null), [r, G] = g(null), K = m((e) => {
+  })]), P = le(H), C = T(null), [r, G] = h(null), K = v((e) => {
     C.current = e, G(e);
-  }, []), Q = Ae([le(h.setFloating, x), K]), f = y(null), J = m((e) => {
-    f.current = e, h.setReference(e);
-  }, [h]), n = m(() => {
-    d(!1);
-  }, [d]);
-  pe(o && t && r !== null, C), b(() => {
+  }, []), Q = Se([ce(_.setFloating, P), K]), m = T(null), J = v((e) => {
+    m.current = e, _.setReference(e);
+  }, [_]), i = v(() => {
+    p(!1);
+  }, [p]);
+  pe(o && t && r !== null, C), y(() => {
     if (!r) return;
     const e = requestAnimationFrame(() => {
       (t ? ne(r) : r)?.focus({ preventScroll: !0 });
@@ -56,11 +56,11 @@ var Me = 240, we = {
     return () => {
       cancelAnimationFrame(e);
     };
-  }, [r, t]), b(() => {
+  }, [r, t]), y(() => {
     if (!r || t) return;
-    const e = (i) => {
-      const P = i.relatedTarget;
-      P instanceof Node && (r.contains(P) || f.current?.contains(P)) || n();
+    const e = (s) => {
+      const R = s.relatedTarget;
+      R instanceof Node && (r.contains(R) || m.current?.contains(R)) || i();
     };
     return r.addEventListener("focusout", e), () => {
       r.removeEventListener("focusout", e);
@@ -68,23 +68,23 @@ var Me = 240, we = {
   }, [
     r,
     t,
-    n
+    i
   ]);
-  const _ = y(!1);
-  b(() => {
+  const b = T(!1);
+  y(() => {
     if (o) {
-      _.current = !0;
+      b.current = !0;
       return;
     }
-    if (!_.current) return;
-    _.current = !1;
-    const e = f.current;
+    if (!b.current) return;
+    b.current = !1;
+    const e = m.current;
     if (!e) return;
-    const i = requestAnimationFrame(() => {
+    const s = requestAnimationFrame(() => {
       document.activeElement === document.body && e.focus();
     });
     return () => {
-      cancelAnimationFrame(i);
+      cancelAnimationFrame(s);
     };
   }, [o]);
   const D = {
@@ -93,69 +93,69 @@ var Me = 240, we = {
     triggerProps: {
       onClick: (e) => {
         if (o) {
-          n();
+          i();
           return;
         }
-        U(ae(e.currentTarget)), d(!0);
+        z(ae(e.currentTarget)), p(!0);
       },
       "aria-expanded": o,
       "aria-controls": o ? a : void 0,
       "aria-haspopup": t ? "dialog" : void 0,
       "aria-describedby": !t && o ? a : void 0
     }
-  }, p = (e) => typeof e == "function" ? e({ close: n }) : e, Z = fe(v, 500), ee = T ?? (v === void 0 ? void 0 : /* @__PURE__ */ c(ue, {
-    dataTest: `${s}-view-results`,
+  }, g = (e) => typeof e == "function" ? e({ close: i }) : e, Z = fe(x, 500), ee = M ?? (x === void 0 ? void 0 : /* @__PURE__ */ l(ue, {
+    dataTest: `${n}-view-results`,
     type: "button",
     variant: "text",
-    onClick: n,
+    onClick: i,
     children: me(Z)
-  })), te = u ? B : we[E], oe = u ? B : void 0;
-  return k ? /* @__PURE__ */ W(N, { children: [R(D), /* @__PURE__ */ c(ge, {
+  })), te = f ? B : Ae[u], oe = f ? B : void 0;
+  return k ? /* @__PURE__ */ W(N, { children: [c(D), /* @__PURE__ */ l(ge, {
     id: a,
-    dataTest: s,
+    dataTest: n,
     open: o,
-    onClose: n,
-    title: l,
+    onClose: i,
+    title: d,
     ariaLabel: F,
-    viewResultsAction: T,
-    resetAction: A,
-    footerActions: M,
-    resultCount: v,
-    closeLabel: w,
+    viewResultsAction: M,
+    resetAction: S,
+    footerActions: w,
+    resultCount: x,
+    closeLabel: A,
     className: O,
-    children: S
-  })] }) : /* @__PURE__ */ W(N, { children: [R(D), o && /* @__PURE__ */ c(xe, {
+    children: E
+  })] }) : /* @__PURE__ */ W(N, { children: [c(D), o && /* @__PURE__ */ l(xe, {
     root: H,
-    children: /* @__PURE__ */ c("div", {
+    children: /* @__PURE__ */ l("div", {
       ...V(),
       ref: Q,
       id: a,
-      "data-test": s,
-      "data-testid": s,
+      "data-test": n,
+      "data-testid": n,
       role: t ? "dialog" : void 0,
-      "aria-labelledby": t && l ? L : void 0,
-      "aria-label": t && !l ? F : void 0,
+      "aria-labelledby": t && d ? L : void 0,
+      "aria-label": t && !d ? F : void 0,
       tabIndex: t ? void 0 : -1,
-      ...x ? ie : {},
+      ...P ? ie : {},
       style: {
-        ...x ? se : {},
-        ...q,
-        minWidth: Me,
+        ...P ? se : {},
+        ...j,
+        minWidth: we,
         width: oe,
         maxWidth: te,
-        maxHeight: Y
+        maxHeight: U
       },
       className: re("z-[1300]", "box-border flex flex-col overflow-hidden rounded-lg bg-white text-delta-700 outline-none shadow-[inset_0_0_0_1px_var(--colors-delta-300),0px_4px_40px_0px_#22213366]", O),
-      children: /* @__PURE__ */ c(ve, {
-        dataTest: s,
-        title: l,
+      children: /* @__PURE__ */ l(ve, {
+        dataTest: n,
+        title: d,
         titleId: L,
-        viewResultsAction: p(ee),
-        resetAction: p(A),
-        footerActions: p(M),
-        closeLabel: w,
-        onClose: n,
-        children: p(S)
+        viewResultsAction: g(ee),
+        resetAction: g(S),
+        footerActions: g(w),
+        closeLabel: A,
+        onClose: i,
+        children: g(E)
       })
     })
   })] });

package/dist/src/components/custom/widget/widget-title/StyledWidgetTitle.d.ts

@@ -4,6 +4,7 @@
  */
 export declare const StyledWidgetTitle: import('react').ForwardRefExoticComponent<{
     className?: string;
+    component?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
 } & {
     children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
+} & import('react').RefAttributes<HTMLHeadingElement>>;

package/dist/table/components/table-footer/TablePagination.js

@@ -1,17 +1,17 @@
-import { ChevronRightIcon as N } from "../../../components/icons/chevron-right-icon/ChevronRightIcon.js";
+import { ChevronRightIcon as $ } from "../../../components/icons/chevron-right-icon/ChevronRightIcon.js";
 import { ChevronLeftIcon as O } from "../../../components/icons/chevron-left-icon/ChevronLeftIcon.js";
 import { StyledPopover as k } from "../../../components/utils/popover/StyledPopover.js";
 import { StyledMenuList as z } from "../../../components/navigation/menu/StyledMenuList.js";
 import { StyledSelectItem as D } from "../../../components/inputs/select/StyledSelectItem.js";
-import m from "../StyledTable.module.js";
-import { StyledTooltip as p } from "../../shared-components/tooltip/index.js";
-import { ChevronDownIcon as L } from "../../shared-components/ChevronDownIcon.js";
-import { useKeyboardSelectMenu as R } from "../../hooks/useToggleMenuVisibility.hook.js";
+import h from "../StyledTable.module.js";
+import { StyledTooltip as m } from "../../shared-components/tooltip/index.js";
+import { ChevronDownIcon as F } from "../../shared-components/ChevronDownIcon.js";
+import { useKeyboardSelectMenu as L } from "../../hooks/useToggleMenuVisibility.hook.js";
 import { StyledButton as u } from "../../shared-components/button/StyledButton.js";
-import { useCallback as I, useId as F, useMemo as S, useRef as K } from "react";
+import { useCallback as I, useId as R, useMemo as S, useRef as K } from "react";
 import { Fragment as M, jsx as e, jsxs as f } from "react/jsx-runtime";
 function U({ table: o, locale: y }) {
-  const v = K(null), r = y === "no", a = F(), b = S(() => ({
+  const v = K(null), r = y === "no", a = R(), b = S(() => ({
     anchorOrigin: {
       vertical: -5,
       horizontal: "center"
@@ -21,20 +21,20 @@ function U({ table: o, locale: y }) {
       horizontal: "center"
     }
   }), []), l = I(() => {
-    const t = m["asma-ui-table-styled-table"], n = v.current?.closest(`.${t}`)?.querySelector(`.${m["table-scroll"]}, .${m["table-wrapper"]}`);
+    const t = h["asma-ui-table-styled-table"], n = v.current?.closest(`.${t}`)?.querySelector(`.${h["table-scroll"]}, .${h["table-wrapper"]}`);
     n && n.scrollTo({
       top: 0,
       behavior: "smooth"
     });
   }, []), s = o.getPageCount() || 1, i = o.getState().pagination.pageIndex + 1, c = S(() => Array.from({ length: s }, (t, n) => n + 1), [s]), P = I((t) => {
     o.setPageIndex(t - 1), l();
-  }, [o, l]), { anchorEl: g, open: d, handleClose: x, handleOpen: T, triggerRef: w, activeIndex: h, handleKeyDown: $ } = R({
+  }, [o, l]), { anchorEl: g, open: d, handleClose: x, handleOpen: N, triggerRef: T, activeIndex: p, handleKeyDown: w } = L({
     optionCount: c.length,
     selectedIndex: i - 1,
     onSelect: (t) => P(c[t])
   });
   return /* @__PURE__ */ f(M, { children: [
-    /* @__PURE__ */ e(p, {
+    /* @__PURE__ */ e(m, {
       title: r ? "Nåværende side" : "Current Page",
       children: /* @__PURE__ */ e("div", {
         ref: v,
@@ -42,15 +42,15 @@ function U({ table: o, locale: y }) {
           dataTest: "current-page-button",
           variant: "outlined",
           size: "large",
-          refLink: w,
-          onClick: T,
-          onKeyDown: $,
+          refLink: T,
+          onClick: N,
+          onKeyDown: w,
           role: "combobox",
           "aria-haspopup": "listbox",
           "aria-controls": d ? a : void 0,
           "aria-expanded": d,
-          "aria-activedescendant": h === null ? void 0 : `${a}-option-${h}`,
-          endIcon: /* @__PURE__ */ e(L, {
+          "aria-activedescendant": p === null ? void 0 : `${a}-option-${p}`,
+          endIcon: /* @__PURE__ */ e(F, {
             className: `${d ? "flip-180" : "rotate-0"} transition-transform duration-300`,
             height: 24,
             width: 24
@@ -87,7 +87,7 @@ function U({ table: o, locale: y }) {
         role: "listbox",
         children: c.map((t, n) => /* @__PURE__ */ e(D, {
           id: `${a}-option-${n}`,
-          active: n === h,
+          active: n === p,
           onClick: (C) => {
             C.stopPropagation(), C.preventDefault(), P(t), x();
           },
@@ -103,7 +103,7 @@ function U({ table: o, locale: y }) {
         }, t))
       })
     }),
-    /* @__PURE__ */ e(p, {
+    /* @__PURE__ */ e(m, {
       title: i === 1 ? "" : r ? "Forrige side" : "Previous Page",
       children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(u, {
         dataTest: "prev-page-button",
@@ -113,13 +113,14 @@ function U({ table: o, locale: y }) {
         },
         size: "large",
         disabled: !o.getCanPreviousPage(),
+        "aria-label": r ? "Forrige side" : "Previous page",
         startIcon: /* @__PURE__ */ e(O, {
           height: 24,
           width: 24
         })
       }) })
     }),
-    /* @__PURE__ */ e(p, {
+    /* @__PURE__ */ e(m, {
       title: i === s ? "" : r ? "Neste side" : "Next Page",
       children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(u, {
         dataTest: "next-page-button",
@@ -129,7 +130,8 @@ function U({ table: o, locale: y }) {
         },
         size: "large",
         disabled: !o.getCanNextPage(),
-        startIcon: /* @__PURE__ */ e(N, {
+        "aria-label": r ? "Neste side" : "Next page",
+        startIcon: /* @__PURE__ */ e($, {
           height: 24,
           width: 24
         })

package/package.json

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