@mattilsynet/design 0.2.19 → 0.2.21

package/mtds/styles.json

@@ -1,33 +1,32 @@
 {
-  "validation": "_validation_1rgmg_1 _ds-validation-message_1w6ss_1",
-  "tag": "_tag_1rgmg_1 _ds-tag_1w6ss_1",
-  "tabs": "_tabs_1rgmg_1 _ds-tabs_1w6ss_1",
-  "table": "_table_1rgmg_1 _ds-table_1w6ss_1",
-  "scrollShadow": "_scrollShadow_1rgmg_1",
-  "skeleton": "_skeleton_1rgmg_1 _ds-skeleton_1w6ss_1",
-  "popover": "_popover_1rgmg_1",
-  "pagination": "_pagination_1rgmg_1 _ds-pagination_1w6ss_1",
-  "modal": "_modal_1rgmg_1 _ds-modal_1w6ss_1",
-  "logo": "_logo_1rgmg_1 _ds-focus_1w6ss_1",
-  "link": "_link_1rgmg_1",
-  "grid": "_grid_1rgmg_1",
-  "flex": "_flex_1rgmg_1",
-  "input": "_input_1rgmg_1 _ds-input_1w6ss_1",
-  "fieldset": "_fieldset_1rgmg_1 _ds-fieldset_1w6ss_1",
-  "field": "_field_1rgmg_1 _ds-field_1w6ss_1",
-  "affixes": "_affixes_1rgmg_1 _ds-field-affixes_1w6ss_1",
-  "count": "_count_1rgmg_1",
-  "errorsummary": "_errorsummary_1rgmg_1 _ds-error-summary_1w6ss_1",
-  "details": "_details_1rgmg_1 _ds-details_1w6ss_1",
-  "chip": "_chip_1rgmg_1 _ds-chip_1w6ss_1",
-  "card": "_card_1rgmg_1",
-  "info": "_info_1rgmg_1",
-  "button": "_button_1rgmg_1 _ds-button_1w6ss_1",
-  "breadcrumbs": "_breadcrumbs_1rgmg_1 _ds-breadcrumbs_1w6ss_1",
-  "badge": "_badge_1rgmg_1",
-  "avatar": "_avatar_1rgmg_1 _ds-avatar_1w6ss_1",
-  "alert": "_alert_1rgmg_1 _ds-alert_1w6ss_1",
-  "heading": "_heading_1rgmg_1 _ds-heading_1w6ss_1",
-  "body": "_body_1rgmg_116",
-  "tooltip": "_tooltip_1rgmg_131"
+  "tooltip": "_tooltip_ipkht_1",
+  "alert": "_alert_ipkht_1 _ds-alert_1w6ss_1",
+  "avatar": "_avatar_ipkht_1 _ds-avatar_1w6ss_1",
+  "badge": "_badge_ipkht_1",
+  "breadcrumbs": "_breadcrumbs_ipkht_1 _ds-breadcrumbs_1w6ss_1",
+  "button": "_button_ipkht_1 _ds-button_1w6ss_1",
+  "card": "_card_ipkht_1",
+  "chip": "_chip_ipkht_1 _ds-chip_1w6ss_1",
+  "details": "_details_ipkht_1 _ds-details_1w6ss_1",
+  "errorsummary": "_errorsummary_ipkht_1 _ds-error-summary_1w6ss_1",
+  "field": "_field_ipkht_1 _ds-field_1w6ss_1",
+  "affixes": "_affixes_ipkht_1 _ds-field-affixes_1w6ss_1",
+  "count": "_count_ipkht_1",
+  "fieldset": "_fieldset_ipkht_1 _ds-fieldset_1w6ss_1",
+  "heading": "_heading_ipkht_1 _ds-heading_1w6ss_1",
+  "input": "_input_ipkht_1 _ds-input_1w6ss_1",
+  "grid": "_grid_ipkht_1",
+  "flex": "_flex_ipkht_1",
+  "link": "_link_ipkht_1",
+  "logo": "_logo_ipkht_1 _ds-focus_1w6ss_1",
+  "modal": "_modal_ipkht_1 _ds-modal_1w6ss_1",
+  "pagination": "_pagination_ipkht_1 _ds-pagination_1w6ss_1",
+  "popover": "_popover_ipkht_1",
+  "skeleton": "_skeleton_ipkht_1 _ds-skeleton_1w6ss_1",
+  "table": "_table_ipkht_1 _ds-table_1w6ss_1",
+  "scrollShadow": "_scrollShadow_ipkht_1",
+  "tabs": "_tabs_ipkht_1 _ds-tabs_1w6ss_1",
+  "tag": "_tag_ipkht_1 _ds-tag_1w6ss_1",
+  "validation": "_validation_ipkht_1 _ds-validation-message_1w6ss_1",
+  "body": "_body_ipkht_115"
 }

package/mtds/styles.module.css.js

@@ -1,68 +1,66 @@
-const _ = "_validation_1rgmg_1 _ds-validation-message_1w6ss_1", s = "_tag_1rgmg_1 _ds-tag_1w6ss_1", t = "_tabs_1rgmg_1 _ds-tabs_1w6ss_1", o = "_table_1rgmg_1 _ds-table_1w6ss_1", g = "_scrollShadow_1rgmg_1", a = "_skeleton_1rgmg_1 _ds-skeleton_1w6ss_1", r = "_popover_1rgmg_1", n = "_pagination_1rgmg_1 _ds-pagination_1w6ss_1", d = "_modal_1rgmg_1 _ds-modal_1w6ss_1", e = "_logo_1rgmg_1 _ds-focus_1w6ss_1", i = "_link_1rgmg_1", l = "_grid_1rgmg_1", c = "_flex_1rgmg_1", m = "_input_1rgmg_1 _ds-input_1w6ss_1", b = "_fieldset_1rgmg_1 _ds-fieldset_1w6ss_1", f = "_field_1rgmg_1 _ds-field_1w6ss_1", w = "_affixes_1rgmg_1 _ds-field-affixes_1w6ss_1", p = "_count_1rgmg_1", u = "_errorsummary_1rgmg_1 _ds-error-summary_1w6ss_1", h = "_details_1rgmg_1 _ds-details_1w6ss_1", v = "_chip_1rgmg_1 _ds-chip_1w6ss_1", x = "_card_1rgmg_1", y = "_info_1rgmg_1", k = "_button_1rgmg_1 _ds-button_1w6ss_1", S = "_breadcrumbs_1rgmg_1 _ds-breadcrumbs_1w6ss_1", j = "_badge_1rgmg_1", q = "_avatar_1rgmg_1 _ds-avatar_1w6ss_1", z = "_alert_1rgmg_1 _ds-alert_1w6ss_1", A = "_heading_1rgmg_1 _ds-heading_1w6ss_1", B = "_body_1rgmg_116", C = "_tooltip_1rgmg_131", D = {
-  validation: _,
-  tag: s,
-  tabs: t,
-  table: o,
-  scrollShadow: g,
-  skeleton: a,
-  popover: r,
-  pagination: n,
-  modal: d,
-  logo: e,
-  link: i,
-  grid: l,
-  flex: c,
-  input: m,
-  fieldset: b,
-  field: f,
-  affixes: w,
-  count: p,
-  errorsummary: u,
-  details: h,
-  chip: v,
-  card: x,
-  info: y,
-  button: k,
-  breadcrumbs: S,
-  badge: j,
-  avatar: q,
-  alert: z,
-  heading: A,
-  body: B,
-  tooltip: C
+const _ = "_alert_ipkht_1 _ds-alert_1w6ss_1", s = "_avatar_ipkht_1 _ds-avatar_1w6ss_1", t = "_badge_ipkht_1", o = "_breadcrumbs_ipkht_1 _ds-breadcrumbs_1w6ss_1", i = "_button_ipkht_1 _ds-button_1w6ss_1", a = "_card_ipkht_1", d = "_chip_ipkht_1 _ds-chip_1w6ss_1", n = "_details_ipkht_1 _ds-details_1w6ss_1", e = "_errorsummary_ipkht_1 _ds-error-summary_1w6ss_1", l = "_field_ipkht_1 _ds-field_1w6ss_1", p = "_affixes_ipkht_1 _ds-field-affixes_1w6ss_1", c = "_count_ipkht_1", r = "_fieldset_ipkht_1 _ds-fieldset_1w6ss_1", h = "_heading_ipkht_1 _ds-heading_1w6ss_1", k = "_input_ipkht_1 _ds-input_1w6ss_1", b = "_grid_ipkht_1", w = "_flex_ipkht_1", f = "_link_ipkht_1", g = "_logo_ipkht_1 _ds-focus_1w6ss_1", u = "_modal_ipkht_1 _ds-modal_1w6ss_1", m = "_pagination_ipkht_1 _ds-pagination_1w6ss_1", v = "_popover_ipkht_1", x = "_skeleton_ipkht_1 _ds-skeleton_1w6ss_1", y = "_table_ipkht_1 _ds-table_1w6ss_1", S = "_scrollShadow_ipkht_1", j = "_tabs_ipkht_1 _ds-tabs_1w6ss_1", q = "_tag_ipkht_1 _ds-tag_1w6ss_1", z = "_tooltip_ipkht_1", A = "_validation_ipkht_1 _ds-validation-message_1w6ss_1", B = "_body_ipkht_115", C = {
+  alert: _,
+  avatar: s,
+  badge: t,
+  breadcrumbs: o,
+  button: i,
+  card: a,
+  chip: d,
+  details: n,
+  errorsummary: e,
+  field: l,
+  affixes: p,
+  count: c,
+  fieldset: r,
+  heading: h,
+  input: k,
+  grid: b,
+  flex: w,
+  link: f,
+  logo: g,
+  modal: u,
+  pagination: m,
+  popover: v,
+  skeleton: x,
+  table: y,
+  scrollShadow: S,
+  tabs: j,
+  tag: q,
+  tooltip: z,
+  validation: A,
+  body: B
 };
 export {
-  w as affixes,
-  z as alert,
-  q as avatar,
-  j as badge,
+  p as affixes,
+  _ as alert,
+  s as avatar,
+  t as badge,
   B as body,
-  S as breadcrumbs,
-  k as button,
-  x as card,
-  v as chip,
-  p as count,
-  D as default,
-  h as details,
-  u as errorsummary,
-  f as field,
-  b as fieldset,
-  c as flex,
-  l as grid,
-  A as heading,
-  y as info,
-  m as input,
-  i as link,
-  e as logo,
-  d as modal,
-  n as pagination,
-  r as popover,
-  g as scrollShadow,
-  a as skeleton,
-  o as table,
-  t as tabs,
-  s as tag,
-  C as tooltip,
-  _ as validation
+  o as breadcrumbs,
+  i as button,
+  a as card,
+  d as chip,
+  c as count,
+  C as default,
+  n as details,
+  e as errorsummary,
+  l as field,
+  r as fieldset,
+  w as flex,
+  b as grid,
+  h as heading,
+  k as input,
+  f as link,
+  g as logo,
+  u as modal,
+  m as pagination,
+  v as popover,
+  S as scrollShadow,
+  x as skeleton,
+  y as table,
+  j as tabs,
+  q as tag,
+  z as tooltip,
+  A 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/tooltip/tooltip.d.ts

@@ -0,0 +1 @@
+export {};

package/mtds/tooltip/tooltip.js

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

package/mtds/tooltip/tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.js","sources":["../../designsystem/tooltip/tooltip.ts"],"sourcesContent":["import { IS_BROWSER, QUICK_EVENT, anchorPosition, attr, on } from \"../utils\";\nimport styles from './tooltip.module.css';\n\nconst DESCRIBEDBY = 'aria-describedby';\nconst LABELLEDBY = 'aria-labelledby';\nconst POSITION_CSS_PROPERTY = '--mtds-tooltip-position';\nconst THROTTLE_DELAY = 100;\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 }: Event) {\n  const wait = LAST_CALL + THROTTLE_DELAY - Date.now();\n  clearTimeout(THROTTLE);\n  THROTTLE = setTimeout(handleMoveThrottled, Math.max(wait, 0), target);\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?.getAttribute('data-tooltip') || '';\n  const position = anchor?.getAttribute('data-tooltip-position') || window.getComputedStyle(anchor || document.body).getPropertyValue(POSITION_CSS_PROPERTY) || 'top';\n  const hasLabel = Boolean(anchor?.innerText.trim()) || anchor?.hasAttribute(LABELLEDBY) || anchor?.hasAttribute('aria-label');\n\n  if (!content || content === 'false' || content === 'true' || position === 'none') anchor = null; // Do not show tooltip if boolish value\n  if (anchor) TOOLTIP.textContent = content; // Only update content if new anchor\n\n  ANCHOR?.removeAttribute(ANCHOR.getAttribute(LABELLEDBY) === TOOLTIP_ID ? 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  ANCHOR?.setAttribute(hasLabel ? DESCRIBEDBY : LABELLEDBY, TOOLTIP_ID); // Use tooltip as description if allready has label\n  TOOLTIP.togglePopover(!!anchor);\n  anchorPosition(TOOLTIP, anchor, 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(...styles.tooltip.split(' '));\n  TOOLTIP.id = TOOLTIP_ID;\n  attr(TOOLTIP, 'popover', 'manual');\n  on(document, 'blur,focus,mouseout,mouseover', handleMove, QUICK_EVENT);\n  on(window, 'blur', handleMove, QUICK_EVENT);\n}"],"names":["DESCRIBEDBY","LABELLEDBY","POSITION_CSS_PROPERTY","THROTTLE_DELAY","TOOLTIP_ID","ANCHOR","LAST_CALL","THROTTLE","TOOLTIP","handleMove","target","wait","handleMoveThrottled","anchor","_a","content","position","hasLabel","anchorPosition","IS_BROWSER","styles","attr","on","QUICK_EVENT"],"mappings":";;AAGA,MAAMA,IAAc,oBACdC,IAAa,mBACbC,IAAwB,2BACxBC,IAAiB,KACjBC,IAAa;AAEnB,IAAIC,IAA6B,MAC7BC,IAAY,OAAO,mBACnBC,IAAmD,GACnDC,IAA8B;AAElC,SAASC,EAAW,EAAE,QAAAC,KAAiB;AACrC,QAAMC,IAAOL,IAAYH,IAAiB,KAAK,IAAI;AACnD,eAAaI,CAAQ,GACrBA,IAAW,WAAWK,GAAqB,KAAK,IAAID,GAAM,CAAC,GAAGD,CAAM;AACtE;AAGA,SAASE,EAAoBF,GAAwB;;AAG/C,MAFJJ,IAAY,KAAK,IAAI,GAEjB,CAACE,KAAWE,MAAWF,EAAS;AACpC,MAAIK,MAASC,IAAAJ,KAAA,gBAAAA,EAAQ,YAAR,gBAAAI,EAAA,KAAAJ,GAA+B,sBAAqB;AAGjE,MAAIG,MAAWR,EAAQ;AAEvB,QAAMU,KAAUF,KAAA,gBAAAA,EAAQ,aAAa,oBAAmB,IAClDG,KAAWH,KAAA,gBAAAA,EAAQ,aAAa,6BAA4B,OAAO,iBAAiBA,KAAU,SAAS,IAAI,EAAE,iBAAiBX,CAAqB,KAAK,OACxJe,IAAW,GAAQJ,KAAA,QAAAA,EAAQ,UAAU,YAAWA,KAAA,gBAAAA,EAAQ,aAAaZ,QAAeY,KAAA,gBAAAA,EAAQ,aAAa;AAE3G,GAAA,CAACE,KAAWA,MAAY,WAAWA,MAAY,UAAUC,MAAa,YAAiBH,IAAA,OACvFA,QAAgB,cAAcE,IAElCV,KAAA,QAAAA,EAAQ,gBAAgBA,EAAO,aAAaJ,CAAU,MAAMG,IAAaH,IAAaD,IACtFkB,EAAeV,GAAS,EAAK,GAEpBH,IAAAQ,GACTR,KAAA,QAAAA,EAAQ,aAAaY,IAAWjB,IAAcC,GAAYG,IAClDI,EAAA,cAAc,CAAC,CAACK,CAAM,GACfK,EAAAV,GAASK,GAAQG,CAAQ;AAC1C;AAGIG,KAAc,CAAC,SAAS,eAAef,CAAU,MACnDI,IAAU,SAAS,KAAK,YAAY,SAAS,cAAc,KAAK,CAAC,GACjEA,EAAQ,UAAU,IAAI,GAAGY,EAAO,QAAQ,MAAM,GAAG,CAAC,GAClDZ,EAAQ,KAAKJ,GACRiB,EAAAb,GAAS,WAAW,QAAQ,GAC9Bc,EAAA,UAAU,iCAAiCb,GAAYc,CAAW,GAClED,EAAA,QAAQ,QAAQb,GAAYc,CAAW;"}

package/mtds/tooltip/tooltip.module.css.js

@@ -0,0 +1,8 @@
+const t = "_tooltip_1pse6_5", o = {
+  tooltip: t
+};
+export {
+  o as default,
+  t as tooltip
+};
+//# sourceMappingURL=tooltip.module.css.js.map

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

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

package/mtds/utils.js

@@ -1,62 +1,61 @@
 const w = typeof window < "u" && typeof document < "u", U = { capture: !0, passive: !0 };
-function E(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);
+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 B = 0;
-const I = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;
-function R(t) {
-  return t.id || (t.id = `${I}${++B}`), t.id;
+let E = 0;
+const O = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;
+function X(t) {
+  return t.id || (t.id = `${O}${++E}`), t.id;
 }
-const b = (t, e, n) => {
-  for (const i of n[0].split(","))
-    n[0] = i, e[`${t}EventListener`](...n);
-}, O = (t, ...e) => b("add", t, e), X = (t, ...e) => b("remove", t, e), l = /* @__PURE__ */ new Map(), s = w ? document.createElement("div") : null;
-s && E(s, "style", "position:absolute;padding:1px;top:0;left:0px");
-w && O(window, "load,resize,scroll", () => {
-  for (const [t, e] of l) e();
+const b = (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;
+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();
 }, U);
-const c = { top: 0, right: 1, bottom: 2, left: 3, none: 4 };
-function _(t, e, n) {
+const d = { top: 0, right: 1, bottom: 2, left: 3 };
+function _(t, e, o) {
   var p;
-  if (!e || !e.isConnected || !t.isConnected) return l.delete(t);
-  if (s != null && s.isConnected || document.body.append(s || ""), !l.has(t)) {
-    const C = c[n] ?? c.bottom;
-    return (p = l.set(t, () => _(t, e, C)).get(t)) == null ? void 0 : p();
+  if (!e || !e.isConnected || !t.isConnected) return a.delete(t);
+  if (s != null && s.isConnected || document.body.append(s || ""), !a.has(t)) {
+    const I = d[o] ?? d.bottom;
+    return (p = a.set(t, () => _(t, e, I)).get(t)) == null ? void 0 : p();
   }
-  if (n === c.none) return t.style.setProperty("left", "-100vw");
-  const { offsetWidth: i, offsetHeight: o } = t, { offsetWidth: r, offsetHeight: u } = e, { width: M, height: m, left: v, top: y } = e.getBoundingClientRect(), f = Math.round(v - (r - M) / 2), d = Math.round(y - (u - m) / 2), g = f - i > 0, A = r + r + i < window.innerWidth, T = d - o > 0, H = d + u + o < window.innerHeight, $ = n === c.bottom && A || !g, x = n === c.bottom && H || !T, S = Math.min(Math.max(10, f - (i - r) / 2), window.innerWidth - i - 10), W = Math.min(Math.max(10, d - (o - u) / 2), window.innerHeight - o - 10), h = n === c.top || n === c.bottom;
-  t.style.left = `${Math.round(h ? S : $ ? f + r : f - i)}px`, t.style.top = `${Math.round(h ? x ? d + u : d - o : W)}px`, s == null || s.style.setProperty("translate", `${Math.round(window.scrollX + f + r + i + 30)} ${Math.round(window.scrollY + d + u + o + 30)}px`);
+  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;
+  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) {
   let e = 0;
-  const n = () => setTimeout(i, 200), i = () => {
-    t([], o), e = 0;
-  }, o = new MutationObserver(() => {
-    e || (e = requestAnimationFrame(n));
+  const o = () => setTimeout(i, 200), i = () => {
+    t([], n), e = 0;
+  }, n = new MutationObserver(() => {
+    e || (e = requestAnimationFrame(o));
   });
-  return o;
+  return n;
 }
-const a = /* @__PURE__ */ new WeakMap(), P = (t) => {
-  var n;
-  const e = a.get(t);
+const l = /* @__PURE__ */ new WeakMap(), P = (t) => {
+  var o;
+  const e = l.get(t);
   if (!e || !t.isConnected)
-    (n = e == null ? void 0 : e.observer) == null || n.disconnect(), a.delete(t);
+    (o = e == null ? void 0 : e.observer) == null || o.disconnect(), l.delete(t);
   else for (const [, i] of e.collections) i();
-}, Y = (t, e, n) => {
+}, k = (t, e, o) => {
   const i = t.getElementsByClassName(e);
-  let o = a.get(t);
-  o || (o = { collections: /* @__PURE__ */ new Map(), observer: F(() => P(t)) }, o.observer.observe(t, { childList: !0, subtree: !0, attributes: !0, attributeFilter: ["class"] }), a.set(t, o)), n ? o.collections.set(e, () => n(i)) : o.collections.delete(e);
-}, k = (t) => t instanceof HTMLElement && "validity" in t && !(t instanceof HTMLButtonElement);
+  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);
 export {
   w as IS_BROWSER,
   U as QUICK_EVENT,
   _ as anchorPosition,
-  E as attr,
+  C as attr,
   F as createOptimizedMutationObserver,
-  k as isInputLike,
-  X as off,
-  O as on,
-  Y as onMutation,
-  R as useId
+  q as isInputLike,
+  Y as off,
+  B as on,
+  k as onMutation,
+  X 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 */\ntype AnchorKeys = keyof typeof ANCHOR;\nconst ANCHOR = { top: 0, right: 1, bottom: 2, left: 3, none: 4 }; // Speed up by using a const map\n\nexport function anchorPosition (target: HTMLElement, anchor: HTMLElement | null | false, position?: string | number) {\n\tif (!anchor || !anchor.isConnected || !target.isConnected) return TARGETS.delete(target); // Stop watchning 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 = ANCHOR[position as keyof typeof ANCHOR] ?? ANCHOR.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\tif (position === ANCHOR.none) return target.style.setProperty('left', '-100vw'); // Hide target if anchor is set to none\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 === ANCHOR.bottom && hasSpaceRight) || !hasSpaceLeft // Always position right when no hasSpaceLeft, as no OS scrolls further up than 0\n\tconst positionUnder = (position === ANCHOR.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 === ANCHOR.top || position === ANCHOR.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=\"\"target attribute\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","ANCHOR","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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"}
+{"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 | null | false, position?: string | number) {\n\tif (!anchor || !anchor.isConnected || !target.isConnected) return TARGETS.delete(target); // Stop watchning 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=\"\"target attribute\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": "0.2.19",
+	"version": "0.2.21",
 	"type": "module",
 	"main": "./mtds/index.js",
 	"types": "./mtds/index.d.ts",

package/mtds/tooltip.js

@@ -1,18 +0,0 @@
-import T from "./styles.module.css.js";
-import { IS_BROWSER as b, attr as c, on as d, QUICK_EVENT as u, useId as f, anchorPosition as s } from "./utils.js";
-const E = "--mtds-tooltip-position", I = 100;
-let l = null, m = Number.NEGATIVE_INFINITY, a = 0, e = null;
-b && (e = document.body.appendChild(document.createElement("div")), e.classList.add(...T.tooltip.split(" ")), c(e, "popover", "manual"), d(document, "blur,focus,mouseout,mouseover", p, u), d(window, "blur", p, u));
-function p({ target: o }) {
-  const t = m + I - Date.now();
-  clearTimeout(a), a = setTimeout(L, Math.max(t, 0), o);
-}
-function L(o) {
-  var n;
-  if (m = Date.now(), !e || o === e) return;
-  let t = ((n = o == null ? void 0 : o.closest) == null ? void 0 : n.call(o, "[data-tooltip],[data-expanded]")) || null;
-  if (t === l) return;
-  const i = (t == null ? void 0 : t.getAttribute("data-tooltip")) || (t == null ? void 0 : t.getAttribute("data-expanded")) || e.textContent || "", r = (t == null ? void 0 : t.getAttribute("data-tooltip-position")) || window.getComputedStyle(t || document.body).getPropertyValue(E) || "top";
-  (!i || i === "false" || i === "true") && (t = null), l == null || l.removeAttribute("aria-labelledby"), l = t, l == null || l.setAttribute("aria-labelledby", f(e)), e.togglePopover(!!t), e.replaceChildren(i), s(e, !1), s(e, t, r);
-}
-//# sourceMappingURL=tooltip.js.map

package/mtds/tooltip.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tooltip.js","sources":["../designsystem/tooltip.ts"],"sourcesContent":["import styles from './styles.module.css';\nimport { IS_BROWSER, QUICK_EVENT, anchorPosition, attr, on, useId } from \"./utils\";\n\nconst POSITION_CSS_PROPERTY = '--mtds-tooltip-position';\nconst THROTTLE_DELAY = 100;\nlet ANCHOR: Element | null = null;\nlet LAST_CALL = Number.NEGATIVE_INFINITY;\nlet THROTTLE: number | ReturnType<typeof setTimeout> = 0;\nlet TOOLTIP: HTMLElement | null = null;\n\nif (IS_BROWSER) {\n  TOOLTIP = document.body.appendChild(document.createElement('div'));\n  TOOLTIP.classList.add(...styles.tooltip.split(' '));\n  attr(TOOLTIP, 'popover', 'manual');\n  on(document, 'blur,focus,mouseout,mouseover', handleMove, QUICK_EVENT);\n  on(window, 'blur', handleMove, QUICK_EVENT);\n}\n\nfunction handleMove({ target }: Event) {\n  const wait = LAST_CALL + THROTTLE_DELAY - Date.now();\n  clearTimeout(THROTTLE);\n  THROTTLE = setTimeout(handleMoveThrottled, Math.max(wait, 0), target);\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],[data-expanded]') || null;\n  \n  // No need to update\n  if (anchor === ANCHOR) return;\n\n  // Do not show tooltip if boolish value\n  const content = anchor?.getAttribute('data-tooltip') || anchor?.getAttribute('data-expanded') || TOOLTIP.textContent || '';\n  const position = anchor?.getAttribute('data-tooltip-position') || window.getComputedStyle(anchor || document.body).getPropertyValue(POSITION_CSS_PROPERTY) || 'top';\n  if (!content || content === 'false' || content === 'true') anchor = null;\n  \n  ANCHOR?.removeAttribute('aria-labelledby'); // Unbind previous anchor\n  ANCHOR = anchor; // Store new anchor - might be null if no new anchor\n\n  ANCHOR?.setAttribute('aria-labelledby', useId(TOOLTIP));\n  TOOLTIP.togglePopover(!!anchor);\n  TOOLTIP.replaceChildren(content);\n  anchorPosition(TOOLTIP, false); // Reset anchor position\n  anchorPosition(TOOLTIP, anchor, position);\n}"],"names":["POSITION_CSS_PROPERTY","THROTTLE_DELAY","ANCHOR","LAST_CALL","THROTTLE","TOOLTIP","IS_BROWSER","styles","attr","on","handleMove","QUICK_EVENT","target","wait","handleMoveThrottled","anchor","_a","content","position","useId","anchorPosition"],"mappings":";;AAGA,MAAMA,IAAwB,2BACxBC,IAAiB;AACvB,IAAIC,IAAyB,MACzBC,IAAY,OAAO,mBACnBC,IAAmD,GACnDC,IAA8B;AAE9BC,MACFD,IAAU,SAAS,KAAK,YAAY,SAAS,cAAc,KAAK,CAAC,GACjEA,EAAQ,UAAU,IAAI,GAAGE,EAAO,QAAQ,MAAM,GAAG,CAAC,GAC7CC,EAAAH,GAAS,WAAW,QAAQ,GAC9BI,EAAA,UAAU,iCAAiCC,GAAYC,CAAW,GAClEF,EAAA,QAAQ,QAAQC,GAAYC,CAAW;AAG5C,SAASD,EAAW,EAAE,QAAAE,KAAiB;AACrC,QAAMC,IAAOV,IAAYF,IAAiB,KAAK,IAAI;AACnD,eAAaG,CAAQ,GACrBA,IAAW,WAAWU,GAAqB,KAAK,IAAID,GAAM,CAAC,GAAGD,CAAM;AACtE;AAGA,SAASE,EAAoBF,GAAwB;;AAG/C,MAFJT,IAAY,KAAK,IAAI,GAEjB,CAACE,KAAWO,MAAWP,EAAS;AACpC,MAAIU,MAASC,IAAAJ,KAAA,gBAAAA,EAAQ,YAAR,gBAAAI,EAAA,KAAAJ,GAA+B,sCAAqC;AAGjF,MAAIG,MAAWb,EAAQ;AAGjB,QAAAe,KAAUF,KAAA,gBAAAA,EAAQ,aAAa,qBAAmBA,KAAA,gBAAAA,EAAQ,aAAa,qBAAoBV,EAAQ,eAAe,IAClHa,KAAWH,KAAA,gBAAAA,EAAQ,aAAa,6BAA4B,OAAO,iBAAiBA,KAAU,SAAS,IAAI,EAAE,iBAAiBf,CAAqB,KAAK;AAC9J,GAAI,CAACiB,KAAWA,MAAY,WAAWA,MAAY,YAAiBF,IAAA,OAEpEb,KAAA,QAAAA,EAAQ,gBAAgB,oBACfA,IAAAa,GAETb,KAAA,QAAAA,EAAQ,aAAa,mBAAmBiB,EAAMd,CAAO,IAC7CA,EAAA,cAAc,CAAC,CAACU,CAAM,GAC9BV,EAAQ,gBAAgBY,CAAO,GAC/BG,EAAef,GAAS,EAAK,GACde,EAAAf,GAASU,GAAQG,CAAQ;AAC1C;"}