npm - @dso-toolkit/core - Versions diffs - 96.0.0 → 97.0.0-ghi-3769.1 - Mend

@dso-toolkit/core 96.0.0 → 97.0.0-ghi-3769.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (381) hide show

package/dist/cjs/dso-info_3.cjs.entry.js CHANGED Viewed

@@ -13,12 +13,12 @@ const Info = class {
         this.dsoClose = index.createEvent(this, "dsoClose", 7);
     }
     render() {
-        return (index.h(index.Fragment, { key: '902f98c97248e2ddd76978921405904b843de499' }, index.h("slot", { key: 'fe9eed78ba371fc455ccaa6d9d3cc5eb5d042184' }), !this.fixed && (index.h("dso-icon-button", { key: 'a41c8d68fe39567ad3e94cb6ab12803476cc1fc4', label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
+        return (index.h(index.Fragment, { key: 'd81ab4dea211496332b74f79201433be6b63090c' }, index.h("slot", { key: '51d4fbc532a26ef9aef802597deef2998b7865cf' }), !this.fixed && (index.h("dso-icon-button", { key: 'b7ce0e7b9cd19a8a958be91d87165a15e0003ac0', 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;max-inline-size:640px}.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 infoButtonCss = () => `:host{--_dt-scrollable-border-radius:4px;--_dt-scrollable-container-padding-inline:16px;--_dt-scrollable-container-padding-block:8px;--_dt-icon-button-position:static;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;max-inline-size:640px}.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) {
@@ -38,20 +38,35 @@ const InfoButton = class {
         this.toggletipPlacement = "top";
         this.toggletipActive = false;
         this.hasToggletip = false;
-        this.keyDownHandler = (event) => {
-            if (!this.toggletipActive)
+        this.handleOutsideEvent = (event) => {
+            if (!this.toggletipActive) {
                 return;
-            if (event.key === "Escape") {
-                this.toggletipActive = false;
+            }
+            if (!event.composedPath().includes(this.host)) {
+                this.closeToggletip();
             }
         };
-        this.focusOutHandler = (event) => {
-            if (!this.host.contains(event.relatedTarget)) {
-                this.toggletipActive = false;
-                this.toggletipElRef?.hidePopover();
+        this.keyDownHandler = (event) => {
+            if (!this.toggletipActive) {
+                return;
+            }
+            if (event.key === "Escape") {
+                this.closeToggletip();
             }
         };
     }
+    /**
+     * Listen early to `focusin` at document level and only closes when `composedPath()` shows focus moved outside this component; this is more reliable in Safari.
+     */
+    onDocumentFocusIn(event) {
+        this.handleOutsideEvent(event);
+    }
+    /**
+     * Also catches clicks without focus via `pointerdown` and closes when `composedPath()` shows interaction outside the component, including Safari.
+     */
+    onDocumentPointerDown(event) {
+        this.handleOutsideEvent(event);
+    }
     /**
      * To set focus to the toggle button.
      */
@@ -66,6 +81,13 @@ const InfoButton = class {
             this.dsoToggle.emit({ originalEvent, active: !this.active });
         }
     }
+    closeToggletip() {
+        this.toggletipActive = false;
+        if (this.toggletipElRef?.isConnected && this.toggletipElRef.matches(":popover-open")) {
+            this.toggletipElRef.hidePopover();
+        }
+        this.cleanUpTooltip();
+    }
     cleanUpTooltip() {
         this.cleanUpFunction?.();
         this.cleanUpFunction = undefined;
@@ -94,8 +116,7 @@ const InfoButton = class {
                 this.toggletipElRef?.showPopover();
             }
             else {
-                this.toggletipElRef?.hidePopover();
-                this.cleanUpTooltip();
+                this.closeToggletip();
             }
         }
     }
@@ -109,12 +130,12 @@ const InfoButton = class {
         });
     }
     disconnectedCallback() {
-        this.cleanUpTooltip();
+        this.closeToggletip();
         this.mutationObserver?.disconnect();
         delete this.mutationObserver;
     }
     render() {
-        return (index.h(index.Host, { key: '10ad36d2309fd1f8b9f43d77ddb4adc130428964', onKeyDown: this.keyDownHandler, onFocusout: this.focusOutHandler }, index.h("dso-icon-button", { key: 'f94a0c12e24a97b834a039458aa6b0982ffea47c', 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), "aria-expanded": this.toggletipActive ? "true" : "false", "aria-controls": "toggletip-content" }), this.hasToggletip && (index.h(tooltip_functionalComponent.Tooltip, { key: '1366a103b0ea2ab05c7e3f959e0b7920a783223f', tipElementRef: (element) => (this.toggletipElRef = element), tipArrowElementRef: (element) => (this.toggletipArrowElRef = element) }, index.h("dso-scrollable", { key: 'f4b35f1bbd2f9208ca4aaa0ae09b06b7e7142bf9', ref: (element) => (this.restrictContentElement = element), id: "toggletip-content", "aria-live": "polite" }, index.h("slot", { key: 'df3ef36165d1ec3358feedf214a09d9dafef9902', name: "toggletip" }))))));
+        return (index.h(index.Host, { key: '41ad3d6976d58821505f0a5640807c0a55d6ebfa', onKeyDown: this.keyDownHandler }, index.h("dso-icon-button", { key: 'c1a6157d01a1e3da93ec829232e3c10689ba5b9e', 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), "aria-expanded": this.toggletipActive ? "true" : "false", "aria-controls": this.hasToggletip ? "toggletip-content" : undefined }), this.hasToggletip && (index.h(tooltip_functionalComponent.Tooltip, { key: 'f7d3496067690d138339a2dbb41496df3c85d7e9', tipElementRef: (element) => (this.toggletipElRef = element), tipArrowElementRef: (element) => (this.toggletipArrowElRef = element) }, index.h("dso-scrollable", { key: 'ac265421464d919247dbc4ceea7f4c1daefb250f', ref: (element) => (this.restrictContentElement = element), id: "toggletip-content", "aria-live": "polite" }, index.h("slot", { key: 'af1197efa5166f2618424b1424d5c438ab7089e6', name: "toggletip" }))))));
     }
     get host() { return index.getElement(this); }
 };
@@ -181,7 +202,7 @@ const Selectable = class {
     }
     render() {
         const hasInfo = !!this.host.querySelector('[slot="info"]');
-        return (index.h(index.Fragment, { key: '3d98b23e1aff2b9d87f491373a236c4d3c4d6506' }, index.h("div", { key: '8b2c1a74048ebae12bde50719593f4dfbdcae3dd', class: "dso-selectable-container" }, index.h("div", { key: '43098a94f1b95ccc8f69b4e8f2c60f99eb283229', class: "dso-selectable-input-wrapper" }, index.h("input", { key: '7c0a0d708184b5aeda327e52ffa03872b1c248d9', 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 ? (index.h("label", { htmlFor: this.getIdentifier() }, index.h("slot", null))) : (index.h("label", null, index.h("slot", null)))), hasInfo && !this.infoFixed && (index.h("dso-info-button", { key: '53e497962ec33ded495671181f858baada63b3b3', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (index.h("dso-info", { key: '0ad6f2f0c18725cd84c42879c5fa9fd0a38f0000', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, index.h("div", { key: 'b70e5c5e7682a0face7d7f8225af88d32285dd6f' }, index.h("slot", { key: '4b66be88a0dcef32606a12707ac4dd3ae16d53ee', name: "info" })))), index.h("slot", { key: '3c3e9d3b63d567be2d000732ab7f8bc826466ec6', name: "options" })));
+        return (index.h(index.Fragment, { key: 'f8cd51d0562d5718bfb2846a1a1f001d067d88c2' }, index.h("div", { key: '0334a8b7aa939eac065292c34ad37bf4e757be56', class: "dso-selectable-container" }, index.h("div", { key: 'a7fb59205e16eb3797ed1acaaa7acb3934583507', class: "dso-selectable-input-wrapper" }, index.h("input", { key: 'bb7f49b38b56e5ba6bb690292646343bbfe0f2eb', 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 ? (index.h("label", { htmlFor: this.getIdentifier() }, index.h("slot", null))) : (index.h("label", null, index.h("slot", null)))), hasInfo && !this.infoFixed && (index.h("dso-info-button", { key: '45a00a047487be4f1426d83a3366ffce52dc941e', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (index.h("dso-info", { key: 'ab533add5946fe56c6362ae99a6bc89aebe82b6c', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, index.h("div", { key: '832279eb9a49a7b16374f00218ea5e8c3841aeed' }, index.h("slot", { key: '9d93816bcc8c6d9a91da08001d889feec5fc5d64', name: "info" })))), index.h("slot", { key: '8aee73d7bc3fb2a634b8c9a445cd20318f436765', name: "options" })));
     }
     componentDidRender() {
         if (this.input && typeof this.checked === "boolean" && this.input.checked !== this.checked) {

package/dist/cjs/dso-input-range.cjs.entry.js CHANGED Viewed

@@ -17,13 +17,13 @@ const InputRange = class {
         const min = this.min || 0;
         const max = this.max || 100;
         const step = this.step || 1;
-        return (index.h(index.Fragment, null, this.description && (index.h("span", { key: 'e6d9d790d42f441d15b461010d3773ac94851482', id: "description", hidden: true }, this.description)), index.h("span", { key: 'c5bd62d65306dc41df200366cff5d38a3f9fd46a', class: "counter", "aria-hidden": "true" }, min, this.unit), index.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({
+        return (index.h(index.Fragment, null, this.description && (index.h("span", { key: '817a31fe6d65fcdcf80ba2ab8c6782a6caaa5e6a', id: "description", hidden: true }, this.description)), index.h("span", { key: '26e3a9848dc7d5b017f0347f46ed6a401b52a85d', class: "counter", "aria-hidden": "true" }, min, this.unit), index.h("input", { key: '901fd461f8022de4f07e76f9d26c939e69f91d49', 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,
-            }) }), index.h("span", { key: 'ed7323ee13025476fadba72522d829531c32263f', class: "counter", "aria-hidden": "true" }, max, this.unit)));
+            }) }), index.h("span", { key: 'aaf24f2564c9a896e2d192efaacda91132056729', class: "counter", "aria-hidden": "true" }, max, this.unit)));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-label_3.cjs.entry.js CHANGED Viewed

@@ -127,11 +127,11 @@ const Label = class {
         this.isTruncated = false;
     }
     render() {
-        return (index$1.h(index$1.Fragment, { key: 'e6147116684de129f842e3f87d15239394b68909' }, index$1.h("span", { key: 'a4aecc6e1663e214f453aac7a19607f88ca61b8a', "aria-describedby": this.isTruncated ? "toggle-anchor" : null, class: clsx.clsx("dso-label", {
+        return (index$1.h(index$1.Fragment, { key: 'a99d6cc8963369323170ebcc53e28b94b7d7c7c3' }, index$1.h("span", { key: '537eb8d01a5267b8a086f9d36f3467a966b17a46', "aria-describedby": this.isTruncated ? "toggle-anchor" : null, class: clsx.clsx("dso-label", {
                 [`dso-label-${this.status}`]: this.status,
                 "dso-compact": this.compact && !this.removable,
                 "dso-hover": this.removeHover || this.removeFocus,
-            }) }, index$1.h("slot", { key: '063f6abda24eed65322b0d076d2e7cacee4e587d', name: "symbol" }), index$1.h("span", { key: 'c11377a23dc1e9f2df598c3a51161e9cf59364fd', 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 }, index$1.h("slot", { key: '41b9e8a42beddb9944a12191451f189e75184e14' })), this.removable && (index$1.h("dso-icon-button", { key: 'dee64f0d16e68128520b621952bfc43676873e2f', 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 && (index$1.h(tooltip_functionalComponent.Tooltip, { key: '368a5cb2abda6361275f2fe2bb34b2a480747e68', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, index$1.h("span", { key: '18913189bee3dbd55110b0d9a91c7acc22abd9ae', id: "toggle-anchor" }, this.labelText)))));
+            }) }, index$1.h("slot", { key: 'c5b88bf55d16e7eba13b38772921569c19e7154e', name: "symbol" }), index$1.h("span", { key: '1d38e0213e1f29c766d90572445912fa11865baf', 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 }, index$1.h("slot", { key: 'f5aecdb0e9c06e07d07d9b851d09d17ffcb48201' })), this.removable && (index$1.h("dso-icon-button", { key: '22f46320e8dad5ea1a4ac74ab42c7b8112e961c0', 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 && (index$1.h(tooltip_functionalComponent.Tooltip, { key: 'cb87883adf00cae721807f5198517b693943e9ab', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, index$1.h("span", { key: 'f511c9137ef32eda3f8d15d4fd5431907926d682', id: "toggle-anchor" }, this.labelText)))));
     }
     get host() { return index$1.getElement(this); }
     static get watchers() { return {
@@ -226,7 +226,7 @@ const SlideToggle = class {
         this.hasVisibleLabel = this.host.querySelector("*") !== null;
     }
     render() {
-        return (index$1.h(index$1.Fragment, { key: 'e874372b9924ff9fde733d5e3018a7aef3d9ff3e' }, index$1.h("button", { key: '08f03b06692ec0339e47373293425b0c987f9064', 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 } : {}) }, index$1.h("svg", { key: 'd866e732368bdadc59b12c378e319a54e17ed77a', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: 'f8a9f05a98b948caa99418d55e87df39c1ac4cef', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: 'bb9bb4da86533006b4a28ee46e637ec2de849884', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: 'becff9d37908c63ed3bf72f2e4557473f33864be', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: 'e15e27c77547bf587af1a206504ec72840238d0b', htmlFor: this.identifier }, index$1.h("slot", { key: 'e412f82c66edc0c1870bae53ab9bc8619a4f1709' })))));
+        return (index$1.h(index$1.Fragment, { key: '274c335f42f2e4d520a0ae2a6bdf1b0d866a1beb' }, index$1.h("button", { key: '2c9189d9ecc995f108387c69189e3ee36f3e2df8', 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 } : {}) }, index$1.h("svg", { key: 'd08d9ff2cb0506be4ea8a70767352ed7ee8044b6', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: '72080e2b31f9f1e136b987a9b227fb448c3d3bec', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: 'fd487372b48443feab75884f897dedc009e0b23a', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: '4f2826e8798297f357be6d2a8d63c52eb722476d', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: '69d7f71c94a7094882a2a8d08e29ce32dcdedc41', htmlFor: this.identifier }, index$1.h("slot", { key: 'add7fa3aa284c4a5907aa28f5d2a9fc8ecf12662' })))));
     }
     get host() { return index$1.getElement(this); }
 };

package/dist/cjs/dso-legend-group.cjs.entry.js CHANGED Viewed

@@ -57,7 +57,7 @@ const LegendGroup = class {
         delete this.mutationObserver;
     }
     render() {
-        return (index.h(index.Host, { key: '6c85749b5dee4dabde77608a104cbed8bb48bc1e' }, index.h("div", { key: 'c53c431f3f3661ce8c5721bafb7352af9d5d453c', class: "legend-group-header" }, index.h("slot", { key: 'e4d91d85ec069aedec6999d7d152f1daa38fc14a', name: "heading" }), this.mode && (index.h("dso-icon-button", { key: 'dbad287aeb544c75d7a7b9e1b738d0b0944eabee', label: this.mode === "view" ? this.text("edit") : this.text("view"), icon: this.mode === "view" ? "pencil" : "check", variant: "tertiary", onDsoClick: this.toggleMode }))), this.mode === "edit" && index.h("slot", { key: 'cf23c63346469b4e1dc203fd567e30def1cccb6e', name: "options" }), index.h("slot", { key: 'bab7f405d573773ed394e76020ec13cc16508bea' })));
+        return (index.h(index.Host, { key: '23e81a9f5313e6e720793fd355e16280cc72b44e' }, index.h("div", { key: '6dabd746bd5f6c6ef03920d78165ba4c7c589974', class: "legend-group-header" }, index.h("slot", { key: '9abf4a7d64c8b8a900f0247bd9b7f82a3e198908', name: "heading" }), this.mode && (index.h("dso-icon-button", { key: '1ed8e7db427b78de927ba276aea586b200c07647', label: this.mode === "view" ? this.text("edit") : this.text("view"), icon: this.mode === "view" ? "pencil" : "check", variant: "tertiary", onDsoClick: this.toggleMode }))), this.mode === "edit" && index.h("slot", { key: 'ef76fb21909e746af4eb97614e4a4528e4b677ac', name: "options" }), index.h("slot", { key: 'bb61c854a2f3e146d07596c42b6e9511b6c7da28' })));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/dso-legend-item.cjs.entry.js CHANGED Viewed

@@ -82,7 +82,7 @@ const LegendItem = class {
         const accessibleLabel = label?.textContent
             ? this.text("makeActive", { label: label.textContent.toLowerCase() })
             : this.text("makeActiveDefault");
-        return (index.h(index.Host, { key: '7128f9fed0f217bb833c2095c1d46d66676da677', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h("div", { key: '1df9fba67c70bb4ee9c0937ce669a158ab48c4c1', class: clsx.clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (index.h("div", { key: '81a8ed8f62f582d827d29f8506045216567c83bd' }, index.h("slot", { key: '68a3897a0721c6076e1651eb719850ee856313ce', name: "symbol" }))), index.h("div", { key: '483135a73396ce9c70e554f6a087a1b4649773d2' }, index.h("slot", { key: 'f66081ea00ba602a4ecbc17006def6fd5bf62ab8', name: "label" })), this.disabled && this.disabledMessage && (index.h("dso-info-button", { key: 'c3eaf2c122ee6f7472ac9045e349842165e366b4', label: this.text("disabledInfo"), toggletipPlacement: "bottom" }, index.h("div", { key: 'c043244f10302249c194c3021ea70060354a37fb', slot: "toggletip" }, this.disabledMessage))), index.h("div", { key: '5246deaa8b3de943274e12acbd4c73168081e122', class: "legend-item-right-content" }, this.renderRightContent(hasOptions, accessibleLabel))), hasOptions && (index.h("div", { key: 'a9dfebaa706e3752396fcbd42dc1d4b48d04b1ca', hidden: this.disabled || !this.showOptions, class: "options" }, index.h("slot", { key: '3c68f73f1e17ff46b004361301b1f3b674fec4c3', name: "options" })))));
+        return (index.h(index.Host, { key: '06555aea03a3f68f81bcdae689f819057a5cab31', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h("div", { key: '4b9a671ca33f26bc7e0f0da6fa87b2b53f8c6863', class: clsx.clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (index.h("div", { key: '5fb2c1ddc915f67408ed756155bc9b3a3c9f3291' }, index.h("slot", { key: '612953f0f771a1b1515861f51de5fc0dc29a640c', name: "symbol" }))), index.h("div", { key: 'f71d2fc0108ba41bf01d9edc5705d94f1b51217a' }, index.h("slot", { key: 'c33af92708989078932c3b08015f15a79985c411', name: "label" })), this.disabled && this.disabledMessage && (index.h("dso-info-button", { key: '79cfb323e182a3ac343ae93efd6c1523e5048c0d', label: this.text("disabledInfo"), toggletipPlacement: "bottom" }, index.h("div", { key: '7b6883d6671682e42c400e30519109e389c5d681', slot: "toggletip" }, this.disabledMessage))), index.h("div", { key: '2b0bb453545e26e6d8f50006809335ff7a7aa129', class: "legend-item-right-content" }, this.renderRightContent(hasOptions, accessibleLabel))), hasOptions && (index.h("div", { key: 'f78bee16dd7ef6d933efa11beef7b8ec0c9e9e8d', hidden: this.disabled || !this.showOptions, class: "options" }, index.h("slot", { key: '13f453ecdfe586ea3cd1884736da6e1941feb1b7', name: "options" })))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-legend.cjs.entry.js CHANGED Viewed

@@ -18,7 +18,7 @@ const translations = {
     },
 };
-const legendCss = () => `*,*::after,*::before{box-sizing:border-box}:host{position:relative;display:block;inline-size:344px;background-color:#fff;box-shadow:0 0 8px 0 rgba(0, 0, 0, 0.3);border-radius:4px}:host .topbar{padding-block-start:8px;padding-inline:16px}:host .topbar .tabs{inline-size:100%;padding:0;list-style:none;display:inline-flex;border-block-end:1px solid #ccc}:host .topbar .tabs .tab{font-size:inherit;font-family:inherit;line-height:inherit;background-color:transparent;cursor:pointer;display:block;border:0;color:#275937;padding-block:6px;padding-inline:8px;border-block-end:4px solid transparent}:host .topbar .tabs .tab:hover{text-decoration:underline}:host .topbar .tabs .tab.active{font-weight:bold;border-color:#8b4a6a}:host .topbar .close-button{position:absolute;inset-block-start:8px;inset-inline-end:8px}:host ::slotted(dso-legend-group:last-child){margin-block-end:8px}:host .content{--_dso-form-group-margin-block-end:0;--_dt-scrollable-container-border-end-start-radius:4px;--_dt-scrollable-container-border-end-end-radius:4px;--_dt-scrollable-container-padding-inline:16px;max-block-size:52vh;border-end-start-radius:4px;border-end-end-radius:4px}`;
+const legendCss = () => `*,*::after,*::before{box-sizing:border-box}:host{position:relative;display:block;inline-size:344px;background-color:#fff;box-shadow:0 0 8px 0 rgba(0, 0, 0, 0.3);border-radius:4px}:host .topbar{padding-block-start:8px;padding-inline:16px}:host .topbar .tabs{inline-size:100%;padding:0;list-style:none;display:inline-flex;border-block-end:1px solid #ccc}:host .topbar .tabs .tab{font-size:inherit;font-family:inherit;line-height:inherit;background-color:transparent;cursor:pointer;display:block;border:0;color:#275937;padding-block:6px;padding-inline:8px;border-block-end:4px solid transparent}:host .topbar .tabs .tab:hover{text-decoration:underline}:host .topbar .tabs .tab.active{font-weight:bold;border-color:#8b4a6a}:host .topbar .close-button{position:absolute;inset-block-start:8px;inset-inline-end:8px}:host ::slotted(dso-legend-group:last-child){margin-block-end:8px}:host .content{--_dso-form-group-margin-block-end:0;--_dt-scrollable-container-border-end-start-radius:4px;--_dt-scrollable-container-border-end-end-radius:4px;--_dt-scrollable-container-padding-inline:16px;max-block-size:var(--_dso-legend-content-max-block-size, 52vh);border-end-start-radius:4px;border-end-end-radius:4px}`;
 const Legend = class {
     constructor(hostRef) {
@@ -83,7 +83,7 @@ const Legend = class {
         this.moveFocusToTab(next);
     }
     render() {
-        return (index.h(index.Host, { key: '3e4e038a5db2854272093ab48481e4fee9356172' }, index.h("div", { key: '86af0f8444713cca10984138809a90cbb7c28091', class: "topbar" }, index.h("div", { key: '9f19d3782fdb3187ab26798e2a952b29116e47de', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, this.tabItems.map((tabItem) => (index.h("button", { class: clsx.clsx("tab", { active: tabItem.active }), role: "tab", "aria-selected": tabItem.active ? "true" : "false", ...(!tabItem.active ? { tabIndex: -1 } : {}), onClick: this.clickHandler }, tabItem.label)))), index.h("dso-icon-button", { key: '897696535cf5889d09f1434f27e5b0ba729d2f9d', icon: "cross", variant: "tertiary", label: this.text("closeLegend"), class: "close-button", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e.detail.originalEvent }) })), index.h("dso-scrollable", { key: 'a91e467a28d35a3068e176dd5587a4fa4331ca40', class: "content" }, index.h("div", { key: '504824dbe3da26f0aea426ccaf0a5c260ffc95ad', role: "tabpanel", tabIndex: 0 }, index.h("slot", { key: 'facc43e2bd2dce215ed24bda396199a7b0e71b75' })))));
+        return (index.h(index.Host, { key: '886c2fe72507f069348afe8d00445f8815e8d3e5' }, index.h("div", { key: '76ff4ccadc5d273d2be123683291af188c437bc0', class: "topbar" }, index.h("div", { key: '91ee04d189b272073b0a22f097b6a73a532a4eaa', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, this.tabItems.map((tabItem) => (index.h("button", { class: clsx.clsx("tab", { active: tabItem.active }), role: "tab", "aria-selected": tabItem.active ? "true" : "false", ...(!tabItem.active ? { tabIndex: -1 } : {}), onClick: this.clickHandler }, tabItem.label)))), index.h("dso-icon-button", { key: '74694b225b97bebfb969c4418f9d3a666d1a9736', icon: "cross", variant: "tertiary", label: this.text("closeLegend"), class: "close-button", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e.detail.originalEvent }) })), index.h("dso-scrollable", { key: '455f964cef167450eff8e1f393bf5d8dd69cd2f9', class: "content" }, index.h("div", { key: 'dce12f6b9c634473f57ae2afb708a6213e1a6e26', role: "tabpanel", tabIndex: 0 }, index.h("slot", { key: '79500096664a2fa8144c2903db527aec9aca19a8' })))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-list-button.cjs.entry.js CHANGED Viewed

@@ -73,7 +73,7 @@ const ListButton = class {
     }
     render() {
         const selected = this.checked || (this.count !== undefined && this.count > 0);
-        return (index.h("div", { key: 'b40ad36bcae88fd3a24af536577c54f719dd726c', class: clsx.clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, index.h("div", { key: '40dcae84cc39892cc622d5ff6cd11eab081bcc1d', class: clsx.clsx(["dso-list-button", { "dso-selected": selected, "dso-single-count": this.count === 1 }]), onClick: (e) => this.handleSelectClick(e) }, index.h("dso-selectable", { key: 'cffca295491fb902d476d78184ae81ee76e16180', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, index.h("span", { key: '4ec09a173e8392e526acbead245fbcb7603885ff' }, this.label, this.sublabel && index.h("span", { key: '2aae89b6b5f4ae0cb3a36bb0a200bf7f90832bb8', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (index.h("span", { key: 'f6eb83bbfa910e0efb83444308718e0d9d69b130', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", index.h("span", { key: '2668759703c2673b759e56270a0fdd4ae33b7af6', innerHTML: this.subcontentSlot.innerHTML }))))), this.sublabel && index.h("span", { key: '73e322f19f7c95b10c8436c346b4cdabff331941', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (index.h("div", { key: 'dabdc528ecceb84b133f8f2e7ad49d92ebe50957', class: "subcontent" }, index.h("slot", { key: 'db2307e499b084f766c6e59530654895856f7087', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (index.h("div", { key: '67af4d0d0e30c0683501ab7dead8e6e6445dac8d', class: "dso-input-number" }, this.count > 1 && (index.h(index.Fragment, { key: 'e7c26bd345a1fb6ec1202d317f07c42ebc1c1e4c' }, index.h("dso-icon-button", { key: 'c3143d4ee0586a589be2110ac6d41989e77f10e6', label: "Aantal verlagen", variant: "tertiary", icon: "minus-circle-outline", disabled: this.count === Number(this.min) || this.disabled, onDsoClick: (e) => this.stepValue(e, "decrement") }), index.h("span", { key: '6258f043e6715023fb95efd5812c153bfcf60810', class: "dso-input-step-counter", "aria-label": "Aantal", "aria-live": "polite" }, this.count))), index.h("dso-icon-button", { key: 'b308ddab2232669159dd46cea1a5b157c92c399b', label: "Aantal verhogen", variant: "tertiary", icon: "plus-circle-outline", disabled: this.count === Number(this.max) || this.disabled, onDsoClick: (e) => this.stepValue(e, "increment") })))));
+        return (index.h("div", { key: '43132ce16bdecfda712bf03502dc33f34be45736', class: clsx.clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, index.h("div", { key: '6fbf520088efd44171b4f055c725fc62ad7e8bdb', class: clsx.clsx(["dso-list-button", { "dso-selected": selected, "dso-single-count": this.count === 1 }]), onClick: (e) => this.handleSelectClick(e) }, index.h("dso-selectable", { key: '3c394548a0bedcb4a12ebc9893456d0d7340f19b', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, index.h("span", { key: '730117cc84bf76b2471cf8de663a33523330f1fc' }, this.label, this.sublabel && index.h("span", { key: 'ccf2e934cef8093380da6d4bdf049dac3c3e2426', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (index.h("span", { key: '2d0a1ca7d9addd11bf37a78531a3fba7d7add182', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", index.h("span", { key: 'eb3ae0f445ba0a4387c81494da0626102787da54', innerHTML: this.subcontentSlot.innerHTML }))))), this.sublabel && index.h("span", { key: 'b3f22985913b690a761bf9d8b7f07f11a51f1bc0', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (index.h("div", { key: '5e2aedcd7739c8cdc17caf79657a5048cf9ea782', class: "subcontent" }, index.h("slot", { key: '4d27c23f316748f7d89084d6c200d58e4c2ec65c', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (index.h("div", { key: '9824062e1b5a1262d6da06c32d8a841a64653d89', class: "dso-input-number" }, this.count > 1 && (index.h(index.Fragment, { key: '02af72cf5462ca8034a4636647ec8bfad486e0c8' }, index.h("dso-icon-button", { key: 'ffe074c227b82e9ea43b1bbfef5bf4df83ce6797', label: "Aantal verlagen", variant: "tertiary", icon: "minus-circle-outline", disabled: this.count === Number(this.min) || this.disabled, onDsoClick: (e) => this.stepValue(e, "decrement") }), index.h("span", { key: '8fbe1d1d7c5c107d44ee32a803cbb198e6477a0b', class: "dso-input-step-counter", "aria-label": "Aantal", "aria-live": "polite" }, this.count))), index.h("dso-icon-button", { key: '1ca23849e768bc83a07eb498388b99488e3cf6c2', 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 index.getElement(this); }
 };

package/dist/cjs/dso-logo.cjs.entry.js CHANGED Viewed

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

package/dist/cjs/dso-map-base-layers.cjs.entry.js CHANGED Viewed

@@ -45,7 +45,7 @@ const MapBaseLayers = class {
         for (const ref in this.selectableRefs) {
             delete this.selectableRefs[ref];
         }
-        return (index.h("fieldset", { key: '6a8793ee9ec686ffacf7925c46a3e890b3d43d00', class: "form-group dso-radios" }, index.h("legend", { key: 'bd71c0cf69155d07feac2d08293a7df74f4060af', class: "sr-only" }, "Achtergrond"), index.h("div", { key: 'c1029e36e0da4ef8b8cc991e6d93ce5921ca48a3', class: "dso-label-container" }, index.h("span", { key: '852f466aab28ed062c3b44bf9085e7a1e9e61333', class: "control-label", "aria-hidden": "true" }, this.text("background"))), index.h("div", { key: 'a8ca16ac5869b90017dbb524c342f4b7d5f73a77', class: "dso-field-container" }, this.baseLayers.map((baseLayer) => (index.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 ? index.h("p", { slot: "info" }, baseLayer.info) : null))))));
+        return (index.h("fieldset", { key: '3aa5321028e39927f51868b8df0288c723c6e81f', class: "form-group dso-radios" }, index.h("legend", { key: '9dee1ff46863dfc8fd94cd73777201d3bf17cca2', class: "sr-only" }, "Achtergrond"), index.h("div", { key: 'da4dda9ea7b656d44d3468fe78d0346b5d3d9179', class: "dso-label-container" }, index.h("span", { key: 'cc513f63127c63878aa0429c0f84cd858f01ea6c', class: "control-label", "aria-hidden": "true" }, this.text("background"))), index.h("div", { key: '4561bb74c2f00ddc62de4d8764fa18d1f74d9dd7', class: "dso-field-container" }, this.baseLayers.map((baseLayer) => (index.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 ? index.h("p", { slot: "info" }, baseLayer.info) : null))))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-map-controls.cjs.entry.js CHANGED Viewed

@@ -42,7 +42,7 @@ var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) ||
         throw new TypeError("Cannot write private member to an object whose class did not declare it");
     return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var _MapControls_closeButtonElement, _MapControls_toggleButtonElement, _MapControls_toggleIconButtonElement;
+var _MapControls_toggleButtonElement, _MapControls_toggleIconButtonElement, _MapControls_mapLayersPanelId, _MapControls_mapLayersTitleId;
 // Sync with $transition-duration in ./map-controls.scss and map-controls.cy.ts
 const transitionDuration = 300;
 const MapControls = class {
@@ -57,14 +57,14 @@ const MapControls = class {
         this.open = false;
         this.hideContent = !this.open;
         this.text = i18n.i18n(() => this.host, translations);
-        _MapControls_closeButtonElement.set(this, void 0);
         _MapControls_toggleButtonElement.set(this, void 0);
         _MapControls_toggleIconButtonElement.set(this, void 0);
+        _MapControls_mapLayersPanelId.set(this, "map-layers-panel");
+        _MapControls_mapLayersTitleId.set(this, "map-layers-title");
     }
     watchOpen(open) {
         if (open) {
             this.hideContent = false;
-            setTimeout(() => __classPrivateFieldGet(this, _MapControls_closeButtonElement, "f")?.focus(), transitionDuration);
         }
         else {
             setTimeout(() => {
@@ -92,7 +92,7 @@ const MapControls = class {
         });
     }
     render() {
-        return (index.h(index.Fragment, { key: '411b9b7b5d2e6f41230fd8a3f731899a335c9e9f' }, index.h("dso-icon-button", { key: 'f3b9115f95630c8992a8f34fbbe65ae4cc1b201f', 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")) }), index.h("button", { key: 'cf2abe1623ed0323fe27566703a22abe8aac5b7c', type: "button", class: "dso-map toggle-visibility-button", onClick: (e) => this.toggleVisibility(e), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleButtonElement, element, "f")) }, index.h("dso-icon", { key: '1617d4064c446c9e9d9b0a437b22b69a358d8a8d', icon: "layers" }), index.h("span", { key: 'b3c28ae6b7a5cf63bc094df593fad526125e16e0' }, this.text("layersButton"))), index.h("dso-button-group", { key: '634b00997c867d6bd25142c460ef433193b34807', class: "zoom-buttons", direction: "column" }, index.h("dso-icon-button", { key: 'f2cf801742a48e7bb8bdbed05c934081e8a7a512', 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" }), index.h("dso-icon-button", { key: 'd3c140cc554cd5943812ab318d53230bf96a4775', 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" })), index.h("section", { key: 'e91b093e161b8ef2d060bf93982526d4c803eefc', hidden: this.hideContent }, index.h("header", { key: 'bcd1b3bf72dfd87f4d05b16926c1119523397b74' }, index.h("h2", { key: '8e32a0a23e780e341f5bcf449273e6be7531f798' }, this.text("title")), index.h("dso-icon-button", { key: 'f0eba0ad8332136f29684a8f5d382b885441a899', 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")) })), index.h("dso-scrollable", { key: 'cb103d3c9d987bf9f16cdc62ff3924e202b6a47f' }, index.h("div", { key: 'f8d1e9a6c98913df5b352bec957b7ff910635b12', class: "content" }, index.h("slot", { key: '5ca27d90e9346104307f981647db01353444c24b' }))))));
+        return (index.h(index.Fragment, { key: 'ce8065c103cc0ba2893c6ab1afe77a256363d4bd' }, index.h("dso-icon-button", { key: 'e82b5f9de41a5097a2427f34d56488b90fb5beec', label: this.text("layersButton"), icon: "layers", variant: "map", "aria-controls": __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f"), "aria-expanded": this.open, tooltipPlacement: "left", class: "toggle-visibility-icon-button", onDsoClick: (e) => this.toggleVisibility(e.detail.originalEvent), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleIconButtonElement, element, "f")) }), index.h("button", { key: '703dddf29652de5f1bc1fe8d7cf3446ed780858c', type: "button", class: "dso-map toggle-visibility-button", "aria-controls": __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f"), "aria-expanded": this.open, onClick: (e) => this.toggleVisibility(e), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleButtonElement, element, "f")) }, index.h("dso-icon", { key: 'f24de55637a0630f7471c623f8314114984273eb', icon: "layers" }), index.h("span", { key: '50042030f5645a47b7a36016f467cfb74429b8df' }, this.text("layersButton"))), index.h("dso-button-group", { key: 'a07df9edc5fc0194b3bba07d35611a1d95b6ad2d', class: "zoom-buttons", direction: "column" }, index.h("dso-icon-button", { key: '5c7e54a78771bab145ccb16cf63e4b03b1a1ad1d', 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" }), index.h("dso-icon-button", { key: '783f08c968346c1aab2a16879b9a5ec74a25dcd0', 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" })), index.h("section", { key: 'a90b02f76a7bd13de09c18e26e23192810c8689c', id: __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f"), hidden: this.hideContent, role: "region", "aria-labelledby": __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f") }, index.h("header", { key: '2beae426fa9b56661f5e92843dc7af17c6cf6250' }, index.h("h2", { key: '2809c1abd68b33b2a901435d1f787c0772698178', id: __classPrivateFieldGet(this, _MapControls_mapLayersTitleId, "f"), tabIndex: -1 }, this.text("title")), index.h("dso-icon-button", { key: '5f8a9aa11a4fd3ec996f08773999b620964e637d', class: "close-button", label: this.text("hidePanel", { title: this.text("title") }), icon: "cross", variant: "tertiary", onDsoClick: (e) => this.toggleVisibility(e.detail.originalEvent) })), index.h("dso-scrollable", { key: 'a65b378955db1242a326cf9f0c819547a31a034b' }, index.h("div", { key: '6baa8c04b6fc90003f249ac70f9a2743d011aad9', class: "content" }, index.h("slot", { key: '59eaf6868b5135101253256e0671514d10f46cd6' }))))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
@@ -101,7 +101,7 @@ const MapControls = class {
             }]
     }; }
 };
-_MapControls_closeButtonElement = new WeakMap(), _MapControls_toggleButtonElement = new WeakMap(), _MapControls_toggleIconButtonElement = new WeakMap();
+_MapControls_toggleButtonElement = new WeakMap(), _MapControls_toggleIconButtonElement = new WeakMap(), _MapControls_mapLayersPanelId = new WeakMap(), _MapControls_mapLayersTitleId = new WeakMap();
 MapControls.style = mapControlsCss();
 exports.dso_map_controls = MapControls;

package/dist/cjs/dso-map-layer-object.cjs.entry.js CHANGED Viewed

@@ -20,7 +20,7 @@ const MapLayerObject = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: 'd3ae97e4927468933df545d3a96ba6e718e1e1ad', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: 'cd07ad344870b3094da446c7e4c0edd427e3d6ce', wijzigactie: this.wijzigactie }, index.h("div", { key: '3072d3e742d38c6595cea979d9a1ddaa1d6d3e88', class: "map-layer-object" }, index.h("div", { key: 'c13e0ce235ecbb060ed54ce5341204abf0138e3d' }, index.h("slot", { key: 'df2c3fcbe76e66fb7f6b14c98f10081459a78578', name: "symbol" })), index.h("div", { key: '8c0bbd546f0e32de4027df6a5d952ddc7d4ce824', class: "map-layer-object-heading" }, index.h("slot", { key: 'e03b7b7d7d2d8ff5f5c0119927ec4b86caaa30b9' }), index.h("slot", { key: '18b2530ff6b7cb64444ca411543c931fa19e0ed9', name: "label" })), index.h("div", { key: 'f072928ac1d7c21ceec10862770162d68a0ed99c', class: "slide-toggle-container" }, index.h("dso-slide-toggle", { key: '2fa80350abcf2c8e843df84a009b82dd8cd28d34', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange }))))));
+        return (index.h(index.Host, { key: '1a642be25ee5541acf40ab3bc27277dccd5f512c', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: '11cfb26baddbbe6a9b79c5fc5036102ab1849d0a', wijzigactie: this.wijzigactie }, index.h("div", { key: '0a24909155dd4a79aea34e6495bde7e252daafbb', class: "map-layer-object" }, index.h("div", { key: '7e021d9671e5882550b7fe3c0d71e84f61fafcc6' }, index.h("slot", { key: 'f0820bbae94e113098d15c67c7a94a8f17feacd4', name: "symbol" })), index.h("div", { key: '0f3b7c92a402d00a815ed08f53d711ad1a1d7b7f', class: "map-layer-object-heading" }, index.h("slot", { key: 'ed30748c607132007b4e0051c78f72d501447894' }), index.h("slot", { key: 'e1f0aeae1e74f20c8b4731e9a7d875ad617aa188', name: "label" })), index.h("div", { key: '577dce8678ec8d960a2881cb14def62be67060fe', class: "slide-toggle-container" }, index.h("dso-slide-toggle", { key: 'acce1e97495382f9162083bb2fada6c99d897bca', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange }))))));
     }
 };
 MapLayerObject.style = mapLayerObjectCss();

package/dist/cjs/dso-map-layer.cjs.entry.js CHANGED Viewed

@@ -23,7 +23,7 @@ const MapLayer = class {
         };
     }
     render() {
-        return (index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: 'da8857b71f2e5546c35a9449393a6696d7fe888e', wijzigactie: this.wijzigactie }, index.h("div", { key: '5a65e6afedfa0b591a6bbb57d41831ddf4a7188b', class: "map-layer" }, index.h("div", { key: '6f552eab820bab4848a80e86c879b6fbf34e06ef', class: "map-layer-heading" }, index.h("slot", { key: '7b4480d6d6876e6b7e0ee6d712333307b1a37aa7', name: "name" }), index.h("slot", { key: '7ce6dfc406b9e0a3bcbefccdc6b94cda1e8bb300', name: "label" })), this.activatable && (index.h("div", { key: 'd800d425deb67f31d12f461310a1fe8e8fc57025', class: "slide-toggle-container" }, index.h("dso-slide-toggle", { key: 'a854995e89971a6e8c6201afe98d0973d1093ef2', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange })))), index.h("slot", { key: 'edcc28c7ee97bb62db8a2b869c044fc00fd94703' })));
+        return (index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: '430200f8ba05cd91087b9f08c352035a1104af9a', wijzigactie: this.wijzigactie }, index.h("div", { key: 'b6a47ce341423c7e913c88ddf632396267009f60', class: "map-layer" }, index.h("div", { key: 'aa41bc1c07f55d756e8203313722ee7554f657ab', class: "map-layer-heading" }, index.h("slot", { key: '94bd01b181974d47563bffdf98de23c2ba29b417', name: "name" }), index.h("slot", { key: '22936b4a70c2332db9209c500ba57e934b79378b', name: "label" })), this.activatable && (index.h("div", { key: '7c0fadf3b83d10e14b3c8256af2e3a4c7a733f71', class: "slide-toggle-container" }, index.h("dso-slide-toggle", { key: '5482011e4ecb74213c5224a767ee40f3e1e0fe5d', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange })))), index.h("slot", { key: '6d2532733890aeeabbb73e45d9136129c3ab813b' })));
     }
 };
 MapLayer.style = mapLayerCss();

package/dist/cjs/dso-map-message.cjs.entry.js CHANGED Viewed

@@ -22,11 +22,11 @@ const MapMessage = class {
     render() {
         const iconName = this.variant ? iconMap[this.variant] : undefined;
         const role = this.variant === "error" ? "alert" : "status";
-        return (index.h("div", { key: '4cb55bf66c8b792e49a4464005b513871823e255', class: {
+        return (index.h("div", { key: '06df4be84d9aaca78b4aa1e4be4f9799e3b40c8f', class: {
                 "map-message-content": true,
                 "has-icon": iconName !== undefined,
                 "has-actions": this.hasActions,
-            }, role: role, "aria-atomic": "true" }, index.h("div", { key: 'bef35edb27a8006736f6c86be8e5f4182e8d5c15', class: "map-message-body" }, iconName && index.h("dso-icon", { key: '392f466099016711116080a7f17a2cdbfa252f12', class: "map-message-icon", icon: iconName, "aria-hidden": "true" }), index.h("span", { key: '20ad46a9b1ffaf10ebe3eabb029d43f7d6d9f9f4', class: "map-message-text" }, index.h("slot", { key: '2639f290f94618fb0af88e46488f3fdac1328775', name: "message" }))), index.h("slot", { key: '6b65e022ba2bf0d536654fe2cd8030c8143186e7', name: "actions", onSlotchange: this.handleActionsSlotChange })));
+            }, role: role, "aria-atomic": "true" }, index.h("div", { key: '60c949cb3aefaa93fd6b7629bf01acc95703b742', class: "map-message-body" }, iconName && index.h("dso-icon", { key: '356030cdc790a3da2bf136283cb486e2b441c2c8', class: "map-message-icon", icon: iconName, "aria-hidden": "true" }), index.h("span", { key: '06574a33d490215fe8a941e482bf1763e8206cf0', class: "map-message-text" }, index.h("slot", { key: '12ae7620541c04ad34589023ed0a0a1d5f9413ec', name: "message" }))), index.h("slot", { key: 'a56cdf4323af5c61fe72b93b6860f99d3b187ea9', name: "actions", onSlotchange: this.handleActionsSlotChange })));
     }
 };
 MapMessage.style = mapMessageCss();

package/dist/cjs/dso-map-overlays.cjs.entry.js CHANGED Viewed

@@ -46,7 +46,7 @@ const MapOverlays = class {
         for (const ref in this.selectableRefs) {
             delete this.selectableRefs[ref];
         }
-        return (index.h("fieldset", { key: '930f973dafb8b329b93ead220ee828cc91a0235a', class: "form-group dso-checkboxes" }, index.h("legend", { key: 'f3dbb07e4e45417db260fc490e8012cc2ee5444d', class: "sr-only" }, "Kaartlagen"), index.h("div", { key: 'e12f2026648cbd6341b0954c1754a3563ac63126', class: "dso-label-container" }, index.h("span", { key: '3cf899c2f82901d691eed720b538e60f305c6d15', class: "control-label", "aria-hidden": "true" }, this.text("title"))), index.h("div", { key: '1a951fbb61b586aa6314ea62e3ed25d8b84809ed', class: "dso-field-container" }, this.overlays.map((overlay) => (index.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 ? index.h("p", { slot: "info" }, overlay.info) : null))))));
+        return (index.h("fieldset", { key: '4f86249a91b509b5bffd5856e3b4d26bb4c02692', class: "form-group dso-checkboxes" }, index.h("legend", { key: '6fcb29fd91d356fc6ff2ef1df8557766657b8407', class: "sr-only" }, "Kaartlagen"), index.h("div", { key: '84e09f79733f848c2bded8c6e6d8b63209647bc9', class: "dso-label-container" }, index.h("span", { key: 'c0defffe5a604c990003aa9a2b216b9eb2819c11', class: "control-label", "aria-hidden": "true" }, this.text("title"))), index.h("div", { key: '8eaa8b8eab82e75390ed781d46fcbe060e9b2820', class: "dso-field-container" }, this.overlays.map((overlay) => (index.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 ? index.h("p", { slot: "info" }, overlay.info) : null))))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-mark-bar.cjs.entry.js CHANGED Viewed

@@ -51,7 +51,7 @@ const MarkBar = class {
     render() {
         const current = this.current || 0;
         const totalCount = this.totalCount || 0;
-        return (index.h("div", { key: 'ff07927d93ae0d068fa8121fa69c1585f2a0114b', class: "dso-mark-bar" }, index.h("div", { key: '44a0d245a2b41b8273beb93e4a4305cdd2d7b6bc', class: "dso-mark-bar-input" }, index.h("input", { key: '2177523b24bfa60d47d1ebe47c85cf05308dfa8f', type: "text", id: "search-input", value: this.value, onInput: this.handleInput, onKeyDown: this.handleKeyDown, placeholder: " ", ref: (element) => (this.inputElement = element) }), index.h("label", { key: '39b70427cae09819a161581234ddfb1515742c42', htmlFor: "search-input" }, index.h("dso-icon", { key: 'd8968f09af42566e3f02b5f5043f93e38e317792', class: "dso-search-icon", icon: "search" }), index.h("span", { key: '9b275ee67a4f774e6e21cf5d58c45409c97970a9', class: "label-text" }, this.label)), index.h("dso-icon-button", { key: 'fb9d18b0f479cb7ddd1acadfbb8b7df46665d625', icon: "cross", variant: "tertiary", label: "Zoekopdracht legen", onDsoClick: (e) => this.handleClear(e.detail.originalEvent) })), index.h("div", { key: 'e952339d0dcbac32c76c3167202ef17f5744e331', class: "dso-button-container" }, index.h("span", { key: 'e447ef9716b9cd3560bb406654ac5a6c7536aaee', class: "divider" }), index.h("dso-icon-button", { key: '2a628dc6844f53f2c788c77225b7e9c8b4405ef1', icon: "chevron-up", variant: "tertiary", label: `Vorig zoekresultaat ${current - 1}/${totalCount}`, onDsoClick: (e) => this.handlePrevious(e.detail.originalEvent), disabled: current <= 1 }), index.h("span", { key: '6a2a9bb6601ed528836f18a92643d5c226e021e6', role: "status" }, current, "/", totalCount), index.h("dso-icon-button", { key: 'ef03f237fedff5486a2c3b17052664c49620bf2d', icon: "chevron-down", variant: "tertiary", label: `Volgend zoekresultaat ${current + 1}/${totalCount}`, onDsoClick: (e) => this.handleNext(e.detail.originalEvent), disabled: current >= totalCount }))));
+        return (index.h("div", { key: '393fb4322149f07385035b0c469d60104e2e2e2c', class: "dso-mark-bar" }, index.h("div", { key: '6a068d5d81afd76998be1de1274b3b9b4e00b287', class: "dso-mark-bar-input" }, index.h("input", { key: '04e711dacf870d1c1c27942ca835157fdaf306cf', type: "text", id: "search-input", value: this.value, onInput: this.handleInput, onKeyDown: this.handleKeyDown, placeholder: " ", ref: (element) => (this.inputElement = element) }), index.h("label", { key: 'd55d70a9f0b9877091e8d9f10dbdbf070030609d', htmlFor: "search-input" }, index.h("dso-icon", { key: '3cb2c078e4ef4ad3ca5c6a472c878a54f073e585', class: "dso-search-icon", icon: "search" }), index.h("span", { key: '20c6108b96463024cd7fe7a36641acb75fa0a193', class: "label-text" }, this.label)), index.h("dso-icon-button", { key: '1e5b5a93a8221e0df89efc596058001a7ba94c82', icon: "cross", variant: "tertiary", label: "Zoekopdracht legen", onDsoClick: (e) => this.handleClear(e.detail.originalEvent) })), index.h("div", { key: 'ba762527ba0bc9cf982547b57c3b08b8fd33fe01', class: "dso-button-container" }, index.h("span", { key: '59a4748b9826d5e6ad8aeceebb8e02b94d5607cc', class: "divider" }), index.h("dso-icon-button", { key: 'dd8d26e767227ced3b552d126540badd47c4c667', icon: "chevron-up", variant: "tertiary", label: `Vorig zoekresultaat ${current - 1}/${totalCount}`, onDsoClick: (e) => this.handlePrevious(e.detail.originalEvent), disabled: current <= 1 }), index.h("span", { key: '71bf80acfe0618b1d4eccde8a3dabc1aaf1c3503', role: "status" }, current, "/", totalCount), index.h("dso-icon-button", { key: '8ca087ddece277a402373efd730561619acb8459', icon: "chevron-down", variant: "tertiary", label: `Volgend zoekresultaat ${current + 1}/${totalCount}`, onDsoClick: (e) => this.handleNext(e.detail.originalEvent), disabled: current >= totalCount }))));
     }
 };
 MarkBar.style = markBarCss();

package/dist/cjs/dso-modal.cjs.entry.js CHANGED Viewed

@@ -91,7 +91,7 @@ const Modal = class {
         }
     }
     render() {
-        return (index.h("dialog", { key: '53c5986c4c19ff57cd1a13728917036ac1a54e8e', class: "dso-modal", 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) }, index.h("div", { key: 'f0d2f811afe1fb96140f3ef3d3b787799d0bbb06', class: "dso-dialog" }, this.modalTitle ? (index.h("div", { class: "dso-header" }, index.h("h2", { id: this.ariaId }, this.modalTitle), this.closable && (index.h("dso-icon-button", { id: "close-modal", icon: "cross", variant: "tertiary", label: this.text("close"), onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) })))) : (index.h("span", { class: "sr-only", id: this.ariaId }, this.text("dialog"))), index.h("dso-scrollable", { key: '86f6266e4048312ef5828ec27638d4b450ad488e' }, index.h("div", { key: '13c7695ee26f64f08f2c31db96093ca513064ec7', class: "dso-body", tabIndex: 0 }, index.h("slot", { key: '7f1ca48a671e38f7d05193c6ad5c1a5022102f39', name: "body" }))), this.hasFooter && (index.h("div", { key: '8a479a24c3f3f577f0a237251490d42986b949b6', class: "dso-footer" }, index.h("slot", { key: 'c9f6593a961d315008da2e67bdcabf53de423788', name: "footer" }))))));
+        return (index.h("dialog", { key: 'cb67b4f86a336a53950c58e478568b477814ab95', class: "dso-modal", 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) }, index.h("div", { key: '2fe648cf7531cfff5f2b99752f38a0022f79e368', class: "dso-dialog" }, this.modalTitle ? (index.h("div", { class: "dso-header" }, index.h("h2", { id: this.ariaId }, this.modalTitle), this.closable && (index.h("dso-icon-button", { id: "close-modal", icon: "cross", variant: "tertiary", label: this.text("close"), onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) })))) : (index.h("span", { class: "sr-only", id: this.ariaId }, this.text("dialog"))), index.h("dso-scrollable", { key: '9d29e590dd54cba08c75cd9a9a2bfa143b9d660a' }, index.h("div", { key: '25604debf3b521f6edbafe7e6fdfa55a6927635f', class: "dso-body", tabIndex: 0 }, index.h("slot", { key: '4c9048ce5787a64f3698b92763d380eb799f1066', name: "body" }))), this.hasFooter && (index.h("div", { key: '762486f200c46cf91a5ebb127f298046d9a4271d', class: "dso-footer" }, index.h("slot", { key: '37012ed27188890dc9bc9e81d9182c3b524d7759', name: "footer" }))))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-onboarding-tip.cjs.entry.js CHANGED Viewed

@@ -73,7 +73,7 @@ const OnboardingTip = class {
     }
     render() {
         const ariaLabel = this.headingSlottedElement?.textContent;
-        return (index.h(index.Host, { key: 'e7658be5736d9a5404fa0c0010a5a96b517f731b', popover: "manual", ready: this.ready, onAnimationend: () => (this.ready = true) }, index.h("div", { key: 'f3730e437d19a4bd3fe3633585ad592a4fb983c4', role: "dialog", class: "onboarding-tip", "aria-label": ariaLabel, onKeyDown: this.blockEscapeKey, tabindex: -1 }, index.h("div", { key: 'af738a7350f03f71bb8e250502e2c0abefcd970e', class: "onboarding-tip-inner" }, index.h("div", { key: 'd334491e11eb82748aaf07e22b6e5c5171130528', class: "onboarding-tip-content-wrapper" }, this.headingSlottedElement !== null && (index.h("div", { key: '823797769a24b123408afc8e59f464e3e39b7224', class: "onboarding-tip-content-heading" }, index.h("dso-icon", { key: '7ae6b3b9cf5338bee0842c31e8f7d21e7db9a9e8', icon: "light-bulb" }), index.h("slot", { key: 'a75e8936520d6412addae7cc7430cf2c8762be3a', name: "heading" }))), index.h("dso-icon-button", { key: '3aeaa82948c4e32ba451d6999bc388d68dd3aec8', class: "dso-close", label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) }), index.h("slot", { key: '88d732fe9ee04a023d3a581492352f1181e2de5b' }))), index.h("div", { key: 'fd71cca54453f15dae82cb186b6fed0a266f9ede', class: "onboarding-tip-arrow", ref: (ref) => (this.tipArrowRef = ref) }))));
+        return (index.h(index.Host, { key: 'd9ad68ce1d2aaa4d1e63d93bbf5f044fe79a6065', popover: "manual", ready: this.ready, onAnimationend: () => (this.ready = true) }, index.h("div", { key: 'e03fcc6d2946a7515b074fd80da1b84ca6521760', role: "dialog", class: "onboarding-tip", "aria-label": ariaLabel, onKeyDown: this.blockEscapeKey, tabindex: -1 }, index.h("div", { key: 'c48c487d21c9d230cb87e6c1ce3883ce022dd7e2', class: "onboarding-tip-inner" }, index.h("div", { key: '11ae979b97104b78a24e061eb781664552e3c561', class: "onboarding-tip-content-wrapper" }, this.headingSlottedElement !== null && (index.h("div", { key: '50524861a49e9810035083b6bd6d16c14fa3b767', class: "onboarding-tip-content-heading" }, index.h("dso-icon", { key: 'da5adbd9a100f928c935e5d9bdf5123daeeb7722', icon: "light-bulb" }), index.h("slot", { key: '81546e36e217e01cf9f002a3eebd767638e65110', name: "heading" }))), index.h("dso-icon-button", { key: 'e40284496194bb686beecd3554537d493bf7b2d0', class: "dso-close", label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) }), index.h("slot", { key: 'bf741cc98640f30e31e2ba8a8dadcdc605ded1c6' }))), index.h("div", { key: '29ef2c23d06044bfef7a300f3e9aa7a1b5be93c2', class: "onboarding-tip-arrow", ref: (ref) => (this.tipArrowRef = ref) }))));
     }
     get headingSlottedElement() {
         return this.host.querySelector("[slot='heading']");

package/dist/cjs/dso-plekinfo-card.cjs.entry.js CHANGED Viewed

@@ -40,7 +40,7 @@ const PlekinfoCard = class {
     }
     render() {
         const hasSymbol = this.symbolSlottedElement !== null;
-        return (index.h(index.Host, { key: 'c9246f5ad6a74a6400c065df557f4e8f2eaeafaf', "has-symbol": hasSymbol }, index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: 'c58c9df599d09f19fe6bd6da277f7adcb7b53363', wijzigactie: this.wijzigactie, class: "dso-plekinfo-card-container" }, index.h("div", { key: '20bd77e16e8031e14aa35bfd1ddc4c3fc0ebb86d', class: "dso-plekinfo-card-symbol", hidden: !hasSymbol }, index.h("slot", { key: '7e54c3202e5d1d96aac73b460cc1edc30134f6af', name: "symbol" })), index.h("div", { key: 'ab4151819bb19fbfb13248e5d48fb8d8082edf97', class: "dso-plekinfo-card-heading" }, this.href ? (index.h("a", { href: this.href, target: this.targetBlank ? "_blank" : undefined, rel: this.targetBlank ? "noopener noreferrer" : undefined, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("span", { class: "heading-content" }, index.h("slot", { name: "heading" })), "\u2060", this.targetBlank ? (index.h(index.Fragment, null, index.h("dso-icon", { icon: "external-link" }), index.h("span", { class: "sr-only" }, "(Opent andere website in nieuw tabblad)"))) : (index.h("dso-icon", { icon: "chevron-right" })))) : (index.h("slot", { name: "heading" })), this.metaSlottedElement !== null && index.h("slot", { key: 'cf2a54a33b5f33149a09e9c89b5fb0398fd46cfa', name: "meta" }), this.interaction !== null && index.h("slot", { key: 'f89bb7bb1ea86d8cb7546db659284064b519b242', name: "interaction" })), index.h("div", { key: 'a431c393a757927bbf37d1a42adc5dad2508699b', class: "dso-plekinfo-card-content" }, index.h("slot", { key: '16ed4f565514c8232737cc2b03b2b40769b298e2', name: "content" })))));
+        return (index.h(index.Host, { key: 'c1ab12e36be93a49ebe692149d39650925e92b5e', "has-symbol": hasSymbol }, index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: 'f9bc8a310b535a1571b22638efb1bd1bfcd3959d', wijzigactie: this.wijzigactie, class: "dso-plekinfo-card-container" }, index.h("div", { key: '2795caa14953cfeb26038a3ffbf435ce1e5068c5', class: "dso-plekinfo-card-symbol", hidden: !hasSymbol }, index.h("slot", { key: '0c442263fedb0c4b25a29727410b410e979e8a4f', name: "symbol" })), index.h("div", { key: 'ebfdddee6b42ee8a0dc14e05a6045d8fc250aa89', class: "dso-plekinfo-card-heading" }, this.href ? (index.h("a", { href: this.href, target: this.targetBlank ? "_blank" : undefined, rel: this.targetBlank ? "noopener noreferrer" : undefined, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("span", { class: "heading-content" }, index.h("slot", { name: "heading" })), "\u2060", this.targetBlank ? (index.h(index.Fragment, null, index.h("dso-icon", { icon: "external-link" }), index.h("span", { class: "sr-only" }, "(Opent andere website in nieuw tabblad)"))) : (index.h("dso-icon", { icon: "chevron-right" })))) : (index.h("slot", { name: "heading" })), this.metaSlottedElement !== null && index.h("slot", { key: 'e1eefab60d02942b46fcbdf0c6ec6c77a9b0a495', name: "meta" }), this.interaction !== null && index.h("slot", { key: '087bf8a7003ac5e5173464be4826d6881ce7c20a', name: "interaction" })), index.h("div", { key: '0eddac4be3ac42a2c9c5db5570714746b7c70569', class: "dso-plekinfo-card-content" }, index.h("slot", { key: '153a40dbe03f2ac79274b118c23eb431144d69db', name: "content" })))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-progress-indicator.cjs.entry.js CHANGED Viewed

@@ -24,7 +24,7 @@ const Progressindicator = class {
         this.text = i18n.i18n(() => this.host, translations);
     }
     render() {
-        return (index.h(index.Host, { key: 'a477f1ca1a98b2f5f39c080b86b25331e2a214cf' }, index.h("span", { key: '4cbfc31f0c9723d09b05405cf0ed92c98c5380ea', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, index.h("dso-icon", { key: 'f8335b7c8e6b7f4f598a30c8ebd671f8929bf50c', icon: "spinner" })), index.h("span", { key: '67fa7e3b2519dbac1bf8e60a3eb38ec4a197871f', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
+        return (index.h(index.Host, { key: '4050ddc4eebabc030edc4a17c133f4472c3f21ac' }, index.h("span", { key: 'bf00edd832b37faf232d92e83c4e7c3d1ea22fe0', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, index.h("dso-icon", { key: '1128e74891630d80fc661fc5f748110988ea1149', icon: "spinner" })), index.h("span", { key: 'a018e86d33e7838531fb02bc7468ef7c8a879a7a', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-project-item.cjs.entry.js CHANGED Viewed

@@ -9,7 +9,7 @@ const ProjectItem = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Fragment, { key: '405e7b748332dbf26f8d94c1418b62aa5fed2eaa' }, index.h("div", { key: '87516c230f1993d2f6919acc25ca892d8543000c', class: "project-item-header" }, index.h("div", { key: '239894e732ff99f1f4f284ccf760e4ecd41f5130', class: "project-item-title" }, index.h("slot", { key: '6c4fb5332371112773465d486222b77bea4858bb', name: "title" }), this.label && (index.h("dso-label", { key: '696644220895ba0671398292d2b3e78b7b56763b', status: "error", compact: true }, this.label))), index.h("div", { key: 'def9da5043556d0b0e22a709d4f3d62800c0b7b6', class: "project-item-actions" }, index.h("slot", { key: '2f40b4618484faf05d2bcb16ce4f7de635269937', name: "actions" }))), index.h("div", { key: '700947f8af44d03806c8a5ebd752693dad3dab4a', class: "project-item-info" }, index.h("div", { key: 'cb312a74fbffbde4f441d07269c26ec9f24eeca9', class: "project-item-progress" }, index.h("slot", { key: '56aadce06faa367be1e8374e4b8efefa744f9941', name: "progress" })), index.h("div", { key: '951ba20c7d39187030e93fe069fb1ec701e61b1b', class: "project-item-status" }, index.h("slot", { key: '1092d54206741c7ecb7de86b23cec3884228af60', name: "status" })))));
+        return (index.h(index.Fragment, { key: '9452fe0e52d9d8615eccbdf87232d4038d1ab627' }, index.h("div", { key: '0830293073bffadf35a51a1c6e1b67af5f07f059', class: "project-item-header" }, index.h("div", { key: '9e8265ba7179df47ba9db9b4509d87cf5c1b8bfa', class: "project-item-title" }, index.h("slot", { key: 'aa4f224f99485a15d5c40e965b681ca82325e64d', name: "title" }), this.label && (index.h("dso-label", { key: 'c02633fdd4afa8d57a8d9c1de3eb09d59e42e0a8', status: "error", compact: true }, this.label))), index.h("div", { key: '0f2e6db4c06b387117acd61471fadef12372f140', class: "project-item-actions" }, index.h("slot", { key: '9940fb727444347f92fb33127b05f09e3d358c25', name: "actions" }))), index.h("div", { key: 'fe74f95d336a502b83b2c48ff6c656d7f3742d09', class: "project-item-info" }, index.h("div", { key: 'b9cc6c764e1c0a7c1f24ecf5ad430bc06c7ef0f4', class: "project-item-progress" }, index.h("slot", { key: '0c7800cda708f810f270833e286300092f1fde32', name: "progress" })), index.h("div", { key: '1894f7c46fdda5ec870143ea44426273d4a9e3ad', class: "project-item-status" }, index.h("slot", { key: '2fca967bfe39d73888059f038fd9f61bb509e054', name: "status" })))));
     }
 };
 ProjectItem.style = projectItemCss();

package/dist/cjs/dso-responsive-element.cjs.entry.js CHANGED Viewed

@@ -46,7 +46,7 @@ const ResponsiveElement = class {
         this.observer.unobserve(this.host);
     }
     render() {
-        return (index.h(index.Host, { key: '9c763f26d6ebc58fdb47e25e0b6a1fb8738be750', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, index.h("slot", { key: '05713cd4816c505158225dbe33ab11b14e789181' })));
+        return (index.h(index.Host, { key: '038f65aa40386d2858df83dcfe773cf4aee53ab0', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, index.h("slot", { key: 'b3727cb82cb4a1086c0258f10a99804066021bb4' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-scrollable.cjs.entry.js CHANGED Viewed

@@ -111,9 +111,9 @@ const Scrollable = class {
         this.slottedElements.forEach((element) => resizeObserver.unobserve(element));
     }
     render() {
-        return (index.h("div", { key: '8ec4de1ddaf5c42074b496d9d80be4c846cd8634', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, index.h("div", { key: '895d40a03b7e555686300e8c773c0110cb352c69', ref: (el) => (this.scrollContainerDiv = el), class: clsx.clsx("dso-scroll-container", {
+        return (index.h("div", { key: 'ed3625bd1fa4bf665d8a23f9d0955552ad5af958', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, index.h("div", { key: 'ed0bbf745960e504176c928ca73c992b052a6573', ref: (el) => (this.scrollContainerDiv = el), class: clsx.clsx("dso-scroll-container", {
                 [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== "noScroll",
-            }), onScroll: () => this._setScrollState() }, index.h("slot", { key: 'fb92677ffbad663cd08bb7ced3095a7affe1945d' }))));
+            }), onScroll: () => this._setScrollState() }, index.h("slot", { key: 'b0f2331fcfd67bee198e3a754a8a9d25d6f1d852' }))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-segmented-button.cjs.entry.js CHANGED Viewed

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

package/dist/cjs/dso-skiplink.cjs.entry.js CHANGED Viewed

@@ -17,7 +17,7 @@ const Skiplink = class {
         return this.dsoSkiplinkClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent.isModifiedEvent(e) });
     }
     render() {
-        return (index.h("a", { key: '4bbe2beca1e700b7c9c690751ff7383cbd32eb22', href: `#${this.to}`, onClick: (e) => this.clickEventHandler(e) }, this.label, index.h("dso-icon", { key: 'fd89fa4d570b5902cd443646e990699bb54c18f8', icon: "chevron-right" })));
+        return (index.h("a", { key: '95c237c77ce3220dc01b274ae188c964a8d00072', href: `#${this.to}`, onClick: (e) => this.clickEventHandler(e) }, this.label, index.h("dso-icon", { key: 'cc7bc50829c74cdda12ffe51a1033993ca7e36d5', icon: "chevron-right" })));
     }
 };
 Skiplink.style = skiplinkCss();

package/dist/cjs/dso-survey-rating.cjs.entry.js CHANGED Viewed

@@ -28,10 +28,10 @@ const SurveyRating = class {
             "Makkelijk",
             "Heel makkelijk",
         ];
-        return (index.h("dso-panel", { key: '886a7873e55563734f1f92bbc16acda7444c3fd5', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, index.h("h2", { key: '1322fbf91f68d407b780874718426bce6f85a84f', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), index.h("strong", { key: '8476d2c687efb7e123fa68647a36816a890c1d6d' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), index.h("form", { key: '2d19c6840a218db161201403d416f308823a95e1', onSubmit: (e) => this.handleForm(e) }, index.h("div", { key: '89ae14ee04ca0180e4491030cf2cae5d0e128c65', class: "visual-rating-labels", "aria-hidden": "true" }, index.h("span", { key: '1a97088de2e8e5b124e1a034e173ef23aeed3395' }, "Heel moeilijk"), index.h("span", { key: '53c3a2d92e833254faa16955b835d29417309fe7' }, "Heel makkelijk")), index.h("div", { key: 'c5b5b9bc780ddcfde1349a8cf92dd3fc72bdd37f', role: "radiogroup" }, ratings.map((rating, index$1) => {
+        return (index.h("dso-panel", { key: '1677870899bb965a52c65231446680da2bd1bcd2', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, index.h("h2", { key: 'f7c31ea7cef21dad9c1cfa58a382e730ccc9447e', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), index.h("strong", { key: '4040f276b4f74426f712068e17bcac8973d24655' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), index.h("form", { key: '1ba28f0e44795ce41b86d510f0c04c59e693e487', onSubmit: (e) => this.handleForm(e) }, index.h("div", { key: '6d9b4a7ab6a468117bb2efa88494b3553862fa9e', class: "visual-rating-labels", "aria-hidden": "true" }, index.h("span", { key: '4fed647d59637e56d3f8ee5ecfa8b0ca7fe79b8e' }, "Heel moeilijk"), index.h("span", { key: '7bf78ac6e98558e6a7f6e48620f3fff910af83e1' }, "Heel makkelijk")), index.h("div", { key: '76b0ad0bf0d91a200410cc0a28660cf65d175043', role: "radiogroup" }, ratings.map((rating, index$1) => {
             const ratingNumber = index$1 + 1;
             return (index.h(index.Fragment, null, index.h("label", { class: `survey-rating-${ratingNumber}` }, ratingNumber, index.h("span", { class: "sr-only" }, rating), index.h("input", { type: "radio", name: "rating", value: ratingNumber, checked: ratingNumber === this.rating, onChange: (e) => this.handleChange(e) }))));
-        })), index.h("button", { key: 'b5d82b6b382a2c7bc376aabc460e9b9d83e0de0c', type: "submit", class: "dso-secondary" }, index.h("span", { key: '7bceeca13f9a7f589b32ae456cb1671b30d3e1c0' }, "Antwoord verzenden")))));
+        })), index.h("button", { key: '0faabc7920e2b36079dc259a59456013a752bfb0', type: "submit", class: "dso-secondary" }, index.h("span", { key: 'a72c193c90971b95cfdecc2d61ceb5f480f688a1' }, "Antwoord verzenden")))));
     }
 };
 SurveyRating.style = surveyRatingCss();

package/dist/cjs/dso-tabs.cjs.entry.js CHANGED Viewed

@@ -62,7 +62,7 @@ const Tabs = class {
         this.mutationObserver?.disconnect();
     }
     render() {
-        return (index.h(index.Host, { key: 'eda4f3cabd4f4a373ebf5e5b2fce9c5a336f4680' }, index.h("div", { key: '445a0b6a745a1f45eca44ca59def6f4557904748', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, index.h("slot", { key: 'd344d2c68cc0bd6d0abbea591a7ffa22b17dbdf7' })), index.h("div", { key: 'c17a1774b3cf81c30e07c0c8446f05d8a6e86b95', role: "tabpanel", tabindex: "0" }, index.h("slot", { key: 'c32d940c2e5fe01b67919d7253bb5d2666146f6f', name: "panel" }))));
+        return (index.h(index.Host, { key: 'b9568d7dc32c55b0b54c37b28756274bb57cbacf' }, index.h("div", { key: '314522c3eba0fb007ce5d214d309ab20a4a9e53c', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, index.h("slot", { key: '0ea47d9bd541ee8657b5c9be2f24b6f641051c17' })), index.h("div", { key: 'd7a531a6ee574d7deb3455c3f43d16f40a0faf1b', role: "tabpanel", tabindex: "0" }, index.h("slot", { key: '65e458b46fcf351079f225fb49336ffcc5dd7982', name: "panel" }))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-tijdreis-banner.cjs.entry.js CHANGED Viewed

@@ -9,7 +9,7 @@ const TijdreisBanner = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Fragment, { key: 'b65c1136049ad6b7918279ca9fa86a121a3a7229' }, index.h("dso-icon", { key: 'd43d86fe908ab5e18cb8a0c9f0250581df87cd69', icon: "clock-outline" }), index.h("slot", { key: 'cec5c61d9cb0607709a4c91ff4002096b2b5beca' }), index.h("slot", { key: '7593a8ee780a5223cfd95e94b89a515e64a96596', name: "button" })));
+        return (index.h(index.Fragment, { key: '66e8423f1014107ccb518d0dc3c81930997a65d7' }, index.h("dso-icon", { key: '39b66a7b7f7ab1f75d3b31793ba1bd40a732ea66', icon: "clock-outline" }), index.h("slot", { key: '2d0cc6f630dd371fd3f81a8372c38b79bde279ff' }), index.h("slot", { key: '5044fee1b5aa973c5fda7bbb99679acf44a946bb', name: "button" })));
     }
 };
 TijdreisBanner.style = tijdreisBannerCss();