@mattilsynet/design 2.2.21 → 2.2.22

package/mtds/styles.json

@@ -1,45 +1,45 @@
 {
-  "alert": "_alert_1cl7y_1 _ds-alert_dbymd_3",
+  "alert": "_alert_1cl7y_1 _ds-alert_5rpuv_3",
   "app": "_app_1cl7y_1",
   "sticky": "_sticky_1cl7y_1",
-  "avatar": "_avatar_1cl7y_1 _ds-avatar_dbymd_1",
+  "avatar": "_avatar_1cl7y_1 _ds-avatar_5rpuv_1",
   "badge": "_badge_1cl7y_1",
-  "breadcrumbs": "_breadcrumbs_1cl7y_1 _ds-breadcrumbs_dbymd_5",
-  "button": "_button_1cl7y_1 _ds-button_dbymd_1",
+  "breadcrumbs": "_breadcrumbs_1cl7y_1 _ds-breadcrumbs_5rpuv_5",
+  "button": "_button_1cl7y_1 _ds-button_5rpuv_1",
   "card": "_card_1cl7y_1",
   "group": "_group_1cl7y_1",
-  "chip": "_chip_1cl7y_1 _ds-chip_dbymd_5",
-  "details": "_details_1cl7y_1 _ds-details_dbymd_3",
-  "dialog": "_dialog_1cl7y_1 _ds-dialog_dbymd_5",
+  "chip": "_chip_1cl7y_1 _ds-chip_5rpuv_5",
+  "details": "_details_1cl7y_1 _ds-details_5rpuv_3",
+  "dialog": "_dialog_1cl7y_1 _ds-dialog_5rpuv_5",
   "divider": "_divider_1cl7y_1",
-  "errorsummary": "_errorsummary_1cl7y_1 _ds-error-summary_dbymd_5",
-  "field": "_field_1cl7y_1 _ds-field_dbymd_1",
-  "affixes": "_affixes_1cl7y_1 _ds-field-affixes_dbymd_3",
-  "fieldset": "_fieldset_1cl7y_1 _ds-fieldset_dbymd_3",
+  "errorsummary": "_errorsummary_1cl7y_1 _ds-error-summary_5rpuv_5",
+  "field": "_field_1cl7y_1 _ds-field_5rpuv_1",
+  "affixes": "_affixes_1cl7y_1 _ds-field-affixes_5rpuv_3",
+  "fieldset": "_fieldset_1cl7y_1 _ds-fieldset_5rpuv_3",
   "fileupload": "_fileupload_1cl7y_1",
-  "helptext": "_helptext_1cl7y_1 _ds-focus_dbymd_1",
-  "input": "_input_1cl7y_1 _ds-input_dbymd_1",
+  "helptext": "_helptext_1cl7y_1 _ds-focus_5rpuv_1",
+  "input": "_input_1cl7y_1 _ds-input_5rpuv_1",
   "law": "_law_1cl7y_1",
   "grid": "_grid_1cl7y_1",
   "flex": "_flex_1cl7y_1",
   "link": "_link_1cl7y_1",
   "logo": "_logo_1cl7y_1",
-  "pagination": "_pagination_1cl7y_1 _ds-pagination_dbymd_5",
+  "pagination": "_pagination_1cl7y_1 _ds-pagination_5rpuv_5",
   "popover": "_popover_1cl7y_1",
   "progress": "_progress_1cl7y_1",
-  "skeleton": "_skeleton_1cl7y_1 _ds-skeleton_dbymd_5",
+  "skeleton": "_skeleton_1cl7y_1 _ds-skeleton_5rpuv_5",
   "spinner": "_spinner_1cl7y_1",
   "steps": "_steps_1cl7y_1",
-  "table": "_table_1cl7y_1 _ds-table_dbymd_5",
-  "tabs": "_tabs_1cl7y_1 _ds-tabs_dbymd_5",
-  "tag": "_tag_1cl7y_1 _ds-tag_dbymd_5",
+  "table": "_table_1cl7y_1 _ds-table_5rpuv_5",
+  "tabs": "_tabs_1cl7y_1 _ds-tabs_5rpuv_5",
+  "tag": "_tag_1cl7y_1 _ds-tag_5rpuv_5",
   "toast": "_toast_1cl7y_1",
   "togglegroup": "_togglegroup_1cl7y_1",
-  "heading": "_heading_1cl7y_1 _ds-heading_dbymd_1",
+  "heading": "_heading_1cl7y_1 _ds-heading_5rpuv_1",
   "ingress": "_ingress_1cl7y_1",
   "muted": "_muted_1cl7y_1",
   "info": "_info_1cl7y_1",
   "prose": "_prose_1cl7y_1",
-  "validation": "_validation_1cl7y_1 _ds-validation-message_dbymd_1",
+  "validation": "_validation_1cl7y_1 _ds-validation-message_5rpuv_1",
   "body": "_body_1cl7y_173"
 }

package/mtds/styles.module.css.js

@@ -1,4 +1,4 @@
-const _ = "_alert_1cl7y_1 _ds-alert_dbymd_3", t = "_app_1cl7y_1", s = "_sticky_1cl7y_1", o = "_avatar_1cl7y_1 _ds-avatar_dbymd_1", c = "_badge_1cl7y_1", l = "_breadcrumbs_1cl7y_1 _ds-breadcrumbs_dbymd_5", e = "_button_1cl7y_1 _ds-button_dbymd_1", d = "_card_1cl7y_1", a = "_group_1cl7y_1", n = "_chip_1cl7y_1 _ds-chip_dbymd_5", r = "_details_1cl7y_1 _ds-details_dbymd_3", i = "_dialog_1cl7y_1 _ds-dialog_dbymd_5", y = "__drawer_1cl7y_1", p = "_divider_1cl7y_1", m = "_errorsummary_1cl7y_1 _ds-error-summary_dbymd_5", b = "__errorsummary_1cl7y_1", g = "_field_1cl7y_1 _ds-field_dbymd_1", u = "__datalist_1cl7y_1", f = "_affixes_1cl7y_1 _ds-field-affixes_dbymd_3", k = "_fieldset_1cl7y_1 _ds-fieldset_dbymd_3", h = "_fileupload_1cl7y_1", v = "_helptext_1cl7y_1 _ds-focus_dbymd_1", x = "_input_1cl7y_1 _ds-input_dbymd_1", w = "_law_1cl7y_1", C = "_grid_1cl7y_1", M = "_flex_1cl7y_1", O = "_link_1cl7y_1", S = "_logo_1cl7y_1", T = "_pagination_1cl7y_1 _ds-pagination_dbymd_5", j = "_popover_1cl7y_1", q = "_progress_1cl7y_1", z = "__indeterminate_1cl7y_1", A = "_skeleton_1cl7y_1 _ds-skeleton_dbymd_5", B = "__skeleton_1cl7y_1", D = "_spinner_1cl7y_1", E = "_steps_1cl7y_1", F = "_table_1cl7y_1 _ds-table_dbymd_5", G = "__scrollShadow_1cl7y_1", H = "_tabs_1cl7y_1 _ds-tabs_dbymd_5", I = "__scrollMask_1cl7y_1", J = "_tag_1cl7y_1 _ds-tag_dbymd_5", K = "_toast_1cl7y_1", L = "__toastClose_1cl7y_1", N = "__toastOpen_1cl7y_1", P = "__toastTimeout_1cl7y_1", Q = "_togglegroup_1cl7y_1", R = "__tooltip_1cl7y_1", U = "_heading_1cl7y_1 _ds-heading_dbymd_1", V = "_ingress_1cl7y_1", W = "_muted_1cl7y_1", X = "_info_1cl7y_1", Y = "_prose_1cl7y_1", Z = "_validation_1cl7y_1 _ds-validation-message_dbymd_1", $ = "_body_1cl7y_173", __ = "__checked_1cl7y_1", t_ = {
+const _ = "_alert_1cl7y_1 _ds-alert_5rpuv_3", t = "_app_1cl7y_1", s = "_sticky_1cl7y_1", o = "_avatar_1cl7y_1 _ds-avatar_5rpuv_1", c = "_badge_1cl7y_1", l = "_breadcrumbs_1cl7y_1 _ds-breadcrumbs_5rpuv_5", e = "_button_1cl7y_1 _ds-button_5rpuv_1", a = "_card_1cl7y_1", r = "_group_1cl7y_1", n = "_chip_1cl7y_1 _ds-chip_5rpuv_5", i = "_details_1cl7y_1 _ds-details_5rpuv_3", d = "_dialog_1cl7y_1 _ds-dialog_5rpuv_5", p = "__drawer_1cl7y_1", y = "_divider_1cl7y_1", u = "_errorsummary_1cl7y_1 _ds-error-summary_5rpuv_5", g = "__errorsummary_1cl7y_1", v = "_field_1cl7y_1 _ds-field_5rpuv_1", f = "__datalist_1cl7y_1", m = "_affixes_1cl7y_1 _ds-field-affixes_5rpuv_3", b = "_fieldset_1cl7y_1 _ds-fieldset_5rpuv_3", k = "_fileupload_1cl7y_1", h = "_helptext_1cl7y_1 _ds-focus_5rpuv_1", x = "_input_1cl7y_1 _ds-input_5rpuv_1", w = "_law_1cl7y_1", C = "_grid_1cl7y_1", M = "_flex_1cl7y_1", O = "_link_1cl7y_1", S = "_logo_1cl7y_1", T = "_pagination_1cl7y_1 _ds-pagination_5rpuv_5", j = "_popover_1cl7y_1", q = "_progress_1cl7y_1", z = "__indeterminate_1cl7y_1", A = "_skeleton_1cl7y_1 _ds-skeleton_5rpuv_5", B = "__skeleton_1cl7y_1", D = "_spinner_1cl7y_1", E = "_steps_1cl7y_1", F = "_table_1cl7y_1 _ds-table_5rpuv_5", G = "__scrollShadow_1cl7y_1", H = "_tabs_1cl7y_1 _ds-tabs_5rpuv_5", I = "__scrollMask_1cl7y_1", J = "_tag_1cl7y_1 _ds-tag_5rpuv_5", K = "_toast_1cl7y_1", L = "__toastClose_1cl7y_1", N = "__toastOpen_1cl7y_1", P = "__toastTimeout_1cl7y_1", Q = "_togglegroup_1cl7y_1", R = "__tooltip_1cl7y_1", U = "_heading_1cl7y_1 _ds-heading_5rpuv_1", V = "_ingress_1cl7y_1", W = "_muted_1cl7y_1", X = "_info_1cl7y_1", Y = "_prose_1cl7y_1", Z = "_validation_1cl7y_1 _ds-validation-message_5rpuv_1", $ = "_body_1cl7y_173", __ = "__checked_1cl7y_1", t_ = {
   alert: _,
   app: t,
   sticky: s,
@@ -6,21 +6,21 @@ const _ = "_alert_1cl7y_1 _ds-alert_dbymd_3", t = "_app_1cl7y_1", s = "_sticky_1
   badge: c,
   breadcrumbs: l,
   button: e,
-  card: d,
-  group: a,
+  card: a,
+  group: r,
   chip: n,
-  details: r,
-  dialog: i,
-  _drawer: y,
-  divider: p,
-  errorsummary: m,
-  _errorsummary: b,
-  field: g,
-  _datalist: u,
-  affixes: f,
-  fieldset: k,
-  fileupload: h,
-  helptext: v,
+  details: i,
+  dialog: d,
+  _drawer: p,
+  divider: y,
+  errorsummary: u,
+  _errorsummary: g,
+  field: v,
+  _datalist: f,
+  affixes: m,
+  fieldset: b,
+  fileupload: k,
+  helptext: h,
   input: x,
   law: w,
   grid: C,
@@ -57,9 +57,9 @@ const _ = "_alert_1cl7y_1 _ds-alert_dbymd_3", t = "_app_1cl7y_1", s = "_sticky_1
 };
 export {
   __ as _checked,
-  u as _datalist,
-  y as _drawer,
-  b as _errorsummary,
+  f as _datalist,
+  p as _drawer,
+  g as _errorsummary,
   z as _indeterminate,
   I as _scrollMask,
   G as _scrollShadow,
@@ -68,7 +68,7 @@ export {
   N as _toastOpen,
   P as _toastTimeout,
   R as _tooltip,
-  f as affixes,
+  m as affixes,
   _ as alert,
   t as app,
   o as avatar,
@@ -76,21 +76,21 @@ export {
   $ as body,
   l as breadcrumbs,
   e as button,
-  d as card,
+  a as card,
   n as chip,
   t_ as default,
-  r as details,
-  i as dialog,
-  p as divider,
-  m as errorsummary,
-  g as field,
-  k as fieldset,
-  h as fileupload,
+  i as details,
+  d as dialog,
+  y as divider,
+  u as errorsummary,
+  v as field,
+  b as fieldset,
+  k as fileupload,
   M as flex,
   C as grid,
-  a as group,
+  r as group,
   U as heading,
-  v as helptext,
+  h as helptext,
   X as info,
   V as ingress,
   x as input,

package/mtds/utils.d.ts

@@ -4,7 +4,6 @@ export declare const QUICK_EVENT: {
     passive: boolean;
 };
 export declare const IS_BROWSER: boolean;
-export declare function prettyNumber(number: number | string): string;
 export declare function debounce<T extends unknown[]>(callback: (...args: T) => void, delay: number): (this: unknown, ...args: T) => void;
 /**
  * attr
@@ -48,7 +47,12 @@ export declare function anchorPosition(target: HTMLElement, anchor: false | Elem
  * Speed up MutationObserver by debouncing and only running when page is visible
  * @return new MutaionObserver
  */
-export declare function onMutation(callback: MutationCallback, ...attrs: string[]): () => void;
+export declare function onMutation(callback: (observer: MutationObserver) => void, attr: string | {
+    attr: string;
+    root?: HTMLElement;
+    delay?: number;
+}): () => void;
+export declare function onResize(callback: ResizeObserverCallback, element: Element): () => void;
 /**
  * isInputLike
  * @description Check if element is an input like element
@@ -67,7 +71,7 @@ export declare const toCustomElementProps: ({ className, hidden, open, ...rest }
  * @param text Optional text content to add to the element
  * @return HTMLElement with props
  */
-export declare const tag: <TagName extends keyof HTMLElementTagNameMap>(tagName: TagName, attrs?: Record<string, string | null>, text?: string | null) => HTMLElementTagNameMap[TagName];
+export declare const tag: <TagName extends keyof HTMLElementTagNameMap>(tagName: TagName, attrs?: Record<string, string | null> | null, text?: string | null) => HTMLElementTagNameMap[TagName];
 export declare const MTDSElement: {
     new (): HTMLElement;
     prototype: HTMLElement;

package/mtds/utils.js

@@ -1,8 +1,8 @@
-import { autoUpdate as y, computePosition as E, flip as C, shift as T, size as L } from "@floating-ui/dom";
+import { autoUpdate as E, computePosition as v, flip as C, shift as T, size as L } from "@floating-ui/dom";
 import M from "clsx";
-import v from "./styles.module.css.js";
-const O = { capture: !0, passive: !0 }, m = typeof window < "u" && typeof document < "u";
-function k(t, e) {
+import A from "./styles.module.css.js";
+const q = { capture: !0, passive: !0 }, m = typeof window < "u" && typeof document < "u";
+function F(t, e) {
   let n;
   return function(...o) {
     clearTimeout(n), n = setTimeout(() => t.apply(this, o), e);
@@ -11,87 +11,92 @@ function k(t, e) {
 function f(t, e, n) {
   return n === void 0 ? t.getAttribute(e) ?? null : (n === null ? t.removeAttribute(e) : t.getAttribute(e) !== n && t.setAttribute(e, n), null);
 }
-let A = 0;
-const S = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;
-function x(t) {
-  return t.id || (t.id = `${S}${++A}`), t.id;
+let S = 0;
+const $ = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;
+function g(t) {
+  return t.id || (t.id = `${$}${++S}`), t.id;
 }
 const p = (t, e, [...n]) => {
   for (const o of n[0].split(","))
     n[0] = o, e[`${t}EventListener`](...n);
-}, $ = (t, ...e) => (p("add", t, e), () => h(t, ...e)), h = (t, ...e) => p("remove", t, e), R = (t) => {
+}, h = (t, ...e) => (p("add", t, e), () => H(t, ...e)), H = (t, ...e) => p("remove", t, e), x = (t) => {
   if (!m || !window.requestAnimationFrame) return;
   window._mtdsCleanups || (window._mtdsCleanups = /* @__PURE__ */ new Map());
   const e = () => requestAnimationFrame(() => {
     const n = String(t).replace(/(\n|\s)/g, "");
     window._mtdsCleanups?.get(n)?.map((o) => o()), window._mtdsCleanups?.set(n, t());
   });
-  document.readyState === "complete" ? e() : $(window, "load", e);
-}, c = /* @__PURE__ */ new WeakMap(), H = `.${v.dialog.split(" ")[0]}`;
-function _(t, e, { contain: n, middleware: o, placement: i, ...s } = {}) {
-  if (c.get(t)?.(), c.delete(t), e) {
-    const r = t.closest(H)?.querySelector(":scope > footer"), u = Number(f(t, "data-inset")) || 20, l = { bottom: (r?.clientHeight || 0) + u, left: u, right: u, top: u }, a = f(t, "data-position") ?? "bottom";
-    c.set(
+  document.readyState === "complete" ? e() : h(window, "load", e);
+}, u = /* @__PURE__ */ new WeakMap(), _ = `.${A.dialog.split(" ")[0]}`;
+function D(t, e, { contain: n, middleware: o, placement: i, ...c } = {}) {
+  if (u.get(t)?.(), u.delete(t), e) {
+    const s = t.closest(_)?.querySelector(":scope > footer"), r = Number(f(t, "data-inset")) || 20, l = { bottom: (s?.clientHeight || 0) + r, left: r, right: r, top: r }, w = f(t, "data-position") ?? "bottom";
+    u.set(
       t,
-      y(e, t, () => {
+      E(e, t, () => {
         if (!t.isConnected || !e.isConnected || t.hidden)
-          return _(t, !1);
-        E(e, t, {
-          ...s,
-          placement: i || a,
+          return D(t, !1);
+        v(e, t, {
+          ...c,
+          placement: i || w,
           middleware: [
             C({ padding: l }),
             T(),
             ...n ? [L({ padding: l, apply: n })] : [],
             ...o || []
           ]
-        }).then(({ x: w, y: b }) => {
-          t.style.left = `${w}px`, t.style.top = `${b}px`;
+        }).then(({ x: y, y: b }) => {
+          t.style.left = `${y}px`, t.style.top = `${b}px`;
         });
       })
     );
   }
 }
-function U(t, ...e) {
+function z(t, e) {
   let n = 0;
-  const o = () => setTimeout(i, 200), i = () => {
+  const o = typeof e == "string" ? { attr: e } : e, i = () => setTimeout(c, o?.delay ?? 200), c = () => {
     if (!m) return r();
-    t([], s), s.takeRecords(), n = 0;
+    t(s), s.takeRecords(), n = 0;
   }, s = new MutationObserver(() => {
-    n || (n = requestAnimationFrame(o));
+    n || (n = requestAnimationFrame(i));
   }), r = () => {
     try {
       s.disconnect();
     } catch {
     }
   };
-  return s.observe(document.documentElement, {
-    attributeFilter: e,
+  return s.observe(o?.root || document.documentElement, {
+    attributeFilter: [o.attr],
     attributes: !0,
     childList: !0,
     subtree: !0
-  }), r;
+  }), t(s), r;
 }
-const P = (t) => t instanceof HTMLElement && "validity" in t && !(t instanceof HTMLButtonElement), d = "aria-selected", W = ({ className: t, hidden: e, open: n, ...o }, i) => (o.suppressHydrationWarning = !0, o[d] !== void 0 && (o[d] = `${(o[d] || "false") !== "false"}`), (t || i) && (o.class = M(i, t)), e && (o.hidden = !0), n && (o.open = !0), o), g = (t, e, n) => {
+function U(t, e) {
+  const n = new ResizeObserver(t);
+  return n.observe(e), () => n.disconnect();
+}
+const k = (t) => t instanceof HTMLElement && "validity" in t && !(t instanceof HTMLButtonElement), d = "aria-selected", P = ({ className: t, hidden: e, open: n, ...o }, i) => (o.suppressHydrationWarning = !0, o[d] !== void 0 && (o[d] = `${(o[d] || "false") !== "false"}`), (t || i) && (o.class = M(i, t)), e && (o.hidden = !0), n && (o.open = !0), o), W = (t, e, n) => {
   const o = document.createElement(t);
-  if (n && (o.textContent = n), e) for (const [i, s] of Object.entries(e)) f(o, i, s);
+  if (n && (o.textContent = n), e) for (const [i, c] of Object.entries(e)) f(o, i, c);
   return o;
 }, B = typeof HTMLElement > "u" ? class {
 } : HTMLElement;
 export {
   m as IS_BROWSER,
   B as MTDSElement,
-  O as QUICK_EVENT,
-  _ as anchorPosition,
+  q as QUICK_EVENT,
+  D as anchorPosition,
   f as attr,
-  k as debounce,
-  P as isInputLike,
-  h as off,
-  $ as on,
-  R as onLoaded,
-  U as onMutation,
-  g as tag,
-  W as toCustomElementProps,
-  x as useId
+  F as debounce,
+  k as isInputLike,
+  H as off,
+  h as on,
+  x as onLoaded,
+  z as onMutation,
+  U as onResize,
+  W as tag,
+  P as toCustomElementProps,
+  g as useId
 };
 //# sourceMappingURL=utils.js.map

package/mtds/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../designsystem/utils.ts"],"sourcesContent":["import type { Placement, SizeOptions } from \"@floating-ui/dom\";\nimport {\n\tautoUpdate,\n\tcomputePosition,\n\tflip,\n\tshift,\n\tsize,\n} from \"@floating-ui/dom\";\nimport clsx from \"clsx\";\nimport styles from \"./styles.module.css\";\n\nexport const QUICK_EVENT = { capture: true, passive: true };\nexport const IS_BROWSER =\n\ttypeof window !== \"undefined\" && typeof document !== \"undefined\";\n\n// TODO: Documentation for prettyNumber\nlet INTL_NUM: Intl.NumberFormat | undefined;\nexport function prettyNumber(number: number | string) {\n\tif (!INTL_NUM)\n\t\tINTL_NUM = new Intl.NumberFormat(\n\t\t\t(IS_BROWSER && attr(document.documentElement, \"lang\")) || \"no\",\n\t\t);\n\treturn INTL_NUM.format(Number(number));\n}\n\nexport function debounce<T extends unknown[]>(\n\tcallback: (...args: T) => void,\n\tdelay: number,\n) {\n\tlet timer: ReturnType<typeof setTimeout>;\n\n\treturn function (this: unknown, ...args: T) {\n\t\tclearTimeout(timer);\n\t\ttimer = setTimeout(() => callback.apply(this, args), delay);\n\t};\n}\n\n/**\n * attr\n * @description Utility to quickly get, set and remove attributes\n * @param el The Element to use as EventTarget\n * @param name The attribute name to get, set or remove, or a object to set multiple attributes\n * @param value A valid attribute value or null to remove attribute\n */\nexport function attr(\n\tel: Element,\n\tname: string,\n\tvalue?: string | null,\n): string | null {\n\tif (value === undefined) return el.getAttribute(name) ?? null; // Fallback to null only if el is undefined\n\tif (value === null) el.removeAttribute(name);\n\telse if (el.getAttribute(name) !== value) el.setAttribute(name, value);\n\treturn null;\n}\n\n/**\n * useId\n * @return A generated unique ID\n */\nlet id = 0;\nconst UUID = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;\nexport function useId(el: Element) {\n\tif (!el.id) el.id = `${UUID}${++id}`;\n\treturn el.id;\n}\n\n// Internal helper for on / off\nconst events = (\n\taction: \"add\" | \"remove\",\n\telement: Node | Window,\n\t[...rest]: Parameters<typeof Element.prototype.addEventListener>, // Spreat to make a copy of the array\n): void => {\n\tfor (const type of rest[0].split(\",\")) {\n\t\trest[0] = type;\n\t\telement[`${action}EventListener`](...rest);\n\t}\n};\n\n/**\n * on\n * @param element The Element to use as EventTarget\n * @param types A comma separated string of event types\n * @param listener An event listener function or listener object\n */\nexport const on = (\n\telement: Node | Window,\n\t...rest: Parameters<typeof Element.prototype.addEventListener>\n): (() => void) => {\n\tevents(\"add\", element, rest);\n\treturn () => off(element, ...rest);\n};\n\n/**\n * off\n * @param element The Element to use as EventTarget\n * @param types A comma separated string of event types\n * @param listener An event listener function or listener object\n */\nexport const off = (\n\telement: Node | Window,\n\t...rest: Parameters<typeof Element.prototype.removeEventListener>\n): void => events(\"remove\", element, rest);\n\ndeclare global {\n\tinterface Window {\n\t\t_mtdsCleanups?: Map<string, Array<() => void>>;\n\t}\n}\n\n/**\n * onLoaded\n * @description Runs a callback when window is loaded in browser, and ensures events are unbound if hot reloading\n * @param callback The callback to run when the page is ready\n */\nexport const onLoaded = (setup: () => Array<() => void>) => {\n\tif (!IS_BROWSER || !window.requestAnimationFrame) return; // Skip if not in browser environment\n\tif (!window._mtdsCleanups) window._mtdsCleanups = new Map();\n\n\tconst run = () =>\n\t\trequestAnimationFrame(() => {\n\t\t\tconst key = String(setup).replace(/(\\n|\\s)/g, \"\"); // Create a key based on setup function body\n\t\t\twindow._mtdsCleanups?.get(key)?.map((cleanup) => cleanup()); // Run cleanups\n\t\t\twindow._mtdsCleanups?.set(key, setup()); // Rum setup and store cleanups\n\t\t});\n\n\tif (document.readyState === \"complete\") run();\n\telse on(window, \"load\", run);\n};\n\ntype AnchorOptions = Parameters<typeof computePosition>[2] & {\n\tcontain?: SizeOptions[\"apply\"] | false;\n};\nconst ANCHORED = new WeakMap<Element, ReturnType<typeof autoUpdate>>();\nconst DIALOG = `.${styles.dialog.split(\" \")[0]}`;\nexport function anchorPosition(\n\ttarget: HTMLElement,\n\tanchor: false | Element,\n\t{ contain, middleware, placement, ...options }: AnchorOptions = {},\n) {\n\tANCHORED.get(target)?.(); // Unbind previous anchor position\n\tANCHORED.delete(target);\n\n\t// TODO aria-label på app\n\tif (anchor) {\n\t\tconst footer = target.closest(DIALOG)?.querySelector(\":scope > footer\");\n\t\tconst inset = Number(attr(target, \"data-inset\")) || 20;\n\t\tconst bottom = (footer?.clientHeight || 0) + inset;\n\t\tconst padding = { bottom, left: inset, right: inset, top: inset };\n\t\tconst position = (attr(target, \"data-position\") ?? \"bottom\") as Placement;\n\n\t\tANCHORED.set(\n\t\t\ttarget,\n\t\t\tautoUpdate(anchor, target, () => {\n\t\t\t\tif (!target.isConnected || !anchor.isConnected || target.hidden)\n\t\t\t\t\treturn anchorPosition(target, false);\n\t\t\t\tcomputePosition(anchor, target, {\n\t\t\t\t\t...options,\n\t\t\t\t\tplacement: placement || position,\n\t\t\t\t\tmiddleware: [\n\t\t\t\t\t\tflip({ padding }),\n\t\t\t\t\t\tshift(),\n\t\t\t\t\t\t...(contain ? [size({ padding, apply: contain })] : []),\n\t\t\t\t\t\t...(middleware || []),\n\t\t\t\t\t],\n\t\t\t\t}).then(({ x, y }) => {\n\t\t\t\t\ttarget.style.left = `${x}px`;\n\t\t\t\t\ttarget.style.top = `${y}px`;\n\t\t\t\t});\n\t\t\t}),\n\t\t);\n\t}\n}\n\n/**\n * Speed up MutationObserver by debouncing and only running when page is visible\n * @return new MutaionObserver\n */\nexport function onMutation(callback: MutationCallback, ...attrs: string[]) {\n\tlet queue = 0;\n\tconst onFrame = () => setTimeout(onTimer, 200); // Use both requestAnimationFrame and setTimeout to debounce and only run when visible\n\tconst onTimer = () => {\n\t\tif (!IS_BROWSER) return cleanup(); // If using JSDOM, the document might have been removed\n\t\tcallback([], observer);\n\t\tobserver.takeRecords(); // Clear records to avoid running callback multiple times\n\t\tqueue = 0;\n\t};\n\tconst observer = new MutationObserver(() => {\n\t\tif (!queue) queue = requestAnimationFrame(onFrame);\n\t});\n\tconst cleanup = () => {\n\t\ttry {\n\t\t\tobserver.disconnect();\n\t\t} catch (_) {\n\t\t\t// No more observer\n\t\t}\n\t};\n\n\tobserver.observe(document.documentElement, {\n\t\tattributeFilter: attrs,\n\t\tattributes: true,\n\t\tchildList: true,\n\t\tsubtree: true,\n\t});\n\n\treturn cleanup;\n}\n\n/**\n * isInputLike\n * @description Check if element is an input like element\n * @param el The element to check\n * @returns True if the element is an input like element\n */\nexport const isInputLike = (el: unknown): el is HTMLInputElement =>\n\tel instanceof HTMLElement &&\n\t\"validity\" in el &&\n\t!(el instanceof HTMLButtonElement);\n\n/**\n * toCustomElementProps\n * @description Utility to quickly convert props to custom element attributes\n * @param props The props to convert\n * @returns The converted props\n */\nconst SELECTED = \"aria-selected\";\nexport const toCustomElementProps = (\n\t{ className, hidden, open, ...rest }: Record<string, unknown>,\n\tklass?: string,\n) => {\n\trest.suppressHydrationWarning = true; // Make Next.js happy\n\tif (rest[SELECTED] !== undefined)\n\t\trest[SELECTED] = `${(rest[SELECTED] || \"false\") !== \"false\"}`; // Ensure aria-selected boolean is string\n\tif (className || klass) rest.class = clsx(klass, className as string); // Use class instead of className\n\tif (hidden) rest.hidden = true; // Ensure boolean prop behaviour\n\tif (open) rest.open = true; // Ensure boolean prop behaviour\n\treturn rest;\n};\n\n/**\n * tag\n * @description creates element and assigns properties\n * @param tagName The tagname of element to create\n * @param attrs Optional attributes to add to the element\n * @param text Optional text content to add to the element\n * @return HTMLElement with props\n */\nexport const tag = <TagName extends keyof HTMLElementTagNameMap>(\n\ttagName: TagName,\n\tattrs?: Record<string, string | null>,\n\ttext?: string | null,\n): HTMLElementTagNameMap[TagName] => {\n\tconst el = document.createElement(tagName);\n\tif (text) el.textContent = text;\n\tif (attrs) for (const [key, val] of Object.entries(attrs)) attr(el, key, val);\n\treturn el;\n};\n\n// Make sure we have a HTMLElement to extend (for server side rendering)\nexport const MTDSElement =\n\ttypeof HTMLElement === \"undefined\"\n\t\t? (class {} as typeof HTMLElement)\n\t\t: HTMLElement;\n"],"names":["QUICK_EVENT","IS_BROWSER","debounce","callback","delay","timer","args","attr","el","name","value","id","UUID","useId","events","action","element","type","rest","on","off","onLoaded","setup","run","key","cleanup","ANCHORED","DIALOG","styles","anchorPosition","target","anchor","contain","middleware","placement","options","footer","inset","padding","position","autoUpdate","computePosition","flip","shift","size","x","y","onMutation","attrs","queue","onFrame","onTimer","observer","isInputLike","SELECTED","toCustomElementProps","className","hidden","open","klass","clsx","tag","tagName","text","val","MTDSElement"],"mappings":"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"}
+{"version":3,"file":"utils.js","sources":["../designsystem/utils.ts"],"sourcesContent":["import type { Placement, SizeOptions } from \"@floating-ui/dom\";\nimport {\n\tautoUpdate,\n\tcomputePosition,\n\tflip,\n\tshift,\n\tsize,\n} from \"@floating-ui/dom\";\nimport clsx from \"clsx\";\nimport styles from \"./styles.module.css\";\n\nexport const QUICK_EVENT = { capture: true, passive: true };\nexport const IS_BROWSER =\n\ttypeof window !== \"undefined\" && typeof document !== \"undefined\";\n\nexport function debounce<T extends unknown[]>(\n\tcallback: (...args: T) => void,\n\tdelay: number,\n) {\n\tlet timer: ReturnType<typeof setTimeout>;\n\n\treturn function (this: unknown, ...args: T) {\n\t\tclearTimeout(timer);\n\t\ttimer = setTimeout(() => callback.apply(this, args), delay);\n\t};\n}\n\n/**\n * attr\n * @description Utility to quickly get, set and remove attributes\n * @param el The Element to use as EventTarget\n * @param name The attribute name to get, set or remove, or a object to set multiple attributes\n * @param value A valid attribute value or null to remove attribute\n */\nexport function attr(\n\tel: Element,\n\tname: string,\n\tvalue?: string | null,\n): string | null {\n\tif (value === undefined) return el.getAttribute(name) ?? null; // Fallback to null only if el is undefined\n\tif (value === null) el.removeAttribute(name);\n\telse if (el.getAttribute(name) !== value) el.setAttribute(name, value);\n\treturn null;\n}\n\n/**\n * useId\n * @return A generated unique ID\n */\nlet id = 0;\nconst UUID = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;\nexport function useId(el: Element) {\n\tif (!el.id) el.id = `${UUID}${++id}`;\n\treturn el.id;\n}\n\n// Internal helper for on / off\nconst events = (\n\taction: \"add\" | \"remove\",\n\telement: Node | Window,\n\t[...rest]: Parameters<typeof Element.prototype.addEventListener>, // Spreat to make a copy of the array\n): void => {\n\tfor (const type of rest[0].split(\",\")) {\n\t\trest[0] = type;\n\t\telement[`${action}EventListener`](...rest);\n\t}\n};\n\n/**\n * on\n * @param element The Element to use as EventTarget\n * @param types A comma separated string of event types\n * @param listener An event listener function or listener object\n */\nexport const on = (\n\telement: Node | Window,\n\t...rest: Parameters<typeof Element.prototype.addEventListener>\n): (() => void) => {\n\tevents(\"add\", element, rest);\n\treturn () => off(element, ...rest);\n};\n\n/**\n * off\n * @param element The Element to use as EventTarget\n * @param types A comma separated string of event types\n * @param listener An event listener function or listener object\n */\nexport const off = (\n\telement: Node | Window,\n\t...rest: Parameters<typeof Element.prototype.removeEventListener>\n): void => events(\"remove\", element, rest);\n\ndeclare global {\n\tinterface Window {\n\t\t_mtdsCleanups?: Map<string, Array<() => void>>;\n\t}\n}\n\n/**\n * onLoaded\n * @description Runs a callback when window is loaded in browser, and ensures events are unbound if hot reloading\n * @param callback The callback to run when the page is ready\n */\nexport const onLoaded = (setup: () => Array<() => void>) => {\n\tif (!IS_BROWSER || !window.requestAnimationFrame) return; // Skip if not in browser environment\n\tif (!window._mtdsCleanups) window._mtdsCleanups = new Map();\n\n\tconst run = () =>\n\t\trequestAnimationFrame(() => {\n\t\t\tconst key = String(setup).replace(/(\\n|\\s)/g, \"\"); // Create a key based on setup function body\n\t\t\twindow._mtdsCleanups?.get(key)?.map((cleanup) => cleanup()); // Run cleanups\n\t\t\twindow._mtdsCleanups?.set(key, setup()); // Rum setup and store cleanups\n\t\t});\n\n\tif (document.readyState === \"complete\") run();\n\telse on(window, \"load\", run);\n};\n\ntype AnchorOptions = Parameters<typeof computePosition>[2] & {\n\tcontain?: SizeOptions[\"apply\"] | false;\n};\nconst ANCHORED = new WeakMap<Element, ReturnType<typeof autoUpdate>>();\nconst DIALOG = `.${styles.dialog.split(\" \")[0]}`;\nexport function anchorPosition(\n\ttarget: HTMLElement,\n\tanchor: false | Element,\n\t{ contain, middleware, placement, ...options }: AnchorOptions = {},\n) {\n\tANCHORED.get(target)?.(); // Unbind previous anchor position\n\tANCHORED.delete(target);\n\n\t// TODO aria-label på app\n\tif (anchor) {\n\t\tconst footer = target.closest(DIALOG)?.querySelector(\":scope > footer\");\n\t\tconst inset = Number(attr(target, \"data-inset\")) || 20;\n\t\tconst bottom = (footer?.clientHeight || 0) + inset;\n\t\tconst padding = { bottom, left: inset, right: inset, top: inset };\n\t\tconst position = (attr(target, \"data-position\") ?? \"bottom\") as Placement;\n\n\t\tANCHORED.set(\n\t\t\ttarget,\n\t\t\tautoUpdate(anchor, target, () => {\n\t\t\t\tif (!target.isConnected || !anchor.isConnected || target.hidden)\n\t\t\t\t\treturn anchorPosition(target, false);\n\t\t\t\tcomputePosition(anchor, target, {\n\t\t\t\t\t...options,\n\t\t\t\t\tplacement: placement || position,\n\t\t\t\t\tmiddleware: [\n\t\t\t\t\t\tflip({ padding }),\n\t\t\t\t\t\tshift(),\n\t\t\t\t\t\t...(contain ? [size({ padding, apply: contain })] : []),\n\t\t\t\t\t\t...(middleware || []),\n\t\t\t\t\t],\n\t\t\t\t}).then(({ x, y }) => {\n\t\t\t\t\ttarget.style.left = `${x}px`;\n\t\t\t\t\ttarget.style.top = `${y}px`;\n\t\t\t\t});\n\t\t\t}),\n\t\t);\n\t}\n}\n\n/**\n * Speed up MutationObserver by debouncing and only running when page is visible\n * @return new MutaionObserver\n */\nexport function onMutation(\n\tcallback: (observer: MutationObserver) => void,\n\tattr: string | { attr: string; root?: HTMLElement; delay?: number },\n) {\n\tlet queue = 0;\n\tconst config = typeof attr === \"string\" ? { attr } : attr;\n\tconst onFrame = () => setTimeout(onTimer, config?.delay ?? 200); // Use both requestAnimationFrame and setTimeout to debounce and only run when visible\n\tconst onTimer = () => {\n\t\tif (!IS_BROWSER) return cleanup(); // If using JSDOM, the document might have been removed\n\t\tcallback(observer);\n\t\tobserver.takeRecords(); // Clear records to avoid running callback multiple times\n\t\tqueue = 0;\n\t};\n\tconst observer = new MutationObserver(() => {\n\t\tif (!queue) queue = requestAnimationFrame(onFrame);\n\t});\n\tconst cleanup = () => {\n\t\ttry {\n\t\t\tobserver.disconnect();\n\t\t} catch (_) {\n\t\t\t// No more observer\n\t\t}\n\t};\n\n\tobserver.observe(config?.root || document.documentElement, {\n\t\tattributeFilter: [config.attr],\n\t\tattributes: true,\n\t\tchildList: true,\n\t\tsubtree: true,\n\t});\n\n\tcallback(observer); // Initial run\n\treturn cleanup;\n}\n\nexport function onResize(callback: ResizeObserverCallback, element: Element) {\n\tconst resize = new ResizeObserver(callback);\n\tresize.observe(element);\n\treturn () => resize.disconnect();\n}\n\n/**\n * isInputLike\n * @description Check if element is an input like element\n * @param el The element to check\n * @returns True if the element is an input like element\n */\nexport const isInputLike = (el: unknown): el is HTMLInputElement =>\n\tel instanceof HTMLElement &&\n\t\"validity\" in el &&\n\t!(el instanceof HTMLButtonElement);\n\n/**\n * toCustomElementProps\n * @description Utility to quickly convert props to custom element attributes\n * @param props The props to convert\n * @returns The converted props\n */\nconst SELECTED = \"aria-selected\";\nexport const toCustomElementProps = (\n\t{ className, hidden, open, ...rest }: Record<string, unknown>,\n\tklass?: string,\n) => {\n\trest.suppressHydrationWarning = true; // Make Next.js happy\n\tif (rest[SELECTED] !== undefined)\n\t\trest[SELECTED] = `${(rest[SELECTED] || \"false\") !== \"false\"}`; // Ensure aria-selected boolean is string\n\tif (className || klass) rest.class = clsx(klass, className as string); // Use class instead of className\n\tif (hidden) rest.hidden = true; // Ensure boolean prop behaviour\n\tif (open) rest.open = true; // Ensure boolean prop behaviour\n\treturn rest;\n};\n\n/**\n * tag\n * @description creates element and assigns properties\n * @param tagName The tagname of element to create\n * @param attrs Optional attributes to add to the element\n * @param text Optional text content to add to the element\n * @return HTMLElement with props\n */\nexport const tag = <TagName extends keyof HTMLElementTagNameMap>(\n\ttagName: TagName,\n\tattrs?: Record<string, string | null> | null,\n\ttext?: string | null,\n): HTMLElementTagNameMap[TagName] => {\n\tconst el = document.createElement(tagName);\n\tif (text) el.textContent = text;\n\tif (attrs) for (const [key, val] of Object.entries(attrs)) attr(el, key, val);\n\treturn el;\n};\n\n// Make sure we have a HTMLElement to extend (for server side rendering)\nexport const MTDSElement =\n\ttypeof HTMLElement === \"undefined\"\n\t\t? (class {} as typeof HTMLElement)\n\t\t: HTMLElement;\n"],"names":["QUICK_EVENT","IS_BROWSER","debounce","callback","delay","timer","args","attr","el","name","value","id","UUID","useId","events","action","element","type","rest","on","off","onLoaded","setup","run","key","cleanup","ANCHORED","DIALOG","styles","anchorPosition","target","anchor","contain","middleware","placement","options","footer","inset","padding","position","autoUpdate","computePosition","flip","shift","size","x","y","onMutation","queue","config","onFrame","onTimer","observer","onResize","resize","isInputLike","SELECTED","toCustomElementProps","className","hidden","open","klass","clsx","tag","tagName","attrs","text","val","MTDSElement"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@mattilsynet/design",
-	"version": "2.2.21",
+	"version": "2.2.22",
 	"type": "module",
 	"repository": {
 		"type": "git",
@@ -50,21 +50,21 @@
 		"storybook:build": "npm run build && storybook build"
 	},
 	"devDependencies": {
-		"@biomejs/biome": "^2.3.4",
-		"@digdir/designsystemet-css": "^1.6.1",
+		"@biomejs/biome": "2.3.5",
+		"@digdir/designsystemet-css": "^1.7.2",
 		"@handsontable/react-wrapper": "^16.1.1",
 		"@phosphor-icons/core": "^2.1.1",
 		"@phosphor-icons/react": "^2.1.10",
-		"@storybook/addon-docs": "^10.0.6",
-		"@storybook/addon-themes": "^10.0.6",
-		"@storybook/react-vite": "^10.0.6",
+		"@storybook/addon-docs": "^10.0.7",
+		"@storybook/addon-themes": "^10.0.7",
+		"@storybook/react-vite": "^10.0.7",
 		"@tanstack/react-table": "^8.21.3",
 		"@types/leaflet": "^1.9.21",
 		"@types/leaflet.markercluster": "^1.5.6",
-		"@types/node": "^24.10.0",
-		"@types/react": "^19.2.2",
-		"@types/react-dom": "^19.2.2",
-		"@vitejs/plugin-react": "^5.1.0",
+		"@types/node": "^24.10.1",
+		"@types/react": "^19.2.4",
+		"@types/react-dom": "^19.2.3",
+		"@vitejs/plugin-react": "^5.1.1",
 		"fast-glob": "^3.3.3",
 		"handsontable": "^16.1.1",
 		"leaflet": "^2.0.0-alpha.1",
@@ -72,7 +72,7 @@
 		"postcss-nesting": "^13.0.2",
 		"react": "^19.2.0",
 		"react-dom": "^19.2.0",
-		"storybook": "^10.0.6",
+		"storybook": "^10.0.7",
 		"typescript": "^5.9.3",
 		"vite": "^7.2.2",
 		"vite-plugin-dts": "^4.5.4"