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

package/dist/collection/components/banner/banner.css

@@ -16,4 +16,240 @@
 .dso-banner.dso-compact {
   padding-block: 12px;
   padding-inline: 0;
+}
+.dso-banner.alert-error {
+  --_dso-alert-success-border-color: #39870c;
+  --_dso-alert-error-border-color: #ce3f51;
+  --_dso-alert-info-border-color: #6ca4d9;
+  --_dso-alert-warning-border-color: #dcd400;
+  --link-color: currentColor;
+  --link-hover-color: currentColor;
+  --link-visited-color: currentColor;
+}
+.dso-banner.alert-error a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart"));
+}
+.dso-banner.alert-error a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart"));
+}
+.dso-banner.alert-error a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart"));
+}
+.dso-banner.alert-error a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"));
+}
+.dso-banner.alert-error {
+  --_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-color: #191919;
+  --_dso-button-tertiary-hover-color: #4c4c4c;
+  --_dso-button-tertiary-active-color: #173521;
+  --_dso-button-tertiary-disabled-color: #999;
+  background-color: #f5d8dc;
+  color: #191919;
+  border-color: #f5d8dc;
+}
+.dso-banner.alert-info {
+  --_dso-alert-success-border-color: #39870c;
+  --_dso-alert-error-border-color: #ce3f51;
+  --_dso-alert-info-border-color: #6ca4d9;
+  --_dso-alert-warning-border-color: #dcd400;
+  --link-color: currentColor;
+  --link-hover-color: currentColor;
+  --link-visited-color: currentColor;
+}
+.dso-banner.alert-info a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart"));
+}
+.dso-banner.alert-info a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart"));
+}
+.dso-banner.alert-info a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart"));
+}
+.dso-banner.alert-info a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"));
+}
+.dso-banner.alert-info {
+  --_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-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;
+  border-color: #e1ecf7;
+}
+.dso-banner.alert-success {
+  --_dso-alert-success-border-color: #39870c;
+  --_dso-alert-error-border-color: #ce3f51;
+  --_dso-alert-info-border-color: #6ca4d9;
+  --_dso-alert-warning-border-color: #dcd400;
+  --link-color: currentColor;
+  --link-hover-color: currentColor;
+  --link-visited-color: currentColor;
+}
+.dso-banner.alert-success a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart"));
+}
+.dso-banner.alert-success a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart"));
+}
+.dso-banner.alert-success a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart"));
+}
+.dso-banner.alert-success a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"));
+}
+.dso-banner.alert-success {
+  --_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-color: #191919;
+  --_dso-button-tertiary-hover-color: #4c4c4c;
+  --_dso-button-tertiary-active-color: #173521;
+  --_dso-button-tertiary-disabled-color: #999;
+  background-color: #e4f1d4;
+  color: #191919;
+  border-color: #e4f1d4;
+}
+.dso-banner.alert-warning {
+  --_dso-alert-success-border-color: #39870c;
+  --_dso-alert-error-border-color: #ce3f51;
+  --_dso-alert-info-border-color: #6ca4d9;
+  --_dso-alert-warning-border-color: #dcd400;
+  --link-color: currentColor;
+  --link-hover-color: currentColor;
+  --link-visited-color: currentColor;
+}
+.dso-banner.alert-warning a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart"));
+}
+.dso-banner.alert-warning a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart"));
+}
+.dso-banner.alert-warning a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart"));
+}
+.dso-banner.alert-warning a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"));
+}
+.dso-banner.alert-warning {
+  --_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-color: #191919;
+  --_dso-button-tertiary-hover-color: #4c4c4c;
+  --_dso-button-tertiary-active-color: #173521;
+  --_dso-button-tertiary-disabled-color: #999;
+  background-color: #f8f6cc;
+  color: #191919;
+  border-color: #f8f6cc;
+}
+.dso-banner {
+  --_dt-rich-content-margin-block-end: 0;
+  --_dt-rich-content-margin-block-start: 0;
+  --_dt-rich-content-margin-inline-end: 8px;
+  --_dt-rich-content-padding-inline-end: 24px;
+  --_dt-heading-base-color: #000;
+  --_dt-heading-h2-color: #000;
+  --_dt-heading-h3-color: #000;
+  --_dt-heading-h4-color: #000;
+  --_dt-heading-h5-color: #000;
+  --_dt-heading-h1-font-size-xs: 1rem;
+  --_dt-heading-h1-font-size: 1rem;
+  --_dt-heading-h2-font-size-xs: 1rem;
+  --_dt-heading-h2-font-size: 1rem;
+  --_dt-heading-h3-font-size-xs: 1rem;
+  --_dt-heading-h3-font-size: 1rem;
+  --_dt-heading-h4-font-size: 1rem;
+  --_dt-heading-h5-font-size: 1rem;
+  --_dt-heading-h6-font-size: 1rem;
+  --_dt-heading-h2-first-child-float: inline-start;
+  --_dt-heading-h1-line-height: 1.5;
+  --_dt-heading-h2-line-height: 1.5;
+  --_dt-heading-h3-line-height: 1.5;
+  --_dt-heading-h4-line-height: 1.5;
+  --_dt-heading-h5-line-height: 1.5;
+  --_dt-heading-h6-line-height: 1.5;
+  --_dt-heading-margin-large-margin-block-end: 0;
+  --_dt-heading-margin-large-margin-block-start: 0;
+  --_dt-heading-margin-small-margin-block-end: 0;
+  --_dt-heading-margin-small-margin-block-start: 0;
+  --_dt-icon-button-position: absolute;
+  --_dt-icon-button-inset-inline-end: 16px;
+}
+
+.banner-inner {
+  line-height: 1.5;
+  margin-inline: auto;
+  padding-inline: 16px;
+  position: relative;
+}
+.banner-inner dso-icon {
+  display: inline-block;
+  inset-block-start: 0;
+  inset-inline-start: 16px;
+  position: absolute;
+}
+@media (min-width: 768px) {
+  .banner-inner {
+    inline-size: auto;
+  }
+}
+@media (min-width: 992px) {
+  .banner-inner {
+    inline-size: 922px;
+  }
+}
+@media (min-width: 1200px) {
+  .banner-inner {
+    inline-size: 1152px;
+  }
+}
+@media (min-width: 480px) {
+  .banner-inner.icon {
+    padding-inline-start: 48px;
+  }
+}
+@media (max-width: 479.01px) {
+  .banner-inner.icon {
+    padding-block-start: 39px;
+    padding-inline: 16px;
+  }
 }

package/dist/collection/components/banner/banner.js

@@ -12,11 +12,17 @@ export class Banner {
          * Option to show banner icon.
          */
         this.icon = false;
+        this.statusIcons = {
+            error: "status-error",
+            info: "status-info-solid",
+            success: "status-success",
+            warning: "status-warning",
+        };
     }
     render() {
-        return (h("section", { key: '1f953952b736586deeb73f0a436a3ef1d7ad51ab', class: clsx("dso-banner", `alert-${this.status}`, {
+        return (h("section", { key: '007b28f7e91ab33f8a496222a1df6ab3eb815e00', class: clsx("dso-banner", `alert-${this.status}`, {
                 "dso-compact": this.compact,
-            }), role: "alert" }, h("slot", { key: '3587c1a299268323692bf2d2c27a4259f75eb480' })));
+            }), role: "alert" }, h("div", { key: '1ab1b6f2a9be4823db2c02d847049a59273a3da9', class: clsx("banner-inner", { icon: this.icon }) }, (this.icon || !this.compact) && h("dso-icon", { key: '79dec5fa5382b350a9c4364f0c7bcc6e53994a21', icon: this.statusIcons[this.status] }), h("slot", { key: '302c66621ba53d52ccbb3fbbfefc1cac1fbb5425' }))));
     }
     static get is() { return "dso-banner"; }
     static get encapsulation() { return "shadow"; }
@@ -67,7 +73,7 @@ export class Banner {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
+                "reflect": true,
                 "attribute": "compact",
                 "defaultValue": "false"
             },

package/dist/collection/components/button-group/button-group.js

@@ -27,7 +27,7 @@ export class ButtonGroup {
         return hasMapIconButton || hasMapClass;
     }
     render() {
-        return (h("div", { key: '0cd0a65e9b4ed512a7f51248628b5729e591e5a9', class: clsx("container", { "has-map-buttons": this.hasMapButton }), role: "group" }, h("slot", { key: '529bd12bf8558e3d8f0a7d76bb49c9c0200714ed' })));
+        return (h("div", { key: '17449365a1695edc203f63523e1fefdbeeabb38b', class: clsx("container", { "has-map-buttons": this.hasMapButton }), role: "group" }, h("slot", { key: '2896d199e2064cc340ade13c0adeb6b3cda89452' })));
     }
     static get is() { return "dso-button-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/card/card.js

@@ -29,8 +29,8 @@ export class Card {
     }
     render() {
         const isSelectable = this.selectableSlottedElement !== null;
-        return (h(Host, { key: '0b9c26d1a491eead187bdcc26d2b6b57817eca31', "is-selectable": isSelectable }, h("div", { key: 'b52c62ddcee54a435c5d8212721612877a07b972', class: "dso-card-container" }, h("div", { key: 'a07e3907ba0c6455f8ccb36958ece3220af93eab', class: "dso-card-selectable", hidden: !isSelectable }, h("slot", { key: 'fa8bde0f224549caf881623a0ceb5745d07abce2', name: "selectable" })), h("div", { key: '34962e8d62f38925d2009d14669c5686690fcbfa', class: "dso-card-heading" }, (this.mode === "extern" && (h("a", { key: '754585f88fe4bc2a0dc90de191e81654ad01c0f0', href: this.href, class: "heading-anchor", target: "_blank", rel: "noopener noreferrer", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: '90cb149fe3d70cbc8b6db973ba2341ec0091a4e1', name: "heading" }), h("dso-icon", { key: '61731f3b68644ce94fbb82880714370fad5d9211', icon: "external-link" }), h("span", { key: 'ef03c618b979ec850b6ebb79efa5b26a19e218ca', class: "sr-only" }, "(Opent andere website in nieuw tabblad)")))) ||
-            (this.mode === "download" && (h("a", { key: '64d6243c5aef5cc6359ddc86745420c67e257989', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: '1df2c690db408fc0c3cd7bc952d9c6e390ae0614', name: "heading" }), h("dso-icon", { key: 'b2720002592fd8bd947c86ca4b3199c5cff73535', icon: "download" })))) || (h("a", { key: '5d1e9b8f8c3cd1a98d1a77699b3083b6c2b323f6', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: 'd9c93d3289412d714ed543dea3ecb4a299242959', name: "heading" }), h("dso-icon", { key: 'deadcd1ae3ae36e346a6ab050f7a085a4b2afe0d', icon: "chevron-right" }))), this.interactionsSlottedElement !== null && h("slot", { key: '53c596e25689b490a4e8a6cb059cbc8e60d7d3f4', name: "interactions" })), h("div", { key: '9237379b0b91ce0d0e3a4797aa19389e8aa99356', class: "dso-card-content" }, h("slot", { key: '63d29f83f27cd4be3251c161bee697bea774ae92', name: "content" })))));
+        return (h(Host, { key: '21779582996d3aae3e543c89bb3d7206c66cab33', "is-selectable": isSelectable }, h("div", { key: 'a330f0c2f7f8498aee3670fd4b31312f7de5227a', class: "dso-card-container" }, h("div", { key: 'ad2fd83e5669beb8b2803830ad52c59622dbd7bb', class: "dso-card-selectable", hidden: !isSelectable }, h("slot", { key: 'a87f490eaf33572880490b9faefb6eec464710bd', name: "selectable" })), h("div", { key: '4274c03b16c09d024d675cf23afb3aee042421c2', class: "dso-card-heading" }, (this.mode === "extern" && (h("a", { key: 'cd380e5c20f705f7b7124f10e5aed5ce07b21933', href: this.href, class: "heading-anchor", target: "_blank", rel: "noopener noreferrer", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: '08b3f9fdb23f71df28147243ff3b4e332837ec76', name: "heading" }), h("dso-icon", { key: '7c739f0ae901c1c5fa874920a960d3a753426111', icon: "external-link" }), h("span", { key: '26d4ebd7af03f7f8109491a36e7743bfa9370e19', class: "sr-only" }, "(Opent andere website in nieuw tabblad)")))) ||
+            (this.mode === "download" && (h("a", { key: '8e606cb91376b023854303412d308279a8001392', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: '1802bd095c9161ab8c8500499ed2b8402c0ce042', name: "heading" }), h("dso-icon", { key: '12ef0fc368509ba09ae3e29c91e293406e6a068b', icon: "download" })))) || (h("a", { key: '098959e2b33a3d07fd9704eddd944cb99808da8b', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: 'ad7dd47a7c1bee556eb2eadfa60ba17b08ab3af1', name: "heading" }), h("dso-icon", { key: '0ec299498862d67c412ab8205aff929d1f2c0b91', icon: "chevron-right" }))), this.interactionsSlottedElement !== null && h("slot", { key: '19e659d156274a52c24b66e3a882a9eabd11ba1e', name: "interactions" })), h("div", { key: '52d69ca31da125b6e6b7fb669272dbe44884491e', class: "dso-card-content" }, h("slot", { key: '2ea315dd879f0184236a4fa6c974574bd272f649', name: "content" })))));
     }
     static get is() { return "dso-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/card-container/card-container.js

@@ -7,7 +7,7 @@ export class CardContainer {
         this.mode = "list";
     }
     render() {
-        return (h(Fragment, null, this.mode === "list" && (h("ul", { key: '95c4b9efb0f971e75400362b4307082d08a9ecfa', class: "dso-card-list" }, h("slot", { key: 'c5e9b1c6a1ec0daf9959fae074983fd2d5131320' }))), this.mode === "grid" && (h("div", { key: '7b63aba8eb02ae54187ea9aa4dfb0dade6608ed8', class: "dso-card-grid" }, h("slot", { key: 'f7f20475f46a670706d12824e7efd7aadd2e6c19' })))));
+        return (h(Fragment, null, this.mode === "list" && (h("ul", { key: '76e936a9197707111af41c3fbd1f26d2a176a2ef', class: "dso-card-list" }, h("slot", { key: 'a40bd4a69a86b1519b4e2a3e116221560688874a' }))), this.mode === "grid" && (h("div", { key: '48c8852bc183928e8d4d6410d98afc73ae000333', class: "dso-card-grid" }, h("slot", { key: '295d9be623c1e2b2b564aea3f0889c2e43d88a6c' })))));
     }
     static get is() { return "dso-card-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/contact-information/contact-information.js

@@ -6,7 +6,7 @@ import { h } from "@stencil/core";
  */
 export class ContactInformation {
     render() {
-        return (h("div", { key: '509b3f51fa023a5b58d46e40252b917971afb600', class: "dso-contact-information" }, h("slot", { key: '281b8ad46ec6f591a9fc4d6d565d4dc847979ab7', name: "heading" }), h("slot", { key: '2de8f14e5116bf5bda27ef17f287b711997fd82c', name: "anchor-items" }), h("slot", { key: 'e67e73ff0b3785f5e13e76b01467484007378fbf', name: "info-items" })));
+        return (h("div", { key: '4fd898700da86ff5f3b741e5c910f838900dc508', class: "dso-contact-information" }, h("slot", { key: 'c3d81197601a308fda6dd76608a0b2b03a4d7fbf', name: "heading" }), h("slot", { key: 'b21829b093bc5b439ab120ebe3f90c664f22141f', name: "anchor-items" }), h("slot", { key: 'bc167a299dbda0199dc9804eccbdfc4c2b58a669', name: "info-items" })));
     }
     static get is() { return "dso-contact-information"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cursor-tooltip/cursor-tooltip.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class CursorTooltip {
     render() {
-        return (h(Host, { key: 'fe3c40f9ab20b3172e840b353cf4b2eeca1a96fe', class: "dso-cursor-tooltip" }, h("slot", { key: '11c043f041dce83de7740ffdb0b62481c4d10516' })));
+        return (h(Host, { key: 'f38dc945dba407fd21e3528929c15d9432623db6', class: "dso-cursor-tooltip" }, h("slot", { key: 'aa208364be2cc2570cd4de7726dc2c441a4138af' })));
     }
     static get is() { return "dso-cursor-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/date-picker/date-picker.js

@@ -105,7 +105,7 @@ export class DsoDatePicker {
         return undefined;
     }
     render() {
-        return (h("input", { key: 'd158728374aeea203e28cb6f8b9d3f5c99d4f887', type: "date", id: this.identifier, class: "dso-date__input", value: parseToValueFormat(this.value), name: this.name, min: parseToValueFormat(this.min), max: parseToValueFormat(this.max), disabled: this.disabled || undefined, required: this.required || undefined, "aria-autocomplete": "none", "aria-invalid": 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 (h("input", { key: '47631df93cddf10161ee2eabdaae4f976e86f00a', 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 }));
     }
     static get is() { return "dso-date-picker"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/document-card/document-card.js

@@ -29,7 +29,7 @@ export class DocumentCard {
         return this.host.querySelector("[slot='interactions']");
     }
     render() {
-        return (h("div", { key: '424a1e6058327ca1892f41626288909fdbe28972', class: "dso-document-card-container" }, h("div", { key: 'bf0e9dc501a1850af4dd64d36590de0d2103b164', class: "dso-document-card-heading" }, h("a", { key: 'fa110e3c6f1984741d02b515082e847b11aea781', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("span", { key: '32cd23687a349abef9083164795ebb17e833baf2', class: "icon-container" }, h("dso-icon", { key: 'f796e32f7d8c7e1ee350aa1b7a3de65be51fed36', icon: "chevron-right" }), h("slot", { key: 'a23262482804914228c0320525f41c2bbf35314e', name: "heading" })))), h("div", { key: '75734d9e95ded9f4fdde9c999d7a4233b8314f06', class: "dso-document-card-type" }, h("slot", { key: 'b18ce3010ae3cb4736ae92108e014fe51a2e2484', name: "type" })), h("div", { key: '46673ebfc66c849b1ba48337f1fb2f864b182759', class: "dso-document-card-status" }, this.metaSlottedElement !== null && h("slot", { key: '45418a415877277de76dcf3a6f8df0ad86c4f732', name: "meta" }), h("slot", { key: 'cd8bf629833394d19d423ba7b8912be3a7af5f53', name: "status" }), this.interactionsSlottedElement !== null && h("slot", { key: '3996b4f72f7658ef760dfcf7f6578b4b8951e0a0', name: "interactions" }))));
+        return (h("div", { key: 'cb3a601741335eca15dc6a29db65050617aed770', class: "dso-document-card-container" }, h("div", { key: '790d9f368acb655a4655aa2786d593338686ab3a', class: "dso-document-card-heading" }, h("a", { key: '8fefbc72ce0b86701402057b7944b0731c55b4e9', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("span", { key: 'ee22429b624a6dbac97ec7c41f33fa37c8816a3a', class: "icon-container" }, h("dso-icon", { key: 'a3c1913d55a7807e9dac4c92ed9a20d9ff2a5a7b', icon: "chevron-right" }), h("slot", { key: '875d4f00306cd0b80a7842c986df64d544ccad35', name: "heading" })))), h("div", { key: 'b34b5c1ea5979dd35a40b31cbf892f0ace506995', class: "dso-document-card-type" }, h("slot", { key: '5155b74dd5200f4f6363d1e5f77f2efbc670dcb2', name: "type" })), h("div", { key: 'e50a354a5f49057aa47ea8b260a66de72b102513', class: "dso-document-card-status" }, this.metaSlottedElement !== null && h("slot", { key: '11e497caa499af37a41c0c80be26a4a82a733e6a', name: "meta" }), h("slot", { key: 'fe67a0d252ce28f3c967766596b41946f3ffb732', name: "status" }), this.interactionsSlottedElement !== null && h("slot", { key: '6d0f12d4d5ae72a5e4a98a638381d38b458c6b7d', name: "interactions" }))));
     }
     static get is() { return "dso-document-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/document-component/document-component.js

@@ -182,17 +182,17 @@ export class DocumentComponent {
             this.alternativeTitle ||
             this.label ||
             this.annotated);
-        return (h(Host, { key: 'b2ea67a7dfa5662c4547541bdeb52c418af0b635', "not-collapsible": !collapsible }, showHeading && (h("div", { key: 'd6d28237eceb27b35ff3464f2342685e94bf7bea', class: "heading-container", part: "_heading-container" }, this.wijzigactie && h("span", { key: 'f05537c583e12690cb719c710e9a8a9184e163d9', class: "editaction-label" }, this.wijzigactieLabel, ":"), h("div", { key: '7dec2e9358bae0cbd6d88c768f7fcaadc6f3ed2a', class: "heading" }, h(Heading, { key: 'b176668f5b105b1b6d1032454abc3b42e96c80e5', heading: this.heading, class: "heading-element", onClick: this.alternativeTitle ? this.handleHeadingClick : undefined, mode: this.mode, href: this.href }, collapsible && this.mode === "document" && (h("dso-icon-button", { key: '5d9b506181510d8358d22c82d48b9f5b1a5202ca', label: this.open ? "Invouwen" : "Uitvouwen", class: "toggle-button", icon: this.open ? "chevron-down" : "chevron-right", variant: "tertiary", onDsoClick: (e) => this.handleHeadingClick(e.detail.originalEvent) })), h("div", { key: '5ee3779a4fa25efd53134c0e5152ffa9c3f2a4f1' }, this.notApplicable && h("span", { key: 'd2712c30e83defec625819891fe263f217027363', class: "sr-only" }, "Niet van toepassing:"), this._kop ? (h("dso-ozon-content", { class: "kop", content: this._kop, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "kop")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "kop" }), inline: true, urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })) : (h("span", { class: "alternative-title" }, (!this.mark && this.alternativeTitle) ||
-            (this.mark && this.alternativeTitle && (h(MarkText, { mark: this.mark && ((text) => this.mark?.(text, "alternativeTitle")), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), h(AantekenStatus, { key: 'b9066cea29de3ac6fc8a000ea67eccc55897786f', gereserveerd: this._gereserveerd, vervallen: this._vervallen }))), this.recursiveToggle !== undefined && this.open && this.mode === "document" && (h("dso-icon-button", { key: 'c4a0b6f6a2859cbbd82a45d1e2f90913b5b65e80', label: this.recursiveToggle === true ? "Verberg alles" : "Toon alles", class: "recursive-toggle", icon: this.recursiveToggle === true ? "eye" : "eye-slash", variant: "tertiary", onDsoClick: (e) => this.handleRecursiveToggleClick(e.detail.originalEvent) })), this.showBadge() && (h(Fragment, { key: 'd6d94f609b52f1451b49be5c37eb695b87384fa2' }, h("dso-badge", { key: 'fa08566cf4f6b2a96ebe74e1533c5caaf5a591ab', status: this.badgeStatus, label: this.badgeTooltip ? "Toon toelichting" : undefined }, this.badge, this.badgeTooltip && h("div", { key: '066192cfdfb3bf294abb75ef373d4715d5b8f127', slot: "toggletip" }, this.badgeTooltip)))), (this.label || this.annotated) && (h("div", { key: '206c59d201ecc521439e22dee7c10983e8a1552a', class: "addons" }, this.label && (h("dso-label", { key: 'ee60733621c45175485c0650af96669136d9c697', status: this.labelStatus, compact: true }, this.label)), this.annotated && this.mode === "document" && (h("dso-icon-button", { key: '71ba42f0dbae3ad07d683be8352a55fef5765ccd', label: `Kenmerken en kaartgegevens ${this.openAnnotation ? "verbergen" : "tonen"}`, icon: "label", variant: "tertiary", onDsoClick: (e) => this.dsoAnnotationToggle.emit({
+        return (h(Host, { key: '5eab063c132771eec2dcb232640e2908d490e6da', "not-collapsible": !collapsible }, showHeading && (h("div", { key: 'ca3331fbd327f7a66d409f2139f432a1278966fd', class: "heading-container", part: "_heading-container" }, this.wijzigactie && h("span", { key: '77a7286dd5456a2c26a16466db0fe7063a943de6', class: "editaction-label" }, this.wijzigactieLabel, ":"), h("div", { key: '0a384451b0b54c8462c980bfb98c7e0f4e047152', class: "heading" }, h(Heading, { key: 'f71b9e3eeaea520babe074252c530b0f32cba6f6', heading: this.heading, class: "heading-element", onClick: this.alternativeTitle ? this.handleHeadingClick : undefined, mode: this.mode, href: this.href }, collapsible && this.mode === "document" && (h("dso-icon-button", { key: '966bcf383d1d85784afd39587d1c1a37d7575cba', label: this.open ? "Invouwen" : "Uitvouwen", class: "toggle-button", icon: this.open ? "chevron-down" : "chevron-right", variant: "tertiary", onDsoClick: (e) => this.handleHeadingClick(e.detail.originalEvent) })), h("div", { key: '73ee74f243f11f7872397cdd3a1610e4c510f02b' }, this.notApplicable && h("span", { key: 'c5eb7ada26378297959694f33d933b680d4fcd24', class: "sr-only" }, "Niet van toepassing:"), this._kop ? (h("dso-ozon-content", { class: "kop", content: this._kop, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "kop")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "kop" }), inline: true, urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })) : (h("span", { class: "alternative-title" }, (!this.mark && this.alternativeTitle) ||
+            (this.mark && this.alternativeTitle && (h(MarkText, { mark: this.mark && ((text) => this.mark?.(text, "alternativeTitle")), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), h(AantekenStatus, { key: '980731a4dd7a6637c0b1aadbe75df91327e84614', gereserveerd: this._gereserveerd, vervallen: this._vervallen }))), this.recursiveToggle !== undefined && this.open && this.mode === "document" && (h("dso-icon-button", { key: 'fb98aec51e88c64c7105de18f4cc67e165036920', label: this.recursiveToggle === true ? "Verberg alles" : "Toon alles", class: "recursive-toggle", icon: this.recursiveToggle === true ? "eye" : "eye-slash", variant: "tertiary", onDsoClick: (e) => this.handleRecursiveToggleClick(e.detail.originalEvent) })), this.showBadge() && (h(Fragment, { key: '538155f983f2cbefb831de308e9a403a0d62a125' }, h("dso-badge", { key: '9bffeedd802118d7590a8631a678fdebdd51f99f', status: this.badgeStatus, label: this.badgeTooltip ? "Toon toelichting" : undefined }, this.badge, this.badgeTooltip && h("div", { key: 'e3c0581910d86195265616f3b45d23b930df810b', slot: "toggletip" }, this.badgeTooltip)))), (this.label || this.annotated) && (h("div", { key: '2e29397cb782c6d4fece1e9b34951ac75f2eecd5', class: "addons" }, this.label && (h("dso-label", { key: '5b599c31ae3ff8284397a626e53b52fab1dcd055', status: this.labelStatus, compact: true }, this.label)), this.annotated && this.mode === "document" && (h("dso-icon-button", { key: 'c8563e9a2ef91bba31adb817e570865fcba10b0d', label: `Kenmerken en kaartgegevens ${this.openAnnotation ? "verbergen" : "tonen"}`, icon: "label", variant: "tertiary", onDsoClick: (e) => this.dsoAnnotationToggle.emit({
                 current: this.openAnnotation,
                 next: !this.openAnnotation,
                 scrollRef: this.host,
                 originalEvent: e.detail.originalEvent,
-            }) }))))))), this.openAnnotation && (h("div", { key: '8162cc176d5a8c05b983c36cbb769722c91c9813', class: "annotation-container", part: "_annotation-container", role: "dialog", "aria-labelledby": "annotations-heading" }, h("dso-panel", { key: 'ffd7c0629cb9bb955551ac716d6edcfffab9c78e', id: "annotations", onDsoCloseClick: (e) => this.dsoAnnotationToggle.emit({
+            }) }))))))), this.openAnnotation && (h("div", { key: 'd5a6e418413e5e4fd686497d099237b342e2adcc', class: "annotation-container", part: "_annotation-container", role: "dialog", "aria-labelledby": "annotations-heading" }, h("dso-panel", { key: '5560087b37ff84039352e68d1ad4616b25268c16', id: "annotations", onDsoCloseClick: (e) => this.dsoAnnotationToggle.emit({
                 current: true,
                 next: false,
                 originalEvent: e,
-            }), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, h("h2", { key: 'c25b22f974f8396f2bbc44c0ae7a368d293bf88c', id: "annotations-heading", slot: "heading" }, "Kenmerken en kaart"), h("slot", { key: '3006e43fe595baf212fb17f9a47474151fa29966', name: "annotations" })))), this.open && (this._inhoud || this._gereserveerd || this._vervallen) && this.mode === "document" && (h("div", { key: '1026dadf34687669b2f09833a17286668842d5b4', class: "content", part: "_content" }, h(AantekenAlert, { key: '67918f72432b3a6f4c8cc1d2f4b21f51ba032437', gereserveerd: this._gereserveerd, vervallen: this._vervallen }), this._inhoud && (h("dso-ozon-content", { key: 'b782dc85db857445454076ddeeca96524f4e3012', content: this._inhoud, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "inhoud")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "inhoud" }), urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })))), h("div", { key: '5fbcca6a7d74bf25f29213bcdc64a2f9a38564d2', class: "children-container", part: "_children-container" }, h("slot", { key: 'a4424bd30e1b65048ba35a1ab9ff8b583cf73738' }))));
+            }), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, h("h2", { key: '10c4719d80aade41c23839de39c4a96413a2a1ea', id: "annotations-heading", slot: "heading" }, "Kenmerken en kaart"), h("slot", { key: '3bb1b72c45ab1dbf2e0bb4b1f12baf3f3ca1f74d', name: "annotations" })))), this.open && (this._inhoud || this._gereserveerd || this._vervallen) && this.mode === "document" && (h("div", { key: '427fdbc234458a16da09dba9d3c2fb95ec024e4e', class: "content", part: "_content" }, h(AantekenAlert, { key: 'ea348451f2018f71365592d611d6612c6712d668', gereserveerd: this._gereserveerd, vervallen: this._vervallen }), this._inhoud && (h("dso-ozon-content", { key: '964cb1e62f26a5591d8702c3d89af7913a9f7d52', content: this._inhoud, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "inhoud")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "inhoud" }), urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })))), h("div", { key: '6c6eaa9e24d0fa7dac9d34713a5a62e3f19e5022', class: "children-container", part: "_children-container" }, h("slot", { key: '8e605cec3bc14e9141ded3e2d5fc0755903782be' }))));
     }
     static get is() { return "dso-document-component"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/document-component-demo/document-component.demo.js

@@ -207,7 +207,7 @@ export class DocumentComponentDemo {
     }
     render() {
         const { DocumentComponent, MenuButton } = this;
-        return (h("dso-responsive-element", { key: '058599f9650f815afa87f970232d8ed44b2663d1', class: "dso-document-components" }, h("div", { key: 'dc467ffba434c8fa8cc067e030b58a0b8ca50f89', class: "dso-navbar" }, h("ul", { key: '55ddfb08d2fec8e08c59e049c8c89c438d7b6091', class: "dso-nav dso-nav-sub" }, this.getEmbeddedDocumentComponents(this.response)?.documentComponents?.map((d) => (h("li", { class: this.document === d ? "dso-active" : undefined }, h(MenuButton, { documentComponent: d })))))), this.document && h(DocumentComponent, { key: '36d612b47417ca9942463efd45f5e52fc6dfe198', path: [this.document] })));
+        return (h("dso-responsive-element", { key: '3da23565a2101bbe52be56b25878ffec369aff05', class: "dso-document-components" }, h("div", { key: 'a849bcbabe22f43376d7b0e1a0c7ce967e4f24af', class: "dso-navbar" }, h("ul", { key: 'eff0e1a6e8db844b52d54c18b10c4217b73f1465', class: "dso-nav dso-nav-sub" }, this.getEmbeddedDocumentComponents(this.response)?.documentComponents?.map((d) => (h("li", { class: this.document === d ? "dso-active" : undefined }, h(MenuButton, { documentComponent: d })))))), this.document && h(DocumentComponent, { key: 'd687e63404d61a6527fe45405e29ad288dd622c5', path: [this.document] })));
     }
     static get is() { return "dsot-document-component-demo"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/dropdown-menu/dropdown-menu.js

@@ -170,7 +170,7 @@ export class DropdownMenu {
         tabbables[nextIndex]?.focus();
     }
     render() {
-        return (h(Host, { key: '28f8eb6a00bf4a1b139c917e44ce8de42067e8c6', onFocusout: this.focusOutListener }, h("slot", { key: 'fcf093b872932b1f604ae3d5f93391189ac60bbb', name: "toggle" }), h("div", { key: '2a621a9cdcf5817faf1354640a0062caa5c5fe04', popover: "manual", ref: (element) => (this.popoverElement = element) }, h("slot", { key: '68633d9a0c505d120acac96e15058d44e01d9a00' }))));
+        return (h(Host, { key: '2b1a77a0d5ec49784f038af3540c6369d4c2cc2c', onFocusout: this.focusOutListener }, h("slot", { key: '32d8b7f6e23a5b11b5ab3bdeb78575fc6855322f', name: "toggle" }), h("div", { key: '262486ced58fb98375ccf8abc38959144fc9296d', popover: "manual", ref: (element) => (this.popoverElement = element) }, h("slot", { key: '2c76def3904869f1a6227430f6718d85eb9cfc30' }))));
     }
     static get is() { return "dso-dropdown-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/expandable/expandable.js

@@ -36,10 +36,10 @@ export class Expandable {
         }
     }
     render() {
-        return (h(Host, { key: 'b810b0f7e7d855836374cb60e55ab653c16cdb44', "aria-hidden": this.open ? "false" : "true", class: clsx({
+        return (h(Host, { key: 'cb4240aaf6c07bc54ffe334b2ba05a7471593dcd', "aria-hidden": this.open ? "false" : "true", class: clsx({
                 "dso-animate-ready": this.enableAnimation,
                 "dso-hide": this.isClosed,
-            }) }, h("div", { key: '63b2112c1323c523664f6eae7585bbdfd02a4238', class: "slot-container" }, h("slot", { key: '1db6f972e60b261ab42e49f993494b95f4a4ccf2' }))));
+            }) }, h("div", { key: '5e649127a1d0b41628bf5106f161d037cbc02d4e', class: "slot-container" }, h("slot", { key: '44ccc85c8af6b6fd368323bd04b22624227daa70' }))));
     }
     static get is() { return "dso-expandable"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/header/header.js

@@ -206,7 +206,7 @@ export class Header {
         }
     }
     render() {
-        return (h(Host, { key: '9cc9d82dd16150e19a5a8daccb0a4f2c650d9e15', "is-compact": this.isCompact }, h("div", { key: '9c9024838dd7d9535fa71d97132912d13e9a1fcf', class: "dso-header" }, h("div", { key: 'f3c9bfc1592c97fad7db25cde5f0e1241d2264d4', class: "logo-container" }, h("slot", { key: 'e1176a01b0dceef3e4c54123df4c0339b2bd0a56', name: "logo" })), this.isCompact ? this.renderCompact() : this.renderNormal())));
+        return (h(Host, { key: '049a7cd2e6c5beccbe9a1b23bcd505ce2cfbc1e4', "is-compact": this.isCompact }, h("div", { key: '69626521734262e4cb40369667b084bee23cec42', class: "dso-header" }, h("div", { key: '7e0106defaff8c5f6c0c8942c987d3416acb39bc', class: "logo-container" }, h("slot", { key: '7355a1f157c81f785bb101f7c5490aa6ae0330c4', name: "logo" })), this.isCompact ? this.renderCompact() : this.renderNormal())));
     }
     tabbables(withButton) {
         const tabbables = this.dropdownElement ? tabbable(this.dropdownElement) : [];

package/dist/collection/components/highlight-box/highlight-box.js

@@ -2,7 +2,7 @@ import { Host, h } from "@stencil/core";
 export class HighlightBox {
     render() {
         const hasCounter = this.step || !!this.element.querySelector("[slot=icon]");
-        return (h(Host, { key: '35803c970b866b42d0512c7d6a7db877b431053f', "has-counter": hasCounter }, hasCounter && h("div", { key: '228e50bc3a6a61065feb605a466e7a3b943d2b56', class: "dso-step-counter" }, this.step ?? h("slot", { key: '77cee35b45294b747acf6602bc4ffb5399e3f94a', name: "icon" })), h("slot", { key: '7f6d38f4c8514605b9721466409882313236b887' })));
+        return (h(Host, { key: '11fabaa968d990291c856c89f08c7d9cf73c47e8', "has-counter": hasCounter }, hasCounter && h("div", { key: 'f5bdf7d62ebf65996f6cf8c151ef4a4bab65654d', class: "dso-step-counter" }, this.step ?? h("slot", { key: '7a5a4f56968c88710cdb095bb9f2768efb9972f3', name: "icon" })), h("slot", { key: 'a2f640620379148fb881f993e17cf42d9e02bb4c' })));
     }
     static get is() { return "dso-highlight-box"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/history-item/history-item.js

@@ -42,7 +42,7 @@ export class HistoryItem {
         return this.host.querySelector("[slot='warning']");
     }
     render() {
-        return (h("div", { key: '1f64d214c8a55e32d46924c44e2a67e6fe762ba6', class: "history-item" }, h("div", { key: '1faf71543e8465d42636730a7a2d1f3f6b731b97', class: "history-item-date" }, h("slot", { key: 'fd30727dea17f047cc1191b17585b34e1aa28527', name: "date" })), h("div", { key: 'af748c630159e9fd76d7489ae9b463c60e7a2047', class: "history-item-content" }, h("div", { key: '718da0969265515c84b27397dda672aa5519a61f', class: "history-item-status-message" }, h("dso-icon", { key: '52e2f8abb5a0db890604556cf2eb6d03c1d977fd', icon: this.typeIcons[this.type], "aria-hidden": "true" }), h("slot", { key: 'a605bad20f157372dea498db2586cc99ca1aa4e7', name: "status" })), this.titleSlottedElement !== null && this.href && (h("div", { key: '147a283e5614d681a5828e2eed49892f4bc2b308', class: "history-item-title" }, h("a", { key: '94dc57f6a9de0eda156871da5eb08bc63967347c', href: this.href, class: "title-anchor", onClick: (e) => this.clickEventHandler(e), "aria-current": this.current ? "true" : undefined }, h("span", { key: 'a9e3fbb2a158c5301cd2e3b77417aa45d3f18d50', class: "history-item-title-content" }, h("slot", { key: 'f96e09b0853ded2962d51604c6924d18e8ec7352', name: "title" })), "\u2060", h("dso-icon", { key: '4f2c3df04231db6a328adb4ddc2787604447d119', icon: "chevron-right", "aria-hidden": "true" })))), this.explanationSlottedElement !== null && (h("div", { key: '4eb066cbfc8f5aeae2d4a81e78647bae853b5439', class: "history-item-explanation" }, h("slot", { key: '3c24ab2930fe3b24f222705f3581de5aee3949d4', name: "explanation" }))), this.warningSlottedElement !== null && (h("div", { key: '46ebd43221d15f1f5de0a4cf2458018278c85236', class: "history-item-warning" }, h("dso-icon", { key: '75863ed1f713b3873a2ea50c3b5a14f127c50e6e', icon: "status-warning-red-solid", role: "img", "aria-label": "Waarschuwing" }), h("slot", { key: '11f28b0b0e75cdaf14b7abdf5006f08faf81ec08', name: "warning" }))))));
+        return (h("div", { key: '46b086a93f12ddfa53c1fbabd36a96c7b2905bf9', class: "history-item" }, h("div", { key: 'e6e36dbbeea19b949f39e08d1447e159f3e9dec3', class: "history-item-date" }, h("slot", { key: '2abff00e5b46822d29f0ba132ec7bc611a743a77', name: "date" })), h("div", { key: '29015f198acaefe304926b6190cef2360468b171', class: "history-item-content" }, h("div", { key: '979f988d463139993a2ce50fe6c7aa5f67376055', class: "history-item-status-message" }, h("dso-icon", { key: '54fed97c8f7cda66a062a45135b4de5f8ae2e99d', icon: this.typeIcons[this.type], "aria-hidden": "true" }), h("slot", { key: 'a4e0f448ef5e2b8814894ec7ec363a9d1ca49054', name: "status" })), this.titleSlottedElement !== null && this.href && (h("div", { key: 'c7552d220c1c6975eddee04a05ef47fc901ed101', class: "history-item-title" }, h("a", { key: 'afb73216739f1e773e8af90ebd0fb3f9883389a1', href: this.href, class: "title-anchor", onClick: (e) => this.clickEventHandler(e), "aria-current": this.current ? "true" : undefined }, h("span", { key: 'b7ef7db153f9ab537f57c42ebe0b8cfeb05290c8', class: "history-item-title-content" }, h("slot", { key: '8102f8a64cea0c4a91403db71fe4238b8ab45657', name: "title" })), "\u2060", h("dso-icon", { key: '0db7fec66135bb97e504d69ec496dbe07f649080', icon: "chevron-right", "aria-hidden": "true" })))), this.explanationSlottedElement !== null && (h("div", { key: '04668c9a02458071fa95ef7ab07ab684c59209e2', class: "history-item-explanation" }, h("slot", { key: 'c8dce4885752b53bd86569793b0d479e136e020c', name: "explanation" }))), this.warningSlottedElement !== null && (h("div", { key: '4e70edd351fa28d880395da0d39635b80b89e5c6', class: "history-item-warning" }, h("dso-icon", { key: 'd57c337527ab3e37388f1ddcb27f127267dcd59c', icon: "status-warning-red-solid", role: "img", "aria-label": "Waarschuwing" }), h("slot", { key: '306f3b2e834b1f707f0422f7a928758787955189', name: "warning" }))))));
     }
     static get is() { return "dso-history-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/icon/icon.js

@@ -258,7 +258,7 @@ export class Icon {
             if (!icon) {
                 throw new TypeError(`Unknown svg: ${this.icon}`);
             }
-            return h("span", { key: '23ae18f6dfa49ec6901d7486d782e19948109378', class: "icon-container", innerHTML: icon.svg });
+            return h("span", { key: 'a3de4e16f316b2ccb22a32de5552f8458e41f8c9', class: "icon-container", innerHTML: icon.svg });
         }
     }
     static get is() { return "dso-icon"; }

package/dist/collection/components/icon-button/icon-button.css

@@ -156,6 +156,9 @@
 :host {
   display: inline-block;
   line-height: 1;
+  position: var(--_dt-icon-button-position, static);
+  inset-block-start: var(--_dt-icon-button-inset-block-start, 0);
+  inset-inline-end: var(--_dt-icon-button-inset-inline-end, 0);
 }
 
 *,

package/dist/collection/components/icon-button/icon-button.js

@@ -81,7 +81,7 @@ export class IconButton {
         this.cleanUpTooltip();
     }
     render() {
-        return (h("button", { key: 'd7721c9e6fe131f4a256578d676e46842f1d64ba', ref: (element) => (this.buttonElRef = element), type: "button", disabled: this.disabled, "aria-pressed": this.toggled ? "true" : "false", "aria-label": this.label, class: `icon-button dso-${this.variant} ${this.toggled ? "toggled" : ""}`, onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip, onClick: this.handleClick }, h("dso-icon", { key: '089d8bdaaf7588bfbc59bc48db4da1f9cd057a39', icon: this.icon, "aria-hidden": "true" }), h(Tooltip, { key: '19b031707592dffac68d65dc6103c8c2620a1bc8', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, this.label)));
+        return (h("button", { key: 'bcb111c03055a20cffd7a307a5835681ad66632e', ref: (element) => (this.buttonElRef = element), type: "button", disabled: this.disabled, "aria-pressed": this.toggled ? "true" : "false", "aria-label": this.label, class: `icon-button dso-${this.variant} ${this.toggled ? "toggled" : ""}`, onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip, onClick: this.handleClick }, h("dso-icon", { key: 'f3b4a53078e8c9526882418e70b7f96f33f3b429', icon: this.icon, "aria-hidden": "true" }), h(Tooltip, { key: '97824d969d3d5edb5b844389ddb3e8f8a1caa916', tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tooltipArrowElRef = element) }, this.label)));
     }
     static get is() { return "dso-icon-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/info/info.js

@@ -1,7 +1,7 @@
 import { Fragment, h } from "@stencil/core";
 export class Info {
     render() {
-        return (h(Fragment, { key: '902f98c97248e2ddd76978921405904b843de499' }, h("slot", { key: 'fe9eed78ba371fc455ccaa6d9d3cc5eb5d042184' }), !this.fixed && (h("dso-icon-button", { key: 'a41c8d68fe39567ad3e94cb6ab12803476cc1fc4', label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
+        return (h(Fragment, { key: 'd81ab4dea211496332b74f79201433be6b63090c' }, h("slot", { key: '51d4fbc532a26ef9aef802597deef2998b7865cf' }), !this.fixed && (h("dso-icon-button", { key: 'b7ce0e7b9cd19a8a958be91d87165a15e0003ac0', label: "Sluiten", variant: "tertiary", icon: "cross", onDsoClick: (e) => this.dsoClose.emit(e.detail.originalEvent) }))));
     }
     static get is() { return "dso-info"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/info-button/info-button.css

@@ -2,6 +2,7 @@
   --_dt-scrollable-border-radius: 4px;
   --_dt-scrollable-container-padding-inline: 16px;
   --_dt-scrollable-container-padding-block: 8px;
+  --_dt-icon-button-position: static;
   display: inline-block;
 }