@dso-toolkit/core 85.0.0 → 87.0.0

package/dist/cjs/dso-annotation-locatie_2.cjs.entry.js

@@ -1364,14 +1364,6 @@ const DocumentComponent = class {
          * Marks this Document Component as not-applicable.
          */
         this.notApplicable = false;
-        /**
-         * When a child Document Component has a status "Draft".
-         */
-        this.genesteOntwerpInformatie = false;
-        /**
-         * Marks as draft.
-         */
-        this.bevatOntwerpInformatie = false;
         /**
          * Enables annotations.
          */
@@ -1452,10 +1444,8 @@ const DocumentComponent = class {
     get wijzigactieLabel() {
         return this.wijzigactie && wijzigactieLabels[this.wijzigactie];
     }
-    showOntwerpBadge() {
-        return (this.genesteOntwerpInformatie &&
-            !this.bevatOntwerpInformatie &&
-            ((!this.open && this.mode === "document") || this.mode === "table-of-contents"));
+    showBadge() {
+        return !!this.badge && ((!this.open && this.mode === "document") || this.mode === "table-of-contents");
     }
     parseAantekenElement(input) {
         if (!input) {
@@ -1492,10 +1482,10 @@ const DocumentComponent = class {
             collapsible ||
             this._kop ||
             this.alternativeTitle ||
-            this.bevatOntwerpInformatie ||
+            this.label ||
             this.annotated);
-        return (index.h(index.Host, { key: '36ab426cfb2130bf474c3232b191447f01860343', "not-collapsible": !collapsible }, showHeading && (index.h("div", { key: '641d209eb86ceeea204647fe923f8abf445529db', class: "heading-container", part: "_heading-container" }, this.wijzigactie && index.h("span", { key: 'c5bfbadd27ee536a7acd4983303343c06e13e36e', class: "editaction-label" }, this.wijzigactieLabel, ":"), index.h("div", { key: 'c83b345463b36048557472e2a325a7e74f42119f', class: "heading" }, index.h(Heading, { key: '39155283828000393d3f59aceea96ad61abba1a2', heading: this.heading, class: "heading-element", onClick: this.alternativeTitle ? this.handleHeadingClick : undefined, mode: this.mode, href: this.href }, collapsible && this.mode === "document" && (index.h("dso-icon-button", { key: '12f4eb10033cb0c63c4ab57d0c113cc7531a275d', label: this.open ? "Invouwen" : "Uitvouwen", class: "toggle-button", icon: this.open ? "chevron-down" : "chevron-right", variant: "tertiary", onDsoClick: (e) => this.handleHeadingClick(e.detail.originalEvent) })), index.h("div", { key: '7764bfe3323f1b602a7a4b8d9340f2ee30627694' }, this.notApplicable && index.h("span", { key: '0affec0e7b54f9188e9d042b6e8abd312c804794', class: "sr-only" }, "Niet van toepassing:"), this._kop ? (index.h("dso-ozon-content", { class: "kop", content: this._kop, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "kop"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "kop" })), inline: true, urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })) : (index.h("span", { class: "alternative-title" }, (!this.mark && this.alternativeTitle) ||
-            (this.mark && this.alternativeTitle && (index.h(parseWijzigactieFromNode_function.MarkText, { mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "alternativeTitle"); }), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), index.h(AantekenStatus, { key: 'cef5cc7ff493b91cdfaf9620642a8a4039e50412', gereserveerd: this._gereserveerd, vervallen: this._vervallen }))), this.recursiveToggle !== undefined && this.open && this.mode === "document" && (index.h("dso-icon-button", { key: 'df215f601309cd8787105ad06825303cc0cd3984', label: this.recursiveToggle === true ? "Verberg alles" : "Toon alles", class: "recursive-toggle", icon: this.recursiveToggle === true ? "eye" : "eye-slash", variant: "tertiary", onDsoClick: (e) => this.handleRecursiveToggleClick(e.detail.originalEvent) })), this.showOntwerpBadge() && (index.h(index.Fragment, { key: 'c2914d7f1d67585f18205655c144f2b9179b4399' }, index.h("dso-badge", { key: 'b2d9b50252f84fc42a24ea14d2c37e6782d92ec5', status: "warning", "aria-describedby": "nested-draft-description" }, "!"), index.h("dso-tooltip", { key: '9c53081478a277311f03c71447ff92bc24189ca3', id: "nested-draft-description" }, "Er zijn onderliggende onderdelen die veranderen binnen dit ontwerp."))), (this.bevatOntwerpInformatie || this.annotated) && (index.h("div", { key: 'fd3fa5acaa37cdbd794c8cd4b4ec9fc93befc3cb', class: "addons" }, this.bevatOntwerpInformatie && (index.h("dso-label", { key: '1b63aec2ee2df5c4f9c9459c4edcc92819dc363d', status: "warning", compact: true }, "Ontwerp")), this.annotated && this.mode === "document" && (index.h("dso-icon-button", { key: 'e2349aa63961b4967fdd87b28cff901eba9d044b', label: `Kenmerken en kaartgegevens ${this.openAnnotation ? "verbergen" : "tonen"}`, icon: "label", variant: "tertiary", onDsoClick: (e) => this.dsoAnnotationToggle.emit({ originalEvent: e.detail.originalEvent }) }))))))), this.openAnnotation && (index.h("div", { key: 'baefe2cae5ec013cd01d40ebd6224825fdfae0d3', class: "annotation-container", part: "_annotation-container" }, index.h("dso-panel", { key: '475cfce4a114b23473649621a06dea2ee4d903c4', id: "annotations", onDsoCloseClick: (e) => this.dsoAnnotationToggle.emit({ originalEvent: e }), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, index.h("h2", { key: '372049c8d26faaa7d1260d4c64d9e11b37a5584c', slot: "heading" }, "Kenmerken en kaart"), index.h("slot", { key: 'cfa2f6ceff337228a0520214dc8e259c14e34c04', name: "annotations" })))), this.open && (this._inhoud || this._gereserveerd || this._vervallen) && this.mode === "document" && (index.h("div", { key: '14192e605a1db5a3b59ea0f337961730877c3d3c', class: "content", part: "_content" }, index.h(AantekenAlert, { key: '5d7a3b758fb1f4ff99e5f2555a37547746c735f8', gereserveerd: this._gereserveerd, vervallen: this._vervallen }), this._inhoud && (index.h("dso-ozon-content", { key: 'd70aceb93869844744f1ecdd161518631d7bf6c8', content: this._inhoud, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "inhoud"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "inhoud" })), urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })))), index.h("div", { key: '59cbc0624a0a66182aba7b0c83e41207e1756beb', class: "children-container", part: "_children-container" }, index.h("slot", { key: 'f8a25a2f71f26c72d5d17e84b5425191305dd0c7' }))));
+        return (index.h(index.Host, { key: 'e8b3f6c9a0f95cf511a789523fa626399645b0d1', "not-collapsible": !collapsible }, showHeading && (index.h("div", { key: 'addc3c305d121404543bfcdbc80afdc3c19717e7', class: "heading-container", part: "_heading-container" }, this.wijzigactie && index.h("span", { key: 'dc5990c86a3a38e37bb8d1806c484d78804786ec', class: "editaction-label" }, this.wijzigactieLabel, ":"), index.h("div", { key: '3d825ebd13153d39ee4b5f5eeabf50da08fe02ef', class: "heading" }, index.h(Heading, { key: 'ff103cfb3048a6a783425927588f8a58a0eed97e', heading: this.heading, class: "heading-element", onClick: this.alternativeTitle ? this.handleHeadingClick : undefined, mode: this.mode, href: this.href }, collapsible && this.mode === "document" && (index.h("dso-icon-button", { key: 'e4493f8d04962def05cf67fdffcebcab5b794c7b', label: this.open ? "Invouwen" : "Uitvouwen", class: "toggle-button", icon: this.open ? "chevron-down" : "chevron-right", variant: "tertiary", onDsoClick: (e) => this.handleHeadingClick(e.detail.originalEvent) })), index.h("div", { key: '2e21bb78811a2ffac56c53f34f9b2a144ee0505c' }, this.notApplicable && index.h("span", { key: '15dfa298522909bc66067f6bd7d6b39014d0630e', class: "sr-only" }, "Niet van toepassing:"), this._kop ? (index.h("dso-ozon-content", { class: "kop", content: this._kop, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "kop"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "kop" })), inline: true, urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })) : (index.h("span", { class: "alternative-title" }, (!this.mark && this.alternativeTitle) ||
+            (this.mark && this.alternativeTitle && (index.h(parseWijzigactieFromNode_function.MarkText, { mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "alternativeTitle"); }), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), index.h(AantekenStatus, { key: 'b2ad2f095efbd771ce9853a777e3f04f632777e5', gereserveerd: this._gereserveerd, vervallen: this._vervallen }))), this.recursiveToggle !== undefined && this.open && this.mode === "document" && (index.h("dso-icon-button", { key: '409d6dae13585d5b4ed800c806232a68eba87408', label: this.recursiveToggle === true ? "Verberg alles" : "Toon alles", class: "recursive-toggle", icon: this.recursiveToggle === true ? "eye" : "eye-slash", variant: "tertiary", onDsoClick: (e) => this.handleRecursiveToggleClick(e.detail.originalEvent) })), this.showBadge() && (index.h(index.Fragment, { key: '3e8bc5d14fa7b2d1060e5942df891931cbc01d68' }, index.h("dso-badge", { key: '6bc3a6ccc23648be283b5e09034112f1409b2e72', status: this.badgeStatus, "aria-describedby": "badge-description" }, this.badge), this.badgeTooltip && index.h("dso-tooltip", { key: '43509e839acbc3edbe43a10817d62eab8a54d2c7', id: "badge-description" }, this.badgeTooltip))), (this.label || this.annotated) && (index.h("div", { key: '4f2bac0ec8703935ba49a0eca117940b154b1bde', class: "addons" }, this.label && (index.h("dso-label", { key: '5c2fe3471dbd7cdf135aab24bb2c3a983caa904a', status: this.labelStatus, compact: true }, this.label)), this.annotated && this.mode === "document" && (index.h("dso-icon-button", { key: 'ad610cda27c1708b8100801230d930fd7ef45295', label: `Kenmerken en kaartgegevens ${this.openAnnotation ? "verbergen" : "tonen"}`, icon: "label", variant: "tertiary", onDsoClick: (e) => this.dsoAnnotationToggle.emit({ originalEvent: e.detail.originalEvent }) }))))))), this.openAnnotation && (index.h("div", { key: 'b51b292b7866e66b7ffa8bf1a951e3f2a90e8322', class: "annotation-container", part: "_annotation-container" }, index.h("dso-panel", { key: '153d796c0ff48df41a219ba9d0c54d653af66857', id: "annotations", onDsoCloseClick: (e) => this.dsoAnnotationToggle.emit({ originalEvent: e }), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, index.h("h2", { key: '8865355a005148c60c02fba8342e4c19d0412ea0', slot: "heading" }, "Kenmerken en kaart"), index.h("slot", { key: '1fcd6a303d2d8b876a56446672c8d6da2320e651', name: "annotations" })))), this.open && (this._inhoud || this._gereserveerd || this._vervallen) && this.mode === "document" && (index.h("div", { key: '9b3016ee0a20a18d88b4ff70561c9bfda998052f', class: "content", part: "_content" }, index.h(AantekenAlert, { key: '01c53e87e0e8f8e83d89e662718eedc2be827716', gereserveerd: this._gereserveerd, vervallen: this._vervallen }), this._inhoud && (index.h("dso-ozon-content", { key: 'd5cc5d980de13b68f73cbed2262e0dbfdf3fcae6', content: this._inhoud, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "inhoud"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "inhoud" })), urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })))), index.h("div", { key: '7101da20508b40f14193df30203d86be52051eb0', class: "children-container", part: "_children-container" }, index.h("slot", { key: '3ca16120cfdd26d9451807c3d0efffd7573ec075' }))));
     }
 };
 DocumentComponent.style = documentComponentCss();

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

@@ -3,7 +3,7 @@
 var index = require('./index-2aek-b9X.js');
 var clsx = require('./clsx-BtxeOLZW.js');
 
-const buttonGroupCss = () => `*,*::after,*::before{box-sizing:border-box}:host{display:inline-block}.container{display:inline-flex;border-radius:4px}.container.has-map-buttons{box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.5);background-color:#ccc;gap:1px}::slotted(*){margin:0 !important}:host([direction=row]) ::slotted(:not(:first-child)){border-start-start-radius:0 !important;border-end-start-radius:0 !important}:host([direction=row]) ::slotted(:not(:last-child)){border-start-end-radius:0 !important;border-end-end-radius:0 !important}:host([direction=row]) ::slotted(.dso-secondary){margin-inline-start:-1px !important}:host([direction=column]) .container{flex-direction:column}:host([direction=column]) ::slotted(*){text-align:center !important}:host([direction=column]) ::slotted(:not(:first-child)){border-start-start-radius:0 !important;border-start-end-radius:0 !important}:host([direction=column]) ::slotted(:not(:last-child)){border-end-start-radius:0 !important;border-end-end-radius:0 !important}:host([direction=column]) ::slotted(.dso-secondary){margin-block-start:-1px !important}::slotted(:focus-visible){z-index:1 !important}::slotted(.dso-map){box-shadow:none !important}`;
+const buttonGroupCss = () => `*,*::after,*::before{box-sizing:border-box}:host{display:inline-block}.container{display:inline-flex;border-radius:4px}.container.has-map-buttons{box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.5);background-color:#ccc;gap:1px;--_dt-icon-button-map-box-shadow:0}::slotted(*){margin:0 !important}:host([direction=row]) ::slotted(:not(:first-child)){border-start-start-radius:0 !important;border-end-start-radius:0 !important;--_dt-icon-button-border-start-start-radius:0;--_dt-icon-button-border-end-start-radius:0}:host([direction=row]) ::slotted(:not(:last-child)){border-start-end-radius:0 !important;border-end-end-radius:0 !important;--_dt-icon-button-border-start-end-radius:0;--_dt-icon-button-border-end-end-radius:0;--_dt-icon-button-border-inline-end-width:0}:host([direction=row]) ::slotted(.dso-secondary){margin-inline-start:-1px !important}:host([direction=column]) .container{flex-direction:column}:host([direction=column]) ::slotted(*){text-align:center !important}:host([direction=column]) ::slotted(:not(:first-child)){border-start-start-radius:0 !important;border-start-end-radius:0 !important;--_dt-icon-button-border-start-start-radius:0;--_dt-icon-button-border-start-end-radius:0}:host([direction=column]) ::slotted(:not(:last-child)){border-end-start-radius:0 !important;border-end-end-radius:0 !important;--_dt-icon-button-border-end-start-radius:0;--_dt-icon-button-border-end-end-radius:0;--_dt-icon-button-border-block-end-width:0}:host([direction=column]) ::slotted(.dso-secondary){margin-block-start:-1px !important}::slotted(:focus-visible){z-index:1 !important}::slotted(.dso-map){box-shadow:none !important}`;
 
 const ButtonGroup = class {
     constructor(hostRef) {
@@ -21,17 +21,20 @@ const ButtonGroup = class {
         });
         this.mutationObserver.observe(this.host, {
             childList: true,
+            attributes: true,
         });
     }
     disconnectedCallback() {
         var _a;
         (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
-    get hasMapButtons() {
-        return !!this.host.querySelector(":scope > .dso-map");
+    get hasMapButton() {
+        const hasMapIconButton = this.host.querySelector(":scope > dso-icon-button[variant='map']") !== null;
+        const hasMapClass = this.host.querySelector(":scope > .dso-map") !== null;
+        return hasMapIconButton || hasMapClass;
     }
     render() {
-        return (index.h("div", { key: '19bca6e1fa5b009b83c5ba09d190393b73408438', class: clsx.clsx("container", { "has-map-buttons": this.hasMapButtons }), role: "group" }, index.h("slot", { key: '3aa3142304986e0b3fcf2c204ea7e51ac963926b' })));
+        return (index.h("div", { key: '0cd0a65e9b4ed512a7f51248628b5729e591e5a9', class: clsx.clsx("container", { "has-map-buttons": this.hasMapButton }), role: "group" }, index.h("slot", { key: '529bd12bf8558e3d8f0a7d76bb49c9c0200714ed' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-cursor-tooltip.cjs.entry.js

@@ -0,0 +1,18 @@
+'use strict';
+
+var index = require('./index-2aek-b9X.js');
+
+const cursorTooltipCss = () => `*,*::after,*::before{box-sizing:border-box}:host{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}:host a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-wit"))}:host a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-wit"))}:host a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-wit"))}:host a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-wit"))}:host{--_dso-icon-button-tertiary-color:#fff;background-color:rgba(0, 0, 0, 0.75);color:#fff;position:relative;display:inline-block;pointer-events:none;overflow:unset;max-inline-size:360px;margin-inline:8px;padding-inline:16px;padding-block:8px;border-radius:4px;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4))}:host::before{content:"";position:absolute;inset-inline-start:50%;inset-block-start:0;transform:translateX(-50%) translateY(-100%);border-inline-start:8px solid transparent;border-inline-end:8px solid transparent;border-block-end:8px solid rgba(0, 0, 0, 0.75);filter:none;pointer-events:none}`;
+
+const CursorTooltip = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+    }
+    render() {
+        return (index.h(index.Host, { key: 'fe3c40f9ab20b3172e840b353cf4b2eeca1a96fe', class: "dso-cursor-tooltip" }, index.h("slot", { key: '11c043f041dce83de7740ffdb0b62481c4d10516' })));
+    }
+};
+CursorTooltip.style = cursorTooltipCss();
+
+exports.dso_cursor_tooltip = CursorTooltip;
+//# sourceMappingURL=dso-cursor-tooltip.entry.cjs.js.map

package/dist/cjs/dso-date-picker.cjs.entry.js

@@ -149,7 +149,7 @@ const DsoDatePicker = class {
     }
     render() {
         var _a;
-        return (index.h("input", { key: 'c1b94c74d3a2858b7e6aa5adb59265d2e0c4cead', type: "date", id: this.identifier, class: "dso-date__input", value: parseToValueFormat(this.value), name: this.name, min: parseToValueFormat(this.min), max: parseToValueFormat(this.max), disabled: this.disabled || undefined, required: this.required || undefined, "aria-autocomplete": "none", "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": this.describedBy, autoComplete: "off", autofocus: this.dsoAutofocus || undefined, onBlur: this.handleBlur, onFocus: this.handleFocus, onKeyUp: this.handleKeyUp, onKeyDown: this.handleKeyDown, onChange: this.handleInputChange }));
+        return (index.h("input", { key: 'd158728374aeea203e28cb6f8b9d3f5c99d4f887', type: "date", id: this.identifier, class: "dso-date__input", value: parseToValueFormat(this.value), name: this.name, min: parseToValueFormat(this.min), max: parseToValueFormat(this.max), disabled: this.disabled || undefined, required: this.required || undefined, "aria-autocomplete": "none", "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": this.describedBy, autoComplete: "off", autofocus: this.dsoAutofocus || undefined, onBlur: this.handleBlur, onFocus: this.handleFocus, onKeyUp: this.handleKeyUp, onKeyDown: this.handleKeyDown, onChange: this.handleInputChange }));
     }
     get element() { return index.getElement(this); }
 };

package/dist/cjs/dso-document-card.cjs.entry.js

@@ -3,7 +3,7 @@
 var index = require('./index-2aek-b9X.js');
 var isModifiedEvent = require('./is-modified-event-Dh9YsHw8.js');
 
-const documentCardCss = () => `*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-document-card-container{padding-block:16px;padding-inline:16px;inline-size:100%}.dso-document-card-container .dso-document-card-heading{align-items:center;display:flex}@media screen and (max-width: 480px){.dso-document-card-container .dso-document-card-heading{flex-wrap:wrap}}.dso-document-card-container:has(.dso-document-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}:host([active]:not([active=false])) .dso-document-card-container{background-color:#e5e5e5}::slotted([slot=meta]){display:flex !important;justify-content:space-between !important;flex-shrink:0 !important;align-self:end !important}@media screen and (max-width: 480px){::slotted([slot=meta]){flex-basis:100% !important;margin-block-start:16px !important}}::slotted([slot=heading]){display:inline !important;color:#275937 !important;font-size:1.125em !important;font-weight:700 !important;line-height:1.25 !important;margin-block-end:0 !important;margin-block-start:0 !important}.heading-anchor{color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor .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)}.heading-anchor .icon-container{position:relative;padding-inline-end:24px}.heading-anchor .icon-container dso-icon{position:absolute;inset-inline-end:0;inset-block-end:-3px;block-size:24px;inline-size:24px}::slotted([slot=type]){--_dt-info-button-margin-inline-start:0;display:flex !important;gap:8px !important}.dso-document-card-heading+.dso-document-card-type,.dso-document-card-heading+.dso-document-card-status,.dso-document-card-type+.dso-document-card-status{margin-block-start:8px}`;
+const documentCardCss = () => `*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-document-card-container{padding-block:16px;padding-inline:16px;inline-size:100%}.dso-document-card-container .dso-document-card-heading{align-items:center;display:flex}@media screen and (max-width: 480px){.dso-document-card-container .dso-document-card-heading{flex-wrap:wrap}}.dso-document-card-container:has(.dso-document-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}:host([active]:not([active=false])) .dso-document-card-container{background-color:#e5e5e5}::slotted([slot=heading]){display:inline !important;color:#275937 !important;font-size:1.125em !important;font-weight:700 !important;line-height:1.25 !important;margin-block-end:0 !important;margin-block-start:0 !important}.heading-anchor{color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor .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)}.heading-anchor .icon-container{position:relative;padding-inline-end:24px}.heading-anchor .icon-container dso-icon{position:absolute;inset-inline-end:0;inset-block-end:-3px;block-size:24px;inline-size:24px}::slotted([slot=type]){--_dt-info-button-margin-inline-start:0;display:flex !important;gap:8px !important}.dso-document-card-heading+.dso-document-card-type,.dso-document-card-heading+.dso-document-card-status,.dso-document-card-type+.dso-document-card-status{margin-block-start:8px}::slotted([slot=meta]){margin-inline-end:8px}::slotted([slot=status]){margin-inline-end:8px}`;
 
 const DocumentCard = class {
     constructor(hostRef) {
@@ -28,8 +28,11 @@ const DocumentCard = class {
     get metaSlottedElement() {
         return this.host.querySelector("[slot='meta']");
     }
+    get interactionsSlottedElement() {
+        return this.host.querySelector("[slot='interactions']");
+    }
     render() {
-        return (index.h("div", { key: 'fa7b46b5f893de1939b774c925d34f7f18e15571', class: "dso-document-card-container" }, index.h("div", { key: '682a8fa1673b1c38ca16fc6f4f1a274719adb9f4', class: "dso-document-card-heading" }, index.h("a", { key: 'ee6c434a98e009753e38f92ef38580970025a58b', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("span", { key: 'a14a1a16baafedd1806bf3417dea1135b9cfdb41', class: "icon-container" }, index.h("dso-icon", { key: '843ee861b72689523ce5af6479a3aa1a9ffd84c2', icon: "chevron-right" }), index.h("slot", { key: '918b8e3797b99bd07902ab849f95e3a5b2bf1531', name: "heading" }))), this.metaSlottedElement !== null && index.h("slot", { key: '226986aeeb3d0091f274697b67ebd8de3c358c53', name: "meta" })), index.h("div", { key: 'e0d5195cfa6feb274e4df486b4ca5869f6654ada', class: "dso-document-card-type" }, index.h("slot", { key: '089ae1f70596e1bff98b74acad76a0c6f00e665e', name: "type" })), index.h("div", { key: '6ae6d7023a4b045f7120977d5bccd9b3edaf5ccd', class: "dso-document-card-status" }, index.h("slot", { key: '832d0c2fda8e6fab9ff211d3fbbdd3a8bdf3bbce', name: "status" }))));
+        return (index.h("div", { key: '424a1e6058327ca1892f41626288909fdbe28972', class: "dso-document-card-container" }, index.h("div", { key: 'bf0e9dc501a1850af4dd64d36590de0d2103b164', class: "dso-document-card-heading" }, index.h("a", { key: 'fa110e3c6f1984741d02b515082e847b11aea781', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("span", { key: '32cd23687a349abef9083164795ebb17e833baf2', class: "icon-container" }, index.h("dso-icon", { key: 'f796e32f7d8c7e1ee350aa1b7a3de65be51fed36', icon: "chevron-right" }), index.h("slot", { key: 'a23262482804914228c0320525f41c2bbf35314e', name: "heading" })))), index.h("div", { key: '75734d9e95ded9f4fdde9c999d7a4233b8314f06', class: "dso-document-card-type" }, index.h("slot", { key: 'b18ce3010ae3cb4736ae92108e014fe51a2e2484', name: "type" })), index.h("div", { key: '46673ebfc66c849b1ba48337f1fb2f864b182759', class: "dso-document-card-status" }, this.metaSlottedElement !== null && index.h("slot", { key: '45418a415877277de76dcf3a6f8df0ad86c4f732', name: "meta" }), index.h("slot", { key: 'cd8bf629833394d19d423ba7b8912be3a7af5f53', name: "status" }), this.interactionsSlottedElement !== null && index.h("slot", { key: '3996b4f72f7658ef760dfcf7f6578b4b8951e0a0', name: "interactions" }))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-dropdown-menu.cjs.entry.js

@@ -178,7 +178,7 @@ const DropdownMenu = class {
         (_a = tabbables[nextIndex]) === null || _a === void 0 ? void 0 : _a.focus();
     }
     render() {
-        return (index.h(index.Host, { key: 'cb2c5a2237719a61e590aca29c4eddae1987f88e', onFocusout: this.focusOutListener }, index.h("slot", { key: '96a6a5570d7904dad8e906a1e86427addc9bcb1b', name: "toggle" }), index.h("div", { key: '864f70e5ccdbc9366ddc2fce8593112bf3dcd557', popover: "manual", ref: (element) => (this.popoverElement = element) }, index.h("slot", { key: 'da97c38c3dc0d8476e59d76bbc9442cc60b7fc5f' }))));
+        return (index.h(index.Host, { key: '28f8eb6a00bf4a1b139c917e44ce8de42067e8c6', onFocusout: this.focusOutListener }, index.h("slot", { key: 'fcf093b872932b1f604ae3d5f93391189ac60bbb', name: "toggle" }), index.h("div", { key: '2a621a9cdcf5817faf1354640a0062caa5c5fe04', popover: "manual", ref: (element) => (this.popoverElement = element) }, index.h("slot", { key: '68633d9a0c505d120acac96e15058d44e01d9a00' }))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -156,7 +156,7 @@ const Header = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'be2307ac0dd7b904dab98b9939934a66b826b58e', "is-compact": this.isCompact }, index.h("div", { key: 'df33364ae9b770ff89cb1b2fa744bbe444d9aa48', class: "dso-header" }, index.h("div", { key: 'aa283ab329b3ad2ff95c287a14c9ab2e9ce9107b', class: "logo-container" }, index.h("slot", { key: '150276e26091fb0d259a4b6235286dcd47150bdd', name: "logo" })), this.isCompact ? this.renderCompact() : this.renderNormal())));
+        return (index.h(index.Host, { key: 'fbffe5d78c5accb4d35d3416c18bb7254a29cc7f', "is-compact": this.isCompact }, index.h("div", { key: '5c541ab04d09d41dd59fdbca795ac12aa36737f7', class: "dso-header" }, index.h("div", { key: '7ead039c9d347846af8d7a1f632e7f3477486b18', class: "logo-container" }, index.h("slot", { key: '68a984ea68f23e43b752fccc19f04e8eb994c413', name: "logo" })), this.isCompact ? this.renderCompact() : this.renderNormal())));
     }
     renderCompact() {
         return ((this.mainMenu.length > 0 || this.userHomeUrl || this.authStatus !== "none") && (index.h("div", { class: "dropdown" }, index.h("dso-dropdown-menu", { "dropdown-align": "right", dropdownOptionsOffset: this.dropdownOptionsOffset, ref: (element) => (this.dropdownElement = element) }, index.h("button", { type: "button", slot: "toggle" }, index.h("span", null, this.text("menu")), index.h("dso-icon", { icon: "chevron-down" })), index.h("div", { class: "dso-dropdown-options" }, index.h("ul", null, this.mainMenu.map((menuItem) => (index.h(MenuItem, { item: menuItem, onClick: (e) => this.clickHandler(e, "menuItem", { menuItem }), key: menuItem.label }))), this.userHomeUrl && (index.h("li", null, index.h("a", { href: this.userHomeUrl, onClick: (e) => this.clickHandler(e, "userHome", { url: this.userHomeUrl }) }, this.text("userHome")))), this.userProfileUrl && this.userProfileName && this.authStatus === "loggedIn" && (index.h("li", null, index.h("a", { href: this.userProfileUrl, onClick: (e) => this.clickHandler(e, "profile", { url: this.userProfileUrl }) }, this.userProfileName, index.h("span", { class: "profile-label" }, " - Mijn profiel")))), this.authStatus === "loggedOut" && (index.h("li", null, this.loginUrl ? (index.h("a", { href: this.loginUrl, onClick: (e) => this.clickHandler(e, "login", { url: this.loginUrl }) }, this.text("login"))) : (index.h("button", { type: "button", onClick: (e) => this.clickHandler(e, "login") }, this.text("login"))))), this.authStatus === "loggedIn" && (index.h("li", null, this.logoutUrl ? (index.h("a", { href: this.logoutUrl, onClick: (e) => this.clickHandler(e, "logout", { url: this.logoutUrl }) }, this.text("logout"))) : (index.h("button", { type: "button", onClick: (e) => this.clickHandler(e, "logout") }, this.text("logout"))))), this.showHelp && (index.h("li", null, this.helpUrl ? (index.h("a", { href: this.helpUrl, class: "dso-tertiary", onClick: (e) => this.clickHandler(e, "help", { url: this.helpUrl }) }, index.h("span", null, this.text("help")), index.h("dso-icon", { icon: "help" }))) : (index.h("button", { type: "button", class: "dso-tertiary", onClick: (e) => this.clickHandler(e, "help") }, index.h("span", null, this.text("help")), index.h("dso-icon", { icon: "help" })))))))))));

package/dist/cjs/dso-highlight-box.cjs.entry.js

@@ -11,7 +11,7 @@ const HighlightBox = class {
     render() {
         var _a;
         const hasCounter = this.step || !!this.element.querySelector("[slot=icon]");
-        return (index.h(index.Host, { key: 'baa2e7b69d8594b34bb3f87b10e50155fcb8bbeb', "has-counter": hasCounter }, hasCounter && index.h("div", { key: 'e1a29441395455061a92191c2a0d09cac29a1e3d', class: "dso-step-counter" }, (_a = this.step) !== null && _a !== void 0 ? _a : index.h("slot", { key: 'db2bf2c61f04cc0f0a6ac8cd17af5c083cea10f5', name: "icon" })), index.h("slot", { key: '9ab5693fccdaed92f15dce9c7a76b954f5b53693' })));
+        return (index.h(index.Host, { key: '3e6f545e389b9e0b11886e6512a56ff578f4b8a1', "has-counter": hasCounter }, hasCounter && index.h("div", { key: '7ba0529e57274b47810171a3737f3436900e1c5e', class: "dso-step-counter" }, (_a = this.step) !== null && _a !== void 0 ? _a : index.h("slot", { key: '4d1114f4372274819c24208a0d5839933523cae7', name: "icon" })), index.h("slot", { key: '5e77702dfc379e466a6178beb82257b41b040f46' })));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -43,7 +43,7 @@ const HistoryItem = class {
         return this.host.querySelector("[slot='warning']");
     }
     render() {
-        return (index.h(index.Fragment, { key: '2e77d236980aed9e08e35161d001d17f1728a83b' }, index.h("div", { key: 'c0c0be85009c8f7d97c321a5bdbf43bda7a6f64b', class: "history-item-date" }, index.h("slot", { key: '099aefc48360345b5d55f6aebe5f9d29aefe59c9', name: "date" })), index.h("div", { key: 'c4da694c8b9659aecbd6a4594bb5f46dfa372456', class: "history-item-content" }, index.h("div", { key: '9fd28a25b87a15bf57442a7648834d57e6f260e6', class: "history-item-status-message" }, index.h("dso-icon", { key: 'cf331e4b19413148a68bafc6bc1849551bb6f435', icon: this.typeIcons[this.type], "aria-hidden": "true" }), index.h("slot", { key: '8aa1952d43a8bdf28f63d81e3723e8634be9a0be', name: "status" })), this.titleSlottedElement !== null && this.href && (index.h("div", { key: '7128bf286bf5f92c4e061f7b06ad8a709fb88d87', class: "history-item-title" }, index.h("a", { key: '38635bb3ff0de20d5fdb8633bd5699112cfa753b', href: this.href, class: "title-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("slot", { key: '6a0efc08c7f7d4283f6417505bb727dc4bab75d4', name: "title" })))), this.explanationSlottedElement !== null && (index.h("div", { key: '505111ed0bf510619c6814b89f01a4ed96f8e2bd', class: "history-item-explanation" }, index.h("slot", { key: '2b27be5812d5b62e11da7b1a1d4da0c68dd1f625', name: "explanation" }))), this.warningSlottedElement !== null && (index.h("div", { key: '6f6b7e404bf94a00c0835098470d00b70ba5203b', class: "history-item-warning" }, index.h("dso-icon", { key: '1e8c8c07ebed9ccb58f21f9b2a6c279510b19e4b', icon: "status-warning-inline", role: "img", "aria-label": "Waarschuwing" }), index.h("slot", { key: 'df67c18e8aea8dfabf5e9ca5cbd33cb0cba0d47b', name: "warning" }))))));
+        return (index.h(index.Fragment, { key: 'a2c558b685f6c6658732bb2b98bddf709ebb94b4' }, index.h("div", { key: 'e0d2aa64e6ecda1538a21371f8658daf611ff731', class: "history-item-date" }, index.h("slot", { key: '436465cae9f9e28bc1ba2d7469359be5940354a8', name: "date" })), index.h("div", { key: 'd7a4485394a43cc1bb8e5db9fddcb977ed5cf5a1', class: "history-item-content" }, index.h("div", { key: 'd73c9368ecb65fc1b8fc54393416d3e619586caf', class: "history-item-status-message" }, index.h("dso-icon", { key: '8debd5c78e2595fd4d4c300fbc55ab01aca3e1fc', icon: this.typeIcons[this.type], "aria-hidden": "true" }), index.h("slot", { key: 'd5324a4d4551c44aae17b4b66eee9c2f1f480d2d', name: "status" })), this.titleSlottedElement !== null && this.href && (index.h("div", { key: '7f9d7fd07a9404b5587a1f54393152d5415ceac4', class: "history-item-title" }, index.h("a", { key: 'b05dff01d271490082467ad9b8e10e4864568c9a', href: this.href, class: "title-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("slot", { key: '52a904617d6c8acb0da75324772696344e11087c', name: "title" })))), this.explanationSlottedElement !== null && (index.h("div", { key: '6accc3de05b6122d9540ff2cdf26dda7dc9066e4', class: "history-item-explanation" }, index.h("slot", { key: '40ca448364c8aa1c35f014a8cf2e5de79bed6769', name: "explanation" }))), this.warningSlottedElement !== null && (index.h("div", { key: 'fefcad7ef764dcf6918d1b409456820e5949c719', class: "history-item-warning" }, index.h("dso-icon", { key: '96c357399ec8b5aa49e8f5e6254e4c60563972b0', icon: "status-warning-inline", role: "img", "aria-label": "Waarschuwing" }), index.h("slot", { key: 'b8848b26ab839a4eb00e8239447eaa879672066f', name: "warning" }))))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -708,7 +708,7 @@ const Icon = class {
             if (!icon) {
                 throw new TypeError(`Unknown svg: ${this.icon}`);
             }
-            return index.h("span", { key: 'd5680e2f282290bae1f770e157c8495e874d1274', class: "icon-container", innerHTML: icon.svg });
+            return index.h("span", { key: '5f01bf5d366f95e1f47af95c3bd8eda1c103b353', class: "icon-container", innerHTML: icon.svg });
         }
     }
 };
@@ -754,6 +754,7 @@ const iconButtonCss = () => `.dso-tooltip {
   visibility: visible;
 }
 .dso-tooltip .tooltip-inner {
+  --_dt-span-role-paragraph-margin-block: 8px;
   --_dso-alert-success-border-color: #39870c;
   --_dso-alert-error-border-color: #ce3f51;
   --_dso-alert-info-border-color: #6ca4d9;
@@ -979,6 +980,12 @@ const iconButtonCss = () => `.dso-tooltip {
 .dso-secondary {
   padding-inline: calc(8px - 1px);
   padding-block: calc(8px - 1px);
+  border-start-start-radius: var(--_dt-icon-button-border-start-start-radius, 4px);
+  border-start-end-radius: var(--_dt-icon-button-border-start-end-radius, 4px);
+  border-end-end-radius: var(--_dt-icon-button-border-end-end-radius, 4px);
+  border-end-start-radius: var(--_dt-icon-button-border-end-start-radius, 4px);
+  border-block-end-width: var(--_dt-icon-button-border-block-end-width, 1px);
+  border-inline-end-width: var(--_dt-icon-button-border-inline-end-width, 1px);
 }
 
 .dso-tertiary {
@@ -1183,8 +1190,11 @@ const iconButtonCss = () => `.dso-tooltip {
   padding-block: 8px;
   border: 0;
   margin-inline-end: 0;
-  box-shadow: var(--_dso-icon-button-map-box-shadow, 0 0 8px 0 rgba(0, 0, 0, 0.3));
-  border-radius: var(--_dso-icon-button-map-border-radius, 4px);
+  box-shadow: var(--_dt-icon-button-map-box-shadow, 0 0 8px 0 rgba(0, 0, 0, 0.3));
+  border-start-start-radius: var(--_dt-icon-button-border-start-start-radius, 4px);
+  border-start-end-radius: var(--_dt-icon-button-border-start-end-radius, 4px);
+  border-end-end-radius: var(--_dt-icon-button-border-end-end-radius, 4px);
+  border-end-start-radius: var(--_dt-icon-button-border-end-start-radius, 4px);
 }
 
 .icon-button {
@@ -1278,7 +1288,7 @@ const IconButton = class {
         this.cleanUp = undefined;
     }
     render() {
-        return (index.h("button", { key: '5045ce3b4d8d0bf8538501dee9f573ee8f6cee38', ref: (el) => (this.buttonElRef = el), type: "button", disabled: this.disabled, "aria-label": this.label, class: `icon-button dso-${this.variant}`, onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip, onClick: this.handleClick }, index.h("dso-icon", { key: '3ce28c59e0f6c2a137c9f65958765e5ac3d4f239', icon: this.icon }), index.h(tooltip_functionalComponent.Tooltip, { key: 'ed39dd1770074c20e3103067ddc1d32db8d0d2d1', visible: this.showTooltip, onAfterHidden: this.handleHideTooltip, tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tipArrowElRef = element) }, this.label)));
+        return (index.h("button", { key: 'cfa3c7d98955a1965d46abe68e9faea867c55679', ref: (el) => (this.buttonElRef = el), type: "button", disabled: this.disabled, "aria-label": this.label, class: `icon-button dso-${this.variant}`, onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip, onClick: this.handleClick }, index.h("dso-icon", { key: 'f6978374915ba3e9d27c19582114ab2a36838115', icon: this.icon }), index.h(tooltip_functionalComponent.Tooltip, { key: '21e7bd67dd9800cd4d596b41aabf9c338c100e17', visible: this.showTooltip, onAfterHidden: this.handleHideTooltip, tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tipArrowElRef = element) }, this.label)));
     }
 };
 IconButton.style = iconButtonCss();

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

@@ -27,7 +27,7 @@ const InfoButton = class {
         this.dsoToggle.emit({ originalEvent, active: this.active });
     }
     render() {
-        return (index.h(index.Host, { key: '5fc1ae354bfc278bedbca0f2aaaff7a15deb5449', onMouseenter: () => (this.hover = true), onMouseleave: () => (this.hover = false) }, !this.secondary ? (index.h("dso-icon-button", { variant: "tertiary", label: this.label, onDsoClick: (e) => this.handleToggle(e.detail.originalEvent), icon: this.active || this.hover ? "info-active" : "info", ref: (element) => (this.button = element) })) : (
+        return (index.h(index.Host, { key: '081ec92479c56bc53665fc9fb909838cff959c9e', onMouseenter: () => (this.hover = true), onMouseleave: () => (this.hover = false) }, !this.secondary ? (index.h("dso-icon-button", { variant: "tertiary", label: this.label, onDsoClick: (e) => this.handleToggle(e.detail.originalEvent), icon: this.active || this.hover ? "info-active" : "info", ref: (element) => (this.button = element) })) : (
         // ToDo: remove this part in https://github.com/dso-toolkit/dso-toolkit/issues/3350. Tertiary on color already working
         index.h("button", { type: "button", class: "dso-info-secondary", "aria-expanded": typeof this.active === "boolean" ? this.active.toString() : undefined, onClick: (e) => this.handleToggle(e), ref: (element) => (this.buttonSecondary = element) }, index.h("dso-icon", { icon: this.active || this.hover ? "info-active" : "info" }), index.h("span", { class: "sr-only" }, this.label)))));
     }

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

@@ -10,7 +10,7 @@ const Info = class {
         this.dsoClose = index.createEvent(this, "dsoClose", 7);
     }
     render() {
-        return (index.h(index.Fragment, { key: '6ea8fd02c7e0df97ecf3c57a895334f312c513c3' }, index.h("slot", { key: '1721e91318a52c8c4208b2acac069c723c748ec5' }), !this.fixed && (index.h("dso-icon-button", { key: 'fac469f4c2ee028d3f45b83353f038f7cb95fe58', label: "Sluiten", variant: "tertiary", icon: "times", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
+        return (index.h(index.Fragment, { key: '3e0e4c7174c343e0ffe3395a3fb0e4b54c7e6dd1' }, index.h("slot", { key: 'd50d49ce8f6bc9c185e4d8e16a28d1d31d0de520' }), !this.fixed && (index.h("dso-icon-button", { key: '82c25d9bb8b6d203837f23113c8f0bd676ae4064', label: "Sluiten", variant: "tertiary", icon: "times", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
     }
 };
 Info.style = infoCss();
@@ -77,7 +77,7 @@ const Selectable = class {
     render() {
         var _a;
         const hasInfo = !!this.host.querySelector('[slot="info"]');
-        return (index.h(index.Fragment, { key: 'a406bc01d2ece87d87bafc3e83b1011b0eec2853' }, index.h("div", { key: '9e6b486edc6c7e6ad8db1d1d504d502c9adb2267', class: "dso-selectable-container" }, index.h("div", { key: 'c654ecf00751275acf93eb53d82d1c02918957ef', class: "dso-selectable-input-wrapper" }, index.h("input", { key: 'a85b3fb074e5207e34407debd0b04da0524f3955', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.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: '53993c8ad0b15394901fdb6d67bc83aa89385844', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (index.h("dso-info", { key: 'ce3e9bc660c7a5beb36eef42ea1e6089abc9bf96', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, index.h("div", { key: 'b3bf8765cb0d2e616475dfdf0a25998e3d9a637e' }, index.h("slot", { key: '93121b79a8018d9661e9518855147e79d3d917fc', name: "info" })))), index.h("slot", { key: '537024a58257ceecb7abba3b0eb69eac7ef5cc1b', name: "options" })));
+        return (index.h(index.Fragment, { key: '5f11873e66e481aa5bab33f6306445e2f35545c2' }, index.h("div", { key: '2b0176b66b0dce43d57a8b41beac0d62f51ca97c', class: "dso-selectable-container" }, index.h("div", { key: '5fcae509cca4d34d2e0e230a2979bc350d27cc02', class: "dso-selectable-input-wrapper" }, index.h("input", { key: '5aa5ebb20b52467ce6107cf8aa840edb0ad14055', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.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: 'ad7d2150640df363f14eefa8a9f843a2962b58e6', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (index.h("dso-info", { key: 'ebf5eeafc5d6077cf8403c76cff4aca7336fedf5', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, index.h("div", { key: '729d228a00b1c36e3eb1e9cb6d088b081a8847b9' }, index.h("slot", { key: '082ba9b15cf8ea5129aacad5c1de40fc896ffbad', name: "info" })))), index.h("slot", { key: 'c217d7cab8dcc8f34ae0bcc841fdb8d37cde05d6', name: "options" })));
     }
     componentDidRender() {
         if (this.input && typeof this.checked === "boolean" && this.input.checked !== this.checked) {

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

@@ -2,7 +2,7 @@
 
 var index = require('./index-2aek-b9X.js');
 
-const inputRangeCss = () => `:host{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;inline-size:100%}*,*::after,*::before{box-sizing:border-box}.counter{flex-shrink:0;min-inline-size:5ch}.counter.min{text-align:end}.counter.max{text-align:start}.input{flex-grow:1;appearance:none;background-color:transparent;cursor:pointer}.input::-webkit-slider-runnable-track{block-size:0.5rem;background-color:#e5e5e5}.input::-webkit-slider-runnable-track:hover{background-color:#ccc}.input::-webkit-slider-runnable-track{border:1px solid #666;border-radius:0.5rem}.input::-webkit-slider-thumb{block-size:1.5rem;inline-size:1.5rem;appearance:none;margin-block-start:-0.55rem;background-color:#39870c}.input::-webkit-slider-thumb:hover{background-color:#275937}.input::-webkit-slider-thumb{border-radius:50%}.input::-moz-range-track{box-sizing:border-box;block-size:0.5rem;background-color:#e5e5e5}.input::-moz-range-track:hover{background-color:#ccc}.input::-moz-range-track{border:1px solid #666;border-radius:0.5rem}.input::-moz-range-thumb{box-sizing:border-box;block-size:1.5rem;inline-size:1.5rem;appearance:none;margin-block-start:-0.5rem;background-color:#39870c}.input::-moz-range-thumb:hover{background-color:#275937}.input::-moz-range-thumb{border-color:transparent;border-radius:50%}`;
+const inputRangeCss = () => `:host{display:flex;align-items:center;gap:0.625rem;padding-block:0.5rem;inline-size:100%}*,*::after,*::before{box-sizing:border-box}.counter{flex-shrink:0;min-inline-size:20px}.input{flex-grow:1;appearance:none;background-color:transparent;cursor:pointer}.input::-webkit-slider-runnable-track{block-size:0.5rem;background-color:#e5e5e5;border:1px solid #666;border-radius:0.5rem}.input::-webkit-slider-runnable-track:hover{background-color:#ccc}.input::-webkit-slider-thumb{block-size:1.5rem;inline-size:1.5rem;appearance:none;margin-block-start:-0.55rem;background-color:#39870c;border-radius:50%}.input::-webkit-slider-thumb:hover{background-color:#275937}.input::-moz-range-track{box-sizing:border-box;block-size:0.5rem;background-color:#e5e5e5;border:1px solid #666;border-radius:0.5rem}.input::-moz-range-track:hover{background-color:#ccc}.input::-moz-range-thumb{box-sizing:border-box;block-size:1.5rem;inline-size:1.5rem;appearance:none;margin-block-start:-0.5rem;background-color:#39870c;border-radius:50%;border-color:transparent}.input::-moz-range-thumb:hover{background-color:#275937}`;
 
 const InputRange = class {
     constructor(hostRef) {
@@ -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: 'f3796a5bbd719af7fe23c285ba4f1519eaaaf1b9', id: "description", hidden: true }, this.description)), index.h("span", { key: '91eeb869d8529a793ab25c766cb38b75dd388ba7', class: "counter min", "aria-hidden": "true" }, min, this.unit), index.h("input", { key: '98734659f11a5d9793f76b7ebd170b56fe1ef965', type: "range", min: this.min, max: this.max, 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: '7bf4d5d30b928c993bae1f5d25325e73f4b2f760', id: "description", hidden: true }, this.description)), index.h("span", { key: '3806477e5f52f5f95a62d766cd2bb5e9ef60668c', class: "counter", "aria-hidden": "true" }, min, this.unit), index.h("input", { key: 'bfb6213eb4dc7ed7c52f2645952fbeb53a611d8e', type: "range", min: this.min, max: this.max, 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: '04774c80c6ac969cf1338d3b4ea39dabf531539b', class: "counter max", "aria-hidden": "true" }, max, this.unit)));
+            }) }), index.h("span", { key: 'bdd86302b7c2ef717a40f2103faff3dbadd691df', class: "counter", "aria-hidden": "true" }, max, this.unit)));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -102,13 +102,13 @@ const Label = class {
         this.isTruncated = false;
     }
     render() {
-        return (index$1.h(index$1.Fragment, { key: 'f868c06841bb1f9a6f39db8598141634cbe59f5f' }, index$1.h("span", { key: '935d20891b9df19b37cf38242892428c81c12631', "aria-describedby": this.isTruncated ? "toggle-anchor" : null, class: clsx.clsx("dso-label", {
+        return (index$1.h(index$1.Fragment, { key: '7441c0e54f721845869c63348d2e5dff35f24434' }, index$1.h("span", { key: '8cea7acfa1e735eb8a6cdd66d2d447976c84c950', "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: 'e3d5f4d753cf5ca6ef1bef6fae698b3b4c03e5da', name: "symbol" }), index$1.h("span", { key: '242c774421051469948ff841d7b55bf06e9481fd', class: clsx.clsx("dso-label-content", {
+            }) }, index$1.h("slot", { key: '77b62b31482300784b58fb372e28e246773a183f', name: "symbol" }), index$1.h("span", { key: 'f40f50f36c78fec1bcc15c1244defcaac94d5a11', class: clsx.clsx("dso-label-content", {
                 "dso-truncate": !!this.truncate,
-            }), ref: (element) => (this.labelContent = element), tabindex: this.truncate && this.isTruncated ? 0 : undefined, onMouseEnter: () => (this.textHover = true), onMouseLeave: () => (this.textHover = false), onFocus: () => (this.textFocus = true), onBlur: () => (this.textFocus = false) }, index$1.h("slot", { key: '93ae4502166a8c246371249f6b25423ab066e5b7' })), this.removable && (index$1.h("dso-icon-button", { key: '35c535b0943aef1ffc59871b43e2222c7490c6d2', variant: "tertiary", icon: "times", 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("dso-tooltip", { key: '0c0a556cc61f34f782e9da771138e8b0e37e6647', stateless: true, id: "toggle-anchor", active: this.textHover || this.textFocus, position: "top", strategy: "absolute" }, this.labelText))));
+            }), ref: (element) => (this.labelContent = element), tabindex: this.truncate && this.isTruncated ? 0 : undefined, onMouseEnter: () => (this.textHover = true), onMouseLeave: () => (this.textHover = false), onFocus: () => (this.textFocus = true), onBlur: () => (this.textFocus = false) }, index$1.h("slot", { key: '839f0bdcf8271806e9dfdb9c01ba6dd9ba4b9413' })), this.removable && (index$1.h("dso-icon-button", { key: 'df12c751642d42f36d54feeaaf8a53755a5b3b4c', variant: "tertiary", icon: "times", 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("dso-tooltip", { key: 'e38e943fcdf3f05161c24861a31581ff4ca0b2ab', stateless: true, id: "toggle-anchor", active: this.textHover || this.textFocus, position: "top", strategy: "absolute" }, this.labelText))));
     }
     get host() { return index$1.getElement(this); }
     static get watchers() { return {
@@ -199,7 +199,7 @@ const SlideToggle = class {
         this.hasVisibleLabel = this.host.querySelector("*") !== null;
     }
     render() {
-        return (index$1.h(index$1.Fragment, { key: '0f34c376fadba8a62707d91e84f25677fc5690a3' }, index$1.h("button", Object.assign({ key: 'caa9fb16fe1781b355a3f0b9859a07d460c5ec85', 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: '40073a0bd05c1009811be9e892ee4a323a2d9439', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: '9b8ee2e81cd7390998c6e5700a6f7bcb662b876f', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: '5399256e45dc823a7722831e64c7dd5ec0d152f9', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: '2ea153fc376c0889c3c74f8f4440ed1d9dc69659', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: '4bd14e28d33e7af47c386acd8f6e85ad54b6ce84', htmlFor: this.identifier }, index$1.h("slot", { key: 'af963203c5fe7fae6f38d518e11be6e69f75b421' })))));
+        return (index$1.h(index$1.Fragment, { key: '5d9cd03cfa9b00948acd598f149ba1f0ce114cc6' }, index$1.h("button", Object.assign({ key: '1e25ca1b3da0d4292c0fe1219924658e7baaff87', 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: '6dd2f4d1634d50e4cf393387ccadaac6d5a4f55b', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: 'b780f9b330d44fdd41d31a9563ab49fc94424d54', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: '326b18d7ab0e104aed97d8c92d221812c174cde9', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: '4cbdc7cd543f4b5497f943392cd210fcc3c4fa5b', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: '21fe8e599aa5d1e266d2fc606b55607e2570d962', htmlFor: this.identifier }, index$1.h("slot", { key: '4a89a597d67ff4610e42f0d4b2c96cea056e65a4' })))));
     }
     get host() { return index$1.getElement(this); }
 };

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

@@ -40,7 +40,7 @@ const LegendItem = class {
         if (label === null || label === void 0 ? void 0 : label.textContent) {
             accessibleLabel = `Maak ${label.textContent.toLowerCase()} actief`;
         }
-        return (index.h(index.Host, { key: '24af81db658898c1bc2317422cbb6ab38196083d', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h("div", { key: '174173193d7302d22d265e02a4147c6877241d0f', class: clsx.clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (index.h("div", { key: '568089b5a568b92d12665a7c0eb78d3315c2c947' }, index.h("slot", { key: '325f14f024dca0edf52c2684097be1ca5eb6f014', name: "symbol" }))), index.h("div", { key: 'e72d3ac238b30577082a0edc4ab68de1d3b16f15' }, index.h("slot", { key: 'a1b4d6b740bd8a5ee32adcc5e40268bfd472c680', name: "label" })), this.disabled && this.disabledMessage && (index.h("dso-toggletip", { key: '9bc17eafc23c61d8b53005d02fa4aacad6ca2d8d', position: "bottom" }, this.disabledMessage)), index.h("div", { key: '9208ae5adae3f59e0ab0a20c0a32b65cc3fbc40f', class: "legend-item-right-content" }, this.active && hasOptions && !this.disabled && (index.h("dso-icon-button", { key: '6489bc065e692b8dce8edb7a56d1d5672f8d21cd', label: "Opties", icon: "more", variant: "tertiary", class: { active: this.showOptions }, id: "edit-button", onDsoClick: () => (this.showOptions = !this.showOptions) })), this.activatable && (index.h("dso-slide-toggle", { key: 'bb79e502289dd11de8db82d78e00bade9b0a451c', accessibleLabel: accessibleLabel, checked: this.active, disabled: this.disabled, onDsoActiveChange: (e) => this.dsoActiveChange.emit({ current: Boolean(this.active), next: !this.active, originalEvent: e }) })))), hasOptions && (index.h("div", { key: 'a3c74cdd73815b7519c9126d278da02c0281dfb6', hidden: this.disabled || !this.showOptions, class: "options" }, index.h("slot", { key: 'b932318fd0ccb55f02e60e5e49e339453b61d955', name: "options" })))));
+        return (index.h(index.Host, { key: '78c1588776ea46722066f98c3cd5e42fee691658', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h("div", { key: '98d16208d8bb78e5b446fea828cee7984e221840', class: clsx.clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (index.h("div", { key: '470282bf59dee595953ab23d504bac55561a05e9' }, index.h("slot", { key: '18704fee63e5155a903faf696943438d4d5a16f3', name: "symbol" }))), index.h("div", { key: '66ed8e3809ec17de8e4336d994bfbc5b2ce03c6e' }, index.h("slot", { key: '9253e5bf4f42f4aaa65b0b5fb46ee81680ec577a', name: "label" })), this.disabled && this.disabledMessage && (index.h("dso-toggletip", { key: 'c85fbeb0ed74f3e19d1d63cd6ee4d2c8aa77c87e', position: "bottom" }, this.disabledMessage)), index.h("div", { key: '0a990a9375a973f43e3613144d33afe3b304b046', class: "legend-item-right-content" }, this.active && hasOptions && !this.disabled && (index.h("dso-icon-button", { key: 'acfb6d31e56c1227cc26d61becfc0247d84cdebe', label: "Opties", icon: "more", variant: "tertiary", class: { active: this.showOptions }, id: "edit-button", onDsoClick: () => (this.showOptions = !this.showOptions) })), this.activatable && (index.h("dso-slide-toggle", { key: '51f63c178766a4cc1dd6aa3065a50392ce051f83', accessibleLabel: accessibleLabel, checked: this.active, disabled: this.disabled, onDsoActiveChange: (e) => this.dsoActiveChange.emit({ current: Boolean(this.active), next: !this.active, originalEvent: e }) })))), hasOptions && (index.h("div", { key: '6a2f222442d5209c44a637609ca55eba58531d1f', hidden: this.disabled || !this.showOptions, class: "options" }, index.h("slot", { key: 'f07fa29b0c6378e627cd314102cf36ac70291653', name: "options" })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -70,7 +70,7 @@ const Legend = class {
         this.moveFocusToTab(next);
     }
     render() {
-        return (index.h(index.Host, { key: '4f1295cd75af42eeaf438cc7b92604054993bdeb' }, index.h("div", { key: 'f1473d16ec2b6b5035c9aa88dbad40a4233a1529', class: "topbar" }, index.h("div", { key: 'f33777d4ab012cecb17105abb8299426995c86d2', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, this.tabItems.map((tabItem) => (index.h("button", Object.assign({ 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: '8fc17eeefc63ca51e296212eeeadbfc8ab731d18', icon: "times", variant: "tertiary", label: "Sluit legenda", class: "close-button", onClick: (e) => this.dsoClose.emit({ originalEvent: e }) })), index.h("dso-scrollable", { key: '553566be6236dde866e739364e7a19aa918d32a8', class: "content" }, index.h("div", { key: '9348aad31e38e42f208301773d58fa784d71c751', role: "tabpanel", tabIndex: 0 }, index.h("slot", { key: '55fd88c643f65474bb691e4100e493c28b22a358' })))));
+        return (index.h(index.Host, { key: '1e38de893c8ff076a6ad83c26cf407a5cdf17073' }, index.h("div", { key: '4fe41e44062895138f58963a7ff10ddab4adbd43', class: "topbar" }, index.h("div", { key: '18c9d483a25d7145de4b3dd3170f05b3ae974715', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, this.tabItems.map((tabItem) => (index.h("button", Object.assign({ 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: '512f7f454bc0468da2cebd48fdce4fd0ce116731', icon: "times", variant: "tertiary", label: "Sluit legenda", class: "close-button", onClick: (e) => this.dsoClose.emit({ originalEvent: e }) })), index.h("dso-scrollable", { key: 'c761e3abfd57fc98147f4434139d0eba7ef82582', class: "content" }, index.h("div", { key: '0f929de386c1b639bb992ed80151acea164bbc0d', role: "tabpanel", tabIndex: 0 }, index.h("slot", { key: 'c99a9f942498246e90b5a528783856d5eccdb116' })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -356,7 +356,7 @@ const ListButton = class {
     }
     render() {
         const selected = this.checked || (this.count !== undefined && this.count > 0);
-        return (index.h("div", { key: 'a155334345712bda3dd58924d60ccd467923f6fc', class: clsx.clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, index.h("div", { key: '1ac7dbc69f1e7b00fa8cd71b03ae0bbc7c3f98ee', 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: '5f1430413821bc31c793b2ccaed2a00509a3cfc6', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, this.label, this.sublabel && index.h("span", { key: '97302b35983f8659e51b7993619c5d007b9eadc5', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (index.h("span", { key: '8324e5ebf88187d5042e4074a7b5a12cd8eb1fb5', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", index.h("span", { key: '6e0fe1caffbfdfa878b904f558b695def1c18f6f', innerHTML: this.subcontentSlot.innerHTML })))), this.sublabel && index.h("span", { key: '9bfec93907458641755c109304a453ebf728b4ad', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (index.h("div", { key: 'e3feb6e6f3aa1f42efa2e632180459b61a22a7a0', class: "subcontent" }, index.h("slot", { key: '2971bc8037dabb734ecaf3faf1c338a3537fcac6', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (index.h("div", { key: '46543874c528b6db91fed7dd19249dc7547bb86b', class: "dso-input-number" }, this.count > 1 && (index.h(index.Fragment, { key: 'cf2305047c3bf6f8384829c694ef57642bdd9bbf' }, index.h("dso-icon-button", { key: '6170297a6ce2a60762ba4bf96e59f49097e80d38', label: "Aantal verlagen", variant: "tertiary", icon: "minus-circle", disabled: this.count === Number(this.min) || this.disabled, onDsoClick: (e) => this.stepValue(e, "decrement") }), index.h("span", { key: 'e5c419497219f628e34bfdb997fe3b357a9331bd', class: "dso-input-step-counter", "aria-label": "Aantal", "aria-live": "polite" }, this.count))), index.h("dso-icon-button", { key: '225eed4514828a7f1afa06f2c6de8af19ada8b8d', label: "Aantal verhogen", variant: "tertiary", icon: "plus-circle", disabled: this.count === Number(this.max) || this.disabled, onDsoClick: (e) => this.stepValue(e, "increment") })))));
+        return (index.h("div", { key: '93ea558f2766c2aa185b8b204e480aea0f3e597b', class: clsx.clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, index.h("div", { key: 'fe50410a42fc9c949f483acaed5d2d579088ba65', 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: 'a9f0a70891b445c61edfc4fed6a97bbdd5384b54', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, this.label, this.sublabel && index.h("span", { key: 'cad789afe5296230d3ec8efebfc8e4810f674819', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (index.h("span", { key: '6e27d9a2ba1688ef799109e54f3af23e71aafb25', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", index.h("span", { key: 'a8282c51989d9c075e1cdacbce12ed3cd06a66e4', innerHTML: this.subcontentSlot.innerHTML })))), this.sublabel && index.h("span", { key: '3e61110adb2ebfa8aceeca0ffdc39a37b9a725fe', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (index.h("div", { key: '4da19e8864ae1f759ad923e3de185ffc6f25e916', class: "subcontent" }, index.h("slot", { key: 'ea645bd579dbd69e0f7f0a88a857a96fcb68b5c9', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (index.h("div", { key: 'e729bcde79f91f3f2b6e1cd3dfd8b5ae0fdfbd4d', class: "dso-input-number" }, this.count > 1 && (index.h(index.Fragment, { key: '9e8f8b48a771b8fb9e5da71a6453c7317850fbd1' }, index.h("dso-icon-button", { key: '1db9cca2ccbf6cf62989f51b2870ccde61b51b61', label: "Aantal verlagen", variant: "tertiary", icon: "minus-circle", disabled: this.count === Number(this.min) || this.disabled, onDsoClick: (e) => this.stepValue(e, "decrement") }), index.h("span", { key: '994e601af4668a677db361f2e8eb8e84e8553036', class: "dso-input-step-counter", "aria-label": "Aantal", "aria-live": "polite" }, this.count))), index.h("dso-icon-button", { key: 'd72fa5ee6e3fd75fc266a94d1a4a26b3e3805cab', label: "Aantal verhogen", variant: "tertiary", icon: "plus-circle", 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

@@ -169,7 +169,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: 'e3dc493316f373195f1f8cf1c5e190282486796e', 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: 'fe0303b5cd53f11ff30171515fe78a221bbd9d8f', class: "logo-ribbon" }, this.ribbon)));
     }
 };
 Logo.style = logoCss();

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

@@ -46,7 +46,7 @@ const MapBaseLayers = class {
         for (const ref in this.selectableRefs) {
             delete this.selectableRefs[ref];
         }
-        return (index.h("fieldset", { key: 'b4e11afffa1cfeda374e2298e0a127c51733fb9d', class: "form-group dso-radios" }, index.h("legend", { key: '5d5d9deaa63fd457eca1503f460925ca4e51ba25', class: "sr-only" }, "Achtergrond"), index.h("div", { key: 'd804f723a44d4085a7e983d2587da5bde72b4fec', class: "dso-label-container" }, index.h("span", { key: 'da3e550984bbe1b3a055d09100cf3d37cab9fe25', class: "control-label", "aria-hidden": "true" }, this.text("background"))), index.h("div", { key: '419aebdce0570fba7d194c285858c2ced4e416ed', 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: 'f42b4397a73e8b35829c5182ddd79ade3dcd499a', class: "form-group dso-radios" }, index.h("legend", { key: 'b3cdc3e7947dacb4328ed561a3b07f7c806fd494', class: "sr-only" }, "Achtergrond"), index.h("div", { key: 'a59771dceed9a61d3177bd1dda41b0532b22a153', class: "dso-label-container" }, index.h("span", { key: '938d6bca8571175a6a1af729ae1b058b743d4b71', class: "control-label", "aria-hidden": "true" }, this.text("background"))), index.h("div", { key: '0ecb78a9ecf1d28ca2649849427ee996e9924938', 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); }
 };