@mattilsynet/design 1.1.0 → 1.1.2

package/mtds/styles.json

@@ -1,37 +1,37 @@
 {
-  "alert": "_alert_1c79o_1 _ds-alert_oaddr_1",
-  "avatar": "_avatar_1c79o_1 _ds-avatar_oaddr_1",
-  "badge": "_badge_1c79o_1",
-  "breadcrumbs": "_breadcrumbs_1c79o_1 _ds-breadcrumbs_oaddr_1",
-  "button": "_button_1c79o_1 _ds-button_oaddr_1",
-  "card": "_card_1c79o_1",
-  "info": "_info_1c79o_1",
-  "group": "_group_1c79o_1",
-  "chip": "_chip_1c79o_1 _ds-chip_oaddr_1",
-  "details": "_details_1c79o_1 _ds-details_oaddr_1",
-  "dialog": "_dialog_1c79o_1 _ds-dialog_oaddr_1",
-  "divider": "_divider_1c79o_1",
-  "errorsummary": "_errorsummary_1c79o_1 _ds-error-summary_oaddr_1",
-  "field": "_field_1c79o_1 _ds-field_oaddr_1",
-  "affixes": "_affixes_1c79o_1 _ds-field-affixes_oaddr_1",
-  "fieldset": "_fieldset_1c79o_1 _ds-fieldset_oaddr_1",
-  "heading": "_heading_1c79o_1 _ds-heading_oaddr_1",
-  "helptext": "_helptext_1c79o_1 _ds-focus_oaddr_1",
-  "input": "_input_1c79o_1 _ds-input_oaddr_1",
-  "app": "_app_1c79o_1",
-  "grid": "_grid_1c79o_1",
-  "flex": "_flex_1c79o_1",
-  "prose": "_prose_1c79o_1",
-  "link": "_link_1c79o_1",
-  "logo": "_logo_1c79o_1",
-  "pagination": "_pagination_1c79o_1 _ds-pagination_oaddr_1",
-  "popover": "_popover_1c79o_1",
-  "progress": "_progress_1c79o_1",
-  "skeleton": "_skeleton_1c79o_1 _ds-skeleton_oaddr_1",
-  "spinner": "_spinner_1c79o_1",
-  "table": "_table_1c79o_1 _ds-table_oaddr_1",
-  "tabs": "_tabs_1c79o_1 _ds-tabs_oaddr_1",
-  "tag": "_tag_1c79o_1 _ds-tag_oaddr_1",
-  "validation": "_validation_1c79o_1 _ds-validation-message_oaddr_1",
-  "body": "_body_1c79o_138"
+  "alert": "_alert_mc7vk_1 _ds-alert_oaddr_1",
+  "avatar": "_avatar_mc7vk_1 _ds-avatar_oaddr_1",
+  "badge": "_badge_mc7vk_1",
+  "breadcrumbs": "_breadcrumbs_mc7vk_1 _ds-breadcrumbs_oaddr_1",
+  "button": "_button_mc7vk_1 _ds-button_oaddr_1",
+  "card": "_card_mc7vk_1",
+  "info": "_info_mc7vk_1",
+  "group": "_group_mc7vk_1",
+  "chip": "_chip_mc7vk_1 _ds-chip_oaddr_1",
+  "details": "_details_mc7vk_1 _ds-details_oaddr_1",
+  "dialog": "_dialog_mc7vk_1 _ds-dialog_oaddr_1",
+  "divider": "_divider_mc7vk_1",
+  "errorsummary": "_errorsummary_mc7vk_1 _ds-error-summary_oaddr_1",
+  "field": "_field_mc7vk_1 _ds-field_oaddr_1",
+  "affixes": "_affixes_mc7vk_1 _ds-field-affixes_oaddr_1",
+  "fieldset": "_fieldset_mc7vk_1 _ds-fieldset_oaddr_1",
+  "heading": "_heading_mc7vk_1 _ds-heading_oaddr_1",
+  "helptext": "_helptext_mc7vk_1 _ds-focus_oaddr_1",
+  "input": "_input_mc7vk_1 _ds-input_oaddr_1",
+  "app": "_app_mc7vk_1",
+  "grid": "_grid_mc7vk_1",
+  "flex": "_flex_mc7vk_1",
+  "prose": "_prose_mc7vk_1",
+  "link": "_link_mc7vk_1",
+  "logo": "_logo_mc7vk_1",
+  "pagination": "_pagination_mc7vk_1 _ds-pagination_oaddr_1",
+  "popover": "_popover_mc7vk_1",
+  "progress": "_progress_mc7vk_1",
+  "skeleton": "_skeleton_mc7vk_1 _ds-skeleton_oaddr_1",
+  "spinner": "_spinner_mc7vk_1",
+  "table": "_table_mc7vk_1 _ds-table_oaddr_1",
+  "tabs": "_tabs_mc7vk_1 _ds-tabs_oaddr_1",
+  "tag": "_tag_mc7vk_1 _ds-tag_oaddr_1",
+  "validation": "_validation_mc7vk_1 _ds-validation-message_oaddr_1",
+  "body": "_body_mc7vk_144"
 }

package/mtds/styles.module.css.js

@@ -1,4 +1,4 @@
-const _ = "_alert_1c79o_1 _ds-alert_oaddr_1", o = "_avatar_1c79o_1 _ds-avatar_oaddr_1", t = "_badge_1c79o_1", s = "_breadcrumbs_1c79o_1 _ds-breadcrumbs_oaddr_1", d = "_button_1c79o_1 _ds-button_oaddr_1", a = "_card_1c79o_1", e = "_info_1c79o_1", r = "_group_1c79o_1", c = "_chip_1c79o_1 _ds-chip_oaddr_1", n = "_details_1c79o_1 _ds-details_oaddr_1", i = "_dialog_1c79o_1 _ds-dialog_oaddr_1", l = "_divider_1c79o_1", p = "_errorsummary_1c79o_1 _ds-error-summary_oaddr_1", g = "__errorsummary_1c79o_1", b = "_field_1c79o_1 _ds-field_oaddr_1", f = "_affixes_1c79o_1 _ds-field-affixes_oaddr_1", u = "_fieldset_1c79o_1 _ds-fieldset_oaddr_1", m = "_heading_1c79o_1 _ds-heading_oaddr_1", h = "_helptext_1c79o_1 _ds-focus_oaddr_1", v = "_input_1c79o_1 _ds-input_oaddr_1", x = "_app_1c79o_1", y = "_grid_1c79o_1", k = "_flex_1c79o_1", w = "_prose_1c79o_1", S = "_link_1c79o_1", j = "_logo_1c79o_1", q = "_pagination_1c79o_1 _ds-pagination_oaddr_1", z = "_popover_1c79o_1", A = "_progress_1c79o_1", B = "__indeterminate_1c79o_1", C = "_skeleton_1c79o_1 _ds-skeleton_oaddr_1", D = "__skeleton_1c79o_1", E = "_spinner_1c79o_1", F = "_table_1c79o_1 _ds-table_oaddr_1", G = "__scrollShadow_1c79o_1", H = "_tabs_1c79o_1 _ds-tabs_oaddr_1", I = "_tag_1c79o_1 _ds-tag_oaddr_1", J = "__tooltip_1c79o_1", K = "_validation_1c79o_1 _ds-validation-message_oaddr_1", L = "_body_1c79o_138", M = {
+const _ = "_alert_mc7vk_1 _ds-alert_oaddr_1", o = "_avatar_mc7vk_1 _ds-avatar_oaddr_1", t = "_badge_mc7vk_1", s = "_breadcrumbs_mc7vk_1 _ds-breadcrumbs_oaddr_1", d = "_button_mc7vk_1 _ds-button_oaddr_1", a = "_card_mc7vk_1", e = "_info_mc7vk_1", r = "_group_mc7vk_1", c = "_chip_mc7vk_1 _ds-chip_oaddr_1", n = "_details_mc7vk_1 _ds-details_oaddr_1", i = "_dialog_mc7vk_1 _ds-dialog_oaddr_1", m = "_divider_mc7vk_1", l = "_errorsummary_mc7vk_1 _ds-error-summary_oaddr_1", v = "__errorsummary_mc7vk_1", k = "_field_mc7vk_1 _ds-field_oaddr_1", p = "_affixes_mc7vk_1 _ds-field-affixes_oaddr_1", g = "_fieldset_mc7vk_1 _ds-fieldset_oaddr_1", b = "_heading_mc7vk_1 _ds-heading_oaddr_1", f = "_helptext_mc7vk_1 _ds-focus_oaddr_1", u = "_input_mc7vk_1 _ds-input_oaddr_1", h = "_app_mc7vk_1", x = "_grid_mc7vk_1", y = "_flex_mc7vk_1", w = "_prose_mc7vk_1", S = "_link_mc7vk_1", j = "_logo_mc7vk_1", q = "_pagination_mc7vk_1 _ds-pagination_oaddr_1", z = "_popover_mc7vk_1", A = "_progress_mc7vk_1", B = "__indeterminate_mc7vk_1", C = "_skeleton_mc7vk_1 _ds-skeleton_oaddr_1", D = "__skeleton_mc7vk_1", E = "_spinner_mc7vk_1", F = "_table_mc7vk_1 _ds-table_oaddr_1", G = "__scrollShadow_mc7vk_1", H = "_tabs_mc7vk_1 _ds-tabs_oaddr_1", I = "_tag_mc7vk_1 _ds-tag_oaddr_1", J = "__tooltip_mc7vk_1", K = "_validation_mc7vk_1 _ds-validation-message_oaddr_1", L = "_body_mc7vk_144", M = {
   alert: _,
   avatar: o,
   badge: t,
@@ -10,18 +10,18 @@ const _ = "_alert_1c79o_1 _ds-alert_oaddr_1", o = "_avatar_1c79o_1 _ds-avatar_oa
   chip: c,
   details: n,
   dialog: i,
-  divider: l,
-  errorsummary: p,
-  _errorsummary: g,
-  field: b,
-  affixes: f,
-  fieldset: u,
-  heading: m,
-  helptext: h,
-  input: v,
-  app: x,
-  grid: y,
-  flex: k,
+  divider: m,
+  errorsummary: l,
+  _errorsummary: v,
+  field: k,
+  affixes: p,
+  fieldset: g,
+  heading: b,
+  helptext: f,
+  input: u,
+  app: h,
+  grid: x,
+  flex: y,
   prose: w,
   link: S,
   logo: j,
@@ -41,14 +41,14 @@ const _ = "_alert_1c79o_1 _ds-alert_oaddr_1", o = "_avatar_1c79o_1 _ds-avatar_oa
   body: L
 };
 export {
-  g as _errorsummary,
+  v as _errorsummary,
   B as _indeterminate,
   G as _scrollShadow,
   D as _skeleton,
   J as _tooltip,
-  f as affixes,
+  p as affixes,
   _ as alert,
-  x as app,
+  h as app,
   o as avatar,
   t as badge,
   L as body,
@@ -59,17 +59,17 @@ export {
   M as default,
   n as details,
   i as dialog,
-  l as divider,
-  p as errorsummary,
-  b as field,
-  u as fieldset,
-  k as flex,
-  y as grid,
+  m as divider,
+  l as errorsummary,
+  k as field,
+  g as fieldset,
+  y as flex,
+  x as grid,
   r as group,
-  m as heading,
-  h as helptext,
+  b as heading,
+  f as helptext,
   e as info,
-  v as input,
+  u as input,
   S as link,
   j as logo,
   q as pagination,

package/mtds/table/table-observer.js

@@ -17,7 +17,5 @@ function m(s) {
       }
   }
 }
-i(() => {
-  f(document.documentElement, d, m);
-});
+i(() => f(document.documentElement, d, m));
 //# 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, onLoaded, onMutation } from \"../utils\";\n\nconst CSS_TABLE = styles.table.split(\" \")[0];\n\nfunction handleMutation(tables: HTMLCollectionOf<HTMLTableElement>) {\n\tfor (const table of tables) {\n\t\tconst ths: string[] = []; // Add data-th=\"\" to each cell to support data-mobile designs\n\n\t\tattr(table, \"role\", \"table\"); // Add helping role=\"\" to ensure screen readers understand the table regardless of CSS display\n\t\tif (table.caption) attr(table.caption, \"role\", \"caption\");\n\t\tfor (const group of [table.tHead, table.tFoot, ...table.tBodies])\n\t\t\tif (group) {\n\t\t\t\tattr(group, \"role\", \"rowgroup\");\n\t\t\t\tconst isTbody = group.nodeName === \"TBODY\";\n\n\t\t\t\tfor (const row of group.rows) {\n\t\t\t\t\tattr(row, \"role\", \"row\");\n\t\t\t\t\tfor (const cell of row.cells) {\n\t\t\t\t\t\tif (isTbody) attr(cell, \"data-th\", ths[cell.cellIndex] || \":empty\");\n\t\t\t\t\t\telse ths.push(cell.innerText.trim()); // Using innerText to only include visible text\n\t\t\t\t\t\tif (cell.nodeName === \"TD\") attr(cell, \"role\", \"cell\");\n\t\t\t\t\t\telse {\n\t\t\t\t\t\t\tattr(cell, \"role\", isTbody ? \"rowheader\" : \"columnheader\");\n\t\t\t\t\t\t\tattr(cell, \"scope\", isTbody ? \"row\" : \"col\");\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t}\n}\n\nonLoaded(() => {\n\tonMutation(document.documentElement, CSS_TABLE, handleMutation);\n});\n"],"names":["CSS_TABLE","styles","handleMutation","tables","table","ths","attr","group","isTbody","row","cell","onLoaded","onMutation"],"mappings":";;AAGA,MAAMA,IAAYC,EAAO,MAAM,MAAM,GAAG,EAAE,CAAC;AAE3C,SAASC,EAAeC,GAA4C;AACnE,aAAWC,KAASD,GAAQ;AAC3B,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;AAC9D,UAAIG,GAAO;AACL,QAAAD,EAAAC,GAAO,QAAQ,UAAU;AACxB,cAAAC,IAAUD,EAAM,aAAa;AAExB,mBAAAE,KAAOF,EAAM,MAAM;AACxB,UAAAD,EAAAG,GAAK,QAAQ,KAAK;AACZ,qBAAAC,KAAQD,EAAI;AAClB,YAAAD,MAAcE,GAAM,WAAWL,EAAIK,EAAK,SAAS,KAAK,QAAQ,IACzDL,EAAA,KAAKK,EAAK,UAAU,MAAM,GAC/BA,EAAK,aAAa,OAAWJ,EAAAI,GAAM,QAAQ,MAAM,KAEpDJ,EAAKI,GAAM,QAAQF,IAAU,cAAc,cAAc,GACzDF,EAAKI,GAAM,SAASF,IAAU,QAAQ,KAAK;AAAA,QAE7C;AAAA,MACD;AAAA,EACD;AAEH;AAEAG,EAAS,MAAM;AACH,EAAAC,EAAA,SAAS,iBAAiBZ,GAAWE,CAAc;AAC/D,CAAC;"}
+{"version":3,"file":"table-observer.js","sources":["../../designsystem/table/table-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport { attr, onLoaded, onMutation } from \"../utils\";\n\nconst CSS_TABLE = styles.table.split(\" \")[0];\n\nfunction handleMutation(tables: HTMLCollectionOf<HTMLTableElement>) {\n\tfor (const table of tables) {\n\t\tconst ths: string[] = []; // Add data-th=\"\" to each cell to support data-mobile designs\n\n\t\tattr(table, \"role\", \"table\"); // Add helping role=\"\" to ensure screen readers understand the table regardless of CSS display\n\t\tif (table.caption) attr(table.caption, \"role\", \"caption\");\n\t\tfor (const group of [table.tHead, table.tFoot, ...table.tBodies])\n\t\t\tif (group) {\n\t\t\t\tattr(group, \"role\", \"rowgroup\");\n\t\t\t\tconst isTbody = group.nodeName === \"TBODY\";\n\n\t\t\t\tfor (const row of group.rows) {\n\t\t\t\t\tattr(row, \"role\", \"row\");\n\t\t\t\t\tfor (const cell of row.cells) {\n\t\t\t\t\t\tif (isTbody) attr(cell, \"data-th\", ths[cell.cellIndex] || \":empty\");\n\t\t\t\t\t\telse ths.push(cell.innerText.trim()); // Using innerText to only include visible text\n\t\t\t\t\t\tif (cell.nodeName === \"TD\") attr(cell, \"role\", \"cell\");\n\t\t\t\t\t\telse {\n\t\t\t\t\t\t\tattr(cell, \"role\", isTbody ? \"rowheader\" : \"columnheader\");\n\t\t\t\t\t\t\tattr(cell, \"scope\", isTbody ? \"row\" : \"col\");\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t}\n}\n\nonLoaded(() => onMutation(document.documentElement, CSS_TABLE, handleMutation));\n"],"names":["CSS_TABLE","styles","handleMutation","tables","table","ths","attr","group","isTbody","row","cell","onLoaded","onMutation"],"mappings":";;AAGA,MAAMA,IAAYC,EAAO,MAAM,MAAM,GAAG,EAAE,CAAC;AAE3C,SAASC,EAAeC,GAA4C;AACnE,aAAWC,KAASD,GAAQ;AAC3B,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;AAC9D,UAAIG,GAAO;AACL,QAAAD,EAAAC,GAAO,QAAQ,UAAU;AACxB,cAAAC,IAAUD,EAAM,aAAa;AAExB,mBAAAE,KAAOF,EAAM,MAAM;AACxB,UAAAD,EAAAG,GAAK,QAAQ,KAAK;AACZ,qBAAAC,KAAQD,EAAI;AAClB,YAAAD,MAAcE,GAAM,WAAWL,EAAIK,EAAK,SAAS,KAAK,QAAQ,IACzDL,EAAA,KAAKK,EAAK,UAAU,MAAM,GAC/BA,EAAK,aAAa,OAAWJ,EAAAI,GAAM,QAAQ,MAAM,KAEpDJ,EAAKI,GAAM,QAAQF,IAAU,cAAc,cAAc,GACzDF,EAAKI,GAAM,SAASF,IAAU,QAAQ,KAAK;AAAA,QAE7C;AAAA,MACD;AAAA,EACD;AAEH;AAEAG,EAAS,MAAMC,EAAW,SAAS,iBAAiBZ,GAAWE,CAAc,CAAC;"}

package/mtds/tabs/tabs.js

@@ -1,27 +1,29 @@
-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";
-const i = o(function({ className: s, ...t }, a) {
-  return /* @__PURE__ */ n("u-tabs", { class: b(c.tabs, s), ref: a, ...t });
-}), e = o(
-  function({ className: s, ...t }, a) {
-    return /* @__PURE__ */ n("u-tablist", { class: s, ref: a, ...t });
+import { jsx as a } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import b from "../styles.module.css.js";
+import { toCustomElementProps as o } from "../utils.js";
+const e = n(
+  function(t, s) {
+    return /* @__PURE__ */ a("u-tabs", { ref: s, ...o(t, b.tabs) });
   }
-), u = o(
-  function({ className: s, ...t }, a) {
-    return /* @__PURE__ */ n("u-tabpanel", { class: s, ref: a, ...t });
+), i = n(
+  function(t, s) {
+    return /* @__PURE__ */ a("u-tablist", { ref: s, ...o(t) });
   }
-), T = o(
-  function({ className: s, ...t }, a) {
-    return /* @__PURE__ */ n("u-tab", { class: s, ref: a, ...t });
+), u = n(
+  function(t, s) {
+    return /* @__PURE__ */ a("u-tabpanel", { ref: s, ...o(t) });
   }
-), x = Object.assign(i, {
-  List: e,
+), T = n(
+  function(t, s) {
+    return /* @__PURE__ */ a("u-tab", { ref: s, ...o(t) });
+  }
+), l = Object.assign(e, {
+  List: i,
   Panel: u,
   Tab: T
 });
 export {
-  x as Tabs
+  l 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 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;"}
+{"version":3,"file":"tabs.js","sources":["../../designsystem/tabs/tabs.tsx"],"sourcesContent":["import type * as UTabs from \"@u-elements/u-tabs\";\nimport { forwardRef } from \"react\";\nimport styles from \"../styles.module.css\";\nimport { toCustomElementProps } from \"../utils\";\n\nexport type TabsProps = UTabs.ReactUtabs;\nconst TabsComp = forwardRef<UTabs.UHTMLTabsElement, TabsProps>(\n\tfunction Tabs(props, ref) {\n\t\treturn <u-tabs ref={ref} {...toCustomElementProps(props, styles.tabs)} />;\n\t},\n);\n\nexport type TabsListProps = UTabs.ReactUtablist;\nconst TabsList = forwardRef<UTabs.UHTMLTabListElement, TabsListProps>(\n\tfunction TabsList(props, ref) {\n\t\treturn <u-tablist ref={ref} {...toCustomElementProps(props)} />;\n\t},\n);\n\nexport type TabsPanelProps = UTabs.ReactUtabpanel;\nconst TabsPanel = forwardRef<UTabs.UHTMLTabPanelElement, TabsPanelProps>(\n\tfunction TabsPanel(props, ref) {\n\t\treturn <u-tabpanel ref={ref} {...toCustomElementProps(props)} />;\n\t},\n);\n\nexport type TabsTabProps = UTabs.ReactUtab;\nconst TabsTab = forwardRef<UTabs.UHTMLTabElement, TabsTabProps>(\n\tfunction TabsTab(props, ref) {\n\t\treturn <u-tab ref={ref} {...toCustomElementProps(props)} />;\n\t},\n);\n\nexport const Tabs = Object.assign(TabsComp, {\n\tList: TabsList,\n\tPanel: TabsPanel,\n\tTab: TabsTab,\n});\n"],"names":["TabsComp","forwardRef","props","ref","jsx","toCustomElementProps","styles","TabsList","TabsPanel","TabsTab","Tabs"],"mappings":";;;;AAMA,MAAMA,IAAWC;AAAA,EAChB,SAAcC,GAAOC,GAAK;AAClB,WAAA,gBAAAC,EAAC,YAAO,KAAAD,GAAW,GAAGE,EAAqBH,GAAOI,EAAO,IAAI,GAAG;AAAA,EAAA;AAEzE,GAGMC,IAAWN;AAAA,EAChB,SAAkBC,GAAOC,GAAK;AAC7B,6BAAQ,aAAU,EAAA,KAAAA,GAAW,GAAGE,EAAqBH,CAAK,GAAG;AAAA,EAAA;AAE/D,GAGMM,IAAYP;AAAA,EACjB,SAAmBC,GAAOC,GAAK;AAC9B,6BAAQ,cAAW,EAAA,KAAAA,GAAW,GAAGE,EAAqBH,CAAK,GAAG;AAAA,EAAA;AAEhE,GAGMO,IAAUR;AAAA,EACf,SAAiBC,GAAOC,GAAK;AAC5B,6BAAQ,SAAM,EAAA,KAAAA,GAAW,GAAGE,EAAqBH,CAAK,GAAG;AAAA,EAAA;AAE3D,GAEaQ,IAAO,OAAO,OAAOV,GAAU;AAAA,EAC3C,MAAMO;AAAA,EACN,OAAOC;AAAA,EACP,KAAKC;AACN,CAAC;"}

package/mtds/tooltip/tooltip-observer.js

@@ -1,32 +1,32 @@
-import y from "../styles.module.css.js";
-import { onLoaded as C, on as a, QUICK_EVENT as u, attr as s, anchorPosition as b } from "../utils.js";
-const f = "aria-describedby", E = "Escape", d = "aria-labelledby", P = "--mtds-tooltip-position", _ = 300, m = "mtds-tooltip";
-let o = null, w = Number.NEGATIVE_INFINITY, L = 0, i = null;
-const v = () => Object.assign(document.createElement("div"), {
-  className: y._tooltip,
-  id: m,
+import L from "../styles.module.css.js";
+import { IS_BROWSER as _, onLoaded as v, on as a, QUICK_EVENT as u, attr as s, anchorPosition as E } from "../utils.js";
+const b = "aria-describedby", f = "Escape", d = "aria-labelledby", A = "--mtds-tooltip-position", T = 300, o = _ ? Object.assign(document.createElement("div"), {
+  className: L._tooltip,
+  id: "mtds-tooltip",
   popover: "manual"
-});
-function c({ target: e, type: t, key: n }) {
-  if (t === "keydown" && n !== E) return;
-  const l = w + _ - Date.now();
-  clearTimeout(L), L = setTimeout(
-    A,
+}) : null;
+let e = null, S = Number.NEGATIVE_INFINITY, w = 0;
+function c({ target: n, type: t, key: i }) {
+  if (t === "keydown" && i !== f) return;
+  const l = S + T - Date.now();
+  clearTimeout(w), w = setTimeout(
+    D,
     Math.max(l, 0),
-    n === E ? null : e
+    i === f ? null : n
   );
 }
-function A(e) {
-  var r, T, p;
-  if (w = Date.now(), i || (i = document.body.appendChild(v())), e === i) return;
-  let t = ((r = e == null ? void 0 : e.closest) == null ? void 0 : r.call(e, "[data-tooltip]")) || null;
-  if (t === o) return;
-  const n = t && s(t, "data-tooltip") || "", l = t && s(t, "data-tooltip-position") || ((T = window.getComputedStyle(t || document.body).getPropertyValue(P)) == null ? void 0 : T.trim()) || "top";
-  (!n || n === "false" || n === "true" || l === "none") && (t = null), t && (i.textContent = n);
-  const I = o && s(o, d) === m, O = ((p = t instanceof HTMLElement ? t.innerText : t == null ? void 0 : t.textContent) == null ? void 0 : p.trim()) || (t == null ? void 0 : t.hasAttribute(d)) || (t == null ? void 0 : t.hasAttribute("aria-label"));
-  o == null || o.removeAttribute(I ? d : f), b(i, !1), o = t, o && s(o, O ? f : d, m), i.togglePopover(!!t), b(i, t || !1, l);
+function D(n) {
+  var m, r, p;
+  if (S = Date.now(), !o || n === o) return;
+  o != null && o.isConnected || document.body.append(o);
+  let t = ((m = n == null ? void 0 : n.closest) == null ? void 0 : m.call(n, "[data-tooltip]")) || null;
+  if (t === e) return;
+  const i = t && s(t, "data-tooltip") || "", l = t && s(t, "data-tooltip-position") || ((r = window.getComputedStyle(t || document.body).getPropertyValue(A)) == null ? void 0 : r.trim()) || "top";
+  (!i || i === "false" || i === "true" || l === "none") && (t = null), t && (o.textContent = i);
+  const y = e && s(e, d) === (o == null ? void 0 : o.id), C = ((p = t instanceof HTMLElement ? t.innerText : t == null ? void 0 : t.textContent) == null ? void 0 : p.trim()) || (t == null ? void 0 : t.hasAttribute(d)) || (t == null ? void 0 : t.hasAttribute("aria-label"));
+  e == null || e.removeAttribute(y ? d : b), E(o, !1), e = t, e && s(e, C ? b : d, o == null ? void 0 : o.id), o.togglePopover(!!t), E(o, t || !1, l);
 }
-C(() => {
+v(() => {
   a(document, "blur,focus,mouseout,mouseover", c, u), a(window, "keydown", c, u), a(window, "blur", c, u);
 });
 //# 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 { QUICK_EVENT, anchorPosition, attr, on, onLoaded } from \"../utils\";\n\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: Element | null = null;\nlet LAST_CALL = Number.NEGATIVE_INFINITY;\nlet THROTTLE: number | ReturnType<typeof setTimeout> = 0;\nlet TOOLTIP: HTMLElement | null = null;\n\nconst createTooltip = () =>\n\tObject.assign(document.createElement(\"div\"), {\n\t\tclassName: styles._tooltip,\n\t\tid: TOOLTIP_ID,\n\t\tpopover: \"manual\",\n\t});\n\nfunction handleMove({ target, type, key }: Event & { key?: string }) {\n\tif (type === \"keydown\" && key !== ESC) return; // Allow ESC dismiss to follow https://www.w3.org/WAI/ARIA/apg/patterns/tooltip/\n\tconst wait = LAST_CALL + THROTTLE_DELAY - Date.now();\n\tclearTimeout(THROTTLE);\n\tTHROTTLE = setTimeout(\n\t\thandleMoveThrottled,\n\t\tMath.max(wait, 0),\n\t\tkey === ESC ? null : target,\n\t);\n}\n\n// Using a throttled function to avoid performance issues\nfunction handleMoveThrottled(target: Element | null) {\n\tLAST_CALL = Date.now();\n\n\tif (!TOOLTIP) TOOLTIP = document.body.appendChild(createTooltip());\n\tif (target === TOOLTIP) return; // Allow tooltip to be hovered, following https://www.w3.org/TR/WCAG21/#content-on-hover-or-focus\n\tlet anchor = target?.closest?.<Element>(\"[data-tooltip]\") || null;\n\n\t// No need to update\n\tif (anchor === ANCHOR) return;\n\n\tconst content = (anchor && attr(anchor, \"data-tooltip\")) || \"\";\n\tconst position =\n\t\t(anchor && attr(anchor, \"data-tooltip-position\")) ||\n\t\twindow\n\t\t\t.getComputedStyle(anchor || document.body)\n\t\t\t.getPropertyValue(POSITION_CSS_PROPERTY)\n\t\t\t?.trim() ||\n\t\t\"top\";\n\n\tconst isHidden =\n\t\t!content ||\n\t\tcontent === \"false\" ||\n\t\tcontent === \"true\" ||\n\t\tposition === \"none\";\n\n\tif (isHidden) anchor = null; // Do not show tooltip if boolish value\n\tif (anchor) TOOLTIP.textContent = content; // Only update content if new anchor\n\n\tconst hadLabel = ANCHOR && attr(ANCHOR, LABELLEDBY) === TOOLTIP_ID;\n\tconst hasLabel =\n\t\t(anchor instanceof HTMLElement\n\t\t\t? anchor.innerText\n\t\t\t: anchor?.textContent\n\t\t)?.trim() ||\n\t\tanchor?.hasAttribute(LABELLEDBY) ||\n\t\tanchor?.hasAttribute(\"aria-label\");\n\n\tANCHOR?.removeAttribute(hadLabel ? LABELLEDBY : DESCRIBEDBY); // Unlink previous anchor\n\tanchorPosition(TOOLTIP, false); // Reset anchor position\n\n\tANCHOR = anchor; // Store new anchor - might be null if no new anchor\n\tif (ANCHOR) attr(ANCHOR, hasLabel ? DESCRIBEDBY : LABELLEDBY, TOOLTIP_ID); // Use tooltip as description if allready has label\n\tTOOLTIP.togglePopover(!!anchor);\n\tanchorPosition(TOOLTIP, anchor || false, position);\n}\n\nonLoaded(() => {\n\ton(document, \"blur,focus,mouseout,mouseover\", handleMove, QUICK_EVENT);\n\ton(window, \"keydown\", handleMove, QUICK_EVENT);\n\ton(window, \"blur\", handleMove, QUICK_EVENT);\n});\n"],"names":["DESCRIBEDBY","ESC","LABELLEDBY","POSITION_CSS_PROPERTY","THROTTLE_DELAY","TOOLTIP_ID","ANCHOR","LAST_CALL","THROTTLE","TOOLTIP","createTooltip","styles","handleMove","target","type","key","wait","handleMoveThrottled","anchor","_a","content","attr","position","_b","hadLabel","hasLabel","_c","anchorPosition","onLoaded","on","QUICK_EVENT"],"mappings":";;AAGA,MAAMA,IAAc,oBACdC,IAAM,UACNC,IAAa,mBACbC,IAAwB,2BACxBC,IAAiB,KACjBC,IAAa;AAEnB,IAAIC,IAAyB,MACzBC,IAAY,OAAO,mBACnBC,IAAmD,GACnDC,IAA8B;AAElC,MAAMC,IAAgB,MACrB,OAAO,OAAO,SAAS,cAAc,KAAK,GAAG;AAAA,EAC5C,WAAWC,EAAO;AAAA,EAClB,IAAIN;AAAA,EACJ,SAAS;AACV,CAAC;AAEF,SAASO,EAAW,EAAE,QAAAC,GAAQ,MAAAC,GAAM,KAAAC,KAAiC;AAChE,MAAAD,MAAS,aAAaC,MAAQd,EAAK;AACvC,QAAMe,IAAOT,IAAYH,IAAiB,KAAK,IAAI;AACnD,eAAaI,CAAQ,GACVA,IAAA;AAAA,IACVS;AAAA,IACA,KAAK,IAAID,GAAM,CAAC;AAAA,IAChBD,MAAQd,IAAM,OAAOY;AAAA,EACtB;AACD;AAGA,SAASI,EAAoBJ,GAAwB;;AAIpD,MAHAN,IAAY,KAAK,IAAI,GAEhBE,MAASA,IAAU,SAAS,KAAK,YAAYC,GAAe,IAC7DG,MAAWJ,EAAS;AACxB,MAAIS,MAASC,IAAAN,KAAA,gBAAAA,EAAQ,YAAR,gBAAAM,EAAA,KAAAN,GAA2B,sBAAqB;AAG7D,MAAIK,MAAWZ,EAAQ;AAEvB,QAAMc,IAAWF,KAAUG,EAAKH,GAAQ,cAAc,KAAM,IACtDI,IACJJ,KAAUG,EAAKH,GAAQ,uBAAuB,OAC/CK,IAAA,OACE,iBAAiBL,KAAU,SAAS,IAAI,EACxC,iBAAiBf,CAAqB,MAFxC,gBAAAoB,EAGG,WACH;AAQD,GALC,CAACH,KACDA,MAAY,WACZA,MAAY,UACZE,MAAa,YAESJ,IAAA,OACnBA,QAAgB,cAAcE;AAElC,QAAMI,IAAWlB,KAAUe,EAAKf,GAAQJ,CAAU,MAAMG,GAClDoB,MACJC,IAAAR,aAAkB,cAChBA,EAAO,YACPA,KAAA,gBAAAA,EAAQ,gBAFV,gBAAAQ,EAGE,YACHR,KAAA,gBAAAA,EAAQ,aAAahB,QACrBgB,KAAA,gBAAAA,EAAQ,aAAa;AAEd,EAAAZ,KAAA,QAAAA,EAAA,gBAAgBkB,IAAWtB,IAAaF,IAChD2B,EAAelB,GAAS,EAAK,GAEpBH,IAAAY,GACLZ,KAAae,EAAAf,GAAQmB,IAAWzB,IAAcE,GAAYG,CAAU,GAChEI,EAAA,cAAc,CAAC,CAACS,CAAM,GACfS,EAAAlB,GAASS,KAAU,IAAOI,CAAQ;AAClD;AAEAM,EAAS,MAAM;AACX,EAAAC,EAAA,UAAU,iCAAiCjB,GAAYkB,CAAW,GAClED,EAAA,QAAQ,WAAWjB,GAAYkB,CAAW,GAC1CD,EAAA,QAAQ,QAAQjB,GAAYkB,CAAW;AAC3C,CAAC;"}
+{"version":3,"file":"tooltip-observer.js","sources":["../../designsystem/tooltip/tooltip-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport {\n\tIS_BROWSER,\n\tQUICK_EVENT,\n\tanchorPosition,\n\tattr,\n\ton,\n\tonLoaded,\n} from \"../utils\";\n\nconst DESCRIBEDBY = \"aria-describedby\";\nconst ESC = \"Escape\";\nconst LABELLEDBY = \"aria-labelledby\";\nconst POSITION_CSS_PROPERTY = \"--mtds-tooltip-position\";\nconst THROTTLE_DELAY = 300;\nconst TOOLTIP = IS_BROWSER\n\t? Object.assign(document.createElement(\"div\"), {\n\t\t\tclassName: styles._tooltip,\n\t\t\tid: \"mtds-tooltip\",\n\t\t\tpopover: \"manual\",\n\t\t})\n\t: null; // Create a dummy element to avoid null checks\n\nlet ANCHOR: Element | null = null;\nlet LAST_CALL = Number.NEGATIVE_INFINITY;\nlet THROTTLE: number | ReturnType<typeof setTimeout> = 0;\n\nfunction handleMove({ target, type, key }: Event & { key?: string }) {\n\tif (type === \"keydown\" && key !== ESC) return; // Allow ESC dismiss to follow https://www.w3.org/WAI/ARIA/apg/patterns/tooltip/\n\tconst wait = LAST_CALL + THROTTLE_DELAY - Date.now();\n\tclearTimeout(THROTTLE);\n\tTHROTTLE = setTimeout(\n\t\thandleMoveThrottled,\n\t\tMath.max(wait, 0),\n\t\tkey === ESC ? null : target,\n\t);\n}\n\n// Using a throttled function to avoid performance issues\nfunction handleMoveThrottled(target: Element | null) {\n\tLAST_CALL = Date.now();\n\n\t// Build and append tooltip if not existing\n\tif (!TOOLTIP || target === TOOLTIP) return; // Allow tooltip to be hovered, following https://www.w3.org/TR/WCAG21/#content-on-hover-or-focus\n\tif (!TOOLTIP?.isConnected) document.body.append(TOOLTIP); // Ensure connected\n\tlet anchor = target?.closest?.<Element>(\"[data-tooltip]\") || null;\n\n\t// No need to update\n\tif (anchor === ANCHOR) return;\n\n\tconst content = (anchor && attr(anchor, \"data-tooltip\")) || \"\";\n\tconst position =\n\t\t(anchor && attr(anchor, \"data-tooltip-position\")) ||\n\t\twindow\n\t\t\t.getComputedStyle(anchor || document.body)\n\t\t\t.getPropertyValue(POSITION_CSS_PROPERTY)\n\t\t\t?.trim() ||\n\t\t\"top\";\n\n\tconst isHidden =\n\t\t!content ||\n\t\tcontent === \"false\" ||\n\t\tcontent === \"true\" ||\n\t\tposition === \"none\";\n\n\tif (isHidden) anchor = null; // Do not show tooltip if boolish value\n\tif (anchor) TOOLTIP.textContent = content; // Only update content if new anchor\n\n\tconst hadLabel = ANCHOR && attr(ANCHOR, LABELLEDBY) === TOOLTIP?.id;\n\tconst hasLabel =\n\t\t(anchor instanceof HTMLElement\n\t\t\t? anchor.innerText\n\t\t\t: anchor?.textContent\n\t\t)?.trim() ||\n\t\tanchor?.hasAttribute(LABELLEDBY) ||\n\t\tanchor?.hasAttribute(\"aria-label\");\n\n\tANCHOR?.removeAttribute(hadLabel ? LABELLEDBY : DESCRIBEDBY); // Unlink previous anchor\n\tanchorPosition(TOOLTIP, false); // Reset anchor position\n\n\tANCHOR = anchor; // Store new anchor - might be null if no new anchor\n\tif (ANCHOR) attr(ANCHOR, hasLabel ? DESCRIBEDBY : LABELLEDBY, TOOLTIP?.id); // Use tooltip as description if allready has label\n\tTOOLTIP.togglePopover(!!anchor);\n\tanchorPosition(TOOLTIP, anchor || false, position);\n}\n\nonLoaded(() => {\n\ton(document, \"blur,focus,mouseout,mouseover\", handleMove, QUICK_EVENT);\n\ton(window, \"keydown\", handleMove, QUICK_EVENT);\n\ton(window, \"blur\", handleMove, QUICK_EVENT);\n});\n"],"names":["DESCRIBEDBY","ESC","LABELLEDBY","POSITION_CSS_PROPERTY","THROTTLE_DELAY","TOOLTIP","IS_BROWSER","styles","ANCHOR","LAST_CALL","THROTTLE","handleMove","target","type","key","wait","handleMoveThrottled","anchor","_a","content","attr","position","_b","hadLabel","hasLabel","_c","anchorPosition","onLoaded","on","QUICK_EVENT"],"mappings":";;AAUA,MAAMA,IAAc,oBACdC,IAAM,UACNC,IAAa,mBACbC,IAAwB,2BACxBC,IAAiB,KACjBC,IAAUC,IACb,OAAO,OAAO,SAAS,cAAc,KAAK,GAAG;AAAA,EAC7C,WAAWC,EAAO;AAAA,EAClB,IAAI;AAAA,EACJ,SAAS;AACV,CAAC,IACA;AAEH,IAAIC,IAAyB,MACzBC,IAAY,OAAO,mBACnBC,IAAmD;AAEvD,SAASC,EAAW,EAAE,QAAAC,GAAQ,MAAAC,GAAM,KAAAC,KAAiC;AAChE,MAAAD,MAAS,aAAaC,MAAQb,EAAK;AACvC,QAAMc,IAAON,IAAYL,IAAiB,KAAK,IAAI;AACnD,eAAaM,CAAQ,GACVA,IAAA;AAAA,IACVM;AAAA,IACA,KAAK,IAAID,GAAM,CAAC;AAAA,IAChBD,MAAQb,IAAM,OAAOW;AAAA,EACtB;AACD;AAGA,SAASI,EAAoBJ,GAAwB;;AAIhD,MAHJH,IAAY,KAAK,IAAI,GAGjB,CAACJ,KAAWO,MAAWP,EAAS;AACpC,EAAKA,KAAA,QAAAA,EAAS,eAAsB,SAAA,KAAK,OAAOA,CAAO;AACvD,MAAIY,MAASC,IAAAN,KAAA,gBAAAA,EAAQ,YAAR,gBAAAM,EAAA,KAAAN,GAA2B,sBAAqB;AAG7D,MAAIK,MAAWT,EAAQ;AAEvB,QAAMW,IAAWF,KAAUG,EAAKH,GAAQ,cAAc,KAAM,IACtDI,IACJJ,KAAUG,EAAKH,GAAQ,uBAAuB,OAC/CK,IAAA,OACE,iBAAiBL,KAAU,SAAS,IAAI,EACxC,iBAAiBd,CAAqB,MAFxC,gBAAAmB,EAGG,WACH;AAQD,GALC,CAACH,KACDA,MAAY,WACZA,MAAY,UACZE,MAAa,YAESJ,IAAA,OACnBA,QAAgB,cAAcE;AAElC,QAAMI,IAAWf,KAAUY,EAAKZ,GAAQN,CAAU,OAAMG,KAAA,gBAAAA,EAAS,KAC3DmB,MACJC,IAAAR,aAAkB,cAChBA,EAAO,YACPA,KAAA,gBAAAA,EAAQ,gBAFV,gBAAAQ,EAGE,YACHR,KAAA,gBAAAA,EAAQ,aAAaf,QACrBe,KAAA,gBAAAA,EAAQ,aAAa;AAEd,EAAAT,KAAA,QAAAA,EAAA,gBAAgBe,IAAWrB,IAAaF,IAChD0B,EAAerB,GAAS,EAAK,GAEpBG,IAAAS,GACLT,KAAaY,EAAAZ,GAAQgB,IAAWxB,IAAcE,GAAYG,KAAA,gBAAAA,EAAS,EAAE,GACjEA,EAAA,cAAc,CAAC,CAACY,CAAM,GACfS,EAAArB,GAASY,KAAU,IAAOI,CAAQ;AAClD;AAEAM,EAAS,MAAM;AACX,EAAAC,EAAA,UAAU,iCAAiCjB,GAAYkB,CAAW,GAClED,EAAA,QAAQ,WAAWjB,GAAYkB,CAAW,GAC1CD,EAAA,QAAQ,QAAQjB,GAAYkB,CAAW;AAC3C,CAAC;"}

package/mtds/utils.d.ts

@@ -34,18 +34,26 @@ export declare function anchorPosition(target: HTMLElement, anchor: Element | fa
  * @return new MutaionObserver
  */
 export declare function createOptimizedMutationObserver(callback: MutationCallback): MutationObserver;
-/**
- * onMutation
- * @description Utility to quickly observe mutations on a specific class name
- * @param element The Element to use as EventTarget
- * @param className The class name to observe
- * @param callback The callback to run when mutations are detected or false to stop observing
- */
-export declare const onMutation: <T extends Element>(element: Element, className: string, callback: ((collection: HTMLCollectionOf<T>) => void) | false) => void;
+export declare const onMutation: <T extends Element>(el: Element, className: string, callback: (elems: HTMLCollectionOf<T>) => void) => void;
 /**
  * onLoaded
  * @description Runs a callback when window is loaded in browser
  * @param callback The callback to run when the page is ready
  */
 export declare const onLoaded: (callback: () => void) => void;
+/**
+ * isInputLike
+ * @description Check if element is an input like element
+ * @param el The element to check
+ * @returns True if the element is an input like element
+ */
 export declare const isInputLike: (el: unknown) => el is HTMLInputElement;
+/**
+ * toCustomElementProps
+ * @description Utility to quickly convert props to custom element attributes
+ * @param props The props to convert
+ * @returns The converted props
+ */
+export declare const toCustomElementProps: ({ className, hidden, open, ...rest }: Record<string, unknown>, klass?: string) => {
+    [x: string]: unknown;
+};

package/mtds/utils.js

@@ -1,95 +1,79 @@
-const U = { capture: !0, passive: !0 }, h = typeof window < "u" && typeof document < "u";
-function C(t, e, n) {
+import { clsx as v } from "./external/clsx/dist/clsx.js";
+const C = { capture: !0, passive: !0 }, w = typeof window < "u" && typeof document < "u";
+function D(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 O = 0;
-const B = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;
-function z(t) {
-  return t.id || (t.id = `${B}${++O}`), t.id;
+const P = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;
+function L(t) {
+  return t.id || (t.id = `${P}${++O}`), t.id;
 }
-const L = (t, e, n) => {
+const _ = (t, e, n) => {
   for (const i of n[0].split(","))
     n[0] = i, e[`${t}EventListener`](...n);
-}, b = (t, ...e) => L("add", t, e), p = /* @__PURE__ */ new Map(), s = h ? document.createElement("div") : null;
-s && C(s, "style", "position:absolute;padding:1px;top:0;left:0px");
-h && b(
-  window,
-  "load,resize,scroll",
-  () => {
-    for (const [t, e] of p) e();
-  },
-  U
-);
-const u = { top: 0, right: 1, bottom: 2, left: 3 };
+}, M = (t, ...e) => _("add", t, e), c = w ? document.createElement("div") : null, l = /* @__PURE__ */ new Map(), B = () => {
+  for (const [t, e] of l) e();
+};
+c && (c.style.cssText = "position:absolute;padding:1px;top:0;left:0px", M(window, "load,resize,scroll", B, C));
+const a = { top: 0, right: 1, bottom: 2, left: 3 };
 function F(t, e, n) {
-  var M;
+  var m;
   if (e === !1 || !e.isConnected || !t.isConnected)
-    return p.delete(t);
-  if (s != null && s.isConnected || document.body.append(s || ""), !p.has(t)) {
-    const I = u[n] ?? u.bottom;
-    return (M = p.set(t, () => F(t, e, I)).get(
+    return l.delete(t);
+  if (c != null && c.isConnected || document.body.append(c || ""), !l.has(t)) {
+    const U = a[n] ?? a.bottom;
+    return (m = l.set(t, () => F(t, e, U)).get(
       t
-    )) == null ? void 0 : M();
+    )) == null ? void 0 : m();
   }
-  const i = e instanceof HTMLElement, { offsetWidth: o, offsetHeight: c } = t, r = i ? e.offsetWidth : e.clientWidth, f = i ? e.offsetHeight : e.clientHeight, { width: m, height: g, left: v, top: T } = e.getBoundingClientRect(), l = Math.round(v - (r - m) / 2), d = Math.round(T - (f - g) / 2), y = l - o > 0, A = r + r + o < window.innerWidth, H = d - c > 0, S = d + f + c < window.innerHeight, W = n === u.bottom && A || !y, $ = n === u.bottom && S || !H, x = Math.min(
-    Math.max(10, l - (o - r) / 2),
+  const i = e instanceof HTMLElement, { offsetWidth: o, offsetHeight: d } = t, s = i ? e.offsetWidth : e.clientWidth, r = i ? e.offsetHeight : e.clientHeight, { width: T, height: g, left: b, top: y } = e.getBoundingClientRect(), f = Math.round(b - (s - T) / 2), u = Math.round(y - (r - g) / 2), x = f - o > 0, A = s + s + o < window.innerWidth, H = u - d > 0, E = u + r + d < window.innerHeight, S = n === a.bottom && A || !x, W = n === a.bottom && E || !H, $ = Math.min(
+    Math.max(10, f - (o - s) / 2),
     window.innerWidth - o - 10
-  ), E = Math.min(
-    Math.max(10, d - (c - f) / 2),
-    window.innerHeight - c - 10
-  ), w = n === u.top || n === u.bottom;
-  t.style.left = `${Math.round(w ? x : W ? l + r : l - o)}px`, t.style.top = `${Math.round(w ? $ ? d + f : d - c : E)}px`, s == null || s.style.setProperty(
+  ), I = Math.min(
+    Math.max(10, u - (d - r) / 2),
+    window.innerHeight - d - 10
+  ), h = n === a.top || n === a.bottom;
+  t.style.left = `${Math.round(h ? $ : S ? f + s : f - o)}px`, t.style.top = `${Math.round(h ? W ? u + r : u - d : I)}px`, c == null || c.style.setProperty(
     "translate",
-    `${Math.round(window.scrollX + l + r + o + 30)} ${Math.round(window.scrollY + d + f + c + 30)}px`
+    `${Math.round(window.scrollX + f + s + o + 30)}px ${Math.round(window.scrollY + u + r + d + 30)}px`
   );
 }
-function _(t) {
+function k(t) {
   let e = 0;
   const n = () => setTimeout(i, 200), i = () => {
-    t([], o), e = 0;
+    t([], o), o.takeRecords(), e = 0;
   }, o = new MutationObserver(() => {
     e || (e = requestAnimationFrame(n));
   });
   return o;
 }
-const a = /* @__PURE__ */ new WeakMap(), q = (t) => {
-  var n;
-  const e = a.get(t);
-  if (!e || !t.isConnected)
-    (n = e == null ? void 0 : e.observer) == null || n.disconnect(), a.delete(t);
-  else {
-    for (const [, i] of e.collections) i();
-    e.observer.takeRecords();
-  }
-}, P = (t, e, n) => {
-  const i = t.getElementsByClassName(
-    e
-  );
-  let o = a.get(t);
-  o || (o = {
-    collections: /* @__PURE__ */ new Map(),
-    observer: _(
-      () => q(t)
-    )
-  }, o.observer.observe(t, {
-    childList: !0,
-    subtree: !0,
+const p = /* @__PURE__ */ new WeakMap(), N = (t, e, n) => {
+  const i = t.getElementsByClassName(e), o = p.get(t) || [];
+  o.length || (p.set(t, o), k((d, s) => {
+    if (t.isConnected && (o != null && o.length))
+      for (const r of o) r();
+    else
+      s == null || s.disconnect(), p.delete(t);
+  }).observe(t, {
+    attributeFilter: ["class"],
     attributes: !0,
-    attributeFilter: ["class"]
-  }), a.set(t, o)), n ? o.collections.set(e, () => n(i)) : o.collections.delete(e), o.collections.size || (o.observer.disconnect(), a.delete(t));
+    childList: !0,
+    subtree: !0
+  })), o.push(() => n(i));
 }, R = (t) => {
-  h && (document.readyState === "complete" ? window.requestAnimationFrame(t) : b(window, "load", t));
-}, X = (t) => t instanceof HTMLElement && "validity" in t && !(t instanceof HTMLButtonElement);
+  w && (document.readyState === "complete" ? window.requestAnimationFrame(t) : M(window, "load", t));
+}, X = (t) => t instanceof HTMLElement && "validity" in t && !(t instanceof HTMLButtonElement), Y = ({ className: t, hidden: e, open: n, ...i }, o) => (i.class = v(o, t || "") || void 0, e && (i.hidden = !0), n && (i.open = !0), i);
 export {
-  h as IS_BROWSER,
-  U as QUICK_EVENT,
+  w as IS_BROWSER,
+  C as QUICK_EVENT,
   F as anchorPosition,
-  C as attr,
-  _ as createOptimizedMutationObserver,
+  D as attr,
+  k as createOptimizedMutationObserver,
   X as isInputLike,
-  b as on,
+  M as on,
   R as onLoaded,
-  P as onMutation,
-  z as useId
+  N as onMutation,
+  Y as toCustomElementProps,
+  L 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 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 (...args: T) => {\n\t\tclearTimeout(timer);\n\t\ttimer = setTimeout(() => callback(...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\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/**\n * Scroller targes helping anchorPosition\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)\n\tattr(SCROLLER, \"style\", \"position:absolute;padding:1px;top:0;left:0px\");\n\nif (IS_BROWSER) {\n\ton(\n\t\twindow,\n\t\t\"load,resize,scroll\",\n\t\t() => {\n\t\t\tfor (const [_, update] of TARGETS) update();\n\t\t},\n\t\tQUICK_EVENT,\n\t);\n}\n\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(\n\ttarget: HTMLElement,\n\tanchor: Element | false,\n\tposition?: string | number,\n) {\n\tif (anchor === false || !anchor.isConnected || !target.isConnected)\n\t\treturn 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)) {\n\t\t// Setup new target or update position\n\t\tconst place =\n\t\t\tPOSITION[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(\n\t\t\ttarget,\n\t\t)?.(); // Start watching if not already watching\n\t}\n\n\tconst isHTMLAnchor = anchor instanceof HTMLElement; // SVG or XML elements does not have offsetWidth or offsetHeight\n\tconst { offsetWidth: targetW, offsetHeight: targetH } = target;\n\tconst anchorW = isHTMLAnchor ? anchor.offsetWidth : anchor.clientWidth;\n\tconst anchorH = isHTMLAnchor ? anchor.offsetHeight : anchor.clientHeight;\n\tconst { width, height, left, top } = anchor.getBoundingClientRect();\n\tconst anchorX = Math.round(left - (anchorW - width) / 2); // Correct for CSS transform scale\n\tconst 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 =\n\t\t(position === POSITION.bottom && hasSpaceRight) || !hasSpaceLeft; // Always position right when no hasSpaceLeft, as no OS scrolls further up than 0\n\tconst positionUnder =\n\t\t(position === POSITION.bottom && hasSpaceUnder) || !hasSpaceOver; // Always position under when no hasSpaceOver, as no OS scrolls further up than 0\n\tconst centerX = Math.min(\n\t\tMath.max(10, anchorX - (targetW - anchorW) / 2),\n\t\twindow.innerWidth - targetW - 10,\n\t);\n\tconst centerY = Math.min(\n\t\tMath.max(10, anchorY - (targetH - anchorH) / 2),\n\t\twindow.innerHeight - targetH - 10,\n\t);\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\ttarget.style.top = `${Math.round(isVertical ? (positionUnder ? anchorY + anchorH : anchorY - targetH) : centerY)}px`;\n\tSCROLLER?.style.setProperty(\n\t\t\"translate\",\n\t\t`${Math.round(window.scrollX + anchorX + anchorW + targetW + 30)} ${Math.round(window.scrollY + anchorY + anchorH + targetH + 30)}px`,\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 createOptimizedMutationObserver(callback: MutationCallback) {\n\tlet 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\tconst observer = new MutationObserver(() => {\n\t\tif (!queue) queue = requestAnimationFrame(onFrame);\n\t});\n\n\treturn observer;\n}\n\ntype Mutator = {\n\tobserver: MutationObserver;\n\tcollections: Map<string, () => void>;\n};\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 {\n\t\tfor (const [, callback] of mutator.collections) callback();\n\t\tmutator.observer.takeRecords(); // Clear records to avoid running callback multiple times\n\t}\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 = <T extends Element>(\n\telement: Element,\n\tclassName: string,\n\tcallback: ((collection: HTMLCollectionOf<T>) => void) | false,\n) => {\n\tconst collection = element.getElementsByClassName(\n\t\tclassName,\n\t) as HTMLCollectionOf<T>;\n\tlet mutator = MUTATORS.get(element);\n\n\tif (!mutator) {\n\t\tmutator = {\n\t\t\tcollections: new Map(),\n\t\t\tobserver: createOptimizedMutationObserver(() =>\n\t\t\t\tMUTATORS_CALLBACK(element),\n\t\t\t),\n\t\t};\n\t\tmutator.observer.observe(element, {\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t\tattributes: true,\n\t\t\tattributeFilter: [\"class\"],\n\t\t});\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\n/**\n * onLoaded\n * @description Runs a callback when window is loaded in browser\n * @param callback The callback to run when the page is ready\n */\nexport const onLoaded = (callback: () => void) => {\n\tif (!IS_BROWSER) return;\n\tif (document.readyState === \"complete\")\n\t\twindow.requestAnimationFrame(callback); // Ensure we run after all other load events\n\telse on(window, \"load\", callback);\n};\n\nexport const isInputLike = (el: unknown): el is HTMLInputElement =>\n\tel instanceof HTMLElement &&\n\t\"validity\" in el &&\n\t!(el instanceof HTMLButtonElement);\n"],"names":["QUICK_EVENT","IS_BROWSER","attr","el","name","value","id","UUID","useId","events","action","element","rest","type","on","TARGETS","SCROLLER","_","update","POSITION","anchorPosition","target","anchor","position","_a","place","isHTMLAnchor","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","onLoaded","isInputLike"],"mappings":"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"}
+{"version":3,"file":"utils.js","sources":["../designsystem/utils.ts"],"sourcesContent":["import { clsx } from \"clsx\";\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 (...args: T) => {\n\t\tclearTimeout(timer);\n\t\ttimer = setTimeout(() => callback(...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\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/**\n * Scroller targes helping anchorPosition\n */\nconst SCROLLER = IS_BROWSER ? document.createElement(\"div\") : null; // Used to ensure we have scrollability under\nconst TARGETS = new Map<Element, () => void>(); // Store current open poppers and their update functions\nconst TARGETS_UPDATE = () => {\n\tfor (const [_, update] of TARGETS) update();\n};\n\nif (SCROLLER) {\n\tSCROLLER.style.cssText = \"position:absolute;padding:1px;top:0;left:0px\";\n\ton(window, \"load,resize,scroll\", TARGETS_UPDATE, QUICK_EVENT);\n}\n\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(\n\ttarget: HTMLElement,\n\tanchor: Element | false,\n\tposition?: string | number,\n) {\n\tif (anchor === false || !anchor.isConnected || !target.isConnected)\n\t\treturn TARGETS.delete(target); // Stop watching if anchor is removed from DOM\n\tif (!SCROLLER?.isConnected) document.body.append(SCROLLER || \"\"); // Ensure we have the scroller\n\tif (!TARGETS.has(target)) {\n\t\t// Setup new target or update position\n\t\tconst place =\n\t\t\tPOSITION[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(\n\t\t\ttarget,\n\t\t)?.(); // Start watching if not already watching\n\t}\n\n\tconst isHTMLAnchor = anchor instanceof HTMLElement; // SVG or XML elements does not have offsetWidth or offsetHeight\n\tconst { offsetWidth: targetW, offsetHeight: targetH } = target;\n\tconst anchorW = isHTMLAnchor ? anchor.offsetWidth : anchor.clientWidth;\n\tconst anchorH = isHTMLAnchor ? anchor.offsetHeight : anchor.clientHeight;\n\tconst { width, height, left, top } = anchor.getBoundingClientRect();\n\tconst anchorX = Math.round(left - (anchorW - width) / 2); // Correct for CSS transform scale\n\tconst 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 =\n\t\t(position === POSITION.bottom && hasSpaceRight) || !hasSpaceLeft; // Always position right when no hasSpaceLeft, as no OS scrolls further up than 0\n\tconst positionUnder =\n\t\t(position === POSITION.bottom && hasSpaceUnder) || !hasSpaceOver; // Always position under when no hasSpaceOver, as no OS scrolls further up than 0\n\tconst centerX = Math.min(\n\t\tMath.max(10, anchorX - (targetW - anchorW) / 2),\n\t\twindow.innerWidth - targetW - 10,\n\t);\n\tconst centerY = Math.min(\n\t\tMath.max(10, anchorY - (targetH - anchorH) / 2),\n\t\twindow.innerHeight - targetH - 10,\n\t);\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\ttarget.style.top = `${Math.round(isVertical ? (positionUnder ? anchorY + anchorH : anchorY - targetH) : centerY)}px`;\n\tSCROLLER?.style.setProperty(\n\t\t\"translate\",\n\t\t`${Math.round(window.scrollX + anchorX + anchorW + targetW + 30)}px ${Math.round(window.scrollY + anchorY + anchorH + targetH + 30)}px`,\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 createOptimizedMutationObserver(callback: MutationCallback) {\n\tlet 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\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\n\treturn observer;\n}\n\n/**\n * onMutation\n * @description Utility to quickly observe mutations on a specific class name\n * @param el 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\n */\nconst MUTATORS = new WeakMap<Element, Array<() => void>>();\nexport const onMutation = <T extends Element>(\n\tel: Element,\n\tclassName: string,\n\tcallback: (elems: HTMLCollectionOf<T>) => void,\n) => {\n\tconst elems = el.getElementsByClassName(className);\n\tconst mutator = MUTATORS.get(el) || [];\n\n\tif (!mutator.length) {\n\t\tMUTATORS.set(el, mutator);\n\t\tcreateOptimizedMutationObserver((_, observer) => {\n\t\t\tif (el.isConnected && mutator?.length) {\n\t\t\t\tfor (const callback of mutator) callback();\n\t\t\t} else {\n\t\t\t\tobserver?.disconnect();\n\t\t\t\tMUTATORS.delete(el);\n\t\t\t}\n\t\t}).observe(el, {\n\t\t\tattributeFilter: [\"class\"],\n\t\t\tattributes: true,\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t});\n\t}\n\tmutator.push(() => callback(elems as HTMLCollectionOf<T>));\n};\n\n/**\n * onLoaded\n * @description Runs a callback when window is loaded in browser\n * @param callback The callback to run when the page is ready\n */\nexport const onLoaded = (callback: () => void) => {\n\tif (!IS_BROWSER) return;\n\tif (document.readyState === \"complete\")\n\t\twindow.requestAnimationFrame(callback); // Ensure we run after all other load events\n\telse on(window, \"load\", callback);\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 */\nexport const toCustomElementProps = (\n\t{ className, hidden, open, ...rest }: Record<string, unknown>,\n\tklass?: string,\n) => {\n\trest.class = clsx(klass, className || \"\") || undefined; // 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"],"names":["QUICK_EVENT","IS_BROWSER","attr","el","name","value","id","UUID","useId","events","action","element","rest","type","on","SCROLLER","TARGETS","TARGETS_UPDATE","_","update","POSITION","anchorPosition","target","anchor","position","place","_a","isHTMLAnchor","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","onMutation","className","elems","mutator","onLoaded","isInputLike","toCustomElementProps","hidden","open","klass","clsx"],"mappings":"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"}