@mattilsynet/design 2.2.29 → 2.2.31

package/mtds/chart/chart-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-element.js","sources":["../../designsystem/chart/chart-element.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport {\n\tattr,\n\tdefineElement,\n\tisBrowser,\n\tMTDSElement,\n\toff,\n\ton,\n\tonMutation,\n\tonResize,\n\ttag,\n} from \"../utils\";\nimport css from \"./chart.css?raw\";\nimport { toAxis } from \"./chart-axis\";\nimport { toBars } from \"./chart-bars\";\nimport { toLines } from \"./chart-lines\";\nimport { toPies } from \"./chart-pies\";\n\nexport type ChartData = ReturnType<typeof toData>;\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t\"mtds-chart\": MTDSChartElement;\n\t}\n}\n\nconst EVENTS = \"click,keydown,mousemove,mouseout\";\nconst TOOLTIP_ID = \"mtds-chart-tooltip\";\nconst TOOLTIP = isBrowser()\n\t? document.getElementById(TOOLTIP_ID) ||\n\t\ttag(\"div\", {\n\t\t\t\"aria-hidden\": \"true\",\n\t\t\tclass: styles._tooltip,\n\t\t\thidden: \"\",\n\t\t\tid: TOOLTIP_ID,\n\t\t})\n\t: null;\n\nexport class MTDSChartElement extends MTDSElement {\n\t#unmutate?: () => void;\n\t#unresize?: () => void;\n\n\tstatic get observedAttributes() {\n\t\treturn [\"data-variant\", \"data-aspect\"]; // Using ES2015 syntax for backwards compatibility\n\t}\n\tconstructor() {\n\t\tsuper();\n\t\tthis.attachShadow({ mode: \"open\" });\n\t}\n\tconnectedCallback() {\n\t\tthis.#unresize = onResize(() => this.handleResize(), this);\n\t\tthis.#unmutate = onMutation(() => this.attributeChangedCallback(), {\n\t\t\tattr: \"data-tooltip\",\n\t\t\troot: this,\n\t\t});\n\t\tthis.attributeChangedCallback(); // Initial setup\n\t\ton(this, EVENTS, this);\n\t}\n\tdisconnectedCallback() {\n\t\tif (TOOLTIP) TOOLTIP.hidden = true;\n\t\toff(this, EVENTS, this);\n\t\tthis.#unresize?.();\n\t\tthis.#unmutate?.();\n\t\tthis.#unmutate = this.#unresize = undefined;\n\t}\n\tattributeChangedCallback() {\n\t\tArray.from(this.shadowRoot?.children || []).map((el) => el.remove()); // Clear shadowRoot\n\n\t\tconst [variant, type] = (attr(this, \"data-variant\") || \"column\").split(\"-\");\n\t\tconst aspect = attr(this, \"data-aspect\") || undefined;\n\t\tconst data = toData(this.querySelector(\"table\"));\n\t\tconst style = tag(\"style\", {}, css);\n\t\tconst legend = tag(\"div\", {\n\t\t\t\"aria-hidden\": \"hidden\",\n\t\t\tclass: \"legends\",\n\t\t\trole: \"group\",\n\t\t});\n\t\tdata.slice(1).forEach(([{ value, style }]) => {\n\t\t\tlegend.appendChild(tag(\"div\", { class: \"legend\", style }, value));\n\t\t});\n\n\t\tconst { axis, groups, total } = toAxis(data, { aspect, type });\n\t\tif (variant === \"column\" || variant === \"bar\")\n\t\t\tgroups.append(...toBars(data));\n\t\tif (variant === \"line\" || variant === \"area\")\n\t\t\tgroups.append(toLines(data, { total, variant, type }));\n\t\tif (variant === \"doughnut\" || variant === \"pie\")\n\t\t\tthis.shadowRoot?.append(toPies(data, { aspect, variant }));\n\n\t\tthis.shadowRoot?.append(axis, legend, style); // Axis must be first\n\t}\n\thandleEvent(e: Event) {\n\t\tif (e.type === \"click\" || e.type === \"keydown\") onClick(e, this);\n\t\telse onMoveTooltip(e as MouseEvent);\n\t}\n\thandleResize() {\n\t\tconst axis = this.shadowRoot?.firstElementChild as HTMLElement | null;\n\t\tconst steps = axis?.firstElementChild as HTMLElement | null;\n\t\taxis?.classList.toggle(\"axisStepsYHalf\", (steps?.offsetHeight || 0) < 400);\n\t\taxis?.classList.toggle(\"axisStepsXHalf\", (steps?.offsetWidth || 0) < 500);\n\t}\n}\n\nfunction onClick(event: Event, self: MTDSChartElement) {\n\tif (event instanceof KeyboardEvent && event.key !== \"Enter\") return; // Only handle enter key\n\tconst el = event.composedPath()[0];\n\tconst table = self.querySelector(\"table\");\n\tconst [tr, td] =\n\t\t(el instanceof Element && attr(el, \"data-event\")?.split(\"-\").map(Number)) ||\n\t\t[];\n\n\ttable?.rows[tr]?.cells[td]?.querySelector<HTMLElement>(\"a,button\")?.click?.();\n}\n\nlet TOOLTIP_TEXT = \"\";\nfunction onMoveTooltip(event: MouseEvent) {\n\tif (!TOOLTIP) return;\n\tif (!TOOLTIP?.isConnected) document.body.append(TOOLTIP); // Ensure connected\n\n\tconst el = event.composedPath()[0];\n\tconst tip = (el instanceof Element && el.getAttribute(\"aria-label\")) || \"\";\n\n\tif (tip)\n\t\tTOOLTIP.style.transform = `translate(${Math.min(event.clientX, window.innerWidth - TOOLTIP.clientWidth - 10)}px, ${event.clientY}px)`;\n\tif (tip !== TOOLTIP_TEXT) {\n\t\tif (tip) TOOLTIP.textContent = tip;\n\t\tTOOLTIP_TEXT = tip;\n\t\tTOOLTIP.hidden = !tip;\n\t}\n}\n\nconst text = (el?: Element | null) => el?.textContent?.trim() || \"\"; // Helper to get trimmed text\nconst toData = (table?: HTMLTableElement | null) =>\n\tArray.from(table?.rows || [], (row, rowIndex) =>\n\t\tArray.from(row.cells, (cell, cellIndex) => {\n\t\t\tconst rowHeading = text(row.cells[0]);\n\t\t\tconst colHeading = text(table?.rows[0].cells[cellIndex]);\n\t\t\tconst tooltip = `${rowHeading}: ${text(cell)}${colHeading ? ` (${colHeading})` : \"\"}`;\n\n\t\t\treturn {\n\t\t\t\tnumber: (cellIndex && rowIndex && Number.parseFloat(text(cell))) || 0, // First row and column is not a number\n\t\t\t\tevent: cell.querySelector(\"a,button\") && `${rowIndex}-${cellIndex}`, // Reference to proxy events\n\t\t\t\tstyle: `--color: var(--mtdsc-chart-color-${rowIndex}, var(--mtdsc-chart-color-base))`,\n\t\t\t\tvalue: text(cell),\n\t\t\t\ttooltip: attr(cell, \"data-tooltip\") || tooltip,\n\t\t\t};\n\t\t}),\n\t);\n\ndefineElement(\"mtds-chart\", MTDSChartElement);\n"],"names":["style"],"mappings":";;;;;;;AA0BA,MAAM,SAAS;AACf,MAAM,aAAa;AACnB,MAAM,UAAU,cACb,SAAS,eAAe,UAAU,KACnC,IAAI,OAAO;AAAA,EACV,eAAe;AAAA,EACf,OAAO,OAAO;AAAA,EACd,QAAQ;AAAA,EACR,IAAI;AACL,CAAC,IACA;AAEI,MAAM,yBAAyB,YAAY;AAAA,EACjD;AAAA,EACA;AAAA,EAEA,WAAW,qBAAqB;AAC/B,WAAO,CAAC,gBAAgB,aAAa;AAAA,EACtC;AAAA,EACA,cAAc;AACb,UAAA;AACA,SAAK,aAAa,EAAE,MAAM,OAAA,CAAQ;AAAA,EACnC;AAAA,EACA,oBAAoB;AACnB,SAAK,YAAY,SAAS,MAAM,KAAK,aAAA,GAAgB,IAAI;AACzD,SAAK,YAAY,WAAW,MAAM,KAAK,4BAA4B;AAAA,MAClE,MAAM;AAAA,MACN,MAAM;AAAA,IAAA,CACN;AACD,SAAK,yBAAA;AACL,OAAG,MAAM,QAAQ,IAAI;AAAA,EACtB;AAAA,EACA,uBAAuB;AACtB,QAAI,iBAAiB,SAAS;AAC9B,QAAI,MAAM,QAAQ,IAAI;AACtB,SAAK,YAAA;AACL,SAAK,YAAA;AACL,SAAK,YAAY,KAAK,YAAY;AAAA,EACnC;AAAA,EACA,2BAA2B;AAC1B,UAAM,KAAK,KAAK,YAAY,YAAY,CAAA,CAAE,EAAE,IAAI,CAAC,OAAO,GAAG,OAAA,CAAQ;AAEnE,UAAM,CAAC,SAAS,IAAI,KAAK,KAAK,MAAM,cAAc,KAAK,UAAU,MAAM,GAAG;AAC1E,UAAM,SAAS,KAAK,MAAM,aAAa,KAAK;AAC5C,UAAM,OAAO,OAAO,KAAK,cAAc,OAAO,CAAC;AAC/C,UAAM,QAAQ,IAAI,SAAS,CAAA,GAAI,GAAG;AAClC,UAAM,SAAS,IAAI,OAAO;AAAA,MACzB,eAAe;AAAA,MACf,OAAO;AAAA,MACP,MAAM;AAAA,IAAA,CACN;AACD,SAAK,MAAM,CAAC,EAAE,QAAQ,CAAC,CAAC,EAAE,OAAO,OAAAA,OAAAA,CAAO,MAAM;AAC7C,aAAO,YAAY,IAAI,OAAO,EAAE,OAAO,UAAU,OAAAA,UAAS,KAAK,CAAC;AAAA,IACjE,CAAC;AAED,UAAM,EAAE,MAAM,QAAQ,MAAA,IAAU,OAAO,MAAM,EAAE,QAAQ,MAAM;AAC7D,QAAI,YAAY,YAAY,YAAY;AACvC,aAAO,OAAO,GAAG,OAAO,IAAI,CAAC;AAC9B,QAAI,YAAY,UAAU,YAAY;AACrC,aAAO,OAAO,QAAQ,MAAM,EAAE,OAAO,SAAS,KAAA,CAAM,CAAC;AACtD,QAAI,YAAY,cAAc,YAAY;AACzC,WAAK,YAAY,OAAO,OAAO,MAAM,EAAE,QAAQ,QAAA,CAAS,CAAC;AAE1D,SAAK,YAAY,OAAO,MAAM,QAAQ,KAAK;AAAA,EAC5C;AAAA,EACA,YAAY,GAAU;AACrB,QAAI,EAAE,SAAS,WAAW,EAAE,SAAS,UAAW,SAAQ,GAAG,IAAI;AAAA,uBAC5C,CAAe;AAAA,EACnC;AAAA,EACA,eAAe;AACd,UAAM,OAAO,KAAK,YAAY;AAC9B,UAAM,QAAQ,MAAM;AACpB,UAAM,UAAU,OAAO,mBAAmB,OAAO,gBAAgB,KAAK,GAAG;AACzE,UAAM,UAAU,OAAO,mBAAmB,OAAO,eAAe,KAAK,GAAG;AAAA,EACzE;AACD;AAEA,SAAS,QAAQ,OAAc,MAAwB;AACtD,MAAI,iBAAiB,iBAAiB,MAAM,QAAQ,QAAS;AAC7D,QAAM,KAAK,MAAM,aAAA,EAAe,CAAC;AACjC,QAAM,QAAQ,KAAK,cAAc,OAAO;AACxC,QAAM,CAAC,IAAI,EAAE,IACX,cAAc,WAAW,KAAK,IAAI,YAAY,GAAG,MAAM,GAAG,EAAE,IAAI,MAAM,KACvE,CAAA;AAED,SAAO,KAAK,EAAE,GAAG,MAAM,EAAE,GAAG,cAA2B,UAAU,GAAG,QAAA;AACrE;AAEA,IAAI,eAAe;AACnB,SAAS,cAAc,OAAmB;AACzC,MAAI,CAAC,QAAS;AACd,MAAI,CAAC,SAAS,YAAa,UAAS,KAAK,OAAO,OAAO;AAEvD,QAAM,KAAK,MAAM,aAAA,EAAe,CAAC;AACjC,QAAM,MAAO,cAAc,WAAW,GAAG,aAAa,YAAY,KAAM;AAExE,MAAI;AACH,YAAQ,MAAM,YAAY,aAAa,KAAK,IAAI,MAAM,SAAS,OAAO,aAAa,QAAQ,cAAc,EAAE,CAAC,OAAO,MAAM,OAAO;AACjI,MAAI,QAAQ,cAAc;AACzB,QAAI,aAAa,cAAc;AAC/B,mBAAe;AACf,YAAQ,SAAS,CAAC;AAAA,EACnB;AACD;AAEA,MAAM,OAAO,CAAC,OAAwB,IAAI,aAAa,UAAU;AACjE,MAAM,SAAS,CAAC,UACf,MAAM;AAAA,EAAK,OAAO,QAAQ,CAAA;AAAA,EAAI,CAAC,KAAK,aACnC,MAAM,KAAK,IAAI,OAAO,CAAC,MAAM,cAAc;AAC1C,UAAM,aAAa,KAAK,IAAI,MAAM,CAAC,CAAC;AACpC,UAAM,aAAa,KAAK,OAAO,KAAK,CAAC,EAAE,MAAM,SAAS,CAAC;AACvD,UAAM,UAAU,GAAG,UAAU,KAAK,KAAK,IAAI,CAAC,GAAG,aAAa,KAAK,UAAU,MAAM,EAAE;AAEnF,WAAO;AAAA,MACN,QAAS,aAAa,YAAY,OAAO,WAAW,KAAK,IAAI,CAAC,KAAM;AAAA;AAAA,MACpE,OAAO,KAAK,cAAc,UAAU,KAAK,GAAG,QAAQ,IAAI,SAAS;AAAA;AAAA,MACjE,OAAO,oCAAoC,QAAQ;AAAA,MACnD,OAAO,KAAK,IAAI;AAAA,MAChB,SAAS,KAAK,MAAM,cAAc,KAAK;AAAA,IAAA;AAAA,EAEzC,CAAC;AACF;AAED,cAAc,cAAc,gBAAgB;"}
+{"version":3,"file":"chart-element.js","sources":["../../designsystem/chart/chart-element.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport {\n\tattr,\n\tdefineElement,\n\tisBrowser,\n\tMTDSElement,\n\toff,\n\ton,\n\tonMutation,\n\tonResize,\n\ttag,\n} from \"../utils\";\nimport css from \"./chart.css?raw\";\nimport { toAxis } from \"./chart-axis\";\nimport { toBars } from \"./chart-bars\";\nimport { toLines } from \"./chart-lines\";\nimport { toPies } from \"./chart-pies\";\n\nexport type ChartData = ReturnType<typeof toData>;\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t\"mtds-chart\": MTDSChartElement;\n\t}\n}\n\nconst EVENTS = \"click,keydown,mousemove,mouseout\";\nconst TOOLTIP_ID = \"mtds-chart-tooltip\";\nconst TOOLTIP = isBrowser()\n\t? document.getElementById(TOOLTIP_ID) ||\n\t\ttag(\"div\", {\n\t\t\t\"aria-hidden\": \"true\",\n\t\t\tclass: styles._tooltip,\n\t\t\thidden: \"\",\n\t\t\tid: TOOLTIP_ID,\n\t\t})\n\t: null;\n\nexport class MTDSChartElement extends MTDSElement {\n\t#unmutate?: () => void;\n\t#unresize?: () => void;\n\n\tstatic get observedAttributes() {\n\t\treturn [\"data-variant\", \"data-aspect\"]; // Using ES2015 syntax for backwards compatibility\n\t}\n\tconstructor() {\n\t\tsuper();\n\t\tthis.attachShadow({ mode: \"open\" });\n\t}\n\tconnectedCallback() {\n\t\tthis.#unresize = onResize(() => this.handleResize(), this);\n\t\tthis.#unmutate = onMutation(() => this.attributeChangedCallback(), {\n\t\t\tattr: \"data-tooltip\",\n\t\t\troot: this,\n\t\t});\n\t\tthis.attributeChangedCallback(); // Initial setup\n\t\ton(this, EVENTS, this);\n\t}\n\tdisconnectedCallback() {\n\t\tif (TOOLTIP) TOOLTIP.hidden = true;\n\t\toff(this, EVENTS, this);\n\t\tthis.#unresize?.();\n\t\tthis.#unmutate?.();\n\t\tthis.#unmutate = this.#unresize = undefined;\n\t}\n\tattributeChangedCallback() {\n\t\tArray.from(this.shadowRoot?.children || []).map((el) => el.remove()); // Clear shadowRoot\n\n\t\tconst [variant, type] = (attr(this, \"data-variant\") || \"column\").split(\"-\");\n\t\tconst aspect = attr(this, \"data-aspect\") || undefined;\n\t\tconst data = toData(this.querySelector(\"table\"));\n\t\tconst style = tag(\"style\", {}, css);\n\t\tconst legend = tag(\"div\", {\n\t\t\t\"aria-hidden\": \"hidden\",\n\t\t\tclass: \"legends\",\n\t\t\trole: \"group\",\n\t\t});\n\t\tdata.slice(1).forEach(([{ value, style }]) => {\n\t\t\tlegend.appendChild(tag(\"div\", { class: \"legend\", style }, value));\n\t\t});\n\n\t\tconst { axis, groups, total } = toAxis(data, { aspect, type });\n\t\tif (variant === \"column\" || variant === \"bar\")\n\t\t\tgroups.append(...toBars(data));\n\t\tif (variant === \"line\" || variant === \"area\")\n\t\t\tgroups.append(toLines(data, { total, variant, type }));\n\t\tif (variant === \"doughnut\" || variant === \"pie\")\n\t\t\tthis.shadowRoot?.append(toPies(data, { aspect, variant }));\n\n\t\tthis.shadowRoot?.append(axis, legend, style); // Axis must be first\n\t}\n\thandleEvent(e: Event) {\n\t\tif (e.type === \"click\" || e.type === \"keydown\") onClick(e, this);\n\t\telse onMoveTooltip(e as MouseEvent);\n\t}\n\thandleResize() {\n\t\tconst axis = this.shadowRoot?.firstElementChild as HTMLElement | null;\n\t\tconst steps = axis?.firstElementChild as HTMLElement | null;\n\t\taxis?.classList.toggle(\"axisStepsYHalf\", (steps?.offsetHeight || 0) < 400);\n\t\taxis?.classList.toggle(\"axisStepsXHalf\", (steps?.offsetWidth || 0) < 500);\n\t}\n}\n\nfunction onClick(event: Event, self: MTDSChartElement) {\n\tif (event instanceof KeyboardEvent && event.key !== \"Enter\") return; // Only handle enter key\n\tconst el = event.composedPath()[0];\n\tconst table = self.querySelector(\"table\");\n\tconst [tr, td] =\n\t\t(el instanceof Element && attr(el, \"data-event\")?.split(\"-\").map(Number)) ||\n\t\t[];\n\n\ttable?.rows[tr]?.cells[td]?.querySelector<HTMLElement>(\"a,button\")?.click?.();\n}\n\nlet TOOLTIP_TEXT = \"\";\nfunction onMoveTooltip(event: MouseEvent) {\n\tif (!TOOLTIP) return;\n\tif (!TOOLTIP?.isConnected) document.body.append(TOOLTIP); // Ensure connected\n\n\tconst el = event.composedPath()[0];\n\tconst tip = (el instanceof Element && el.getAttribute(\"aria-label\")) || \"\";\n\n\tif (tip)\n\t\tTOOLTIP.style.transform = `translate(${Math.min(event.clientX, window.innerWidth - TOOLTIP.clientWidth - 10)}px, ${event.clientY}px)`;\n\tif (tip !== TOOLTIP_TEXT) {\n\t\tif (tip) TOOLTIP.textContent = tip;\n\t\tTOOLTIP_TEXT = tip;\n\t\tTOOLTIP.hidden = !tip;\n\t}\n}\n\nconst text = (el?: Element | null) => el?.textContent?.trim() || \"\"; // Helper to get trimmed text\nconst toData = (table?: HTMLTableElement | null) =>\n\tArray.from(table?.rows || [], (row, rowIndex) =>\n\t\tArray.from(row.cells, (cell, cellIndex) => {\n\t\t\tconst rowHeading = text(row.cells[0]);\n\t\t\tconst colHeading = text(table?.rows[0].cells[cellIndex]);\n\t\t\tconst tooltip = `${rowHeading}: ${text(cell)}${colHeading ? ` (${colHeading})` : \"\"}`;\n\n\t\t\treturn {\n\t\t\t\tnumber: (cellIndex && rowIndex && Number.parseFloat(text(cell))) || 0, // First row and column is not a number\n\t\t\t\tevent: cell.querySelector(\"a,button\") && `${rowIndex}-${cellIndex}`, // Reference to proxy events\n\t\t\t\tstyle: `--color: var(--mtdsc-chart-color-${rowIndex}, var(--mtdsc-chart-color-base))`,\n\t\t\t\tvalue: text(cell),\n\t\t\t\ttooltip: attr(cell, \"data-tooltip\") || tooltip,\n\t\t\t};\n\t\t}),\n\t);\n\ndefineElement(\"mtds-chart\", MTDSChartElement);\n"],"names":["EVENTS","TOOLTIP_ID","TOOLTIP","isBrowser","tag","styles","MTDSChartElement","MTDSElement","#unmutate","#unresize","onResize","onMutation","on","off","el","variant","type","attr","aspect","data","toData","style","css","legend","value","axis","groups","total","toAxis","toBars","toLines","toPies","e","onClick","steps","event","self","table","tr","td","TOOLTIP_TEXT","onMoveTooltip","tip","text","row","rowIndex","cell","cellIndex","rowHeading","colHeading","tooltip","defineElement"],"mappings":"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"}

package/mtds/chart/chart-lines.js

@@ -1,66 +1,44 @@
-import { tag, attr } from "../utils.js";
-function toLines(data, { total, type, variant }) {
-  const smoothing = Number.parseFloat(type || "0") || 0;
-  const group = tag("div", { class: "axisGroup" });
-  data.slice(1).forEach(([, ...values]) => {
-    const lineContainer = tag("div", {
-      class: `lineContainer`,
+import { tag as m, attr as a } from "../utils.js";
+function E(e, { total: t, type: n, variant: o }) {
+  const s = Number.parseFloat(n || "0") || 0, r = m("div", { class: "axisGroup" });
+  return e.slice(1).forEach(([, ...l]) => {
+    const d = m("div", {
+      class: "lineContainer",
       role: "list",
-      style: values[0].style
-    });
-    const pathDefintion = toPath(
-      values.map(({ number }, index, { length }) => [
-        100 / (length - 1) * index,
-        100 - number / total * 100
+      style: l[0].style
+    }), h = C(
+      l.map(({ number: c }, u, { length: $ }) => [
+        100 / ($ - 1) * u,
+        100 - c / t * 100
       ]),
-      smoothing / 100
-    );
-    const line = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-    attr(line, "aria-hidden", "true");
-    attr(line, "preserveAspectRatio", "none");
-    attr(line, "viewBox", "0 0 100 100");
-    const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
-    attr(path, "class", "line");
-    attr(path, "d", pathDefintion);
-    attr(path, "fill", "none");
-    attr(path, "stroke", "currentColor");
-    if (variant === "area") {
-      const lineShade = path.cloneNode(true);
-      attr(lineShade, "d", `M-100,100 L${pathDefintion.slice(1)}L200,100`);
-      attr(lineShade, "class", "lineShade");
-      line.append(lineShade);
+      s / 100
+    ), p = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+    a(p, "aria-hidden", "true"), a(p, "preserveAspectRatio", "none"), a(p, "viewBox", "0 0 100 100");
+    const i = document.createElementNS("http://www.w3.org/2000/svg", "path");
+    if (a(i, "class", "line"), a(i, "d", h), a(i, "fill", "none"), a(i, "stroke", "currentColor"), o === "area") {
+      const c = i.cloneNode(!0);
+      a(c, "d", `M-100,100 L${h.slice(1)}L200,100`), a(c, "class", "lineShade"), p.append(c);
     }
-    values.forEach(({ number, tooltip, event }) => {
-      const col = tag("div", { role: "listitem" });
-      col.appendChild(
-        tag("div", {
-          "aria-label": tooltip,
-          "data-event": event,
+    l.forEach(({ number: c, tooltip: u, event: $ }) => {
+      const g = m("div", { role: "listitem" });
+      g.appendChild(
+        m("div", {
+          "aria-label": u,
+          "data-event": $,
           tabindex: "0",
           class: "linePoint",
           role: "img",
-          style: `--value: ${number}`
+          style: `--value: ${c}`
         })
-      );
-      lineContainer.append(col);
-    });
-    lineContainer.appendChild(line).append(path);
-    group.append(lineContainer);
-  });
-  return group;
+      ), d.append(g);
+    }), d.appendChild(p).append(i), r.append(d);
+  }), r;
 }
-const toPath = (points, s) => points.map(([x, y], i, a) => i ? smooth(i, a, s) : `M${x},${y}`).join(" ");
-const add = ([ax, ay], [bx, by]) => [ax + bx, ay + by];
-const sub = ([ax, ay], [bx, by]) => [ax - bx, ay - by];
-const scale = (s, [x, y]) => [s * x, s * y];
-const smooth = (i, all, smooth2) => {
-  const start = all[i - 1];
-  const end = all[i];
-  const [csX, csY] = add(start, scale(smooth2, sub(end, all[i - 2] || start)));
-  const [ceX, ceY] = add(end, scale(smooth2, sub(start, all[i + 1] || end)));
-  return `C ${csX},${csY} ${ceX},${ceY} ${end[0]},${end[1]}`;
+const C = (e, t) => e.map(([n, o], s, r) => s ? b(s, r, t) : `M${n},${o}`).join(" "), v = ([e, t], [n, o]) => [e + n, t + o], w = ([e, t], [n, o]) => [e - n, t - o], f = (e, [t, n]) => [e * t, e * n], b = (e, t, n) => {
+  const o = t[e - 1], s = t[e], [r, l] = v(o, f(n, w(s, t[e - 2] || o))), [d, h] = v(s, f(n, w(o, t[e + 1] || s)));
+  return `C ${r},${l} ${d},${h} ${s[0]},${s[1]}`;
 };
 export {
-  toLines
+  E as toLines
 };
 //# sourceMappingURL=chart-lines.js.map

package/mtds/chart/chart-lines.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-lines.js","sources":["../../designsystem/chart/chart-lines.ts"],"sourcesContent":["import { attr, tag } from \"../utils\";\nimport type { ChartData } from \"./chart-element\";\n\ntype Config = {\n\ttotal: number;\n\ttype: string;\n\tvariant: string;\n};\n\nexport function toLines(data: ChartData, { total, type, variant }: Config) {\n\tconst smoothing = Number.parseFloat(type || \"0\") || 0;\n\tconst group = tag(\"div\", { class: \"axisGroup\" });\n\tdata.slice(1).forEach(([, ...values]) => {\n\t\tconst lineContainer = tag(\"div\", {\n\t\t\tclass: `lineContainer`,\n\t\t\trole: \"list\",\n\t\t\tstyle: values[0].style,\n\t\t});\n\n\t\tconst pathDefintion = toPath(\n\t\t\tvalues.map(({ number }, index, { length }) => [\n\t\t\t\t(100 / (length - 1)) * index,\n\t\t\t\t100 - (number / total) * 100,\n\t\t\t]),\n\t\t\tsmoothing / 100,\n\t\t);\n\n\t\tconst line = document.createElementNS(\"http://www.w3.org/2000/svg\", \"svg\");\n\t\tattr(line, \"aria-hidden\", \"true\");\n\t\tattr(line, \"preserveAspectRatio\", \"none\");\n\t\tattr(line, \"viewBox\", \"0 0 100 100\");\n\n\t\tconst path = document.createElementNS(\"http://www.w3.org/2000/svg\", \"path\");\n\t\tattr(path, \"class\", \"line\");\n\t\tattr(path, \"d\", pathDefintion);\n\t\tattr(path, \"fill\", \"none\");\n\t\tattr(path, \"stroke\", \"currentColor\");\n\n\t\tif (variant === \"area\") {\n\t\t\tconst lineShade = path.cloneNode(true) as SVGPathElement;\n\t\t\tattr(lineShade, \"d\", `M-100,100 L${pathDefintion.slice(1)}L200,100`);\n\t\t\tattr(lineShade, \"class\", \"lineShade\");\n\t\t\tline.append(lineShade);\n\t\t}\n\n\t\tvalues.forEach(({ number, tooltip, event }) => {\n\t\t\tconst col = tag(\"div\", { role: \"listitem\" });\n\t\t\tcol.appendChild(\n\t\t\t\ttag(\"div\", {\n\t\t\t\t\t\"aria-label\": tooltip,\n\t\t\t\t\t\"data-event\": event,\n\t\t\t\t\ttabindex: \"0\",\n\t\t\t\t\tclass: \"linePoint\",\n\t\t\t\t\trole: \"img\",\n\t\t\t\t\tstyle: `--value: ${number}`,\n\t\t\t\t}),\n\t\t\t);\n\t\t\tlineContainer.append(col);\n\t\t});\n\n\t\tlineContainer.appendChild(line).append(path);\n\t\tgroup.append(lineContainer);\n\t});\n\treturn group;\n}\n\n// Based on https://observablehq.com/@ndry/smooth-a-svg-path-with-cubic-bezier-curves\nconst toPath = (points: number[][], s: number) =>\n\tpoints.map(([x, y], i, a) => (i ? smooth(i, a, s) : `M${x},${y}`)).join(\" \");\nconst add = ([ax, ay]: number[], [bx, by]: number[]) => [ax + bx, ay + by];\nconst sub = ([ax, ay]: number[], [bx, by]: number[]) => [ax - bx, ay - by];\nconst scale = (s: number, [x, y]: number[]) => [s * x, s * y];\nconst smooth = (i: number, all: number[][], smooth: number) => {\n\tconst start = all[i - 1];\n\tconst end = all[i];\n\tconst [csX, csY] = add(start, scale(smooth, sub(end, all[i - 2] || start))); // start control point\n\tconst [ceX, ceY] = add(end, scale(smooth, sub(start, all[i + 1] || end))); // end control point\n\treturn `C ${csX},${csY} ${ceX},${ceY} ${end[0]},${end[1]}`;\n};\n"],"names":["smooth"],"mappings":"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"}
+{"version":3,"file":"chart-lines.js","sources":["../../designsystem/chart/chart-lines.ts"],"sourcesContent":["import { attr, tag } from \"../utils\";\nimport type { ChartData } from \"./chart-element\";\n\ntype Config = {\n\ttotal: number;\n\ttype: string;\n\tvariant: string;\n};\n\nexport function toLines(data: ChartData, { total, type, variant }: Config) {\n\tconst smoothing = Number.parseFloat(type || \"0\") || 0;\n\tconst group = tag(\"div\", { class: \"axisGroup\" });\n\tdata.slice(1).forEach(([, ...values]) => {\n\t\tconst lineContainer = tag(\"div\", {\n\t\t\tclass: `lineContainer`,\n\t\t\trole: \"list\",\n\t\t\tstyle: values[0].style,\n\t\t});\n\n\t\tconst pathDefintion = toPath(\n\t\t\tvalues.map(({ number }, index, { length }) => [\n\t\t\t\t(100 / (length - 1)) * index,\n\t\t\t\t100 - (number / total) * 100,\n\t\t\t]),\n\t\t\tsmoothing / 100,\n\t\t);\n\n\t\tconst line = document.createElementNS(\"http://www.w3.org/2000/svg\", \"svg\");\n\t\tattr(line, \"aria-hidden\", \"true\");\n\t\tattr(line, \"preserveAspectRatio\", \"none\");\n\t\tattr(line, \"viewBox\", \"0 0 100 100\");\n\n\t\tconst path = document.createElementNS(\"http://www.w3.org/2000/svg\", \"path\");\n\t\tattr(path, \"class\", \"line\");\n\t\tattr(path, \"d\", pathDefintion);\n\t\tattr(path, \"fill\", \"none\");\n\t\tattr(path, \"stroke\", \"currentColor\");\n\n\t\tif (variant === \"area\") {\n\t\t\tconst lineShade = path.cloneNode(true) as SVGPathElement;\n\t\t\tattr(lineShade, \"d\", `M-100,100 L${pathDefintion.slice(1)}L200,100`);\n\t\t\tattr(lineShade, \"class\", \"lineShade\");\n\t\t\tline.append(lineShade);\n\t\t}\n\n\t\tvalues.forEach(({ number, tooltip, event }) => {\n\t\t\tconst col = tag(\"div\", { role: \"listitem\" });\n\t\t\tcol.appendChild(\n\t\t\t\ttag(\"div\", {\n\t\t\t\t\t\"aria-label\": tooltip,\n\t\t\t\t\t\"data-event\": event,\n\t\t\t\t\ttabindex: \"0\",\n\t\t\t\t\tclass: \"linePoint\",\n\t\t\t\t\trole: \"img\",\n\t\t\t\t\tstyle: `--value: ${number}`,\n\t\t\t\t}),\n\t\t\t);\n\t\t\tlineContainer.append(col);\n\t\t});\n\n\t\tlineContainer.appendChild(line).append(path);\n\t\tgroup.append(lineContainer);\n\t});\n\treturn group;\n}\n\n// Based on https://observablehq.com/@ndry/smooth-a-svg-path-with-cubic-bezier-curves\nconst toPath = (points: number[][], s: number) =>\n\tpoints.map(([x, y], i, a) => (i ? smooth(i, a, s) : `M${x},${y}`)).join(\" \");\nconst add = ([ax, ay]: number[], [bx, by]: number[]) => [ax + bx, ay + by];\nconst sub = ([ax, ay]: number[], [bx, by]: number[]) => [ax - bx, ay - by];\nconst scale = (s: number, [x, y]: number[]) => [s * x, s * y];\nconst smooth = (i: number, all: number[][], smooth: number) => {\n\tconst start = all[i - 1];\n\tconst end = all[i];\n\tconst [csX, csY] = add(start, scale(smooth, sub(end, all[i - 2] || start))); // start control point\n\tconst [ceX, ceY] = add(end, scale(smooth, sub(start, all[i + 1] || end))); // end control point\n\treturn `C ${csX},${csY} ${ceX},${ceY} ${end[0]},${end[1]}`;\n};\n"],"names":["toLines","data","total","type","variant","smoothing","group","tag","lineContainer","values","pathDefintion","toPath","number","index","length","line","attr","path","lineShade","tooltip","event","col","points","s","x","y","i","a","smooth","add","ax","ay","bx","by","sub","scale","all","start","end","csX","csY","ceX","ceY"],"mappings":";AASO,SAASA,EAAQC,GAAiB,EAAE,OAAAC,GAAO,MAAAC,GAAM,SAAAC,KAAmB;AAC1E,QAAMC,IAAY,OAAO,WAAWF,KAAQ,GAAG,KAAK,GAC9CG,IAAQC,EAAI,OAAO,EAAE,OAAO,aAAa;AAC/C,SAAAN,EAAK,MAAM,CAAC,EAAE,QAAQ,CAAC,CAAA,MAAY,MAAM;AACxC,UAAMO,IAAgBD,EAAI,OAAO;AAAA,MAChC,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAOE,EAAO,CAAC,EAAE;AAAA,IAAA,CACjB,GAEKC,IAAgBC;AAAA,MACrBF,EAAO,IAAI,CAAC,EAAE,QAAAG,KAAUC,GAAO,EAAE,QAAAC,QAAa;AAAA,QAC5C,OAAOA,IAAS,KAAMD;AAAA,QACvB,MAAOD,IAASV,IAAS;AAAA,MAAA,CACzB;AAAA,MACDG,IAAY;AAAA,IAAA,GAGPU,IAAO,SAAS,gBAAgB,8BAA8B,KAAK;AACzE,IAAAC,EAAKD,GAAM,eAAe,MAAM,GAChCC,EAAKD,GAAM,uBAAuB,MAAM,GACxCC,EAAKD,GAAM,WAAW,aAAa;AAEnC,UAAME,IAAO,SAAS,gBAAgB,8BAA8B,MAAM;AAM1E,QALAD,EAAKC,GAAM,SAAS,MAAM,GAC1BD,EAAKC,GAAM,KAAKP,CAAa,GAC7BM,EAAKC,GAAM,QAAQ,MAAM,GACzBD,EAAKC,GAAM,UAAU,cAAc,GAE/Bb,MAAY,QAAQ;AACvB,YAAMc,IAAYD,EAAK,UAAU,EAAI;AACrC,MAAAD,EAAKE,GAAW,KAAK,cAAcR,EAAc,MAAM,CAAC,CAAC,UAAU,GACnEM,EAAKE,GAAW,SAAS,WAAW,GACpCH,EAAK,OAAOG,CAAS;AAAA,IACtB;AAEA,IAAAT,EAAO,QAAQ,CAAC,EAAE,QAAAG,GAAQ,SAAAO,GAAS,OAAAC,QAAY;AAC9C,YAAMC,IAAMd,EAAI,OAAO,EAAE,MAAM,YAAY;AAC3C,MAAAc,EAAI;AAAA,QACHd,EAAI,OAAO;AAAA,UACV,cAAcY;AAAA,UACd,cAAcC;AAAA,UACd,UAAU;AAAA,UACV,OAAO;AAAA,UACP,MAAM;AAAA,UACN,OAAO,YAAYR,CAAM;AAAA,QAAA,CACzB;AAAA,MAAA,GAEFJ,EAAc,OAAOa,CAAG;AAAA,IACzB,CAAC,GAEDb,EAAc,YAAYO,CAAI,EAAE,OAAOE,CAAI,GAC3CX,EAAM,OAAOE,CAAa;AAAA,EAC3B,CAAC,GACMF;AACR;AAGA,MAAMK,IAAS,CAACW,GAAoBC,MACnCD,EAAO,IAAI,CAAC,CAACE,GAAGC,CAAC,GAAGC,GAAGC,MAAOD,IAAIE,EAAOF,GAAGC,GAAGJ,CAAC,IAAI,IAAIC,CAAC,IAAIC,CAAC,EAAG,EAAE,KAAK,GAAG,GACtEI,IAAM,CAAC,CAACC,GAAIC,CAAE,GAAa,CAACC,GAAIC,CAAE,MAAgB,CAACH,IAAKE,GAAID,IAAKE,CAAE,GACnEC,IAAM,CAAC,CAACJ,GAAIC,CAAE,GAAa,CAACC,GAAIC,CAAE,MAAgB,CAACH,IAAKE,GAAID,IAAKE,CAAE,GACnEE,IAAQ,CAACZ,GAAW,CAACC,GAAGC,CAAC,MAAgB,CAACF,IAAIC,GAAGD,IAAIE,CAAC,GACtDG,IAAS,CAACF,GAAWU,GAAiBR,MAAmB;AAC9D,QAAMS,IAAQD,EAAIV,IAAI,CAAC,GACjBY,IAAMF,EAAIV,CAAC,GACX,CAACa,GAAKC,CAAG,IAAIX,EAAIQ,GAAOF,EAAMP,GAAQM,EAAII,GAAKF,EAAIV,IAAI,CAAC,KAAKW,CAAK,CAAC,CAAC,GACpE,CAACI,GAAKC,CAAG,IAAIb,EAAIS,GAAKH,EAAMP,GAAQM,EAAIG,GAAOD,EAAIV,IAAI,CAAC,KAAKY,CAAG,CAAC,CAAC;AACxE,SAAO,KAAKC,CAAG,IAAIC,CAAG,IAAIC,CAAG,IAAIC,CAAG,IAAIJ,EAAI,CAAC,CAAC,IAAIA,EAAI,CAAC,CAAC;AACzD;"}

package/mtds/chart/chart-pies.js

@@ -1,38 +1,18 @@
-import { attr } from "../utils.js";
-function toPies(data, { aspect, variant }) {
-  const pie = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-  if (aspect) pie.style.setProperty("--mtdsc-chart-aspect", aspect);
-  attr(pie, "class", "pie");
-  attr(pie, "viewBox", "0 0 100 100");
-  let offset = 0;
-  const radius = 50;
-  const inner = variant === "doughnut" ? 25 : 0;
-  const total = data.slice(1).reduce((tot, [, td]) => tot + td.number, 0);
-  data.slice(1).forEach(([, { tooltip, number, event, style }]) => {
-    if (!number) return;
-    const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
-    const start = offset / total;
-    offset += number;
-    const end = Math.min(offset / total, 0.99999);
-    const largeArc = end - start > 0.5 ? 1 : 0;
-    const a0 = 2 * Math.PI * (start - 0.25);
-    const a1 = 2 * Math.PI * (end - 0.25);
-    const x0 = Math.cos(a0);
-    const y0 = Math.sin(a0);
-    const x1 = Math.cos(a1);
-    const y1 = Math.sin(a1);
-    const d = `M ${radius + inner * x0} ${radius + inner * y0} L ${radius + radius * x0} ${radius + radius * y0} A ${radius} ${radius} 0 ${largeArc} 1 ${radius + radius * x1} ${radius + radius * y1} L ${radius + inner * x1} ${radius + inner * y1} A ${inner} ${inner} 0 ${largeArc} 0 ${radius + inner * x0} ${radius + inner * y0}`;
-    attr(path, "aria-label", tooltip);
-    attr(path, "data-event", event);
-    attr(path, "style", style);
-    attr(path, "d", d);
-    attr(path, "role", "img");
-    attr(path, "tabindex", "0");
-    pie.appendChild(path);
-  });
-  return pie;
+import { attr as s } from "../utils.js";
+function E(h, { aspect: l, variant: v }) {
+  const o = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+  l && o.style.setProperty("--mtdsc-chart-aspect", l), s(o, "class", "pie"), s(o, "viewBox", "0 0 100 100");
+  let a = 0;
+  const t = 50, e = v === "doughnut" ? 25 : 0, d = h.slice(1).reduce((r, [, c]) => r + c.number, 0);
+  return h.slice(1).forEach(([, { tooltip: r, number: c, event: x, style: y }]) => {
+    if (!c) return;
+    const n = document.createElementNS("http://www.w3.org/2000/svg", "path"), p = a / d;
+    a += c;
+    const m = Math.min(a / d, 0.99999), u = m - p > 0.5 ? 1 : 0, w = 2 * Math.PI * (p - 0.25), g = 2 * Math.PI * (m - 0.25), i = Math.cos(w), $ = Math.sin(w), M = Math.cos(g), f = Math.sin(g), P = `M ${t + e * i} ${t + e * $} L ${t + t * i} ${t + t * $} A ${t} ${t} 0 ${u} 1 ${t + t * M} ${t + t * f} L ${t + e * M} ${t + e * f} A ${e} ${e} 0 ${u} 0 ${t + e * i} ${t + e * $}`;
+    s(n, "aria-label", r), s(n, "data-event", x), s(n, "style", y), s(n, "d", P), s(n, "role", "img"), s(n, "tabindex", "0"), o.appendChild(n);
+  }), o;
 }
 export {
-  toPies
+  E as toPies
 };
 //# sourceMappingURL=chart-pies.js.map

package/mtds/chart/chart-pies.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-pies.js","sources":["../../designsystem/chart/chart-pies.ts"],"sourcesContent":["import { attr } from \"../utils\";\nimport type { ChartData } from \"./chart-element\";\n\ntype Options = { aspect?: string; variant: string };\n\nexport function toPies(data: ChartData, { aspect, variant }: Options) {\n\tconst pie = document.createElementNS(\"http://www.w3.org/2000/svg\", \"svg\");\n\tif (aspect) pie.style.setProperty(\"--mtdsc-chart-aspect\", aspect);\n\tattr(pie, \"class\", \"pie\");\n\tattr(pie, \"viewBox\", \"0 0 100 100\");\n\n\tlet offset = 0;\n\tconst radius = 50;\n\tconst inner = variant === \"doughnut\" ? 25 : 0;\n\tconst total = data.slice(1).reduce((tot, [, td]) => tot + td.number, 0);\n\n\tdata.slice(1).forEach(([, { tooltip, number, event, style }]) => {\n\t\tif (!number) return; // Skip empty\n\t\tconst path = document.createElementNS(\"http://www.w3.org/2000/svg\", \"path\");\n\t\tconst start = offset / total;\n\t\toffset += number;\n\t\tconst end = Math.min(offset / total, 0.99999); // Ensure full circle works\n\t\tconst largeArc = end - start > 0.5 ? 1 : 0;\n\t\tconst a0 = 2 * Math.PI * (start - 0.25);\n\t\tconst a1 = 2 * Math.PI * (end - 0.25);\n\t\tconst x0 = Math.cos(a0);\n\t\tconst y0 = Math.sin(a0);\n\t\tconst x1 = Math.cos(a1);\n\t\tconst y1 = Math.sin(a1);\n\t\tconst d = `M ${radius + inner * x0} ${radius + inner * y0} L ${radius + radius * x0} ${radius + radius * y0} A ${radius} ${radius} 0 ${largeArc} 1 ${radius + radius * x1} ${radius + radius * y1} L ${radius + inner * x1} ${radius + inner * y1} A ${inner} ${inner} 0 ${largeArc} 0 ${radius + inner * x0} ${radius + inner * y0}`;\n\n\t\tattr(path, \"aria-label\", tooltip);\n\t\tattr(path, \"data-event\", event);\n\t\tattr(path, \"style\", style);\n\t\tattr(path, \"d\", d);\n\t\tattr(path, \"role\", \"img\");\n\t\tattr(path, \"tabindex\", \"0\");\n\t\tpie.appendChild(path);\n\t});\n\treturn pie;\n}\n"],"names":[],"mappings":";AAKO,SAAS,OAAO,MAAiB,EAAE,QAAQ,WAAoB;AACrE,QAAM,MAAM,SAAS,gBAAgB,8BAA8B,KAAK;AACxE,MAAI,OAAQ,KAAI,MAAM,YAAY,wBAAwB,MAAM;AAChE,OAAK,KAAK,SAAS,KAAK;AACxB,OAAK,KAAK,WAAW,aAAa;AAElC,MAAI,SAAS;AACb,QAAM,SAAS;AACf,QAAM,QAAQ,YAAY,aAAa,KAAK;AAC5C,QAAM,QAAQ,KAAK,MAAM,CAAC,EAAE,OAAO,CAAC,KAAK,CAAA,EAAG,EAAE,MAAM,MAAM,GAAG,QAAQ,CAAC;AAEtE,OAAK,MAAM,CAAC,EAAE,QAAQ,CAAC,GAAG,EAAE,SAAS,QAAQ,OAAO,MAAA,CAAO,MAAM;AAChE,QAAI,CAAC,OAAQ;AACb,UAAM,OAAO,SAAS,gBAAgB,8BAA8B,MAAM;AAC1E,UAAM,QAAQ,SAAS;AACvB,cAAU;AACV,UAAM,MAAM,KAAK,IAAI,SAAS,OAAO,OAAO;AAC5C,UAAM,WAAW,MAAM,QAAQ,MAAM,IAAI;AACzC,UAAM,KAAK,IAAI,KAAK,MAAM,QAAQ;AAClC,UAAM,KAAK,IAAI,KAAK,MAAM,MAAM;AAChC,UAAM,KAAK,KAAK,IAAI,EAAE;AACtB,UAAM,KAAK,KAAK,IAAI,EAAE;AACtB,UAAM,KAAK,KAAK,IAAI,EAAE;AACtB,UAAM,KAAK,KAAK,IAAI,EAAE;AACtB,UAAM,IAAI,KAAK,SAAS,QAAQ,EAAE,IAAI,SAAS,QAAQ,EAAE,MAAM,SAAS,SAAS,EAAE,IAAI,SAAS,SAAS,EAAE,MAAM,MAAM,IAAI,MAAM,MAAM,QAAQ,MAAM,SAAS,SAAS,EAAE,IAAI,SAAS,SAAS,EAAE,MAAM,SAAS,QAAQ,EAAE,IAAI,SAAS,QAAQ,EAAE,MAAM,KAAK,IAAI,KAAK,MAAM,QAAQ,MAAM,SAAS,QAAQ,EAAE,IAAI,SAAS,QAAQ,EAAE;AAEnU,SAAK,MAAM,cAAc,OAAO;AAChC,SAAK,MAAM,cAAc,KAAK;AAC9B,SAAK,MAAM,SAAS,KAAK;AACzB,SAAK,MAAM,KAAK,CAAC;AACjB,SAAK,MAAM,QAAQ,KAAK;AACxB,SAAK,MAAM,YAAY,GAAG;AAC1B,QAAI,YAAY,IAAI;AAAA,EACrB,CAAC;AACD,SAAO;AACR;"}
+{"version":3,"file":"chart-pies.js","sources":["../../designsystem/chart/chart-pies.ts"],"sourcesContent":["import { attr } from \"../utils\";\nimport type { ChartData } from \"./chart-element\";\n\ntype Options = { aspect?: string; variant: string };\n\nexport function toPies(data: ChartData, { aspect, variant }: Options) {\n\tconst pie = document.createElementNS(\"http://www.w3.org/2000/svg\", \"svg\");\n\tif (aspect) pie.style.setProperty(\"--mtdsc-chart-aspect\", aspect);\n\tattr(pie, \"class\", \"pie\");\n\tattr(pie, \"viewBox\", \"0 0 100 100\");\n\n\tlet offset = 0;\n\tconst radius = 50;\n\tconst inner = variant === \"doughnut\" ? 25 : 0;\n\tconst total = data.slice(1).reduce((tot, [, td]) => tot + td.number, 0);\n\n\tdata.slice(1).forEach(([, { tooltip, number, event, style }]) => {\n\t\tif (!number) return; // Skip empty\n\t\tconst path = document.createElementNS(\"http://www.w3.org/2000/svg\", \"path\");\n\t\tconst start = offset / total;\n\t\toffset += number;\n\t\tconst end = Math.min(offset / total, 0.99999); // Ensure full circle works\n\t\tconst largeArc = end - start > 0.5 ? 1 : 0;\n\t\tconst a0 = 2 * Math.PI * (start - 0.25);\n\t\tconst a1 = 2 * Math.PI * (end - 0.25);\n\t\tconst x0 = Math.cos(a0);\n\t\tconst y0 = Math.sin(a0);\n\t\tconst x1 = Math.cos(a1);\n\t\tconst y1 = Math.sin(a1);\n\t\tconst d = `M ${radius + inner * x0} ${radius + inner * y0} L ${radius + radius * x0} ${radius + radius * y0} A ${radius} ${radius} 0 ${largeArc} 1 ${radius + radius * x1} ${radius + radius * y1} L ${radius + inner * x1} ${radius + inner * y1} A ${inner} ${inner} 0 ${largeArc} 0 ${radius + inner * x0} ${radius + inner * y0}`;\n\n\t\tattr(path, \"aria-label\", tooltip);\n\t\tattr(path, \"data-event\", event);\n\t\tattr(path, \"style\", style);\n\t\tattr(path, \"d\", d);\n\t\tattr(path, \"role\", \"img\");\n\t\tattr(path, \"tabindex\", \"0\");\n\t\tpie.appendChild(path);\n\t});\n\treturn pie;\n}\n"],"names":["toPies","data","aspect","variant","pie","attr","offset","radius","inner","total","tot","td","tooltip","number","event","style","path","start","end","largeArc","a0","a1","x0","y0","x1","y1","d"],"mappings":";AAKO,SAASA,EAAOC,GAAiB,EAAE,QAAAC,GAAQ,SAAAC,KAAoB;AACrE,QAAMC,IAAM,SAAS,gBAAgB,8BAA8B,KAAK;AACxE,EAAIF,KAAQE,EAAI,MAAM,YAAY,wBAAwBF,CAAM,GAChEG,EAAKD,GAAK,SAAS,KAAK,GACxBC,EAAKD,GAAK,WAAW,aAAa;AAElC,MAAIE,IAAS;AACb,QAAMC,IAAS,IACTC,IAAQL,MAAY,aAAa,KAAK,GACtCM,IAAQR,EAAK,MAAM,CAAC,EAAE,OAAO,CAACS,GAAK,CAAA,EAAGC,CAAE,MAAMD,IAAMC,EAAG,QAAQ,CAAC;AAEtE,SAAAV,EAAK,MAAM,CAAC,EAAE,QAAQ,CAAC,GAAG,EAAE,SAAAW,GAAS,QAAAC,GAAQ,OAAAC,GAAO,OAAAC,EAAA,CAAO,MAAM;AAChE,QAAI,CAACF,EAAQ;AACb,UAAMG,IAAO,SAAS,gBAAgB,8BAA8B,MAAM,GACpEC,IAAQX,IAASG;AACvB,IAAAH,KAAUO;AACV,UAAMK,IAAM,KAAK,IAAIZ,IAASG,GAAO,OAAO,GACtCU,IAAWD,IAAMD,IAAQ,MAAM,IAAI,GACnCG,IAAK,IAAI,KAAK,MAAMH,IAAQ,OAC5BI,IAAK,IAAI,KAAK,MAAMH,IAAM,OAC1BI,IAAK,KAAK,IAAIF,CAAE,GAChBG,IAAK,KAAK,IAAIH,CAAE,GAChBI,IAAK,KAAK,IAAIH,CAAE,GAChBI,IAAK,KAAK,IAAIJ,CAAE,GAChBK,IAAI,KAAKnB,IAASC,IAAQc,CAAE,IAAIf,IAASC,IAAQe,CAAE,MAAMhB,IAASA,IAASe,CAAE,IAAIf,IAASA,IAASgB,CAAE,MAAMhB,CAAM,IAAIA,CAAM,MAAMY,CAAQ,MAAMZ,IAASA,IAASiB,CAAE,IAAIjB,IAASA,IAASkB,CAAE,MAAMlB,IAASC,IAAQgB,CAAE,IAAIjB,IAASC,IAAQiB,CAAE,MAAMjB,CAAK,IAAIA,CAAK,MAAMW,CAAQ,MAAMZ,IAASC,IAAQc,CAAE,IAAIf,IAASC,IAAQe,CAAE;AAEnU,IAAAlB,EAAKW,GAAM,cAAcJ,CAAO,GAChCP,EAAKW,GAAM,cAAcF,CAAK,GAC9BT,EAAKW,GAAM,SAASD,CAAK,GACzBV,EAAKW,GAAM,KAAKU,CAAC,GACjBrB,EAAKW,GAAM,QAAQ,KAAK,GACxBX,EAAKW,GAAM,YAAY,GAAG,GAC1BZ,EAAI,YAAYY,CAAI;AAAA,EACrB,CAAC,GACMZ;AACR;"}

package/mtds/chart/chart.css.js

@@ -1,4 +1,4 @@
-const css = `/* NOTE: Using --mtds- not --mtds- since we're inside shadow dom */
+const t = `/* NOTE: Using --mtds- not --mtds- since we're inside shadow dom */
 :host(:not([hidden])) { display: grid; gap: var(--mtds-6) }
 [data-event] { cursor: pointer } /* Used to forward clicks from Chart ShaowDOM to relevant cell in child table */
 
@@ -167,6 +167,6 @@ const css = `/* NOTE: Using --mtds- not --mtds- since we're inside shadow dom */
 }
 `;
 export {
-  css as default
+  t as default
 };
 //# sourceMappingURL=chart.css.js.map

package/mtds/chart/chart.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart.css.js","sources":["../../designsystem/chart/chart.css?raw"],"sourcesContent":["export default \"/* NOTE: Using --mtds- not --mtds- since we're inside shadow dom */\\n:host(:not([hidden])) { display: grid; gap: var(--mtds-6) }\\n[data-event] { cursor: pointer } /* Used to forward clicks from Chart ShaowDOM to relevant cell in child table */\\n\\n.pie { overflow: visible; aspect-ratio: var(--mtdsc-chart-aspect) }\\n.pie > path {\\n\\tfill: var(--color);\\n\\toutline: none;\\n\\tstroke-width: var(--mtdsc-chart-border-width);\\n\\tstroke: var(--mtdsc-chart-border-color);\\n\\ttransform-origin: center;\\n\\ttransition: scale 0.2s;\\n\\tvector-effect: non-scaling-stroke;\\n}\\n.pie > path:focus-visible,\\n.pie > path:hover { scale: 1.05 }\\n:host([data-steps=\\\"false\\\"]) .axisStep::before,\\n:host([data-variant=\\\"doughnut\\\"]) .axis,\\n:host([data-variant=\\\"pie\\\"]) .axis { display: none }\\n:host([data-labels=\\\"false\\\"]) .axisGroup::before { position: absolute; pointer-events: none; opacity: 0 } /* Keep available for screen readers */\\n\\n.axis {\\n\\tdisplay: grid;\\n\\tfont-size: var(--mtds-body-sm-font-size);\\n\\tgap: var(--mtdsc-chart-axis-gap);\\n\\tgrid-template-columns: fit-content(7em) 1fr;\\n\\tgrid-template-rows: 1fr auto;\\n\\tgrid-template-areas:\\n\\t\\t\\\"y-axis chart\\\"\\n\\t\\t\\\"y-axis x-axis\\\";\\n}\\n\\n.axis::before {\\n\\tborder-bottom-left-radius: var(--mtdsc-chart-axis-edge-radius);\\n\\tborder-color: var(--mtdsc-chart-axis-edge-color);\\n\\tborder-style: solid;\\n\\tborder-width: 0 0 var(--mtdsc-chart-axis-edge-width) var(--mtdsc-chart-axis-edge-width);\\n\\tcontent: \\\"\\\";\\n\\tgrid-area: chart;\\n\\tpointer-events: none;\\n\\tz-index: 2;\\n}\\n\\n.axisSteps,\\n.axisStep,\\n.axisGroups,\\n.axisGroup { box-sizing: border-box; display: grid; position: relative } /* Help .lineContainer positioning */\\n.axisGroups {\\n\\t--gap: max(1px, clamp(.5%, calc(10% / var(--bars) * var(--groups)), var(--mtdsc-chart-axis-gap)));\\n\\tgap: var(--mtdsc-chart-axis-gap) var(--gap);\\n\\tgrid-area: chart / chart / x-axis / chart;\\n\\tgrid-auto-columns: 1fr;\\n\\tgrid-template-rows: subgrid;\\n\\tpadding: 0 var(--mtdsc-chart-axis-gap);\\n\\ttext-align: center;\\n}\\n.axisGroup { grid-row: inherit; grid-template: inherit }\\n.axisGroup::before { order: 1; content: attr(data-label); direction: ltr; min-width: 0 } /* Allow word-wrapping */\\n:host(:not([data-variant|=\\\"bar\\\"])) { .axisGroup::before { justify-self: center; text-align: start; writing-mode: vertical-rl } }\\n\\n.axisSteps { align-items: end; aspect-ratio: var(--mtdsc-chart-aspect); grid-area: chart / y-axis / chart / chart; grid-auto-rows: 1fr; grid-template: 1px / subgrid }\\n.axisStep { align-items: start; grid-column: inherit; grid-template-columns: inherit; height: 1px; text-align: right }\\n.axisStep::after { border-bottom: var(--mtdsc-chart-axis-border); content: \\\"\\\" }\\n.axisStep::before { content: attr(data-label) / \\\"\\\"; translate: 0 -50% }  /* Hide form screen readers */\\n.axisStep[data-label=\\\"0\\\"]::after { opacity: 0 } /* Hide 0 line as it overlapps with .axis::before */\\n\\n/* Reduce amount of steps if small space */\\n:host(:not([data-variant|=\\\"bar\\\"])) .axisStepsYHalf .axisStep:nth-last-child(even) { display: none }\\n:host(:not([data-variant|=\\\"bar\\\"])) .axisStepsYHalf .axisSteps:has(.axisStep:nth-last-child(even):first-child) { grid-template-rows: 0.5fr }\\n:host([data-variant|=\\\"bar\\\"]) .axisStepsXHalf .axisStep:nth-last-child(even) { display: none }\\n:host([data-variant|=\\\"bar\\\"]) .axisStepsXHalf .axisSteps:has(.axisStep:nth-last-child(even):first-child) { grid-template-columns: 0.5fr }\\n\\n:host([data-variant|=\\\"bar\\\"]) .axisSteps,\\n:host([data-variant|=\\\"bar\\\"]) .axisGroup { direction: rtl }\\n:host([data-variant|=\\\"bar\\\"]) .axisSteps > *,\\n:host([data-variant|=\\\"bar\\\"]) .axisGroup > * { direction: ltr }\\n:host([data-variant|=\\\"bar\\\"]) .axisGroups {\\n\\taspect-ratio: var(--mtdsc-chart-aspect);\\n\\tgap: 1% var(--mtdsc-chart-axis-gap);\\n\\tgrid-area: chart / y-axis / chart / chart;\\n\\tgrid-template: none / subgrid;\\n\\tpadding: var(--mtdsc-chart-axis-gap) 0;\\n\\trow-gap: var(--mtdsc-chart-axis-gap);\\n\\ttext-align: right;\\n}\\n:host([data-variant|=\\\"bar\\\"]) .axisGroup::before { align-self: center }\\n:host([data-variant|=\\\"bar\\\"]) .axisGroup { grid-column: inherit; grid-row: auto }\\n:host([data-variant|=\\\"bar\\\"]) .axisSteps { align-items: stretch; aspect-ratio: auto; grid-area: chart / chart / x-axis / chart; grid-auto-columns: 1fr; grid-template: subgrid / 1px }\\n:host([data-variant|=\\\"bar\\\"]) .axisStep { align-items: stretch; grid-row: inherit; grid-column: auto; grid-template-rows: inherit; grid-template-columns: none; text-align: center }\\n:host([data-variant|=\\\"bar\\\"]) .axisStep::after { order: -1; border-left: var(--mtdsc-chart-axis-border); border-bottom: 0 }\\n:host([data-variant|=\\\"bar\\\"]) .axisStep::before { translate: -50% 0 }\\n\\n.axisGroupContent { display: flex }\\n:host([data-variant=\\\"column-stacked\\\"]) .axisGroupContent { flex-direction: column-reverse }\\n:host([data-variant=\\\"bar\\\"]) .axisGroupContent { flex-direction: column }\\n:host([data-variant=\\\"bar-stacked\\\"]) .axisGroupContent { flex-direction: row }\\n\\n.bar {\\n\\t--size: calc(var(--value) / var(--total, 1) * 100%);\\n\\talign-self: end;\\n\\tbackground: var(--color);\\n\\tborder: var(--mtdsc-chart-border-color) solid var(--mtdsc-chart-border-width);\\n\\tborder-radius: var(--mtds-border-radius-sm) var(--mtds-border-radius-sm) 0 0;\\n\\tbox-sizing: border-box;\\n\\theight: var(--size);\\n\\twidth: 100%;\\n}\\n.bar:focus-visible,\\n.linePoint:focus-visible { box-shadow: var(--mtdsc-focus-boxShadow); outline: var(--mtdsc-focus-outline); outline-offset: var(--mtds-border-width-focus); z-index: 2 }\\n:host([data-variant|=\\\"bar\\\"]) .bar { border-radius: 0 var(--mtds-border-radius-sm) var(--mtds-border-radius-sm) 0; width: var(--size); height: 100%; align-self: start }\\n\\n/* Prevent double border - using margin to see border around bars */\\n/* Prevent double border - using border to avoid affecting size */\\n:host(:not([data-variant])) .bar + .bar,\\n:host([data-variant=\\\"column\\\"]) .bar + .bar { margin-left: -1px }\\n:host([data-variant=\\\"column-stacked\\\"]) .bar:not(:last-child) { border-radius: 0 }\\n:host([data-variant=\\\"column-stacked\\\"]) .bar + .bar { border-bottom: none }\\n:host([data-variant=\\\"bar\\\"]) .bar + .bar { margin-top: -1px }\\n:host([data-variant=\\\"bar-stacked\\\"]) .bar:not(:last-child) { border-radius: 0 }\\n:host([data-variant=\\\"bar-stacked\\\"]) .bar + .bar { border-left: none }\\n\\n.lineContainer { align-items: flex-start; display: flex; justify-content: space-between; pointer-events: none; grid-row: chart }\\n.lineContainer > svg, .lineContainer { position: absolute; width: 100%; height: 100% }\\n.lineContainer > svg { overflow: clip visible }\\n.lineContainer > div[role=\\\"listitem\\\"] { display: contents }\\n\\n:host([data-variant|=\\\"line\\\"]) .axisGroups,\\n:host([data-variant|=\\\"area\\\"]) .axisGroups { padding: 0 }\\n.lineShade, .line { fill: none; stroke: var(--color); stroke-linejoin: round; stroke-linecap: round; stroke-width: 1.5; vector-effect: non-scaling-stroke }\\n.lineShade { stroke: none; fill: var(--color); opacity: 0.3; mask: linear-gradient(to bottom, black, transparent) }\\n\\n.linePoint, .line, :host:has(.linePoint) .legend::before { filter: var(--_mtdsc-chart-line-filter) } /* Ensure more contrast for line colors */\\n.linePoint {\\n\\t--size: var(--mtds-2);\\n\\tbackground: var(--color);\\n\\tborder-radius: var(--mtds-border-radius-full);\\n\\tborder: var(--mtdsc-chart-border-width) solid var(--mtdsc-chart-border-color);\\n\\tbox-sizing: border-box;\\n\\theight: var(--size);\\n\\tmargin: calc(var(--size) / -2);\\n\\tpadding: 0;\\n\\tpointer-events: all;\\n\\tposition: relative;\\n\\ttop: calc(100% - var(--value) / var(--total, 1) * 100%);\\n\\ttransition: scale 0.2s;\\n\\twidth: var(--size);\\n\\tz-index: 2;\\n}\\n.linePoint:focus-visible,\\n.linePoint:hover { scale: 1.3 }\\n.linePoint::before { content: \\\"\\\"; position: absolute; inset: calc(var(--mtds-3) * -1); /* Increase click surface */ }\\n:host([data-dots=\\\"false\\\"]) .linePoint { background: none; border: none }\\n\\n:host([data-legend=\\\"false\\\"]) .legends { display: none }\\n.legends { align-items: center; display: flex; flex-wrap: wrap; gap: var(--mtds-2) var(--mtds-5); justify-content: center }\\n.legend { display: flex; align-items: center; gap: var(--mtds-2) }\\n.legend::before {\\n\\tbackground: var(--color);\\n\\tborder-radius: var(--mtds-border-radius-full);\\n\\tborder: var(--mtdsc-chart-border-color) solid var(--mtdsc-chart-border-width);\\n\\tbox-sizing: border-box;\\n\\tcontent: \\\"\\\";\\n\\tdisplay: inline-block;\\n\\theight: var(--mtds-5);\\n\\tvertical-align: middle;\\n\\twidth: var(--mtds-5);\\n}\\n\""],"names":[],"mappings":"AAAA,MAAA,MAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"chart.css.js","sources":["../../designsystem/chart/chart.css?raw"],"sourcesContent":["export default \"/* NOTE: Using --mtds- not --mtds- since we're inside shadow dom */\\n:host(:not([hidden])) { display: grid; gap: var(--mtds-6) }\\n[data-event] { cursor: pointer } /* Used to forward clicks from Chart ShaowDOM to relevant cell in child table */\\n\\n.pie { overflow: visible; aspect-ratio: var(--mtdsc-chart-aspect) }\\n.pie > path {\\n\\tfill: var(--color);\\n\\toutline: none;\\n\\tstroke-width: var(--mtdsc-chart-border-width);\\n\\tstroke: var(--mtdsc-chart-border-color);\\n\\ttransform-origin: center;\\n\\ttransition: scale 0.2s;\\n\\tvector-effect: non-scaling-stroke;\\n}\\n.pie > path:focus-visible,\\n.pie > path:hover { scale: 1.05 }\\n:host([data-steps=\\\"false\\\"]) .axisStep::before,\\n:host([data-variant=\\\"doughnut\\\"]) .axis,\\n:host([data-variant=\\\"pie\\\"]) .axis { display: none }\\n:host([data-labels=\\\"false\\\"]) .axisGroup::before { position: absolute; pointer-events: none; opacity: 0 } /* Keep available for screen readers */\\n\\n.axis {\\n\\tdisplay: grid;\\n\\tfont-size: var(--mtds-body-sm-font-size);\\n\\tgap: var(--mtdsc-chart-axis-gap);\\n\\tgrid-template-columns: fit-content(7em) 1fr;\\n\\tgrid-template-rows: 1fr auto;\\n\\tgrid-template-areas:\\n\\t\\t\\\"y-axis chart\\\"\\n\\t\\t\\\"y-axis x-axis\\\";\\n}\\n\\n.axis::before {\\n\\tborder-bottom-left-radius: var(--mtdsc-chart-axis-edge-radius);\\n\\tborder-color: var(--mtdsc-chart-axis-edge-color);\\n\\tborder-style: solid;\\n\\tborder-width: 0 0 var(--mtdsc-chart-axis-edge-width) var(--mtdsc-chart-axis-edge-width);\\n\\tcontent: \\\"\\\";\\n\\tgrid-area: chart;\\n\\tpointer-events: none;\\n\\tz-index: 2;\\n}\\n\\n.axisSteps,\\n.axisStep,\\n.axisGroups,\\n.axisGroup { box-sizing: border-box; display: grid; position: relative } /* Help .lineContainer positioning */\\n.axisGroups {\\n\\t--gap: max(1px, clamp(.5%, calc(10% / var(--bars) * var(--groups)), var(--mtdsc-chart-axis-gap)));\\n\\tgap: var(--mtdsc-chart-axis-gap) var(--gap);\\n\\tgrid-area: chart / chart / x-axis / chart;\\n\\tgrid-auto-columns: 1fr;\\n\\tgrid-template-rows: subgrid;\\n\\tpadding: 0 var(--mtdsc-chart-axis-gap);\\n\\ttext-align: center;\\n}\\n.axisGroup { grid-row: inherit; grid-template: inherit }\\n.axisGroup::before { order: 1; content: attr(data-label); direction: ltr; min-width: 0 } /* Allow word-wrapping */\\n:host(:not([data-variant|=\\\"bar\\\"])) { .axisGroup::before { justify-self: center; text-align: start; writing-mode: vertical-rl } }\\n\\n.axisSteps { align-items: end; aspect-ratio: var(--mtdsc-chart-aspect); grid-area: chart / y-axis / chart / chart; grid-auto-rows: 1fr; grid-template: 1px / subgrid }\\n.axisStep { align-items: start; grid-column: inherit; grid-template-columns: inherit; height: 1px; text-align: right }\\n.axisStep::after { border-bottom: var(--mtdsc-chart-axis-border); content: \\\"\\\" }\\n.axisStep::before { content: attr(data-label) / \\\"\\\"; translate: 0 -50% }  /* Hide form screen readers */\\n.axisStep[data-label=\\\"0\\\"]::after { opacity: 0 } /* Hide 0 line as it overlapps with .axis::before */\\n\\n/* Reduce amount of steps if small space */\\n:host(:not([data-variant|=\\\"bar\\\"])) .axisStepsYHalf .axisStep:nth-last-child(even) { display: none }\\n:host(:not([data-variant|=\\\"bar\\\"])) .axisStepsYHalf .axisSteps:has(.axisStep:nth-last-child(even):first-child) { grid-template-rows: 0.5fr }\\n:host([data-variant|=\\\"bar\\\"]) .axisStepsXHalf .axisStep:nth-last-child(even) { display: none }\\n:host([data-variant|=\\\"bar\\\"]) .axisStepsXHalf .axisSteps:has(.axisStep:nth-last-child(even):first-child) { grid-template-columns: 0.5fr }\\n\\n:host([data-variant|=\\\"bar\\\"]) .axisSteps,\\n:host([data-variant|=\\\"bar\\\"]) .axisGroup { direction: rtl }\\n:host([data-variant|=\\\"bar\\\"]) .axisSteps > *,\\n:host([data-variant|=\\\"bar\\\"]) .axisGroup > * { direction: ltr }\\n:host([data-variant|=\\\"bar\\\"]) .axisGroups {\\n\\taspect-ratio: var(--mtdsc-chart-aspect);\\n\\tgap: 1% var(--mtdsc-chart-axis-gap);\\n\\tgrid-area: chart / y-axis / chart / chart;\\n\\tgrid-template: none / subgrid;\\n\\tpadding: var(--mtdsc-chart-axis-gap) 0;\\n\\trow-gap: var(--mtdsc-chart-axis-gap);\\n\\ttext-align: right;\\n}\\n:host([data-variant|=\\\"bar\\\"]) .axisGroup::before { align-self: center }\\n:host([data-variant|=\\\"bar\\\"]) .axisGroup { grid-column: inherit; grid-row: auto }\\n:host([data-variant|=\\\"bar\\\"]) .axisSteps { align-items: stretch; aspect-ratio: auto; grid-area: chart / chart / x-axis / chart; grid-auto-columns: 1fr; grid-template: subgrid / 1px }\\n:host([data-variant|=\\\"bar\\\"]) .axisStep { align-items: stretch; grid-row: inherit; grid-column: auto; grid-template-rows: inherit; grid-template-columns: none; text-align: center }\\n:host([data-variant|=\\\"bar\\\"]) .axisStep::after { order: -1; border-left: var(--mtdsc-chart-axis-border); border-bottom: 0 }\\n:host([data-variant|=\\\"bar\\\"]) .axisStep::before { translate: -50% 0 }\\n\\n.axisGroupContent { display: flex }\\n:host([data-variant=\\\"column-stacked\\\"]) .axisGroupContent { flex-direction: column-reverse }\\n:host([data-variant=\\\"bar\\\"]) .axisGroupContent { flex-direction: column }\\n:host([data-variant=\\\"bar-stacked\\\"]) .axisGroupContent { flex-direction: row }\\n\\n.bar {\\n\\t--size: calc(var(--value) / var(--total, 1) * 100%);\\n\\talign-self: end;\\n\\tbackground: var(--color);\\n\\tborder: var(--mtdsc-chart-border-color) solid var(--mtdsc-chart-border-width);\\n\\tborder-radius: var(--mtds-border-radius-sm) var(--mtds-border-radius-sm) 0 0;\\n\\tbox-sizing: border-box;\\n\\theight: var(--size);\\n\\twidth: 100%;\\n}\\n.bar:focus-visible,\\n.linePoint:focus-visible { box-shadow: var(--mtdsc-focus-boxShadow); outline: var(--mtdsc-focus-outline); outline-offset: var(--mtds-border-width-focus); z-index: 2 }\\n:host([data-variant|=\\\"bar\\\"]) .bar { border-radius: 0 var(--mtds-border-radius-sm) var(--mtds-border-radius-sm) 0; width: var(--size); height: 100%; align-self: start }\\n\\n/* Prevent double border - using margin to see border around bars */\\n/* Prevent double border - using border to avoid affecting size */\\n:host(:not([data-variant])) .bar + .bar,\\n:host([data-variant=\\\"column\\\"]) .bar + .bar { margin-left: -1px }\\n:host([data-variant=\\\"column-stacked\\\"]) .bar:not(:last-child) { border-radius: 0 }\\n:host([data-variant=\\\"column-stacked\\\"]) .bar + .bar { border-bottom: none }\\n:host([data-variant=\\\"bar\\\"]) .bar + .bar { margin-top: -1px }\\n:host([data-variant=\\\"bar-stacked\\\"]) .bar:not(:last-child) { border-radius: 0 }\\n:host([data-variant=\\\"bar-stacked\\\"]) .bar + .bar { border-left: none }\\n\\n.lineContainer { align-items: flex-start; display: flex; justify-content: space-between; pointer-events: none; grid-row: chart }\\n.lineContainer > svg, .lineContainer { position: absolute; width: 100%; height: 100% }\\n.lineContainer > svg { overflow: clip visible }\\n.lineContainer > div[role=\\\"listitem\\\"] { display: contents }\\n\\n:host([data-variant|=\\\"line\\\"]) .axisGroups,\\n:host([data-variant|=\\\"area\\\"]) .axisGroups { padding: 0 }\\n.lineShade, .line { fill: none; stroke: var(--color); stroke-linejoin: round; stroke-linecap: round; stroke-width: 1.5; vector-effect: non-scaling-stroke }\\n.lineShade { stroke: none; fill: var(--color); opacity: 0.3; mask: linear-gradient(to bottom, black, transparent) }\\n\\n.linePoint, .line, :host:has(.linePoint) .legend::before { filter: var(--_mtdsc-chart-line-filter) } /* Ensure more contrast for line colors */\\n.linePoint {\\n\\t--size: var(--mtds-2);\\n\\tbackground: var(--color);\\n\\tborder-radius: var(--mtds-border-radius-full);\\n\\tborder: var(--mtdsc-chart-border-width) solid var(--mtdsc-chart-border-color);\\n\\tbox-sizing: border-box;\\n\\theight: var(--size);\\n\\tmargin: calc(var(--size) / -2);\\n\\tpadding: 0;\\n\\tpointer-events: all;\\n\\tposition: relative;\\n\\ttop: calc(100% - var(--value) / var(--total, 1) * 100%);\\n\\ttransition: scale 0.2s;\\n\\twidth: var(--size);\\n\\tz-index: 2;\\n}\\n.linePoint:focus-visible,\\n.linePoint:hover { scale: 1.3 }\\n.linePoint::before { content: \\\"\\\"; position: absolute; inset: calc(var(--mtds-3) * -1); /* Increase click surface */ }\\n:host([data-dots=\\\"false\\\"]) .linePoint { background: none; border: none }\\n\\n:host([data-legend=\\\"false\\\"]) .legends { display: none }\\n.legends { align-items: center; display: flex; flex-wrap: wrap; gap: var(--mtds-2) var(--mtds-5); justify-content: center }\\n.legend { display: flex; align-items: center; gap: var(--mtds-2) }\\n.legend::before {\\n\\tbackground: var(--color);\\n\\tborder-radius: var(--mtds-border-radius-full);\\n\\tborder: var(--mtdsc-chart-border-color) solid var(--mtdsc-chart-border-width);\\n\\tbox-sizing: border-box;\\n\\tcontent: \\\"\\\";\\n\\tdisplay: inline-block;\\n\\theight: var(--mtds-5);\\n\\tvertical-align: middle;\\n\\twidth: var(--mtds-5);\\n}\\n\""],"names":["css"],"mappings":"AAAA,MAAAA,IAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/mtds/chart/chart.js

@@ -1,17 +1,17 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { toCustomElementProps } from "../utils.js";
+import { jsx as r, jsxs as d } from "react/jsx-runtime";
+import { forwardRef as $ } from "react";
+import { toCustomElementProps as p } from "../utils.js";
 import "./chart-element.js";
-let RENDER = 0;
-const Chart = forwardRef(function Chart2({ data, children, ...rest }, ref) {
-  return /* @__PURE__ */ jsx("mtds-chart", { ref, ...toCustomElementProps(rest), children: data ? /* @__PURE__ */ jsxs("table", { children: [
-    /* @__PURE__ */ jsx("thead", { children: data.slice(0, 1).map((tr, row) => /* @__PURE__ */ jsx("tr", { children: tr.map((td, i) => /* @__PURE__ */ jsx("th", { children: td }, `${i}_${RENDER}`)) }, `${row}_${RENDER}`)) }),
-    /* @__PURE__ */ jsx("tbody", { children: data.slice(1).map((tr, row) => /* @__PURE__ */ jsx("tr", { children: tr.map(
-      (td, i) => i ? /* @__PURE__ */ jsx("td", { children: td }, `${i}_${RENDER}`) : /* @__PURE__ */ jsx("th", { children: td }, `${i}_${RENDER}`)
-    ) }, `${row}_${RENDER}`)) })
-  ] }, `table_${++RENDER}`) : children });
+let t = 0;
+const u = $(function({ data: l, children: i, ...m }, n) {
+  return /* @__PURE__ */ r("mtds-chart", { ref: n, ...p(m), children: l ? /* @__PURE__ */ d("table", { children: [
+    /* @__PURE__ */ r("thead", { children: l.slice(0, 1).map((o, c) => /* @__PURE__ */ r("tr", { children: o.map((h, e) => /* @__PURE__ */ r("th", { children: h }, `${e}_${t}`)) }, `${c}_${t}`)) }),
+    /* @__PURE__ */ r("tbody", { children: l.slice(1).map((o, c) => /* @__PURE__ */ r("tr", { children: o.map(
+      (h, e) => e ? /* @__PURE__ */ r("td", { children: h }, `${e}_${t}`) : /* @__PURE__ */ r("th", { children: h }, `${e}_${t}`)
+    ) }, `${c}_${t}`)) })
+  ] }, `table_${++t}`) : i });
 });
 export {
-  Chart
+  u as Chart
 };
 //# sourceMappingURL=chart.js.map

package/mtds/chart/chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart.js","sources":["../../designsystem/chart/chart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { toCustomElementProps } from \"../utils\";\nimport \"./chart-element\";\nimport type { CustomReactElementProps } from \"../react-types\";\nimport type { MTDSChartElement } from \"./chart-element\";\n\ndeclare global {\n\tnamespace React.JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t\"mtds-chart\": ChartProps;\n\t\t}\n\t}\n}\n\nexport type ChartProps = CustomReactElementProps<MTDSChartElement> & {\n\tdata?: (number | string)[][];\n\t\"data-legend\"?: \"none\" | \"hidden\" | \"false\" | \"true\" | boolean;\n\t\"data-axis\"?: \"none\" | \"hidden\" | \"false\" | \"true\" | boolean;\n\t\"data-variant\"?:\n\t\t| \"area\"\n\t\t| \"bar\"\n\t\t| \"bar-stacked\"\n\t\t| \"column\"\n\t\t| \"column-stacked\"\n\t\t| \"doughnut\"\n\t\t| \"line\"\n\t\t| \"pie\";\n};\n\nlet RENDER = 0; // Ensure re-render on data change\nexport const Chart = forwardRef<MTDSChartElement, ChartProps>(function Chart(\n\t{ data, children, ...rest },\n\tref,\n) {\n\treturn (\n\t\t<mtds-chart ref={ref} {...toCustomElementProps(rest)}>\n\t\t\t{data ? (\n\t\t\t\t<table key={`table_${++RENDER}`}>\n\t\t\t\t\t<thead>\n\t\t\t\t\t\t{data.slice(0, 1).map((tr, row) => (\n\t\t\t\t\t\t\t<tr key={`${row}_${RENDER}`}>\n\t\t\t\t\t\t\t\t{tr.map((td, i) => (\n\t\t\t\t\t\t\t\t\t<th key={`${i}_${RENDER}`}>{td}</th>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</thead>\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t{data.slice(1).map((tr, row) => (\n\t\t\t\t\t\t\t<tr key={`${row}_${RENDER}`}>\n\t\t\t\t\t\t\t\t{tr.map((td, i) =>\n\t\t\t\t\t\t\t\t\ti ? (\n\t\t\t\t\t\t\t\t\t\t<td key={`${i}_${RENDER}`}>{td}</td>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<th key={`${i}_${RENDER}`}>{td}</th>\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</tbody>\n\t\t\t\t</table>\n\t\t\t) : (\n\t\t\t\tchildren\n\t\t\t)}\n\t\t</mtds-chart>\n\t);\n});\n"],"names":["Chart"],"mappings":";;;;AA6BA,IAAI,SAAS;AACN,MAAM,QAAQ,WAAyC,SAASA,OACtE,EAAE,MAAM,UAAU,GAAG,KAAA,GACrB,KACC;AACD,SACC,oBAAC,gBAAW,KAAW,GAAG,qBAAqB,IAAI,GACjD,UAAA,OACA,qBAAC,SAAA,EACA,UAAA;AAAA,IAAA,oBAAC,SAAA,EACC,UAAA,KAAK,MAAM,GAAG,CAAC,EAAE,IAAI,CAAC,IAAI,QAC1B,oBAAC,MAAA,EACC,UAAA,GAAG,IAAI,CAAC,IAAI,MACZ,oBAAC,MAAA,EAA2B,UAAA,GAAA,GAAnB,GAAG,CAAC,IAAI,MAAM,EAAQ,CAC/B,EAAA,GAHO,GAAG,GAAG,IAAI,MAAM,EAIzB,CACA,GACF;AAAA,IACA,oBAAC,SAAA,EACC,UAAA,KAAK,MAAM,CAAC,EAAE,IAAI,CAAC,IAAI,QACvB,oBAAC,MAAA,EACC,UAAA,GAAG;AAAA,MAAI,CAAC,IAAI,MACZ,wBACE,MAAA,EAA2B,UAAA,GAAA,GAAnB,GAAG,CAAC,IAAI,MAAM,EAAQ,wBAE9B,MAAA,EAA2B,UAAA,GAAA,GAAnB,GAAG,CAAC,IAAI,MAAM,EAAQ;AAAA,IAAA,KALzB,GAAG,GAAG,IAAI,MAAM,EAQzB,CACA,EAAA,CACF;AAAA,EAAA,EAAA,GAtBW,SAAS,EAAE,MAAM,EAuB7B,IAEA,UAEF;AAEF,CAAC;"}
+{"version":3,"file":"chart.js","sources":["../../designsystem/chart/chart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { toCustomElementProps } from \"../utils\";\nimport \"./chart-element\";\nimport type { CustomReactElementProps } from \"../react-types\";\nimport type { MTDSChartElement } from \"./chart-element\";\n\ndeclare global {\n\tnamespace React.JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t\"mtds-chart\": ChartProps;\n\t\t}\n\t}\n}\n\nexport type ChartProps = CustomReactElementProps<MTDSChartElement> & {\n\tdata?: (number | string)[][];\n\t\"data-legend\"?: \"none\" | \"hidden\" | \"false\" | \"true\" | boolean;\n\t\"data-axis\"?: \"none\" | \"hidden\" | \"false\" | \"true\" | boolean;\n\t\"data-variant\"?:\n\t\t| \"area\"\n\t\t| \"bar\"\n\t\t| \"bar-stacked\"\n\t\t| \"column\"\n\t\t| \"column-stacked\"\n\t\t| \"doughnut\"\n\t\t| \"line\"\n\t\t| \"pie\";\n};\n\nlet RENDER = 0; // Ensure re-render on data change\nexport const Chart = forwardRef<MTDSChartElement, ChartProps>(function Chart(\n\t{ data, children, ...rest },\n\tref,\n) {\n\treturn (\n\t\t<mtds-chart ref={ref} {...toCustomElementProps(rest)}>\n\t\t\t{data ? (\n\t\t\t\t<table key={`table_${++RENDER}`}>\n\t\t\t\t\t<thead>\n\t\t\t\t\t\t{data.slice(0, 1).map((tr, row) => (\n\t\t\t\t\t\t\t<tr key={`${row}_${RENDER}`}>\n\t\t\t\t\t\t\t\t{tr.map((td, i) => (\n\t\t\t\t\t\t\t\t\t<th key={`${i}_${RENDER}`}>{td}</th>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</thead>\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t{data.slice(1).map((tr, row) => (\n\t\t\t\t\t\t\t<tr key={`${row}_${RENDER}`}>\n\t\t\t\t\t\t\t\t{tr.map((td, i) =>\n\t\t\t\t\t\t\t\t\ti ? (\n\t\t\t\t\t\t\t\t\t\t<td key={`${i}_${RENDER}`}>{td}</td>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<th key={`${i}_${RENDER}`}>{td}</th>\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</tbody>\n\t\t\t\t</table>\n\t\t\t) : (\n\t\t\t\tchildren\n\t\t\t)}\n\t\t</mtds-chart>\n\t);\n});\n"],"names":["RENDER","Chart","forwardRef","data","children","rest","ref","jsx","toCustomElementProps","jsxs","tr","row","td","i"],"mappings":";;;;AA6BA,IAAIA,IAAS;AACN,MAAMC,IAAQC,EAAyC,SAC7D,EAAE,MAAAC,GAAM,UAAAC,GAAU,GAAGC,EAAA,GACrBC,GACC;AACD,SACC,gBAAAC,EAAC,gBAAW,KAAAD,GAAW,GAAGE,EAAqBH,CAAI,GACjD,UAAAF,IACA,gBAAAM,EAAC,SAAA,EACA,UAAA;AAAA,IAAA,gBAAAF,EAAC,SAAA,EACC,UAAAJ,EAAK,MAAM,GAAG,CAAC,EAAE,IAAI,CAACO,GAAIC,MAC1B,gBAAAJ,EAAC,MAAA,EACC,UAAAG,EAAG,IAAI,CAACE,GAAIC,MACZ,gBAAAN,EAAC,MAAA,EAA2B,UAAAK,EAAA,GAAnB,GAAGC,CAAC,IAAIb,CAAM,EAAQ,CAC/B,EAAA,GAHO,GAAGW,CAAG,IAAIX,CAAM,EAIzB,CACA,GACF;AAAA,IACA,gBAAAO,EAAC,SAAA,EACC,UAAAJ,EAAK,MAAM,CAAC,EAAE,IAAI,CAACO,GAAIC,MACvB,gBAAAJ,EAAC,MAAA,EACC,UAAAG,EAAG;AAAA,MAAI,CAACE,GAAIC,MACZA,sBACE,MAAA,EAA2B,UAAAD,EAAA,GAAnB,GAAGC,CAAC,IAAIb,CAAM,EAAQ,sBAE9B,MAAA,EAA2B,UAAAY,EAAA,GAAnB,GAAGC,CAAC,IAAIb,CAAM,EAAQ;AAAA,IAAA,KALzB,GAAGW,CAAG,IAAIX,CAAM,EAQzB,CACA,EAAA,CACF;AAAA,EAAA,EAAA,GAtBW,SAAS,EAAEA,CAAM,EAuB7B,IAEAI,GAEF;AAEF,CAAC;"}

package/mtds/chip/chip.js

@@ -1,12 +1,12 @@
-import { jsx } from "react/jsx-runtime";
-import clsx from "clsx";
-import { forwardRef } from "react";
-import styles from "../styles.module.css.js";
-const Chip = forwardRef(function Chip2({ as, className, ...rest }, ref) {
-  const Tag = as || (rest["data-removable"] ? "button" : "label");
-  return /* @__PURE__ */ jsx(Tag, { className: clsx(styles.chip, className), ref, ...rest });
+import { jsx as i } from "react/jsx-runtime";
+import p from "clsx";
+import { forwardRef as e } from "react";
+import f from "../styles.module.css.js";
+const h = e(function({ as: r, className: t, ...o }, m) {
+  const a = r || (o["data-removable"] ? "button" : "label");
+  return /* @__PURE__ */ i(a, { className: p(f.chip, t), ref: m, ...o });
 });
 export {
-  Chip
+  h as Chip
 };
 //# sourceMappingURL=chip.js.map

package/mtds/chip/chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.js","sources":["../../designsystem/chip/chip.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef, type JSX } from \"react\";\nimport type {\n\tPolymorphicComponentPropWithRef,\n\tPolymorphicRef,\n} from \"../react-types\";\nimport styles from \"../styles.module.css\";\n\ntype ChipBaseProps<Removable> = {\n\thref?: Removable;\n\t\"data-removable\"?: boolean;\n};\n\nexport type ChipProps<\n\tRemovable,\n\tAs extends React.ElementType = Removable extends true ? \"button\" : \"label\",\n> = PolymorphicComponentPropWithRef<As, ChipBaseProps<Removable>>;\n\ntype ChipComponent = <\n\tRemovable,\n\tAs extends React.ElementType = Removable extends true ? \"button\" : \"label\",\n>(\n\tprops: ChipProps<Removable, As>,\n) => JSX.Element;\n\nexport const Chip: ChipComponent = forwardRef<null>(function Chip<\n\tHref,\n\tAs extends React.ElementType = Href extends string ? \"a\" : \"div\",\n>({ as, className, ...rest }: ChipProps<Href, As>, ref?: PolymorphicRef<As>) {\n\tconst Tag = as || (rest[\"data-removable\"] ? \"button\" : \"label\");\n\n\treturn <Tag className={clsx(styles.chip, className)} ref={ref} {...rest} />;\n}) as ChipComponent; // Needed to tell Typescript this does not return ReactNode but acutally JSX.Element\n"],"names":["Chip"],"mappings":";;;;AAyBO,MAAM,OAAsB,WAAiB,SAASA,MAG3D,EAAE,IAAI,WAAW,GAAG,KAAA,GAA6B,KAA0B;AAC5E,QAAM,MAAM,OAAO,KAAK,gBAAgB,IAAI,WAAW;AAEvD,SAAO,oBAAC,KAAA,EAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAG,KAAW,GAAG,KAAA,CAAM;AAC1E,CAAC;"}
+{"version":3,"file":"chip.js","sources":["../../designsystem/chip/chip.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef, type JSX } from \"react\";\nimport type {\n\tPolymorphicComponentPropWithRef,\n\tPolymorphicRef,\n} from \"../react-types\";\nimport styles from \"../styles.module.css\";\n\ntype ChipBaseProps<Removable> = {\n\thref?: Removable;\n\t\"data-removable\"?: boolean;\n};\n\nexport type ChipProps<\n\tRemovable,\n\tAs extends React.ElementType = Removable extends true ? \"button\" : \"label\",\n> = PolymorphicComponentPropWithRef<As, ChipBaseProps<Removable>>;\n\ntype ChipComponent = <\n\tRemovable,\n\tAs extends React.ElementType = Removable extends true ? \"button\" : \"label\",\n>(\n\tprops: ChipProps<Removable, As>,\n) => JSX.Element;\n\nexport const Chip: ChipComponent = forwardRef<null>(function Chip<\n\tHref,\n\tAs extends React.ElementType = Href extends string ? \"a\" : \"div\",\n>({ as, className, ...rest }: ChipProps<Href, As>, ref?: PolymorphicRef<As>) {\n\tconst Tag = as || (rest[\"data-removable\"] ? \"button\" : \"label\");\n\n\treturn <Tag className={clsx(styles.chip, className)} ref={ref} {...rest} />;\n}) as ChipComponent; // Needed to tell Typescript this does not return ReactNode but acutally JSX.Element\n"],"names":["Chip","forwardRef","as","className","rest","ref","Tag","jsx","clsx","styles"],"mappings":";;;;AAyBO,MAAMA,IAAsBC,EAAiB,SAGlD,EAAE,IAAAC,GAAI,WAAAC,GAAW,GAAGC,EAAA,GAA6BC,GAA0B;AAC5E,QAAMC,IAAMJ,MAAOE,EAAK,gBAAgB,IAAI,WAAW;AAEvD,SAAO,gBAAAG,EAACD,GAAA,EAAI,WAAWE,EAAKC,EAAO,MAAMN,CAAS,GAAG,KAAAE,GAAW,GAAGD,EAAA,CAAM;AAC1E,CAAC;"}

package/mtds/details/details.js

@@ -1,19 +1,17 @@
-import { jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import styles from "../styles.module.css.js";
-import { toCustomElementProps } from "../utils.js";
-const DetailsComp = forwardRef(
-  function Details2(props, ref) {
-    return /* @__PURE__ */ jsx("u-details", { ref, ...toCustomElementProps(props, styles.details) });
+import { jsx as m } from "react/jsx-runtime";
+import { forwardRef as o } from "react";
+import i from "../styles.module.css.js";
+import { toCustomElementProps as s } from "../utils.js";
+const a = o(
+  function(t, r) {
+    return /* @__PURE__ */ m("u-details", { ref: r, ...s(t, i.details) });
   }
-);
-const DetailsSummary = forwardRef(
-  function DetailsSummary2(props, ref) {
-    return /* @__PURE__ */ jsx("u-summary", { ref, ...toCustomElementProps(props) });
+), n = o(
+  function(t, r) {
+    return /* @__PURE__ */ m("u-summary", { ref: r, ...s(t) });
   }
-);
-const Details = Object.assign(DetailsComp, { Summary: DetailsSummary });
+), c = Object.assign(a, { Summary: n });
 export {
-  Details
+  c as Details
 };
 //# sourceMappingURL=details.js.map

package/mtds/details/details.js.map

@@ -1 +1 @@
-{"version":3,"file":"details.js","sources":["../../designsystem/details/details.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport styles from \"../styles.module.css\";\nimport { toCustomElementProps } from \"../utils\";\n\nexport type DetailsProps = React.ComponentPropsWithoutRef<\"details\"> & {\n\t\"data-align\"?: \"start\" | \"center\";\n\t\"data-variant\"?: \"default\" | \"card\";\n};\nconst DetailsComp = forwardRef<HTMLDetailsElement, DetailsProps>(\n\tfunction Details(props, ref) {\n\t\treturn (\n\t\t\t<u-details ref={ref} {...toCustomElementProps(props, styles.details)} />\n\t\t);\n\t},\n);\n\nexport type SummaryProps = React.ComponentPropsWithoutRef<\"summary\">;\nconst DetailsSummary = forwardRef<HTMLElement, SummaryProps>(\n\tfunction DetailsSummary(props, ref) {\n\t\treturn <u-summary ref={ref} {...toCustomElementProps(props)} />;\n\t},\n);\n\nexport const Details = Object.assign(DetailsComp, { Summary: DetailsSummary });\n"],"names":["Details","DetailsSummary"],"mappings":";;;;AAQA,MAAM,cAAc;AAAA,EACnB,SAASA,SAAQ,OAAO,KAAK;AAC5B,WACC,oBAAC,eAAU,KAAW,GAAG,qBAAqB,OAAO,OAAO,OAAO,GAAG;AAAA,EAExE;AACD;AAGA,MAAM,iBAAiB;AAAA,EACtB,SAASC,gBAAe,OAAO,KAAK;AACnC,+BAAQ,aAAA,EAAU,KAAW,GAAG,qBAAqB,KAAK,GAAG;AAAA,EAC9D;AACD;AAEO,MAAM,UAAU,OAAO,OAAO,aAAa,EAAE,SAAS,gBAAgB;"}
+{"version":3,"file":"details.js","sources":["../../designsystem/details/details.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport styles from \"../styles.module.css\";\nimport { toCustomElementProps } from \"../utils\";\n\nexport type DetailsProps = React.ComponentPropsWithoutRef<\"details\"> & {\n\t\"data-align\"?: \"start\" | \"center\";\n\t\"data-variant\"?: \"default\" | \"card\";\n};\nconst DetailsComp = forwardRef<HTMLDetailsElement, DetailsProps>(\n\tfunction Details(props, ref) {\n\t\treturn (\n\t\t\t<u-details ref={ref} {...toCustomElementProps(props, styles.details)} />\n\t\t);\n\t},\n);\n\nexport type SummaryProps = React.ComponentPropsWithoutRef<\"summary\">;\nconst DetailsSummary = forwardRef<HTMLElement, SummaryProps>(\n\tfunction DetailsSummary(props, ref) {\n\t\treturn <u-summary ref={ref} {...toCustomElementProps(props)} />;\n\t},\n);\n\nexport const Details = Object.assign(DetailsComp, { Summary: DetailsSummary });\n"],"names":["DetailsComp","forwardRef","props","ref","jsx","toCustomElementProps","styles","DetailsSummary","Details"],"mappings":";;;;AAQA,MAAMA,IAAcC;AAAA,EACnB,SAAiBC,GAAOC,GAAK;AAC5B,WACC,gBAAAC,EAAC,eAAU,KAAAD,GAAW,GAAGE,EAAqBH,GAAOI,EAAO,OAAO,GAAG;AAAA,EAExE;AACD,GAGMC,IAAiBN;AAAA,EACtB,SAAwBC,GAAOC,GAAK;AACnC,6BAAQ,aAAA,EAAU,KAAAA,GAAW,GAAGE,EAAqBH,CAAK,GAAG;AAAA,EAC9D;AACD,GAEaM,IAAU,OAAO,OAAOR,GAAa,EAAE,SAASO,GAAgB;"}

package/mtds/dialog/dialog-observer.js

@@ -1,42 +1,29 @@
-import styles from "../styles.module.css.js";
-import { isBrowser, onLoaded, on, onMutation, QUICK_EVENT, attr } from "../utils.js";
-const CSS_DIALOG = styles.dialog.split(" ")[0];
-const DIALOGS = isBrowser() ? document.getElementsByClassName(
-  CSS_DIALOG
+import r from "../styles.module.css.js";
+import { isBrowser as g, onLoaded as p, on as i, onMutation as h, QUICK_EVENT as a, attr as e } from "../utils.js";
+const u = r.dialog.split(" ")[0], c = g() ? document.getElementsByClassName(
+  u
 ) : [];
-function handleDialogModal() {
-  for (const dialog of DIALOGS)
-    if (dialog.isConnected && dialog.showModal && dialog.close) {
-      if (dialog.matches('[open]:not([data-modal="false"]):not(:modal)')) {
-        attr(dialog, "open", null);
-        dialog.showModal();
-      } else if (dialog.matches(":modal:not([open])")) {
-        attr(dialog, "open", "");
-        dialog.close();
-      }
-    }
+function C() {
+  for (const o of c)
+    o.isConnected && o.showModal && o.close && (o.matches('[open]:not([data-modal="false"]):not(:modal)') ? (e(o, "open", null), o.showModal()) : o.matches(":modal:not([open])") && (e(o, "open", ""), o.close()));
 }
-let START_INSIDE = false;
-const isInside = (el, { clientX: x = 0, clientY: y = 0 }) => {
-  const { top, right, bottom, left } = el.getBoundingClientRect();
-  return top <= y && y <= bottom && left <= x && x <= right;
+let s = !1;
+const D = (o, { clientX: t = 0, clientY: n = 0 }) => {
+  const { top: l, right: d, bottom: f, left: m } = o.getBoundingClientRect();
+  return l <= n && n <= f && m <= t && t <= d;
 };
-function handleDialogDown(event) {
-  const dialog = event.target?.closest?.("dialog");
-  START_INSIDE = !!dialog && isInside(dialog, event);
+function I(o) {
+  const t = o.target?.closest?.("dialog");
+  s = !!t && D(t, o);
 }
-function handleDialogClick({ target: el }) {
-  for (const dialog of DIALOGS)
-    if (dialog.open) {
-      const isChildNode = dialog !== el && dialog.contains(el);
-      const isClose = isChildNode ? el?.closest?.('[data-command="close"]') : !START_INSIDE && attr(dialog, "data-closedby") === "any";
-      if (isClose) dialog.close();
-    }
-  START_INSIDE = false;
+function w({ target: o }) {
+  for (const t of c)
+    t.open && (t !== o && t.contains(o) ? o?.closest?.('[data-command="close"]') : !s && e(t, "data-closedby") === "any") && t.close();
+  s = !1;
 }
-onLoaded(() => [
-  on(document, "click", handleDialogClick, QUICK_EVENT),
-  on(document, "pointerdown", handleDialogDown, QUICK_EVENT),
-  onMutation(handleDialogModal, "open")
+p(() => [
+  i(document, "click", w, a),
+  i(document, "pointerdown", I, a),
+  h(C, "open")
 ]);
 //# sourceMappingURL=dialog-observer.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"dialog-observer.js","sources":["../../designsystem/dialog/dialog-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport {\n\tattr,\n\tisBrowser,\n\ton,\n\tonLoaded,\n\tonMutation,\n\tQUICK_EVENT,\n} from \"../utils\";\n\nconst CSS_DIALOG = styles.dialog.split(\" \")[0];\nconst DIALOGS = isBrowser()\n\t? (document.getElementsByClassName(\n\t\t\tCSS_DIALOG,\n\t\t) as HTMLCollectionOf<HTMLDialogElement>)\n\t: [];\n\nfunction handleDialogModal() {\n\tfor (const dialog of DIALOGS)\n\t\tif (dialog.isConnected && dialog.showModal && dialog.close) {\n\t\t\tif (dialog.matches('[open]:not([data-modal=\"false\"]):not(:modal)')) {\n\t\t\t\tattr(dialog, \"open\", null); // Using attribute instead of .close to avoid `close` event\n\t\t\t\tdialog.showModal();\n\t\t\t} else if (dialog.matches(\":modal:not([open])\")) {\n\t\t\t\tattr(dialog, \"open\", \"\"); // Set as open\n\t\t\t\tdialog.close(); // So we correclty can call .close, removing <dialog> from #top-layer\n\t\t\t}\n\t\t}\n}\n\nlet START_INSIDE = false; // Prevent close if selecting text inside dialog\ntype Mouse = Partial<MouseEvent>;\nconst isInside = (el: Element, { clientX: x = 0, clientY: y = 0 }: Mouse) => {\n\tconst { top, right, bottom, left } = el.getBoundingClientRect();\n\treturn top <= y && y <= bottom && left <= x && x <= right;\n};\n\nfunction handleDialogDown(event: Event) {\n\tconst dialog = (event.target as Element)?.closest?.(\"dialog\");\n\tSTART_INSIDE = !!dialog && isInside(dialog, event);\n}\n\nfunction handleDialogClick({ target: el }: Event) {\n\tfor (const dialog of DIALOGS)\n\t\tif (dialog.open) {\n\t\t\tconst isChildNode = dialog !== el && dialog.contains(el as Node);\n\t\t\tconst isClose = isChildNode\n\t\t\t\t? (el as Element)?.closest?.('[data-command=\"close\"]')\n\t\t\t\t: !START_INSIDE && attr(dialog, \"data-closedby\") === \"any\";\n\n\t\t\tif (isClose) dialog.close();\n\t\t}\n\tSTART_INSIDE = false; // Reset on every click\n}\n\nonLoaded(() => [\n\ton(document, \"click\", handleDialogClick, QUICK_EVENT),\n\ton(document, \"pointerdown\", handleDialogDown, QUICK_EVENT),\n\tonMutation(handleDialogModal, \"open\"),\n]);\n"],"names":[],"mappings":";;AAUA,MAAM,aAAa,OAAO,OAAO,MAAM,GAAG,EAAE,CAAC;AAC7C,MAAM,UAAU,cACZ,SAAS;AAAA,EACV;AACD,IACC,CAAA;AAEH,SAAS,oBAAoB;AAC5B,aAAW,UAAU;AACpB,QAAI,OAAO,eAAe,OAAO,aAAa,OAAO,OAAO;AAC3D,UAAI,OAAO,QAAQ,8CAA8C,GAAG;AACnE,aAAK,QAAQ,QAAQ,IAAI;AACzB,eAAO,UAAA;AAAA,MACR,WAAW,OAAO,QAAQ,oBAAoB,GAAG;AAChD,aAAK,QAAQ,QAAQ,EAAE;AACvB,eAAO,MAAA;AAAA,MACR;AAAA,IACD;AACF;AAEA,IAAI,eAAe;AAEnB,MAAM,WAAW,CAAC,IAAa,EAAE,SAAS,IAAI,GAAG,SAAS,IAAI,QAAe;AAC5E,QAAM,EAAE,KAAK,OAAO,QAAQ,KAAA,IAAS,GAAG,sBAAA;AACxC,SAAO,OAAO,KAAK,KAAK,UAAU,QAAQ,KAAK,KAAK;AACrD;AAEA,SAAS,iBAAiB,OAAc;AACvC,QAAM,SAAU,MAAM,QAAoB,UAAU,QAAQ;AAC5D,iBAAe,CAAC,CAAC,UAAU,SAAS,QAAQ,KAAK;AAClD;AAEA,SAAS,kBAAkB,EAAE,QAAQ,MAAa;AACjD,aAAW,UAAU;AACpB,QAAI,OAAO,MAAM;AAChB,YAAM,cAAc,WAAW,MAAM,OAAO,SAAS,EAAU;AAC/D,YAAM,UAAU,cACZ,IAAgB,UAAU,wBAAwB,IACnD,CAAC,gBAAgB,KAAK,QAAQ,eAAe,MAAM;AAEtD,UAAI,gBAAgB,MAAA;AAAA,IACrB;AACD,iBAAe;AAChB;AAEA,SAAS,MAAM;AAAA,EACd,GAAG,UAAU,SAAS,mBAAmB,WAAW;AAAA,EACpD,GAAG,UAAU,eAAe,kBAAkB,WAAW;AAAA,EACzD,WAAW,mBAAmB,MAAM;AACrC,CAAC;"}
+{"version":3,"file":"dialog-observer.js","sources":["../../designsystem/dialog/dialog-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport {\n\tattr,\n\tisBrowser,\n\ton,\n\tonLoaded,\n\tonMutation,\n\tQUICK_EVENT,\n} from \"../utils\";\n\nconst CSS_DIALOG = styles.dialog.split(\" \")[0];\nconst DIALOGS = isBrowser()\n\t? (document.getElementsByClassName(\n\t\t\tCSS_DIALOG,\n\t\t) as HTMLCollectionOf<HTMLDialogElement>)\n\t: [];\n\nfunction handleDialogModal() {\n\tfor (const dialog of DIALOGS)\n\t\tif (dialog.isConnected && dialog.showModal && dialog.close) {\n\t\t\tif (dialog.matches('[open]:not([data-modal=\"false\"]):not(:modal)')) {\n\t\t\t\tattr(dialog, \"open\", null); // Using attribute instead of .close to avoid `close` event\n\t\t\t\tdialog.showModal();\n\t\t\t} else if (dialog.matches(\":modal:not([open])\")) {\n\t\t\t\tattr(dialog, \"open\", \"\"); // Set as open\n\t\t\t\tdialog.close(); // So we correclty can call .close, removing <dialog> from #top-layer\n\t\t\t}\n\t\t}\n}\n\nlet START_INSIDE = false; // Prevent close if selecting text inside dialog\ntype Mouse = Partial<MouseEvent>;\nconst isInside = (el: Element, { clientX: x = 0, clientY: y = 0 }: Mouse) => {\n\tconst { top, right, bottom, left } = el.getBoundingClientRect();\n\treturn top <= y && y <= bottom && left <= x && x <= right;\n};\n\nfunction handleDialogDown(event: Event) {\n\tconst dialog = (event.target as Element)?.closest?.(\"dialog\");\n\tSTART_INSIDE = !!dialog && isInside(dialog, event);\n}\n\nfunction handleDialogClick({ target: el }: Event) {\n\tfor (const dialog of DIALOGS)\n\t\tif (dialog.open) {\n\t\t\tconst isChildNode = dialog !== el && dialog.contains(el as Node);\n\t\t\tconst isClose = isChildNode\n\t\t\t\t? (el as Element)?.closest?.('[data-command=\"close\"]')\n\t\t\t\t: !START_INSIDE && attr(dialog, \"data-closedby\") === \"any\";\n\n\t\t\tif (isClose) dialog.close();\n\t\t}\n\tSTART_INSIDE = false; // Reset on every click\n}\n\nonLoaded(() => [\n\ton(document, \"click\", handleDialogClick, QUICK_EVENT),\n\ton(document, \"pointerdown\", handleDialogDown, QUICK_EVENT),\n\tonMutation(handleDialogModal, \"open\"),\n]);\n"],"names":["CSS_DIALOG","styles","DIALOGS","isBrowser","handleDialogModal","dialog","attr","START_INSIDE","isInside","el","x","y","top","right","bottom","left","handleDialogDown","event","handleDialogClick","onLoaded","on","QUICK_EVENT","onMutation"],"mappings":";;AAUA,MAAMA,IAAaC,EAAO,OAAO,MAAM,GAAG,EAAE,CAAC,GACvCC,IAAUC,MACZ,SAAS;AAAA,EACVH;AACD,IACC,CAAA;AAEH,SAASI,IAAoB;AAC5B,aAAWC,KAAUH;AACpB,IAAIG,EAAO,eAAeA,EAAO,aAAaA,EAAO,UAChDA,EAAO,QAAQ,8CAA8C,KAChEC,EAAKD,GAAQ,QAAQ,IAAI,GACzBA,EAAO,UAAA,KACGA,EAAO,QAAQ,oBAAoB,MAC7CC,EAAKD,GAAQ,QAAQ,EAAE,GACvBA,EAAO,MAAA;AAGX;AAEA,IAAIE,IAAe;AAEnB,MAAMC,IAAW,CAACC,GAAa,EAAE,SAASC,IAAI,GAAG,SAASC,IAAI,QAAe;AAC5E,QAAM,EAAE,KAAAC,GAAK,OAAAC,GAAO,QAAAC,GAAQ,MAAAC,EAAA,IAASN,EAAG,sBAAA;AACxC,SAAOG,KAAOD,KAAKA,KAAKG,KAAUC,KAAQL,KAAKA,KAAKG;AACrD;AAEA,SAASG,EAAiBC,GAAc;AACvC,QAAMZ,IAAUY,EAAM,QAAoB,UAAU,QAAQ;AAC5D,EAAAV,IAAe,CAAC,CAACF,KAAUG,EAASH,GAAQY,CAAK;AAClD;AAEA,SAASC,EAAkB,EAAE,QAAQT,KAAa;AACjD,aAAWJ,KAAUH;AACpB,IAAIG,EAAO,SACUA,MAAWI,KAAMJ,EAAO,SAASI,CAAU,IAE3DA,GAAgB,UAAU,wBAAwB,IACnD,CAACF,KAAgBD,EAAKD,GAAQ,eAAe,MAAM,YAElC,MAAA;AAEtB,EAAAE,IAAe;AAChB;AAEAY,EAAS,MAAM;AAAA,EACdC,EAAG,UAAU,SAASF,GAAmBG,CAAW;AAAA,EACpDD,EAAG,UAAU,eAAeJ,GAAkBK,CAAW;AAAA,EACzDC,EAAWlB,GAAmB,MAAM;AACrC,CAAC;"}