@dso-toolkit/core 91.1.0 → 92.0.0

package/dist/esm/{dso-info_2.entry.js → dso-info_3.entry.js}

@@ -1,4 +1,8 @@
-import { r as registerInstance, d as createEvent, h, F as Fragment, f as forceUpdate, g as getElement } from './index-BIfnbekk.js';
+import { r as registerInstance, d as createEvent, h, F as Fragment, a as Host, g as getElement, f as forceUpdate } from './index-BIfnbekk.js';
+import { p as positionTooltip } from './position-tooltip.function-Cf2lM20T.js';
+import { T as Tooltip } from './tooltip.functional-component-eBucNQlw.js';
+import './floating-ui.dom-zRaH89Qj.js';
+import './clsx-ChV9xqsO.js';
 
 const infoCss = () => `: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;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}:host a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}:host a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}:host a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}:host a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"))}:host{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;--_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}: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}*,*::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)}`;
 
@@ -8,11 +12,109 @@ const Info = class {
         this.dsoClose = createEvent(this, "dsoClose", 7);
     }
     render() {
-        return (h(Fragment, { key: '3dcb0b7964995734a527775251fac2c0dac5a62f' }, h("slot", { key: 'b6217bab04d44d36de11b0876a07825253303100' }), !this.fixed && (h("dso-icon-button", { key: '9c5ca20d382ed5f02215e4a0c54cf7f7939aef5f', label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
+        return (h(Fragment, { key: '902f98c97248e2ddd76978921405904b843de499' }, h("slot", { key: 'fe9eed78ba371fc455ccaa6d9d3cc5eb5d042184' }), !this.fixed && (h("dso-icon-button", { key: 'a41c8d68fe39567ad3e94cb6ab12803476cc1fc4', label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
     }
 };
 Info.style = infoCss();
 
+const infoButtonCss = () => `:host{--_dt-scrollable-border-radius:4px;--_dt-scrollable-container-padding-inline:16px;--_dt-scrollable-container-padding-block:8px;display:inline-block}*,*::after,*::before{box-sizing:border-box}.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;transition:opacity 0.15s;max-inline-size:640px}.dso-tooltip.visible{opacity:1;visibility:visible}.dso-tooltip .tooltip-inner{--_dt-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:0;padding-inline:0;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}.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-icon-button{vertical-align:top;margin-inline-start:var(--_dt-info-button-margin-inline-start, 8px)}`;
+
+const InfoButton = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.dsoToggle = createEvent(this, "dsoToggle", 7);
+        /**
+         * Whether the InfoButton is active.
+         */
+        this.active = false;
+        /**
+         * The label.
+         */
+        this.label = "Toelichting bij optie";
+        /**
+         * The placement of the Toggletip on click.
+         */
+        this.toggletipPlacement = "top";
+        this.toggletipActive = false;
+        this.hasToggletip = false;
+        this.keyDownHandler = (event) => {
+            if (!this.toggletipActive)
+                return;
+            if (event.key === "Escape") {
+                this.toggletipActive = false;
+            }
+        };
+        this.focusOutHandler = (event) => {
+            if (!this.host.contains(event.relatedTarget)) {
+                this.toggletipActive = false;
+                this.toggletipElRef?.hidePopover();
+            }
+        };
+    }
+    /**
+     * To set focus to the toggle button.
+     */
+    async setFocus() {
+        this.button?.setFocus?.();
+    }
+    handleToggle(originalEvent) {
+        if (this.hasToggletip) {
+            this.toggletipActive = !this.toggletipActive;
+        }
+        else {
+            this.dsoToggle.emit({ originalEvent, active: !this.active });
+        }
+    }
+    cleanupTooltip() {
+        this.cleanUp?.();
+        this.cleanUp = undefined;
+    }
+    componentDidRender() {
+        if (!this.hasToggletip) {
+            this.toggletipElRef?.hidePopover();
+            this.cleanupTooltip();
+            return;
+        }
+        if (!this.cleanUp && this.toggletipActive && this.button && this.toggletipElRef && this.toggletipArrowElRef) {
+            this.cleanUp = positionTooltip({
+                referenceElement: this.button,
+                tipRef: this.toggletipElRef,
+                tipArrowRef: this.toggletipArrowElRef,
+                placementTip: this.toggletipPlacement,
+                restrictContentElement: this.restrictContentElement,
+            });
+        }
+        if (this.cleanUp) {
+            if (this.toggletipActive) {
+                this.toggletipElRef?.showPopover();
+            }
+            else {
+                this.toggletipElRef?.hidePopover();
+                this.cleanupTooltip();
+            }
+        }
+    }
+    connectedCallback() {
+        this.mutationObserver = new MutationObserver(() => {
+            this.hasToggletip = !!this.host.querySelector("[slot='toggletip']");
+        });
+        this.mutationObserver.observe(this.host, {
+            childList: true,
+            attributes: true,
+        });
+    }
+    disconnectedCallback() {
+        this.cleanupTooltip();
+        this.mutationObserver?.disconnect();
+        delete this.mutationObserver;
+    }
+    render() {
+        return (h(Host, { key: '9b6f13f1575ec545343cb421c7e79379b2820825', onKeydown: this.keyDownHandler, onFocusout: this.focusOutHandler }, h("dso-icon-button", { key: 'b41305da964156d8bf789acb230ef85286383ea6', variant: "tertiary", label: this.label, onDsoClick: (e) => this.handleToggle(e.detail.originalEvent), icon: this.active || this.toggletipActive ? "info-solid" : "info-outline", ref: (element) => (this.button = element) }), this.hasToggletip && (h(Tooltip, { key: '9cd082c324291fcb49c6985ba851fc5827bd06e5', tipElementRef: (element) => (this.toggletipElRef = element), tipArrowElementRef: (element) => (this.toggletipArrowElRef = element), visible: this.toggletipActive }, h("dso-scrollable", { key: 'ad10d32dde5ddfeadf86263e6883d174e46d7169', ref: (element) => (this.restrictContentElement = element) }, h("slot", { key: '0d435fcf36b37ce83782d5688fecfdb55485371e', name: "toggletip" }))))));
+    }
+    get host() { return getElement(this); }
+};
+InfoButton.style = infoButtonCss();
+
 /**
  * Form random hash
  */
@@ -72,7 +174,7 @@ const Selectable = class {
     }
     render() {
         const hasInfo = !!this.host.querySelector('[slot="info"]');
-        return (h(Fragment, { key: '5cd49b6d73c67ca5a19131f7900712a926631eaa' }, h("div", { key: '65bdd25543b5b3383a57f680f547ab78cb9a9548', class: "dso-selectable-container" }, h("div", { key: 'de61bd1fe932d5e72f34c22d16183e6b49909847', class: "dso-selectable-input-wrapper" }, h("input", { key: '4f9df6dcb738e1055a8668c4671a8fda99acbb28', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": this.invalid?.toString(), "aria-describedby": hasInfo && this.infoFixed ? this.describedById : undefined, "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: '791816cb04231553b239d5b1840e08f91f700608', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: '69d9db6af62339ae2a2ec961870fb95201ec90cc', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: '6a60c69f6417e8e941b9915e60f1610d643f6862' }, h("slot", { key: '368cf0ed5ccd9505e66897c841f2f24afd0a9569', name: "info" })))), h("slot", { key: '57418769445760d55fda35a8a51c9a2fce77c33b', name: "options" })));
+        return (h(Fragment, { key: 'f81f4f99bc21e817e72f7a1cf8819d0d9a3aafdd' }, h("div", { key: '6027967f85f8c526b6f2cb84c1a26b04b67db10d', class: "dso-selectable-container" }, h("div", { key: '095e946614f2360a19a365bb8fe866ab393cc798', class: "dso-selectable-input-wrapper" }, h("input", { key: '0a4ba657536ae3491bef90b720d49b897cfd2da6', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": this.invalid?.toString(), "aria-describedby": hasInfo && this.infoFixed ? this.describedById : undefined, "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: 'b62095b1332b2251453774ce19b9d926c4d29240', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: 'dcabe0bf6194bc50fc07136f732169d4b9e65b81', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: '640976fb646e7a57430e6701db778815bec6bbf6' }, h("slot", { key: '8b276e1be739177525d4d529efe0acb1c38afd43', name: "info" })))), h("slot", { key: '6e43d7742fecf815fea944e3c03429e54416aeea', name: "options" })));
     }
     componentDidRender() {
         if (this.input && typeof this.checked === "boolean" && this.input.checked !== this.checked) {
@@ -91,4 +193,4 @@ const Selectable = class {
 };
 Selectable.style = selectableCss();
 
-export { Info as dso_info, Selectable as dso_selectable };
+export { Info as dso_info, InfoButton as dso_info_button, Selectable as dso_selectable };

package/dist/esm/dso-input-range.entry.js

@@ -15,13 +15,13 @@ const InputRange = class {
         const min = this.min || 0;
         const max = this.max || 100;
         const step = this.step || 1;
-        return (h(Fragment, null, this.description && (h("span", { key: '65ccfdac13441b76d6559c1f1867dd7b274bedb4', id: "description", hidden: true }, this.description)), h("span", { key: 'a0c1e4e540b4b95b15b58bb57a2fd9d296753624', class: "counter", "aria-hidden": "true" }, min, this.unit), h("input", { key: '80196cc537e627dfd841eb04ae55ca5850d33ff1', type: "range", min: min, max: max, step: step, value: this.value, class: "input", "aria-label": this.label, "aria-describedby": this.description ? "description" : undefined, onChange: (event) => this.dsoChange.emit({
+        return (h(Fragment, null, this.description && (h("span", { key: 'e6d9d790d42f441d15b461010d3773ac94851482', id: "description", hidden: true }, this.description)), h("span", { key: 'c5bd62d65306dc41df200366cff5d38a3f9fd46a', class: "counter", "aria-hidden": "true" }, min, this.unit), h("input", { key: '8c6134aa6334b9cc475f08cf62f60357d11d78ee', type: "range", min: min, max: max, step: step, value: this.value, class: "input", "aria-label": this.label, "aria-describedby": this.description ? "description" : undefined, onChange: (event) => this.dsoChange.emit({
                 originalEvent: event,
                 value: event.target instanceof HTMLInputElement ? parseInt(event.target.value, 10) : undefined,
                 max,
                 min,
                 step,
-            }) }), h("span", { key: 'f269ffc6b715b45f8b913b241d76f7f75b7d190f', class: "counter", "aria-hidden": "true" }, max, this.unit)));
+            }) }), h("span", { key: 'ed7323ee13025476fadba72522d829531c32263f', class: "counter", "aria-hidden": "true" }, max, this.unit)));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-label_3.entry.js

@@ -98,11 +98,11 @@ const Label = class {
         this.isTruncated = false;
     }
     render() {
-        return (h(Fragment, { key: '7538266df7d844788842b1856fe605df8b279125' }, h("span", { key: '6bf3ce71062102f82cd5a82abfa605d08ba59ca4', "aria-describedby": this.isTruncated ? "toggle-anchor" : null, class: clsx("dso-label", {
+        return (h(Fragment, { key: '87bd45c89413b864891a85546aaa48b22bd0898b' }, h("span", { key: '36705f33b42cc5ec3be583c745aa40f6bde779da', "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: 'd6762600f90fb8d7d0ee46abf0519b5def93fc84', name: "symbol" }), h("span", { key: '2fccb0a5a750bed3ebc7fa077642761babf6e04b', class: "dso-label-content", ref: (element) => (this.labelContent = element), tabindex: this.truncate && this.isTruncated ? 0 : undefined, onMouseEnter: () => (this.textHover = true), onMouseLeave: () => (this.textHover = false), onFocus: () => (this.textFocus = true), onBlur: () => (this.textFocus = false) }, h("slot", { key: 'ba6e91a8a0d3d8082290331e0b5e843bf7d9479e' })), this.removable && (h("dso-icon-button", { key: 'b1887fa20f89636fda84ddc03a35a55c6087ecb5', 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("dso-tooltip", { key: '480a52eb0a574ba305d5b6da6639dac17822ac45', stateless: true, id: "toggle-anchor", active: this.textHover || this.textFocus, position: "top", strategy: "absolute" }, this.labelText))));
+            }) }, h("slot", { key: '2afcd8e8c615246c6843a0e3f275032655c26c4d', name: "symbol" }), h("span", { key: '2a8e0a70a0a1d11908aee62f072c8d9f5d18b39b', class: "dso-label-content", ref: (element) => (this.labelContent = element), tabindex: this.truncate && this.isTruncated ? 0 : undefined, onMouseEnter: () => (this.textHover = true), onMouseLeave: () => (this.textHover = false), onFocus: () => (this.textFocus = true), onBlur: () => (this.textFocus = false) }, h("slot", { key: '52f4794d885de7ed9c953d6719ff3dff77c2f9de' })), this.removable && (h("dso-icon-button", { key: '2c7a1991c6498d4c297d808ab0c9f54959c548b2', 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("dso-tooltip", { key: 'b48a848e19c7919460a4f667a467b7f6d7b8077c', stateless: true, id: "toggle-anchor", active: this.textHover || this.textFocus, position: "top", strategy: "absolute" }, this.labelText))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -197,7 +197,7 @@ const SlideToggle = class {
         this.hasVisibleLabel = this.host.querySelector("*") !== null;
     }
     render() {
-        return (h(Fragment, { key: '8cfb8c86d25faea70c4b678ce8232bcb403cac80' }, h("button", { key: 'b30f89d3c5a9a6ed1a3518c28ff121dbdeaf5185', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e), ...(this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), ...(this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {}) }, h("svg", { key: '8e24f0e860268be980f2b9484fbf83e2b38c80eb', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, h("g", { key: '4412c92749f8fc45f5b9c2ac07fe8516ac4a073c', fill: "none", "fill-rule": "evenodd" }, h("rect", { key: '5615ca4e6ac5f7ef9b33511ca5cdf2e434a666f1', width: "40", height: "20", fill: "currentColor", rx: "10" }), h("circle", { key: '4fe0e7e3fa2bb59c7459895578597ccb38abcd65', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (h("label", { key: 'd260d91b2ba6f562f1bc0474d1096f9dcfe3340f', htmlFor: this.identifier }, h("slot", { key: '9e3020faaf5bb77103294df78f32e2294a2a9dc4' })))));
+        return (h(Fragment, { key: 'c67f22a23e080ae6469e83b99d8e566eb2d913ec' }, h("button", { key: '227665cf8e5efbd69719c8fd468940baafe5a23a', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e), ...(this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), ...(this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {}) }, h("svg", { key: 'bc0c8c827438c4ebbc7b79b795227ee92ec3ce2d', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, h("g", { key: '2fdaf8de62b852738285490ccda1dfdbfd13e76f', fill: "none", "fill-rule": "evenodd" }, h("rect", { key: 'd6e7c97a8f8c71a5c0c5082484ed49dfded9403f', width: "40", height: "20", fill: "currentColor", rx: "10" }), h("circle", { key: 'aa0e8877592955dbe90d35804be6f213bc6303d3', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (h("label", { key: '284891e11ad364cb7e3cc0dd3978cdb001da1230', htmlFor: this.identifier }, h("slot", { key: '9e688b645bb439955db471c8e158a8441833a674' })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-legend-group.entry.js

@@ -55,7 +55,7 @@ const LegendGroup = class {
         delete this.mutationObserver;
     }
     render() {
-        return (h(Host, { key: 'c6e180da9999c7bfd387a473a1674f2d386009af' }, h("div", { key: '2731a49164e33a60c0c609977c6d2b31ec9275df', class: "legend-group-header" }, h("slot", { key: 'c8b2d7800b83ade97c1a745753d826b87a7fa059', name: "heading" }), this.mode && (h("dso-icon-button", { key: 'f5c2a257ae4110ce3661b52fff0256295c59ba9c', label: this.mode === "view" ? this.text("edit") : this.text("view"), icon: this.mode === "view" ? "pencil" : "check", variant: "tertiary", onDsoClick: this.toggleMode }))), this.mode === "edit" && h("slot", { key: 'c71154bbe1eb5f7e8c5d29f86c5f65381204da53', name: "options" }), h("slot", { key: '7aa06e0de52ba30a547f964270c9bfb3d9c817f9' })));
+        return (h(Host, { key: '67a585128090d6045885a112ba8b3bb951d7ec4c' }, h("div", { key: 'a55c38cadf52ca0079cbcca536f4f9edac068d4d', class: "legend-group-header" }, h("slot", { key: 'f43489f13359233cae872c9f496a2e5000437eec', name: "heading" }), this.mode && (h("dso-icon-button", { key: '23d5c783eadaa69caabecd911dfd647c05174434', label: this.mode === "view" ? this.text("edit") : this.text("view"), icon: this.mode === "view" ? "pencil" : "check", variant: "tertiary", onDsoClick: this.toggleMode }))), this.mode === "edit" && h("slot", { key: 'bff2158e566bbb886561fafdc6c248c75a38fa7a', name: "options" }), h("slot", { key: '78194f5f55d1c739be713b1a773270ddd60b598a' })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/dso-legend-item.entry.js

@@ -80,7 +80,7 @@ const LegendItem = class {
         const accessibleLabel = label?.textContent
             ? this.text("makeActive", { label: label.textContent.toLowerCase() })
             : this.text("makeActiveDefault");
-        return (h(Host, { key: '2f719de0372d0b3b5d417c9f67a43f99336cd648', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, h("div", { key: '000ba28715ced757b54a5c99eb87f17f093d2d73', class: clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (h("div", { key: '5d010bcf290eb0b5624a2263ef05719e66aed2db' }, h("slot", { key: '7131ecf136cb0372e758e3ef1a5a4c229fc6d79b', name: "symbol" }))), h("div", { key: '79966993fcce87a8bff270cbb366a141f51426fb' }, h("slot", { key: 'ebd3829d0c6c9b3cec6489c13ffad018b2f72dd6', name: "label" })), this.disabled && this.disabledMessage && (h("dso-info-button", { key: 'd713473db58844522de08a1e5894d9650712a2f3', label: this.text("disabledInfo"), toggletipPlacement: "bottom" }, h("div", { key: 'cedf760a34f498fbf35971fd8111a36e62faa701', slot: "toggletip" }, this.disabledMessage))), h("div", { key: '3a746a4d594fa6b95e63914ad895eec934e643b1', class: "legend-item-right-content" }, this.renderRightContent(hasOptions, accessibleLabel))), hasOptions && (h("div", { key: 'e71081edf3014d4f8c9123a79b80cf5fab1e640d', hidden: this.disabled || !this.showOptions, class: "options" }, h("slot", { key: '3824d6324c7e5095eb702867b579a8fef02299a0', name: "options" })))));
+        return (h(Host, { key: '70d74afd2147d64b2f6eb93d5942384b4a8031b2', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, h("div", { key: 'd841b61f671ac951543abb3a09791a3664964115', class: clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (h("div", { key: 'c5996baf49464c1f82b5ed3ec559987ffa606b7f' }, h("slot", { key: '895268a8bb29b972dcd66bfcfee177abb5411ffa', name: "symbol" }))), h("div", { key: '61fa469c86ffff33868ae9db163d796834b0d3d8' }, h("slot", { key: '9c1b66aef88ae872ad0e511917b5a782a03e5b95', name: "label" })), this.disabled && this.disabledMessage && (h("dso-info-button", { key: '6c3c1b07753a617d2e3f69c61a193adb066a9780', label: this.text("disabledInfo"), toggletipPlacement: "bottom" }, h("div", { key: '9598f0e2b250f0f72dc946e0b39c406cfac49f34', slot: "toggletip" }, this.disabledMessage))), h("div", { key: 'b75a65ea4fe3babd46731396beb2dbc6482e94f7', class: "legend-item-right-content" }, this.renderRightContent(hasOptions, accessibleLabel))), hasOptions && (h("div", { key: 'd031e74f411040dbbf6a66cbd63ca361536462ce', hidden: this.disabled || !this.showOptions, class: "options" }, h("slot", { key: '8997aad92384f8d8de51ff401b1df49c6bb7113b', name: "options" })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-legend.entry.js

@@ -81,7 +81,7 @@ const Legend = class {
         this.moveFocusToTab(next);
     }
     render() {
-        return (h(Host, { key: '812916657a261bed47b5388a6d84bfd5e6585cb1' }, h("div", { key: '29d63344be6f0c336ec3e845014916a15ba6bbde', class: "topbar" }, h("div", { key: '5874ac7dd039e5279d4f7ad3a754c9e6ecce3223', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, this.tabItems.map((tabItem) => (h("button", { class: clsx("tab", { active: tabItem.active }), role: "tab", "aria-selected": tabItem.active ? "true" : "false", ...(!tabItem.active ? { tabIndex: -1 } : {}), onClick: this.clickHandler }, tabItem.label)))), h("dso-icon-button", { key: '55209a7fc7e3601ba4c25d80bf5c1f0981b9bddc', icon: "cross", variant: "tertiary", label: this.text("closeLegend"), class: "close-button", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e.detail.originalEvent }) })), h("dso-scrollable", { key: 'aa0cd30073a0821eea95593f8ed1687c94892a62', class: "content" }, h("div", { key: 'fa9a12ddcbd2f71a970ca3889113356ac3ac1a33', role: "tabpanel", tabIndex: 0 }, h("slot", { key: '31ce9fb96d1afa7527e1b92d4b6985e07107269f' })))));
+        return (h(Host, { key: 'ffe823c92e3e7fb6d2cde94c8643c72cb4828015' }, h("div", { key: 'd76953fb195ec0926ccc9c605f3a38b3503009f6', class: "topbar" }, h("div", { key: '43dc8d03a676d9ac90264cbd63e176b605facd61', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, this.tabItems.map((tabItem) => (h("button", { class: clsx("tab", { active: tabItem.active }), role: "tab", "aria-selected": tabItem.active ? "true" : "false", ...(!tabItem.active ? { tabIndex: -1 } : {}), onClick: this.clickHandler }, tabItem.label)))), h("dso-icon-button", { key: '39aa9b4263d97329a4140d9a628f3158b5cdba9c', icon: "cross", variant: "tertiary", label: this.text("closeLegend"), class: "close-button", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e.detail.originalEvent }) })), h("dso-scrollable", { key: 'd56eb235541fe5c7a8b32e74fe324a461fbf04b6', class: "content" }, h("div", { key: 'c55a191f118c467f1757a86c9fc782402621d665', role: "tabpanel", tabIndex: 0 }, h("slot", { key: 'cca1d3ed43f68be77b0064a6890d62508816179c' })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-list-button.entry.js

@@ -71,7 +71,7 @@ const ListButton = class {
     }
     render() {
         const selected = this.checked || (this.count !== undefined && this.count > 0);
-        return (h("div", { key: 'd46749fe4e7e23235ca0f36e2551c2402ca8ed02', class: clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, h("div", { key: '3038ae3212dd870af97ad13ef743d47bd00da986', class: clsx(["dso-list-button", { "dso-selected": selected, "dso-single-count": this.count === 1 }]), onClick: (e) => this.handleSelectClick(e) }, h("dso-selectable", { key: 'e3b1770b193c0bf7357e5168a0ac6a1caa726031', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, h("span", { key: '009ed37eb44d0658dd581161a2f8d1e38dff7015' }, this.label, this.sublabel && h("span", { key: '38ca5933374bc2b2ddc70257dc0acdd961c97c6a', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (h("span", { key: 'e5d6514592712ef827a635e64259f8b9dd0d8464', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", h("span", { key: '340a6925c4cadad4fb0910652898a515075d287f', innerHTML: this.subcontentSlot.innerHTML }))))), this.sublabel && h("span", { key: '64f42117c81f07d6765aabbbf1a483fe6ffd1703', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (h("div", { key: 'e027d622f9bf9083b860bdd7f17d569f3ede5d92', class: "subcontent" }, h("slot", { key: 'ec356fd598cf4517aa7f8198371607bc7d30d92b', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (h("div", { key: '6806f3cf3dab4b5ec1cb07521f4f71f1ddb17999', class: "dso-input-number" }, this.count > 1 && (h(Fragment, { key: '2bf3c0c68eff4a7703ed18aca7e0ecf5fc82cad2' }, h("dso-icon-button", { key: '8c9f039ec7021022c1d2da455a3b8abb6f7eb524', label: "Aantal verlagen", variant: "tertiary", icon: "minus-circle-outline", disabled: this.count === Number(this.min) || this.disabled, onDsoClick: (e) => this.stepValue(e, "decrement") }), h("span", { key: 'e1ae04f599a221dd8ac34493e5f679b427d24a0b', class: "dso-input-step-counter", "aria-label": "Aantal", "aria-live": "polite" }, this.count))), h("dso-icon-button", { key: '32ba7e390912747b98b6fa0b3b83c14cd20d0a14', label: "Aantal verhogen", variant: "tertiary", icon: "plus-circle-outline", disabled: this.count === Number(this.max) || this.disabled, onDsoClick: (e) => this.stepValue(e, "increment") })))));
+        return (h("div", { key: 'f8c10a35f9202e5f1b0e7b29be5b8ebafcf53feb', class: clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, h("div", { key: 'acc95aadd9360e3a72d58316caa119fa30379c89', class: clsx(["dso-list-button", { "dso-selected": selected, "dso-single-count": this.count === 1 }]), onClick: (e) => this.handleSelectClick(e) }, h("dso-selectable", { key: 'f9ddf12178e9896894f7f2608627804c333ab458', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, h("span", { key: '772e1607879fcd083e6c3469edfd8f893ef65844' }, this.label, this.sublabel && h("span", { key: 'b029eae80587537ecd13149d9a8199b1088735a9', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (h("span", { key: '753d6a8e63992815e0b29284ed708adca05e1f08', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", h("span", { key: 'a11b280cd827b5e76eff630405808d246c61d247', innerHTML: this.subcontentSlot.innerHTML }))))), this.sublabel && h("span", { key: '256ed575700b44752460a25e7ff7936e20e69709', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (h("div", { key: 'e81fae2349e3134ab020041dd9b408c5074e099f', class: "subcontent" }, h("slot", { key: 'b28dd741b40e6e2e1de2f1598d7c4d7e210c142f', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (h("div", { key: '05fb5356dcb5d20750d0f1aa4d2750fda9c341c8', class: "dso-input-number" }, this.count > 1 && (h(Fragment, { key: '82ba66426f78c55b9ebe72062f8fb6beeb6cd25f' }, h("dso-icon-button", { key: '03bbb15acef53111a7ba43436c7041e8520d099b', label: "Aantal verlagen", variant: "tertiary", icon: "minus-circle-outline", disabled: this.count === Number(this.min) || this.disabled, onDsoClick: (e) => this.stepValue(e, "decrement") }), h("span", { key: 'bfd568ac61c101a7a01bc23cace73f8aa249e284', class: "dso-input-step-counter", "aria-label": "Aantal", "aria-live": "polite" }, this.count))), h("dso-icon-button", { key: 'd819d6cd666832565ba38b11678943f3841cc8b7', label: "Aantal verhogen", variant: "tertiary", icon: "plus-circle-outline", disabled: this.count === Number(this.max) || this.disabled, onDsoClick: (e) => this.stepValue(e, "increment") })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-logo.entry.js

@@ -29,7 +29,7 @@ const Logo = class {
     }
     render() {
         return (h(Fragment, null, this.logoUrl ? (h("a", { class: "logo-url", href: this.logoUrl, onClick: this.handleLogoClick }, h(DsoLogo, { name: this.name }))) : (h(DsoLogo, { name: this.name })), this.label &&
-            (!this.labelUrl ? (h("span", { class: "logo-label" }, this.label)) : (h("a", { class: "logo-label-url", href: this.labelUrl, onClick: this.handleLabelClick }, h("span", { class: "logo-label" }, this.label)))), this.ribbon && h("div", { key: '1fd87dcaff9f9804bab2309148f9ced1e91c6d54', class: "logo-ribbon" }, this.ribbon)));
+            (!this.labelUrl ? (h("span", { class: "logo-label" }, this.label)) : (h("a", { class: "logo-label-url", href: this.labelUrl, onClick: this.handleLabelClick }, h("span", { class: "logo-label" }, this.label)))), this.ribbon && h("div", { key: '561d1fd30265bcc499211397ee0a33b7e55cedd7', class: "logo-ribbon" }, this.ribbon)));
     }
 };
 Logo.style = logoCss();

package/dist/esm/dso-map-base-layers.entry.js

@@ -43,7 +43,7 @@ const MapBaseLayers = class {
         for (const ref in this.selectableRefs) {
             delete this.selectableRefs[ref];
         }
-        return (h("fieldset", { key: '182be6c3a3f06759d6e9790fbc2ac1fd7b84a4ee', class: "form-group dso-radios" }, h("legend", { key: 'b779209aa4f9741b39c436cf9730aea798128bee', class: "sr-only" }, "Achtergrond"), h("div", { key: 'f35cca28394d66962b38a33618a865b8658ddbb1', class: "dso-label-container" }, h("span", { key: 'b2f7912ac9d4573506c2084cda4a0382450c071d', class: "control-label", "aria-hidden": "true" }, this.text("background"))), h("div", { key: '4ca37cce53b2067184339788cf9909612f5357ec', class: "dso-field-container" }, this.baseLayers.map((baseLayer) => (h("dso-selectable", { key: baseLayer.id, type: "radio", value: baseLayer.name, checked: baseLayer.checked, disabled: baseLayer.disabled, name: this.group, ref: (ref) => ref && (this.selectableRefs[baseLayer.id] = ref), onDsoChange: () => this.baseLayerChangeHandler(baseLayer) }, baseLayer.name, baseLayer.info ? h("p", { slot: "info" }, baseLayer.info) : null))))));
+        return (h("fieldset", { key: '022b7253e4b5fb5b179b52082ca857f533244f17', class: "form-group dso-radios" }, h("legend", { key: '2444a8ba321e2d65d239eebf3c06a6303131e3c8', class: "sr-only" }, "Achtergrond"), h("div", { key: '18f4c8fb0aa8499a22f31903b02dc3dbe1a2fb8f', class: "dso-label-container" }, h("span", { key: '6f8a3a3f0a57b6a5247427be055a47954b161926', class: "control-label", "aria-hidden": "true" }, this.text("background"))), h("div", { key: '9a92474df7633fb9c1ca46afaf72a3d1b0b1c409', class: "dso-field-container" }, this.baseLayers.map((baseLayer) => (h("dso-selectable", { key: baseLayer.id, type: "radio", value: baseLayer.name, checked: baseLayer.checked, disabled: baseLayer.disabled, name: this.group, ref: (ref) => ref && (this.selectableRefs[baseLayer.id] = ref), onDsoChange: () => this.baseLayerChangeHandler(baseLayer) }, baseLayer.name, baseLayer.info ? h("p", { slot: "info" }, baseLayer.info) : null))))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-map-controls.entry.js

@@ -90,7 +90,7 @@ const MapControls = class {
         });
     }
     render() {
-        return (h(Fragment, { key: 'e80f27eb1bef7bd1df8d4fe4b6956fb6e2d2f60d' }, h("dso-icon-button", { key: 'f426a63cf15878119bc65afd50cecd722094642c', label: this.text("layersButton"), icon: "layers", variant: "map", tooltipPlacement: "left", class: "toggle-visibility-icon-button", onDsoClick: (e) => this.toggleVisibility(e.detail.originalEvent), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleIconButtonElement, element, "f")) }), h("button", { key: '00d979a3bb6ac88e4c70786d828ecda4c47995c9', type: "button", class: "dso-map toggle-visibility-button", onClick: (e) => this.toggleVisibility(e), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleButtonElement, element, "f")) }, h("dso-icon", { key: 'c837110e53c36c15eee108f5613109b6fdb51aba', icon: "layers" }), h("span", { key: '7f1afc8c9584aaa9353d849ddeef3dda550cdb8a' }, this.text("layersButton"))), h("dso-button-group", { key: '0160217e4220046693c92a1742e9aa77dde3d8fb', class: "zoom-buttons", direction: "column" }, h("dso-icon-button", { key: 'a0977cf85e314acd8ce95a4028a3be47dfeae2b8', label: this.text("zoomIn"), icon: "plus", variant: "map", tooltipPlacement: "left", onDsoClick: (e) => this.dsoZoomIn.emit(e.detail.originalEvent), disabled: this.disableZoom === "in" || this.disableZoom === "both" }), h("dso-icon-button", { key: '0ca02c9f8289aad6bc9bf91d18a916d6e89044e8', label: this.text("zoomOut"), icon: "minus", variant: "map", tooltipPlacement: "left", onDsoClick: (e) => this.dsoZoomOut.emit(e.detail.originalEvent), disabled: this.disableZoom === "out" || this.disableZoom === "both" })), h("section", { key: '130e6717563cfff58b76a3f5be342811acfad8e5', hidden: this.hideContent }, h("header", { key: 'cff002e1a2b3a65a33ab9170aa537c87840bf6c4' }, h("h2", { key: 'ba7f7c30b56ff45969c6dd8992823696dd254567' }, this.text("title")), h("dso-icon-button", { key: 'a9f6f86c6a66c0c08bbd466972a22ddb3a0050c7', class: "close-button", label: this.text("hidePanel", { title: this.text("title") }), icon: "cross", variant: "tertiary", onDsoClick: (e) => this.toggleVisibility(e.detail.originalEvent), ref: (element) => (__classPrivateFieldSet(this, _MapControls_closeButtonElement, element, "f")) })), h("dso-scrollable", { key: 'a768e1c58a8f5af5b1ee7debe075c90c4ed1a15d' }, h("div", { key: '47e3fa03c63b7bd0671f6fdc2093c2fbb148d636', class: "content" }, h("slot", { key: 'dbe09a86f1805db31ecfbb46a1798da703b4ed9e' }))))));
+        return (h(Fragment, { key: '2bebd2222111ce004a78e4473c49c6d09cf7f267' }, h("dso-icon-button", { key: 'f8f6de437d8e15c345345b7a0a302f9166c299d4', label: this.text("layersButton"), icon: "layers", variant: "map", tooltipPlacement: "left", class: "toggle-visibility-icon-button", onDsoClick: (e) => this.toggleVisibility(e.detail.originalEvent), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleIconButtonElement, element, "f")) }), h("button", { key: '4457eb4c932e2d6919525447e9f5d6cad1abe521', type: "button", class: "dso-map toggle-visibility-button", onClick: (e) => this.toggleVisibility(e), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleButtonElement, element, "f")) }, h("dso-icon", { key: '1640c879686c95693e0522817859e4c8e642b641', icon: "layers" }), h("span", { key: 'c49a7a52d2d3562c7d9ee67d48dac2669715176d' }, this.text("layersButton"))), h("dso-button-group", { key: 'd05e004ee7ae78a3c02370870f5ab00b19cf3ef0', class: "zoom-buttons", direction: "column" }, h("dso-icon-button", { key: '8a030706ac01afe34385953bb1a02461cdf2e513', label: this.text("zoomIn"), icon: "plus", variant: "map", tooltipPlacement: "left", onDsoClick: (e) => this.dsoZoomIn.emit(e.detail.originalEvent), disabled: this.disableZoom === "in" || this.disableZoom === "both" }), h("dso-icon-button", { key: '7fd890339f36d4690333523649efe8421f78d015', label: this.text("zoomOut"), icon: "minus", variant: "map", tooltipPlacement: "left", onDsoClick: (e) => this.dsoZoomOut.emit(e.detail.originalEvent), disabled: this.disableZoom === "out" || this.disableZoom === "both" })), h("section", { key: '2b61af90c3f4090afffc545426dd8b48e8682061', hidden: this.hideContent }, h("header", { key: '6c4da47e33b300a3be9a0e434ddd0c5e4bcb9dab' }, h("h2", { key: '17792e55718095fbdd7cbc779ee94eaf4130281c' }, this.text("title")), h("dso-icon-button", { key: '9684c711170e6c8c0c943e039fc35884c9488f6d', class: "close-button", label: this.text("hidePanel", { title: this.text("title") }), icon: "cross", variant: "tertiary", onDsoClick: (e) => this.toggleVisibility(e.detail.originalEvent), ref: (element) => (__classPrivateFieldSet(this, _MapControls_closeButtonElement, element, "f")) })), h("dso-scrollable", { key: 'be627b200abc10af23b69530e7fef14c31dd9768' }, h("div", { key: '3e134625aeeee3be860156342f0554f6d6650731', class: "content" }, h("slot", { key: '7fecb6a54112d1f58b101f00c0304c2b7b3f1599' }))))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/dso-map-layer-object.entry.js

@@ -18,7 +18,7 @@ const MapLayerObject = class {
         };
     }
     render() {
-        return (h(Host, { key: 'e87eb0a987f963f5cd37d2d6dd31a973b0af3a5a', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, h(WrapWijzigactie, { key: 'fd8848154e06d83165db3961de7ad2b906ab5fe8', wijzigactie: this.wijzigactie }, h("div", { key: '8c001e470ce4e4b4fc688e090b2269be4ffe8030', class: "map-layer-object" }, h("div", { key: '55e475b8c309a5918e8f59624a86fb60189dcb4b' }, h("slot", { key: '45760d7f2ecf8db5efda4ece670e909978d807aa', name: "symbol" })), h("div", { key: 'fb46ff9139db827a5fa6d86b1f4fe23e75688108', class: "map-layer-object-heading" }, h("slot", { key: 'd17824947aad54c024cf0da86d06e898bb465732' }), h("slot", { key: '80ab4eb005bf754772e9bc60ff1e4a868199f639', name: "label" })), h("div", { key: '02dd86c4ed6328db5de0802684e55be7c6121194', class: "slide-toggle-container" }, h("dso-slide-toggle", { key: 'a40dca66743d2404a761b47788c80a3334a0ff8e', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange }))))));
+        return (h(Host, { key: '5e43b21016086382a183304e8ff6e8331bb8f369', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, h(WrapWijzigactie, { key: '90a46f2b5683cc195dfc19a3a2d6b271b64d1476', wijzigactie: this.wijzigactie }, h("div", { key: '687ead499bcca5e92182b7adec0d47ed06854395', class: "map-layer-object" }, h("div", { key: '2c77550f48d61b70ac33ea0959efb4e0ed1817a1' }, h("slot", { key: 'a8b600409b0a59a0f6ca0b64a37905df1d5a58dd', name: "symbol" })), h("div", { key: '77d474fe22ee43457a980982159dfab342c6b0f3', class: "map-layer-object-heading" }, h("slot", { key: '0d5400e2402051d62b32cb24f835ce6fe83c0fa6' }), h("slot", { key: '2f7658aad660af52fd9ab042d50c147d0b1bebeb', name: "label" })), h("div", { key: 'c23c0b8f09c8ea965f04744f7e919f15ba752a28', class: "slide-toggle-container" }, h("dso-slide-toggle", { key: '7a55368d56bf2e11525b818678ac620342e83b15', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange }))))));
     }
 };
 MapLayerObject.style = mapLayerObjectCss();

package/dist/esm/dso-map-layer.entry.js

@@ -21,7 +21,7 @@ const MapLayer = class {
         };
     }
     render() {
-        return (h(WrapWijzigactie, { key: 'a846e3882a275aa8f8ab200f5049ed985cddbf70', wijzigactie: this.wijzigactie }, h("div", { key: '16dd057b56a83c1c52f544d1e88c47c4455b67e5', class: "map-layer" }, h("div", { key: '8f2709e613c01e6297cd27cd8cabbe95266f7199', class: "map-layer-heading" }, h("slot", { key: 'bd2c4f2dbd60ff151d28d24702278ad4caed49bb', name: "name" }), h("slot", { key: 'd7d9d99a5de2618f69e3172569811ede5c167160', name: "label" })), this.activatable && (h("div", { key: '14d9d0163ba30ee5c07aa94635563e2b0b1b0bdf', class: "slide-toggle-container" }, h("dso-slide-toggle", { key: 'e58873a37f83eab1e9a94e545b11bbdf87eea326', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange })))), h("slot", { key: '7bc52dacc415cd7944ba6e8babdafc54354af79c' })));
+        return (h(WrapWijzigactie, { key: '1888e355a80fef9de95b3dc4b009cf81f57dc85f', wijzigactie: this.wijzigactie }, h("div", { key: '10359e02b7c768648cf228be389912ff124de2e1', class: "map-layer" }, h("div", { key: 'ea2d69b38b0769ba445b5858c825cf8161b1cb61', class: "map-layer-heading" }, h("slot", { key: '8edb08c850e54d74173e5aa9b47124b4a19946c4', name: "name" }), h("slot", { key: 'f559211fde9f1af6dda210d7e05fc1337716a562', name: "label" })), this.activatable && (h("div", { key: '884a1bfc55ae09eb434a7f663515ad3831fc9cdb', class: "slide-toggle-container" }, h("dso-slide-toggle", { key: '2f85c2edd3b89ca15f323b881c6e780d6231bddc', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange })))), h("slot", { key: '06fa74f16bc861262bcad8285e0432926178c075' })));
     }
 };
 MapLayer.style = mapLayerCss();

package/dist/esm/dso-map-message.entry.js

@@ -20,11 +20,11 @@ const MapMessage = class {
     render() {
         const iconName = this.variant ? iconMap[this.variant] : undefined;
         const role = this.variant === "error" ? "alert" : "status";
-        return (h("div", { key: '17b91993a799518f5a57c47981c94953046c5ad1', class: {
+        return (h("div", { key: 'f61bb20b1cb29cd29cd848a1ce23a469628a70f1', class: {
                 "map-message-content": true,
                 "has-icon": iconName !== undefined,
                 "has-actions": this.hasActions,
-            }, role: role, "aria-atomic": "true" }, h("div", { key: 'a040bfb529c59ea6f5cd3a866e2f3e60cd8f79fb', class: "map-message-body" }, iconName && h("dso-icon", { key: 'a67d960a9404e1a215feb5a7d6d13b53600ad061', class: "map-message-icon", icon: iconName, "aria-hidden": "true" }), h("span", { key: '4490cbb7e2af2bbd8db2403cee9db8e0f58f7a92', class: "map-message-text" }, h("slot", { key: '88ca853309adcf219160205584580639bdf06314', name: "message" }))), h("slot", { key: '20c38d393fb4ae9ca289a9d4513ad94c67aace0d', name: "actions", onSlotchange: this.handleActionsSlotChange })));
+            }, role: role, "aria-atomic": "true" }, h("div", { key: '6bb520bafce05b3d30ccf74d051b56f13e0deded', class: "map-message-body" }, iconName && h("dso-icon", { key: '562d40cfd80902b3420bca2f73a395562ed6bd53', class: "map-message-icon", icon: iconName, "aria-hidden": "true" }), h("span", { key: 'a11113a808c8ad7c77568e086288cfd24530adf3', class: "map-message-text" }, h("slot", { key: '322dec4055e69936249f05862f4cb63da4da1277', name: "message" }))), h("slot", { key: 'b2e023741280c36794784e4aa86c029c981db4cf', name: "actions", onSlotchange: this.handleActionsSlotChange })));
     }
 };
 MapMessage.style = mapMessageCss();

package/dist/esm/dso-map-overlays.entry.js

@@ -44,7 +44,7 @@ const MapOverlays = class {
         for (const ref in this.selectableRefs) {
             delete this.selectableRefs[ref];
         }
-        return (h("fieldset", { key: '6c7cd0057b0f49a0e4434ff10a9effc644943f52', class: "form-group dso-checkboxes" }, h("legend", { key: '9abce3af4126cf5d30bcf769e83bccffefb6f111', class: "sr-only" }, "Kaartlagen"), h("div", { key: '727c77b6da2ed720455fb74c220054d1627ecfa8', class: "dso-label-container" }, h("span", { key: '911e85fb97f9f11a9ac2c1d8154e2be89137841f', class: "control-label", "aria-hidden": "true" }, this.text("title"))), h("div", { key: '968efa1704c22a4b4252aab0a4dd17a5ca3a679c', class: "dso-field-container" }, this.overlays.map((overlay) => (h("dso-selectable", { key: overlay.id, type: "checkbox", value: overlay.name, checked: overlay.checked, disabled: overlay.disabled, name: this.group, ref: (ref) => ref && (this.selectableRefs[overlay.id] = ref), onDsoChange: (e) => this.overlayChangeHandler(overlay, e) }, overlay.name, overlay.info ? h("p", { slot: "info" }, overlay.info) : null))))));
+        return (h("fieldset", { key: '2092eeaf0e10ac4d8836e097895570e1457a4c3a', class: "form-group dso-checkboxes" }, h("legend", { key: 'fdb0cec1cd8deee591c8b83b87902009f1817bda', class: "sr-only" }, "Kaartlagen"), h("div", { key: 'd96f4e9495957dff19ce17bc26948a97b2a1e524', class: "dso-label-container" }, h("span", { key: '2ee2223b049367caab7713e011e9d7a0fec50b8a', class: "control-label", "aria-hidden": "true" }, this.text("title"))), h("div", { key: '8649873d384127bfb109459a8b523bc6a480a199', class: "dso-field-container" }, this.overlays.map((overlay) => (h("dso-selectable", { key: overlay.id, type: "checkbox", value: overlay.name, checked: overlay.checked, disabled: overlay.disabled, name: this.group, ref: (ref) => ref && (this.selectableRefs[overlay.id] = ref), onDsoChange: (e) => this.overlayChangeHandler(overlay, e) }, overlay.name, overlay.info ? h("p", { slot: "info" }, overlay.info) : null))))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-mark-bar.entry.js

@@ -49,7 +49,7 @@ const MarkBar = class {
     render() {
         const current = this.current || 0;
         const totalCount = this.totalCount || 0;
-        return (h("div", { key: '55c54949963e1f8fea242366724e998585f6b785', class: "dso-mark-bar" }, h("div", { key: '61a956d7bfd816dd25d72b7f5a35989f3b4ce46b', class: "dso-mark-bar-input" }, h("input", { key: '66883925a8d0d369560ec03697ac6482d1bdb14b', type: "text", id: "search-input", value: this.value, onInput: this.handleInput, onKeyDown: this.handleKeyDown, placeholder: " ", ref: (element) => (this.inputElement = element) }), h("label", { key: '32a61a8fe005b74777097cacba3a5eb18427dff3', htmlFor: "search-input" }, h("dso-icon", { key: '837c3cad3188704b3638a76722492a261d4ecb03', class: "dso-search-icon", icon: "search" }), h("span", { key: '9e2e1b84df9cb0860d931233f9469e9c53402836', class: "label-text" }, this.label)), h("dso-icon-button", { key: '41206eebf78bbc0b31bc147f0ac2a6a13876fcc5', icon: "cross", variant: "tertiary", label: "Zoekopdracht legen", onDsoClick: (e) => this.handleClear(e.detail.originalEvent) })), h("div", { key: '2996a2f89bedf25516f0f7b4669cf8e7fb834666', class: "dso-button-container" }, h("span", { key: '4c995d8619b70cc1b387496adfd689f413f6f015', class: "divider" }), h("dso-icon-button", { key: '4e1c597443e59dee11fb498a581d9f083f9c4768', icon: "chevron-up", variant: "tertiary", label: "Vorig zoekresultaat", onDsoClick: (e) => this.handlePrevious(e.detail.originalEvent), disabled: current <= 1 }), h("span", { key: '0cbb6043077a9a92a662fb595576f31610d2233e' }, current, "/", totalCount), h("dso-icon-button", { key: '925d2b379af59d2aaf1122e3fe89a4111cd56dfe', icon: "chevron-down", variant: "tertiary", label: "Volgend zoekresultaat", onDsoClick: (e) => this.handleNext(e.detail.originalEvent), disabled: current >= totalCount }))));
+        return (h("div", { key: 'd09aa94ffd06188445f96c64a4a3719d37949d3e', class: "dso-mark-bar" }, h("div", { key: 'd89230751206bd78aeacf8c56c8c171ab55a7096', class: "dso-mark-bar-input" }, h("input", { key: 'dab47647c66731e7b669e1768508c2d994e33778', type: "text", id: "search-input", value: this.value, onInput: this.handleInput, onKeyDown: this.handleKeyDown, placeholder: " ", ref: (element) => (this.inputElement = element) }), h("label", { key: 'b43e1efa704876deb197853f2f8dbba146597a88', htmlFor: "search-input" }, h("dso-icon", { key: 'c6617679b5d34671e068c766a0236b5cdc12c893', class: "dso-search-icon", icon: "search" }), h("span", { key: '51381737c0a3a999ddc47ae60050a032ed1051e6', class: "label-text" }, this.label)), h("dso-icon-button", { key: 'acdb087e9a2e3482ddf9b799b5143b79e1601500', icon: "cross", variant: "tertiary", label: "Zoekopdracht legen", onDsoClick: (e) => this.handleClear(e.detail.originalEvent) })), h("div", { key: '85addfb20a5c2f40ee7a62dcbde354f407472b1c', class: "dso-button-container" }, h("span", { key: '7f572933ce9d4085c5648fe923b122f5462b6706', class: "divider" }), h("dso-icon-button", { key: '022a07592d02e6b015915129d2c333a8a976ffa4', icon: "chevron-up", variant: "tertiary", label: "Vorig zoekresultaat", onDsoClick: (e) => this.handlePrevious(e.detail.originalEvent), disabled: current <= 1 }), h("span", { key: '12dad58f34bcde382a978617a53b3d89aac5994e' }, current, "/", totalCount), h("dso-icon-button", { key: 'd03ec5b8cefa4bec0f00ef59d94003a1fc0faddb', icon: "chevron-down", variant: "tertiary", label: "Volgend zoekresultaat", onDsoClick: (e) => this.handleNext(e.detail.originalEvent), disabled: current >= totalCount }))));
     }
 };
 MarkBar.style = markBarCss();

package/dist/esm/dso-modal.entry.js

@@ -81,7 +81,7 @@ const Modal = class {
         }
     }
     render() {
-        return (h("dialog", { key: '8c58e168c33679096563b2eef8719857f00ed141', class: "dso-modal", role: this.dialogRole ?? undefined, "aria-modal": "true", "aria-labelledby": this.ariaId, ref: (element) => (this.htmlDialogElement = element), onClick: (e) => this.handleDialogClick(e), onKeyDown: (e) => this.blockEscapeKey(e) }, h("div", { key: '97582f1720de811a578109065eb6fa54d1f5e432', class: "dso-dialog", role: "document" }, this.modalTitle ? (h("div", { class: "dso-header" }, h("h2", { id: this.ariaId }, this.modalTitle), this.closable && (h("dso-icon-button", { id: "close-modal", icon: "cross", variant: "tertiary", label: this.text("close"), onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) })))) : (h("span", { class: "sr-only", id: this.ariaId }, this.text("dialog"))), h("dso-scrollable", { key: '7cf0fd5cd2c209e78fac6d13541f50cdbfc5967b' }, h("div", { key: '9ba3272cd1d59999221367614c6ffdda398989d9', class: "dso-body", tabIndex: 0 }, h("slot", { key: '740e953099d3bb89cc8da702452adb1c7c7b0da9', name: "body" }))), this.hasFooter && (h("div", { key: '32d07d82f187ec63cf8d542e8faa1a4e7cecc052', class: "dso-footer" }, h("slot", { key: 'e6e9f7d9ca33f2fb6a61a2c33e1f1144ac8a812d', name: "footer" }))))));
+        return (h("dialog", { key: '3f82d0319743f333024c6e9924c08d48f85b738b', class: "dso-modal", role: this.dialogRole ?? undefined, "aria-modal": "true", "aria-labelledby": this.ariaId, ref: (element) => (this.htmlDialogElement = element), onClick: (e) => this.handleDialogClick(e), onKeyDown: (e) => this.blockEscapeKey(e) }, h("div", { key: 'd94bad5e57a1b0c0a84e1bf5e27570df1ec00f20', class: "dso-dialog", role: "document" }, this.modalTitle ? (h("div", { class: "dso-header" }, h("h2", { id: this.ariaId }, this.modalTitle), this.closable && (h("dso-icon-button", { id: "close-modal", icon: "cross", variant: "tertiary", label: this.text("close"), onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) })))) : (h("span", { class: "sr-only", id: this.ariaId }, this.text("dialog"))), h("dso-scrollable", { key: '954818bf78e2f2db6dd46232730fff39f9e73815' }, h("div", { key: '5bc44af3ae7e08e92c7508d1c2989316e58079a5', class: "dso-body", tabIndex: 0 }, h("slot", { key: '53ee09a3318fe5775d9f87d027818d6d4af2a13c', name: "body" }))), this.hasFooter && (h("div", { key: '21fd34229ad80c81071db82dc2fe97650fec545d', class: "dso-footer" }, h("slot", { key: '77af70dbc6c274bd194bb0cfcac3563a8664d248', name: "footer" }))))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-onboarding-tip.entry.js

@@ -71,7 +71,7 @@ const OnboardingTip = class {
     }
     render() {
         const ariaLabel = this.headingSlottedElement?.textContent;
-        return (h(Host, { key: '865a09f9c1cb7636c1e4667bc14e1cd39412dfbb', popover: "manual", ready: this.ready, onAnimationend: () => (this.ready = true) }, h("div", { key: '97139ffe23f6c868200e2d584872679b61d24aff', role: "dialog", class: "onboarding-tip", "aria-label": ariaLabel, onKeyDown: this.blockEscapeKey, tabindex: -1 }, h("div", { key: '5e78cc39a6b65de7e338bbe4e8e78c760c960716', class: "onboarding-tip-inner" }, h("div", { key: '2686b4d813b2cc05c5c1074df841a3fa596ffead', class: "onboarding-tip-content-wrapper" }, this.headingSlottedElement !== null && (h("div", { key: 'ce4d4d83e609f325bb089a946d5f864ef835ca46', class: "onboarding-tip-content-heading" }, h("dso-icon", { key: 'b7089262e4438e6e88907aeab06a0d0059c10ffb', icon: "light-bulb" }), h("slot", { key: '3703f494008ba3ae3d62c2a84d18fd26d79fdb97', name: "heading" }))), h("dso-icon-button", { key: 'aba8ded86a4d3e269f7ac007c02d6b4865047bfa', class: "dso-close", label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) }), h("slot", { key: 'd9696574bc96f3249ee75485dad143498a9e66fa' }))), h("div", { key: 'f324f22d23125a3acc2e6fe4a11c4fdfed3b0625', class: "onboarding-tip-arrow", ref: (ref) => (this.tipArrowRef = ref) }))));
+        return (h(Host, { key: 'fa8923c44684b225ec204be511c48edaa85d5223', popover: "manual", ready: this.ready, onAnimationend: () => (this.ready = true) }, h("div", { key: '2acf5c31e31e72974c9885ebd52b5f766f138139', role: "dialog", class: "onboarding-tip", "aria-label": ariaLabel, onKeyDown: this.blockEscapeKey, tabindex: -1 }, h("div", { key: '4c52b7ebbc3bef2435ea565d2fffc2d0985da9aa', class: "onboarding-tip-inner" }, h("div", { key: '51382c1a584ccf665964deb518643cfad06e6b47', class: "onboarding-tip-content-wrapper" }, this.headingSlottedElement !== null && (h("div", { key: '5867f4dec0c3c79a4bbeefb88f677dc28cd64f75', class: "onboarding-tip-content-heading" }, h("dso-icon", { key: 'b730b2df1af5a96d0d17a4c3ee97a9bd78ce399a', icon: "light-bulb" }), h("slot", { key: 'e7503900bd00852a9ce0a4561063efbd950db450', name: "heading" }))), h("dso-icon-button", { key: 'b8bd69671342def7471ba20cb59d27d9c4dc913a', class: "dso-close", label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) }), h("slot", { key: '094a3e0d158b8a3e10bc0cae1bce3f9f44703872' }))), h("div", { key: '1937be09261e1e21b427601d7c79a9ac94b7cd3d', class: "onboarding-tip-arrow", ref: (ref) => (this.tipArrowRef = ref) }))));
     }
     get headingSlottedElement() {
         return this.host.querySelector("[slot='heading']");

package/dist/esm/dso-plekinfo-card.entry.js

@@ -38,7 +38,7 @@ const PlekinfoCard = class {
     }
     render() {
         const hasSymbol = this.symbolSlottedElement !== null;
-        return (h(Host, { key: '46ce81df38a0abe5509ee9507093100473e5384f', "has-symbol": hasSymbol }, h(WrapWijzigactie, { key: '638cf0380b5bb037e02dcc561049a45240df9f7c', wijzigactie: this.wijzigactie, class: "dso-plekinfo-card-container" }, h("div", { key: 'ba6dfc3295480ced1f87c3d93369263b39677804', class: "dso-plekinfo-card-symbol", hidden: !hasSymbol }, h("slot", { key: 'abdeb3c24f30c0c678d26e238e83fb8665b0bcc0', name: "symbol" })), h("div", { key: '83a82e657548c08b791e46a4b75ed19503e585d7', class: "dso-plekinfo-card-heading" }, this.href ? (h("a", { href: this.href, target: this.targetBlank ? "_blank" : undefined, rel: this.targetBlank ? "noopener noreferrer" : undefined, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("span", { class: "heading-content" }, h("slot", { name: "heading" })), "\u2060", this.targetBlank ? (h(Fragment, null, h("dso-icon", { icon: "external-link" }), h("span", { class: "sr-only" }, "(Opent andere website in nieuw tabblad)"))) : (h("dso-icon", { icon: "chevron-right" })))) : (h("slot", { name: "heading" })), this.metaSlottedElement !== null && h("slot", { key: '446d075d9a4a29d96b865ff386511e6cf0537a02', name: "meta" }), this.interaction !== null && h("slot", { key: '3f281dafffb96abb9c3428a1c31b4881e13fe8da', name: "interaction" })), h("div", { key: '03be540a42dfbe46ed3ed9f9b537c95e6f9e2145', class: "dso-plekinfo-card-content" }, h("slot", { key: 'abfe015e9e41456c3e117006effd9592c0049a50', name: "content" })))));
+        return (h(Host, { key: 'f5745c45fea81d2e36507a0bed3303d20a3ba909', "has-symbol": hasSymbol }, h(WrapWijzigactie, { key: '442b9881438a1054f00dcd7c57c0545faf851123', wijzigactie: this.wijzigactie, class: "dso-plekinfo-card-container" }, h("div", { key: 'd1fad97a498d2a7fa2c34e561f584b2d0095f164', class: "dso-plekinfo-card-symbol", hidden: !hasSymbol }, h("slot", { key: 'b9c763f5962053f644a0030bdc893e48404147b7', name: "symbol" })), h("div", { key: 'cbb91b0db3422ae4b3c0bbd0fc26a5fa5ca11868', class: "dso-plekinfo-card-heading" }, this.href ? (h("a", { href: this.href, target: this.targetBlank ? "_blank" : undefined, rel: this.targetBlank ? "noopener noreferrer" : undefined, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("span", { class: "heading-content" }, h("slot", { name: "heading" })), "\u2060", this.targetBlank ? (h(Fragment, null, h("dso-icon", { icon: "external-link" }), h("span", { class: "sr-only" }, "(Opent andere website in nieuw tabblad)"))) : (h("dso-icon", { icon: "chevron-right" })))) : (h("slot", { name: "heading" })), this.metaSlottedElement !== null && h("slot", { key: '636c98028b9aafaaddc74b0e45eac321cd68846d', name: "meta" }), this.interaction !== null && h("slot", { key: '1113d794c10d5471029df1b2963606683ed14fd8', name: "interaction" })), h("div", { key: '4ad42b888c59cd5ef928fe5740b896d7ea5e1db4', class: "dso-plekinfo-card-content" }, h("slot", { key: '22f0a53e72c6a18b135fd6f083854b48681a9aef', name: "content" })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-progress-indicator.entry.js

@@ -22,7 +22,7 @@ const Progressindicator = class {
         this.text = i18n(() => this.host, translations);
     }
     render() {
-        return (h(Host, { key: '4aa7f48d4b6bcd34a225c863eb6fdb69ea04e647' }, h("span", { key: '58285262b83f25c5dc45b9af0d077de6621ea935', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, h("dso-icon", { key: '9ea25bbedea5656dc65a6e6153b9cdc706c576ad', icon: "spinner" })), h("span", { key: '30b8e861214774a980620e2332add5e4e319d0ff', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
+        return (h(Host, { key: '841000822b6c884a6f4c43ab09d47fa0f642c6bb' }, h("span", { key: '1377b91a1c39c58410d7f21e3a79449259020a77', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, h("dso-icon", { key: 'd7139bb3a28acde489469cd91eb005b8da5dba4a', icon: "spinner" })), h("span", { key: '59e16f07b0c68b8c47107d0a4f4bcbc67ebb28ae', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-project-item.entry.js

@@ -1,13 +1,13 @@
 import { r as registerInstance, h, F as Fragment } from './index-BIfnbekk.js';
 
-const projectItemCss = () => `:host{display:block;padding:16px;border:1px solid #ccc;border-radius:4px}*,*::after,*::before{box-sizing:border-box}::slotted(dl[slot=progress]),::slotted(dl[slot=status]){--_dt-dl-margin-block-end:0;--_dt-dl-before-display:none;--_dt-dl-dt-font-weight:normal;--_dt-dl-dd-margin-block-start:0;--_dt-dl-dd-margin-inline-start:8px;--_dt-dl-dd-padding-inline-start:0;--_dt-dl-dt-inline-size:auto;--_dt-dl-dd-last-margin-block-end:0;--_dt-mark-bg-color:none;--_dt-mark-padding-block:0;--_dt-mark-color:inherit;--_dt-mark-font-weight:600;display:flex !important;flex-wrap:wrap;column-gap:16px}::slotted([slot=status]){--_dt-dl-font-size:0.875rem}::slotted([slot=title]){margin-block:0 !important;font-size:1.25rem !important}::slotted([slot=actions]){display:flex}.project-item-header{display:flex;gap:16px;flex-wrap:nowrap;align-items:flex-start;margin-block-end:16px}.project-item-title{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;flex-grow:1}.project-item-actions{display:flex;flex-shrink:0;flex-wrap:nowrap}.project-item-info{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;align-items:flex-end}`;
+const projectItemCss = () => `:host{display:block;padding:16px;border:1px solid #ccc;border-radius:4px}*,*::after,*::before{box-sizing:border-box}::slotted(dl[slot=progress]),::slotted(dl[slot=status]){--_dt-dl-margin-block-end:0;--_dt-dl-before-display:none;--_dt-dl-dt-font-weight:normal;--_dt-dl-dd-margin-block-start:0;--_dt-dl-dd-padding-inline-start:0;--_dt-dl-dt-inline-size:auto;--_dt-dl-dd-last-margin-block-end:0;--_dt-mark-bg-color:none;--_dt-mark-padding-block:0;--_dt-mark-color:inherit;--_dt-mark-font-weight:600;display:flex !important;flex-wrap:wrap;column-gap:16px}::slotted(dl[slot=progress]){--_dt-dl-dd-margin-inline-start:0}::slotted(dl.dso-inline[slot=status]),::slotted(dl.dso-inline-end[slot=status]){--_dt-dl-margin-block-end:0;--_dt-dl-dd-margin-inline-start:8px;--_dt-dl-dd-last-margin-block-end:0;--_dt-dl-before-display:none;--_dt-dl-dt-font-weight:normal;--_dt-mark-bg-color:none;--_dt-mark-padding-block:0;--_dt-mark-color:inherit;--_dt-mark-font-weight:600;--_dt-dl-font-size:0.875rem;display:block !important}::slotted([slot=title]){margin-block:0 !important;font-size:1.25rem !important}::slotted([slot=actions]){display:flex}.project-item-header{display:flex;gap:16px;flex-wrap:nowrap;align-items:flex-start;margin-block-end:16px}.project-item-title{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;flex-grow:1}.project-item-actions{display:flex;flex-shrink:0;flex-wrap:nowrap}.project-item-info{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end}.project-item-status{margin-inline-start:auto}`;
 
 const ProjectItem = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Fragment, { key: 'eeef5c5a39420c43ed20880de22b059bbaee5666' }, h("div", { key: 'ed73f53443743796a94f4af27b2b0f38bcd0092d', class: "project-item-header" }, h("div", { key: 'ee5f81658e3a906ac69d13b9330a0194a5555d90', class: "project-item-title" }, h("slot", { key: '7f73e7f7ce9e880d2e3a3d2026812e0c68c0e8ed', name: "title" }), this.label && (h("dso-label", { key: 'c02c0d6f38f04be85c400afd03fab500b54cea19', status: "error", compact: true }, this.label))), h("div", { key: '389dfe7e623c879a8113b8027013c3ccc07a2180', class: "project-item-actions" }, h("slot", { key: '4eced83c4666e09667e41b3e9671a5dbdadc4402', name: "actions" }))), h("div", { key: '7055ab88ae53e64b8a6cbf46cb1225ff580159d1', class: "project-item-info" }, h("div", { key: 'd34b86eeb0909c16d18390887753e4ec0ea8fe76', class: "project-item-progress" }, h("slot", { key: '2be36487a7cc35124a606703191a056fe3d169ed', name: "progress" })), h("div", { key: '57cd457d6d260e84da557990d1a5128e9b0cf5ce', class: "project-item-status" }, h("slot", { key: 'f46e34c04f52c9f34eb96aea15b64b06fe758921', name: "status" })))));
+        return (h(Fragment, { key: '1891b57d5fa60ae4f9deb8e7d1309fdcbfb410a6' }, h("div", { key: '63a4d271ac4b0f076cd9e36712d8071e96490ad9', class: "project-item-header" }, h("div", { key: '2b28fe00ed7add623560b89cc560d698f86c2ef0', class: "project-item-title" }, h("slot", { key: 'f077657b171ad54bb5105d850debf13cf5b2c40a', name: "title" }), this.label && (h("dso-label", { key: 'e7481c0cd92526a4c11cb42b39f929e476195944', status: "error", compact: true }, this.label))), h("div", { key: 'e6d8bf5bfbda71808cffc2d94d8f6fd2155c6978', class: "project-item-actions" }, h("slot", { key: '171e34455b011fb4f4f403818111a1f3bd007f1c', name: "actions" }))), h("div", { key: 'cdb0baef23a01b2aa970bba977a1a0988552a6a4', class: "project-item-info" }, h("div", { key: 'ca6fdcfaf15f2de35d2605722c271f58a54c79dd', class: "project-item-progress" }, h("slot", { key: 'ac645eb5d7239a3a045c9dc4f61cff5c21311fc1', name: "progress" })), h("div", { key: '224b961ea9d90f35a04869b62ac77cd1985f0be2', class: "project-item-status" }, h("slot", { key: '5080052061b84ad6de62cddd041ce270428f4b95', name: "status" })))));
     }
 };
 ProjectItem.style = projectItemCss();

package/dist/esm/dso-responsive-element.entry.js

@@ -44,7 +44,7 @@ const ResponsiveElement = class {
         this.observer.unobserve(this.host);
     }
     render() {
-        return (h(Host, { key: '0fef37539e51fe433fda4e7b8e8c11f4897bf940', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, h("slot", { key: 'db1d65910acf7bc5638b5c957970675212b46e2f' })));
+        return (h(Host, { key: '21b7a4354bf4e932a4fc00d4eb979fccc9dd5cc0', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, h("slot", { key: '5f6bcc67da3e050ed314e5d3dbdde46726fa670b' })));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-scrollable.entry.js

@@ -91,9 +91,9 @@ const Scrollable = class {
         this.slottedElements.forEach((element) => resizeObserver.unobserve(element));
     }
     render() {
-        return (h("div", { key: '4eb0684c3223d8a860c208287692f4e4be8a02e7', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, h("div", { key: 'dc962aface56f88a7280433749c6f70ae6e94195', ref: (el) => (this.scrollContainerDiv = el), class: clsx("dso-scroll-container", {
+        return (h("div", { key: '569d76f0c59ce43126449e32ef132771d546ad6f', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, h("div", { key: '648c4f43114bc18fceab87d6996ced8cbfa9a19e', ref: (el) => (this.scrollContainerDiv = el), class: clsx("dso-scroll-container", {
                 [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== "noScroll",
-            }), onScroll: () => this._setScrollState() }, h("slot", { key: 'a69d3bf3032c297fb46ac2909382d949e8ac9d39' }))));
+            }), onScroll: () => this._setScrollState() }, h("slot", { key: 'c6c6eb665ef037e5e47f22d26a4216610301832d' }))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-segmented-button.entry.js

@@ -22,7 +22,7 @@ const SegmentedButton = class {
         });
     }
     render() {
-        return (h("div", { key: '18ffa42b26a9c8544c249a9b1ff2f2328624d56e', class: "segmented-button", role: "radiogroup", "aria-label": this.label, "aria-required": this.required?.toString() }, this.options?.map((option) => {
+        return (h("div", { key: 'b59a81cd8c691e00a08e9bcb59b50283f6b4caa3', class: "segmented-button", role: "radiogroup", "aria-label": this.label, "aria-required": this.required?.toString() }, this.options?.map((option) => {
             return (h("label", null, h("input", { type: "radio", name: this.groupName, value: option.label, checked: this.activeOption === option, disabled: option.disabled, onClick: (event) => this.handleClick(option, event) }), h("span", { class: "segment-label" }, option.label)));
         })));
     }

package/dist/esm/dso-skiplink.entry.js

@@ -15,7 +15,7 @@ const Skiplink = class {
         return this.dsoSkiplinkClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });
     }
     render() {
-        return (h("a", { key: '8de3e25d40c6c84e4f6d91cbbd31866151f9ee7a', href: `#${this.to}`, onClick: (e) => this.clickEventHandler(e) }, this.label, h("dso-icon", { key: 'eb1c4c4d636434414e6345538f41caa3adc2d9e2', icon: "chevron-right" })));
+        return (h("a", { key: '593f9128df0af49283ddfbcc59e71d09c172709d', href: `#${this.to}`, onClick: (e) => this.clickEventHandler(e) }, this.label, h("dso-icon", { key: 'cbacc69d1f96fe96f0413047ba2b72b2ce98100e', icon: "chevron-right" })));
     }
 };
 Skiplink.style = skiplinkCss();

package/dist/esm/dso-survey-rating.entry.js

@@ -26,10 +26,10 @@ const SurveyRating = class {
             "Makkelijk",
             "Heel makkelijk",
         ];
-        return (h("dso-panel", { key: '0f275619386b511d4d7671491ce742fc09a055b9', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, h("h2", { key: '32e3379b04c12701dab623e5c7a780b0efd24538', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), h("strong", { key: '9c64fdf7141b315955bf7f6fca818e1f3f5f7a98' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), h("form", { key: 'f75fbad5f2d345f87eaf9977870e0fbcac48fd68', onSubmit: (e) => this.handleForm(e) }, h("div", { key: '59910bc10c66d550dc4ffad7e1ff389f6f80a252', class: "visual-rating-labels", "aria-hidden": "true" }, h("span", { key: '0068e4afa6776748d333fd15328f543a53c2d5db' }, "Heel moeilijk"), h("span", { key: 'c145975a2fd87a39148fb683311ce70f777c8949' }, "Heel makkelijk")), h("div", { key: '79c2099260bea5b4f69bfc5a9cdf67fac42c3116', role: "radiogroup" }, ratings.map((rating, index) => {
+        return (h("dso-panel", { key: 'f129ab62861a035a21d6aa89af2cd7b7f164fc90', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, h("h2", { key: 'db1aa23985a54cdb6aba626ba149c4f5d88844e4', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), h("strong", { key: '41382ad4b378e38dd5a9ff459e0678002e62efa9' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), h("form", { key: '82937dbb48eb6ac7d12605f5883ed59751b9fd76', onSubmit: (e) => this.handleForm(e) }, h("div", { key: '245c312ed64026be170cf83c4e2f05a39797ab2f', class: "visual-rating-labels", "aria-hidden": "true" }, h("span", { key: 'cc5d676feb980a778d6840eba891dbd3a0a83398' }, "Heel moeilijk"), h("span", { key: 'ff12910eaf60d8bdff15f0d63e4beb690f9fef73' }, "Heel makkelijk")), h("div", { key: '2c5d2cfea1a5283065a70ac6848b953a7d48daad', role: "radiogroup" }, ratings.map((rating, index) => {
             const ratingNumber = index + 1;
             return (h(Fragment, null, h("label", { class: `survey-rating-${ratingNumber}` }, ratingNumber, h("span", { class: "sr-only" }, rating), h("input", { type: "radio", name: "rating", value: ratingNumber, checked: ratingNumber === this.rating, onChange: (e) => this.handleChange(e) }))));
-        })), h("button", { key: 'a3ffed7d4ffc9857213cf9d764eef6e4120856fb', type: "submit", class: "dso-secondary" }, h("span", { key: 'd9f359214a7301e34a92f748b0a713a16d081298' }, "Antwoord verzenden")))));
+        })), h("button", { key: '66e49d2363b577a10479753a6aec6f0ab7e5ed9d', type: "submit", class: "dso-secondary" }, h("span", { key: 'fcd08d5ae7a2fd2d95f2a0cd9d6fd7356fd513ec' }, "Antwoord verzenden")))));
     }
 };
 SurveyRating.style = surveyRatingCss();

package/dist/esm/dso-tabs.entry.js

@@ -60,7 +60,7 @@ const Tabs = class {
         this.mutationObserver?.disconnect();
     }
     render() {
-        return (h(Host, { key: '4e1fa88ec6a0fbad7667ad7da0c1476af4e507f3' }, h("div", { key: '720f8412000a312249bd0f3afd7c6e25e2c635d4', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, h("slot", { key: '4880f7416588b3989046d05cfb670af2e5ae18b3' })), h("div", { key: '1d370b83f1aed44bdd980ab369b93b4522924d98', role: "tabpanel", tabindex: "0" }, h("slot", { key: '953c8b9ea9cdb9825017ddf9f7b56f12e4416f62', name: "panel" }))));
+        return (h(Host, { key: '618183241005a5b58cdf86bd52f0522cdb67f82f' }, h("div", { key: '9f0e7d3b93dcb319b85cd014c061c2b79cdf4f77', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, h("slot", { key: '163dc6d4208ffa5127e2844e8fabc506b024950a' })), h("div", { key: '16089b11d2f8a750f33a0033bef4956ba1d51e56', role: "tabpanel", tabindex: "0" }, h("slot", { key: 'b78b75a6ef58aa93f1b1480c058a75eb621517d6', name: "panel" }))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-tijdreis-banner.entry.js

@@ -7,7 +7,7 @@ const TijdreisBanner = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Fragment, { key: 'bdd4ed8c30c4bce01bc47533e52a94fc92769f6d' }, h("dso-icon", { key: 'd2887b8f31a86502c4122f82c0117e78506e8f87', icon: "clock-outline" }), h("slot", { key: 'a6ad0b01a55ee0ce9f5449896c2e2d7cbd0f2e5b' }), h("slot", { key: 'bdac5841942b741da0126673a357abe76351e883', name: "button" })));
+        return (h(Fragment, { key: '7ba47d25fe56b00bc834640a6790d07debb6733a' }, h("dso-icon", { key: '3923d9146899624661a86c4c9b6541e2058134e8', icon: "clock-outline" }), h("slot", { key: 'a017288bee96a3a67beef6cf86102a5a62c8efce' }), h("slot", { key: 'cf3f07d0a92d563f81ff40e7e343352fc752c8d7', name: "button" })));
     }
 };
 TijdreisBanner.style = tijdreisBannerCss();