@mattilsynet/design 1.0.4 → 1.0.6

package/mtds/styles.json

@@ -1,36 +1,36 @@
 {
-  "alert": "_alert_cq24j_1 _ds-alert_z5gp5_1",
-  "avatar": "_avatar_cq24j_1 _ds-avatar_z5gp5_1",
-  "badge": "_badge_cq24j_1",
-  "breadcrumbs": "_breadcrumbs_cq24j_1 _ds-breadcrumbs_z5gp5_1",
-  "button": "_button_cq24j_1 _ds-button_z5gp5_1",
-  "card": "_card_cq24j_1",
-  "info": "_info_cq24j_1",
-  "group": "_group_cq24j_1",
-  "chip": "_chip_cq24j_1 _ds-chip_z5gp5_1",
-  "details": "_details_cq24j_1 _ds-details_z5gp5_1",
-  "dialog": "_dialog_cq24j_1 _ds-dialog_z5gp5_1",
-  "divider": "_divider_cq24j_1",
-  "errorsummary": "_errorsummary_cq24j_1 _ds-error-summary_z5gp5_1",
-  "field": "_field_cq24j_1 _ds-field_z5gp5_1",
-  "affixes": "_affixes_cq24j_1 _ds-field-affixes_z5gp5_1",
-  "fieldset": "_fieldset_cq24j_1 _ds-fieldset_z5gp5_1",
-  "helptext": "_helptext_cq24j_1 _ds-focus_z5gp5_1",
-  "input": "_input_cq24j_1 _ds-input_z5gp5_1",
-  "app": "_app_cq24j_1",
-  "grid": "_grid_cq24j_1",
-  "flex": "_flex_cq24j_1",
-  "link": "_link_cq24j_1",
-  "logo": "_logo_cq24j_1",
-  "pagination": "_pagination_cq24j_1 _ds-pagination_z5gp5_1",
-  "popover": "_popover_cq24j_1",
-  "skeleton": "_skeleton_cq24j_1 _ds-skeleton_z5gp5_1",
-  "spinner": "_spinner_cq24j_1",
-  "table": "_table_cq24j_1 _ds-table_z5gp5_1",
-  "tabs": "_tabs_cq24j_1 _ds-tabs_z5gp5_1",
-  "tag": "_tag_cq24j_1 _ds-tag_z5gp5_1",
-  "heading": "_heading_cq24j_1 _ds-heading_z5gp5_1",
-  "prose": "_prose_cq24j_1",
-  "validation": "_validation_cq24j_1 _ds-validation-message_z5gp5_1",
-  "body": "_body_cq24j_109"
+  "alert": "_alert_jsd43_1 _ds-alert_z5gp5_1",
+  "avatar": "_avatar_jsd43_1 _ds-avatar_z5gp5_1",
+  "badge": "_badge_jsd43_1",
+  "breadcrumbs": "_breadcrumbs_jsd43_1 _ds-breadcrumbs_z5gp5_1",
+  "button": "_button_jsd43_1 _ds-button_z5gp5_1",
+  "card": "_card_jsd43_1",
+  "info": "_info_jsd43_1",
+  "group": "_group_jsd43_1",
+  "chip": "_chip_jsd43_1 _ds-chip_z5gp5_1",
+  "details": "_details_jsd43_1 _ds-details_z5gp5_1",
+  "dialog": "_dialog_jsd43_1 _ds-dialog_z5gp5_1",
+  "divider": "_divider_jsd43_1",
+  "errorsummary": "_errorsummary_jsd43_1 _ds-error-summary_z5gp5_1",
+  "field": "_field_jsd43_1 _ds-field_z5gp5_1",
+  "affixes": "_affixes_jsd43_1 _ds-field-affixes_z5gp5_1",
+  "fieldset": "_fieldset_jsd43_1 _ds-fieldset_z5gp5_1",
+  "heading": "_heading_jsd43_1 _ds-heading_z5gp5_1",
+  "helptext": "_helptext_jsd43_1 _ds-focus_z5gp5_1",
+  "input": "_input_jsd43_1 _ds-input_z5gp5_1",
+  "app": "_app_jsd43_1",
+  "grid": "_grid_jsd43_1",
+  "flex": "_flex_jsd43_1",
+  "prose": "_prose_jsd43_1",
+  "link": "_link_jsd43_1",
+  "logo": "_logo_jsd43_1",
+  "pagination": "_pagination_jsd43_1 _ds-pagination_z5gp5_1",
+  "popover": "_popover_jsd43_1",
+  "skeleton": "_skeleton_jsd43_1 _ds-skeleton_z5gp5_1",
+  "spinner": "_spinner_jsd43_1",
+  "table": "_table_jsd43_1 _ds-table_z5gp5_1",
+  "tabs": "_tabs_jsd43_1 _ds-tabs_z5gp5_1",
+  "tag": "_tag_jsd43_1 _ds-tag_z5gp5_1",
+  "validation": "_validation_jsd43_1 _ds-validation-message_z5gp5_1",
+  "body": "_body_jsd43_125"
 }

package/mtds/styles.module.css.js

@@ -1,82 +1,86 @@
-const _ = "_alert_cq24j_1 _ds-alert_z5gp5_1", t = "_avatar_cq24j_1 _ds-avatar_z5gp5_1", s = "_badge_cq24j_1", o = "_breadcrumbs_cq24j_1 _ds-breadcrumbs_z5gp5_1", c = "_button_cq24j_1 _ds-button_z5gp5_1", e = "_card_cq24j_1", a = "_info_cq24j_1", n = "_group_cq24j_1", d = "_chip_cq24j_1 _ds-chip_z5gp5_1", i = "_details_cq24j_1 _ds-details_z5gp5_1", r = "_dialog_cq24j_1 _ds-dialog_z5gp5_1", p = "_divider_cq24j_1", l = "_errorsummary_cq24j_1 _ds-error-summary_z5gp5_1", g = "__errorsummary_cq24j_1", j = "_field_cq24j_1 _ds-field_z5gp5_1", q = "_affixes_cq24j_1 _ds-field-affixes_z5gp5_1", b = "_fieldset_cq24j_1 _ds-fieldset_z5gp5_1", f = "_helptext_cq24j_1 _ds-focus_z5gp5_1", u = "_input_cq24j_1 _ds-input_z5gp5_1", z = "_app_cq24j_1", m = "_grid_cq24j_1", h = "_flex_cq24j_1", v = "_link_cq24j_1", x = "_logo_cq24j_1", y = "_pagination_cq24j_1 _ds-pagination_z5gp5_1", k = "_popover_cq24j_1", w = "_skeleton_cq24j_1 _ds-skeleton_z5gp5_1", S = "__skeleton_cq24j_1", A = "_spinner_cq24j_1", B = "_table_cq24j_1 _ds-table_z5gp5_1", C = "__scrollShadow_cq24j_1", D = "_tabs_cq24j_1 _ds-tabs_z5gp5_1", E = "_tag_cq24j_1 _ds-tag_z5gp5_1", F = "__tooltip_cq24j_1", G = "_heading_cq24j_1 _ds-heading_z5gp5_1", H = "_prose_cq24j_1", I = "_validation_cq24j_1 _ds-validation-message_z5gp5_1", J = "_body_cq24j_109", K = {
+const _ = "_alert_jsd43_1 _ds-alert_z5gp5_1", s = "_avatar_jsd43_1 _ds-avatar_z5gp5_1", o = "_badge_jsd43_1", t = "_breadcrumbs_jsd43_1 _ds-breadcrumbs_z5gp5_1", d = "_button_jsd43_1 _ds-button_z5gp5_1", e = "_card_jsd43_1", n = "_info_jsd43_1", a = "_group_jsd43_1", i = "_chip_jsd43_1 _ds-chip_z5gp5_1", r = "_details_jsd43_1 _ds-details_z5gp5_1", c = "_dialog_jsd43_1 _ds-dialog_z5gp5_1", l = "_divider_jsd43_1", p = "_errorsummary_jsd43_1 _ds-error-summary_z5gp5_1", g = "__errorsummary_jsd43_1", j = "_field_jsd43_1 _ds-field_z5gp5_1", b = "_affixes_jsd43_1 _ds-field-affixes_z5gp5_1", f = "_fieldset_jsd43_1 _ds-fieldset_z5gp5_1", u = "_heading_jsd43_1 _ds-heading_z5gp5_1", z = "_helptext_jsd43_1 _ds-focus_z5gp5_1", m = "_input_jsd43_1 _ds-input_z5gp5_1", h = "_app_jsd43_1", v = "_grid_jsd43_1", x = "_flex_jsd43_1", y = "_prose_jsd43_1", k = "_link_jsd43_1", I = "_logo_jsd43_1", w = "__onInjectLogo_jsd43_1", L = "_pagination_jsd43_1 _ds-pagination_z5gp5_1", S = "_popover_jsd43_1", T = "_skeleton_jsd43_1 _ds-skeleton_z5gp5_1", q = "__skeleton_jsd43_1", A = "_spinner_jsd43_1", B = "_table_jsd43_1 _ds-table_z5gp5_1", C = "__onInjectTable_jsd43_1", D = "__scrollShadow_jsd43_1", E = "_tabs_jsd43_1 _ds-tabs_z5gp5_1", F = "_tag_jsd43_1 _ds-tag_z5gp5_1", G = "__tooltip_jsd43_1", H = "_validation_jsd43_1 _ds-validation-message_z5gp5_1", J = "_body_jsd43_125", K = {
   alert: _,
-  avatar: t,
-  badge: s,
-  breadcrumbs: o,
-  button: c,
+  avatar: s,
+  badge: o,
+  breadcrumbs: t,
+  button: d,
   card: e,
-  info: a,
-  group: n,
-  chip: d,
-  details: i,
-  dialog: r,
-  divider: p,
-  errorsummary: l,
+  info: n,
+  group: a,
+  chip: i,
+  details: r,
+  dialog: c,
+  divider: l,
+  errorsummary: p,
   _errorsummary: g,
   field: j,
-  affixes: q,
-  fieldset: b,
-  helptext: f,
-  input: u,
-  app: z,
-  grid: m,
-  flex: h,
-  link: v,
-  logo: x,
-  pagination: y,
-  popover: k,
-  skeleton: w,
-  _skeleton: S,
+  affixes: b,
+  fieldset: f,
+  heading: u,
+  helptext: z,
+  input: m,
+  app: h,
+  grid: v,
+  flex: x,
+  prose: y,
+  link: k,
+  logo: I,
+  _onInjectLogo: w,
+  pagination: L,
+  popover: S,
+  skeleton: T,
+  _skeleton: q,
   spinner: A,
   table: B,
-  _scrollShadow: C,
-  tabs: D,
-  tag: E,
-  _tooltip: F,
-  heading: G,
-  prose: H,
-  validation: I,
+  _onInjectTable: C,
+  _scrollShadow: D,
+  tabs: E,
+  tag: F,
+  _tooltip: G,
+  validation: H,
   body: J
 };
 export {
   g as _errorsummary,
-  C as _scrollShadow,
-  S as _skeleton,
-  F as _tooltip,
-  q as affixes,
+  w as _onInjectLogo,
+  C as _onInjectTable,
+  D as _scrollShadow,
+  q as _skeleton,
+  G as _tooltip,
+  b as affixes,
   _ as alert,
-  z as app,
-  t as avatar,
-  s as badge,
+  h as app,
+  s as avatar,
+  o as badge,
   J as body,
-  o as breadcrumbs,
-  c as button,
+  t as breadcrumbs,
+  d as button,
   e as card,
-  d as chip,
+  i as chip,
   K as default,
-  i as details,
-  r as dialog,
-  p as divider,
-  l as errorsummary,
+  r as details,
+  c as dialog,
+  l as divider,
+  p as errorsummary,
   j as field,
-  b as fieldset,
-  h as flex,
-  m as grid,
-  n as group,
-  G as heading,
-  f as helptext,
-  a as info,
-  u as input,
-  v as link,
-  x as logo,
-  y as pagination,
-  k as popover,
-  H as prose,
-  w as skeleton,
+  f as fieldset,
+  x as flex,
+  v as grid,
+  a as group,
+  u as heading,
+  z as helptext,
+  n as info,
+  m as input,
+  k as link,
+  I as logo,
+  L as pagination,
+  S as popover,
+  y as prose,
+  T as skeleton,
   A as spinner,
   B as table,
-  D as tabs,
-  E as tag,
-  I as validation
+  E as tabs,
+  F as tag,
+  H as validation
 };
 //# sourceMappingURL=styles.module.css.js.map

package/mtds/styles.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"styles.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/mtds/table/table-observer.js

@@ -1,25 +1,23 @@
-import i from "../styles.module.css.js";
-import { onMutation as a, attr as o } from "../utils.js";
-const f = i.table.split(" ")[0];
-function p(r) {
-  for (const t of r) {
-    const n = [];
-    o(t, "role", "table"), t.caption && o(t.caption, "role", "caption");
-    for (const s of [t.tHead, t.tFoot, ...t.tBodies])
-      if (s) {
-        o(s, "role", "rowgroup");
-        const l = s.nodeName === "TBODY";
-        for (const c of s.rows) {
-          o(c, "role", "row");
-          for (const e of c.cells)
-            l ? o(e, "data-th", n[e.cellIndex] || ":empty") : n.push(e.innerText.trim()), e.nodeName === "TD" ? o(e, "role", "cell") : (o(e, "role", l ? "rowheader" : "columnheader"), o(e, "scope", l ? "row" : "col"));
-        }
+import f from "../styles.module.css.js";
+import { on as m, QUICK_EVENT as i, attr as o, off as d } from "../utils.js";
+function s(t) {
+  if (t.animationName !== f._onInjectTable) return;
+  const n = t.target, l = [];
+  o(n, "role", "table"), n.caption && o(n.caption, "role", "caption");
+  for (const r of [n.tHead, n.tFoot, ...n.tBodies])
+    if (r) {
+      o(r, "role", "rowgroup");
+      const a = r.nodeName === "TBODY";
+      for (const c of r.rows) {
+        o(c, "role", "row");
+        for (const e of c.cells)
+          a ? o(e, "data-th", l[e.cellIndex] || ":empty") : l.push(e.innerText.trim()), e.nodeName === "TD" ? o(e, "role", "cell") : (o(e, "role", a ? "rowheader" : "columnheader"), o(e, "scope", a ? "row" : "col"));
       }
-  }
+    }
 }
-const u = (r) => a(r, f, p), b = (r) => a(r, f, !1);
+const b = (t) => m(t, "animationend", s, i), h = (t) => d(t, "animationend", s, i);
 export {
-  u as observe,
-  b as unobserve
+  b as observe,
+  h as unobserve
 };
 //# sourceMappingURL=table-observer.js.map

package/mtds/table/table-observer.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-observer.js","sources":["../../designsystem/table/table-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport { attr, onMutation } from \"../utils\";\nconst CSS_TABLE = styles.table.split(\" \")[0];\n\nfunction process(tables: HTMLCollectionOf<Element>) {\n  for (const table of tables as HTMLCollectionOf<HTMLTableElement>) {\n    const ths: string[] = []; // Add data-th=\"\" to each cell to support data-mobile designs\n\n    attr(table, \"role\", \"table\"); // Add helping role=\"\" to ensure screen readers understand the table regardless of CSS display\n    if (table.caption) attr(table.caption, \"role\", \"caption\");\n    for (const group of [table.tHead, table.tFoot, ...table.tBodies])\n      if (group) {\n        attr(group, \"role\", \"rowgroup\");\n        const isTbody = group.nodeName === \"TBODY\";\n\n        for (const row of group.rows) {\n          attr(row, \"role\", \"row\");\n          for (const cell of row.cells) {\n            if (isTbody) attr(cell, \"data-th\", ths[cell.cellIndex] || \":empty\");\n            else ths.push(cell.innerText.trim()); // Using innerText to only include visible text\n            if (cell.nodeName === \"TD\") attr(cell, \"role\", \"cell\");\n            else {\n              attr(cell, \"role\", isTbody ? \"rowheader\" : \"columnheader\");\n              attr(cell, \"scope\", isTbody ? \"row\" : \"col\");\n            }\n          }\n        }\n      }\n  }\n}\n\nexport const observe = (el: Element) => onMutation(el, CSS_TABLE, process);\nexport const unobserve = (el: Element) => onMutation(el, CSS_TABLE, false);\n"],"names":["CSS_TABLE","styles","process","tables","table","ths","attr","group","isTbody","row","cell","observe","el","onMutation","unobserve"],"mappings":";;AAEA,MAAMA,IAAYC,EAAO,MAAM,MAAM,GAAG,EAAE,CAAC;AAE3C,SAASC,EAAQC,GAAmC;AAClD,aAAWC,KAASD,GAA8C;AAChE,UAAME,IAAgB,CAAC;AAElB,IAAAC,EAAAF,GAAO,QAAQ,OAAO,GACvBA,EAAM,WAASE,EAAKF,EAAM,SAAS,QAAQ,SAAS;AAC7C,eAAAG,KAAS,CAACH,EAAM,OAAOA,EAAM,OAAO,GAAGA,EAAM,OAAO;AAC7D,UAAIG,GAAO;AACJ,QAAAD,EAAAC,GAAO,QAAQ,UAAU;AACxB,cAAAC,IAAUD,EAAM,aAAa;AAExB,mBAAAE,KAAOF,EAAM,MAAM;AACvB,UAAAD,EAAAG,GAAK,QAAQ,KAAK;AACZ,qBAAAC,KAAQD,EAAI;AACjB,YAAAD,MAAcE,GAAM,WAAWL,EAAIK,EAAK,SAAS,KAAK,QAAQ,IACzDL,EAAA,KAAKK,EAAK,UAAU,MAAM,GAC/BA,EAAK,aAAa,OAAWJ,EAAAI,GAAM,QAAQ,MAAM,KAEnDJ,EAAKI,GAAM,QAAQF,IAAU,cAAc,cAAc,GACzDF,EAAKI,GAAM,SAASF,IAAU,QAAQ,KAAK;AAAA,QAE/C;AAAA,MACF;AAAA,EACF;AAEN;AAEO,MAAMG,IAAU,CAACC,MAAgBC,EAAWD,GAAIZ,GAAWE,CAAO,GAC5DY,IAAY,CAACF,MAAgBC,EAAWD,GAAIZ,GAAW,EAAK;"}
+{"version":3,"file":"table-observer.js","sources":["../../designsystem/table/table-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport { QUICK_EVENT, attr, off, on } from \"../utils\";\n\nfunction handleInject(event: Event & { animationName?: string }) {\n  if (event.animationName !== styles._onInjectTable) return;\n  const table = event.target as HTMLTableElement;\n  const ths: string[] = []; // Add data-th=\"\" to each cell to support data-mobile designs\n\n  attr(table, \"role\", \"table\"); // Add helping role=\"\" to ensure screen readers understand the table regardless of CSS display\n  if (table.caption) attr(table.caption, \"role\", \"caption\");\n  for (const group of [table.tHead, table.tFoot, ...table.tBodies])\n    if (group) {\n      attr(group, \"role\", \"rowgroup\");\n      const isTbody = group.nodeName === \"TBODY\";\n\n      for (const row of group.rows) {\n        attr(row, \"role\", \"row\");\n        for (const cell of row.cells) {\n          if (isTbody) attr(cell, \"data-th\", ths[cell.cellIndex] || \":empty\");\n          else ths.push(cell.innerText.trim()); // Using innerText to only include visible text\n          if (cell.nodeName === \"TD\") attr(cell, \"role\", \"cell\");\n          else {\n            attr(cell, \"role\", isTbody ? \"rowheader\" : \"columnheader\");\n            attr(cell, \"scope\", isTbody ? \"row\" : \"col\");\n          }\n        }\n      }\n    }\n}\n\nexport const observe = (el: Element) => on(el, 'animationend', handleInject, QUICK_EVENT);\nexport const unobserve = (el: Element) => off(el, 'animationend', handleInject, QUICK_EVENT);\n"],"names":["handleInject","event","styles","table","ths","attr","group","isTbody","row","cell","observe","el","on","QUICK_EVENT","unobserve","off"],"mappings":";;AAGA,SAASA,EAAaC,GAA2C;AAC3D,MAAAA,EAAM,kBAAkBC,EAAO,eAAgB;AACnD,QAAMC,IAAQF,EAAM,QACdG,IAAgB,CAAC;AAElB,EAAAC,EAAAF,GAAO,QAAQ,OAAO,GACvBA,EAAM,WAASE,EAAKF,EAAM,SAAS,QAAQ,SAAS;AAC7C,aAAAG,KAAS,CAACH,EAAM,OAAOA,EAAM,OAAO,GAAGA,EAAM,OAAO;AAC7D,QAAIG,GAAO;AACJ,MAAAD,EAAAC,GAAO,QAAQ,UAAU;AACxB,YAAAC,IAAUD,EAAM,aAAa;AAExB,iBAAAE,KAAOF,EAAM,MAAM;AACvB,QAAAD,EAAAG,GAAK,QAAQ,KAAK;AACZ,mBAAAC,KAAQD,EAAI;AACjB,UAAAD,MAAcE,GAAM,WAAWL,EAAIK,EAAK,SAAS,KAAK,QAAQ,IACzDL,EAAA,KAAKK,EAAK,UAAU,MAAM,GAC/BA,EAAK,aAAa,OAAWJ,EAAAI,GAAM,QAAQ,MAAM,KAEnDJ,EAAKI,GAAM,QAAQF,IAAU,cAAc,cAAc,GACzDF,EAAKI,GAAM,SAASF,IAAU,QAAQ,KAAK;AAAA,MAE/C;AAAA,IACF;AAEN;AAEO,MAAMG,IAAU,CAACC,MAAgBC,EAAGD,GAAI,gBAAgBX,GAAca,CAAW,GAC3EC,IAAY,CAACH,MAAgBI,EAAIJ,GAAI,gBAAgBX,GAAca,CAAW;"}

package/mtds/tabs/tabs.js

@@ -2,7 +2,6 @@ import { jsx as n } from "react/jsx-runtime";
 import { clsx as b } from "../external/clsx/dist/clsx.js";
 import { forwardRef as o } from "react";
 import c from "../styles.module.css.js";
-import "../external/@u-elements/u-tabs/dist/u-tabs.js";
 const i = o(function({ className: s, ...t }, a) {
   return /* @__PURE__ */ n("u-tabs", { class: b(c.tabs, s), ref: a, ...t });
 }), e = o(
@@ -17,12 +16,12 @@ const i = o(function({ className: s, ...t }, a) {
   function({ className: s, ...t }, a) {
     return /* @__PURE__ */ n("u-tab", { class: s, ref: a, ...t });
   }
-), L = Object.assign(i, {
+), x = Object.assign(i, {
   List: e,
   Panel: u,
   Tab: T
 });
 export {
-  L as Tabs
+  x as Tabs
 };
 //# sourceMappingURL=tabs.js.map

package/mtds/tabs/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sources":["../../designsystem/tabs/tabs.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef } from \"react\";\nimport styles from \"../styles.module.css\";\nimport \"@u-elements/u-tabs\";\nimport type * as UTabs from \"@u-elements/u-tabs\";\n\nexport type TabsProps = UTabs.ReactUtabs;\nconst TabsComp = forwardRef<UTabs.UHTMLTabsElement, TabsProps>(function Tabs(\n\t{ className, ...rest },\n\tref,\n) {\n\treturn <u-tabs class={clsx(styles.tabs, className)} ref={ref} {...rest} />;\n});\n\nexport type TabsListProps = UTabs.ReactUtablist;\nconst TabsList = forwardRef<UTabs.UHTMLTabListElement, TabsListProps>(\n\tfunction TabsList({ className, ...rest }, ref) {\n\t\treturn <u-tablist class={className} ref={ref} {...rest} />;\n\t},\n);\n\nexport type TabsPanelProps = UTabs.ReactUtabpanel;\nconst TabsPanel = forwardRef<UTabs.UHTMLTabPanelElement, TabsPanelProps>(\n\tfunction TabsPanel({ className, ...rest }, ref) {\n\t\treturn <u-tabpanel class={className} ref={ref} {...rest} />;\n\t},\n);\n\nexport type TabsTabProps = UTabs.ReactUtab;\nconst TabsTab = forwardRef<UTabs.UHTMLTabElement, TabsTabProps>(\n\tfunction TabsTab({ className, ...rest }, ref) {\n\t\treturn <u-tab class={className} ref={ref} {...rest} />;\n\t},\n);\n\nexport const Tabs = Object.assign(TabsComp, {\n\tList: TabsList,\n\tPanel: TabsPanel,\n\tTab: TabsTab,\n});\n"],"names":["TabsComp","forwardRef","className","rest","ref","jsx","clsx","styles","TabsList","TabsPanel","TabsTab","Tabs"],"mappings":";;;;;AAOA,MAAMA,IAAWC,EAA8C,SAC9D,EAAE,WAAAC,GAAW,GAAGC,EAAK,GACrBC,GACC;AACM,SAAA,gBAAAC,EAAC,UAAO,EAAA,OAAOC,EAAKC,EAAO,MAAML,CAAS,GAAG,KAAAE,GAAW,GAAGD,EAAM,CAAA;AACzE,CAAC,GAGKK,IAAWP;AAAA,EAChB,SAAkB,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAAQC,GAAK;AAC9C,6BAAQ,aAAU,EAAA,OAAOF,GAAW,KAAAE,GAAW,GAAGD,GAAM;AAAA,EAAA;AAE1D,GAGMM,IAAYR;AAAA,EACjB,SAAmB,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAAQC,GAAK;AAC/C,6BAAQ,cAAW,EAAA,OAAOF,GAAW,KAAAE,GAAW,GAAGD,GAAM;AAAA,EAAA;AAE3D,GAGMO,IAAUT;AAAA,EACf,SAAiB,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAAQC,GAAK;AAC7C,6BAAQ,SAAM,EAAA,OAAOF,GAAW,KAAAE,GAAW,GAAGD,GAAM;AAAA,EAAA;AAEtD,GAEaQ,IAAO,OAAO,OAAOX,GAAU;AAAA,EAC3C,MAAMQ;AAAA,EACN,OAAOC;AAAA,EACP,KAAKC;AACN,CAAC;"}
+{"version":3,"file":"tabs.js","sources":["../../designsystem/tabs/tabs.tsx"],"sourcesContent":["import type * as UTabs from \"@u-elements/u-tabs\";\nimport clsx from \"clsx\";\nimport { forwardRef } from \"react\";\nimport styles from \"../styles.module.css\";\n\nexport type TabsProps = UTabs.ReactUtabs;\nconst TabsComp = forwardRef<UTabs.UHTMLTabsElement, TabsProps>(function Tabs(\n\t{ className, ...rest },\n\tref,\n) {\n\treturn <u-tabs class={clsx(styles.tabs, className)} ref={ref} {...rest} />;\n});\n\nexport type TabsListProps = UTabs.ReactUtablist;\nconst TabsList = forwardRef<UTabs.UHTMLTabListElement, TabsListProps>(\n\tfunction TabsList({ className, ...rest }, ref) {\n\t\treturn <u-tablist class={className} ref={ref} {...rest} />;\n\t},\n);\n\nexport type TabsPanelProps = UTabs.ReactUtabpanel;\nconst TabsPanel = forwardRef<UTabs.UHTMLTabPanelElement, TabsPanelProps>(\n\tfunction TabsPanel({ className, ...rest }, ref) {\n\t\treturn <u-tabpanel class={className} ref={ref} {...rest} />;\n\t},\n);\n\nexport type TabsTabProps = UTabs.ReactUtab;\nconst TabsTab = forwardRef<UTabs.UHTMLTabElement, TabsTabProps>(\n\tfunction TabsTab({ className, ...rest }, ref) {\n\t\treturn <u-tab class={className} ref={ref} {...rest} />;\n\t},\n);\n\nexport const Tabs = Object.assign(TabsComp, {\n\tList: TabsList,\n\tPanel: TabsPanel,\n\tTab: TabsTab,\n});\n"],"names":["TabsComp","forwardRef","className","rest","ref","jsx","clsx","styles","TabsList","TabsPanel","TabsTab","Tabs"],"mappings":";;;;AAMA,MAAMA,IAAWC,EAA8C,SAC9D,EAAE,WAAAC,GAAW,GAAGC,EAAK,GACrBC,GACC;AACM,SAAA,gBAAAC,EAAC,UAAO,EAAA,OAAOC,EAAKC,EAAO,MAAML,CAAS,GAAG,KAAAE,GAAW,GAAGD,EAAM,CAAA;AACzE,CAAC,GAGKK,IAAWP;AAAA,EAChB,SAAkB,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAAQC,GAAK;AAC9C,6BAAQ,aAAU,EAAA,OAAOF,GAAW,KAAAE,GAAW,GAAGD,GAAM;AAAA,EAAA;AAE1D,GAGMM,IAAYR;AAAA,EACjB,SAAmB,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAAQC,GAAK;AAC/C,6BAAQ,cAAW,EAAA,OAAOF,GAAW,KAAAE,GAAW,GAAGD,GAAM;AAAA,EAAA;AAE3D,GAGMO,IAAUT;AAAA,EACf,SAAiB,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAAQC,GAAK;AAC7C,6BAAQ,SAAM,EAAA,OAAOF,GAAW,KAAAE,GAAW,GAAGD,GAAM;AAAA,EAAA;AAEtD,GAEaQ,IAAO,OAAO,OAAOX,GAAU;AAAA,EAC3C,MAAMQ;AAAA,EACN,OAAOC;AAAA,EACP,KAAKC;AACN,CAAC;"}

package/mtds/tailwind.css

@@ -44,7 +44,6 @@
 	--color-info-background-tinted: var(--mtds-color-info-background-tinted);
 	--color-info-base-active: var(--mtds-color-info-base-active);
 	--color-info-base-contrast-default: var(--mtds-color-info-base-contrast-default);
-	--color-info-base-contrast-default : var(--mtds-color-info-base-contrast-default );
 	--color-info-base-contrast-subtle: var(--mtds-color-info-base-contrast-subtle);
 	--color-info-base-default: var(--mtds-color-info-base-default);
 	--color-info-base-hover: var(--mtds-color-info-base-hover);
@@ -131,4 +130,22 @@
 	--font-weight-medium: var(--mtds-font-weight-medium);
 	--font-weight-regular: var(--mtds-font-weight-regular);
 	--font-weight-semibold: var(--mtds-font-weight-semibold);
-}
+}
+[data-color] {
+      --color-background-default: var(--mtds-color-background-default);
+      --color-background-tinted: var(--mtds-color-background-tinted);
+      --color-surface-default: var(--mtds-color-surface-default);
+      --color-surface-tinted: var(--mtds-color-surface-tinted);
+      --color-surface-hover: var(--mtds-color-surface-hover);
+      --color-surface-active: var(--mtds-color-surface-active);
+      --color-border-subtle: var(--mtds-color-border-subtle);
+      --color-border-default: var(--mtds-color-border-default);
+      --color-border-strong: var(--mtds-color-border-strong);
+      --color-text-subtle: var(--mtds-color-text-subtle);
+      --color-text-default: var(--mtds-color-text-default);
+      --color-base-default: var(--mtds-color-base-default);
+      --color-base-hover: var(--mtds-color-base-hover);
+      --color-base-active: var(--mtds-color-base-active);
+      --color-base-contrast-subtle: var(--mtds-color-base-contrast-subtle);
+      --color-base-contrast-default: var(--mtds-color-base-contrast-default);
+    }

package/mtds/toast/toast-observer.d.ts

@@ -0,0 +1,2 @@
+export declare const observe: (el: Element) => void;
+export declare const unobserve: (el: Element) => void;

package/mtds/toast/toast.d.ts

@@ -0,0 +1,2 @@
+export type ToastProps = React.ComponentPropsWithoutRef<"dialog">;
+export declare const Toast: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.DialogHTMLAttributes<HTMLDialogElement>, HTMLDialogElement>, "ref"> & React.RefAttributes<HTMLDialogElement>>;

package/mtds/tooltip/tooltip-observer.js

@@ -1,25 +1,25 @@
-import w from "../styles.module.css.js";
-import { IS_BROWSER as O, attr as l, on as a, QUICK_EVENT as c, anchorPosition as p } from "../utils.js";
-const S = w._tooltip.split(" "), r = "aria-describedby", E = "Escape", d = "aria-labelledby", _ = "--mtds-tooltip-position", y = 300, u = "mtds-tooltip";
-let e = null, f = Number.NEGATIVE_INFINITY, b = 0, o = null;
+import O from "../styles.module.css.js";
+import { IS_BROWSER as S, attr as l, on as a, QUICK_EVENT as c, anchorPosition as r } from "../utils.js";
+const _ = O._tooltip.split(" "), E = "aria-describedby", b = "Escape", d = "aria-labelledby", y = "--mtds-tooltip-position", P = 300, u = "mtds-tooltip";
+let e = null, L = Number.NEGATIVE_INFINITY, f = 0, o = null;
 function m({ target: n, type: t, key: i }) {
-  if (t === "keydown" && i !== E) return;
-  const s = f + y - Date.now();
-  clearTimeout(b), b = setTimeout(
-    P,
+  if (t === "keydown" && i !== b) return;
+  const s = L + P - Date.now();
+  clearTimeout(f), f = setTimeout(
+    C,
     Math.max(s, 0),
-    i === E ? null : n
+    i === b ? null : n
   );
 }
-function P(n) {
-  var T;
-  if (f = Date.now(), !o || n === o) return;
+function C(n) {
+  var T, p;
+  if (L = Date.now(), !o || n === o) return;
   let t = ((T = n == null ? void 0 : n.closest) == null ? void 0 : T.call(n, "[data-tooltip]")) || null;
   if (t === e) return;
-  const i = t && l(t, "data-tooltip") || "", s = t && l(t, "data-tooltip-position") || window.getComputedStyle(t || document.body).getPropertyValue(_) || "top";
+  const i = t && l(t, "data-tooltip") || "", s = t && l(t, "data-tooltip-position") || ((p = window.getComputedStyle(t || document.body).getPropertyValue(y)) == null ? void 0 : p.trim()) || "top";
   (!i || i === "false" || i === "true" || s === "none") && (t = null), t && (o.textContent = i);
-  const L = e && l(e, d) === u, I = !!(t != null && t.innerText.trim()) || (t == null ? void 0 : t.hasAttribute(d)) || (t == null ? void 0 : t.hasAttribute("aria-label"));
-  e == null || e.removeAttribute(L ? d : r), p(o, !1), e = t, e && l(e, I ? r : d, u), o.togglePopover(!!t), p(o, t || !1, s);
+  const I = e && l(e, d) === u, w = !!(t != null && t.innerText.trim()) || (t == null ? void 0 : t.hasAttribute(d)) || (t == null ? void 0 : t.hasAttribute("aria-label"));
+  e == null || e.removeAttribute(I ? d : E), r(o, !1), e = t, e && l(e, w ? E : d, u), o.togglePopover(!!t), r(o, t || !1, s);
 }
-O && !document.getElementById(u) && (o = document.body.appendChild(document.createElement("div")), o.classList.add(...S), o.id = u, l(o, "popover", "manual"), a(document, "blur,focus,mouseout,mouseover", m, c), a(window, "keydown", m, c), a(window, "blur", m, c));
+S && !document.getElementById(u) && (o = document.body.appendChild(document.createElement("div")), o.classList.add(..._), o.id = u, l(o, "popover", "manual"), a(document, "blur,focus,mouseout,mouseover", m, c), a(window, "keydown", m, c), a(window, "blur", m, c));
 //# sourceMappingURL=tooltip-observer.js.map

package/mtds/tooltip/tooltip-observer.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip-observer.js","sources":["../../designsystem/tooltip/tooltip-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport { IS_BROWSER, QUICK_EVENT, anchorPosition, attr, on } from \"../utils\";\n\nconst CSS_TOOLTIP = styles._tooltip.split(\" \");\nconst DESCRIBEDBY = \"aria-describedby\";\nconst ESC = \"Escape\";\nconst LABELLEDBY = \"aria-labelledby\";\nconst POSITION_CSS_PROPERTY = \"--mtds-tooltip-position\";\nconst THROTTLE_DELAY = 300;\nconst TOOLTIP_ID = \"mtds-tooltip\";\n\nlet ANCHOR: HTMLElement | null = null;\nlet LAST_CALL = Number.NEGATIVE_INFINITY;\nlet THROTTLE: number | ReturnType<typeof setTimeout> = 0;\nlet TOOLTIP: HTMLElement | null = null;\n\nfunction handleMove({ target, type, key }: Event & { key?: string }) {\n  if (type === \"keydown\" && key !== ESC) return; // Allow ESC dismiss to follow https://www.w3.org/WAI/ARIA/apg/patterns/tooltip/\n  const wait = LAST_CALL + THROTTLE_DELAY - Date.now();\n  clearTimeout(THROTTLE);\n  THROTTLE = setTimeout(\n    handleMoveThrottled,\n    Math.max(wait, 0),\n    key === ESC ? null : target\n  );\n}\n\n// Using a throttled function to avoid performance issues\nfunction handleMoveThrottled(target: Element | null) {\n  LAST_CALL = Date.now();\n\n  if (!TOOLTIP || target === TOOLTIP) return; // Allow tooltip to be hovered, following https://www.w3.org/TR/WCAG21/#content-on-hover-or-focus\n  let anchor = target?.closest?.<HTMLElement>(\"[data-tooltip]\") || null;\n\n  // No need to update\n  if (anchor === ANCHOR) return;\n\n  const content = (anchor && attr(anchor, \"data-tooltip\")) || \"\";\n  const position =\n    (anchor && attr(anchor, \"data-tooltip-position\")) ||\n    window\n      .getComputedStyle(anchor || document.body)\n      .getPropertyValue(POSITION_CSS_PROPERTY) ||\n    \"top\";\n\n  const isHidden =\n    !content ||\n    content === \"false\" ||\n    content === \"true\" ||\n    position === \"none\";\n\n  if (isHidden) anchor = null; // Do not show tooltip if boolish value\n  if (anchor) TOOLTIP.textContent = content; // Only update content if new anchor\n\n  const hadLabel = ANCHOR && attr(ANCHOR, LABELLEDBY) === TOOLTIP_ID;\n  const hasLabel =\n    Boolean(anchor?.innerText.trim()) ||\n    anchor?.hasAttribute(LABELLEDBY) ||\n    anchor?.hasAttribute(\"aria-label\");\n\n  ANCHOR?.removeAttribute(hadLabel ? LABELLEDBY : DESCRIBEDBY); // Unlink previous anchor\n  anchorPosition(TOOLTIP, false); // Reset anchor position\n\n  ANCHOR = anchor; // Store new anchor - might be null if no new anchor\n  if (ANCHOR) attr(ANCHOR, hasLabel ? DESCRIBEDBY : LABELLEDBY, TOOLTIP_ID); // Use tooltip as description if allready has label\n  TOOLTIP.togglePopover(!!anchor);\n  anchorPosition(TOOLTIP, anchor || false, position);\n}\n\n// Initialize if in browser and not already initialized\nif (IS_BROWSER && !document.getElementById(TOOLTIP_ID)) {\n  TOOLTIP = document.body.appendChild(document.createElement(\"div\"));\n  TOOLTIP.classList.add(...CSS_TOOLTIP);\n  TOOLTIP.id = TOOLTIP_ID;\n  attr(TOOLTIP, \"popover\", \"manual\");\n  on(document, \"blur,focus,mouseout,mouseover\", handleMove, QUICK_EVENT);\n  on(window, \"keydown\", handleMove, QUICK_EVENT);\n  on(window, \"blur\", handleMove, QUICK_EVENT);\n}\n"],"names":["CSS_TOOLTIP","styles","DESCRIBEDBY","ESC","LABELLEDBY","POSITION_CSS_PROPERTY","THROTTLE_DELAY","TOOLTIP_ID","ANCHOR","LAST_CALL","THROTTLE","TOOLTIP","handleMove","target","type","key","wait","handleMoveThrottled","anchor","_a","content","attr","position","hadLabel","hasLabel","anchorPosition","IS_BROWSER","on","QUICK_EVENT"],"mappings":";;AAGA,MAAMA,IAAcC,EAAO,SAAS,MAAM,GAAG,GACvCC,IAAc,oBACdC,IAAM,UACNC,IAAa,mBACbC,IAAwB,2BACxBC,IAAiB,KACjBC,IAAa;AAEnB,IAAIC,IAA6B,MAC7BC,IAAY,OAAO,mBACnBC,IAAmD,GACnDC,IAA8B;AAElC,SAASC,EAAW,EAAE,QAAAC,GAAQ,MAAAC,GAAM,KAAAC,KAAiC;AAC/D,MAAAD,MAAS,aAAaC,MAAQZ,EAAK;AACvC,QAAMa,IAAOP,IAAYH,IAAiB,KAAK,IAAI;AACnD,eAAaI,CAAQ,GACVA,IAAA;AAAA,IACTO;AAAA,IACA,KAAK,IAAID,GAAM,CAAC;AAAA,IAChBD,MAAQZ,IAAM,OAAOU;AAAA,EACvB;AACF;AAGA,SAASI,EAAoBJ,GAAwB;;AAG/C,MAFJJ,IAAY,KAAK,IAAI,GAEjB,CAACE,KAAWE,MAAWF,EAAS;AACpC,MAAIO,MAASC,IAAAN,KAAA,gBAAAA,EAAQ,YAAR,gBAAAM,EAAA,KAAAN,GAA+B,sBAAqB;AAGjE,MAAIK,MAAWV,EAAQ;AAEvB,QAAMY,IAAWF,KAAUG,EAAKH,GAAQ,cAAc,KAAM,IACtDI,IACHJ,KAAUG,EAAKH,GAAQ,uBAAuB,KAC/C,OACG,iBAAiBA,KAAU,SAAS,IAAI,EACxC,iBAAiBb,CAAqB,KACzC;AAQF,GALE,CAACe,KACDA,MAAY,WACZA,MAAY,UACZE,MAAa,YAEQJ,IAAA,OACnBA,QAAgB,cAAcE;AAElC,QAAMG,IAAWf,KAAUa,EAAKb,GAAQJ,CAAU,MAAMG,GAClDiB,IACJ,GAAQN,KAAA,QAAAA,EAAQ,UAAU,YAC1BA,KAAA,gBAAAA,EAAQ,aAAad,QACrBc,KAAA,gBAAAA,EAAQ,aAAa;AAEf,EAAAV,KAAA,QAAAA,EAAA,gBAAgBe,IAAWnB,IAAaF,IAChDuB,EAAed,GAAS,EAAK,GAEpBH,IAAAU,GACLV,KAAaa,EAAAb,GAAQgB,IAAWtB,IAAcE,GAAYG,CAAU,GAChEI,EAAA,cAAc,CAAC,CAACO,CAAM,GACfO,EAAAd,GAASO,KAAU,IAAOI,CAAQ;AACnD;AAGII,KAAc,CAAC,SAAS,eAAenB,CAAU,MACnDI,IAAU,SAAS,KAAK,YAAY,SAAS,cAAc,KAAK,CAAC,GACzDA,EAAA,UAAU,IAAI,GAAGX,CAAW,GACpCW,EAAQ,KAAKJ,GACRc,EAAAV,GAAS,WAAW,QAAQ,GAC9BgB,EAAA,UAAU,iCAAiCf,GAAYgB,CAAW,GAClED,EAAA,QAAQ,WAAWf,GAAYgB,CAAW,GAC1CD,EAAA,QAAQ,QAAQf,GAAYgB,CAAW;"}
+{"version":3,"file":"tooltip-observer.js","sources":["../../designsystem/tooltip/tooltip-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport { IS_BROWSER, QUICK_EVENT, anchorPosition, attr, on } from \"../utils\";\n\nconst CSS_TOOLTIP = styles._tooltip.split(\" \");\nconst DESCRIBEDBY = \"aria-describedby\";\nconst ESC = \"Escape\";\nconst LABELLEDBY = \"aria-labelledby\";\nconst POSITION_CSS_PROPERTY = \"--mtds-tooltip-position\";\nconst THROTTLE_DELAY = 300;\nconst TOOLTIP_ID = \"mtds-tooltip\";\n\nlet ANCHOR: HTMLElement | null = null;\nlet LAST_CALL = Number.NEGATIVE_INFINITY;\nlet THROTTLE: number | ReturnType<typeof setTimeout> = 0;\nlet TOOLTIP: HTMLElement | null = null;\n\nfunction handleMove({ target, type, key }: Event & { key?: string }) {\n  if (type === \"keydown\" && key !== ESC) return; // Allow ESC dismiss to follow https://www.w3.org/WAI/ARIA/apg/patterns/tooltip/\n  const wait = LAST_CALL + THROTTLE_DELAY - Date.now();\n  clearTimeout(THROTTLE);\n  THROTTLE = setTimeout(\n    handleMoveThrottled,\n    Math.max(wait, 0),\n    key === ESC ? null : target\n  );\n}\n\n// Using a throttled function to avoid performance issues\nfunction handleMoveThrottled(target: Element | null) {\n  LAST_CALL = Date.now();\n\n  if (!TOOLTIP || target === TOOLTIP) return; // Allow tooltip to be hovered, following https://www.w3.org/TR/WCAG21/#content-on-hover-or-focus\n  let anchor = target?.closest?.<HTMLElement>(\"[data-tooltip]\") || null;\n\n  // No need to update\n  if (anchor === ANCHOR) return;\n\n  const content = (anchor && attr(anchor, \"data-tooltip\")) || \"\";\n  const position =\n    (anchor && attr(anchor, \"data-tooltip-position\")) ||\n    window\n      .getComputedStyle(anchor || document.body)\n      .getPropertyValue(POSITION_CSS_PROPERTY)?.trim() ||\n    \"top\";\n\n  const isHidden =\n    !content ||\n    content === \"false\" ||\n    content === \"true\" ||\n    position === \"none\";\n\n  if (isHidden) anchor = null; // Do not show tooltip if boolish value\n  if (anchor) TOOLTIP.textContent = content; // Only update content if new anchor\n\n  const hadLabel = ANCHOR && attr(ANCHOR, LABELLEDBY) === TOOLTIP_ID;\n  const hasLabel =\n    Boolean(anchor?.innerText.trim()) ||\n    anchor?.hasAttribute(LABELLEDBY) ||\n    anchor?.hasAttribute(\"aria-label\");\n\n  ANCHOR?.removeAttribute(hadLabel ? LABELLEDBY : DESCRIBEDBY); // Unlink previous anchor\n  anchorPosition(TOOLTIP, false); // Reset anchor position\n\n  ANCHOR = anchor; // Store new anchor - might be null if no new anchor\n  if (ANCHOR) attr(ANCHOR, hasLabel ? DESCRIBEDBY : LABELLEDBY, TOOLTIP_ID); // Use tooltip as description if allready has label\n  TOOLTIP.togglePopover(!!anchor);\n  anchorPosition(TOOLTIP, anchor || false, position);\n}\n\n// Initialize if in browser and not already initialized\nif (IS_BROWSER && !document.getElementById(TOOLTIP_ID)) {\n  TOOLTIP = document.body.appendChild(document.createElement(\"div\"));\n  TOOLTIP.classList.add(...CSS_TOOLTIP);\n  TOOLTIP.id = TOOLTIP_ID;\n  attr(TOOLTIP, \"popover\", \"manual\");\n  on(document, \"blur,focus,mouseout,mouseover\", handleMove, QUICK_EVENT);\n  on(window, \"keydown\", handleMove, QUICK_EVENT);\n  on(window, \"blur\", handleMove, QUICK_EVENT);\n}\n"],"names":["CSS_TOOLTIP","styles","DESCRIBEDBY","ESC","LABELLEDBY","POSITION_CSS_PROPERTY","THROTTLE_DELAY","TOOLTIP_ID","ANCHOR","LAST_CALL","THROTTLE","TOOLTIP","handleMove","target","type","key","wait","handleMoveThrottled","anchor","_a","content","attr","position","_b","hadLabel","hasLabel","anchorPosition","IS_BROWSER","on","QUICK_EVENT"],"mappings":";;AAGA,MAAMA,IAAcC,EAAO,SAAS,MAAM,GAAG,GACvCC,IAAc,oBACdC,IAAM,UACNC,IAAa,mBACbC,IAAwB,2BACxBC,IAAiB,KACjBC,IAAa;AAEnB,IAAIC,IAA6B,MAC7BC,IAAY,OAAO,mBACnBC,IAAmD,GACnDC,IAA8B;AAElC,SAASC,EAAW,EAAE,QAAAC,GAAQ,MAAAC,GAAM,KAAAC,KAAiC;AAC/D,MAAAD,MAAS,aAAaC,MAAQZ,EAAK;AACvC,QAAMa,IAAOP,IAAYH,IAAiB,KAAK,IAAI;AACnD,eAAaI,CAAQ,GACVA,IAAA;AAAA,IACTO;AAAA,IACA,KAAK,IAAID,GAAM,CAAC;AAAA,IAChBD,MAAQZ,IAAM,OAAOU;AAAA,EACvB;AACF;AAGA,SAASI,EAAoBJ,GAAwB;;AAG/C,MAFJJ,IAAY,KAAK,IAAI,GAEjB,CAACE,KAAWE,MAAWF,EAAS;AACpC,MAAIO,MAASC,IAAAN,KAAA,gBAAAA,EAAQ,YAAR,gBAAAM,EAAA,KAAAN,GAA+B,sBAAqB;AAGjE,MAAIK,MAAWV,EAAQ;AAEvB,QAAMY,IAAWF,KAAUG,EAAKH,GAAQ,cAAc,KAAM,IACtDI,IACHJ,KAAUG,EAAKH,GAAQ,uBAAuB,OAC/CK,IAAA,OACG,iBAAiBL,KAAU,SAAS,IAAI,EACxC,iBAAiBb,CAAqB,MAFzC,gBAAAkB,EAE4C,WAC5C;AAQF,GALE,CAACH,KACDA,MAAY,WACZA,MAAY,UACZE,MAAa,YAEQJ,IAAA,OACnBA,QAAgB,cAAcE;AAElC,QAAMI,IAAWhB,KAAUa,EAAKb,GAAQJ,CAAU,MAAMG,GAClDkB,IACJ,GAAQP,KAAA,QAAAA,EAAQ,UAAU,YAC1BA,KAAA,gBAAAA,EAAQ,aAAad,QACrBc,KAAA,gBAAAA,EAAQ,aAAa;AAEf,EAAAV,KAAA,QAAAA,EAAA,gBAAgBgB,IAAWpB,IAAaF,IAChDwB,EAAef,GAAS,EAAK,GAEpBH,IAAAU,GACLV,KAAaa,EAAAb,GAAQiB,IAAWvB,IAAcE,GAAYG,CAAU,GAChEI,EAAA,cAAc,CAAC,CAACO,CAAM,GACfQ,EAAAf,GAASO,KAAU,IAAOI,CAAQ;AACnD;AAGIK,KAAc,CAAC,SAAS,eAAepB,CAAU,MACnDI,IAAU,SAAS,KAAK,YAAY,SAAS,cAAc,KAAK,CAAC,GACzDA,EAAA,UAAU,IAAI,GAAGX,CAAW,GACpCW,EAAQ,KAAKJ,GACRc,EAAAV,GAAS,WAAW,QAAQ,GAC9BiB,EAAA,UAAU,iCAAiChB,GAAYiB,CAAW,GAClED,EAAA,QAAQ,WAAWhB,GAAYiB,CAAW,GAC1CD,EAAA,QAAQ,QAAQhB,GAAYiB,CAAW;"}

package/mtds/utils.js

@@ -1,32 +1,32 @@
-const w = typeof window < "u" && typeof document < "u", U = { capture: !0, passive: !0 };
+const b = typeof window < "u" && typeof document < "u", U = { capture: !0, passive: !0 };
 function C(t, e, o) {
   return o === void 0 ? t.getAttribute(e) ?? null : (o === null ? t.removeAttribute(e) : t.getAttribute(e) !== o && t.setAttribute(e, o), null);
 }
 let E = 0;
 const O = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;
-function X(t) {
+function P(t) {
   return t.id || (t.id = `${O}${++E}`), t.id;
 }
-const b = (t, e, o) => {
+const w = (t, e, o) => {
   for (const i of o[0].split(","))
     o[0] = i, e[`${t}EventListener`](...o);
-}, B = (t, ...e) => b("add", t, e), Y = (t, ...e) => b("remove", t, e), a = /* @__PURE__ */ new Map(), s = w ? document.createElement("div") : null;
+}, B = (t, ...e) => w("add", t, e), X = (t, ...e) => w("remove", t, e), l = /* @__PURE__ */ new Map(), s = b ? document.createElement("div") : null;
 s && C(s, "style", "position:absolute;padding:1px;top:0;left:0px");
-w && B(window, "load,resize,scroll", () => {
-  for (const [t, e] of a) e();
+b && B(window, "load,resize,scroll", () => {
+  for (const [t, e] of l) e();
 }, U);
 const d = { top: 0, right: 1, bottom: 2, left: 3 };
 function _(t, e, o) {
   var p;
-  if (e === !1 || !e.isConnected || !t.isConnected) return a.delete(t);
-  if (s != null && s.isConnected || document.body.append(s || ""), !a.has(t)) {
+  if (e === !1 || !e.isConnected || !t.isConnected) return l.delete(t);
+  if (s != null && s.isConnected || document.body.append(s || ""), !l.has(t)) {
     const I = d[o] ?? d.bottom;
-    return (p = a.set(t, () => _(t, e, I)).get(t)) == null ? void 0 : p();
+    return (p = l.set(t, () => _(t, e, I)).get(t)) == null ? void 0 : p();
   }
-  const { offsetWidth: i, offsetHeight: n } = t, { offsetWidth: c, offsetHeight: u } = e, { width: M, height: m, left: g, top: v } = e.getBoundingClientRect(), f = Math.round(g - (c - M) / 2), r = Math.round(v - (u - m) / 2), T = f - i > 0, y = c + c + i < window.innerWidth, A = r - n > 0, S = r + u + n < window.innerHeight, $ = o === d.bottom && y || !T, x = o === d.bottom && S || !A, H = Math.min(Math.max(10, f - (i - c) / 2), window.innerWidth - i - 10), W = Math.min(Math.max(10, r - (n - u) / 2), window.innerHeight - n - 10), h = o === d.top || o === d.bottom;
+  const { offsetWidth: i, offsetHeight: n } = t, { offsetWidth: c, offsetHeight: u } = e, { width: M, height: m, left: v, top: g } = e.getBoundingClientRect(), f = Math.round(v - (c - M) / 2), r = Math.round(g - (u - m) / 2), T = f - i > 0, y = c + c + i < window.innerWidth, A = r - n > 0, S = r + u + n < window.innerHeight, $ = o === d.bottom && y || !T, x = o === d.bottom && S || !A, H = Math.min(Math.max(10, f - (i - c) / 2), window.innerWidth - i - 10), W = Math.min(Math.max(10, r - (n - u) / 2), window.innerHeight - n - 10), h = o === d.top || o === d.bottom;
   t.style.left = `${Math.round(h ? H : $ ? f + c : f - i)}px`, t.style.top = `${Math.round(h ? x ? r + u : r - n : W)}px`, s == null || s.style.setProperty("translate", `${Math.round(window.scrollX + f + c + i + 30)} ${Math.round(window.scrollY + r + u + n + 30)}px`);
 }
-function F(t) {
+function z(t) {
   let e = 0;
   const o = () => setTimeout(i, 200), i = () => {
     t([], n), e = 0;
@@ -35,27 +35,27 @@ function F(t) {
   });
   return n;
 }
-const l = /* @__PURE__ */ new WeakMap(), P = (t) => {
+const a = /* @__PURE__ */ new WeakMap(), F = (t) => {
   var o;
-  const e = l.get(t);
+  const e = a.get(t);
   if (!e || !t.isConnected)
-    (o = e == null ? void 0 : e.observer) == null || o.disconnect(), l.delete(t);
+    (o = e == null ? void 0 : e.observer) == null || o.disconnect(), a.delete(t);
   else for (const [, i] of e.collections) i();
-}, k = (t, e, o) => {
+}, Y = (t, e, o) => {
   const i = t.getElementsByClassName(e);
-  let n = l.get(t);
-  n || (n = { collections: /* @__PURE__ */ new Map(), observer: F(() => P(t)) }, n.observer.observe(t, { childList: !0, subtree: !0, attributes: !0, attributeFilter: ["class"] }), l.set(t, n)), o ? n.collections.set(e, () => o(i)) : n.collections.delete(e);
-}, q = (t) => t instanceof HTMLElement && "validity" in t && !(t instanceof HTMLButtonElement);
+  let n = a.get(t);
+  n || (n = { collections: /* @__PURE__ */ new Map(), observer: z(() => F(t)) }, n.observer.observe(t, { childList: !0, subtree: !0, attributes: !0, attributeFilter: ["class"] }), a.set(t, n)), o ? n.collections.set(e, () => o(i)) : n.collections.delete(e), n.collections.size || (n.observer.disconnect(), a.delete(t));
+}, k = (t) => t instanceof HTMLElement && "validity" in t && !(t instanceof HTMLButtonElement);
 export {
-  w as IS_BROWSER,
+  b as IS_BROWSER,
   U as QUICK_EVENT,
   _ as anchorPosition,
   C as attr,
-  F as createOptimizedMutationObserver,
-  q as isInputLike,
-  Y as off,
+  z as createOptimizedMutationObserver,
+  k as isInputLike,
+  X as off,
   B as on,
-  k as onMutation,
-  X as useId
+  Y as onMutation,
+  P as useId
 };
 //# sourceMappingURL=utils.js.map

package/mtds/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../designsystem/utils.ts"],"sourcesContent":["export const IS_BROWSER = typeof window !== 'undefined' && typeof document !== 'undefined';\nexport const QUICK_EVENT = { capture: true, passive: true };\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  if (!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\trest: Parameters<typeof Element.prototype.addEventListener>,\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 => events(\"add\", element, rest);\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\n\nconst TARGETS = new Map<Element, () => void>(); // Store current open poppers and their update functions\nconst SCROLLER = IS_BROWSER ? document.createElement('div') : null // Used to ensure we have scrollability under\nif (SCROLLER) attr(SCROLLER, 'style', 'position:absolute;padding:1px;top:0;left:0px');\n\nif (IS_BROWSER){\n\ton(window, 'load,resize,scroll', () => {\n\t\tfor (const [_, update] of TARGETS) update();\n\t}, QUICK_EVENT);}\n\t\n/**\n * anchorPosition\n * @param target The Element to position\n * @param anchor The Element to use as anchor\n */\nconst POSITION = { top: 0, right: 1, bottom: 2, left: 3 }; // Speed up by using a const map\n\nexport function anchorPosition (target: HTMLElement, anchor: HTMLElement | false, position?: string | number) {\n\tif (anchor === false || !anchor.isConnected || !target.isConnected) return TARGETS.delete(target); // Stop watching if anchor is removed from DOM\n\tif (!SCROLLER?.isConnected) document.body.append(SCROLLER || ''); // Ensure we have t´he scroller\n\tif (!TARGETS.has(target)) { // Setup new target or update position\n\t\tconst place = POSITION[position as keyof typeof POSITION] ?? POSITION.bottom; // Use CSS property to store position for more flexibility\n\t\treturn TARGETS.set(target, () => anchorPosition(target, anchor, place)).get(target)?.(); // Start watching if not already watching\n\t}\n\n  const { offsetWidth: targetW, offsetHeight: targetH } = target;\n  const { offsetWidth: anchorW, offsetHeight: anchorH } = anchor;\n  const { width, height, left, top } = anchor.getBoundingClientRect();\n\tconst anchorX = Math.round(left - (anchorW - width) / 2); // Correct for CSS transform scale\n  const anchorY = Math.round(top - (anchorH - height) / 2); // Correct for CSS transform scale\n\n\tconst hasSpaceLeft = anchorX - targetW > 0\n\tconst hasSpaceRight = anchorW + anchorW + targetW < window.innerWidth;\n\tconst hasSpaceOver = anchorY - targetH > 0\n\tconst hasSpaceUnder = anchorY + anchorH + targetH < window.innerHeight;\n\tconst positionRight = (position === POSITION.bottom && hasSpaceRight) || !hasSpaceLeft // Always position right when no hasSpaceLeft, as no OS scrolls further up than 0\n\tconst positionUnder = (position === POSITION.bottom && hasSpaceUnder) || !hasSpaceOver // Always position under when no hasSpaceOver, as no OS scrolls further up than 0\n\tconst centerX = Math.min(Math.max(10, anchorX - (targetW - anchorW) / 2), window.innerWidth - targetW - 10);\n\tconst centerY = Math.min(Math.max(10, anchorY - (targetH - anchorH) / 2), window.innerHeight - targetH - 10);\n\tconst isVertical = position === POSITION.top || position === POSITION.bottom;\n\n\ttarget.style.left = `${Math.round(isVertical ? centerX : (positionRight ? anchorX + anchorW : anchorX - targetW))}px`\n  target.style.top = `${Math.round(isVertical ? (positionUnder ? anchorY + anchorH : anchorY - targetH) : centerY)}px`\n  SCROLLER?.style.setProperty('translate', `${Math.round(window.scrollX + anchorX + anchorW + targetW + 30)} ${Math.round(window.scrollY + anchorY + anchorH + targetH + 30)}px`);\n}\n\n/**\n * Speed up MutationObserver by debouncing and only running when page is visible\n * @return new MutaionObserver\n */\nexport function createOptimizedMutationObserver(callback: MutationCallback) {\n  let queue = 0;\n\n\tconst onFrame = () => setTimeout(onTimer, 200); // Use both requestAnimationFrame and setTimeout to debounce and only run when visible\n\tconst onTimer = () => {\n\t\tcallback([], observer);\n\t\tqueue = 0;\n\t};\n  const observer = new MutationObserver(() => {\n    if (!queue) queue = requestAnimationFrame(onFrame);\n  });\n\n  return observer;\n}\n\ntype Mutator = { observer: MutationObserver, collections: Map<string, () => void> };\nconst MUTATORS = new WeakMap<Element, Mutator>();\nconst MUTATORS_CALLBACK = (element: Element) => {\n\tconst mutator = MUTATORS.get(element);\n\n\tif (!mutator || !element.isConnected) {\n\t\tmutator?.observer?.disconnect();\n\t\tMUTATORS.delete(element);\n\t} else for(const [, callback] of mutator.collections) callback();\n};\n\n/**\n * onMutation\n * @description Utility to quickly observe mutations on a specific class name\n * @param element The Element to use as EventTarget\n * @param className The class name to observe\n * @param callback The callback to run when mutations are detected or false to stop observing\n */\nexport const onMutation = (\n\telement: Element,\n\tclassName: string,\n\tcallback: ((collection: HTMLCollection) => void) | false\n) => {\n\tconst collection = element.getElementsByClassName(className);\n\tlet mutator = MUTATORS.get(element);\n\n\tif (!mutator) {\n\t\tmutator = { collections: new Map(), observer: createOptimizedMutationObserver(() => MUTATORS_CALLBACK(element)) };\n\t\tmutator.observer.observe(element, { childList: true, subtree: true, attributes: true, attributeFilter: ['class'] });\n\t\tMUTATORS.set(element, mutator);\n\t}\n\tif (callback) mutator.collections.set(className, () => callback(collection));\n\telse mutator.collections.delete(className);\n}\n\nexport const isInputLike = (el: unknown): el is HTMLInputElement =>\n\tel instanceof HTMLElement && 'validity' in el && !(el instanceof HTMLButtonElement);\n\n// Make React support popover attributes\n// https://github.com/facebook/react/issues/27479\ntype Popover = \"\" | \"auto\" | \"manual\" | undefined;\ndeclare global {\n\tnamespace React.JSX {\n\t\tinterface IntrinsicAttributes {\n\t\t\tpopovertargetaction?: string;\n\t\t\tpopovertarget?: string;\n\t\t\tpopover?: Popover;\n\t\t}\n\t}\n\tnamespace React {\n\t\tinterface HTMLAttributes<T> {\n\t\t\tpopovertargetaction?: string;\n\t\t\tpopovertarget?: string;\n\t\t\tpopover?: Popover;\n\t\t}\n\t}\n}"],"names":["IS_BROWSER","QUICK_EVENT","attr","el","name","value","id","UUID","useId","events","action","element","rest","type","on","off","TARGETS","SCROLLER","_","update","POSITION","anchorPosition","target","anchor","position","_a","place","targetW","targetH","anchorW","anchorH","width","height","left","top","anchorX","anchorY","hasSpaceLeft","hasSpaceRight","hasSpaceOver","hasSpaceUnder","positionRight","positionUnder","centerX","centerY","isVertical","createOptimizedMutationObserver","callback","queue","onFrame","onTimer","observer","MUTATORS","MUTATORS_CALLBACK","mutator","onMutation","className","collection","isInputLike"],"mappings":"AAAO,MAAMA,IAAa,OAAO,SAAW,OAAe,OAAO,WAAa,KAClEC,IAAc,EAAE,SAAS,IAAM,SAAS,GAAK;AAS1C,SAAAC,EACfC,GACAC,GACAC,GACgB;AAChB,SAAIA,MAAU,SAAkBF,EAAG,aAAaC,CAAI,KAAK,QACrDC,MAAU,OAASF,EAAA,gBAAgBC,CAAI,IAClCD,EAAG,aAAaC,CAAI,MAAMC,KAAUF,EAAA,aAAaC,GAAMC,CAAK,GAC9D;AACR;AAMA,IAAIC,IAAK;AACT,MAAMC,IAAO,GAAG,KAAK,IAAM,EAAA,SAAS,EAAE,CAAC,GAAG,KAAK,SAAS,SAAS,EAAE,EAAE,MAAM,GAAG,CAAC,CAAC;AACzE,SAASC,EAAOL,GAAa;AAC9B,SAACA,EAAG,OAAIA,EAAG,KAAK,GAAGI,CAAI,GAAG,EAAED,CAAE,KAC5BH,EAAG;AACX;AAGA,MAAMM,IAAS,CACdC,GACAC,GACAC,MACU;AACV,aAAWC,KAAQD,EAAK,CAAC,EAAE,MAAM,GAAG;AACnC,IAAAA,EAAK,CAAC,IAAIC,GACVF,EAAQ,GAAGD,CAAM,eAAe,EAAE,GAAGE,CAAI;AAE3C,GAQaE,IAAK,CACjBH,MACGC,MACOH,EAAO,OAAOE,GAASC,CAAI,GAQzBG,IAAM,CAClBJ,MACGC,MACOH,EAAO,UAAUE,GAASC,CAAI,GAGnCI,wBAAc,IAAyB,GACvCC,IAAWjB,IAAa,SAAS,cAAc,KAAK,IAAI;AAC1DiB,KAAUf,EAAKe,GAAU,SAAS,8CAA8C;AAEhFjB,KACAc,EAAA,QAAQ,sBAAsB,MAAM;AACtC,aAAW,CAACI,GAAGC,CAAM,KAAKH,EAAgB,CAAAG,EAAA;GACxClB,CAAW;AAOf,MAAMmB,IAAW,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,EAAE;AAExC,SAAAC,EAAgBC,GAAqBC,GAA6BC,GAA4B;AAnFvG,MAAAC;AAoFF,MAAAF,MAAW,MAAS,CAACA,EAAO,eAAe,CAACD,EAAO,YAAa,QAAON,EAAQ,OAAOM,CAAM;AAEhG,MADKL,KAAA,QAAAA,EAAU,wBAAsB,KAAK,OAAOA,KAAY,EAAE,GAC3D,CAACD,EAAQ,IAAIM,CAAM,GAAG;AACzB,UAAMI,IAAQN,EAASI,CAAiC,KAAKJ,EAAS;AACtE,YAAOK,IAAAT,EAAQ,IAAIM,GAAQ,MAAMD,EAAeC,GAAQC,GAAQG,CAAK,CAAC,EAAE,IAAIJ,CAAM,MAA3E,gBAAAG;AAAA,EAA+E;AAGtF,QAAM,EAAE,aAAaE,GAAS,cAAcC,EAAY,IAAAN,GAClD,EAAE,aAAaO,GAAS,cAAcC,EAAY,IAAAP,GAClD,EAAE,OAAAQ,GAAO,QAAAC,GAAQ,MAAAC,GAAM,KAAAC,EAAI,IAAIX,EAAO,sBAAsB,GAC7DY,IAAU,KAAK,MAAMF,KAAQJ,IAAUE,KAAS,CAAC,GAChDK,IAAU,KAAK,MAAMF,KAAOJ,IAAUE,KAAU,CAAC,GAElDK,IAAeF,IAAUR,IAAU,GACnCW,IAAgBT,IAAUA,IAAUF,IAAU,OAAO,YACrDY,IAAeH,IAAUR,IAAU,GACnCY,IAAgBJ,IAAUN,IAAUF,IAAU,OAAO,aACrDa,IAAiBjB,MAAaJ,EAAS,UAAUkB,KAAkB,CAACD,GACpEK,IAAiBlB,MAAaJ,EAAS,UAAUoB,KAAkB,CAACD,GACpEI,IAAU,KAAK,IAAI,KAAK,IAAI,IAAIR,KAAWR,IAAUE,KAAW,CAAC,GAAG,OAAO,aAAaF,IAAU,EAAE,GACpGiB,IAAU,KAAK,IAAI,KAAK,IAAI,IAAIR,KAAWR,IAAUE,KAAW,CAAC,GAAG,OAAO,cAAcF,IAAU,EAAE,GACrGiB,IAAarB,MAAaJ,EAAS,OAAOI,MAAaJ,EAAS;AAEtE,EAAAE,EAAO,MAAM,OAAO,GAAG,KAAK,MAAMuB,IAAaF,IAAWF,IAAgBN,IAAUN,IAAUM,IAAUR,CAAQ,CAAC,MAChHL,EAAO,MAAM,MAAM,GAAG,KAAK,MAAMuB,IAAcH,IAAgBN,IAAUN,IAAUM,IAAUR,IAAWgB,CAAO,CAAC,MACtG3B,KAAA,QAAAA,EAAA,MAAM,YAAY,aAAa,GAAG,KAAK,MAAM,OAAO,UAAUkB,IAAUN,IAAUF,IAAU,EAAE,CAAC,IAAI,KAAK,MAAM,OAAO,UAAUS,IAAUN,IAAUF,IAAU,EAAE,CAAC;AAC5K;AAMO,SAASkB,EAAgCC,GAA4B;AAC1E,MAAIC,IAAQ;AAEb,QAAMC,IAAU,MAAM,WAAWC,GAAS,GAAG,GACvCA,IAAU,MAAM;AACZ,IAAAH,EAAA,IAAII,CAAQ,GACbH,IAAA;AAAA,EACT,GACOG,IAAW,IAAI,iBAAiB,MAAM;AAC1C,IAAKH,MAAeA,IAAA,sBAAsBC,CAAO;AAAA,EAAA,CAClD;AAEM,SAAAE;AACT;AAGA,MAAMC,wBAAe,QAA0B,GACzCC,IAAoB,CAAC1C,MAAqB;AArIzC,MAAAc;AAsIA,QAAA6B,IAAUF,EAAS,IAAIzC,CAAO;AAEpC,MAAI,CAAC2C,KAAW,CAAC3C,EAAQ;AACxB,KAAAc,IAAA6B,KAAA,gBAAAA,EAAS,aAAT,QAAA7B,EAAmB,cACnB2B,EAAS,OAAOzC,CAAO;AAAA,kBACP,CAAA,EAAGoC,CAAQ,KAAKO,EAAQ,YAAsB,CAAAP,EAAA;AAChE,GASaQ,IAAa,CACzB5C,GACA6C,GACAT,MACI;AACE,QAAAU,IAAa9C,EAAQ,uBAAuB6C,CAAS;AACvD,MAAAF,IAAUF,EAAS,IAAIzC,CAAO;AAElC,EAAK2C,MACMA,IAAA,EAAE,aAAa,oBAAI,IAAI,GAAG,UAAUR,EAAgC,MAAMO,EAAkB1C,CAAO,CAAC,EAAE,GAChH2C,EAAQ,SAAS,QAAQ3C,GAAS,EAAE,WAAW,IAAM,SAAS,IAAM,YAAY,IAAM,iBAAiB,CAAC,OAAO,GAAG,GACzGyC,EAAA,IAAIzC,GAAS2C,CAAO,IAE1BP,MAAkB,YAAY,IAAIS,GAAW,MAAMT,EAASU,CAAU,CAAC,IACtEH,EAAQ,YAAY,OAAOE,CAAS;AAC1C,GAEaE,IAAc,CAACvD,MAC3BA,aAAc,eAAe,cAAcA,KAAM,EAAEA,aAAc;"}
+{"version":3,"file":"utils.js","sources":["../designsystem/utils.ts"],"sourcesContent":["export const IS_BROWSER = typeof window !== 'undefined' && typeof document !== 'undefined';\nexport const QUICK_EVENT = { capture: true, passive: true };\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  if (!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\trest: Parameters<typeof Element.prototype.addEventListener>,\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 => events(\"add\", element, rest);\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\n\nconst TARGETS = new Map<Element, () => void>(); // Store current open poppers and their update functions\nconst SCROLLER = IS_BROWSER ? document.createElement('div') : null // Used to ensure we have scrollability under\nif (SCROLLER) attr(SCROLLER, 'style', 'position:absolute;padding:1px;top:0;left:0px');\n\nif (IS_BROWSER){\n\ton(window, 'load,resize,scroll', () => {\n\t\tfor (const [_, update] of TARGETS) update();\n\t}, QUICK_EVENT);}\n\t\n/**\n * anchorPosition\n * @param target The Element to position\n * @param anchor The Element to use as anchor\n */\nconst POSITION = { top: 0, right: 1, bottom: 2, left: 3 }; // Speed up by using a const map\n\nexport function anchorPosition (target: HTMLElement, anchor: HTMLElement | false, position?: string | number) {\n\tif (anchor === false || !anchor.isConnected || !target.isConnected) return TARGETS.delete(target); // Stop watching if anchor is removed from DOM\n\tif (!SCROLLER?.isConnected) document.body.append(SCROLLER || ''); // Ensure we have t´he scroller\n\tif (!TARGETS.has(target)) { // Setup new target or update position\n\t\tconst place = POSITION[position as keyof typeof POSITION] ?? POSITION.bottom; // Use CSS property to store position for more flexibility\n\t\treturn TARGETS.set(target, () => anchorPosition(target, anchor, place)).get(target)?.(); // Start watching if not already watching\n\t}\n\n  const { offsetWidth: targetW, offsetHeight: targetH } = target;\n  const { offsetWidth: anchorW, offsetHeight: anchorH } = anchor;\n  const { width, height, left, top } = anchor.getBoundingClientRect();\n\tconst anchorX = Math.round(left - (anchorW - width) / 2); // Correct for CSS transform scale\n  const anchorY = Math.round(top - (anchorH - height) / 2); // Correct for CSS transform scale\n\n\tconst hasSpaceLeft = anchorX - targetW > 0\n\tconst hasSpaceRight = anchorW + anchorW + targetW < window.innerWidth;\n\tconst hasSpaceOver = anchorY - targetH > 0\n\tconst hasSpaceUnder = anchorY + anchorH + targetH < window.innerHeight;\n\tconst positionRight = (position === POSITION.bottom && hasSpaceRight) || !hasSpaceLeft // Always position right when no hasSpaceLeft, as no OS scrolls further up than 0\n\tconst positionUnder = (position === POSITION.bottom && hasSpaceUnder) || !hasSpaceOver // Always position under when no hasSpaceOver, as no OS scrolls further up than 0\n\tconst centerX = Math.min(Math.max(10, anchorX - (targetW - anchorW) / 2), window.innerWidth - targetW - 10);\n\tconst centerY = Math.min(Math.max(10, anchorY - (targetH - anchorH) / 2), window.innerHeight - targetH - 10);\n\tconst isVertical = position === POSITION.top || position === POSITION.bottom;\n\n\ttarget.style.left = `${Math.round(isVertical ? centerX : (positionRight ? anchorX + anchorW : anchorX - targetW))}px`\n  target.style.top = `${Math.round(isVertical ? (positionUnder ? anchorY + anchorH : anchorY - targetH) : centerY)}px`\n  SCROLLER?.style.setProperty('translate', `${Math.round(window.scrollX + anchorX + anchorW + targetW + 30)} ${Math.round(window.scrollY + anchorY + anchorH + targetH + 30)}px`);\n}\n\n/**\n * Speed up MutationObserver by debouncing and only running when page is visible\n * @return new MutaionObserver\n */\nexport function createOptimizedMutationObserver(callback: MutationCallback) {\n  let queue = 0;\n\n\tconst onFrame = () => setTimeout(onTimer, 200); // Use both requestAnimationFrame and setTimeout to debounce and only run when visible\n\tconst onTimer = () => {\n\t\tcallback([], observer);\n\t\tqueue = 0;\n\t};\n  const observer = new MutationObserver(() => {\n    if (!queue) queue = requestAnimationFrame(onFrame);\n  });\n\n  return observer;\n}\n\ntype Mutator = { observer: MutationObserver, collections: Map<string, () => void> };\nconst MUTATORS = new WeakMap<Element, Mutator>();\nconst MUTATORS_CALLBACK = (element: Element) => {\n\tconst mutator = MUTATORS.get(element);\n\n\tif (!mutator || !element.isConnected) {\n\t\tmutator?.observer?.disconnect();\n\t\tMUTATORS.delete(element);\n\t} else for(const [, callback] of mutator.collections) callback();\n};\n\n/**\n * onMutation\n * @description Utility to quickly observe mutations on a specific class name\n * @param element The Element to use as EventTarget\n * @param className The class name to observe\n * @param callback The callback to run when mutations are detected or false to stop observing\n */\nexport const onMutation = (\n\telement: Element,\n\tclassName: string,\n\tcallback: ((collection: HTMLCollection) => void) | false\n) => {\n\tconst collection = element.getElementsByClassName(className);\n\tlet mutator = MUTATORS.get(element);\n\n\tif (!mutator) {\n\t\tmutator = { collections: new Map(), observer: createOptimizedMutationObserver(() => MUTATORS_CALLBACK(element)) };\n\t\tmutator.observer.observe(element, { childList: true, subtree: true, attributes: true, attributeFilter: ['class'] });\n\t\tMUTATORS.set(element, mutator);\n\t}\n\tif (callback) mutator.collections.set(className, () => callback(collection));\n\telse mutator.collections.delete(className);\n\tif (!mutator.collections.size) {\n\t\tmutator.observer.disconnect(); // Remove mutation observer if no more callbacks\n\t\tMUTATORS.delete(element);\n\t}\n}\n\nexport const isInputLike = (el: unknown): el is HTMLInputElement =>\n\tel instanceof HTMLElement && 'validity' in el && !(el instanceof HTMLButtonElement);\n\n// Make React support popover attributes\n// https://github.com/facebook/react/issues/27479\ntype Popover = \"\" | \"auto\" | \"manual\" | undefined;\ndeclare global {\n\tnamespace React.JSX {\n\t\tinterface IntrinsicAttributes {\n\t\t\tpopovertargetaction?: string;\n\t\t\tpopovertarget?: string;\n\t\t\tpopover?: Popover;\n\t\t}\n\t}\n\tnamespace React {\n\t\tinterface HTMLAttributes<T> {\n\t\t\tpopovertargetaction?: string;\n\t\t\tpopovertarget?: string;\n\t\t\tpopover?: Popover;\n\t\t}\n\t}\n}"],"names":["IS_BROWSER","QUICK_EVENT","attr","el","name","value","id","UUID","useId","events","action","element","rest","type","on","off","TARGETS","SCROLLER","_","update","POSITION","anchorPosition","target","anchor","position","_a","place","targetW","targetH","anchorW","anchorH","width","height","left","top","anchorX","anchorY","hasSpaceLeft","hasSpaceRight","hasSpaceOver","hasSpaceUnder","positionRight","positionUnder","centerX","centerY","isVertical","createOptimizedMutationObserver","callback","queue","onFrame","onTimer","observer","MUTATORS","MUTATORS_CALLBACK","mutator","onMutation","className","collection","isInputLike"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@mattilsynet/design",
-	"version": "1.0.4",
+	"version": "1.0.6",
 	"type": "module",
 	"main": "./mtds/index.js",
 	"types": "./mtds/index.d.ts",