@dso-toolkit/core 100.3.0 → 100.4.0

package/dist/bundle/{p-DCB4WOS7.js → p-B5zDTnXM.js}

@@ -1,10 +1,10 @@
-import { h, p as proxyCustomElement, H, d as createEvent, F as Fragment, t as transformTag } from './p-CiFTQ7lb.js';
+import { h, p as proxyCustomElement, H, d as createEvent, F as Fragment, t as transformTag } from './p-DtUeWj74.js';
 import { c as clsx } from './p-ChV9xqsO.js';
 import { g as getActiveElement } from './p-BWkWD1Z2.js';
-import { i as i18n } from './p-CCOI5nUo.js';
-import { d as defineCustomElement$3 } from './p-DG8Kv-AI.js';
-import { d as defineCustomElement$2 } from './p-i3p8engD.js';
-import { d as defineCustomElement$1 } from './p-GK7sI8Gb.js';
+import { i as i18n } from './p-xDSTG4OU.js';
+import { d as defineCustomElement$3 } from './p-DixhcduG.js';
+import { d as defineCustomElement$2 } from './p-B1sfJaTU.js';
+import { d as defineCustomElement$1 } from './p-uUZVT-Ex.js';
 import { v as v4 } from './p-CK3_k8jD.js';
 
 const Body = () => {
@@ -117,7 +117,7 @@ const Modal = /*@__PURE__*/ proxyCustomElement(class Modal extends H {
         }
     }
     render() {
-        return (h("dialog", { key: '5ab02472ddbd1dca5ae9eb1d96dec73bf0fbed15', class: clsx("dso-modal", { fullscreen: this.fullscreen }), role: this.dialogRole ?? undefined, "aria-modal": "true", "aria-labelledby": this.ariaId, ref: (element) => (this.htmlDialogElement = element), onMouseDown: (e) => this.handleDialogMouseDown(e), onMouseUp: (e) => this.handleDialogMouseUp(e), onClick: (e) => this.handleDialogClick(e), onKeyDown: (e) => this.blockEscapeKey(e) }, h("div", { key: 'eb3bba348fd18f9fd45a5967785499f751042a23', class: "dso-dialog" }, this.narrowView ? (h("dso-scrollable", { class: "narrow" }, h("div", { class: "modal-scrollable" }, h(Header, { modalTitle: this.modalTitle, closable: this.closable, ariaId: this.ariaId, text: this.text, dsoClose: this.dsoClose }), h(Body, null), this.hasFooter && h(Footer, null)))) : (h(Fragment, null, h(Header, { modalTitle: this.modalTitle, closable: this.closable, ariaId: this.ariaId, text: this.text, dsoClose: this.dsoClose }), h("dso-scrollable", null, h(Body, null)), this.hasFooter && h(Footer, null))))));
+        return (h("dialog", { key: '88fdbf3daa75f55ba65d34e9978112db6659a83c', class: clsx("dso-modal", { fullscreen: this.fullscreen }), role: this.dialogRole ?? undefined, "aria-modal": "true", "aria-labelledby": this.ariaId, ref: (element) => (this.htmlDialogElement = element), onMouseDown: (e) => this.handleDialogMouseDown(e), onMouseUp: (e) => this.handleDialogMouseUp(e), onClick: (e) => this.handleDialogClick(e), onKeyDown: (e) => this.blockEscapeKey(e) }, h("div", { key: '0628cd928e8ad3457fea7c401a9d4a9d132eae4a', class: "dso-dialog" }, this.narrowView ? (h("dso-scrollable", { class: "narrow" }, h("div", { class: "modal-scrollable" }, h(Header, { modalTitle: this.modalTitle, closable: this.closable, ariaId: this.ariaId, text: this.text, dsoClose: this.dsoClose }), h(Body, null), this.hasFooter && h(Footer, null)))) : (h(Fragment, null, h(Header, { modalTitle: this.modalTitle, closable: this.closable, ariaId: this.ariaId, text: this.text, dsoClose: this.dsoClose }), h("dso-scrollable", null, h(Body, null)), this.hasFooter && h(Footer, null))))));
     }
     get host() { return this; }
     static get style() { return modalCss(); }

package/dist/bundle/{p-ClxcNLxu.js → p-BHAfq_R9.js}

@@ -1,8 +1,8 @@
-import { p as proxyCustomElement, H, d as createEvent, h, t as transformTag } from './p-CiFTQ7lb.js';
+import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, t as transformTag } from './p-DtUeWj74.js';
 import { c as clsx } from './p-ChV9xqsO.js';
-import { i as i18n } from './p-CCOI5nUo.js';
-import { d as defineCustomElement$2 } from './p-DG8Kv-AI.js';
-import { d as defineCustomElement$1 } from './p-i3p8engD.js';
+import { i as i18n } from './p-xDSTG4OU.js';
+import { d as defineCustomElement$2 } from './p-DixhcduG.js';
+import { d as defineCustomElement$1 } from './p-B1sfJaTU.js';
 
 const translations = {
     en: {
@@ -42,11 +42,11 @@ const Alert = /*@__PURE__*/ proxyCustomElement(class Alert extends H {
         this.text = i18n(() => this.host, translations);
     }
     render() {
-        const status = this.text(this.status);
-        if (!status) {
-            throw new Error(`Invalid status ${this.status}`);
+        const isValidStatus = ["success", "info", "warning", "error"].includes(this.status);
+        if (!isValidStatus) {
+            console.warn(`Invalid status ${this.status}`);
         }
-        return (h("div", { key: '380c0b63895dd09da7dd26fa0df808e06b29b124', class: clsx("alert", `alert-${this.status}`, { "dso-compact": this.compact }), role: this.roleAlert ? "alert" : undefined }, !this.compact && (h("dso-icon", { key: 'cfae1f66964060d7cd813113332879babdf96375', class: "icon-status", icon: `status-${this.status === "info" ? "info-solid" : this.status}`, "aria-hidden": "true" })), h("span", { key: 'de9706e5a1644fd0bf28a8b8e3519e59c24099b8', class: "sr-only" }, status, ":"), h("slot", { key: 'c9e44c74c5759ede5fb50f482c922a3758ab917f' }), this.closable && (h("dso-icon-button", { key: '8925c33d756c03fa2df660ec5a2949f45e0ae96c', label: this.text("close"), variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) }))));
+        return (h("div", { key: 'd442da267a8983bc71ecd194250fe01f04cd9dab', class: clsx("alert", { [`alert-${this.status}`]: isValidStatus }, { "dso-compact": this.compact }), role: this.roleAlert ? "alert" : undefined }, isValidStatus && (h(Fragment, null, !this.compact && (h("dso-icon", { key: '6961871f69e99c778b7bee28e5fd458b4082eab9', class: "icon-status", icon: `status-${this.status === "info" ? "info-solid" : this.status}`, "aria-hidden": "true" })), h("span", { key: 'd016153d5e46460b68a8ba2d9a73d3e82dc8795e', class: "sr-only" }, this.text(this.status), ":"))), h("slot", { key: 'a5d90a9fd35f9b4178bfa7d13d13b5f52c0f3666' }), this.closable && (h("dso-icon-button", { key: '400cd28d62ff4d709cd9a32bb232a1f55fa5d4c9', label: this.text("close"), variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) }))));
     }
     get host() { return this; }
     static get style() { return alertCss(); }

package/dist/bundle/{p-O1XEOqgC.js → p-BHPEhHca.js}

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, h, t as transformTag } from './p-CiFTQ7lb.js';
-import { d as defineCustomElement$1 } from './p-DG8Kv-AI.js';
+import { p as proxyCustomElement, H, h, t as transformTag } from './p-DtUeWj74.js';
+import { d as defineCustomElement$1 } from './p-DixhcduG.js';
 
 const attachmentsCounterCss = () => `:host{display:inline-block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}.dso-attachments{color:var(--dso-attachments-counter-color, #666);display:inline-block;font-weight:400;text-decoration:none;white-space:nowrap}`;
 

package/dist/bundle/{p-DB6jeYdL.js → p-BIioZO_6.js}

@@ -1,4 +1,4 @@
-import { S as StencilCore } from './p-CiFTQ7lb.js';
+import { S as StencilCore } from './p-DtUeWj74.js';
 
 const appendToMap = (map, refsByValue, propName, value) => {
     let ref = refsByValue.get(value);

package/dist/bundle/{p-CSFTUYxS.js → p-BMhDrgpW.js}

@@ -1,6 +1,6 @@
-import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, t as transformTag } from './p-CiFTQ7lb.js';
-import { d as defineCustomElement$2 } from './p-DG8Kv-AI.js';
-import { d as defineCustomElement$1 } from './p-i3p8engD.js';
+import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, t as transformTag } from './p-DtUeWj74.js';
+import { d as defineCustomElement$2 } from './p-DixhcduG.js';
+import { d as defineCustomElement$1 } from './p-B1sfJaTU.js';
 
 const infoCss = () => `*,*::after,*::before{box-sizing:border-box}:host{display:block;padding-block:16px;padding-inline:16px 32px;position:relative;--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#1f472c;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#f2f2f2;color:#191919;--_dso-image-display:block;--_dso-image-margin-block:8px;--_dso-image-margin-inline:auto;--_dso-rich-content-margin-block-start:0}:host(:not([active],[fixed])),:host([active=false]:not([fixed])),:host([active=false][fixed=false]){display:none}dso-icon-button{position:absolute;inset-inline-end:8px;inset-block-start:8px}`;
 
@@ -14,7 +14,7 @@ const Info = /*@__PURE__*/ proxyCustomElement(class Info extends H {
         this.dsoClose = createEvent(this, "dsoClose", 7);
     }
     render() {
-        return (h(Fragment, { key: 'dbb5daa5f70d8a8a0e316d3729d3ab3bccdbdbcc' }, h("slot", { key: '49645a72744a9569f934784cce9e6078ef765140' }), !this.fixed && (h("dso-icon-button", { key: '83d64535203b6e56171ba2394e9358f2d48c3f6e', label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
+        return (h(Fragment, { key: '501034aaf66e9109b35acead40058a4a42081904' }, h("slot", { key: '3e92f25b24180c39db9cbe8967baac16e41e0f03' }), !this.fixed && (h("dso-icon-button", { key: '568cdfc82e1fb885849226689812843a9045184d', label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
     }
     static get style() { return infoCss(); }
 }, [257, "dso-info", {

package/dist/bundle/{p-BUMxb_Ev.js → p-BZr7fJps.js}

@@ -1,9 +1,10 @@
-import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, t as transformTag } from './p-CiFTQ7lb.js';
+import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, t as transformTag } from './p-DtUeWj74.js';
 import { c as clsx } from './p-ChV9xqsO.js';
 import { d as debounce } from './p-baWVwd8J.js';
-import { p as positionTooltip, T as Tooltip } from './p-DFhKaDMe.js';
-import { d as defineCustomElement$2 } from './p-DG8Kv-AI.js';
-import { d as defineCustomElement$1 } from './p-i3p8engD.js';
+import { T as TooltipController } from './p-BsaL-EuM.js';
+import { T as Tooltip } from './p-DZCYhv_b.js';
+import { d as defineCustomElement$2 } from './p-DixhcduG.js';
+import { d as defineCustomElement$1 } from './p-B1sfJaTU.js';
 
 const labelCss = () => `.dso-tooltip{--_dso-alert-success-border-color:initial;--_dso-alert-error-border-color:initial;--_dso-alert-info-border-color:initial;--_dso-alert-warning-border-color:initial;background-color:#fff;color:#191919;border-radius:4px;overflow:unset;margin:0;border:0;padding:0;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));opacity:0;visibility:hidden;max-inline-size:640px}.dso-tooltip .tooltip-inner{--_dso-span-role-paragraph-margin-block:8px;--_dso-alert-success-border-color:initial;--_dso-alert-error-border-color:initial;--_dso-alert-info-border-color:initial;--_dso-alert-warning-border-color:initial;background-color:#fff;color:#191919;font-family:Asap, sans-serif;font-size:1rem;font-weight:normal;padding-block:8px;padding-inline:16px;border-radius:4px;line-height:1.5}.dso-tooltip .tooltip-arrow{position:absolute;background-color:#fff;border-start-start-radius:4px;block-size:10px;inline-size:10px;pointer-events:none;z-index:-1}*,*::after,*::before{box-sizing:border-box}:host{display:inline-block;max-inline-size:100%}:host([removable]) .dso-truncate.dso-label-content{max-inline-size:calc(100% - 28px)}:host([truncate]) .dso-label-content{display:inline-block;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;white-space:nowrap}::slotted([slot=symbol]){background-color:#fff;background-color:#fff;display:block;float:inline-start;block-size:20px;margin-block-start:0;margin-inline-end:8px;inline-size:24px;overflow:hidden;position:relative}.dso-label{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#1f472c;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#f2f2f2;color:#191919;display:inline-flex;align-items:center;padding-block:4px;padding-inline:8px;max-inline-size:100%;font-weight:normal;border-radius:4px;line-height:1.5}.dso-label:focus-within,.dso-label.dso-hover{text-decoration:line-through}.dso-label.dso-label-info{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#1f472c;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#6ca4d9;color:#191919}.dso-label.dso-label-primary{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-wit);--_dso-link-extern-icon:var(--_dso-di-external-link-wit);--_dso-link-phone-icon:var(--_dso-di-call-wit);--_dso-link-mail-icon:var(--_dso-di-mail-outline-wit);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-wit);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:rgba(255, 255, 255, 0.4);--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:rgba(255, 255, 255, 0.2);--_dso-icon-button-secondary-toggled-hover-background-color:rgba(255, 255, 255, 0.3);--_dso-icon-button-tertiary-color:#f2f2f2;--_dso-icon-button-tertiary-hover-color:#fff;--_dso-icon-button-tertiary-active-color:rgba(255, 255, 255, 0.4);--_dso-icon-button-tertiary-toggled-color:#fff;--_dso-icon-button-tertiary-toggled-hover-color:rgba(255, 255, 255, 0.3);--_dso-icon-button-tertiary-disabled-color:#b2b2b2;--_dso-button-tertiary-download-icon:var(--_dso-di-download-wit);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-wit);--_dso-button-primary-background-color:#fff;--_dso-button-primary-hover-background-color:rgba(255, 255, 255, 0.8);--_dso-button-primary-active-background-color:#f2f2f2;--_dso-button-primary-disabled-background-color:rgba(255, 255, 255, 0.6);--_dso-button-primary-border-color:#fff;--_dso-button-primary-hover-border-color:rgba(255, 255, 255, 0.8);--_dso-button-primary-active-border-color:#f2f2f2;--_dso-button-primary-disabled-border-color:rgba(255, 255, 255, 0.6);--_dso-button-primary-color:#191919;--_dso-button-primary-hover-color:#191919;--_dso-button-primary-active-color:#191919;--_dso-button-primary-disabled-color:#666;--_dso-button-secondary-background-color:none;--_dso-button-secondary-hover-background-color:rgba(255, 255, 255, 0.2);--_dso-button-secondary-active-background-color:rgba(255, 255, 255, 0.4);--_dso-button-secondary-disabled-background-color:none;--_dso-button-secondary-border-color:#fff;--_dso-button-secondary-hover-border-color:#fff;--_dso-button-secondary-active-border-color:rgba(255, 255, 255, 0.4);--_dso-button-secondary-disabled-border-color:rgba(255, 255, 255, 0.7);--_dso-button-secondary-color:#fff;--_dso-button-secondary-hover-color:#fff;--_dso-button-secondary-active-color:#fff;--_dso-button-secondary-disabled-color:rgba(255, 255, 255, 0.7);--_dso-button-tertiary-color:#fff;--_dso-button-tertiary-hover-color:#fff;--_dso-button-tertiary-active-color:#fff;--_dso-button-tertiary-disabled-color:#b2b2b2;background-color:#275937;color:#fff}.dso-label.dso-label-success{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-wit);--_dso-link-extern-icon:var(--_dso-di-external-link-wit);--_dso-link-phone-icon:var(--_dso-di-call-wit);--_dso-link-mail-icon:var(--_dso-di-mail-outline-wit);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-wit);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:rgba(255, 255, 255, 0.4);--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:rgba(255, 255, 255, 0.2);--_dso-icon-button-secondary-toggled-hover-background-color:rgba(255, 255, 255, 0.3);--_dso-icon-button-tertiary-color:#f2f2f2;--_dso-icon-button-tertiary-hover-color:#fff;--_dso-icon-button-tertiary-active-color:rgba(255, 255, 255, 0.4);--_dso-icon-button-tertiary-toggled-color:#fff;--_dso-icon-button-tertiary-toggled-hover-color:rgba(255, 255, 255, 0.3);--_dso-icon-button-tertiary-disabled-color:#b2b2b2;--_dso-button-tertiary-download-icon:var(--_dso-di-download-wit);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-wit);--_dso-button-primary-background-color:#fff;--_dso-button-primary-hover-background-color:rgba(255, 255, 255, 0.8);--_dso-button-primary-active-background-color:#f2f2f2;--_dso-button-primary-disabled-background-color:rgba(255, 255, 255, 0.6);--_dso-button-primary-border-color:#fff;--_dso-button-primary-hover-border-color:rgba(255, 255, 255, 0.8);--_dso-button-primary-active-border-color:#f2f2f2;--_dso-button-primary-disabled-border-color:rgba(255, 255, 255, 0.6);--_dso-button-primary-color:#191919;--_dso-button-primary-hover-color:#191919;--_dso-button-primary-active-color:#191919;--_dso-button-primary-disabled-color:#666;--_dso-button-secondary-background-color:none;--_dso-button-secondary-hover-background-color:rgba(255, 255, 255, 0.2);--_dso-button-secondary-active-background-color:rgba(255, 255, 255, 0.4);--_dso-button-secondary-disabled-background-color:none;--_dso-button-secondary-border-color:#fff;--_dso-button-secondary-hover-border-color:#fff;--_dso-button-secondary-active-border-color:rgba(255, 255, 255, 0.4);--_dso-button-secondary-disabled-border-color:rgba(255, 255, 255, 0.7);--_dso-button-secondary-color:#fff;--_dso-button-secondary-hover-color:#fff;--_dso-button-secondary-active-color:#fff;--_dso-button-secondary-disabled-color:rgba(255, 255, 255, 0.7);--_dso-button-tertiary-color:#fff;--_dso-button-tertiary-hover-color:#fff;--_dso-button-tertiary-active-color:#fff;--_dso-button-tertiary-disabled-color:#b2b2b2;background-color:#39870c;color:#fff}.dso-label.dso-label-warning{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#1f472c;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#dcd400;color:#191919}.dso-label.dso-label-error{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-wit);--_dso-link-extern-icon:var(--_dso-di-external-link-wit);--_dso-link-phone-icon:var(--_dso-di-call-wit);--_dso-link-mail-icon:var(--_dso-di-mail-outline-wit);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-wit);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:rgba(255, 255, 255, 0.4);--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:rgba(255, 255, 255, 0.2);--_dso-icon-button-secondary-toggled-hover-background-color:rgba(255, 255, 255, 0.3);--_dso-icon-button-tertiary-color:#f2f2f2;--_dso-icon-button-tertiary-hover-color:#fff;--_dso-icon-button-tertiary-active-color:rgba(255, 255, 255, 0.4);--_dso-icon-button-tertiary-toggled-color:#fff;--_dso-icon-button-tertiary-toggled-hover-color:rgba(255, 255, 255, 0.3);--_dso-icon-button-tertiary-disabled-color:#b2b2b2;--_dso-button-tertiary-download-icon:var(--_dso-di-download-wit);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-wit);--_dso-button-primary-background-color:#fff;--_dso-button-primary-hover-background-color:rgba(255, 255, 255, 0.8);--_dso-button-primary-active-background-color:#f2f2f2;--_dso-button-primary-disabled-background-color:rgba(255, 255, 255, 0.6);--_dso-button-primary-border-color:#fff;--_dso-button-primary-hover-border-color:rgba(255, 255, 255, 0.8);--_dso-button-primary-active-border-color:#f2f2f2;--_dso-button-primary-disabled-border-color:rgba(255, 255, 255, 0.6);--_dso-button-primary-color:#191919;--_dso-button-primary-hover-color:#191919;--_dso-button-primary-active-color:#191919;--_dso-button-primary-disabled-color:#666;--_dso-button-secondary-background-color:none;--_dso-button-secondary-hover-background-color:rgba(255, 255, 255, 0.2);--_dso-button-secondary-active-background-color:rgba(255, 255, 255, 0.4);--_dso-button-secondary-disabled-background-color:none;--_dso-button-secondary-border-color:#fff;--_dso-button-secondary-hover-border-color:#fff;--_dso-button-secondary-active-border-color:rgba(255, 255, 255, 0.4);--_dso-button-secondary-disabled-border-color:rgba(255, 255, 255, 0.7);--_dso-button-secondary-color:#fff;--_dso-button-secondary-hover-color:#fff;--_dso-button-secondary-active-color:#fff;--_dso-button-secondary-disabled-color:rgba(255, 255, 255, 0.7);--_dso-button-tertiary-color:#fff;--_dso-button-tertiary-hover-color:#fff;--_dso-button-tertiary-active-color:#fff;--_dso-button-tertiary-disabled-color:#b2b2b2;background-color:#ce3f51;color:#fff}.dso-label.dso-label-bright{--_dso-alert-success-border-color:initial;--_dso-alert-error-border-color:initial;--_dso-alert-info-border-color:initial;--_dso-alert-warning-border-color:initial;background-color:#fff;color:#191919;outline:1px solid #ccc;outline-offset:-1px}.dso-label.dso-label-attention{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-wit);--_dso-link-extern-icon:var(--_dso-di-external-link-wit);--_dso-link-phone-icon:var(--_dso-di-call-wit);--_dso-link-mail-icon:var(--_dso-di-mail-outline-wit);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-wit);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:rgba(255, 255, 255, 0.4);--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:rgba(255, 255, 255, 0.2);--_dso-icon-button-secondary-toggled-hover-background-color:rgba(255, 255, 255, 0.3);--_dso-icon-button-tertiary-color:#f2f2f2;--_dso-icon-button-tertiary-hover-color:#fff;--_dso-icon-button-tertiary-active-color:rgba(255, 255, 255, 0.4);--_dso-icon-button-tertiary-toggled-color:#fff;--_dso-icon-button-tertiary-toggled-hover-color:rgba(255, 255, 255, 0.3);--_dso-icon-button-tertiary-disabled-color:#b2b2b2;--_dso-button-tertiary-download-icon:var(--_dso-di-download-wit);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-wit);--_dso-button-primary-background-color:#fff;--_dso-button-primary-hover-background-color:rgba(255, 255, 255, 0.8);--_dso-button-primary-active-background-color:#f2f2f2;--_dso-button-primary-disabled-background-color:rgba(255, 255, 255, 0.6);--_dso-button-primary-border-color:#fff;--_dso-button-primary-hover-border-color:rgba(255, 255, 255, 0.8);--_dso-button-primary-active-border-color:#f2f2f2;--_dso-button-primary-disabled-border-color:rgba(255, 255, 255, 0.6);--_dso-button-primary-color:#191919;--_dso-button-primary-hover-color:#191919;--_dso-button-primary-active-color:#191919;--_dso-button-primary-disabled-color:#666;--_dso-button-secondary-background-color:none;--_dso-button-secondary-hover-background-color:rgba(255, 255, 255, 0.2);--_dso-button-secondary-active-background-color:rgba(255, 255, 255, 0.4);--_dso-button-secondary-disabled-background-color:none;--_dso-button-secondary-border-color:#fff;--_dso-button-secondary-hover-border-color:#fff;--_dso-button-secondary-active-border-color:rgba(255, 255, 255, 0.4);--_dso-button-secondary-disabled-border-color:rgba(255, 255, 255, 0.7);--_dso-button-secondary-color:#fff;--_dso-button-secondary-hover-color:#fff;--_dso-button-secondary-active-color:#fff;--_dso-button-secondary-disabled-color:rgba(255, 255, 255, 0.7);--_dso-button-tertiary-color:#fff;--_dso-button-tertiary-hover-color:#fff;--_dso-button-tertiary-active-color:#fff;--_dso-button-tertiary-disabled-color:#b2b2b2;background-color:#8b4a6a;color:#fff}.dso-label.dso-label-filter{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#1f472c;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e1ecf7;color:#191919;border-inline-start:5px solid #6ca4d9}.dso-label.dso-label-toegevoegd{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#1f472c;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:#000}.dso-label.dso-label-verwijderd{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#1f472c;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919;--_dso-ozon-content-toggletip-color:#000;text-decoration:line-through;--_dso-ozon-content-toggletip-text-decoration:underline line-through}@media screen and (min--moz-device-pixel-ratio: 0){.dso-label.dso-label-verwijderd{font-family:sans-serif}}.dso-label.dso-compact{padding-block:0;padding-inline:8px}dso-icon-button{float:inline-end;margin-inline-start:8px;margin-inline-end:-4px}`;
 
@@ -28,27 +29,19 @@ const Label = /*@__PURE__*/ proxyCustomElement(class Label extends H {
         }
         this.__attachShadow();
         this.dsoRemoveClick = createEvent(this, "dsoRemoveClick", 7);
+        this.tooltipController = new TooltipController({
+            getReferenceElement: () => this.labelContent,
+            getTipElement: () => this.tooltipElRef,
+            getTipArrowElement: () => this.tooltipArrowElRef,
+            getPlacement: () => "top",
+        });
         this.isTruncated = false;
         this.labelText = "";
         this.handleShowTooltip = () => {
-            this.tooltipElRef?.showPopover();
-            if (!this.cleanUpFunction && this.labelContent && this.tooltipElRef && this.tooltipArrowElRef) {
-                this.cleanUpFunction = positionTooltip({
-                    referenceElement: this.labelContent,
-                    tipRef: this.tooltipElRef,
-                    tipArrowRef: this.tooltipArrowElRef,
-                    placementTip: "top",
-                    topPositionSmallViewPort: false,
-                    halfMainAxisOffset: false,
-                    forceVisible: true,
-                });
-            }
+            this.tooltipController.show();
         };
         this.handleHideTooltip = () => {
-            if (this.tooltipElRef?.isConnected && this.tooltipElRef.matches(":popover-open")) {
-                this.tooltipElRef.hidePopover();
-            }
-            this.cleanUpTooltip();
+            this.tooltipController.hide();
         };
     }
     watchRemovable(removable) {
@@ -83,10 +76,6 @@ const Label = /*@__PURE__*/ proxyCustomElement(class Label extends H {
     syncLabelText() {
         this.labelText = this.host.textContent?.trim() ?? "";
     }
-    cleanUpTooltip() {
-        this.cleanUpFunction?.();
-        this.cleanUpFunction = undefined;
-    }
     componentDidLoad() {
         if (this.truncate) {
             this.startTruncate();
@@ -98,7 +87,7 @@ const Label = /*@__PURE__*/ proxyCustomElement(class Label extends H {
     disconnectedCallback() {
         this.stopTruncate();
         this.stopMutationObserver(true);
-        this.cleanUpTooltip();
+        this.tooltipController.dispose();
     }
     /** The mutationObserver fetches the text placed inside the label, this is then used for the remove button and tooltip. */
     startMutationObserver() {
@@ -128,11 +117,11 @@ const Label = /*@__PURE__*/ proxyCustomElement(class Label extends H {
         this.isTruncated = false;
     }
     render() {
-        return (h(Fragment, { key: 'b8e9c7d89bbc480af43cdc5893e13952f72c7e6f' }, h("span", { key: '39bafb744cb3b26cc4ddcc4576138c55dd371fbf', "aria-describedby": this.isTruncated ? "toggle-anchor" : null, class: clsx("dso-label", {
+        return (h(Fragment, { key: '2f9aae45d0e9200d23a19859f28e9f7f15168c8b' }, h("span", { key: 'aad9e727272e7eea28ea910cbb6ff3378f71c2e4', "aria-describedby": this.isTruncated ? "toggle-anchor" : null, class: clsx("dso-label", {
                 [`dso-label-${this.status}`]: this.status,
                 "dso-compact": this.compact && !this.removable,
                 "dso-hover": this.removeHover || this.removeFocus,
-            }) }, h("slot", { key: '896769d6536e6f5f9df67a713d4344331e323227', name: "symbol" }), h("span", { key: 'b25693c64cb43e3e17987cc2867e1fa93350e53f', class: "dso-label-content", ref: (element) => (this.labelContent = element), tabindex: this.truncate && this.isTruncated ? 0 : undefined, onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip }, h("slot", { key: '56f3d49f57129a73daa3116ce17006eac508b650' })), this.removable && (h("dso-icon-button", { key: '32a9fc5e25c090b1c8ce2549495421ff29943fbd', variant: "tertiary", icon: "cross", label: `Verwijder: ${this.labelText}`, onDsoClick: (e) => this.dsoRemoveClick.emit(e.detail.originalEvent), onMouseEnter: () => (this.removeHover = true), onMouseLeave: () => (this.removeHover = false), onFocus: () => (this.removeFocus = true), onBlur: () => (this.removeFocus = false) }))), this.isTruncated && (h(Tooltip, { key: '71b51d3b7d1d1dbc0ebccecb30cd3eea0edf129e', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, h("span", { key: 'b4300bc9f3d639b982774dbc93ae7e8e4e9989e4', id: "toggle-anchor" }, this.labelText)))));
+            }) }, h("slot", { key: '45d06013df712c4ef56f16f35ad7adaf912257b5', name: "symbol" }), h("span", { key: '31fd2520c6560c36a7cd314a39054272dab7d26f', class: "dso-label-content", ref: (element) => (this.labelContent = element), tabindex: this.truncate && this.isTruncated ? 0 : undefined, onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip }, h("slot", { key: '382b5b0e82e9cf23d88d537a822c2fe588d0a0e0' })), this.removable && (h("dso-icon-button", { key: '5810082fed31639c83ee1a077ea3e741acc4f027', variant: "tertiary", icon: "cross", label: `Verwijder: ${this.labelText}`, onDsoClick: (e) => this.dsoRemoveClick.emit(e.detail.originalEvent), onMouseEnter: () => (this.removeHover = true), onMouseLeave: () => (this.removeHover = false), onFocus: () => (this.removeFocus = true), onBlur: () => (this.removeFocus = false) }))), this.isTruncated && (h(Tooltip, { key: '102b8127bae8441c01f4d402d7ca2531633dae00', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, h("span", { key: '9bc36d77f9436d26955d566c6f37274393cf7430', id: "toggle-anchor" }, this.labelText)))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/bundle/{p-jornOoTk.js → p-BdK56OMA.js}

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, d as createEvent, f as forceUpdate, h, F as Fragment, t as transformTag } from './p-CiFTQ7lb.js';
-import { d as defineCustomElement$5 } from './p-DG8Kv-AI.js';
-import { d as defineCustomElement$4 } from './p-i3p8engD.js';
-import { d as defineCustomElement$3 } from './p-CSFTUYxS.js';
-import { d as defineCustomElement$2 } from './p-nIEuIxSJ.js';
-import { d as defineCustomElement$1 } from './p-GK7sI8Gb.js';
+import { p as proxyCustomElement, H, d as createEvent, f as forceUpdate, h, F as Fragment, t as transformTag } from './p-DtUeWj74.js';
+import { d as defineCustomElement$5 } from './p-DixhcduG.js';
+import { d as defineCustomElement$4 } from './p-B1sfJaTU.js';
+import { d as defineCustomElement$3 } from './p-BMhDrgpW.js';
+import { d as defineCustomElement$2 } from './p-D7-d0naf.js';
+import { d as defineCustomElement$1 } from './p-uUZVT-Ex.js';
 
 /**
  * Form random hash
@@ -72,7 +72,7 @@ const Selectable = /*@__PURE__*/ proxyCustomElement(class Selectable extends H {
         const describedBy = [hasInfo && this.infoFixed ? this.describedById : undefined, this.errormessage]
             .filter((value) => value !== undefined)
             .join(" ") || undefined;
-        return (h(Fragment, { key: '254653ec27f9a20033a72604642a90ea729c6c0c' }, h("div", { key: '2dc879bcbf2248e6bc066875557aea42de9061fc', class: "dso-selectable-container" }, h("div", { key: '28cb0e8f7d3796e1e05eed52507c4e61843d9de4', class: "dso-selectable-input-wrapper" }, h("input", { key: '993aa2d0fc4a0900fd087ba501ac14b786f46aa7', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": this.invalid?.toString(), "aria-describedby": describedBy, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, ref: (el) => (this.input = el) }), !this.labelledById ? (h("label", { htmlFor: this.getIdentifier() }, h("slot", null))) : (h("label", null, h("slot", null)))), hasInfo && !this.infoFixed && (h("dso-info-button", { key: '94e7c65b13b69d60953843d5d419f9e648f358a7', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: 'ac9dac488d38956e91560ef24dc7c84333162acb', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: '9df52add67145506fbd4458cba070b02d7c3219c' }, h("slot", { key: '209dc3e4e986ac8544f0cf60378bb476aa015fee', name: "info" })))), h("slot", { key: 'c6c979b1939b4bcb819b99605a486a363b8b319f', name: "options" })));
+        return (h(Fragment, { key: '4fcfaccfc2f046747059a236b95e94fd0ff63eda' }, h("div", { key: 'b157a7b0666bff6a70c6f73c8f01e0f404be59a6', class: "dso-selectable-container" }, h("div", { key: '0ae8a012600400a2ad5613a40b5edc7ed2e3697b', class: "dso-selectable-input-wrapper" }, h("input", { key: '3766067fdbd363f009d8e468efa744cff7806125', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": this.invalid?.toString(), "aria-describedby": describedBy, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, ref: (el) => (this.input = el) }), !this.labelledById ? (h("label", { htmlFor: this.getIdentifier() }, h("slot", null))) : (h("label", null, h("slot", null)))), hasInfo && !this.infoFixed && (h("dso-info-button", { key: '372012b7f352dbbec302bd8b8eb8ba06f61afb3b', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: '9df3328a5f9e511ce3c3e47198f8962ad9fd8e5f', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: '669eeac1998e756335e46e571f09ed128b510b88' }, h("slot", { key: '7988c3530d3b595a0bd8e276c5880bf23c32f480', name: "info" })))), h("slot", { key: '03944fb01644124409295f56dc44e7753d9d34e8', name: "options" })));
     }
     componentDidRender() {
         if (this.input && typeof this.checked === "boolean" && this.input.checked !== this.checked) {

package/dist/bundle/{p-DPvJlcnu.js → p-BdO8V8e5.js}

@@ -1,8 +1,8 @@
-import { p as proxyCustomElement, H, d as createEvent, h, t as transformTag } from './p-CiFTQ7lb.js';
+import { p as proxyCustomElement, H, d as createEvent, h, t as transformTag } from './p-DtUeWj74.js';
 import { c as clsx } from './p-ChV9xqsO.js';
-import { i as i18n } from './p-CCOI5nUo.js';
-import { d as defineCustomElement$2 } from './p-DG8Kv-AI.js';
-import { d as defineCustomElement$1 } from './p-i3p8engD.js';
+import { i as i18n } from './p-xDSTG4OU.js';
+import { d as defineCustomElement$2 } from './p-DixhcduG.js';
+import { d as defineCustomElement$1 } from './p-B1sfJaTU.js';
 
 const translations = {
     en: {
@@ -34,7 +34,7 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class Panel extends H {
         this.text = i18n(() => this.host, translations);
     }
     render() {
-        return (h("div", { key: 'd7977204dc9661c70b1ca295b90c8fde16470bdb', class: clsx(["dso-panel", { emphasized: this.emphasized }]) }, h("div", { key: 'ba176d64c7d442215da82fef1ae8845186f53ca8', class: "panel-heading" }, h("slot", { key: '283b076378eb8294076cd5e7e358747704f19a8f', name: "heading" }), h("dso-icon-button", { key: '5e8bb349d535ac78f507c9c14cbb08e25a3f9e54', icon: "cross", variant: "tertiary", onDsoClick: (e) => this.dsoCloseClick.emit({ originalEvent: e.detail.originalEvent }), label: this.closeButtonLabel || this.text("close") })), h("div", { key: '2b6a6b5f88607a5e7f84edc50cea87268c6cc468', class: "panel-body" }, h("slot", { key: 'b8ff03d9b801bc62c78e4a9abccc2a8fd87537a0' }))));
+        return (h("div", { key: '5b81375974d8d11a0462df7c694c52c3f2a798a7', class: clsx(["dso-panel", { emphasized: this.emphasized }]) }, h("div", { key: 'b824a62964522377a144ddb4ba3b5dd4fa299c17', class: "panel-heading" }, h("slot", { key: '3bd31ee54d5b7ee08a8f9780a678c6d54d7b3b72', name: "heading" }), h("dso-icon-button", { key: 'e1f52f75e650affa433a205f37c42e179c01d75e', icon: "cross", variant: "tertiary", onDsoClick: (e) => this.dsoCloseClick.emit({ originalEvent: e.detail.originalEvent }), label: this.closeButtonLabel || this.text("close") })), h("div", { key: 'aeede848e4146fa72911e2cb4bfd2eb686fe7159', class: "panel-body" }, h("slot", { key: '3313c2ed613913ee014071f8803e287c8fd7c9ff' }))));
     }
     get host() { return this; }
     static get style() { return panelCss(); }