@dso-toolkit/core 100.1.0 → 100.3.0

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

@@ -127,11 +127,11 @@ const Label = class {
         this.isTruncated = false;
     }
     render() {
-        return (index$1.h(index$1.Fragment, { key: 'c8aaaf84c416b79bb9c503ad2533ac1213f35c92' }, index$1.h("span", { key: '37ad4980bb5781c64814f1efd13d156b31f08bfd', "aria-describedby": this.isTruncated ? "toggle-anchor" : null, class: clsx.clsx("dso-label", {
+        return (index$1.h(index$1.Fragment, { key: 'b8e9c7d89bbc480af43cdc5893e13952f72c7e6f' }, index$1.h("span", { key: '39bafb744cb3b26cc4ddcc4576138c55dd371fbf', "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: '693997722133ee6d6e151e73d39f4a05ac2404be', name: "symbol" }), index$1.h("span", { key: '8831bad458c6fa2082aa2be762725f230d03ec99', 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: 'cb098c6c42929b477c4a77257d035675bcc68cdc' })), this.removable && (index$1.h("dso-icon-button", { key: '47a66249b07c099a017d61ae62c7e975dc9539d7', 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: '9efda637811c456b0d9e7290c60508c1b3c62a9b', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, index$1.h("span", { key: '9c90dc4d8d07619b2ae39883200782f3bb2f95b2', id: "toggle-anchor" }, this.labelText)))));
+            }) }, index$1.h("slot", { key: '896769d6536e6f5f9df67a713d4344331e323227', name: "symbol" }), index$1.h("span", { key: 'b25693c64cb43e3e17987cc2867e1fa93350e53f', class: "dso-label-content", ref: (element) => (this.labelContent = element), tabindex: this.truncate && this.isTruncated ? 0 : undefined, onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip }, index$1.h("slot", { key: '56f3d49f57129a73daa3116ce17006eac508b650' })), this.removable && (index$1.h("dso-icon-button", { key: '32a9fc5e25c090b1c8ce2549495421ff29943fbd', variant: "tertiary", icon: "cross", label: `Verwijder: ${this.labelText}`, onDsoClick: (e) => this.dsoRemoveClick.emit(e.detail.originalEvent), onMouseEnter: () => (this.removeHover = true), onMouseLeave: () => (this.removeHover = false), onFocus: () => (this.removeFocus = true), onBlur: () => (this.removeFocus = false) }))), this.isTruncated && (index$1.h(tooltip_functionalComponent.Tooltip, { key: '71b51d3b7d1d1dbc0ebccecb30cd3eea0edf129e', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, index$1.h("span", { key: 'b4300bc9f3d639b982774dbc93ae7e8e4e9989e4', 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: 'f29e98abd199c5131882103b2baeebd9d55715e2' }, index$1.h("button", { key: '768b778d2a35dc6fb5293c4a6947d6fb6de62239', 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: '287c4a04cc8d9bae3be93a687366f482908ce75d', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: 'e60a6542a1f33a120f5f60ef27e44bb18d999fb3', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: '62f24316cf0a6fc9d7b2bf7a3eb2ba05e355ebf3', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: '225a274cec5a2848522935d4d471d76c1383b5dc', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: 'e63be2ae88ed2c4de80410fb262cb46439679425', htmlFor: this.identifier }, index$1.h("slot", { key: 'eac4fbd7ee0590be61ef17ad4148c92ee6e35e92' })))));
+        return (index$1.h(index$1.Fragment, { key: '59bd51c2cf2fef041a14d6f36429c9d1ef402d39' }, index$1.h("button", { key: 'a517dac5407f43c1b8f93dea3604a02cd038721d', 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: '81f8037e082059f35a70b8367bbf20e441d9c41c', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: '7b7e4db0ad3ede2fd82d70d85af3b690b4ecbf43', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: '913a4d226ac9827f15c5bd09ebff103fc6f74278', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: 'fd624f981c43abf75ad39d0240d0760b998a5533', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: '18f8fe97e1350930c9887e18be8b427950bd12b1', htmlFor: this.identifier }, index$1.h("slot", { key: '5b54701ae63cff1c985fe62ed1b5b15330d1aef7' })))));
     }
     get host() { return index$1.getElement(this); }
 };

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

@@ -57,7 +57,7 @@ const LegendGroup = class {
         delete this.mutationObserver;
     }
     render() {
-        return (index.h(index.Host, { key: '972513a3527ff446324c759714755b664c058d46' }, index.h("div", { key: 'e57660d4098c734dd093cd4f78914b80950a223b', class: "legend-group-header" }, index.h("slot", { key: '165c84da0b66aad1256ef510779ac6d79495b42a', name: "heading" }), this.mode && (index.h("dso-icon-button", { key: 'a1401577f95f4192c0faea3907f77fec40df7cf2', expanded: this.mode === "edit", 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: 'f8c427b63ab20594f04d2099ec5b0f15b9bf9b20', name: "options" }), index.h("slot", { key: '97fd5268954f1a83d097c5241983de5dc7adc30e' })));
+        return (index.h(index.Host, { key: '0c5c8ed2b98857165e4c1305592dd6d4f499fb10' }, index.h("div", { key: '8101d9751bb9eaebee2b112b16fa2f648a109037', class: "legend-group-header" }, index.h("slot", { key: '0329f5bebfcd9fc20148531fe1aa1eb6dee10698', name: "heading" }), this.mode && (index.h("dso-icon-button", { key: '81b52642b60e88bfa2fedd27c9782b0def81c4d3', expanded: this.mode === "edit", 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: 'b8315aed971f456849894cb2deb0420f8756c7a0', name: "options" }), index.h("slot", { key: 'bd80f8443bcd8a420781c698b62620be34824279' })));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -89,7 +89,7 @@ const LegendItem = class {
         const accessibleLabel = label?.textContent
             ? this.text("makeActive", { label: label.textContent.toLowerCase() })
             : this.text("makeActiveDefault");
-        return (index.h(index.Host, { key: '96c288bc2a05a29ccdcedccc98f6acecfbd026e0', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h("div", { key: '6db23c1408c64bc4a9d23b3b471144f1994d8ad9', class: clsx.clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (index.h("div", { key: 'ec9771b028987abd64699d3b83e60b0bfddd376b' }, index.h("slot", { key: '3ee11e76025eb944b55964c0a8dfc893e38d3e02', name: "symbol" }))), index.h("div", { key: '788c1f3648e2d219dc0b83c63f3fa1f8e236311e' }, index.h("slot", { key: '08bade4380497521a1c26bb899bd2c9110b95b60', name: "label" })), this.disabled && this.disabledMessage && (index.h("dso-info-button", { key: '58553661c55719f42efdb8a56993409616caf2a9', label: this.text("disabledInfo"), toggletipPlacement: "bottom" }, index.h("div", { key: '9120418ffd42d721a9746c96e44ed816bc460ac3', slot: "toggletip" }, this.disabledMessage))), index.h("div", { key: '09a3b392fd78db4debf28614386ab75ecf7940fd', class: "legend-item-right-content" }, this.renderRightContent(hasOptions, accessibleLabel))), hasOptions && (index.h("div", { key: 'd76e964708ccbb0388c7642c2d89080b73cb626c', hidden: this.disabled || !this.showOptions, class: "options" }, index.h("slot", { key: 'a5b5a219f1888c0e9f9775948a05951eb65afa6e', name: "options" })))));
+        return (index.h(index.Host, { key: 'cf2ba73234d81ab540bab9f297b6ea6547b16ba5', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h("div", { key: '7d6c1a3930cf5f2e2f25a3ad3334b585d5dc6dcf', class: clsx.clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (index.h("div", { key: 'fae34ebd6b2d0210584a3a943639667cd4e69e0f' }, index.h("slot", { key: 'b9cf91cacbd691e6d5c47e923d6bcb2aa9452763', name: "symbol" }))), index.h("div", { key: 'b7594fb8c0cc59bf4bb5fbc3589566129f872343' }, index.h("slot", { key: '077e25820ab130278ed55c9c271ae814bd989846', name: "label" })), this.disabled && this.disabledMessage && (index.h("dso-info-button", { key: 'e66c403d7fffcea66c96007b8a3293a653072ae8', label: this.text("disabledInfo"), toggletipPlacement: "bottom" }, index.h("div", { key: '4c52766e23155bf9410f4a83f39d620829bc54f5', slot: "toggletip" }, this.disabledMessage))), index.h("div", { key: '69c49eae23d674bcf821e0aebb92e2f89f2a34c4', class: "legend-item-right-content" }, this.renderRightContent(hasOptions, accessibleLabel))), hasOptions && (index.h("div", { key: '8267b3ced009d8749551adce9d185a07ba37ffed', hidden: this.disabled || !this.showOptions, class: "options" }, index.h("slot", { key: '9ed9f1e29b2e7b3aee08c0322187d2210ec0bf57', name: "options" })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -83,7 +83,7 @@ const Legend = class {
         this.moveFocusToTab(next);
     }
     render() {
-        return (index.h(index.Host, { key: 'e3c401a8383f8a7d49e3c24a2fb867708d273160' }, index.h("div", { key: '4b5d88165bd72e787a9f460783b6425e508be284', class: "topbar" }, index.h("div", { key: '5be1da490bfec24e343c8f9b8fae04ffde3030bc', 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: '99fc969adf5e175d028dea9bd9ca8a5f53d9683f', 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: '36aef539953b9c77d06ef4d56be9edd28712680a', class: "content" }, index.h("div", { key: '86c411c4317d58a0d7619b4843481ba62bbc9a29', role: "tabpanel", tabIndex: 0 }, index.h("slot", { key: '103898f6b19175467aa1b5ae581e473ede40e475' })))));
+        return (index.h(index.Host, { key: '2a5891a256689f74a99988139f6a6f09ebaa0436' }, index.h("div", { key: '105c393b0222591a15b1ab7008bcd9ad7fa393d0', class: "topbar" }, index.h("div", { key: 'c85066bef770163fead800cf6501ef6821e02ed7', 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: '3587b3d41e49b1af84b95c3e5440aecc34f48bf7', 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: 'deb31a9ad5df1e5d234bbd3459308f46330de03d', class: "content" }, index.h("div", { key: '769bb6d26dd18067b8a852fd9fcae761ccacc749', role: "tabpanel", tabIndex: 0 }, index.h("slot", { key: '290b3490e8331849e3c54b1990ab6e249b730416' })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -81,7 +81,7 @@ const ListButton = class {
     }
     render() {
         const selected = this.checked || (this.count !== undefined && this.count > 0);
-        return (index.h("div", { key: '153f81aaebcc43d329b0754cd1dfb419047f1f01', class: clsx.clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, index.h("div", { key: 'b82cc312ea619bfa5c9b34cb685dc1ee1ffca883', 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: '2bcf18e6df5ef06ce90a27b0052c30411ca418a3', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, index.h("span", { key: 'ea085ef94d417392ce2d3211a0c672e6b0062e82' }, this.label, this.sublabel && index.h("span", { key: 'a3ca738b8cbca4780c8948f178949430a73a72a9', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (index.h("span", { key: '6cb97ebad7e7bfc255d2d07b65b3fc0c808952cd', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", index.h("span", { key: 'e10862fea3a1f2ddf34d806efb53c21cd9b4875d', innerHTML: this.subcontentSlot.innerHTML }))))), this.sublabel && index.h("span", { key: '8d58404dec7106a74724e82907bba9d266cbf827', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (index.h("div", { key: 'be58d054304afe3f4ff25a01be6dc62b5dc02625', class: "subcontent" }, index.h("slot", { key: 'f687bb398c00eeeb1a9a3dae9b0889ad3191bd90', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (index.h("div", { key: 'db5fa3acdc29926126a551209c845cc88792fa20', class: "dso-input-number" }, this.count > 1 && (index.h(index.Fragment, { key: 'bc7e479638e8bb6f914bf30214b92d6e0cada0c0' }, index.h("dso-icon-button", { key: 'cde2f55d393c6d08de9173db3612e5339b7cafa1', 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: 'ca73568daca7e1d3641b9d711edb6bf37de28a64', class: "dso-input-step-counter", "aria-hidden": "true" }, this.count))), index.h("span", { key: '1096574e37502033f05572fcfc74c0120cd8b251', class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.count), index.h("dso-icon-button", { key: 'ee584967f4284defe68a7d9fb6d6c10cb75f0f99', ref: (element) => (this.incrementButton = element), 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: 'c1cb480adf856abf458fa97ef9cfce6e91f88e69', class: clsx.clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, index.h("div", { key: 'a977a5e752a7ceed7ae344a0448a2eac0bab1080', 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: '32b615286583097d07f02e232e43dc36f03188fe', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, index.h("span", { key: 'a949902f3b25e368d04ed4313d8470f4782c9520' }, this.label, this.sublabel && index.h("span", { key: '54c591db56e96580a9d8e21a8f9de3cbc79f1cd9', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (index.h("span", { key: '728d964c6ff8395ced280ae7c51ccffa445b206f', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", index.h("span", { key: 'b8a7d9d25e3b5c5c2aeeb7ca13b4e0425936177a', innerHTML: this.subcontentSlot.innerHTML }))))), this.sublabel && index.h("span", { key: '5c0fba224e8839cdc7128675166ceb2aa60a35f9', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (index.h("div", { key: 'b5514961f164613889d9942f429f4ba465efa332', class: "subcontent" }, index.h("slot", { key: '0560f14f30b4256694897bd377abf051bcc00867', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (index.h("div", { key: '0106a50a278b36f4213e4f2d1ceee6f50d6e50c9', class: "dso-input-number" }, this.count > 1 && (index.h(index.Fragment, { key: 'd81c570ce3df18d60e679ffdf211afe0b563ee90' }, index.h("dso-icon-button", { key: '2fd109d7a00986dec96a286f68f682d70ca4f7e0', 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: '896bc44db25fb4b522dc6de1cc42669731c53ded', class: "dso-input-step-counter", "aria-hidden": "true" }, this.count))), index.h("span", { key: 'db37d83a50d95c314e377741f99c9d9b9733af2b', class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.count), index.h("dso-icon-button", { key: '0d110403d523652f984f3d8f7fd6c31ab9105d81', ref: (element) => (this.incrementButton = element), 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

@@ -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: '2c4662854741d591e3a13ecdbc3506320e16d92d', 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: 'e2bf82278fd38d8884bb01abe29115eb91572003', class: "logo-ribbon" }, this.ribbon)));
     }
 };
 Logo.style = logoCss();

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

@@ -45,7 +45,7 @@ const MapBaseLayers = class {
         for (const ref in this.selectableRefs) {
             delete this.selectableRefs[ref];
         }
-        return (index.h("fieldset", { key: 'fc725366824a2bfbecc6b3b54a9d66189897788d', class: "form-group dso-radios" }, index.h("legend", { key: 'a5e7265492ee924e04bc784c57f26e474f0c4c21', class: "sr-only" }, "Achtergrond"), index.h("div", { key: '344f1765eefba53c5d4a8c25d0f1853359e5029b', class: "dso-label-container" }, index.h("span", { key: 'f2de7cae48c08e0487ad8f1cd45a1f72def76858', class: "control-label", "aria-hidden": "true" }, this.text("background"))), index.h("div", { key: 'c5dfd3492af5de39d9e718c2df24393e5069dc16', 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: 'e425e935b243e71462dcb3535e910a9645eae330', class: "form-group dso-radios" }, index.h("legend", { key: '1a5ea9c979247717b94ca98af40eaddfedd690f5', class: "sr-only" }, "Achtergrond"), index.h("div", { key: '359e5063faa16d1537e04e9721b8a056f28bd39a', class: "dso-label-container" }, index.h("span", { key: '99b0f11dc70cae6d87fca2301f20fd0bf9fda4da', class: "control-label", "aria-hidden": "true" }, this.text("background"))), index.h("div", { key: 'efb9958a4e54060e4ad5c4b3ca85d4413204acc7', 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

@@ -131,7 +131,7 @@ const MapControls = class {
         this.clearPostTransitionTimeout();
     }
     render() {
-        return (index.h(index.Fragment, { key: '9d6ee4396cb3e93e4dcd6387ed423c5b56bb060b' }, index.h("dso-icon-button", { key: 'ad7ebb061a22ae2b414473326f1c23608fbe7f6c', expanded: this.open, label: this.text("layersButton"), icon: "layers", variant: "map", "aria-controls": __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f"), tooltipPlacement: "left", class: "toggle-visibility-icon-button", onDsoClick: (e) => this.toggleVisibilityInternal(e.detail.originalEvent, __classPrivateFieldGet(this, _MapControls_toggleIconButtonElement, "f")), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleIconButtonElement, element, "f")) }), index.h("button", { key: 'ef99763dee19cac7b718b75556dfce20005232d9', type: "button", class: "dso-map toggle-visibility-button", "aria-controls": __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f"), "aria-expanded": this.open ? "true" : "false", onClick: (e) => this.toggleVisibilityInternal(e, __classPrivateFieldGet(this, _MapControls_toggleButtonElement, "f")), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleButtonElement, element, "f")) }, index.h("dso-icon", { key: '74bf4db4f2a05d5cb2b4f89df7cb53a60b2ef106', icon: "layers" }), index.h("span", { key: 'cdcffb339c2c6ff0c20901dd2ca02fce5a960ea2' }, this.text("layersButton"))), index.h("dso-button-group", { key: 'cbc288e14fea237073b74b6c083738f8c5c1680f', class: "zoom-buttons", direction: "column" }, index.h("dso-icon-button", { key: 'e659c2746a2ea3e8c2f13f2f3793047066125a81', 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: '68a28a57c20e14deebabbefab089994bd3151f9a', 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: '029a667be45b3587483ab76d851921e12b453666', id: __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f"), hidden: this.hideContent, role: "region", onKeyDown: this.handlePanelKeyDown, "aria-labelledby": __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f") }, index.h("header", { key: '6aeae301582eeef11bd525433b8fb3f778810c25' }, index.h("h2", { key: 'b141d0eb41bf774a423af275d5c006659a6d395b', id: __classPrivateFieldGet(this, _MapControls_mapLayersTitleId, "f"), tabIndex: -1 }, this.text("title")), index.h("dso-icon-button", { key: 'e8b3033cc1dd2d9c141f8c8110388b88327fe962', 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_closeIconButtonElement, element, "f")) })), index.h("dso-scrollable", { key: '148768df00d681ef3f813f86e1b24b46726d5b97' }, index.h("div", { key: 'f720aca044f1b8aa534956975e91a725219307c5', class: "content" }, index.h("slot", { key: 'e10cff3a91a873e7ecca2e55cbbce6b410ba7416' }))))));
+        return (index.h(index.Fragment, { key: '176eb3490fa804bf820ba62eabc958fa3121969a' }, index.h("dso-icon-button", { key: 'a4338fbf9f2c68ede925282b9b26de4c74c67cb6', expanded: this.open, label: this.text("layersButton"), icon: "layers", variant: "map", "aria-controls": __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f"), tooltipPlacement: "left", class: "toggle-visibility-icon-button", onDsoClick: (e) => this.toggleVisibilityInternal(e.detail.originalEvent, __classPrivateFieldGet(this, _MapControls_toggleIconButtonElement, "f")), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleIconButtonElement, element, "f")) }), index.h("button", { key: '688789be1dd85bbb24d9ba4380541c758a4f2318', type: "button", class: "dso-map toggle-visibility-button", "aria-controls": __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f"), "aria-expanded": this.open ? "true" : "false", onClick: (e) => this.toggleVisibilityInternal(e, __classPrivateFieldGet(this, _MapControls_toggleButtonElement, "f")), ref: (element) => (__classPrivateFieldSet(this, _MapControls_toggleButtonElement, element, "f")) }, index.h("dso-icon", { key: 'f28aecdddcba133081cb56a2e6ce0c4799bcb4f1', icon: "layers" }), index.h("span", { key: '1da6100ff42a3c4ec7ca5dd722537394d957ef2a' }, this.text("layersButton"))), index.h("dso-button-group", { key: 'e5f3f64d78550dc3825df219436f88064959dbf8', class: "zoom-buttons", direction: "column" }, index.h("dso-icon-button", { key: 'e0e877989d55f81938ef3d690296b58310347d4c', 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: '4d0790308006b5390d4371b8c8234fcf5f58873b', 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: '3686ab9414e031daf0e5a47e8b8ba40796d1f27a', id: __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f"), hidden: this.hideContent, role: "region", onKeyDown: this.handlePanelKeyDown, "aria-labelledby": __classPrivateFieldGet(this, _MapControls_mapLayersPanelId, "f") }, index.h("header", { key: '296fabb057a43182a1c3e300964de49809512bd2' }, index.h("h2", { key: '4a87864c1c64f83d166ba708f8e3c2d01dd2ea26', id: __classPrivateFieldGet(this, _MapControls_mapLayersTitleId, "f"), tabIndex: -1 }, this.text("title")), index.h("dso-icon-button", { key: '7ec884c56d4e62ce01ccee04de343e42a79b4ffd', 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_closeIconButtonElement, element, "f")) })), index.h("dso-scrollable", { key: '8c1a21aeefcf260029980c051f64034e7c52da03' }, index.h("div", { key: '25c1977876633962ece4e3f038306f13cfdce17d', class: "content" }, index.h("slot", { key: '192a0ef47e4fb13bc6a90991c7315073edb33312' }))))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -20,7 +20,7 @@ const MapLayerObject = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: '4216426f3f863d225fd89f181debdab0999906eb', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: 'c81acbdfb183641d49af07d25e277cf46f089c13', wijzigactie: this.wijzigactie }, index.h("div", { key: 'fa255080ae12b99bf1443e03e7a646c7c13bcc16', class: "map-layer-object" }, index.h("div", { key: 'bee9848afcb4649c9ffe19bdf43063064bfeb05a' }, index.h("slot", { key: 'c6ca637b8b1adb02c235abada86d62d6ac841779', name: "symbol" })), index.h("div", { key: '04401ab4d201e308a4e7655d81bb0a513368102a', class: "map-layer-object-heading" }, index.h("slot", { key: '4c7d71b69a2d1bfa279cb444be9b9d4f293570ce' }), index.h("slot", { key: '07eb1f93be72bcd2a99fffb263fd1ac8abe37138', name: "label" })), index.h("div", { key: '46ad5ec5eacabec9427b0fce0755f7e4581a2366', class: "slide-toggle-container" }, index.h("dso-slide-toggle", { key: '4b521c9ee95bb59701c1addf070ce1799a1103ad', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange }))))));
+        return (index.h(index.Host, { key: 'c2986a38a4d0ae58dd37466511473ac90a48a2ad', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: '001fe5950e05c5457fce77320903282eda74ec6b', wijzigactie: this.wijzigactie }, index.h("div", { key: '2f008c8b8d9c7e159405cc3153092f3635ee513f', class: "map-layer-object" }, index.h("div", { key: 'b1c3d259022c4d4707c6b3ae9f2d8f01b6c60d2c' }, index.h("slot", { key: '7e94226e6b690d34d21bf076f628c4c2c441b6f8', name: "symbol" })), index.h("div", { key: '41596492e5780833e130ee16b851f1abc3de9ead', class: "map-layer-object-heading" }, index.h("slot", { key: '09363aa3c48f9536c6a6933e074f0c8f97b70a7f' }), index.h("slot", { key: '2cb5adaab884af9a161761b63509450d23757f5c', name: "label" })), index.h("div", { key: '26cdc8fd677a54b59d9d306885e982ae61d0d19d', class: "slide-toggle-container" }, index.h("dso-slide-toggle", { key: '2e3891a8685a8c101d77cd913f06aea7bc0be080', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange }))))));
     }
 };
 MapLayerObject.style = mapLayerObjectCss();

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

@@ -23,7 +23,7 @@ const MapLayer = class {
         };
     }
     render() {
-        return (index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: '60d851a5af1013001cb76e40b80a029d4a5fc46d', wijzigactie: this.wijzigactie }, index.h("div", { key: 'c79f082e7e7c6701a8be991b5b766db3d1bf7b61', class: "map-layer" }, index.h("div", { key: '142092c503ea096befd5254d4f81a73d91883dbb', class: "map-layer-heading" }, index.h("slot", { key: 'bed1c5d041ade7d76121843ae91eac59c23cffb4', name: "name" }), index.h("slot", { key: '5f114102e02a6643d82527d905a8a6c2cd48d331', name: "label" })), this.activatable && (index.h("div", { key: 'b90c295b108cbad39bf524259a0fc5bd19f95ee9', class: "slide-toggle-container" }, index.h("dso-slide-toggle", { key: 'f5fb426eb1df99d0ab1729da40f9a65de954fd44', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange })))), index.h("slot", { key: 'cd5a62a875e20bd1cde8e4dfcb20bfebcc72b4a1' })));
+        return (index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: 'dabc7956105012afdc118aaaba99a250bccc69f5', wijzigactie: this.wijzigactie }, index.h("div", { key: '82b7a6aac12f3b5a3db3e8bb267cc5d1534543f3', class: "map-layer" }, index.h("div", { key: 'b0eec8d4e2e869cc713f3c7e1eabf11bc4954587', class: "map-layer-heading" }, index.h("slot", { key: 'b671a44962f9f7b57e0daad171173ba2ebff6d46', name: "name" }), index.h("slot", { key: '39fa02704cd5afb9fb4c49acc29a88a24432a588', name: "label" })), this.activatable && (index.h("div", { key: '72544e930e67018c299eb2c7f3d8a774326eabef', class: "slide-toggle-container" }, index.h("dso-slide-toggle", { key: 'c3404bd4c33d67e8d9e71dd13e0b24a55341aef4', accessibleLabel: "Toon op kaart", checked: this.active, onDsoActiveChange: this.handleActiveChange })))), index.h("slot", { key: '1efa5bbf9d5b1c2698d95037ab4db390f40d89e4' })));
     }
 };
 MapLayer.style = mapLayerCss();

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

@@ -12,6 +12,10 @@ const MapMessage = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.hasActions = false;
+        // Een screenreader leest alleen wijzigingen voor binnen een live region die al in de
+        // accessibility tree staat. Dit component komt samen met zijn melding de DOM in, dus
+        // rendert de region eerst leeg en volgt de melding daarna.
+        this.showMessage = false;
         this.handleActionsSlotChange = (event) => {
             const target = event.target;
             if (target instanceof HTMLSlotElement) {
@@ -19,14 +23,36 @@ const MapMessage = class {
             }
         };
     }
+    connectedCallback() {
+        this.showMessage = false;
+    }
+    componentDidRender() {
+        if (!this.showMessage && this.animationFrame === undefined) {
+            // De browser werkt de accessibility tree gebatcht bij; vallen lege region en melding in
+            // dezelfde batch, dan blijft de screenreader stil. Eén render-tick afstand bleek te kort
+            // (NVDA, #3943); twee animatieframes is de kleinste afstand die betrouwbaar werkt.
+            this.animationFrame = requestAnimationFrame(() => {
+                this.animationFrame = requestAnimationFrame(() => {
+                    this.animationFrame = undefined;
+                    this.showMessage = true;
+                });
+            });
+        }
+    }
+    disconnectedCallback() {
+        if (this.animationFrame !== undefined) {
+            cancelAnimationFrame(this.animationFrame);
+            this.animationFrame = undefined;
+        }
+    }
     render() {
         const iconName = this.variant ? iconMap[this.variant] : undefined;
         const role = this.variant === "error" ? "alert" : "status";
-        return (index.h("div", { key: '25841279245a46c78d06c179ed80df66582f0008', class: {
+        return (index.h("div", { key: '2a1ed36c4d2c66dec11f63df390e6d3cb7e5556a', class: {
                 "map-message-content": true,
                 "has-icon": iconName !== undefined,
                 "has-actions": this.hasActions,
-            }, role: role, "aria-atomic": "true" }, index.h("div", { key: '7c8e851c402259060d5d310392f9bc6d9ff24acb', class: "map-message-body" }, iconName && index.h("dso-icon", { key: '1711c92092ef3462b96650cfad487551c399a586', class: "map-message-icon", icon: iconName, "aria-hidden": "true" }), index.h("span", { key: 'abec1d334734f12f87ec5e54254f57b376072787', class: "map-message-text" }, index.h("slot", { key: '09e75a6fb96ee9413bf79e86fb34e3e22c8519db', name: "message" }))), index.h("slot", { key: 'a3133aa9fd782e00609ffb4bfe87ee86c36835a3', name: "actions", onSlotchange: this.handleActionsSlotChange })));
+            } }, index.h("div", { key: '18077458efb83b281215a46cd8f760322192d53f', class: "map-message-body", role: role, "aria-atomic": "true" }, iconName && index.h("dso-icon", { key: 'bcc78d0e0e651e0e00b18e308aa28793ed6b9b38', class: "map-message-icon", icon: iconName, "aria-hidden": "true" }), index.h("span", { key: '5f86287d9b2838951ea31ab9a2e61e2becc60d19', class: "map-message-text" }, this.showMessage && index.h("slot", { key: '281b4d02fc58f8e14abb8f86e073cf7fbbeae8f6', name: "message" }))), index.h("slot", { key: 'a7bfb812c4e8762d385a111ba8fd55bb8e5185d5', name: "actions", onSlotchange: this.handleActionsSlotChange })));
     }
 };
 MapMessage.style = mapMessageCss();

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

@@ -46,7 +46,7 @@ const MapOverlays = class {
         for (const ref in this.selectableRefs) {
             delete this.selectableRefs[ref];
         }
-        return (index.h("fieldset", { key: '9cfae60111a9bc482572d9ddc3b1d2c59cd872d4', class: "form-group dso-checkboxes" }, index.h("legend", { key: '1e475d5d74ff3b659cc745831196fee8c1fd33bc', class: "sr-only" }, "Kaartlagen"), index.h("div", { key: 'd71f811d035775c27d67cb46f3111220b7aab037', class: "dso-label-container" }, index.h("span", { key: '4d613d4d2e112adccbdbf76597bf393c6858923f', class: "control-label", "aria-hidden": "true" }, this.text("title"))), index.h("div", { key: '3f83e3d58ca7704cdde1d0ae0be7dba25a00046f', 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: '6b5021cbdb21815755684e4bd5cb973fb89d5c43', class: "form-group dso-checkboxes" }, index.h("legend", { key: '17355dd3e9b2d4aa9b4b441daf67e3ae30d48e71', class: "sr-only" }, "Kaartlagen"), index.h("div", { key: 'f120e660798dd5a5829c0764c4809e1d8e5c2f10', class: "dso-label-container" }, index.h("span", { key: '8e827dc9f5e77196987e76665d46cb011c6e1a55', class: "control-label", "aria-hidden": "true" }, this.text("title"))), index.h("div", { key: 'b7ec4c229edbfd5517c3db5bd92e38dd780bd0a8', 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

@@ -51,7 +51,7 @@ const MarkBar = class {
     render() {
         const current = this.current || 0;
         const totalCount = this.totalCount || 0;
-        return (index.h("div", { key: 'dafacd14ea816b9512b2511fd999854d9fad8d12', class: "dso-mark-bar" }, index.h("div", { key: '7819a7ff103741b51d13fa35225a63c47fb853da', class: "dso-mark-bar-input" }, index.h("input", { key: 'b51bbe2fd496188dbda47e4021fa6ddea7e33086', type: "text", id: "search-input", value: this.value, onInput: this.handleInput, onKeyDown: this.handleKeyDown, placeholder: " ", ref: (element) => (this.inputElement = element) }), index.h("label", { key: 'be835099cf10bb02179cc2a4b6e18490d7622428', htmlFor: "search-input" }, index.h("dso-icon", { key: '8730c96b5637396bd9ecc97dd868a139a3d60f08', class: "dso-search-icon", icon: "search" }), index.h("span", { key: 'f8a532a770cf52862f5e19abdd60c9a11b302e8c', class: "label-text" }, this.label)), index.h("dso-icon-button", { key: '1cd84ac5915c8aaac1f0de44135f50947b44e57b', icon: "cross", variant: "tertiary", label: "Zoekopdracht legen", onDsoClick: (e) => this.handleClear(e.detail.originalEvent) })), index.h("div", { key: 'c02a8f030cd9dc76c099c48f840eb9bb8e4017a0', class: "dso-button-container" }, index.h("span", { key: 'fc24cc939f698fefa6d6d5d53255c0d126fa8369', class: "divider" }), index.h("dso-icon-button", { key: '17f072d722b9d703786ed72ae24eded2b25c4539', 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: '0017a76062b3406c66dbb76931d797a2b488fe33', role: "status" }, current, "/", totalCount), index.h("dso-icon-button", { key: 'bfd05d3e830fc30a8c55cc66ef69be2911890866', 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: 'd0403d770c0c696d43e7a2525c1328857cb09148', class: "dso-mark-bar" }, index.h("div", { key: '9908a940c4e0a09819424af36d02c5b5186d07e9', class: "dso-mark-bar-input" }, index.h("input", { key: '1bc8bc4607753482a47ad4e324416f417de9ca88', type: "text", id: "search-input", value: this.value, onInput: this.handleInput, onKeyDown: this.handleKeyDown, placeholder: " ", ref: (element) => (this.inputElement = element) }), index.h("label", { key: 'b10cff666d1c34d7f7de34db686d79bb341b3bf4', htmlFor: "search-input" }, index.h("dso-icon", { key: '6aa4f5dee79e3233611880ef559140bc5459e84a', class: "dso-search-icon", icon: "search" }), index.h("span", { key: 'e422f197d16febb56eefdf14b65751d1552963bd', class: "label-text" }, this.label)), index.h("dso-icon-button", { key: '0132cbda8ea2e38c3022df1e141d42eedc49ee2a', icon: "cross", variant: "tertiary", label: "Zoekopdracht legen", onDsoClick: (e) => this.handleClear(e.detail.originalEvent) })), index.h("div", { key: '04c24df32c474fa74f85b007364c26951e92a5bb', class: "dso-button-container" }, index.h("span", { key: '1ae811e96af1d04497fe3705ea2f96b712586628', class: "divider" }), index.h("dso-icon-button", { key: '43b2fd7c5a78b4a999db049c412193e871b01714', 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: '5fab96df21cf08c618787e446251744a37cc0910', role: "status" }, current, "/", totalCount), index.h("dso-icon-button", { key: '71931ffd8584c8d1fc8faf4193c4c02bbd832b2f', 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

@@ -112,7 +112,7 @@ const Modal = class {
         }
     }
     render() {
-        return (index.h("dialog", { key: '39b0faca17e1b2ecb01bfe655a45bd818e1029ce', class: clsx.clsx("dso-modal", { fullscreen: this.fullscreen }), role: this.dialogRole ?? undefined, "aria-modal": "true", "aria-labelledby": this.ariaId, ref: (element) => (this.htmlDialogElement = element), onMouseDown: (e) => this.handleDialogMouseDown(e), onMouseUp: (e) => this.handleDialogMouseUp(e), onClick: (e) => this.handleDialogClick(e), onKeyDown: (e) => this.blockEscapeKey(e) }, index.h("div", { key: 'fd189c17664c0e0215190d7daa14074bd319a23c', class: "dso-dialog" }, this.narrowView ? (index.h("dso-scrollable", { class: "narrow" }, index.h("div", { class: "modal-scrollable" }, index.h(Header, { modalTitle: this.modalTitle, closable: this.closable, ariaId: this.ariaId, text: this.text, dsoClose: this.dsoClose }), index.h(Body, null), this.hasFooter && index.h(Footer, null)))) : (index.h(index.Fragment, null, index.h(Header, { modalTitle: this.modalTitle, closable: this.closable, ariaId: this.ariaId, text: this.text, dsoClose: this.dsoClose }), index.h("dso-scrollable", null, index.h(Body, null)), this.hasFooter && index.h(Footer, null))))));
+        return (index.h("dialog", { key: '5ab02472ddbd1dca5ae9eb1d96dec73bf0fbed15', class: clsx.clsx("dso-modal", { fullscreen: this.fullscreen }), role: this.dialogRole ?? undefined, "aria-modal": "true", "aria-labelledby": this.ariaId, ref: (element) => (this.htmlDialogElement = element), onMouseDown: (e) => this.handleDialogMouseDown(e), onMouseUp: (e) => this.handleDialogMouseUp(e), onClick: (e) => this.handleDialogClick(e), onKeyDown: (e) => this.blockEscapeKey(e) }, index.h("div", { key: 'eb3bba348fd18f9fd45a5967785499f751042a23', class: "dso-dialog" }, this.narrowView ? (index.h("dso-scrollable", { class: "narrow" }, index.h("div", { class: "modal-scrollable" }, index.h(Header, { modalTitle: this.modalTitle, closable: this.closable, ariaId: this.ariaId, text: this.text, dsoClose: this.dsoClose }), index.h(Body, null), this.hasFooter && index.h(Footer, null)))) : (index.h(index.Fragment, null, index.h(Header, { modalTitle: this.modalTitle, closable: this.closable, ariaId: this.ariaId, text: this.text, dsoClose: this.dsoClose }), index.h("dso-scrollable", null, index.h(Body, null)), this.hasFooter && index.h(Footer, null))))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -73,7 +73,7 @@ const OnboardingTip = class {
     }
     render() {
         const ariaLabel = this.headingSlottedElement?.textContent;
-        return (index.h(index.Host, { key: '5c0cd11775c061c504bd7e2cec6d2381882af4fb', popover: "manual", ready: this.ready, onAnimationend: () => (this.ready = true) }, index.h("div", { key: 'e55bbecc565577f2ca8e4b3485b2aca542d997f1', role: "dialog", class: "onboarding-tip", "aria-label": ariaLabel, onKeyDown: this.blockEscapeKey, tabindex: -1 }, index.h("div", { key: '490586f0aac540a18518584c9fca5d2661695992', class: "onboarding-tip-inner" }, index.h("div", { key: '9f11afb09eb86a828f353546a234f6f4c63a9792', class: "onboarding-tip-content-wrapper" }, this.headingSlottedElement !== null && (index.h("div", { key: '2eac0fed6658e2c3cadf74bdd8c46fbcc66f9e5a', class: "onboarding-tip-content-heading" }, index.h("dso-icon", { key: '92884e49128c478e0f05b7815b7884b5890f1bd9', icon: "light-bulb", "aria-hidden": "true" }), index.h("slot", { key: '017d2fa43397e05066bc95f8c3f890745d32cc08', name: "heading" }))), index.h("dso-icon-button", { key: 'a5f29b63450c4567a0bd4590f652e2be97e2fdb2', class: "dso-close", label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) }), index.h("slot", { key: 'dd55b81e8c9a0964a27c3cdc717aaf88b2b3a1b9' }))), index.h("div", { key: '01d86e851f71da393edd8acc4614cb5488a53776', class: "onboarding-tip-arrow", ref: (ref) => (this.tipArrowRef = ref) }))));
+        return (index.h(index.Host, { key: '008beb10763a313f7c8eb5ff5b50ced5955f6bed', popover: "manual", ready: this.ready, onAnimationend: () => (this.ready = true) }, index.h("div", { key: '60f7b743a1ba57b391fc824ceed2ffadbe351087', role: "dialog", class: "onboarding-tip", "aria-label": ariaLabel, onKeyDown: this.blockEscapeKey, tabindex: -1 }, index.h("div", { key: 'f377098c52756ff0e898c7a7938fd9fa97fcbb0c', class: "onboarding-tip-inner" }, index.h("div", { key: '1ae47730b06e94970934a7f9a0ff93ba66852d63', class: "onboarding-tip-content-wrapper" }, this.headingSlottedElement !== null && (index.h("div", { key: 'e3b97de099f164ffa4d929b7cf7f16ebdf44a9bf', class: "onboarding-tip-content-heading" }, index.h("dso-icon", { key: '2b94028f318ee078fd128d486e228a0dba4844e3', icon: "light-bulb", "aria-hidden": "true" }), index.h("slot", { key: '21b4b5535e7e10cf8602d95836b70f598bcb5d7e', name: "heading" }))), index.h("dso-icon-button", { key: '93394a8db1fc8b6167f5cf7f9aa388c75a02a036', class: "dso-close", label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit({ originalEvent: e }) }), index.h("slot", { key: 'a32b00deb409b417ffbcb72ae2eaa764adf89f6a' }))), index.h("div", { key: 'ac92c15f359dec9f59f58c2f7d2a5f2dcdef10dd', 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

@@ -40,7 +40,7 @@ const PlekinfoCard = class {
     }
     render() {
         const hasSymbol = this.symbolSlottedElement !== null;
-        return (index.h(index.Host, { key: '437d4a33a0e211aadf0dc8bcbc7a496da9397248', "has-symbol": hasSymbol }, index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: '9f1fd4476439c0ef2615ef833d72c616f1cc6a93', wijzigactie: this.wijzigactie, class: "dso-plekinfo-card-container" }, index.h("div", { key: 'b94b3600602cdeaf62bc27db494e9f072ecb1e32', class: "dso-plekinfo-card-symbol", hidden: !hasSymbol }, index.h("slot", { key: '0baef3101fbc038d44bedb0ba8b088f4d60c57e3', name: "symbol" })), index.h("div", { key: 'bdb88b0aa83edf3290dc6caf9a37f46a46aec59c', 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: 'b8f6cf68630a0f47c1fa359c840428693686bc62', name: "meta" }), this.interaction !== null && index.h("slot", { key: '7b161f07954e118fbfca5d0ba08abe3192dc74cd', name: "interaction" })), index.h("div", { key: 'a512be16ff20690a3e391784b8fd503c5f913b5d', class: "dso-plekinfo-card-content" }, index.h("slot", { key: 'c834eb19244f613204d77953dc604668b5470b7b', name: "content" })))));
+        return (index.h(index.Host, { key: '2d53ad2af278ecb04350916d97663d6e051f0621', "has-symbol": hasSymbol }, index.h(wrapWijzigactie_functionalComponent.WrapWijzigactie, { key: '38cf232cc042b804f78641249dcb78e49edf60ad', wijzigactie: this.wijzigactie, class: "dso-plekinfo-card-container" }, index.h("div", { key: '06e440267be7b64ba1c83e496a31b9feb2b2e656', class: "dso-plekinfo-card-symbol", hidden: !hasSymbol }, index.h("slot", { key: '70b391dc311eab8a6a82c7b1ef016bb319451ca5', name: "symbol" })), index.h("div", { key: '308739dc070978d312a683cf15418b3641c33d14', 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: 'af52f7b0ef4ffaf976676ac25603add75e8ed953', name: "meta" }), this.interaction !== null && index.h("slot", { key: 'eb3c57de70129f281e1991ec3577d5daf7d77447', name: "interaction" })), index.h("div", { key: 'ac287449cb3ab9d081d23e7df27e76b90c2597c4', class: "dso-plekinfo-card-content" }, index.h("slot", { key: '7d9d0fd07d588b09dfdc3716cb00c46622a41af2', name: "content" })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -24,7 +24,7 @@ const Progressindicator = class {
         this.text = i18n.i18n(() => this.host, translations);
     }
     render() {
-        return (index.h(index.Host, { key: 'b704af2a0e3f0de7de1d80789a6f709163c888d3' }, index.h("span", { key: '64a093e0ca5fc8537fa46cd2d9e0e4edcd7d54ad', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, index.h("dso-icon", { key: 'b3c2bf36581157070ee8730533cc2f875008c246', icon: "spinner" })), index.h("span", { key: 'f7670e47fc323563d694d575306abee23e99fb02', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
+        return (index.h(index.Host, { key: 'd5e6ea64b6b3983180f0899946b9b3354a2fe41e' }, index.h("span", { key: '6805adbb082ad54d4b4a4d84b85b001d4f665cfe', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, index.h("dso-icon", { key: 'b3f8dad626b182e46a70f83439c11765a67b2262', icon: "spinner" })), index.h("span", { key: 'b4ed2102656f7b330b8a436f8e999df3d30c89d9', 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

@@ -9,7 +9,7 @@ const ProjectItem = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Fragment, { key: '45871b523685ebd7853b0ce31a7603fded861378' }, index.h("div", { key: '9624e80d73a5921660b2073a16a5921967a8d00f', class: "project-item-header" }, index.h("div", { key: 'af01b343a5a3bf8b5a8e7cbb80bbfaa22e1e554a', class: "project-item-title" }, index.h("slot", { key: '7c0cf1ce893fa4059a18393157d0cb6c33600d7a', name: "title" }), this.label && (index.h("dso-label", { key: '95a66a8617d79966c8c99b6306e6340b4c106fb8', status: "error", compact: true }, this.label))), index.h("div", { key: '8ae177b7420a0066fa82138a949ee3c764a7ddfd', class: "project-item-actions" }, index.h("slot", { key: 'aadf3ebbf05ce3b0fd91844870abf0c6c04913f8', name: "actions" }))), index.h("div", { key: '5c9ae37b5fc857f5a08398be04429181c0ee2a02', class: "project-item-info" }, index.h("div", { key: 'a2473acd2492c6e512a81bc675f8e7c9d64f38e3', class: "project-item-progress" }, index.h("slot", { key: 'd2b9c40914b6d920531dcd6230f15027413d6218', name: "progress" })), index.h("div", { key: '8970e4b1e91e7d26e26ca3cb45554ab4053b0a96', class: "project-item-status" }, index.h("slot", { key: 'edaf1a22822b1ba3d97e78bd0b04428eb962ffe0', name: "status" })))));
+        return (index.h(index.Fragment, { key: 'ce430c6cdf4a3551ac6dded20724d388f2a78f41' }, index.h("div", { key: 'fa60c476c219be6aba73f7aa19d0ca37f43eaf82', class: "project-item-header" }, index.h("div", { key: '08d2b98b4d240a6e1605a09625966ee2e24cacac', class: "project-item-title" }, index.h("slot", { key: '33c96e1e086fad5040b5f5e57d4f6bdc66b59f54', name: "title" }), this.label && (index.h("dso-label", { key: '2b7c36c4a87394cf59147521ab0c63b46ab7dc0d', status: "error", compact: true }, this.label))), index.h("div", { key: '434aa16ddff7801e52aaf2cf4205fc7387babfe4', class: "project-item-actions" }, index.h("slot", { key: '27d3546aaa782becb520f98ab5cd8edb8d624906', name: "actions" }))), index.h("div", { key: 'a233e05c27ec5beb54b23d5a3042c73fd7defc2c', class: "project-item-info" }, index.h("div", { key: '91d630b5c041b08fa7698acac2b92739d93d9db1', class: "project-item-progress" }, index.h("slot", { key: 'a8bda2420c70a50c8b793ba24b2ed98a640f77a8', name: "progress" })), index.h("div", { key: '543d749f0339d2f8dd69b7c19b14f555c5fdb10e', class: "project-item-status" }, index.h("slot", { key: '7d94342205d9b51daab159dc426661e6db927081', name: "status" })))));
     }
 };
 ProjectItem.style = projectItemCss();

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

@@ -60,7 +60,7 @@ const ResponsiveElement = class {
         this.observer.unobserve(this.host);
     }
     render() {
-        return (index.h(index.Host, { key: '035e0fbd46df2b7bb17eaa4341082f1d242a5155', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, index.h("slot", { key: '25bb0eb9de92fcf9b95a2c0a0bb642788b625946' })));
+        return (index.h(index.Host, { key: '0e46330d5c565d1935350d23614c75bdb72f9607', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, index.h("slot", { key: 'b6c1d67077a565d82dc058eb3c29c0fc75e5ec86' })));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -113,9 +113,9 @@ const Scrollable = class {
         this.slottedElements.forEach((element) => resizeObserver.unobserve(element));
     }
     render() {
-        return (index.h("div", { key: '7b93ceaa980dcc36ee2174a8375db7fc3565174e', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, index.h("div", { key: 'cc1a6675b18fc6cceefb8f7b5c7a2204a4ba75d1', ref: (el) => (this.scrollContainerDiv = el), class: clsx.clsx("dso-scroll-container", {
+        return (index.h("div", { key: 'ba20c551e9039dfaf75e22f3aa2a0c830fc37190', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, index.h("div", { key: '7740920d51a271d395c5f1ef27edff8eb0bc24ed', ref: (el) => (this.scrollContainerDiv = el), class: clsx.clsx("dso-scroll-container", {
                 [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== "noScroll",
-            }), onScroll: () => this._setScrollState(), tabIndex: this._preventFocus ? -1 : undefined }, index.h("slot", { key: 'a2b0dd1d02d2a11a4b6bac4a5d87dfcc585accf3' }))));
+            }), onScroll: () => this._setScrollState(), tabIndex: this._preventFocus ? -1 : undefined }, index.h("slot", { key: 'ecce8833067ef456a5d998cb387ef0cd40aff02a' }))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -24,7 +24,7 @@ const SegmentedButton = class {
         });
     }
     render() {
-        return (index.h("div", { key: '34c467709db2058c287c30c90e87c3f7d4cad523', class: "segmented-button", role: "radiogroup", "aria-label": this.label, "aria-required": this.required?.toString() }, this.options?.map((option) => {
+        return (index.h("div", { key: '24e855e55cf1feec27c4ea411d7d3ba05da2a732', 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-shopping-cart-item.cjs.entry.js

@@ -0,0 +1,53 @@
+'use strict';
+
+var index = require('./index-CfwUrDXc.js');
+
+const shoppingCartItemCss = () => `:host {   display: block; }  *, *::after, *::before {   box-sizing: border-box; }  .sr-only {   position: absolute;   inline-size: 1px;   block-size: 1px;   padding: 0;   margin: -1px;   border: 0;   overflow: hidden;   clip-path: rect(0 0 0 0); }  button {   -webkit-appearance: button;   color: inherit;   cursor: pointer;   font: inherit;   font-family: inherit;   font-size: inherit;   letter-spacing: inherit;   line-height: inherit;   margin: 0;   overflow: visible;   text-transform: none; } button[disabled] {   cursor: default; } button::-moz-focus-inner {   border: 0;   padding: 0; } button.dso-tertiary {   display: inline-block;   font-size: 1em;   font-weight: 500;   margin-block-end: 0;   text-decoration: none;   touch-action: manipulation;   text-align: var(--_dso-button-text-align, start);   user-select: none;   vertical-align: middle;   background-clip: padding-box; } button.dso-tertiary:focus, button.dso-tertiary:focus-visible {   outline-offset: 2px; } button.dso-tertiary:active {   outline: 0; } button.dso-tertiary.extern::after, button.dso-tertiary.download::after {   content: "";   display: inline-block; } button.dso-tertiary {   display: inline-block;   font-size: 1em;   font-weight: 500;   margin-block-end: 0;   text-decoration: none;   touch-action: manipulation;   text-align: var(--_dso-button-text-align, start);   user-select: none;   vertical-align: middle;   background-clip: padding-box; } button.dso-tertiary:focus, button.dso-tertiary:focus-visible {   outline-offset: 2px; } button.dso-tertiary:active {   outline: 0; } button.dso-tertiary.extern::after, button.dso-tertiary.download::after {   content: "";   display: inline-block; } button.dso-tertiary {   background-color: var(--_dso-button-tertiary-background-color, );   border-color: var(--_dso-button-tertiary-border-color, );   color: var(--_dso-button-tertiary-color, #39870c);   float: var(--_dso-button-float-tertiary, none);   border-width: 1px;   border-style: solid;   border-radius: 4px;   line-height: 1.5;   min-inline-size: auto;   inline-size: var(--_dso-button-inline-size, auto);   padding-block: 11px;   padding-inline: 15px; } button.dso-tertiary:hover {   background-color: var(--_dso-button-tertiary-hover-background-color, );   border-color: var(--_dso-button-tertiary-hover-border-color, );   color: var(--_dso-button-tertiary-hover-color, #275937);   float: var(--_dso-button-float-tertiary, none); } button.dso-tertiary:active {   background-color: var(--_dso-button-tertiary-active-background-color, );   border-color: var(--_dso-button-tertiary-active-border-color, );   color: var(--_dso-button-tertiary-active-color, #173521);   float: var(--_dso-button-float-tertiary, none); } button.dso-tertiary[disabled], button.dso-tertiary[disabled]:hover {   background-color: var(--_dso-button-tertiary-disabled-background-color, );   border-color: var(--_dso-button-tertiary-disabled-border-color, );   color: var(--_dso-button-tertiary-disabled-color, #afcf9d);   float: var(--_dso-button-float-tertiary, none); } button.dso-tertiary.dso-small {   line-height: 1rem; } button.dso-tertiary.dso-small dso-icon, button.dso-tertiary.dso-small.extern::after, button.dso-tertiary.dso-small.download::after, button.dso-tertiary.dso-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-tertiary.dso-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-tertiary.dso-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-tertiary.dso-extra-small {   line-height: 1rem; } button.dso-tertiary.dso-extra-small dso-icon, button.dso-tertiary.dso-extra-small.extern::after, button.dso-tertiary.dso-extra-small.download::after, button.dso-tertiary.dso-extra-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-tertiary.dso-extra-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-tertiary.dso-extra-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-tertiary.dso-extra-small {   padding-block: 9px; } button.dso-tertiary {   border: 0;   line-height: 1;   padding-inline: 0;   padding-block: var(--_dso-button-padding-block-tertiary, 0);   background-color: transparent; } button.dso-tertiary[disabled].dso-spinner-left, button.dso-tertiary[disabled].dso-spinner-right {   color: #39870c; } button.dso-tertiary:not([disabled]):hover {   text-decoration: underline;   text-underline-position: under; } button.dso-tertiary.dso-align {   line-height: calc(1.5em - 1px);   padding-block: 11px;   padding-inline: 0;   position: relative; } button.dso-tertiary.dso-truncate {   max-inline-size: 100%;   overflow: hidden;   text-overflow: ellipsis;   white-space: nowrap; } button.dso-tertiary.dso-spinner-left::before {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: middle;   inline-size: 24px;   margin-inline-end: 8px; } button.dso-tertiary.dso-spinner-right::after {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: middle;   inline-size: 24px;   margin-inline-start: 8px; } button.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon {   margin-inline-start: 4px; } button.dso-tertiary dso-icon, button.dso-tertiary span {   vertical-align: middle; } button.dso-tertiary {   display: flex;   align-items: center; }  .item {   background-color: #fff;   padding-block: var(--_dso-shopping-cart-item-padding-block, 16px);   padding-inline: var(--_dso-shopping-cart-item-padding-inline, 8px); } .item > slot {   --_dso-shopping-cart-item-padding-block: 8px 0;   --_dso-shopping-cart-item-padding-inline: 16px 0;   --_dso-shopping-cart-item-name-weight: normal; }  .item-edit {   display: flex;   flex-direction: column;   gap: 16px;   padding-block: 24px;   padding-inline: 24px; }  .item-header {   display: flex;   align-items: flex-start;   justify-content: space-between;   gap: 8px; }  .item-name {   display: flex;   align-items: flex-start;   gap: 0.5rem;   min-inline-size: 0; } .item-name dso-icon {   flex: none; } .item-name ::slotted([slot=name]) {   margin-block: 0 !important;   margin-inline: 0 !important;   font-weight: var(--_dso-shopping-cart-item-name-weight, 600) !important;   display: -webkit-box !important;   -webkit-line-clamp: var(--_dso-shopping-cart-line-clamp, none) !important;   -webkit-box-orient: vertical !important;   overflow: hidden !important; }  ::slotted([slot=info]) {   margin-block: 0.5rem 0 !important;   margin-inline: 0 !important;   font-size: 0.875rem !important; }  .item-actions {   flex: none;   display: flex;   align-items: center;   gap: 0.5rem; }  .item-edit-header {   display: flex;   align-items: flex-start;   justify-content: space-between;   gap: 16px; } .item-edit-header ::slotted([slot=name]) {   margin-block: 0 !important;   margin-inline: 0 !important;   color: #275937 !important;   font-size: 1.125rem !important;   font-weight: 600 !important;   line-height: 1.25 !important; } @media (min-width: 480px) {   .item-edit-header ::slotted([slot=name]) {     font-size: 1.25rem !important;   } }`;
+
+const ShoppingCartItem = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.dsoEdit = index.createEvent(this, "dsoEdit", 3);
+        this.dsoDelete = index.createEvent(this, "dsoDelete", 3);
+        this.dsoClose = index.createEvent(this, "dsoClose", 3);
+        /**
+         * The mode of the Shopping Cart Item.
+         */
+        this.mode = "view";
+        /**
+         * When set a warning icon is rendered before the name.
+         */
+        this.warning = false;
+        /**
+         * When set an edit (pencil) action is rendered.
+         */
+        this.editable = false;
+        /**
+         * When set a delete (trash) action is rendered.
+         */
+        this.removable = false;
+    }
+    connectedCallback() {
+        this.mutationObserver = new MutationObserver(() => index.forceUpdate(this.host));
+        this.mutationObserver.observe(this.host, { attributes: true, characterData: true, childList: true, subtree: true });
+    }
+    disconnectedCallback() {
+        this.mutationObserver?.disconnect();
+    }
+    get name() {
+        return this.host.querySelector(":scope > [slot='name']")?.textContent?.trim() ?? "";
+    }
+    renderActions() {
+        return (index.h("div", { class: "item-actions" }, this.editable && (index.h("dso-icon-button", { icon: "pencil", variant: "tertiary", label: `Wijzig ${this.name}`, onDsoClick: (e) => this.dsoEdit.emit({ originalEvent: e.detail.originalEvent }) })), this.removable && (index.h("dso-icon-button", { icon: "trash", variant: "tertiary", label: `Verwijder ${this.name}`, onDsoClick: (e) => this.dsoDelete.emit({ originalEvent: e.detail.originalEvent }) }))));
+    }
+    render() {
+        if (this.mode === "edit") {
+            return (index.h("div", { class: "item item-edit" }, index.h("div", { class: "item-edit-header" }, index.h("slot", { name: "name" }), index.h("button", { type: "button", class: "dso-tertiary", onClick: (e) => this.dsoClose.emit({ originalEvent: e }) }, "Sluiten", index.h("dso-icon", { icon: "cross" }))), index.h("div", { class: "item-edit-body" }, index.h("slot", null))));
+        }
+        return (index.h("div", { class: "item" }, index.h("div", { class: "item-header" }, index.h("div", { class: "item-name" }, this.warning && (index.h(index.Fragment, null, index.h("dso-icon", { icon: "status-warning", "aria-hidden": "true" }), index.h("span", { class: "sr-only" }, "waarschuwing: "))), index.h("slot", { name: "name" })), (this.editable || this.removable) && this.renderActions()), index.h("slot", null), index.h("slot", { name: "info" })));
+    }
+    get host() { return index.getElement(this); }
+};
+ShoppingCartItem.style = shoppingCartItemCss();
+
+exports.dso_shopping_cart_item = ShoppingCartItem;

package/dist/cjs/dso-shopping-cart.cjs.entry.js

@@ -0,0 +1,33 @@
+'use strict';
+
+var index = require('./index-CfwUrDXc.js');
+
+const shoppingCartCss = () => `:host {   display: block; }  *, *::after, *::before {   box-sizing: border-box; }  .shopping-cart {   background-color: #e1ecf7;   padding-block: 16px;   padding-inline: 16px; }  .header {   display: flex;   align-items: center;   justify-content: space-between;   gap: 16px;   margin-block-end: 16px; }  ::slotted([slot=heading]) {   margin-block: 0 !important;   margin-inline: 0 !important;   color: inherit !important;   font-size: 1.125rem !important;   font-weight: 600 !important;   line-height: 1.25 !important; } @media (min-width: 480px) {   ::slotted([slot=heading]) {     font-size: 1.25rem !important;   } }  .items {   display: flex;   flex-direction: column;   gap: 8px; }  :host([mode=side]) .items {   --_dso-shopping-cart-line-clamp: 2; }  button {   -webkit-appearance: button;   color: inherit;   cursor: pointer;   font: inherit;   font-family: inherit;   font-size: inherit;   letter-spacing: inherit;   line-height: inherit;   margin: 0;   overflow: visible;   text-transform: none; } button[disabled] {   cursor: default; } button::-moz-focus-inner {   border: 0;   padding: 0; } button.dso-secondary {   display: inline-block;   font-size: 1em;   font-weight: 500;   margin-block-end: 0;   text-decoration: none;   touch-action: manipulation;   text-align: var(--_dso-button-text-align, start);   user-select: none;   vertical-align: middle;   background-clip: padding-box; } button.dso-secondary:focus, button.dso-secondary:focus-visible {   outline-offset: 2px; } button.dso-secondary:active {   outline: 0; } button.dso-secondary.extern::after, button.dso-secondary.download::after {   content: "";   display: inline-block; } button.dso-secondary {   background-color: var(--_dso-button-secondary-background-color, #fff);   border-color: var(--_dso-button-secondary-border-color, #39870c);   color: var(--_dso-button-secondary-color, #39870c);   float: var(--_dso-button-float-secondary, none);   border-width: 1px;   border-style: solid;   border-radius: 4px;   line-height: 1.5;   min-inline-size: 56px;   inline-size: var(--_dso-button-inline-size, auto);   padding-block: 11px;   padding-inline: 15px; } button.dso-secondary:hover {   background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce);   border-color: var(--_dso-button-secondary-hover-border-color, #275937);   color: var(--_dso-button-secondary-hover-color, #275937);   float: var(--_dso-button-float-secondary, none); } button.dso-secondary:active {   background-color: var(--_dso-button-secondary-active-background-color, #275937);   border-color: var(--_dso-button-secondary-active-border-color, #275937);   color: var(--_dso-button-secondary-active-color, #fff);   float: var(--_dso-button-float-secondary, none); } button.dso-secondary[disabled], button.dso-secondary[disabled]:hover {   background-color: var(--_dso-button-secondary-disabled-background-color, #fff);   border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d);   color: var(--_dso-button-secondary-disabled-color, #afcf9d);   float: var(--_dso-button-float-secondary, none); } button.dso-secondary.dso-small {   line-height: 1rem; } button.dso-secondary.dso-small dso-icon, button.dso-secondary.dso-small.extern::after, button.dso-secondary.dso-small.download::after, button.dso-secondary.dso-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-secondary.dso-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-extra-small {   line-height: 1rem; } button.dso-secondary.dso-extra-small dso-icon, button.dso-secondary.dso-extra-small.extern::after, button.dso-secondary.dso-extra-small.download::after, button.dso-secondary.dso-extra-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-secondary.dso-extra-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-extra-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-extra-small {   padding-block: 9px; } button.dso-secondary dso-icon:has(+ span:not(.sr-only)) {   margin-inline-start: -8px; } button.dso-secondary span:not(.sr-only) + dso-icon {   margin-inline-start: 8px;   margin-inline-end: -8px; } button.dso-secondary dso-icon + span:not(.sr-only) {   margin-inline-start: 8px; } button.dso-secondary.dso-spinner-left[disabled], button.dso-secondary.dso-spinner-right[disabled] {   background-color: #fff;   border-color: #39870c;   color: #39870c; } button.dso-secondary.dso-spinner-left::before {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: top;   inline-size: 24px;   margin-inline-end: 8px; } button.dso-secondary.dso-spinner-left:not([disabled]):hover::before {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: top;   inline-size: 24px;   margin-inline-end: 8px; } button.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-spinner-right::after {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: top;   inline-size: 24px;   margin-inline-start: 8px; } button.dso-secondary.dso-spinner-right:not([disabled]):hover::after {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: top;   inline-size: 24px;   margin-inline-start: 8px; } button.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after {   block-size: 16px;   inline-size: 16px; }`;
+
+const ShoppingCart = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.dsoToggle = index.createEvent(this, "dsoToggle", 3);
+        /**
+         * The mode of the Shopping Cart.
+         */
+        this.mode = "side";
+        /**
+         * When set, a toggle button is rendered. In the `side` mode this is a button to expand the Shopping Cart, in the
+         * `main` mode this is a button to collapse the Shopping Cart.
+         */
+        this.toggleable = false;
+    }
+    renderToggle() {
+        if (this.mode === "main") {
+            return (index.h("button", { type: "button", class: "dso-secondary", onClick: (e) => this.dsoToggle.emit({ originalEvent: e }) }, index.h("span", null, "Sluiten"), index.h("dso-icon", { icon: "chevron-right" })));
+        }
+        return (index.h("dso-icon-button", { icon: "chevron-left", variant: "secondary", label: "Openen", onDsoClick: (e) => this.dsoToggle.emit({ originalEvent: e.detail.originalEvent }) }));
+    }
+    render() {
+        return (index.h("div", { key: '510bbaaf0168ead779506268e240db510052e825', class: "shopping-cart" }, index.h("div", { key: '122708dc74255a93a4b4a437bd769959cddffa36', class: "header" }, index.h("slot", { key: '24c9865d01ee9c8767628b4f75a9ea64e8b0ce71', name: "heading" }), this.toggleable && this.renderToggle()), index.h("div", { key: '70efc93e9dff173c67b9fa346845d5952d5b527c', class: "items" }, index.h("slot", { key: '68ffbb3f0e54539ddd3f38b2ea1ff40c2a41d351' }))));
+    }
+};
+ShoppingCart.style = shoppingCartCss();
+
+exports.dso_shopping_cart = ShoppingCart;

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

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

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

@@ -28,10 +28,10 @@ const SurveyRating = class {
             "Makkelijk",
             "Heel makkelijk",
         ];
-        return (index.h("dso-panel", { key: '3d6733ce56f73b4e35b3f5d68388bd22f6ef4450', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, index.h("h2", { key: 'f93cbf6d816962a848f15b40055a8b9ff3f26fdc', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), index.h("strong", { key: 'e83390a76e6d45fc72a9c9f7d45e6650941c91b9' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), index.h("form", { key: 'c671091557cb1096c47f88e99eb7e6bb42838479', onSubmit: (e) => this.handleForm(e) }, index.h("div", { key: '952782116562f822ba8a8788104a9817739b4601', class: "visual-rating-labels", "aria-hidden": "true" }, index.h("span", { key: '67fb62008f260e99c956709ca2cea83f22121460' }, "Heel moeilijk"), index.h("span", { key: 'eacf518d23c1e618162ce116890bcae4c28df240' }, "Heel makkelijk")), index.h("div", { key: 'bf9a0977e6e7508b362680aa49f78b9319ce7915', role: "radiogroup" }, ratings.map((rating, index$1) => {
+        return (index.h("dso-panel", { key: '4026814077478126886d7c6dd3c91cff5c8987ca', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, index.h("h2", { key: '8b0c40eb3de6cf3176b157ceb908956e2f9e4581', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), index.h("strong", { key: '9218e2fcbadb61436fa8080e448bf50abc56418d' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), index.h("form", { key: 'e517ab50c84d3087bdc165c8aa12aea8acfdfd46', onSubmit: (e) => this.handleForm(e) }, index.h("div", { key: '5f80f7273cc6005a9b17ebf38dd1b037661a5585', class: "visual-rating-labels", "aria-hidden": "true" }, index.h("span", { key: '1bdbc022680fa6250205cfed9c69a19adb51ddf7' }, "Heel moeilijk"), index.h("span", { key: '94068a97aad6a541399f04bfacd51e33749cee1d' }, "Heel makkelijk")), index.h("div", { key: 'b2dceabfdb6e371437d40c209c0d990159f05c50', 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: '1cb51daa334ca994ede7ea2bbc74534635f42921', type: "submit", class: "dso-secondary" }, index.h("span", { key: '044a0844ae775fed12db6089e76dd449494ad84b' }, "Antwoord verzenden")))));
+        })), index.h("button", { key: '88524ec3c4bf1b9c059e838c8a761b7b59aca508', type: "submit", class: "dso-secondary" }, index.h("span", { key: '79b5f16daf9dbb2ebaa51f3644c3e41cc40e39e1' }, "Antwoord verzenden")))));
     }
 };
 SurveyRating.style = surveyRatingCss();

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

@@ -62,7 +62,7 @@ const Tabs = class {
         this.mutationObserver?.disconnect();
     }
     render() {
-        return (index.h(index.Host, { key: '378e4fa22a57c3379ace6d0329d0dd2ffd35c04a' }, index.h("div", { key: 'b791083acc1c6b614abc8b9c40abcd63df8bf0ba', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, index.h("slot", { key: '29c8e59ef344c9a3c9fdc3b5e41e8b6700434a17' })), index.h("div", { key: '7f2c1d9a3a5d712807336d925d262ffac3ec23c7', role: "tabpanel", tabindex: "0" }, index.h("slot", { key: 'dd4d5314dd77338bb217b01563d629259bbfb2f7', name: "panel" }))));
+        return (index.h(index.Host, { key: '88c28ae388d2276dec5e4b8c92066a005604d5b5' }, index.h("div", { key: 'cee7d902fb455fadd0c4588cf5a6133466ec89ed', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, index.h("slot", { key: 'a9893f2c16e194318a589a379dbcd23b450bda17' })), index.h("div", { key: '66cfff257290a44c064fc4011f8101fc4ab0b918', role: "tabpanel", tabindex: "0" }, index.h("slot", { key: '52f5be68fcb6b98b5c8831e81522faa4733a3501', name: "panel" }))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -9,7 +9,7 @@ const TijdreisBanner = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Fragment, { key: '4bde48340c627e60f8655d71e11d358ce3706f63' }, index.h("dso-icon", { key: '33020e99bfc7d8fba1f799c0ea4324c417bd64d1', icon: "clock-outline" }), index.h("slot", { key: 'be1174fc29ad9eae607fbced2dc2ffc9874e2973' }), index.h("slot", { key: '7b6ff42a67dcaeb757c24473cb3c8caa4456c90b', name: "button" })));
+        return (index.h(index.Fragment, { key: '87e07ae60caceaede01cca3be68eabe3be3a4ff0' }, index.h("dso-icon", { key: 'be83bf9a6bbfb99f58e5cd9472ebdc6f548c1a12', icon: "clock-outline" }), index.h("slot", { key: '2c820079226fc53e34dc2adf0e32ac9d7e4baa23' }), index.h("slot", { key: '3bc1846d25fb9de12af41befcd5fdbf5ffa25795', name: "button" })));
     }
 };
 TijdreisBanner.style = tijdreisBannerCss();