@dso-toolkit/core 101.2.0 → 102.0.0

package/dist/bundle/dso-shopping-cart-item.js

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

package/dist/bundle/dso-shopping-cart.js

@@ -1,8 +1,6 @@
-import { p as proxyCustomElement, H, d as createEvent, h, t as transformTag } from './p-Vur2Wu4N.js';
-import { d as defineCustomElement$3 } from './p-B3xfmB17.js';
-import { d as defineCustomElement$2 } from './p-CPtFrV76.js';
+import { p as proxyCustomElement, H, h, t as transformTag } from './p-Vur2Wu4N.js';
 
-const shoppingCartCss = () => `:host {   display: block; }  *, *::after, *::before {   box-sizing: border-box; }  .shopping-cart {   background-color: #e1ecf7;   padding-block: 16px;   padding-inline: 16px; }  .header {   display: flex;   align-items: center;   justify-content: space-between;   gap: 16px;   margin-block-end: 16px; }  ::slotted([slot=heading]) {   margin-block: 0 !important;   margin-inline: 0 !important;   color: inherit !important;   font-size: 1.125rem !important;   font-weight: 600 !important;   line-height: 1.25 !important; } @media (min-width: 480px) {   ::slotted([slot=heading]) {     font-size: 1.25rem !important;   } }  .items {   display: flex;   flex-direction: column;   gap: 8px; }  :host([mode=side]) .items {   --_dso-shopping-cart-line-clamp: 2; }  button {   -webkit-appearance: button;   color: inherit;   cursor: pointer;   font: inherit;   font-family: inherit;   font-size: inherit;   letter-spacing: inherit;   line-height: inherit;   margin: 0;   overflow: visible;   text-transform: none; } button[disabled] {   cursor: default; } button::-moz-focus-inner {   border: 0;   padding: 0; } button.dso-secondary {   display: inline-block;   font-size: 1em;   font-weight: 500;   margin-block-end: 0;   text-decoration: none;   touch-action: manipulation;   text-align: var(--_dso-button-text-align, start);   user-select: none;   vertical-align: middle;   background-clip: padding-box; } button.dso-secondary:focus, button.dso-secondary:focus-visible {   outline-offset: 2px; } button.dso-secondary:active {   outline: 0; } button.dso-secondary.extern::after, button.dso-secondary.download::after {   content: "";   display: inline-block; } button.dso-secondary {   background-color: var(--_dso-button-secondary-background-color, #fff);   border-color: var(--_dso-button-secondary-border-color, #39870c);   color: var(--_dso-button-secondary-color, #39870c);   float: var(--_dso-button-float-secondary, none);   border-width: 1px;   border-style: solid;   border-radius: 4px;   line-height: 1.5;   min-inline-size: 56px;   inline-size: var(--_dso-button-inline-size, auto);   padding-block: 11px;   padding-inline: 15px; } button.dso-secondary:hover {   background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce);   border-color: var(--_dso-button-secondary-hover-border-color, #275937);   color: var(--_dso-button-secondary-hover-color, #275937);   float: var(--_dso-button-float-secondary, none); } button.dso-secondary:active {   background-color: var(--_dso-button-secondary-active-background-color, #275937);   border-color: var(--_dso-button-secondary-active-border-color, #275937);   color: var(--_dso-button-secondary-active-color, #fff);   float: var(--_dso-button-float-secondary, none); } button.dso-secondary[disabled], button.dso-secondary[disabled]:hover {   background-color: var(--_dso-button-secondary-disabled-background-color, #fff);   border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d);   color: var(--_dso-button-secondary-disabled-color, #afcf9d);   float: var(--_dso-button-float-secondary, none); } button.dso-secondary.dso-small {   line-height: 1rem; } button.dso-secondary.dso-small dso-icon, button.dso-secondary.dso-small.extern::after, button.dso-secondary.dso-small.download::after, button.dso-secondary.dso-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-secondary.dso-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-extra-small {   line-height: 1rem; } button.dso-secondary.dso-extra-small dso-icon, button.dso-secondary.dso-extra-small.extern::after, button.dso-secondary.dso-extra-small.download::after, button.dso-secondary.dso-extra-small.dso-spinner::before {   margin-block-end: -4px;   margin-block-start: -4px; } button.dso-secondary.dso-extra-small.dso-spinner-left::before {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-extra-small.dso-spinner-right::after {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-extra-small {   padding-block: 9px; } button.dso-secondary dso-icon:has(+ span:not(.sr-only)) {   margin-inline-start: -8px; } button.dso-secondary span:not(.sr-only) + dso-icon {   margin-inline-start: 8px;   margin-inline-end: -8px; } button.dso-secondary dso-icon + span:not(.sr-only) {   margin-inline-start: 8px; } button.dso-secondary.dso-spinner-left[disabled], button.dso-secondary.dso-spinner-right[disabled] {   background-color: #fff;   border-color: #39870c;   color: #39870c; } button.dso-secondary.dso-spinner-left::before {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: top;   inline-size: 24px;   margin-inline-end: 8px; } button.dso-secondary.dso-spinner-left:not([disabled]):hover::before {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: top;   inline-size: 24px;   margin-inline-end: 8px; } button.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before {   block-size: 16px;   inline-size: 16px; } button.dso-secondary.dso-spinner-right::after {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: top;   inline-size: 24px;   margin-inline-start: 8px; } button.dso-secondary.dso-spinner-right:not([disabled]):hover::after {   background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E");   background-repeat: no-repeat;   content: "";   display: inline-block;   block-size: 24px;   vertical-align: top;   inline-size: 24px;   margin-inline-start: 8px; } button.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after {   block-size: 16px;   inline-size: 16px; }`;
+const shoppingCartCss = () => `:host{display:block}*,*::after,*::before{box-sizing:border-box}.shopping-cart{background-color:#e1ecf7}.content{padding-block:16px;padding-inline:16px}.header{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#1f472c;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e1ecf7;color:#191919;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-block-end:16px}::slotted([slot=heading]){margin-block:0 !important;margin-inline:0 !important;color:inherit !important;font-size:1.125rem !important;font-weight:600 !important;line-height:1.25 !important}@media (min-width: 480px){::slotted([slot=heading]){font-size:1.25rem !important}}.items{display:flex;flex-direction:column;gap:8px;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;list-style:none}::slotted([slot=warning]){margin-block:0 !important;margin-inline:0 !important;padding-block:16px !important;padding-inline:16px !important;background-color:#fff !important}:host([mode=side]) .items{--_dso-shopping-cart-line-clamp:2}::slotted([slot=button]){flex-shrink:0 !important}::slotted(.dso-tertiary[slot=button]){--_dso-button-padding-block-tertiary:11px !important}`;
 
 const ShoppingCart = /*@__PURE__*/ proxyCustomElement(class ShoppingCart extends H {
     constructor(registerHost) {
@@ -11,52 +9,29 @@ const ShoppingCart = /*@__PURE__*/ proxyCustomElement(class ShoppingCart extends
             this.__registerHost();
         }
         this.__attachShadow();
-        this.dsoToggle = createEvent(this, "dsoToggle", 3);
         /**
          * The mode of the Shopping Cart.
          */
         this.mode = "side";
-        /**
-         * When set, a toggle button is rendered. In the `side` mode this is a button to expand the Shopping Cart, in the
-         * `main` mode this is a button to collapse the Shopping Cart.
-         */
-        this.toggleable = false;
-    }
-    renderToggle() {
-        if (this.mode === "main") {
-            return (h("button", { type: "button", class: "dso-secondary", onClick: (e) => this.dsoToggle.emit({ originalEvent: e }) }, h("span", null, "Sluiten"), h("dso-icon", { icon: "cross" })));
-        }
-        return (h("dso-icon-button", { icon: "chevron-left", variant: "secondary", label: "Openen", onDsoClick: (e) => this.dsoToggle.emit({ originalEvent: e.detail.originalEvent }) }));
     }
     render() {
-        return (h("div", { key: '81a125d44c5a6478f17a2846bea530fea131a036', class: "shopping-cart" }, h("div", { key: 'fc1f6300e29f2e77f7a385b099e2ae97d504244f', class: "header" }, h("slot", { key: 'aadf1e6de0ee0b3acd9cb9f006a398fe6605c6b1', name: "heading" }), this.toggleable && this.renderToggle()), h("div", { key: 'f08808a803d3cc704ac18baf67287c2344fd4593', class: "items" }, h("slot", { key: '6c498a9644bc181885e4fab94cbbce09fabfa3e7' }))));
+        return (h("div", { key: '0975f0846a7a9c84e6c6e2f5c7d19d6f0ae62ccb', class: "shopping-cart" }, h("div", { key: '20915602b7ce0b656ca1a7a0449a33a696b70ec6', class: "content" }, h("div", { key: '38ce29b8f8405252e113616351ab141e6d7a93ed', class: "header" }, h("slot", { key: 'b307540c8268b1d93f9397d92c4a956f0f501da6', name: "heading" }), h("slot", { key: 'c3b43702c41be007e4236f8fde1ad38c9326a924', name: "button" })), h("ul", { key: '82369b3f4bcbb85b30bc06a4992e7a14bebe1a14', class: "items", role: "list" }, h("slot", { key: 'f9fe406ee105b280c4b50b28f9c1047e49245573' }))), h("slot", { key: '10c42345d6a2b702671fe20207aaa5bfb24dddc3', name: "warning" })));
     }
     static get style() { return shoppingCartCss(); }
 }, [257, "dso-shopping-cart", {
-        "mode": [513],
-        "toggleable": [516]
+        "mode": [513]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["dso-shopping-cart", "dso-icon", "dso-icon-button"];
+    const components = ["dso-shopping-cart"];
     components.forEach(tagName => { switch (tagName) {
         case "dso-shopping-cart":
             if (!customElements.get(transformTag(tagName))) {
                 customElements.define(transformTag(tagName), ShoppingCart);
             }
             break;
-        case "dso-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$3();
-            }
-            break;
-        case "dso-icon-button":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$2();
-            }
-            break;
     } });
 }
 

package/dist/bundle/dso-skiplink.js

@@ -20,7 +20,7 @@ const Skiplink = /*@__PURE__*/ proxyCustomElement(class Skiplink extends H {
         return this.dsoSkiplinkClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });
     }
     render() {
-        return (h("a", { key: 'ec97f39a3e830efad1c830f0c193794de45a09ae', href: `#${this.to}`, onClick: (e) => this.clickEventHandler(e) }, this.label, h("dso-icon", { key: '719fe53204afac5f21fd31c71fb49db77493d971', icon: "chevron-right" })));
+        return (h("a", { key: 'b132ce509967a0a3bd4241a76104bc3f33822022', href: `#${this.to}`, onClick: (e) => this.clickEventHandler(e) }, this.label, h("dso-icon", { key: '9aa1c16b8e24f40be4849761287b0dd3a6448f33', icon: "chevron-right" })));
     }
     static get style() { return skiplinkCss(); }
 }, [1, "dso-skiplink", {

package/dist/bundle/dso-slide-toggle.js

@@ -1,4 +1,4 @@
-import { S as SlideToggle, d as defineCustomElement$1 } from './p-CyJod4Vs.js';
+import { S as SlideToggle, d as defineCustomElement$1 } from './p-A0rc0QLO.js';
 
 const DsoSlideToggle = SlideToggle;
 const defineCustomElement = defineCustomElement$1;

package/dist/bundle/dso-survey-rating.js

@@ -33,10 +33,10 @@ const SurveyRating = /*@__PURE__*/ proxyCustomElement(class SurveyRating extends
             "Makkelijk",
             "Heel makkelijk",
         ];
-        return (h("dso-panel", { key: 'f71feb379730da313da81cfa870a94972cbfdd1d', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, h("h2", { key: 'f288a70a39f39f5a8713db685ba6aec0edf091b7', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), h("strong", { key: '740079e482fd986f4087c0406efd32f5c5d79f91' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), h("form", { key: '328fb7f100fb6016562a0fb7f50d9650783fbf7e', onSubmit: (e) => this.handleForm(e) }, h("div", { key: '5d220f3fa422599f46e3aab711b307b755a4a0dc', class: "visual-rating-labels", "aria-hidden": "true" }, h("span", { key: 'b2d5f2934c03361231708b91a7e442ea635b93e1' }, "Heel moeilijk"), h("span", { key: '33ccc8a4d43de5ac05a4066321ef0396b66069e8' }, "Heel makkelijk")), h("div", { key: '0c90046e5e8752425bae3187dd729e33b8383530', role: "radiogroup" }, ratings.map((rating, index) => {
+        return (h("dso-panel", { key: '0eea370b3b4f481967ad5a8b837f1e37fef30e82', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, h("h2", { key: 'aafae4fecfc6fe60948d2e234b3cc06dfc32d634', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), h("strong", { key: '8ff6bbfe4ccc2104ff912f63cf6fda0dbe189154' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), h("form", { key: '675dbd15cc595fd1d691ce588beecb1bd4941405', onSubmit: (e) => this.handleForm(e) }, h("div", { key: '61f8794c44cf9c37f4f742f2fb98cc36d682353e', class: "visual-rating-labels", "aria-hidden": "true" }, h("span", { key: '9e951802ea136262010dda9d72e0d22788f8d6f2' }, "Heel moeilijk"), h("span", { key: 'c6aa53b254a363d6d54acef80e6fb05727d0dfba' }, "Heel makkelijk")), h("div", { key: '051e9720e9101770630dd90167cc9c72f0c01935', role: "radiogroup" }, ratings.map((rating, index) => {
             const ratingNumber = index + 1;
             return (h(Fragment, null, h("label", { class: `survey-rating-${ratingNumber}` }, ratingNumber, h("span", { class: "sr-only" }, rating), h("input", { type: "radio", name: "rating", value: ratingNumber, checked: ratingNumber === this.rating, onChange: (e) => this.handleChange(e) }))));
-        })), h("button", { key: '41e151e08f5e9e83498b07e9f512d5c19ae92d03', type: "submit", class: "dso-secondary" }, h("span", { key: '10ea4788787c0d3c360ed371ab76eb7fbbbc1ec2' }, "Antwoord verzenden")))));
+        })), h("button", { key: 'a3d6f061bdbb6cc744a40877ed8658aeb8149c04', type: "submit", class: "dso-secondary" }, h("span", { key: 'd5dbb51141c9460792ecc4ab9c098dbf40f79686' }, "Antwoord verzenden")))));
     }
     static get style() { return surveyRatingCss(); }
 }, [1, "dso-survey-rating"]);

package/dist/bundle/dso-table.js

@@ -1,4 +1,4 @@
-import { T as Table, d as defineCustomElement$1 } from './p-DGvLPDdu.js';
+import { T as Table, d as defineCustomElement$1 } from './p-DaNGJp1p.js';
 
 const DsoTable = Table;
 const defineCustomElement = defineCustomElement$1;

package/dist/bundle/dso-tabs.js

@@ -64,7 +64,7 @@ const Tabs = /*@__PURE__*/ proxyCustomElement(class Tabs extends H {
         this.mutationObserver?.disconnect();
     }
     render() {
-        return (h(Host, { key: 'fa4be67628f85d5b548517c20ee61528c51b922d' }, h("div", { key: '6fda62a4edb0115bd4ccc259d4bd8d3e69f077a3', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, h("slot", { key: '1fa41f7e9e6968ca70ecbe6315b535d24be71707' })), h("div", { key: 'c63df74e37ac2a44c6f5472026e57c2390e6ef70', role: "tabpanel", tabindex: "0" }, h("slot", { key: 'f9c438558d37b90a5977c2fc5d4a32911f9a44e3', name: "panel" }))));
+        return (h(Host, { key: '8280a7ae38eb3d447930abc5ba81bb6a032ff41b' }, h("div", { key: '90e5f3a0dd4f9ac5ec7b88bf0ce36ba929e1273d', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, h("slot", { key: '4350663cec6bcaac6891532309d68c1fc182b4e7' })), h("div", { key: 'ef674d380c04f889973b314239d7cb1f666969d3', role: "tabpanel", tabindex: "0" }, h("slot", { key: 'b2df39f8901d250e223686db8996741d6fec5eeb', name: "panel" }))));
     }
     get host() { return this; }
     static get style() { return tabsCss(); }

package/dist/bundle/dso-tijdreis-banner.js

@@ -12,7 +12,7 @@ const TijdreisBanner = /*@__PURE__*/ proxyCustomElement(class TijdreisBanner ext
         this.__attachShadow();
     }
     render() {
-        return (h(Fragment, { key: '8c13ab50b35a92848d72b776ce5b3875c5e67086' }, h("dso-icon", { key: 'a3b0e70442176974a04b9fe2bea036e5361f7bed', icon: "clock-outline" }), h("slot", { key: 'a482014428a92ad7fdea8f56ee28ce1716be2725' }), h("slot", { key: '8bcd260f712ecdcc67e0b70433e7b9a8e7af6012', name: "button" })));
+        return (h(Fragment, { key: '4317cf451c9744a5643cdca73e3e433dee9a98da' }, h("dso-icon", { key: '408e80f9a501225a31795ae2117412409cd32a7e', icon: "clock-outline" }), h("slot", { key: '5d8fc6aa1a40f5b9fc3faa3cfe0f844076961863' }), h("slot", { key: '054c8c7be3f98aa4e158eb0877e330170978d600', name: "button" })));
     }
     static get style() { return tijdreisBannerCss(); }
 }, [257, "dso-tijdreis-banner"]);

package/dist/bundle/dso-tree-view.js

@@ -1,7 +1,7 @@
 import { h, F as Fragment, p as proxyCustomElement, H, d as createEvent, t as transformTag } from './p-Vur2Wu4N.js';
 import { c as clsx } from './p-ChV9xqsO.js';
 import { d as defineCustomElement$3 } from './p-B3xfmB17.js';
-import { d as defineCustomElement$2 } from './p-p_SkZXGC.js';
+import { d as defineCustomElement$2 } from './p-B7dXUJ1g.js';
 
 const DsoTreeItem = ({ owner, ancestors, item, index, level, setSize, }) => (h("li", { key: item.id, class: clsx("tree-item", { "has-child": item.hasItems, "is-expanded": !!item.open && !!item.items?.length }), role: "none" }, h("div", { class: "tree-branch-control" }, item.hasItems ? (h("div", { onClick: (e) => owner.itemClick(e, ancestors, item) }, h("dso-icon", { icon: item.open ? "minus-square-outline" : "plus-square-outline" }))) : (h("dso-icon", null))), h("p", { class: clsx("tree-content", { active: item.active }, { selected: item.selected }), tabindex: level === 1 && index === 0 ? 0 : -1, role: "treeitem", "aria-expanded": item.hasItems ? "" + (!!item.open && !!item.items?.length) : undefined, "aria-current": item.active ? "true" : undefined, "aria-level": level, "aria-setsize": setSize, "aria-posinset": index + 1, "aria-busy": item.loading ? "true" : undefined, "data-item-id": item.id, onClick: (e) => owner.itemClick(e, ancestors, item) }, item.selected && h("span", { class: "sr-only" }, "Resultaat: "), item.href ? (h("a", { href: item.href, tabindex: "-1" }, item.label)) : (h("span", null, item.label)), item.icons?.map((icon) => (h("dso-icon", { icon: icon.icon, title: icon.label })))), item.open && (h(Fragment, null, item.hasItems && !item.items && item.loading ? (h("dso-progress-indicator", { size: "small", label: "Resultaten laden: een moment geduld alstublieft." })) : (h("ul", { role: "group" }, item.items?.map((childItem, childIndex, org) => (h(DsoTreeItem, { owner: owner, ancestors: [...ancestors, item], item: childItem, index: childIndex, level: level + 1, setSize: org.length })))))))));
 
@@ -185,7 +185,7 @@ const TreeView = /*@__PURE__*/ proxyCustomElement(class TreeView extends H {
         return false;
     }
     render() {
-        return (h("div", { key: 'cfd4a4c97f9a9a19d63ca06da1d85e49b17d7241', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: '4c178feeb364c23f883d46e3afef5bba6ea412e4', role: "tree", "aria-label": "Objectenboom" }, this.collection?.map((item, index) => (h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index, level: 1, setSize: this.collection.length }))))));
+        return (h("div", { key: '1d778f74240db2d60593166c5d2d0ccf1747ec53', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: '376d3f78319872e060ba6210841cb0ad8507094c', role: "tree", "aria-label": "Objectenboom" }, this.collection?.map((item, index) => (h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index, level: 1, setSize: this.collection.length }))))));
     }
     static get style() { return treeViewCss(); }
 }, [1, "dso-tree-view", {

package/dist/bundle/dso-truncate.js

@@ -1,4 +1,4 @@
-import { T as Truncate, d as defineCustomElement$1 } from './p-Bnzoc8mM.js';
+import { T as Truncate, d as defineCustomElement$1 } from './p-BymZ1e8R.js';
 
 const DsoTruncate = Truncate;
 const defineCustomElement = defineCustomElement$1;

package/dist/bundle/dso-viewer-grid.js

@@ -219,9 +219,9 @@ const ViewerGrid = /*@__PURE__*/ proxyCustomElement(class ViewerGrid extends H {
     }
     render() {
         const tabs = viewerGridTabs.filter((tab) => tab !== "document" || this.documentPanelOpen);
-        return (h(Fragment, { key: 'a4a2d506d887502495e82994af7dc5fadb04c72d' }, h("slot", { key: '2cce5a91ca55e0e99b14113d84711f6b8ea64016', name: "top-bar" }), h("div", { key: '07712c49f0c2b374d9beb3423e63b1a22e3aa49f', class: "viewer-grid-columns" }, this.tabView && (h("nav", { key: 'e412fb5363c99096e2756890a987a47461de78bd', class: "dso-navbar" }, h("ul", { key: '5d6c77f44c72bc8a03e44d83bbdc227ff3d9e484', class: "dso-nav dso-nav-sub" }, tabs.map((tab) => (h("li", { key: tab, class: clsx({ "dso-active": this.activeTab === tab }) }, h("button", { type: "button", class: "dso-tertiary", "aria-current": this.activeTab === tab ? "page" : undefined, onClick: () => this.switchActiveTab(tab) }, viewerGridTabLabelMap[tab]))))))), (!this.tabView || (this.tabView && this.activeTab === "search") || this.print) && (h(MainPanel, { key: 'bc0bd828cf71d44f8c5112985ce60b899cf984d1', tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.tabView ? false : this.mainPanelHidden, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd, printFilterPanel: !this.tabView && this.filterPanelOpen && this.print ? this.renderFilterPanel() : undefined })), (!this.tabView || (this.tabView && this.activeTab === "search")) && !this.print && this.renderFilterPanel(), (!this.tabView || (this.tabView && this.activeTab === "map") || this.print) && (h("div", { key: 'aab029d2044d207bed52ef12d506257f659e349f', class: "map-area" }, h("div", { key: '242c712042871f3fcaee9b39259de06ffde3753a', class: "map", ref: (element) => (this.mapElement = element) }, h("slot", { key: '1514f9691361db4a6c2a968ddca090686d90bf7f', name: "map" })), h("slot", { key: '56b24a21ebf1bda91aa285520a4e3643a28e45dc', name: "legend" }))), ((!this.tabView && this.documentPanelOpen) ||
+        return (h(Fragment, { key: 'f5253f257aeb6718a721f21daf0fb9115285ee44' }, h("slot", { key: 'f7094c3d7b45e9a2ec4d8ee67c7708a3b62a2b4c', name: "top-bar" }), h("div", { key: 'd86d1f3e8093fbbe9465558d177dc5b931fd0b5e', class: "viewer-grid-columns" }, this.tabView && (h("nav", { key: '49b586ca57ed12d0e73156c2f9a73f4bff522e8d', class: "dso-navbar" }, h("ul", { key: '7c7d501187a983742ed31d780cfafdbddda14a6f', class: "dso-nav dso-nav-sub" }, tabs.map((tab) => (h("li", { key: tab, class: clsx({ "dso-active": this.activeTab === tab }) }, h("button", { type: "button", class: "dso-tertiary", "aria-current": this.activeTab === tab ? "page" : undefined, onClick: () => this.switchActiveTab(tab) }, viewerGridTabLabelMap[tab]))))))), (!this.tabView || (this.tabView && this.activeTab === "search") || this.print) && (h(MainPanel, { key: '494b784d40887fdc7edee3c0485a3d19f08c8ea7', tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.tabView ? false : this.mainPanelHidden, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd, printFilterPanel: !this.tabView && this.filterPanelOpen && this.print ? this.renderFilterPanel() : undefined })), (!this.tabView || (this.tabView && this.activeTab === "search")) && !this.print && this.renderFilterPanel(), (!this.tabView || (this.tabView && this.activeTab === "map") || this.print) && (h("div", { key: '6401d836098f249306dd75269e9a8b76fe9c048a', class: "map-area" }, h("div", { key: '6872f89d29b98e8c8c1214d7fed2d96f46a3df5f', class: "map", ref: (element) => (this.mapElement = element) }, h("slot", { key: '6c2ed87cb363acde7ee10bbb036fe5b8eadd74e5', name: "map" })), h("slot", { key: '0bb35726b8b0270060d3261c1aa2bac760c7a1e5', name: "legend" }))), ((!this.tabView && this.documentPanelOpen) ||
             (this.tabView && this.activeTab === "document" && this.documentPanelOpen) ||
-            this.print) && (h(DocumentPanel, { key: '9b6d0e936adb8f740a97d9470726b6732275434e', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), h(Overlay, { key: 'e795a3cdb870b1f932925e875950523bfeae736b', ref: (element) => (this.overlay = element), dsoCloseOverlay: (e) => this.dsoCloseOverlay.emit({ originalEvent: e }) }))));
+            this.print) && (h(DocumentPanel, { key: '2d6f27dbdd3df5e802bf438174be59afc1a1915d', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), h(Overlay, { key: '14ab389cbf9060922b69c7f96c162a13b963d17f', ref: (element) => (this.overlay = element), dsoCloseOverlay: (e) => this.dsoCloseOverlay.emit({ originalEvent: e }) }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/bundle/dsot-document-component-demo.js

@@ -1,22 +1,22 @@
 import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, t as transformTag } from './p-Vur2Wu4N.js';
-import { g as getDefaultExportFromCjs, c as commonjsGlobal, d as defineCustomElement$a } from './p-DTl1ys7m.js';
+import { g as getDefaultExportFromCjs, c as commonjsGlobal, d as defineCustomElement$a } from './p-dzmskiHS.js';
 import { d as defineCustomElement$j } from './p-DgmLOl9Y.js';
-import { d as defineCustomElement$i } from './p-BNZi1Z7L.js';
-import { d as defineCustomElement$h } from './p-V_0y9IxV.js';
-import { d as defineCustomElement$g } from './p-BSMiHcUv.js';
+import { d as defineCustomElement$i } from './p-CiGy9stm.js';
+import { d as defineCustomElement$h } from './p-CFHg86YT.js';
+import { d as defineCustomElement$g } from './p-e6AL8TrE.js';
 import { d as defineCustomElement$f } from './p-B3xfmB17.js';
 import { d as defineCustomElement$e } from './p-CPtFrV76.js';
 import { d as defineCustomElement$d } from './p-C9-RLZ9M.js';
-import { d as defineCustomElement$c } from './p-BgXxa7rJ.js';
-import { d as defineCustomElement$b } from './p-D7GXr76y.js';
-import { d as defineCustomElement$9 } from './p-xhH9qNva.js';
+import { d as defineCustomElement$c } from './p-DTuqEGi5.js';
+import { d as defineCustomElement$b } from './p-CG7PB9Bx.js';
+import { d as defineCustomElement$9 } from './p-BWxYo2hl.js';
 import { d as defineCustomElement$8 } from './p-RlXOwxFy.js';
 import { d as defineCustomElement$7 } from './p-Bn0wLbPn.js';
-import { d as defineCustomElement$6 } from './p-CRfRjWq9.js';
-import { d as defineCustomElement$5 } from './p-wW5eBqvL.js';
-import { d as defineCustomElement$4 } from './p-CyJod4Vs.js';
-import { d as defineCustomElement$3 } from './p-DGvLPDdu.js';
-import { d as defineCustomElement$2 } from './p-Bnzoc8mM.js';
+import { d as defineCustomElement$6 } from './p-DvUBm_do.js';
+import { d as defineCustomElement$5 } from './p-B87-yu48.js';
+import { d as defineCustomElement$4 } from './p-A0rc0QLO.js';
+import { d as defineCustomElement$3 } from './p-DaNGJp1p.js';
+import { d as defineCustomElement$2 } from './p-BymZ1e8R.js';
 
 /**
  * lodash (Custom Build) <https://lodash.com/>

package/dist/bundle/{p-CyJod4Vs.js → p-A0rc0QLO.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, t as transformTag } from './p-Vur2Wu4N.js';
 import { v as v4 } from './p-CK3_k8jD.js';
 
-const slideToggleCss = () => `.sc-dso-slide-toggle-h{display:inline-block;padding-block-start:calc((1.5rem - 20px) * 0.5)}button.dso-slider.sc-dso-slide-toggle{border:0;padding:0}button.dso-slider.sc-dso-slide-toggle:focus-visible{outline:2px solid #323232;outline-offset:1px}button.dso-slider.sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#999;transition:fill 0.25s}button.dso-slider.sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{transition:transform 260ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;transform:translateX(10px);fill:#fff}button.dso-slider[aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#275937}button.dso-slider[aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{transform:translateX(30px);fill:#fff}button.dso-slider[disabled].sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#ccc}button.dso-slider[disabled].sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{fill:#e5e5e5}button.dso-slider[disabled][aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#a8bcaf}button.dso-slider[disabled][aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{fill:#e5e5e5}.dso-slider.sc-dso-slide-toggle{border-radius:24px;display:inline-flex}.dso-slider.sc-dso-slide-toggle:hover{cursor:pointer}`;
+const slideToggleCss = () => `.sc-dso-slide-toggle-h{display:inline-flex;align-items:flex-start;block-size:max-content;margin-block:calc((1lh - 20px) * 0.5);vertical-align:top}.sc-dso-slide-toggle-h:has(>label){margin-block:0}.sc-dso-slide-toggle-h:has(>label) button.dso-slider.sc-dso-slide-toggle{margin-block:calc((1lh - 20px) * 0.5);font:inherit}button.dso-slider.sc-dso-slide-toggle{border:0;padding:0}button.dso-slider.sc-dso-slide-toggle:focus-visible{outline:2px solid #323232;outline-offset:1px}button.dso-slider.sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#999;transition:fill 0.25s}button.dso-slider.sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{transition:transform 260ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;transform:translateX(10px);fill:#fff}button.dso-slider[aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#275937}button.dso-slider[aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{transform:translateX(30px);fill:#fff}button.dso-slider[disabled].sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#ccc}button.dso-slider[disabled].sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{fill:#e5e5e5}button.dso-slider[disabled][aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#a8bcaf}button.dso-slider[disabled][aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{fill:#e5e5e5}.dso-slider.sc-dso-slide-toggle{border-radius:24px;display:inline-flex}.dso-slider.sc-dso-slide-toggle:hover{cursor:pointer}`;
 
 const SlideToggle = /*@__PURE__*/ proxyCustomElement(class SlideToggle extends H {
     constructor(registerHost) {
@@ -33,7 +33,7 @@ const SlideToggle = /*@__PURE__*/ proxyCustomElement(class SlideToggle extends H
         this.hasVisibleLabel = this.host.querySelector("*") !== null;
     }
     render() {
-        return (h(Fragment, { key: '64a97f9d83968bdebbc47b3bb4a3a2351505ad61' }, h("button", { key: '692a3db28c1d319ad3da63d632f0064b7e08af75', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e), ...(this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), ...(this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {}) }, h("svg", { key: '4b4f22a4128da3c283c57c182705534df87cecb2', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, h("g", { key: '948390a81782cfe675544c9e79863cd966bb0a08', fill: "none", "fill-rule": "evenodd" }, h("rect", { key: '690fb1aa53236f9d8ab8fd37043d4c8a63a86f01', width: "40", height: "20", fill: "currentColor", rx: "10" }), h("circle", { key: '9a34f945b81e9796438d1044d199feafc9404e5e', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (h("label", { key: 'c2de4147452d4a3266261f902fc2cc1704310d04', htmlFor: this.identifier }, h("slot", { key: 'a03022da8ddce1a038652c88b43f6cb6e59e07d1' })))));
+        return (h(Fragment, { key: '23e0811e02855a33137317e2351ccf19b51a3fd3' }, h("button", { key: '2b1291c6876dce526060e71db2c63a68b2a6ff8b', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e), ...(this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), ...(this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {}) }, h("svg", { key: 'd9e4a98959b210205d93a44a075beb4f292e2977', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, h("g", { key: '3b1599d3640133fecedbd572cfe2387c691c2142', fill: "none", "fill-rule": "evenodd" }, h("rect", { key: '134d2c2a9f1bdfbd5fa3cf552406925472ce314e', width: "40", height: "20", fill: "currentColor", rx: "10" }), h("circle", { key: '971520ada40f7169cd5490348df4acf23d94a9af', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (h("label", { key: '8b8625782d75afa77f34a9918dd64fa194b76fd7', htmlFor: this.identifier }, h("slot", { key: 'd32ed096a2b76e6febdd8edfed192ae12a9b25ea' })))));
     }
     get host() { return this; }
     static get style() { return slideToggleCss(); }

package/dist/bundle/{p-p_SkZXGC.js → p-B7dXUJ1g.js}

@@ -27,7 +27,7 @@ const Progressindicator = /*@__PURE__*/ proxyCustomElement(class Progressindicat
         this.text = i18n(() => this.host, translations);
     }
     render() {
-        return (h(Host, { key: '4c4a20f9efaed65f1238c20d9e6edb1a451a22d9' }, h("span", { key: '21ce4ac50f717a0219a8e5ffd59efb2319107705', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, h("dso-icon", { key: '7452a5fc2d83e55f6728aa3886c259984006b708', icon: "spinner" })), h("span", { key: '654ee10f19a190b00787f9bc2e714a23f76ad6b2', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
+        return (h(Host, { key: '1171d9632c5644b4dccbc7199c229f9872350f3d' }, h("span", { key: 'a372aa112fb8633cec4b3f7fb259982b3b9fcbb5', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, h("dso-icon", { key: 'df2ea4078ecd40bb5a146fcc5737de5c312426f8', icon: "spinner" })), h("span", { key: '36dab5ea1a55d9056d1f0a7d01122727c530118f', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
     }
     get host() { return this; }
     static get style() { return progressIndicatorCss(); }

package/dist/bundle/{p-wW5eBqvL.js → p-B87-yu48.js}

@@ -115,9 +115,9 @@ const Scrollable = /*@__PURE__*/ proxyCustomElement(class Scrollable extends H {
         this.slottedElements.forEach((element) => resizeObserver.unobserve(element));
     }
     render() {
-        return (h("div", { key: '044daadd0db3bfa44f41435dec701580c8cfbe80', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, h("div", { key: 'c5041f6918872db966a93e5b9f533e7707681893', ref: (el) => (this.scrollContainerDiv = el), class: clsx("dso-scroll-container", {
+        return (h("div", { key: 'd0d493e2814ea4fac6546c35f78297804b04ea16', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, h("div", { key: 'f3e97b74617286db7315e5db4e4957bccad0f16e', ref: (el) => (this.scrollContainerDiv = el), class: clsx("dso-scroll-container", {
                 [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== "noScroll",
-            }), onScroll: () => this._setScrollState(), tabIndex: this._preventFocus ? -1 : undefined }, h("slot", { key: 'b8021f3b5aba48a53bd9d94cf61e2fe8846f184d' }))));
+            }), onScroll: () => this._setScrollState(), tabIndex: this._preventFocus ? -1 : undefined }, h("slot", { key: '7267fb4aa57d05940d1f0cea619c0717cf37acad' }))));
     }
     get host() { return this; }
     static get style() { return scrollableCss(); }

package/dist/bundle/{p-xhH9qNva.js → p-BWxYo2hl.js}

@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, h, F as Fragment, t as transformTag } from
 import { T as ToggletipController, i as isEventOutside } from './p-BcdVrDxP.js';
 import { T as Tooltip } from './p-D97933Iz.js';
 import { d as defineCustomElement$2 } from './p-B3xfmB17.js';
-import { d as defineCustomElement$1 } from './p-wW5eBqvL.js';
+import { d as defineCustomElement$1 } from './p-B87-yu48.js';
 
 const ozonContentToggletipCss = () => `*,*::after,*::before{box-sizing:border-box}.dso-tooltip{--_dso-alert-success-border-color:initial;--_dso-alert-error-border-color:initial;--_dso-alert-info-border-color:initial;--_dso-alert-warning-border-color:initial;background-color:#fff;color:#191919;border-radius:4px;overflow:unset;margin:0;border:0;padding:0;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));opacity:0;visibility:hidden;max-inline-size:480px}.dso-tooltip .tooltip-inner{--_dso-span-role-paragraph-margin-block:8px;--_dso-alert-success-border-color:initial;--_dso-alert-error-border-color:initial;--_dso-alert-info-border-color:initial;--_dso-alert-warning-border-color:initial;background-color:#fff;color:#191919;font-family:Asap, sans-serif;font-size:1rem;font-weight:normal;padding-block:0;padding-inline:0;border-radius:4px;line-height:1.5}.dso-tooltip .tooltip-arrow{position:absolute;background-color:#fff;border-start-start-radius:4px;block-size:10px;inline-size:10px;pointer-events:none;z-index:-1}:host{--_dso-rich-content-margin-block:8px;--_dso-scrollable-border-radius:4px;--_dso-scrollable-container-padding-inline:16px;--_dso-scrollable-container-padding-block:8px;display:inline}::slotted(:not([slot=label])){cursor:default !important}.toggletip-button{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}.toggletip-button:focus,.toggletip-button:focus-visible{outline-offset:2px}.toggletip-button:active{outline:0}.toggletip-button{border:0;color:var(--_dso-ozon-content-toggletip-color, #2b5780);line-height:1;padding:0;background-color:transparent;cursor:pointer;vertical-align:baseline;display:inline;overflow-wrap:break-word;user-select:text;white-space:nowrap}.toggletip-button,.toggletip-button:hover,.toggletip-button:focus-visible,.toggletip-button:active{text-decoration-line:var(--_dso-ozon-content-toggletip-text-decoration, underline);text-decoration-style:dotted;text-underline-offset:15%}.toggletip-button .toggletip-label{white-space:normal}.toggletip-button dso-icon{margin-inline-start:4px}`;
 

package/dist/bundle/{p-Bnzoc8mM.js → p-BymZ1e8R.js}

@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, h, c as Host, t as transformTag } from './p
 import { T as TooltipController } from './p-UUZISb3P.js';
 import { T as Tooltip } from './p-D97933Iz.js';
 
-const truncateCss = () => `.dso-tooltip{--_dso-alert-success-border-color:initial;--_dso-alert-error-border-color:initial;--_dso-alert-info-border-color:initial;--_dso-alert-warning-border-color:initial;background-color:#fff;color:#191919;border-radius:4px;overflow:unset;margin:0;border:0;padding:0;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));opacity:0;visibility:hidden;max-inline-size:640px}.dso-tooltip .tooltip-inner{--_dso-span-role-paragraph-margin-block:8px;--_dso-alert-success-border-color:initial;--_dso-alert-error-border-color:initial;--_dso-alert-info-border-color:initial;--_dso-alert-warning-border-color:initial;background-color:#fff;color:#191919;font-family:Asap, sans-serif;font-size:1rem;font-weight:normal;padding-block:8px;padding-inline:16px;border-radius:4px;line-height:1.5}.dso-tooltip .tooltip-arrow{position:absolute;background-color:#fff;border-start-start-radius:4px;block-size:10px;inline-size:10px;pointer-events:none;z-index:-1}*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-truncate-content{display:inline-block;max-inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;vertical-align:bottom;text-decoration:inherit}.dso-truncate-content:focus-visible{border-radius:2px;outline-offset:3px;outline:3px solid #008ccc}`;
+const truncateCss = () => `.dso-tooltip{--_dso-alert-success-border-color:initial;--_dso-alert-error-border-color:initial;--_dso-alert-info-border-color:initial;--_dso-alert-warning-border-color:initial;background-color:#fff;color:#191919;border-radius:4px;overflow:unset;margin:0;border:0;padding:0;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));opacity:0;visibility:hidden;max-inline-size:640px}.dso-tooltip .tooltip-inner{--_dso-span-role-paragraph-margin-block:8px;--_dso-alert-success-border-color:initial;--_dso-alert-error-border-color:initial;--_dso-alert-info-border-color:initial;--_dso-alert-warning-border-color:initial;background-color:#fff;color:#191919;font-family:Asap, sans-serif;font-size:1rem;font-weight:normal;padding-block:8px;padding-inline:16px;border-radius:4px;line-height:1.5}.dso-tooltip .tooltip-arrow{position:absolute;background-color:#fff;border-start-start-radius:4px;block-size:10px;inline-size:10px;pointer-events:none;z-index:-1}*,*::after,*::before{box-sizing:border-box}:host{display:grid;grid-template-columns:minmax(0, max-content)}.dso-truncate-content{display:inline-block;max-inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;vertical-align:bottom;text-decoration:inherit}.dso-truncate-content:focus-visible{border-radius:2px;outline-offset:3px;outline:3px solid #008ccc}`;
 
 const truncationChecks = new WeakMap();
 const resizeObserver = new ResizeObserver((entries) => {
@@ -121,7 +121,7 @@ const Truncate = /*@__PURE__*/ proxyCustomElement(class Truncate extends H {
         this.tooltipController.dispose();
     }
     render() {
-        return (h(Host, { key: '7044e989155cf26d80d85d664059ea505df09498' }, h("span", { key: 'dbf788a0775a4be2dc276737c9095fd26470b13c', class: "dso-truncate-content", ref: this.setContentElement, tabindex: this.truncated ? 0 : undefined, onMouseEnter: this.showTooltip, onMouseLeave: this.hideTooltip, onFocus: this.showTooltip, onBlur: this.hideTooltip }, h("slot", { key: 'cb197369b2da8df36102e4ba0f93d2b1a6130da2', ref: (element) => (this.slotElement = element) })), h(Tooltip, { key: '53ab33a7445a4774fcdba91af4c702dae9f5c2a2', tipElementRef: (element) => (this.tooltipElement = element), tipArrowElementRef: (element) => (this.tooltipArrowElement = element) }, h("div", { key: '5c7ad1a1275b527530fca85e0ebbb312a391bf4b', ref: this.setTooltipContentElement, "aria-hidden": "true" }))));
+        return (h(Host, { key: 'ffabc8c8152408895d6a7c66b56383af14a46b71' }, h("span", { key: 'b831a4489802fb2919da95d2c7958056e08c421c', class: "dso-truncate-content", ref: this.setContentElement, tabindex: this.truncated ? 0 : undefined, onMouseEnter: this.showTooltip, onMouseLeave: this.hideTooltip, onFocus: this.showTooltip, onBlur: this.hideTooltip }, h("slot", { key: 'd1e4de8b7739b49ae30cb089c8c480933e04aaca', ref: (element) => (this.slotElement = element) })), h(Tooltip, { key: '6fd10a229e11a1480c6d0074aecf67dc751925c5', tipElementRef: (element) => (this.tooltipElement = element), tipArrowElementRef: (element) => (this.tooltipArrowElement = element) }, h("div", { key: '876d73b01815c47d1a38b76028841cfccde4c65e', ref: this.setTooltipContentElement, "aria-hidden": "true" }))));
     }
     static get style() { return truncateCss(); }
 }, [257, "dso-truncate", {

package/dist/bundle/{p-DG55Bxs-.js → p-CCdI6Ua4.js}

@@ -2,8 +2,8 @@ import { p as proxyCustomElement, H, d as createEvent, f as forceUpdate, h, F as
 import { d as defineCustomElement$5 } from './p-B3xfmB17.js';
 import { d as defineCustomElement$4 } from './p-CPtFrV76.js';
 import { d as defineCustomElement$3 } from './p-Cuh4KbuH.js';
-import { d as defineCustomElement$2 } from './p-W3PIfudg.js';
-import { d as defineCustomElement$1 } from './p-wW5eBqvL.js';
+import { d as defineCustomElement$2 } from './p-CW6TwO8L.js';
+import { d as defineCustomElement$1 } from './p-B87-yu48.js';
 
 /**
  * Form random hash
@@ -72,7 +72,7 @@ const Selectable = /*@__PURE__*/ proxyCustomElement(class Selectable extends H {
         const describedBy = [hasInfo && this.infoFixed ? this.describedById : undefined, this.errormessage]
             .filter((value) => value !== undefined)
             .join(" ") || undefined;
-        return (h(Fragment, { key: '68845031d900fd4e836859c6628a6049a3f27ade' }, h("div", { key: 'f177f07dce575305a6fb165ca81c02ae09d7afa7', class: "dso-selectable-container" }, h("div", { key: '0769aa30e6aaa1f6961d83ebaa7a0c083d42a009', class: "dso-selectable-input-wrapper" }, h("input", { key: 'c93ec1b0ada9abf961064c3bdfbe529fcf3933c2', 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 ? (h("label", { htmlFor: this.getIdentifier() }, h("slot", null))) : (h("label", null, h("slot", null)))), hasInfo && !this.infoFixed && (h("dso-info-button", { key: '56e99d443552b32995befbea8dc16b656f38ac92', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: '59872ab73d6977023d5fd3fdecb3c30161877a6c', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: '19f24fdacb00641989b95442a9c1b2c66a0bbdfd' }, h("slot", { key: '45b881d9baef21e4cefa662ec0e8d8620779bfe7', name: "info" })))), h("slot", { key: 'bdc7f35cd2d93d9d5710b250bfaa565b26d51e7f', name: "options" })));
+        return (h(Fragment, { key: '8dd68e53dfd210af37dff9d5f690dc2518fb8d92' }, h("div", { key: '2f7471e7982eac3bd3f71f78a49c425cfb80374f', class: "dso-selectable-container" }, h("div", { key: '3e57c892c72a561880e0daede5ed021314d7b19a', class: "dso-selectable-input-wrapper" }, h("input", { key: '77f1802260eae5c61c49da3c33d6051da47eeef3', 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 ? (h("label", { htmlFor: this.getIdentifier() }, h("slot", null))) : (h("label", null, h("slot", null)))), hasInfo && !this.infoFixed && (h("dso-info-button", { key: 'a545fc8f475fe67e87c7c7bd2b6833befc1774db', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: '2e249a7ae4d92d5a8fe571b21fadd8d2ca019a10', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: 'fc58ac778599db02efa796aefb3372ba9d3f3fb7' }, h("slot", { key: 'd751a2429da3e43a1d9136a651cfd5a2c709037b', name: "info" })))), h("slot", { key: 'aaa73e33614ba4790696174afed3946486514619', name: "options" })));
     }
     componentDidRender() {
         if (this.input && typeof this.checked === "boolean" && this.input.checked !== this.checked) {