@dso-toolkit/core 100.2.0 → 100.3.1

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

@@ -32,8 +32,8 @@ const Card = class {
     }
     render() {
         const isSelectable = this.selectableSlottedElement !== null;
-        return (index.h(index.Host, { key: 'af11f19afbdf5c690974495992cf86ccf62ae734', "is-selectable": isSelectable }, index.h("div", { key: '2f125ec9d9b5a69fd7cdc4fb01ea4e00cec96ad2', class: "dso-card-container" }, index.h("div", { key: 'eab8702f667cb0843dadfa38f2d6cb71dfb7bba7', class: "dso-card-selectable", hidden: !isSelectable }, index.h("slot", { key: '417eefbcbe18d47863e7d1b19be0adf9b0571e8b', name: "selectable" })), index.h("div", { key: 'd64d73ebb8167eb572ce3f5e3da23826b93fcd67', class: "dso-card-heading" }, (this.mode === "extern" && (index.h("a", { key: '0ae5c4a841f6dba0fb8c3fc60a831862b9945356', href: this.href, class: "heading-anchor", target: "_blank", rel: "noopener noreferrer", onClick: (e) => this.clickEventHandler(e) }, index.h("slot", { key: 'ef75fd392f3d16a2fb0b6873c5b2578096ac3a27', name: "heading" }), index.h("dso-icon", { key: 'f953d9c38873aebb19f16084134c214562a46ae0', icon: "external-link" }), index.h("span", { key: '1cd61878dcf755959690f2acf1a45ac3924abbf3', class: "sr-only" }, "(Opent andere website in nieuw tabblad)")))) ||
-            (this.mode === "download" && (index.h("a", { key: 'd812c16e45b5268f84d55ad6b03552ec851422e1', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("slot", { key: '3d7e2e421bf95b955977d73361dad5e5d9632f93', name: "heading" }), index.h("dso-icon", { key: '915c00ebb300e2e23211b46dfa298ed2bdda15bc', icon: "download" })))) || (index.h("a", { key: '2261b31aece339c492f1c0eb6121a2fa2b25db8d', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("slot", { key: '62d7f13fe2e9049dfea479b9d50409f80c9fbb2c', name: "heading" }), index.h("dso-icon", { key: 'c229b6343a9aea2627bec89d1d028a792de86c37', icon: "chevron-right" }))), this.interactionsSlottedElement !== null && index.h("slot", { key: '41e52361073ea58b80283d791c2457b774c468f5', name: "interactions" })), index.h("div", { key: 'ec8aa4d8ffc9f28b27f2e049485700d66999a21b', class: "dso-card-content" }, index.h("slot", { key: '182b5bf19a63c16a4519eac84f9b941e0a81e472', name: "content" })))));
+        return (index.h(index.Host, { key: '239305b16722e3ef5d1df2f5a34dc1c8bd6fa941', "is-selectable": isSelectable }, index.h("div", { key: 'dda09722c769d5a20efb3de4c7d03ef4e676c051', class: "dso-card-container" }, index.h("div", { key: 'ae42d84176d062922bdaebce517d984f36d3410c', class: "dso-card-selectable", hidden: !isSelectable }, index.h("slot", { key: '4734836c7971885e8ae84fb919a5aceaa9713f1c', name: "selectable" })), index.h("div", { key: '67035bf8eeb78bdf5ec00d5d5e63aaeb36600971', class: "dso-card-heading" }, (this.mode === "extern" && (index.h("a", { key: '52ec88ae6644d176b676b38f3b5a3b8a4f18d8fb', href: this.href, class: "heading-anchor", target: "_blank", rel: "noopener noreferrer", onClick: (e) => this.clickEventHandler(e) }, index.h("slot", { key: 'b0a930073a356cc0a85e99a738f8d37aafbe490e', name: "heading" }), index.h("dso-icon", { key: '03f039eddd70c41ddb8d95cf133c0917a9073503', icon: "external-link" }), index.h("span", { key: '63f6fb7bc9ecf562015ae04825f43a8f5885c946', class: "sr-only" }, "(Opent andere website in nieuw tabblad)")))) ||
+            (this.mode === "download" && (index.h("a", { key: 'ca38710b591fad28865552b9603dd1e90254535d', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("slot", { key: '2e85110d0435a74373bcc8c46d2b88e21757e9d4', name: "heading" }), index.h("dso-icon", { key: '05101c81b6645297f6fe3b37312bc95f6d05c8bf', icon: "download" })))) || (index.h("a", { key: '6a02cb73fd4cff8d17bdad494fe047a13c93ba85', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("slot", { key: 'e5631df37f950eefad86d94040b7f0fc0ae720b8', name: "heading" }), index.h("dso-icon", { key: '05ba6344294489c0c9299490d126906920d173f9', icon: "chevron-right" }))), this.interactionsSlottedElement !== null && index.h("slot", { key: '7e92b0ace856f9bcc586040cdd2b1c3eea8ca388', name: "interactions" })), index.h("div", { key: 'c994ab7a513a7cee91b1f4b236328224c465831f', class: "dso-card-content" }, index.h("slot", { key: 'ba532ccd9ccaa53dccacb6b5cd392bb042d20fcb', name: "content" })))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-contact-information.cjs.entry.js

@@ -9,7 +9,7 @@ const ContactInformation = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h("div", { key: '375dbed73d8f02ad62b5b84aecc05e26ff46d8cc', class: "dso-contact-information" }, index.h("slot", { key: '847f95d644ef15186aaab9daf486cc71eda87c41', name: "heading" }), index.h("slot", { key: 'c7a73ccd61825a610478115cfec9b50ef192bcba', name: "anchor-items" }), index.h("slot", { key: 'ab039fea18a91acdb778ed9e6cdfc4cbf545d623', name: "info-items" })));
+        return (index.h("div", { key: '0745ce0fe81c6087b6d42904bf45865d12e42a88', class: "dso-contact-information" }, index.h("slot", { key: 'a97cd70246f1ee43c6b2f8f2e73b90719765fdc3', name: "heading" }), index.h("slot", { key: 'bebe2ba23a7a36685196e90028c1bf9dd97970a3', name: "anchor-items" }), index.h("slot", { key: '20f3eca7864ca85d136588ab7b237611e068acb3', name: "info-items" })));
     }
 };
 ContactInformation.style = contactInformationCss();

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

@@ -9,7 +9,7 @@ const CursorTooltip = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '2ed4e32448fad331ea79904f4a067f6c06d973e1', class: "dso-cursor-tooltip" }, index.h("slot", { key: '8216cea26f3e02e5dbe15272558faf3110f02b17' })));
+        return (index.h(index.Host, { key: '347627ca492963e1ab8a2e8cb74d75d757d524aa', class: "dso-cursor-tooltip" }, index.h("slot", { key: '6e7fd839fcf3f7ac9dd608598de54f4f4cb3ae06' })));
     }
 };
 CursorTooltip.style = cursorTooltipCss();

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

@@ -148,7 +148,7 @@ const DsoDatePicker = class {
         return undefined;
     }
     render() {
-        return (index.h("input", { key: 'f41dd14bff4e5634076e2c032df824f0ca9f7f83', 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": this.invalid?.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: '181c385766ca51b1e53cc0d086bb9283c45446a6', 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": this.invalid?.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-CfwUrDXc.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=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]){--_dso-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 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]){--_dso-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,.dso-document-card-status+.dso-document-card-labels{margin-block-start:8px}::slotted([slot=meta]){margin-inline-end:8px}::slotted([slot=status]){margin-inline-end:8px}::slotted([slot=labels]){margin-block-end:0 !important}`;
 
 const DocumentCard = class {
     constructor(hostRef) {
@@ -30,8 +30,11 @@ const DocumentCard = class {
     get interactionsSlottedElement() {
         return this.host.querySelector("[slot='interactions']");
     }
+    get labelsSlottedElement() {
+        return this.host.querySelector("[slot='labels']");
+    }
     render() {
-        return (index.h("div", { key: '4046f10a2e45993afefe33ab3f92c14d6b6963d6', class: "dso-document-card-container" }, index.h("div", { key: '0d72ed7262faf99184904eed86301cfacd77d09b', class: "dso-document-card-heading" }, index.h("a", { key: '1edb52c2ad08a63bdf2d786ed36a33f6477c434c', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("span", { key: '2b7ea520003646ef4d0f93f022f6a9ccc355a67d', class: "icon-container" }, index.h("dso-icon", { key: '3bea6d5d33dbcfd143d58a8e3b1777cc10876944', icon: "chevron-right" }), index.h("slot", { key: 'cee11afecd7ade47d47bde74d37587decebabc49', name: "heading" })))), index.h("div", { key: '4d82525ec2c83fe9a72b785b6ce458a37d4fe915', class: "dso-document-card-type" }, index.h("slot", { key: '69ebf7af4c44cf5afe03074fcf8639a903fb3f36', name: "type" })), index.h("div", { key: '7eea440b8780cf2a541c74f5f644358a8c8b7961', class: "dso-document-card-status" }, this.metaSlottedElement !== null && index.h("slot", { key: '0370eeeb1dc83e5120e77e996f524d60b28afc40', name: "meta" }), index.h("slot", { key: '0750731813a2890b40cbbb02d474452e14d80eb2', name: "status" }), this.interactionsSlottedElement !== null && index.h("slot", { key: '8e8256e3895a7c90f807430f3b84c603355d0950', name: "interactions" }))));
+        return (index.h("div", { key: 'e6674c35c42f2a3cc8f676629a286b86cb1f3a74', class: "dso-document-card-container" }, index.h("div", { key: '9b7ad2d6f3322730273d58da4a6b9ae0def142e5', class: "dso-document-card-heading" }, index.h("a", { key: '9feab84beb061e0319bcbb1de7189941453936e0', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, index.h("span", { key: 'cce85a9f8123be2cd56201fe7075c8a97e1c79ff', class: "icon-container" }, index.h("dso-icon", { key: 'b40a8c6b18f89faf65af0a0b948790d508dbb880', icon: "chevron-right" }), index.h("slot", { key: '85c2d009d0186509269d48aa09d2ca91d9bb7565', name: "heading" })))), index.h("div", { key: 'de7658904c9a7edccbd36929d6dde671e9e3ceb0', class: "dso-document-card-type" }, index.h("slot", { key: '3db3fde661962548bdb17e61261abd2ee2f396e0', name: "type" })), index.h("div", { key: 'ef8420e2f8a1aad65a91928b8e32acbbbe10b1f4', class: "dso-document-card-status" }, this.metaSlottedElement !== null && index.h("slot", { key: 'e76b3d46409a8802b55ba62e55c56a12e6de528a', name: "meta" }), index.h("slot", { key: '27557527b596bca2227289345975e0ab2c54a496', name: "status" }), this.interactionsSlottedElement !== null && index.h("slot", { key: 'a89235cb3ef76a3aa49f3d575d9016cdcc02e74a', name: "interactions" })), this.labelsSlottedElement !== null && (index.h("div", { key: '2b49e7e3ef6bd4c2e1adab954c470e9e958a6d66', class: "dso-document-card-labels" }, index.h("slot", { key: '3ea9405369563511d852abc07d41a673f2ae3a70', name: "labels" })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -22,7 +22,7 @@ const DropdownMenuGroup = class {
     render() {
         const checkable = this.dropdownMenuState?.checkable;
         const labelId = this.label ? v4.v4() : undefined;
-        return (index.h(index.Host, { key: 'f639886cfa9c18db2e9c3736a2e73f57ca25ec6d' }, index.h("div", { key: 'b1e4bfaa31fb2dc7d8de3ca5000bcfbd6a92a953', "aria-labelledby": labelId, role: "group" }, this.label && (index.h("div", { key: 'd6478020f5809b0de212b31a8dca44a08ee54844', id: labelId, class: clsx.clsx("group-label", { checkable }), role: "none" }, this.label)), index.h("slot", { key: '4d41b59001ef3446dcb5cce821be8301a147ea62' }))));
+        return (index.h(index.Host, { key: 'a47b9cc30b25077ebf8d87e42593b6471e459cd2' }, index.h("div", { key: '4731d76aabb0cacbe3a645b6f3b11a961d0a710f', "aria-labelledby": labelId, role: "group" }, this.label && (index.h("div", { key: '64f94ef64b5217e3b23aad96df535584ff7977d5', id: labelId, class: clsx.clsx("group-label", { checkable }), role: "none" }, this.label)), index.h("slot", { key: '94f81e77530b754a83ef748cb5ae6897fa764fb4' }))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -32,7 +32,7 @@ const DropdownMenuItem = class {
     render() {
         const checkable = this.dropdownMenuState?.checkable;
         const checked = checkable ? Boolean(this.checked) : undefined;
-        return (index.h(index.Host, { key: 'a04191fcbe7dffcee56715f8951b2b277d3877f2' }, index.h("div", { key: '43716fef5348565bd4c1561d78daf0ae6cc70aba', role: "none", class: clsx.clsx([{ checkable, checked }]) }, this.type === "button" && (index.h("button", { key: 'b0b85b023be5f29172ab0467e2289f1a83aff5fd', type: "button", role: checkable ? "menuitemradio" : "menuitem", "aria-checked": checked?.toString(), onClick: this.handleClick, ref: (element) => (this.anchorOrButtonRef = element) }, checkable && checked && index.h("dso-icon", { key: '7cdd63f6e510af0a74aded1e682c41fafd7afde1', icon: "check" }), index.h("slot", { key: '241b0076fc3ef8e42f8a3a728a120ec71209dbd9' }))), this.type === "link" && this.href && (index.h("a", { key: '39ee287c71bc3a34e2f0b2893746211061f3dcaf', href: this.href, role: checkable ? "menuitemradio" : "menuitem", "aria-checked": checked?.toString(), onClick: this.handleClick, ref: (element) => (this.anchorOrButtonRef = element) }, checkable && checked && index.h("dso-icon", { key: '8e54196b57b148312c2c03e6d254b8bd47790abe', icon: "check" }), index.h("slot", { key: '5c72fedaaee7841043e4a0249acfe3edcf3eabbb' }))))));
+        return (index.h(index.Host, { key: '5a958be40201eb5abc39592736e65938b5c45de1' }, index.h("div", { key: 'aa535ff81401a9c12e123e913dd19374cd4713cc', role: "none", class: clsx.clsx([{ checkable, checked }]) }, this.type === "button" && (index.h("button", { key: '6ae9656516c19afd1e2c5c22c8678f93d2c41eff', type: "button", role: checkable ? "menuitemradio" : "menuitem", "aria-checked": checked?.toString(), onClick: this.handleClick, ref: (element) => (this.anchorOrButtonRef = element) }, checkable && checked && index.h("dso-icon", { key: '8ab417ad11caeb700a8b9650b1c24772e59cc8a3', icon: "check" }), index.h("slot", { key: '4e7ebcda5cd7ba3469976999bf1e50fd78bf6a9b' }))), this.type === "link" && this.href && (index.h("a", { key: '3ac7e35aa1db310ec3816e2814c3ab3e7b078701', href: this.href, role: checkable ? "menuitemradio" : "menuitem", "aria-checked": checked?.toString(), onClick: this.handleClick, ref: (element) => (this.anchorOrButtonRef = element) }, checkable && checked && index.h("dso-icon", { key: 'be9f20d4269a8dad7df6f8a843b91fb6da46e70d', icon: "check" }), index.h("slot", { key: 'a2396cb075a7f91a8d3a766e3509a34eac7f7367' }))))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -5,7 +5,7 @@ var floatingUi_dom = require('./floating-ui.dom-BKTTOpb1.js');
 var index$1 = require('./index-EngjN4P3.js');
 var v4 = require('./v4-_2BfiRUa.js');
 
-const dropdownMenuCss = () => `:host(:focus) {   outline: none; }  :host {   display: inline-block; }  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-primary {   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-primary:focus, button.dso-primary:focus-visible {   outline-offset: 2px; } button.dso-primary:active {   outline: 0; } button.dso-primary.extern::after, button.dso-primary.download::after {   content: "";   display: inline-block; } button.dso-primary {   background-color: var(--_dso-button-primary-background-color, #39870c);   border-color: var(--_dso-button-primary-border-color, #39870c);   color: var(--_dso-button-primary-color, #fff);   float: var(--_dso-button-float-primary, 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-primary:hover {   background-color: var(--_dso-button-primary-hover-background-color, #275937);   border-color: var(--_dso-button-primary-hover-border-color, #275937);   color: var(--_dso-button-primary-hover-color, #fff);   float: var(--_dso-button-float-primary, none); } button.dso-primary:active {   background-color: var(--_dso-button-primary-active-background-color, #173521);   border-color: var(--_dso-button-primary-active-border-color, #173521);   color: var(--_dso-button-primary-active-color, #fff);   float: var(--_dso-button-float-primary, none); } button.dso-primary[disabled], button.dso-primary[disabled]:hover {   background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d);   border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d);   color: var(--_dso-button-primary-disabled-color, #fff);   float: var(--_dso-button-float-primary, none); } button.dso-primary.dso-small {   line-height: 1rem; } button.dso-primary.dso-small dso-icon, button.dso-primary.dso-small.extern::after, button.dso-primary.dso-small.download::after, button.dso-primary.dso-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-primary.dso-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-primary.dso-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-primary.dso-extra-small {   line-height: 1rem; } button.dso-primary.dso-extra-small dso-icon, button.dso-primary.dso-extra-small.extern::after, button.dso-primary.dso-extra-small.download::after, button.dso-primary.dso-extra-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-primary.dso-extra-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-primary.dso-extra-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-primary.dso-extra-small {   padding-block: 9px; } button.dso-primary dso-icon:has(+ span:not(.sr-only)) {   margin-inline-start: -8px; } button.dso-primary span:not(.sr-only) + dso-icon {   margin-inline-start: 8px;   margin-inline-end: -8px; } button.dso-primary dso-icon + span:not(.sr-only) {   margin-inline-start: 8px; } button.dso-primary.dso-spinner-left[disabled], button.dso-primary.dso-spinner-right[disabled] {   background-color: #39870c;   border-color: #39870c;   color: #fff; } button.dso-primary.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: %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-primary.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: %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 {   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; } 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-icon {   margin-inline-start: 8px; } button:not(.dso-tertiary) dso-icon {   margin-inline-end: 0; }  .dso-dropdown-options {   box-sizing: border-box;   margin: 0 !important;   overflow: unset;   background-clip: padding-box;   background-color: #fff;   border-radius: 4px;   border: 1px solid rgba(0, 0, 0, 0.15);   box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.4);   font-size: 1rem;   min-inline-size: 160px;   inline-size: max-content;   padding: 0;   z-index: 220; }  ::slotted(dso-dropdown-menu-group:not(:last-child)) {   border-block-end: 1px solid #e5e5e5;   margin-block-end: 11px;   padding-block-end: 11px; }`;
+const dropdownMenuCss = () => `:host(:focus) {   outline: none; }  :host {   display: inline-block; }  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-primary {   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-primary:focus, button.dso-primary:focus-visible {   outline-offset: 2px; } button.dso-primary:active {   outline: 0; } button.dso-primary.extern::after, button.dso-primary.download::after {   content: "";   display: inline-block; } button.dso-primary {   background-color: var(--_dso-button-primary-background-color, #39870c);   border-color: var(--_dso-button-primary-border-color, #39870c);   color: var(--_dso-button-primary-color, #fff);   float: var(--_dso-button-float-primary, 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-primary:hover {   background-color: var(--_dso-button-primary-hover-background-color, #275937);   border-color: var(--_dso-button-primary-hover-border-color, #275937);   color: var(--_dso-button-primary-hover-color, #fff);   float: var(--_dso-button-float-primary, none); } button.dso-primary:active {   background-color: var(--_dso-button-primary-active-background-color, #173521);   border-color: var(--_dso-button-primary-active-border-color, #173521);   color: var(--_dso-button-primary-active-color, #fff);   float: var(--_dso-button-float-primary, none); } button.dso-primary[disabled], button.dso-primary[disabled]:hover {   background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d);   border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d);   color: var(--_dso-button-primary-disabled-color, #fff);   float: var(--_dso-button-float-primary, none); } button.dso-primary.dso-small {   line-height: 1rem; } button.dso-primary.dso-small dso-icon, button.dso-primary.dso-small.extern::after, button.dso-primary.dso-small.download::after, button.dso-primary.dso-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-primary.dso-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-primary.dso-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-primary.dso-extra-small {   line-height: 1rem; } button.dso-primary.dso-extra-small dso-icon, button.dso-primary.dso-extra-small.extern::after, button.dso-primary.dso-extra-small.download::after, button.dso-primary.dso-extra-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-primary.dso-extra-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-primary.dso-extra-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-primary.dso-extra-small {   padding-block: 9px; } button.dso-primary dso-icon:has(+ span:not(.sr-only)) {   margin-inline-start: -8px; } button.dso-primary span:not(.sr-only) + dso-icon {   margin-inline-start: 8px;   margin-inline-end: -8px; } button.dso-primary dso-icon + span:not(.sr-only) {   margin-inline-start: 8px; } button.dso-primary.dso-spinner-left[disabled], button.dso-primary.dso-spinner-right[disabled] {   background-color: #39870c;   border-color: #39870c;   color: #fff; } button.dso-primary.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: %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-primary.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: %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 {   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; } 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-icon {   margin-inline-start: 8px; } button:not(.dso-tertiary) dso-icon {   margin-inline-end: 0; }  .dso-dropdown-options {   box-sizing: border-box;   margin: 0 !important;   overflow: unset;   background-clip: padding-box;   background-color: #fff;   border-radius: 4px;   border: 1px solid rgba(0, 0, 0, 0.15);   box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.4);   font-size: 1rem;   min-inline-size: 160px;   inline-size: max-content;   padding: 0;   z-index: 220;   --_dso-scrollable-block-size: auto; }  ::slotted(dso-dropdown-menu-group:not(:last-child)) {   border-block-end: 1px solid #e5e5e5;   margin-block-end: 11px;   padding-block-end: 11px; }`;
 
 const DropdownMenu = class {
     constructor(hostRef) {
@@ -206,7 +206,7 @@ const DropdownMenu = class {
     }
     render() {
         const buttonId = v4.v4();
-        return (index.h(index.Host, { key: '86c4a174ec1a4f8083f6e13728bef4d0fbf73d2b', onFocusout: this.focusOutListener, onKeyDown: this.keyDownHandler }, this.label && (index.h("button", { key: '6b93303a8ee2717870bc52147667485e9f56c0cb', id: buttonId, class: `dso-${this.variant}`, type: "button", onClick: () => this.toggleOptions(), "aria-expanded": this.open.toString(), "aria-haspopup": "menu", ref: (element) => (this.button = element) }, this.label, index.h("dso-icon", { key: '02d4af678a2de9e68c6c7983279e8a8af1b221d5', icon: this.open ? "chevron-up" : "chevron-down" }))), index.h("div", { key: '0653885c62d4e5f9e6567cd1a06ef1f60c31bd50', popover: "manual", class: "dso-dropdown-options", "aria-labelledby": buttonId, role: "menu", ref: (element) => (this.popoverElement = element) }, index.h("dso-scrollable", { key: '008a6527bce7398d5bf016431c90343011b62596' }, index.h("slot", { key: 'cbfdd95cd211485fc8672e9dff1f3bb3ed233d99' })))));
+        return (index.h(index.Host, { key: 'd6eecca58b117e847ed5e2d6c4749ccf1cf45ade', onFocusout: this.focusOutListener, onKeyDown: this.keyDownHandler }, this.label && (index.h("button", { key: '7bd4e3718dd56a7ed820fd7a0bff73299387bca0', id: buttonId, class: `dso-${this.variant}`, type: "button", onClick: () => this.toggleOptions(), "aria-expanded": this.open.toString(), "aria-haspopup": "menu", ref: (element) => (this.button = element) }, this.label, index.h("dso-icon", { key: 'f3db2d02fb532d0dce562de99447be5d2ba93111', icon: this.open ? "chevron-up" : "chevron-down" }))), index.h("div", { key: 'b599fc40124282b4afd1f78e346dd736717ece81', popover: "manual", class: "dso-dropdown-options", "aria-labelledby": buttonId, role: "menu", ref: (element) => (this.popoverElement = element) }, index.h("dso-scrollable", { key: 'ab2517807d8a940ce8d4fae40f9d657b416724dc' }, index.h("slot", { key: '746e632a7bf1e9e7d585dcf71660ef2944799db8' })))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-grid-column.cjs.entry.js

@@ -92,7 +92,7 @@ const GridColumn = class {
         this.resizeObserver = undefined;
     }
     render() {
-        return (index.h(index.Host, { key: '73c7d20be67a5e8930429f249d1bd56fe7edc0a1' }, this.overlayActive ? (index.h("dialog", { class: "grid-column-content", ref: (element) => (this.dialogElement = element), onClick: this.handleDialogClick, onCancel: this.handleDialogCancel, onClose: this.handleDialogClose }, index.h("slot", null))) : (index.h("div", { class: "grid-column-content" }, index.h("slot", null)))));
+        return (index.h(index.Host, { key: 'e02e6fcc5aa1c2e279c36cfab5bf661df6099c49' }, this.overlayActive ? (index.h("dialog", { class: "grid-column-content", ref: (element) => (this.dialogElement = element), onClick: this.handleDialogClick, onCancel: this.handleDialogCancel, onClose: this.handleDialogClose }, index.h("slot", null))) : (index.h("div", { class: "grid-column-content" }, index.h("slot", null)))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -35,7 +35,7 @@ const MenuItem = ({ item, onClick, key, ref }) => {
     return (index.h("li", { class: clsx.clsx({ "dso-active": item.active }), key: key, ref: ref }, index.h("a", { href: item.url, "aria-current": item.active ? "page" : undefined, onClick: onClick }, item.label)));
 };
 
-const headerCss = () => `*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([is-compact]) ::slotted([slot=logo]){--_dso-logo-block-size:2.5rem !important}:host([is-compact]) .dso-header{flex-wrap:nowrap}:host([is-compact]) .dropdown-menu .dropdown-menu-options{inline-size:100%}:host(:not([is-compact])) .dso-header{align-items:center}:host(:not([is-compact])) .dropdown-menu .dropdown-menu-options{inline-size:375px}div[popover]{margin:0 !important;border:0;padding:0;background-color:transparent;overflow:unset;inline-size:max-content}.dso-header{border-block-end:1px solid #ccc;display:flex;flex-wrap:wrap;position:relative}.dso-header .dso-nav{border:0}.logo-container{flex:1 1 12.5rem;margin-inline-end:24px;padding-block-end:16px;padding-block-start:16px}.dso-header-session{display:flex;align-items:center;margin-inline-start:auto}.dso-header-session .profile .dso-tertiary,.dso-header-session .login .dso-tertiary,.dso-header-session .logout .dso-tertiary,.dso-header-session .help .dso-tertiary{display:flex;cursor:pointer;border:0;background-color:transparent;padding-inline:0;outline-offset:2px;font-family:Asap, sans-serif;color:#39870c;font-size:1rem;font-weight:600;line-height:1.5;text-decoration:none}.dso-header-session .profile .dso-tertiary:hover,.dso-header-session .login .dso-tertiary:hover,.dso-header-session .logout .dso-tertiary:hover,.dso-header-session .help .dso-tertiary:hover{text-decoration:underline}.dso-header-session .profile+.logout,.dso-header-session .logout+.help,.dso-header-session .login+.help{border-inline-start:3px solid #ccc;margin-inline-start:8px;padding-inline-start:8px}.dso-header-session .help a,.dso-header-session .help button{display:flex}.dso-navbar{flex-basis:100%;max-inline-size:100%;position:relative}.dropdown-menu button{align-items:center;background-color:transparent;border:0;color:#39870c;display:flex;font-family:Asap, sans-serif;font-size:1rem;font-weight:600;line-height:normal;letter-spacing:inherit;position:relative}.dropdown-menu button::after{margin-inline-start:8px;position:absolute;inset-inline-end:0;inset-block-start:50%;transform:translateY(-50%)}.dropdown-menu button:hover,.dropdown-menu button:active{cursor:pointer;text-decoration:underline}.dropdown-menu button dso-icon{inline-size:24px;block-size:24px;margin-inline-start:8px;padding-block-start:2px}.dropdown-menu button[aria-expanded=true] dso-icon{transform:rotate(180deg)}.dropdown-menu .dropdown-menu-options{box-sizing:border-box;background-clip:padding-box;background-color:#fff;border:0;border-radius:0;box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.4);font-size:1rem;min-inline-size:160px;padding-inline:0;z-index:220}.dropdown-menu .dropdown-menu-options ul{margin:0;padding:0;list-style:none}.dropdown-menu .dropdown-menu-options ul:not(:last-child){border-block-end:1px solid #e5e5e5;margin-block-end:11px;padding-block-end:11px}.dropdown-menu .dropdown-menu-options ul li{list-style:none}.dropdown-menu .dropdown-menu-options ul li a,.dropdown-menu .dropdown-menu-options ul li button{text-decoration:none}.dropdown-menu .dropdown-menu-options ul li a:hover,.dropdown-menu .dropdown-menu-options ul li a:focus-visible,.dropdown-menu .dropdown-menu-options ul li a:active,.dropdown-menu .dropdown-menu-options ul li button:hover,.dropdown-menu .dropdown-menu-options ul li button:focus-visible,.dropdown-menu .dropdown-menu-options ul li button:active{text-decoration:underline}.dropdown-menu .dropdown-menu-options ul li a,.dropdown-menu .dropdown-menu-options ul li button{clear:both;color:#275937;display:block;font-size:1.25rem;font-weight:400;line-height:1.5;padding:16px;text-decoration:none;white-space:nowrap}.dropdown-menu .dropdown-menu-options ul li a:hover,.dropdown-menu .dropdown-menu-options ul li a:focus,.dropdown-menu .dropdown-menu-options ul li button:hover,.dropdown-menu .dropdown-menu-options ul li button:focus{background-color:#39870c;border-color:#39870c;color:#fff;text-decoration:none}.dropdown-menu .dropdown-menu-options ul li a:focus-visible,.dropdown-menu .dropdown-menu-options ul li button:focus-visible{background-color:#39870c;color:#fff}.dropdown-menu .dropdown-menu-options ul li a:hover,.dropdown-menu .dropdown-menu-options ul li a:hover:visited,.dropdown-menu .dropdown-menu-options ul li button:hover,.dropdown-menu .dropdown-menu-options ul li button:hover:visited{color:#275937}.dropdown-menu .dropdown-menu-options ul li a:hover,.dropdown-menu .dropdown-menu-options ul li button:hover{background-color:#fff;text-decoration:underline}.dropdown-menu .dropdown-menu-options ul li a:visited,.dropdown-menu .dropdown-menu-options ul li button:visited{color:#fff}.dropdown-menu .dropdown-menu-options ul li a:visited:not(:hover):not(:focus):not(:focus-visible),.dropdown-menu .dropdown-menu-options ul li button:visited:not(:hover):not(:focus):not(:focus-visible){color:#275937}.dropdown-menu .dropdown-menu-options ul li.dso-active a{font-weight:600}.dropdown-menu .dropdown-menu-options ul li+li{border-block-start:1px solid #ccc}.dropdown{margin-inline-start:auto;display:flex;align-items:center}.dropdown .dropdown-menu{position:static}.dropdown .dropdown-menu .dropdown-menu-options{inset-inline-end:0;inset-block-start:100%;box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.4)}.dso-nav.ready .menu-user-home{margin-inline-start:auto}.dso-nav{align-items:end;column-gap:32px;display:flex;list-style:none;margin-block-end:0;margin-block-start:0;padding-inline-start:0}.dso-nav>li{margin-block-end:4px}.dso-nav>li>a{display:block}.dso-nav>li>a,.dso-nav>li>a:hover,.dso-nav>li>a:focus,.dso-nav>li>a:visited{color:#275937}.dso-nav>li.dso-active,.dso-nav>li.is-active{margin-block-end:0}.dso-nav>li.dso-active>a,.dso-nav>li.is-active>a{border-block-end:4px solid #8b4a6a;font-weight:bold}.dso-nav.dso-nav-main{display:flex !important}.dso-nav.dso-nav-main>li>a{text-decoration:none}.dso-nav.dso-nav-main>li>a:hover,.dso-nav.dso-nav-main>li>a:focus-visible,.dso-nav.dso-nav-main>li>a:active{text-decoration:underline}.dso-nav.dso-nav-main>li>a{font-size:1.25em;line-height:1;padding-block:16px;padding-inline:0;white-space:nowrap}.dso-nav.dso-nav-main .dropdown-menu .dropdown-menu-options{inset-inline-start:-1rem !important;inset-block-start:3px !important}.dso-nav.dso-nav-main .dropdown-menu button{font-size:1.25em;line-height:1;padding-block:16px;padding-inline:0;align-items:flex-end;color:#275937}.dso-nav.dso-nav-main .dropdown-menu button:hover,.dso-nav.dso-nav-main .dropdown-menu button:active{cursor:pointer;text-decoration:underline}.dso-nav.dso-nav-main .dropdown-menu button::after{margin-inline-start:8px;position:absolute;inset-inline-end:0px;inset-block-start:auto;transform:none}.dso-nav .main-menu-item-icon{block-size:1em;margin-inline-end:8px;position:relative;inset-block-start:-2px;inline-size:1.2em}.dso-nav .dropdown-menu-item .main-menu-item-icon{margin-inline-end:0}`;
+const headerCss = () => `*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([is-compact]) ::slotted([slot=logo]){--_dso-logo-block-size:2.5rem !important}:host([is-compact]) .dso-header{flex-wrap:nowrap}:host([is-compact]) .dropdown-menu .dropdown-menu-options{inline-size:100%}:host(:not([is-compact])) .dso-header{align-items:center}:host(:not([is-compact])) .dropdown-menu .dropdown-menu-options{inline-size:375px}div[popover]{margin:0 !important;border:0;padding:0;background-color:transparent;overflow:unset;inline-size:max-content}.dso-header{border-block-end:1px solid #ccc;display:flex;flex-wrap:wrap;position:relative}.dso-header .dso-nav{border:0}.logo-container{flex:1 1 12.5rem;margin-inline-end:24px;padding-block-end:16px;padding-block-start:16px}.dso-header-session{display:flex;align-items:center;margin-inline-start:auto}.dso-header-session .profile .dso-tertiary,.dso-header-session .login .dso-tertiary,.dso-header-session .logout .dso-tertiary,.dso-header-session .help .dso-tertiary{display:flex;cursor:pointer;border:0;background-color:transparent;padding-inline:0;outline-offset:2px;font-family:Asap, sans-serif;color:#39870c;font-size:1rem;font-weight:600;line-height:1.5;text-decoration:none}.dso-header-session .profile .dso-tertiary:hover,.dso-header-session .login .dso-tertiary:hover,.dso-header-session .logout .dso-tertiary:hover,.dso-header-session .help .dso-tertiary:hover{text-decoration:underline}.dso-header-session .profile+.logout,.dso-header-session .logout+.help,.dso-header-session .login+.help{border-inline-start:3px solid #ccc;margin-inline-start:8px;padding-inline-start:8px}.dso-header-session .help a,.dso-header-session .help button{display:flex}.dso-navbar{flex-basis:100%;max-inline-size:100%;position:relative}.dropdown-menu button{align-items:center;background-color:transparent;border:0;color:#39870c;display:flex;font-family:Asap, sans-serif;font-size:1rem;font-weight:600;line-height:normal;letter-spacing:inherit;position:relative}.dropdown-menu button::after{margin-inline-start:8px;position:absolute;inset-inline-end:0;inset-block-start:50%;transform:translateY(-50%)}.dropdown-menu button:hover,.dropdown-menu button:active{cursor:pointer;text-decoration:underline}.dropdown-menu button dso-icon{inline-size:24px;block-size:24px;margin-inline-start:8px;padding-block-start:2px}.dropdown-menu button[aria-expanded=true] dso-icon{transform:rotate(180deg)}.dropdown-menu .dropdown-menu-options{box-sizing:border-box;background-clip:padding-box;background-color:#fff;border:0;border-radius:0;box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.4);font-size:1rem;min-inline-size:160px;padding-inline:0;z-index:220;--_dso-scrollable-block-size:auto}.dropdown-menu .dropdown-menu-options ul{margin:0;padding:0;list-style:none}.dropdown-menu .dropdown-menu-options ul:not(:last-child){border-block-end:1px solid #e5e5e5;margin-block-end:11px;padding-block-end:11px}.dropdown-menu .dropdown-menu-options ul li{list-style:none}.dropdown-menu .dropdown-menu-options ul li a,.dropdown-menu .dropdown-menu-options ul li button{text-decoration:none}.dropdown-menu .dropdown-menu-options ul li a:hover,.dropdown-menu .dropdown-menu-options ul li a:focus-visible,.dropdown-menu .dropdown-menu-options ul li a:active,.dropdown-menu .dropdown-menu-options ul li button:hover,.dropdown-menu .dropdown-menu-options ul li button:focus-visible,.dropdown-menu .dropdown-menu-options ul li button:active{text-decoration:underline}.dropdown-menu .dropdown-menu-options ul li a,.dropdown-menu .dropdown-menu-options ul li button{clear:both;color:#275937;display:block;font-size:1.25rem;font-weight:400;line-height:1.5;padding:16px;text-decoration:none;white-space:nowrap}.dropdown-menu .dropdown-menu-options ul li a:hover,.dropdown-menu .dropdown-menu-options ul li a:focus,.dropdown-menu .dropdown-menu-options ul li button:hover,.dropdown-menu .dropdown-menu-options ul li button:focus{background-color:#39870c;border-color:#39870c;color:#fff;text-decoration:none}.dropdown-menu .dropdown-menu-options ul li a:focus-visible,.dropdown-menu .dropdown-menu-options ul li button:focus-visible{background-color:#39870c;color:#fff}.dropdown-menu .dropdown-menu-options ul li a:hover,.dropdown-menu .dropdown-menu-options ul li a:hover:visited,.dropdown-menu .dropdown-menu-options ul li button:hover,.dropdown-menu .dropdown-menu-options ul li button:hover:visited{color:#275937}.dropdown-menu .dropdown-menu-options ul li a:hover,.dropdown-menu .dropdown-menu-options ul li button:hover{background-color:#fff;text-decoration:underline}.dropdown-menu .dropdown-menu-options ul li a:visited,.dropdown-menu .dropdown-menu-options ul li button:visited{color:#fff}.dropdown-menu .dropdown-menu-options ul li a:visited:not(:hover):not(:focus):not(:focus-visible),.dropdown-menu .dropdown-menu-options ul li button:visited:not(:hover):not(:focus):not(:focus-visible){color:#275937}.dropdown-menu .dropdown-menu-options ul li.dso-active a{font-weight:600}.dropdown-menu .dropdown-menu-options ul li+li{border-block-start:1px solid #ccc}.dropdown{margin-inline-start:auto;display:flex;align-items:center}.dropdown .dropdown-menu{position:static}.dropdown .dropdown-menu .dropdown-menu-options{inset-inline-end:0;inset-block-start:100%;box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.4)}.dso-nav.ready .menu-user-home{margin-inline-start:auto}.dso-nav{align-items:end;column-gap:32px;display:flex;list-style:none;margin-block-end:0;margin-block-start:0;padding-inline-start:0}.dso-nav>li{margin-block-end:4px}.dso-nav>li>a{display:block}.dso-nav>li>a,.dso-nav>li>a:hover,.dso-nav>li>a:focus,.dso-nav>li>a:visited{color:#275937}.dso-nav>li.dso-active,.dso-nav>li.is-active{margin-block-end:0}.dso-nav>li.dso-active>a,.dso-nav>li.is-active>a{border-block-end:4px solid #8b4a6a;font-weight:bold}.dso-nav.dso-nav-main{display:flex !important}.dso-nav.dso-nav-main>li>a{text-decoration:none}.dso-nav.dso-nav-main>li>a:hover,.dso-nav.dso-nav-main>li>a:focus-visible,.dso-nav.dso-nav-main>li>a:active{text-decoration:underline}.dso-nav.dso-nav-main>li>a{font-size:1.25em;line-height:1;padding-block:16px;padding-inline:0;white-space:nowrap}.dso-nav.dso-nav-main .dropdown-menu .dropdown-menu-options{inset-inline-start:-1rem !important;inset-block-start:3px !important}.dso-nav.dso-nav-main .dropdown-menu button{font-size:1.25em;line-height:1;padding-block:16px;padding-inline:0;align-items:flex-end;color:#275937}.dso-nav.dso-nav-main .dropdown-menu button:hover,.dso-nav.dso-nav-main .dropdown-menu button:active{cursor:pointer;text-decoration:underline}.dso-nav.dso-nav-main .dropdown-menu button::after{margin-inline-start:8px;position:absolute;inset-inline-end:0px;inset-block-start:auto;transform:none}.dso-nav .main-menu-item-icon{block-size:1em;margin-inline-end:8px;position:relative;inset-block-start:-2px;inline-size:1.2em}.dso-nav .dropdown-menu-item .main-menu-item-icon{margin-inline-end:0}`;
 
 const minDesktopViewportWidth = 992;
 const Header = class {
@@ -302,7 +302,7 @@ const Header = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '931dc1762425cf848f2cc1570a5b32334e7475b4', "is-compact": this.isCompact }, index.h("div", { key: '64ace8bce4093b7de3480da9ddf815a608cbcba0', class: "dso-header" }, index.h("div", { key: '48d423ba2cc9597823df24ddf5b17f4a68d7e551', class: "logo-container" }, index.h("slot", { key: '2e3a9ceb11a5996543285f3638c2dd07f5108ca4', name: "logo" })), this.isCompact ? this.renderCompact() : this.renderNormal())));
+        return (index.h(index.Host, { key: '70ed6e8dc9a02875dd773c205af3549b324dfb8e', "is-compact": this.isCompact }, index.h("div", { key: 'ab3f94264421bca5caec2ae59f5b40f6934a440e', class: "dso-header" }, index.h("div", { key: 'f092ce977dcd3acd0d9620af8506cb138ee1f0a7', class: "logo-container" }, index.h("slot", { key: '898f5c094fd6dd18ec4e843a240c31081e2a9253', name: "logo" })), this.isCompact ? this.renderCompact() : this.renderNormal())));
     }
     tabbables(withButton) {
         const tabbables = this.dropdownElement ? index_esm.tabbable(this.dropdownElement) : [];

package/dist/cjs/dso-hero-image.cjs.entry.js

@@ -9,7 +9,7 @@ const HeroImage = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '7c30ba2c5660bc9b428949f4f6764e08fba8d8c8' }, index.h("slot", { key: 'eb65537dce2c8422fc2c609632aaa9770831297e', name: "image" }), index.h("div", { key: '5faa577dc81d1d959dd8645f6c20187088aa5605', class: "hero-image-container" }, index.h("slot", { key: '8dfe7c0a62775948e9f4d92333200dc77a3ca573' }))));
+        return (index.h(index.Host, { key: '58986f7f8ff51ad08e4a6cecfc8b69b7f534ce59' }, index.h("slot", { key: '3de9aa7aeb53413ddc4bf442a8e20227a8f94710', name: "image" }), index.h("div", { key: '16a40d270ae8eebd3213222a20672c6213302d97', class: "hero-image-container" }, index.h("slot", { key: '8a6817e250897a98ad525a1ca5f5775e04814ef3' }))));
     }
 };
 HeroImage.style = heroImageCss();

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

@@ -10,7 +10,7 @@ const HighlightBox = class {
     }
     render() {
         const hasCounter = this.step || !!this.element.querySelector("[slot=icon]");
-        return (index.h(index.Host, { key: '3f403b11a77983f350a586d3e399d9d643a5f811', "has-counter": hasCounter }, hasCounter && (index.h("div", { key: 'bdc42b95c78bbec4af466b4a84ecb4b02f561e23', class: "dso-step-counter", "aria-hidden": "true" }, this.step ?? index.h("slot", { key: 'ee8165e3d3d9208294531fdfe9dbd42a455e6509', name: "icon" }))), index.h("slot", { key: 'd3279de601388485b296e13c1415b179f69b0591' })));
+        return (index.h(index.Host, { key: 'a31042efc0e6676e06f08765d05320c2debe0b87', "has-counter": hasCounter }, hasCounter && (index.h("div", { key: 'ae5f42277bd801d07ac66467c652e211c8e8fe14', class: "dso-step-counter", "aria-hidden": "true" }, this.step ?? index.h("slot", { key: '7d8424c37b64775e83f34eb3f2165e8965c428bd', name: "icon" }))), index.h("slot", { key: '22edb75de8bb54565157a80a7be1ab82b7b12773' })));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -42,7 +42,7 @@ const HistoryItem = class {
         return this.host.querySelector("[slot='warning']");
     }
     render() {
-        return (index.h("div", { key: '27087f663a39e6d805adf7b1da3db2adadcbf5c9', class: "history-item" }, index.h("div", { key: '90417592ddc3cecec81c670f53f071ef51d7436f', class: "history-item-date" }, index.h("slot", { key: '71955c1a77d41683298e863c631c04d5ced10fd7', name: "date" })), index.h("div", { key: '4e2c0ad8a72e8671296a57e8dad61c94398ed396', class: "history-item-content" }, index.h("div", { key: '2cd2d65d3f889000f5e5e5dde35bd776d13569e7', class: "history-item-status-message" }, index.h("dso-icon", { key: '3f83e54705b31eb22610a16b83587429764c2def', icon: this.typeIcons[this.type], "aria-hidden": "true" }), index.h("slot", { key: '13516e1f9c14db2fbb81baca7a49b170a5a1ce65', name: "status" })), this.titleSlottedElement !== null && this.href && (index.h("div", { key: '82c28d0d8d6861e0bac768d2d14cc2a7e7c78e95', class: "history-item-title" }, index.h("a", { key: '80be42478cc05c5cfdb612b3327d8051a346abf0', href: this.href, class: "title-anchor", onClick: (e) => this.clickEventHandler(e), "aria-current": this.current ? "true" : undefined }, index.h("span", { key: '975753beb272fcd210663794f89c8fa9c3cedc2c', class: "history-item-title-content" }, index.h("slot", { key: '6e78a3a9978eb2a1b5fd2abc7effd7dd9f7c4c5e', name: "title" })), "\u2060", index.h("dso-icon", { key: 'd034fdef92aa0495c74e6644f8a602b0bc54e259', icon: "chevron-right", "aria-hidden": "true" })))), this.explanationSlottedElement !== null && (index.h("div", { key: 'a5455e11a0fb58a041bc30bff77704eba37e6c8a', class: "history-item-explanation" }, index.h("slot", { key: '659996d3818b763b18210a606733ceb807c4e4b5', name: "explanation" }))), this.warningSlottedElement !== null && (index.h("div", { key: '1f42a56c4cf5b1fb27ded1aa188c87da126524b1', class: "history-item-warning" }, index.h("dso-icon", { key: '4999d4d30e3173a888483fa203ff430c66c96ada', icon: "status-warning-red-solid", role: "img", "aria-label": "Waarschuwing" }), index.h("slot", { key: 'ffbdf71422a2d6745655fdab1b02cb3dc24b51a0', name: "warning" }))))));
+        return (index.h("div", { key: '0ddccba216f32216a5ce222cc11b003bacdb28af', class: "history-item" }, index.h("div", { key: 'b8e3e1c7acc1dfdded03f8829d75362d82bf4920', class: "history-item-date" }, index.h("slot", { key: 'a02d02b411a8827bead6be05cbd4fd6ab22feeb4', name: "date" })), index.h("div", { key: 'e83882c2988f87d822126947f6b954682496d6bc', class: "history-item-content" }, index.h("div", { key: '4409043a85b9ef30d21a64c2119fd6dab0e320a7', class: "history-item-status-message" }, index.h("dso-icon", { key: 'e5096c926aec70dee1471f1cfa01d6a8bb050200', icon: this.typeIcons[this.type], "aria-hidden": "true" }), index.h("slot", { key: 'a7c923bd536c1b02676df779216186f4a49856d7', name: "status" })), this.titleSlottedElement !== null && this.href && (index.h("div", { key: '2db028e5addc28fbd82210129719f86363395c4b', class: "history-item-title" }, index.h("a", { key: '871157e769f9dc0a2af5809e60ca3292ad847f65', href: this.href, class: "title-anchor", onClick: (e) => this.clickEventHandler(e), "aria-current": this.current ? "true" : undefined }, index.h("span", { key: '90bac7607cbe8a838c8f9086c825591e34d7fd35', class: "history-item-title-content" }, index.h("slot", { key: '0c4e9921ace20c57e55d2fbc14019b173624209e', name: "title" })), "\u2060", index.h("dso-icon", { key: 'd3b03e7226a6b0e8dce037a0a390367028490a77', icon: "chevron-right", "aria-hidden": "true" })))), this.explanationSlottedElement !== null && (index.h("div", { key: 'ce9f3ced38791d38fb8778cd548fa8d969c0f959', class: "history-item-explanation" }, index.h("slot", { key: '80156b40b6367688076c34684ac726e3904edae3', name: "explanation" }))), this.warningSlottedElement !== null && (index.h("div", { key: '13f461a66e60fed780b3611289b70efe9bc21bc5', class: "history-item-warning" }, index.h("dso-icon", { key: '750ed3861b34c53fd0bdcf407da4bd8e566d9d92', icon: "status-warning-red-solid", role: "img", "aria-label": "Waarschuwing" }), index.h("slot", { key: '50377ddabb3c9f22f70c182e44a520cac18397c6', name: "warning" }))))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -800,9 +800,10 @@ const Icon = class {
         if (this.icon) {
             const icon = icons.find((i) => i.alias === this.icon);
             if (!icon) {
-                throw new TypeError(`Unknown svg: ${this.icon}`);
+                console.warn(`Unknown svg: ${this.icon}`);
+                return;
             }
-            return index.h("span", { key: 'f3c2fea315141aa82455dab1de3a1b75a097a12c', class: "icon-container", innerHTML: icon.svg });
+            return index.h("span", { class: "icon-container", innerHTML: icon.svg });
         }
     }
 };
@@ -888,7 +889,7 @@ const IconButton = class {
         this.cleanUpTooltip();
     }
     render() {
-        return (index.h("button", { key: '5ee25dbb3bf536e7d1b07d6443db275a7b40447a', ref: (element) => (this.buttonElRef = element), type: "button", disabled: this.disabled, "aria-label": this.label, class: `icon-button dso-${this.variant} ${this.toggled ? "toggled" : ""}`, "aria-pressed": this.toggled?.toString(), "aria-expanded": this.expanded?.toString(), onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip, onClick: this.handleClick }, index.h("dso-icon", { key: 'b7a99cc0b448fecc555a01ef9f5ecf6e6267464a', icon: this.icon, "aria-hidden": "true" }), index.h(tooltip_functionalComponent.Tooltip, { key: '97218a9eb10b3e6aa6384aa91b76140610587fc5', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, this.label)));
+        return (index.h("button", { key: 'dff33a98f0a06ee8c7875ea2361cf9dbb2033946', ref: (element) => (this.buttonElRef = element), type: "button", disabled: this.disabled, "aria-label": this.label, class: `icon-button dso-${this.variant} ${this.toggled ? "toggled" : ""}`, "aria-pressed": this.toggled?.toString(), "aria-expanded": this.expanded?.toString(), onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip, onClick: this.handleClick }, index.h("dso-icon", { key: 'd4770a99eac2fb86e572b6a67595e948bbb8076e', icon: this.icon, "aria-hidden": "true" }), index.h(tooltip_functionalComponent.Tooltip, { key: '0a8b3a5194d8fd3b1c7110f9a760b13e16b570d7', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, this.label)));
     }
 };
 IconButton.style = iconButtonCss();

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

@@ -13,7 +13,7 @@ const Info = class {
         this.dsoClose = index.createEvent(this, "dsoClose", 7);
     }
     render() {
-        return (index.h(index.Fragment, { key: '3a3fa3f36c53a01e0c2a9ceff9c17002543596cd' }, index.h("slot", { key: 'f5eba0eb7309ecb410bab297c6cb871deb2bb8f2' }), !this.fixed && (index.h("dso-icon-button", { key: 'e0546bb603a08250cb872df96bc76ea961a03c53', label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
+        return (index.h(index.Fragment, { key: 'a9db2b8522cbfa55e8629b58a9757d58931ecbca' }, index.h("slot", { key: '2059c0fb8926f48a4b1f36a2210d5c8e48861b1a' }), !this.fixed && (index.h("dso-icon-button", { key: 'b5350abb35893dabf2dfcb0278aee5efd7bb8951', label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
     }
 };
 Info.style = infoCss();
@@ -135,7 +135,7 @@ const InfoButton = class {
         delete this.mutationObserver;
     }
     render() {
-        return (index.h(index.Host, { key: 'd5b28d8f99d79e58d3e46c3b1ca299c69113eede', onKeyDown: this.keyDownHandler }, index.h("dso-icon-button", { key: '49b0e63ffff14227787556ae0d812fe5db60e3bf', variant: "tertiary", label: this.label, onDsoClick: (e) => this.handleToggle(e.detail.originalEvent), icon: this.active || this.toggletipActive ? "info-solid" : "info-outline", ref: (element) => (this.button = element), expanded: this.hasToggletip ? this.toggletipActive : undefined }), this.hasToggletip && (index.h(tooltip_functionalComponent.Tooltip, { key: '5e33be53cdec59870cd510d54d6b0ee63b5c3e62', tipElementRef: (element) => (this.toggletipElRef = element), tipArrowElementRef: (element) => (this.toggletipArrowElRef = element) }, index.h("dso-scrollable", { key: '68c59df3ceb38673be699a3425ab42eb08e195c6', ref: (element) => (this.restrictContentElement = element), "aria-live": "polite" }, index.h("slot", { key: '4e0e7f0aca340e25fe585ca43d429bc669faca05', name: "toggletip" }))))));
+        return (index.h(index.Host, { key: 'f89df0ddad22608cc30c910b1fd4a0352516cee6', onKeyDown: this.keyDownHandler }, index.h("dso-icon-button", { key: '8f46b9c1930d3e546ab604620b19241e3628a3d1', variant: "tertiary", label: this.label, onDsoClick: (e) => this.handleToggle(e.detail.originalEvent), icon: this.active || this.toggletipActive ? "info-solid" : "info-outline", ref: (element) => (this.button = element), expanded: this.hasToggletip ? this.toggletipActive : undefined }), this.hasToggletip && (index.h(tooltip_functionalComponent.Tooltip, { key: '2f6cbae1716c36b47e9ddb608682abdec648564b', tipElementRef: (element) => (this.toggletipElRef = element), tipArrowElementRef: (element) => (this.toggletipArrowElRef = element) }, index.h("dso-scrollable", { key: 'fc29889f2ea054cc48ee22ecde9ebeb4ba414d32', ref: (element) => (this.restrictContentElement = element), "aria-live": "polite" }, index.h("slot", { key: '44b45316c3785a231fb8c214710c0689f8db7e08', name: "toggletip" }))))));
     }
     get host() { return index.getElement(this); }
 };
@@ -205,7 +205,7 @@ const Selectable = class {
         const describedBy = [hasInfo && this.infoFixed ? this.describedById : undefined, this.errormessage]
             .filter((value) => value !== undefined)
             .join(" ") || undefined;
-        return (index.h(index.Fragment, { key: 'c1bcf78acb134256d9ee7e1aa16f606cf9abc74d' }, index.h("div", { key: '050fc2690b77f4cdfd5b302b5c1e8da02ff33e5e', class: "dso-selectable-container" }, index.h("div", { key: '99a646106d3b991cbe6fca4d5f4f3bc1aaaba2e2', class: "dso-selectable-input-wrapper" }, index.h("input", { key: '82dad85616e0eda09ab129ca830a80714a354b89', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": this.invalid?.toString(), "aria-describedby": describedBy, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, ref: (el) => (this.input = el) }), !this.labelledById ? (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: '96678e3b9966222d90c789316cf4d6f66c9f0743', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (index.h("dso-info", { key: '903c82d16a550cfbdc78bdeaad29fb4f003c2c3b', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, index.h("div", { key: '6415907b0d28494858e0661a743778be6d7f43cf' }, index.h("slot", { key: 'b207f99f8fc8fb9af4779d4a2fd19f3235c48bea', name: "info" })))), index.h("slot", { key: '1de94849b9e2d6d7ea862094ddce33fd05cd6b04', name: "options" })));
+        return (index.h(index.Fragment, { key: '4fcfaccfc2f046747059a236b95e94fd0ff63eda' }, index.h("div", { key: 'b157a7b0666bff6a70c6f73c8f01e0f404be59a6', class: "dso-selectable-container" }, index.h("div", { key: '0ae8a012600400a2ad5613a40b5edc7ed2e3697b', class: "dso-selectable-input-wrapper" }, index.h("input", { key: '3766067fdbd363f009d8e468efa744cff7806125', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": this.invalid?.toString(), "aria-describedby": describedBy, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, ref: (el) => (this.input = el) }), !this.labelledById ? (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: '372012b7f352dbbec302bd8b8eb8ba06f61afb3b', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (index.h("dso-info", { key: '9df3328a5f9e511ce3c3e47198f8962ad9fd8e5f', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, index.h("div", { key: '669eeac1998e756335e46e571f09ed128b510b88' }, index.h("slot", { key: '7988c3530d3b595a0bd8e276c5880bf23c32f480', name: "info" })))), index.h("slot", { key: '03944fb01644124409295f56dc44e7753d9d34e8', name: "options" })));
     }
     componentDidRender() {
         if (this.input && typeof this.checked === "boolean" && this.input.checked !== this.checked) {

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

@@ -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: 'b1e37746f98e5cc20eaa63cd41b36b31278c5ebd', id: "description", hidden: true }, this.description)), index.h("span", { key: '4a2887664a746f9ad1178ae5a91d3898e7f59efb', class: "counter", "aria-hidden": "true" }, min, this.unit), index.h("input", { key: '37507f728c4128b9945c8f9856de45be70db10c9', type: "range", min: min, max: max, step: step, value: this.value, class: "input", "aria-label": this.label, "aria-describedby": this.description ? "description" : undefined, onChange: (event) => this.dsoChange.emit({
+        return (index.h(index.Fragment, null, this.description && (index.h("span", { key: 'c9c1c2a01f8d800d9cb861f6ef4b7073af1185e3', id: "description", hidden: true }, this.description)), index.h("span", { key: 'c10d10a730b924332e28bcd873ba9d0f7b3b28be', class: "counter", "aria-hidden": "true" }, min, this.unit), index.h("input", { key: '484f8c4a80bc4d46b8ce29a5bf8d543a7afc4748', type: "range", min: min, max: max, step: step, value: this.value, class: "input", "aria-label": this.label, "aria-describedby": this.description ? "description" : undefined, onChange: (event) => this.dsoChange.emit({
                 originalEvent: event,
                 value: event.target instanceof HTMLInputElement ? parseInt(event.target.value, 10) : undefined,
                 max,
                 min,
                 step,
-            }) }), index.h("span", { key: 'feb885d773d0884f1f9d5c0ae07ff8b5488614c4', class: "counter", "aria-hidden": "true" }, max, this.unit)));
+            }) }), index.h("span", { key: 'eab4c183cb6434e4bfe2e6cefdcd806baf6d6065', class: "counter", "aria-hidden": "true" }, max, this.unit)));
     }
     get host() { return index.getElement(this); }
 };

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: '11bb06a9f5d4525603598ccaa9df636578ef54d2' }, index$1.h("span", { key: '9838e196c72faa9079648a80f6a1ad57f2b8b8f7', "aria-describedby": this.isTruncated ? "toggle-anchor" : null, class: clsx.clsx("dso-label", {
+        return (index$1.h(index$1.Fragment, { key: '91bdf045c5ed63dc007707e0bc69a68eeb85b081' }, index$1.h("span", { key: 'd18b289fdf86d1d7218d040179bf2f406db22e89', "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: 'ba90debe1c000daae0d560cac4afe4e8f91d2cf3', name: "symbol" }), index$1.h("span", { key: '7e0acbc2f55edb62ecfbac023b71c9da27102749', 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: '7dfaf2ab9bdbef0a9b660bbca920018e34b315aa' })), this.removable && (index$1.h("dso-icon-button", { key: '1aca550af7bca4170c5f4c5ffb949d265bc3e067', 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: '12e609e1f0589d410f2f513652dda0d9ae0e0668', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, index$1.h("span", { key: '136ab7144cb6e21411efd3699274fe0ebc8d14c5', id: "toggle-anchor" }, this.labelText)))));
+            }) }, index$1.h("slot", { key: 'b335ef4c4a3c96be81d8d6153e7b94d5edeea63e', name: "symbol" }), index$1.h("span", { key: '1e7b5709be467de0ad1bd3a74a76f0ae7be74401', 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: '6f27332800f26af5a1595c3ef7a241f640afcd8e' })), this.removable && (index$1.h("dso-icon-button", { key: 'c907dd54543ddfd79cfb46e5824fe60de503a831', 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: '1f5a56aa14db9576cb8b9adc723eccc751809df8', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, index$1.h("span", { key: '9820b8c6a6444d97c4cb4b661778e98b53e97a4b', 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: 'a9f4102df6359a337919acba29a04a63a7081ecc' }, index$1.h("button", { key: 'c1ca5b957f98fd775784db904dbefd2290b5c51d', 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: 'e1f08afbfb5d2982382e2caca7973bd731992688', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: '6959133349065a0c1c1b3819a6a337af77fb417c', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: 'a3374b9830448922a698fcc147346a19de74108a', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: '645810d2e0742f0ca4da361f09aa4ef835b1fde0', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: 'fec9a4cae5f4db920452ac1dd269b4a4c474574a', htmlFor: this.identifier }, index$1.h("slot", { key: '79f4ab4d92e3e6bee2ebb99385d3f0af3fbbec83' })))));
+        return (index$1.h(index$1.Fragment, { key: '6c93206401ece72a6855cf221e2e736d6614f975' }, index$1.h("button", { key: '3ebe6f02a903409857700d514f4aca413821e105', 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: 'cb80c67c5c73f236214a48e2139b02dc70b8ed16', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: '7621050d5e32efbb415fbc78a594877fe2761838', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: 'fa4f3055cde0d553b427b021628119e5ab9e8419', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: 'a0d084c0080b4bb442ea3201e1de59f883c04311', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: '19d4e2fffb21b163a0096c59003c15928ebc3f79', htmlFor: this.identifier }, index$1.h("slot", { key: '258e0e30ac2d245e47ea939e4473733eeea98177' })))));
     }
     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: '28df01827602cfe94f1655495d3cc0b8ba5b66a0' }, index.h("div", { key: 'c684bb3db12b429c6986daa5ce23c92c46453d76', class: "legend-group-header" }, index.h("slot", { key: 'ea31dc722b197532052b816c542c67a6492a9022', name: "heading" }), this.mode && (index.h("dso-icon-button", { key: '6daa2c00dc4a87b44ef1a430147b2b04661bdb4d', 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: '480a98979e3a91fa8e26664f48e47c384d24dea5', name: "options" }), index.h("slot", { key: 'c135fa34e1db7950f21d333202291c35e9e2918e' })));
+        return (index.h(index.Host, { key: 'c9125b2e136179fa1d19e5e541cd2d2d9011d901' }, index.h("div", { key: '18669cee48503532997b985e5e54963118555e90', class: "legend-group-header" }, index.h("slot", { key: '617156b48af75016f2330a300f7d4a32934f5348', name: "heading" }), this.mode && (index.h("dso-icon-button", { key: 'f2a7054c3b21a139c67a0eede344f4d0882906e7', 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: '1e7537386e19d69e26227cfa8db90d169dae2abd', name: "options" }), index.h("slot", { key: '1e1b580e859dfcbedfcb02e4f495ad130bf79188' })));
     }
     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: '9b7ed34c8ea72c3a2e642650059fb156ba0ad440', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h("div", { key: 'a847b2cd9edd37023c37af28229dbc113cc950d7', class: clsx.clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (index.h("div", { key: '660ddd73308757372228776a5637d48ee67ef4a2' }, index.h("slot", { key: '15732d9a4a15e82315714b227e284df36e499457', name: "symbol" }))), index.h("div", { key: '38610147aa7d439409bfd92abce6ba2afb73ff9d' }, index.h("slot", { key: '1f6f49979470f5867023d402581743e9fb97837c', name: "label" })), this.disabled && this.disabledMessage && (index.h("dso-info-button", { key: 'd4b64ba6f58c69f0178529be0fdf6b9f8209ea7c', label: this.text("disabledInfo"), toggletipPlacement: "bottom" }, index.h("div", { key: 'd98d584d44fce4ca7b18ee4cd1a0d4fd68ed82ca', slot: "toggletip" }, this.disabledMessage))), index.h("div", { key: '4b693c3cc699db0cce0ca43a35d1db165e8fe013', class: "legend-item-right-content" }, this.renderRightContent(hasOptions, accessibleLabel))), hasOptions && (index.h("div", { key: '1d1c00a99077c4fb13c51d46c602fbdd735ba411', hidden: this.disabled || !this.showOptions, class: "options" }, index.h("slot", { key: '097b5874ec1fbfc19a65e857e45697bd8c738f1d', name: "options" })))));
+        return (index.h(index.Host, { key: '9910f7c632dd64364f05e11e80ad9393ff293891', onMouseEnter: () => this.dsoMouseEnter.emit(), onMouseLeave: () => this.dsoMouseLeave.emit() }, index.h("div", { key: 'adbc079c35c38cc3d95f8fb22b13df88bf323ff2', class: clsx.clsx("legend-item", { "legend-item-symbol": hasSymbol }) }, hasSymbol && (index.h("div", { key: 'd63506083cd82503562e2d979c8995607493b692' }, index.h("slot", { key: '93df0bf546e4d84aa559df34f5bf8c55320ec85c', name: "symbol" }))), index.h("div", { key: '97383d43dd1463c3c6009922e022ecfd876afb9a' }, index.h("slot", { key: '3b7930871f1b72a069707b67e43d647e94f6558f', name: "label" })), this.disabled && this.disabledMessage && (index.h("dso-info-button", { key: 'c27822a26fa9fdace3a5b80dbed2d8cb3b9d3b0e', label: this.text("disabledInfo"), toggletipPlacement: "bottom" }, index.h("div", { key: '8a52854c3cd28c122fefa8dac0d8b3bbc647a3b2', slot: "toggletip" }, this.disabledMessage))), index.h("div", { key: '3ef205f555ea2d9f9f798225fb32b4273e8fca1b', class: "legend-item-right-content" }, this.renderRightContent(hasOptions, accessibleLabel))), hasOptions && (index.h("div", { key: 'af5340c5818b6c4cead0af10d8bbd93ad56f5738', hidden: this.disabled || !this.showOptions, class: "options" }, index.h("slot", { key: '3aae70d66af91143ef385b00aa353414b86da5ab', 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: 'b43c88fc0df9707a79ed8874fc4841cc4eb38575' }, index.h("div", { key: '5e34bfd53975616ab7af672b7a9a5cae3a7ac370', class: "topbar" }, index.h("div", { key: 'd750d4682f0c303bb7dae3d4946feddd816445d0', 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: '160e6006ba87ad67debcaeb77450c1b0fbcd70ae', 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: '8032c7a4d34e4909f815ca52bdf46515b682e3eb', class: "content" }, index.h("div", { key: '2fb5ab230b72aa73aa3b42dfe88fc8a01eac4885', role: "tabpanel", tabIndex: 0 }, index.h("slot", { key: '45408018533a684dd2e924c75044bef3cb62907e' })))));
+        return (index.h(index.Host, { key: '6a19193a2882506d8ed6c2678fc5fb7d50e306d3' }, index.h("div", { key: '377d9462efb4a215fb59c3a71ad992ff75053a43', class: "topbar" }, index.h("div", { key: 'efc1f5cf56372d7a542268cb76bdee32315ba203', 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: 'c6344cb53732dc7c8e2147fa5164b23b9908e2c5', 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: '10a5928f03f917e015bfed1cdbbdc3cd4b741a75', class: "content" }, index.h("div", { key: '57341e45e63cf1fa5105fc88dcbcd27c639c0e06', role: "tabpanel", tabIndex: 0 }, index.h("slot", { key: '0215d38bdde6a07b4142649656658a1bd4710dc6' })))));
     }
     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: 'a456e0620bc42f18b185b4c1a9439c1fe3cf1aef', class: clsx.clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, index.h("div", { key: '867c31ff683477c95e0df5fda982f2aa56c117cd', 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: 'c012d5bb80973a01a91803c7685c3150c5a926d7', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, index.h("span", { key: '102e32c6fb04eeca284ca3fe3131f067e2b0343d' }, this.label, this.sublabel && index.h("span", { key: '3dad120610012113d7562483bf61b478ce9205de', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (index.h("span", { key: '6990b9666c6c0be81e50e8ae432f0e38e985efe0', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", index.h("span", { key: '446fae472320465f3d77d0ada41a8822a088343d', innerHTML: this.subcontentSlot.innerHTML }))))), this.sublabel && index.h("span", { key: '67e2ffbe64b147dc15432402860305abc52f514c', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (index.h("div", { key: '63aa66e9d77121906a47ac021a10941c8d5d4a9d', class: "subcontent" }, index.h("slot", { key: '3db8cef36ee03f1927f99d971687ad17b8a9f088', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (index.h("div", { key: 'a3cf60e804d2b5efcfaf560c0622a5c97c8d215e', class: "dso-input-number" }, this.count > 1 && (index.h(index.Fragment, { key: '2bc46a1d646e1059b520206d2ebff380950ff5f7' }, index.h("dso-icon-button", { key: 'e4bb575cf7b73752cf4c423c094461e25330f9d9', 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: '494eabda18b6936977ffe1152924bfa542fe5f03', class: "dso-input-step-counter", "aria-hidden": "true" }, this.count))), index.h("span", { key: 'f4f9497a23dc31b528a8c848e34699ffc2ddd7f9', class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.count), index.h("dso-icon-button", { key: '2a034e31a9048fcd929915a11052d3f89af8cb13', 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: '427ff9cd8cc7dc0c569a2f394ccf2d45563b21e8', class: clsx.clsx(["dso-button-group", { "dso-disabled": this.disabled }]) }, index.h("div", { key: 'd088de067e202fa3e9e07b7efa0f12e3bbcd6623', 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: 'd81f506ad4d2825e11fb02b58d53084db34e805d', type: "checkbox", value: "list-button", name: "naam", checked: selected, disabled: this.disabled }, index.h("span", { key: '3d4add309ed7f30664055d68fbd82d0ada7209c3' }, this.label, this.sublabel && index.h("span", { key: '8ea2cee6ec78f2dac9f82c0ac68d63325e333172', class: "sr-only" }, " ", this.sublabel), this.subcontentSlot && (index.h("span", { key: 'c108019419d8392734c72881c9e12f7ab939eeac', class: "sr-only" }, this.subcontentPrefix && this.subcontentPrefix + ":", " ", index.h("span", { key: 'e92bdb531740986a4740c40273b7e59d87a2f14c', innerHTML: this.subcontentSlot.innerHTML }))))), this.sublabel && index.h("span", { key: 'f6829e8e7cfa5ad117bea1c4d43fd57723f9f126', class: "dso-sublabel" }, this.sublabel), this.subcontentSlot && (index.h("div", { key: '50ac21ae4c209ffebc2dcdd6bdf38fd77540b2f2', class: "subcontent" }, index.h("slot", { key: '8cf1fda0a7d5c20d719ffcf926e468617c13005e', name: "subcontent" })))), this.count !== undefined && this.count > 0 && (index.h("div", { key: 'dd5a7569abfeae4fc70882f7bdd1eb26f6c124fe', class: "dso-input-number" }, this.count > 1 && (index.h(index.Fragment, { key: '5579dffd39aae5d6a66c8c9f98231d1b80756d20' }, index.h("dso-icon-button", { key: '4544a7074baabc5b220eca4b25b7f730e6107d3f', 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: '3676a56084254d00110d4c9983204b5d66752a33', class: "dso-input-step-counter", "aria-hidden": "true" }, this.count))), index.h("span", { key: 'c2f47bb502b61a6d50de0078a2e13c53f158ba51', class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.count), index.h("dso-icon-button", { key: '2933caf8dfa55d54519aac55574e3ec5422cbf00', 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: 'e17789ab58b8de2b80f36e486ce3fa38ff4df6c7', 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: '86ef86eec492c43893400b07fe6cab097fca9d69', 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: '8021adc45a3a8964cd2fb229844204f75190a728', class: "form-group dso-radios" }, index.h("legend", { key: '5413e633389032190f8894a96ca44a505074c4f1', class: "sr-only" }, "Achtergrond"), index.h("div", { key: 'cd74d34e240fec9aa2decfae7dbd9404cc4852f3', class: "dso-label-container" }, index.h("span", { key: '3816e67c6f3c4bdc84dab60a04ed4b77ffbfe116', class: "control-label", "aria-hidden": "true" }, this.text("background"))), index.h("div", { key: '940d382bb243fc7ff7d66f53f2d6a14839a881cc', 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: '484811640eda82f3e6b2a2e354216cbd2ee62e80', class: "form-group dso-radios" }, index.h("legend", { key: '190c62ae5665eb16c9a5383602eff770be0e3d94', class: "sr-only" }, "Achtergrond"), index.h("div", { key: '48359a8884c27c49366a618603b7c875fed7bf01', class: "dso-label-container" }, index.h("span", { key: '9437465960fa44beec6331e79609af3c51ec1051', class: "control-label", "aria-hidden": "true" }, this.text("background"))), index.h("div", { key: 'a5e04948d139028b8b6d514551be1f220ae4ce77', 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); }
 };