@dso-toolkit/core 51.2.1 → 51.4.0

package/dist/dso-toolkit/p-f3f0d6c9.entry.js

@@ -0,0 +1 @@
+import{r as o,c as t,h as n}from"./p-98fd1658.js";import{A as e}from"./p-89b97fce.js";import"./p-4b8535b7.js";const s=class{constructor(n){o(this,n),this.dsoToggle=t(this,"dsoToggle",7),this.identifier=void 0,this.annotationPrefix=void 0}async toggleAnnotation(o,t){e.toggle(t),this.dsoToggle.emit({originalEvent:o,open:e.state[this.identifier]})}toggleHandler(o){this.toggleAnnotation(o,this.identifier)}render(){return n("dso-responsive-element",null,n("dso-expandable",Object.assign({id:this.identifier},e.state[this.identifier]?{open:!0}:{}),this.annotationPrefix&&n("span",{class:"dso-annotation-prefix"},this.annotationPrefix),n("div",{class:"dso-annotation-header"},n("slot",{name:"title"}),n("slot",{name:"addons"}),n("button",{type:"button",class:"dso-tertiary dso-annotation-close-button",onClick:o=>this.toggleHandler(o)},n("dso-icon",{icon:"times"}),n("span",{class:"sr-only"},"Toelichting sluiten"))),n("div",{class:"dso-annotation-content"},n("slot",null))))}};s.style="*,*::after,*::before{box-sizing:border-box}dso-annotation-output{display:block}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-annotation-header{align-items:center;background-color:#f2f2f2;clear:both;display:flex;margin-bottom:2px;margin-top:8px;padding-left:16px;padding-right:8px;padding-top:8px;padding-bottom:8px}.dso-annotation-header>*[slot=title]{color:#000;font-size:1.25rem;margin-bottom:0;margin-top:0}.dso-annotation-header>*:nth-child(2){margin-left:auto}dso-responsive-element[small] .dso-annotation-header,dso-responsive-element[medium] .dso-annotation-header{display:grid;row-gap:8px}dso-responsive-element[small] .dso-annotation-header *[slot=title],dso-responsive-element[medium] .dso-annotation-header *[slot=title]{grid-row:1;grid-column:1}dso-responsive-element[small] .dso-annotation-header *[slot=addons],dso-responsive-element[medium] .dso-annotation-header *[slot=addons]{grid-row:2;grid-column:1;margin-left:initial}dso-responsive-element[small] .dso-annotation-header .dso-annotation-close-button,dso-responsive-element[medium] .dso-annotation-header .dso-annotation-close-button{grid-row:1;grid-column:2;margin-left:8px;text-align:end}.dso-annotation-content{background-color:#f2f2f2;padding-left:16px;padding-right:8px;padding-top:8px;padding-bottom:8px}.dso-annotation-close-button{margin-left:32px}.dso-annotation-prefix{font-style:italic}";export{s as dso_annotation_output}

package/dist/dso-toolkit/p-f53860da.entry.js

@@ -0,0 +1 @@
+import{r as o,c as t,h as s,H as i,g as e}from"./p-98fd1658.js";import{c as l}from"./p-6a1980b4.js";const a=class{constructor(s){o(this,s),this.dsoRemoveClick=t(this,"dsoRemoveClick",7),this.mutationObserver=new MutationObserver((()=>{this.labelText=this.host.innerText,this.truncate&&this.truncateLabel()})),this.resizeObserver=new ResizeObserver((()=>this.truncateLabel())),this.keydownListenerActive=!1,this.keyDownListener=o=>{"Escape"===o.key&&(this.textHover=!1,this.textFocus=!1)},this.compact=void 0,this.removable=void 0,this.status=void 0,this.removeHover=void 0,this.removeFocus=void 0,this.truncate=void 0,this.textHover=void 0,this.textFocus=void 0,this.truncatedContent=void 0,this.labelText=void 0}watchTruncate(o){o?this.startTruncate():this.stopTruncate()}watchTooltipActive(){this.keydownListenerActive||!this.textHover&&!this.textFocus||(document.addEventListener("keydown",this.keyDownListener),this.keydownListenerActive=!0),this.textHover||this.textFocus||(document.removeEventListener("keydown",this.keyDownListener),this.keydownListenerActive=!1)}truncateLabel(){setTimeout((()=>{var o;this.labelContent&&(this.truncatedContent=(o=this.labelContent).scrollWidth>o.clientWidth?this.host.innerText:void 0)}))}componentDidLoad(){this.labelText=this.host.innerText,this.mutationObserver.observe(this.host,{attributes:!0,subtree:!0}),this.truncate&&this.startTruncate()}disconnectedCallback(){var o;null===(o=this.mutationObserver)||void 0===o||o.disconnect(),this.stopTruncate()}startTruncate(){this.resizeObserver.observe(this.host),this.truncateLabel()}stopTruncate(){document.removeEventListener("keydown",this.keyDownListener),this.resizeObserver.unobserve(this.host),this.truncatedContent=void 0,this.keydownListenerActive=!1}render(){const o=this.status&&a.statusMap.get(this.status);return s(i,{"aria-roledescription":this.truncate&&this.truncatedContent?"Deze tekst is visueel afgekapt en wordt volledig zichtbaar bij focus.":void 0},s("span",{"aria-describedby":"toggle-anchor",class:l("dso-label",{[`dso-label-${this.status}`]:this.status,"dso-compact":this.compact&&!this.removable,"dso-hover":this.removeHover||this.removeFocus})},s("slot",{name:"symbol"}),o&&s("span",{class:"sr-only"},o,": "),s("span",{class:l("dso-label-content",{"dso-truncate":!!this.truncate}),ref:o=>this.labelContent=o,tabindex:this.truncate&&this.truncatedContent?0:void 0,onMouseEnter:()=>this.textHover=!0,onMouseLeave:()=>this.textHover=!1,onFocus:()=>this.textFocus=!0,onBlur:()=>this.textFocus=!1},s("slot",null)),this.removable&&s("button",{type:"button",onClick:o=>this.dsoRemoveClick.emit(o),onMouseEnter:()=>this.removeHover=!0,onMouseLeave:()=>this.removeHover=!1,onFocus:()=>this.removeFocus=!0,onBlur:()=>this.removeFocus=!1},s("span",{class:"sr-only"},"Verwijder: ",this.labelText),s("dso-icon",{icon:"times"}))),s("dso-tooltip",{stateless:!0,id:"toggle-anchor",active:!!this.truncatedContent&&(this.textHover||this.textFocus),position:"top",strategy:"absolute"},this.truncatedContent))}get host(){return e(this)}static get watchers(){return{truncate:["watchTruncate"],textHover:["watchTooltipActive"],textFocus:["watchTooltipActive"]}}};a.statusMap=new Map([["info","Opmerking"],["success","Gelukt"],["warning","Waarschuwing"],["danger","Fout"]]),a.style=":host{display:inline-block;max-width:100%}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-label{background-color:#f2f2f2;border-radius:4px;color:#191919;display:inline-block;line-height:1.5;max-width:100%;padding:4px 8px}.dso-label:focus-within,.dso-label.dso-hover{text-decoration:line-through}.dso-label button{background:none;border:0;border-radius:0 4px 4px 0;color:inherit;float:right;font-size:1rem;margin-bottom:-4px;margin-left:8px;margin-right:-4px;margin-top:0;padding:0}.dso-label button:hover{cursor:pointer}.dso-label button>dso-icon,.dso-label button>svg.di{display:block}.dso-label.dso-label-info{background-color:#6ca4d9;color:#000}.dso-label.dso-label-primary{background-color:#275937;color:#fff}.dso-label.dso-label-success{background-color:#39870c;color:#fff}.dso-label.dso-label-warning{background-color:#dcd400;color:#000}.dso-label.dso-label-danger{background-color:#ce3f51;color:#fff}.dso-label.dso-label-error{background-color:#ce3f51;color:#fff}.dso-label.dso-label-bright{background-color:#fff;color:#191919;outline:1px solid #ccc;outline-offset:-1px}.dso-label.dso-label-attention{background-color:#8b4a6a;color:#fff}.dso-label.dso-compact{padding:0 8px}.dso-label.dso-hover .dso-label-content{text-decoration:line-through}.dso-truncate.dso-label-content{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;white-space:nowrap}:host([removable]) .dso-truncate.dso-label-content{max-width:calc(100% - 28px)}";export{a as dso_label}

package/dist/dso-toolkit/{p-76a1428a.entry.js → p-f8a08ba1.entry.js}

@@ -1 +1 @@
-import{r as e,c as o,h as s}from"./p-8f35c8f8.js";import{v as i}from"./p-5d7f4ff2.js";const t=class{constructor(s){e(this,s),this.dsoToggleOverlay=o(this,"dsoToggleOverlay",7),this.selectableRefs={},this.group=i(),this.overlays=void 0}overlayChangeHandler(e,o){const s=o.detail.target instanceof HTMLInputElement&&!!o.detail.target.checked;this.dsoToggleOverlay.emit({overlay:e,checked:s})}componentDidRender(){this.overlays.filter((e=>{var o,s;return!e.disabled&&!0===(null===(s=null===(o=this.previousOverlays)||void 0===o?void 0:o.find((o=>o.id===e.id)))||void 0===s?void 0:s.disabled)})).forEach((e=>{var o;null===(o=this.selectableRefs[e.id])||void 0===o||o.toggleInfo(!1)})),this.previousOverlays=this.overlays}render(){for(const e in this.selectableRefs)delete this.selectableRefs[e];return s("fieldset",{class:"form-group dso-checkboxes"},s("legend",{class:"sr-only"},"Kaartlagen"),s("div",{class:"dso-label-container"},s("span",{class:"control-label","aria-hidden":"true"},"Kaartlagen")),s("div",{class:"dso-field-container"},this.overlays.map((e=>s("dso-selectable",{key:e.id,type:"checkbox",value:e.name,checked:e.checked,disabled:e.disabled,name:this.group,ref:o=>o&&(this.selectableRefs[e.id]=o),onDsoChange:o=>this.overlayChangeHandler(e,o)},e.name,e.info?s("p",{slot:"info"},e.info):null)))))}};t.style=":host{display:block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}fieldset{border:0;margin:0;min-width:0;padding:0}fieldset .control-label{display:inline-block;font-weight:bold;margin-bottom:8px;max-width:100%;text-align:left}p[slot=info]{margin:0}";export{t as dso_map_overlays}
+import{r as e,c as o,h as s}from"./p-98fd1658.js";import{v as i}from"./p-5d7f4ff2.js";const t=class{constructor(s){e(this,s),this.dsoToggleOverlay=o(this,"dsoToggleOverlay",7),this.selectableRefs={},this.group=i(),this.overlays=void 0}overlayChangeHandler(e,o){const s=o.detail.target instanceof HTMLInputElement&&!!o.detail.target.checked;this.dsoToggleOverlay.emit({overlay:e,checked:s})}componentDidRender(){this.overlays.filter((e=>{var o,s;return!e.disabled&&!0===(null===(s=null===(o=this.previousOverlays)||void 0===o?void 0:o.find((o=>o.id===e.id)))||void 0===s?void 0:s.disabled)})).forEach((e=>{var o;null===(o=this.selectableRefs[e.id])||void 0===o||o.toggleInfo(!1)})),this.previousOverlays=this.overlays}render(){for(const e in this.selectableRefs)delete this.selectableRefs[e];return s("fieldset",{class:"form-group dso-checkboxes"},s("legend",{class:"sr-only"},"Kaartlagen"),s("div",{class:"dso-label-container"},s("span",{class:"control-label","aria-hidden":"true"},"Kaartlagen")),s("div",{class:"dso-field-container"},this.overlays.map((e=>s("dso-selectable",{key:e.id,type:"checkbox",value:e.name,checked:e.checked,disabled:e.disabled,name:this.group,ref:o=>o&&(this.selectableRefs[e.id]=o),onDsoChange:o=>this.overlayChangeHandler(e,o)},e.name,e.info?s("p",{slot:"info"},e.info):null)))))}};t.style=":host{display:block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}fieldset{border:0;margin:0;min-width:0;padding:0}fieldset .control-label{display:inline-block;font-weight:bold;margin-bottom:8px;max-width:100%;text-align:left}p[slot=info]{margin:0}";export{t as dso_map_overlays}

package/dist/esm/annotation.service-d0add3fc.js

@@ -0,0 +1,19 @@
+import { c as createStore } from './index-d6ffb688.js';
+
+class AnnotationService {
+  static get state() {
+    if (!this._state) {
+      AnnotationService.initializeStore();
+    }
+    return this._state;
+  }
+  static toggle(id) {
+    this._state[id] = !this._state[id];
+  }
+  static initializeStore() {
+    const { state } = createStore({});
+    AnnotationService._state = state;
+  }
+}
+
+export { AnnotationService as A };

package/dist/esm/dso-accordion-section.entry.js

@@ -1,4 +1,4 @@
-import { h, r as registerInstance, f as forceUpdate, F as Fragment, H as Host, a as getElement } from './index-1a4dda48.js';
+import { h, r as registerInstance, f as forceUpdate, F as Fragment, H as Host, g as getElement } from './index-ac5a22a3.js';
 import { d as debounce_1 } from './index-f2bf58ce.js';
 
 /*
@@ -1368,7 +1368,7 @@ const HandleIcon = ({ state, icon, attachmentCount }) => {
   }
 };
 
-const accordionSectionCss = "*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}:host{display:block}:host .dso-section-handle{font-size:1em;font-weight:600;line-height:1.375em;margin:0;position:relative}:host .dso-section-handle>a:active{text-decoration:none}:host .dso-section-handle a{text-decoration:none}:host .dso-section-handle a:hover,:host .dso-section-handle a:focus{text-decoration:none}:host .dso-section-handle a:active{text-decoration:underline}:host .dso-section-handle .dso-status{font-weight:400;text-decoration:underline}:host .dso-section-handle>button,:host .dso-section-handle>a{align-items:center;background-color:transparent;border:0;cursor:pointer;display:flex;font-family:Asap, sans-serif;font-size:1em;font-weight:600;line-height:1.375em;margin:0;padding:12px 16px 12px;text-align:start;width:100%;word-break:break-word}:host .dso-section-handle>button dso-icon,:host .dso-section-handle>a dso-icon{flex-shrink:0}:host .dso-section-handle>button dso-icon.dso-section-handle-chevron,:host .dso-section-handle>a dso-icon.dso-section-handle-chevron{transition:transform 260ms cubic-bezier(0.4, 0, 0.2, 1);transform:rotate(0)}:host .dso-section-handle>button>.dso-section-handle-addons:first-child,:host .dso-section-handle>button>dso-icon:first-child,:host .dso-section-handle>a>.dso-section-handle-addons:first-child,:host .dso-section-handle>a>dso-icon:first-child{margin-right:8px}:host .dso-section-handle>button>dso-icon:last-child,:host .dso-section-handle>a>dso-icon:last-child{margin-left:auto}:host .dso-section-handle>button>.dso-section-handle-addons:last-child,:host .dso-section-handle>a>.dso-section-handle-addons:last-child{margin-left:auto}:host .dso-section-handle>button>.dso-section-handle-addons:last-child dso-attachments-counter,:host .dso-section-handle>button>.dso-section-handle-addons:last-child dso-icon,:host .dso-section-handle>a>.dso-section-handle-addons:last-child dso-attachments-counter,:host .dso-section-handle>a>.dso-section-handle-addons:last-child dso-icon{margin-left:16px}:host([open]) .dso-section-body{position:inherit;visibility:inherit}:host([open]) .dso-section-handle>button .dso-section-handle-chevron:first-child,:host([open]) .dso-section-handle>a .dso-section-handle-chevron:first-child{transform:rotate(90deg)}:host([open]) .dso-section-handle>button .dso-section-handle-chevron:last-child,:host([open]) .dso-section-handle>a .dso-section-handle-chevron:last-child{transform:rotate(-180deg)}.dso-section-body{background-color:#fff;border-top:0;margin-top:-4px;overflow-y:hidden}.dso-section-body:not(.dso-animate-ready){position:absolute;visibility:hidden}.dso-section-body .dso-section-body-content{padding:20px 16px 16px}:host(.dso-accordion-default) .dso-section-handle{background-color:#fff;border:1px solid #8b4a6a;border-radius:4px}:host(.dso-accordion-default) .dso-section-handle a,:host(.dso-accordion-default) .dso-section-handle button{color:#8b4a6a}:host(.dso-accordion-default) .dso-section-handle a:hover,:host(.dso-accordion-default) .dso-section-handle a:active,:host(.dso-accordion-default) .dso-section-handle a.active,:host(.dso-accordion-default) .dso-section-handle button:hover,:host(.dso-accordion-default) .dso-section-handle button:active,:host(.dso-accordion-default) .dso-section-handle button.active{color:#8b4a6a}:host(.dso-accordion-default) .dso-section-body{border:1px solid #8b4a6a;border-radius:0 0 4px 4px}:host(.dso-accordion-default[open])>.dso-section-handle{background-color:#8b4a6a;border-radius:0;border-top-left-radius:4px;border-top-right-radius:4px}:host(.dso-accordion-default[open])>.dso-section-handle a,:host(.dso-accordion-default[open])>.dso-section-handle button{color:#fff}:host(.dso-accordion-default[open])>.dso-section-handle a dso-attachments-counter,:host(.dso-accordion-default[open])>.dso-section-handle button dso-attachments-counter{--dso-attachments-counter-color:#fff;--dso-icon:var(--di-paperclip-wit)}:host(.dso-accordion-default.dso-nested-accordion[open]) .dso-section-body{background-color:#e5e5e5}:host(.dso-accordion-compact) .dso-section-handle{border-bottom:1px solid transparent;border-top:1px solid #ccc}:host(.dso-accordion-compact) .dso-section-handle a,:host(.dso-accordion-compact) .dso-section-handle button{color:#39870c;padding-bottom:11px;padding-left:0;padding-top:11px}:host(.dso-accordion-compact) .dso-section-handle a:hover,:host(.dso-accordion-compact) .dso-section-handle a:active,:host(.dso-accordion-compact) .dso-section-handle a.active,:host(.dso-accordion-compact) .dso-section-handle button:hover,:host(.dso-accordion-compact) .dso-section-handle button:active,:host(.dso-accordion-compact) .dso-section-handle button.active{color:#39870c}:host(.dso-accordion-compact) .dso-section-body .dso-section-body-content{padding-left:32px;padding-top:0;padding-right:0}:host(.dso-accordion-compact.dso-accordion-reverse-align) .dso-section-handle a,:host(.dso-accordion-compact.dso-accordion-reverse-align) .dso-section-handle button{padding-left:16px}:host(.dso-accordion-compact.dso-accordion-reverse-align) .dso-section-body .dso-section-body-content{padding-left:16px;padding-right:0}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle{background-color:transparent}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button{color:#39870c}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a:hover,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a:active,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a.active,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button:hover,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button:active,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button.active{color:#39870c}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a dso-attachments-counter,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button dso-attachments-counter{--dso-attachments-counter-color:#666;--dso-icon:var(--di-paperclip-grijs)}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-body{border-top:0}:host(.dso-accordion-compact.dso-nested-accordion[open])>.dso-section-body{padding-bottom:0}:host(.dso-accordion-compact.dso-nested-accordion[open])>.dso-section-body dso-accordion-section:last-child{border-bottom:0}:host(.dso-accordion-conclusion) .dso-section-handle{background-color:#f2f2f2;border:1px solid #f2f2f2}:host(.dso-accordion-conclusion) .dso-section-handle a,:host(.dso-accordion-conclusion) .dso-section-handle button{color:#191919}:host(.dso-accordion-conclusion) .dso-section-handle a:hover,:host(.dso-accordion-conclusion) .dso-section-handle a:active,:host(.dso-accordion-conclusion) .dso-section-handle a.active,:host(.dso-accordion-conclusion) .dso-section-handle button:hover,:host(.dso-accordion-conclusion) .dso-section-handle button:active,:host(.dso-accordion-conclusion) .dso-section-handle button.active{background-color:#e5e5e5;color:#191919}:host(.dso-accordion-conclusion) .dso-section-body{border:2px solid #f2f2f2}:host(.dso-accordion-conclusion[open]:not(.dso-nested-accordion))>.dso-section-handle{background-color:#f2f2f2}:host(.dso-accordion-conclusion[open]:not(.dso-nested-accordion))>.dso-section-handle a,:host(.dso-accordion-conclusion[open]:not(.dso-nested-accordion))>.dso-section-handle button{color:#191919}:host(.dso-accordion-conclusion[open]:not(.dso-nested-accordion))>.dso-section-handle a dso-attachments-counter,:host(.dso-accordion-conclusion[open]:not(.dso-nested-accordion))>.dso-section-handle button dso-attachments-counter{--dso-attachments-counter-color:#666;--dso-icon:var(--di-paperclip-grijs)}:host(.dso-accordion-conclusion.dso-nested-accordion[open]){background-color:#fff}";
+const accordionSectionCss = "*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}:host{display:block}:host .dso-section-handle{font-size:1em;font-weight:600;line-height:1.375em;margin:0;position:relative}:host .dso-section-handle>a:active{text-decoration:none}:host .dso-section-handle a{text-decoration:none}:host .dso-section-handle a:hover,:host .dso-section-handle a:focus{text-decoration:none}:host .dso-section-handle a:active{text-decoration:underline}:host .dso-section-handle .dso-status{font-weight:400;text-decoration:underline}:host .dso-section-handle>button,:host .dso-section-handle>a{align-items:center;background-color:transparent;border:0;cursor:pointer;display:flex;font-family:Asap, sans-serif;font-size:1em;font-weight:600;line-height:1.375em;margin:0;padding:12px 16px 12px;text-align:start;width:100%;word-break:break-word}:host .dso-section-handle>button dso-icon,:host .dso-section-handle>a dso-icon{flex-shrink:0}:host .dso-section-handle>button dso-icon.dso-section-handle-chevron,:host .dso-section-handle>a dso-icon.dso-section-handle-chevron{transition:transform 260ms cubic-bezier(0.4, 0, 0.2, 1);transform:rotate(0)}:host .dso-section-handle>button>.dso-section-handle-addons:first-child,:host .dso-section-handle>button>dso-icon:first-child,:host .dso-section-handle>a>.dso-section-handle-addons:first-child,:host .dso-section-handle>a>dso-icon:first-child{margin-right:8px}:host .dso-section-handle>button>dso-icon:last-child,:host .dso-section-handle>a>dso-icon:last-child{margin-left:auto}:host .dso-section-handle>button>.dso-section-handle-addons:last-child,:host .dso-section-handle>a>.dso-section-handle-addons:last-child{margin-left:auto}:host .dso-section-handle>button>.dso-section-handle-addons:last-child dso-attachments-counter,:host .dso-section-handle>button>.dso-section-handle-addons:last-child dso-icon,:host .dso-section-handle>a>.dso-section-handle-addons:last-child dso-attachments-counter,:host .dso-section-handle>a>.dso-section-handle-addons:last-child dso-icon{margin-left:16px}:host([open]) .dso-section-body{position:inherit;visibility:inherit}:host([open]) .dso-section-handle>button .dso-section-handle-chevron:first-child,:host([open]) .dso-section-handle>a .dso-section-handle-chevron:first-child{transform:rotate(90deg)}:host([open]) .dso-section-handle>button .dso-section-handle-chevron:last-child,:host([open]) .dso-section-handle>a .dso-section-handle-chevron:last-child{transform:rotate(-180deg)}.dso-section-body{background-color:#fff;border-top:0;margin-top:-4px;overflow-y:hidden}.dso-section-body:not(.dso-animate-ready){position:absolute;visibility:hidden}.dso-section-body .dso-section-body-content{padding:20px 16px 16px}:host(.dso-accordion-default) .dso-section-handle{background-color:#fff;border:1px solid #8b4a6a;border-radius:4px}:host(.dso-accordion-default) .dso-section-handle a,:host(.dso-accordion-default) .dso-section-handle button{color:#8b4a6a}:host(.dso-accordion-default) .dso-section-handle a:hover,:host(.dso-accordion-default) .dso-section-handle a:active,:host(.dso-accordion-default) .dso-section-handle a.active,:host(.dso-accordion-default) .dso-section-handle button:hover,:host(.dso-accordion-default) .dso-section-handle button:active,:host(.dso-accordion-default) .dso-section-handle button.active{color:#8b4a6a}:host(.dso-accordion-default) .dso-section-body{border:1px solid #8b4a6a;border-radius:0 0 4px 4px}:host(.dso-accordion-default[open])>.dso-section-handle{background-color:#8b4a6a;border-radius:0;border-top-left-radius:4px;border-top-right-radius:4px}:host(.dso-accordion-default[open])>.dso-section-handle a,:host(.dso-accordion-default[open])>.dso-section-handle button{color:#fff}:host(.dso-accordion-default[open])>.dso-section-handle a dso-attachments-counter,:host(.dso-accordion-default[open])>.dso-section-handle button dso-attachments-counter{--dso-attachments-counter-color:#fff;--dso-icon:var(--di-paperclip-wit)}:host(.dso-accordion-default.dso-nested-accordion[open]) .dso-section-body{background-color:#e5e5e5}:host(.dso-accordion-compact) .dso-section-handle{border-bottom:1px solid transparent;border-top:1px solid #ccc}:host(.dso-accordion-compact) .dso-section-handle a,:host(.dso-accordion-compact) .dso-section-handle button{color:#39870c;padding-bottom:11px;padding-left:0;padding-top:11px}:host(.dso-accordion-compact) .dso-section-handle a:hover,:host(.dso-accordion-compact) .dso-section-handle a:active,:host(.dso-accordion-compact) .dso-section-handle a.active,:host(.dso-accordion-compact) .dso-section-handle button:hover,:host(.dso-accordion-compact) .dso-section-handle button:active,:host(.dso-accordion-compact) .dso-section-handle button.active{color:#39870c}:host(.dso-accordion-compact) .dso-section-body .dso-section-body-content{padding-left:32px;padding-top:0;padding-right:0}:host(.dso-accordion-compact.dso-accordion-reverse-align) .dso-section-handle a,:host(.dso-accordion-compact.dso-accordion-reverse-align) .dso-section-handle button{padding-left:16px}:host(.dso-accordion-compact.dso-accordion-reverse-align) .dso-section-body .dso-section-body-content{padding-left:16px;padding-right:0}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle{background-color:transparent}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button{color:#39870c}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a:hover,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a:active,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a.active,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button:hover,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button:active,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button.active{color:#39870c}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle a dso-attachments-counter,:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-handle button dso-attachments-counter{--dso-attachments-counter-color:#666;--dso-icon:var(--di-paperclip-grijs)}:host(.dso-accordion-compact[open]:not(.dso-nested-accordion))>.dso-section-body{border-top:0}:host(.dso-accordion-compact.dso-nested-accordion[open])>.dso-section-body{padding-bottom:0}:host(.dso-accordion-compact.dso-nested-accordion[open])>.dso-section-body dso-accordion-section:last-child{border-bottom:0}:host(.dso-accordion-conclusion) .dso-section-handle{background-color:#f2f2f2;border:1px solid #f2f2f2}:host(.dso-accordion-conclusion) .dso-section-handle a,:host(.dso-accordion-conclusion) .dso-section-handle button{color:#000}:host(.dso-accordion-conclusion) .dso-section-handle a:hover,:host(.dso-accordion-conclusion) .dso-section-handle a:active,:host(.dso-accordion-conclusion) .dso-section-handle a.active,:host(.dso-accordion-conclusion) .dso-section-handle button:hover,:host(.dso-accordion-conclusion) .dso-section-handle button:active,:host(.dso-accordion-conclusion) .dso-section-handle button.active{background-color:#e5e5e5}:host(.dso-accordion-conclusion) .dso-section-handle a dso-attachments-counter,:host(.dso-accordion-conclusion) .dso-section-handle button dso-attachments-counter{--dso-attachments-counter-color:#000;--dso-icon:var(--di-paperclip-zwart)}:host(.dso-accordion-conclusion) .dso-section-body{border:2px solid #f2f2f2}:host(.dso-accordion-conclusion[open]:not(.dso-nested-accordion))>.dso-section-handle{background-color:#f2f2f2}:host(.dso-accordion-conclusion.dso-nested-accordion[open]){background-color:#fff}";
 
 const AccordionSection = class {
   constructor(hostRef) {

package/dist/esm/dso-accordion.entry.js

@@ -1,195 +1,5 @@
-import { g as getRenderingRef, f as forceUpdate, r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-1a4dda48.js';
-
-const appendToMap = (map, propName, value) => {
-    const items = map.get(propName);
-    if (!items) {
-        map.set(propName, [value]);
-    }
-    else if (!items.includes(value)) {
-        items.push(value);
-    }
-};
-const debounce = (fn, ms) => {
-    let timeoutId;
-    return (...args) => {
-        if (timeoutId) {
-            clearTimeout(timeoutId);
-        }
-        timeoutId = setTimeout(() => {
-            timeoutId = 0;
-            fn(...args);
-        }, ms);
-    };
-};
-
-/**
- * Check if a possible element isConnected.
- * The property might not be there, so we check for it.
- *
- * We want it to return true if isConnected is not a property,
- * otherwise we would remove these elements and would not update.
- *
- * Better leak in Edge than to be useless.
- */
-const isConnected = (maybeElement) => !('isConnected' in maybeElement) || maybeElement.isConnected;
-const cleanupElements = debounce((map) => {
-    for (let key of map.keys()) {
-        map.set(key, map.get(key).filter(isConnected));
-    }
-}, 2000);
-const stencilSubscription = () => {
-    if (typeof getRenderingRef !== 'function') {
-        // If we are not in a stencil project, we do nothing.
-        // This function is not really exported by @stencil/core.
-        return {};
-    }
-    const elmsToUpdate = new Map();
-    return {
-        dispose: () => elmsToUpdate.clear(),
-        get: (propName) => {
-            const elm = getRenderingRef();
-            if (elm) {
-                appendToMap(elmsToUpdate, propName, elm);
-            }
-        },
-        set: (propName) => {
-            const elements = elmsToUpdate.get(propName);
-            if (elements) {
-                elmsToUpdate.set(propName, elements.filter(forceUpdate));
-            }
-            cleanupElements(elmsToUpdate);
-        },
-        reset: () => {
-            elmsToUpdate.forEach((elms) => elms.forEach(forceUpdate));
-            cleanupElements(elmsToUpdate);
-        },
-    };
-};
-
-const unwrap = (val) => (typeof val === 'function' ? val() : val);
-const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {
-    const unwrappedState = unwrap(defaultState);
-    let states = new Map(Object.entries(unwrappedState !== null && unwrappedState !== void 0 ? unwrappedState : {}));
-    const handlers = {
-        dispose: [],
-        get: [],
-        set: [],
-        reset: [],
-    };
-    const reset = () => {
-        var _a;
-        // When resetting the state, the default state may be a function - unwrap it to invoke it.
-        // otherwise, the state won't be properly reset
-        states = new Map(Object.entries((_a = unwrap(defaultState)) !== null && _a !== void 0 ? _a : {}));
-        handlers.reset.forEach((cb) => cb());
-    };
-    const dispose = () => {
-        // Call first dispose as resetting the state would
-        // cause less updates ;)
-        handlers.dispose.forEach((cb) => cb());
-        reset();
-    };
-    const get = (propName) => {
-        handlers.get.forEach((cb) => cb(propName));
-        return states.get(propName);
-    };
-    const set = (propName, value) => {
-        const oldValue = states.get(propName);
-        if (shouldUpdate(value, oldValue, propName)) {
-            states.set(propName, value);
-            handlers.set.forEach((cb) => cb(propName, value, oldValue));
-        }
-    };
-    const state = (typeof Proxy === 'undefined'
-        ? {}
-        : new Proxy(unwrappedState, {
-            get(_, propName) {
-                return get(propName);
-            },
-            ownKeys(_) {
-                return Array.from(states.keys());
-            },
-            getOwnPropertyDescriptor() {
-                return {
-                    enumerable: true,
-                    configurable: true,
-                };
-            },
-            has(_, propName) {
-                return states.has(propName);
-            },
-            set(_, propName, value) {
-                set(propName, value);
-                return true;
-            },
-        }));
-    const on = (eventName, callback) => {
-        handlers[eventName].push(callback);
-        return () => {
-            removeFromArray(handlers[eventName], callback);
-        };
-    };
-    const onChange = (propName, cb) => {
-        const unSet = on('set', (key, newValue) => {
-            if (key === propName) {
-                cb(newValue);
-            }
-        });
-        // We need to unwrap the defaultState because it might be a function.
-        // Otherwise we might not be sending the right reset value.
-        const unReset = on('reset', () => cb(unwrap(defaultState)[propName]));
-        return () => {
-            unSet();
-            unReset();
-        };
-    };
-    const use = (...subscriptions) => {
-        const unsubs = subscriptions.reduce((unsubs, subscription) => {
-            if (subscription.set) {
-                unsubs.push(on('set', subscription.set));
-            }
-            if (subscription.get) {
-                unsubs.push(on('get', subscription.get));
-            }
-            if (subscription.reset) {
-                unsubs.push(on('reset', subscription.reset));
-            }
-            if (subscription.dispose) {
-                unsubs.push(on('dispose', subscription.dispose));
-            }
-            return unsubs;
-        }, []);
-        return () => unsubs.forEach((unsub) => unsub());
-    };
-    const forceUpdate = (key) => {
-        const oldValue = states.get(key);
-        handlers.set.forEach((cb) => cb(key, oldValue, oldValue));
-    };
-    return {
-        state,
-        get,
-        set,
-        on,
-        onChange,
-        use,
-        dispose,
-        reset,
-        forceUpdate,
-    };
-};
-const removeFromArray = (array, item) => {
-    const index = array.indexOf(item);
-    if (index >= 0) {
-        array[index] = array[array.length - 1];
-        array.length--;
-    }
-};
-
-const createStore = (defaultState, shouldUpdate) => {
-    const map = createObservableMap(defaultState, shouldUpdate);
-    map.use(stencilSubscription());
-    return map;
-};
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-ac5a22a3.js';
+import { c as createStore } from './index-d6ffb688.js';
 
 const accordionCss = ":host{display:block}*,*::after,*::before{box-sizing:border-box}";
 

package/dist/esm/dso-alert.entry.js

@@ -1,7 +1,7 @@
-import { r as registerInstance, h } from './index-1a4dda48.js';
+import { r as registerInstance, h } from './index-ac5a22a3.js';
 import { c as clsx } from './clsx.m-25174a58.js';
 
-const alertCss = ":host{display:block}:host(:not(:first-child)){margin-top:24px}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.alert{border:1px solid transparent;line-height:1.5;margin-bottom:24px;min-height:64px;position:relative}@media screen and (min-width: 481px){.alert{padding:19px 16px 19px 63px}}@media screen and (max-width: 480px){.alert{padding:63px 16px 16px}}.alert:not(:first-child){margin-top:24px}.alert.alert-success{color:#191919;background-color:#e4f1d4;border-color:#e4f1d4}.alert.alert-error{color:#191919;background-color:#f5d8dc;border-color:#f5d8dc}.alert.alert-warning{color:#191919;background-color:#f8f6cc;border-color:#f8f6cc}.alert.alert-info{color:#191919;background-color:#e1ecf7;border-color:#e1ecf7}.alert dso-icon{left:15px;position:absolute;top:15px;height:32px;width:32px}";
+const alertCss = ":host{display:block}:host(:not(:first-child)){margin-top:24px}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.alert{border:1px solid transparent;line-height:1.5;margin-bottom:24px;min-height:64px;position:relative}@media screen and (min-width: 481px){.alert{padding:19px 16px 19px 63px}}@media screen and (max-width: 480px){.alert{padding:63px 16px 16px}}.alert:not(:first-child){margin-top:24px}.alert.alert-success{color:#000;background-color:#e4f1d4;border-color:#e4f1d4}.alert.alert-error{color:#000;background-color:#f5d8dc;border-color:#f5d8dc}.alert.alert-warning{color:#000;background-color:#f8f6cc;border-color:#f8f6cc}.alert.alert-info{color:#000;background-color:#e1ecf7;border-color:#e1ecf7}.alert dso-icon{left:15px;position:absolute;top:15px;height:32px;width:32px}";
 
 const Alert = class {
   constructor(hostRef) {

package/dist/esm/dso-annotation-button.entry.js

@@ -0,0 +1,21 @@
+import { r as registerInstance, h } from './index-ac5a22a3.js';
+import { A as AnnotationService } from './annotation.service-d0add3fc.js';
+import './index-d6ffb688.js';
+
+const annotationButtonCss = "dso-annotation-button{display:block}";
+
+const AnnotationButton = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.identifier = undefined;
+  }
+  componentDidLoad() {
+    this.annotationOutput = document.querySelector(`dso-annotation-output[identifier='${this.identifier}']`);
+  }
+  render() {
+    return (h("button", { type: "button", class: "dso-tertiary", "aria-controls": this.identifier, "aria-expanded": AnnotationService.state[this.identifier] ? "true" : "false", onClick: (e) => { var _a; return (_a = this.annotationOutput) === null || _a === void 0 ? void 0 : _a.toggleAnnotation(e, this.identifier); } }, h("dso-icon", { icon: "label" }), h("span", { class: "sr-only" }, "Toelichting bekijken")));
+  }
+};
+AnnotationButton.style = annotationButtonCss;
+
+export { AnnotationButton as dso_annotation_button };

package/dist/esm/dso-annotation-output.entry.js

@@ -0,0 +1,31 @@
+import { r as registerInstance, c as createEvent, h } from './index-ac5a22a3.js';
+import { A as AnnotationService } from './annotation.service-d0add3fc.js';
+import './index-d6ffb688.js';
+
+const annotationOutputCss = "*,*::after,*::before{box-sizing:border-box}dso-annotation-output{display:block}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-annotation-header{align-items:center;background-color:#f2f2f2;clear:both;display:flex;margin-bottom:2px;margin-top:8px;padding-left:16px;padding-right:8px;padding-top:8px;padding-bottom:8px}.dso-annotation-header>*[slot=title]{color:#000;font-size:1.25rem;margin-bottom:0;margin-top:0}.dso-annotation-header>*:nth-child(2){margin-left:auto}dso-responsive-element[small] .dso-annotation-header,dso-responsive-element[medium] .dso-annotation-header{display:grid;row-gap:8px}dso-responsive-element[small] .dso-annotation-header *[slot=title],dso-responsive-element[medium] .dso-annotation-header *[slot=title]{grid-row:1;grid-column:1}dso-responsive-element[small] .dso-annotation-header *[slot=addons],dso-responsive-element[medium] .dso-annotation-header *[slot=addons]{grid-row:2;grid-column:1;margin-left:initial}dso-responsive-element[small] .dso-annotation-header .dso-annotation-close-button,dso-responsive-element[medium] .dso-annotation-header .dso-annotation-close-button{grid-row:1;grid-column:2;margin-left:8px;text-align:end}.dso-annotation-content{background-color:#f2f2f2;padding-left:16px;padding-right:8px;padding-top:8px;padding-bottom:8px}.dso-annotation-close-button{margin-left:32px}.dso-annotation-prefix{font-style:italic}";
+
+const AnnotationOutput = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.dsoToggle = createEvent(this, "dsoToggle", 7);
+    this.identifier = undefined;
+    this.annotationPrefix = undefined;
+  }
+  async toggleAnnotation(e, identifier) {
+    AnnotationService.toggle(identifier);
+    this.dsoToggle.emit({
+      originalEvent: e,
+      open: AnnotationService.state[this.identifier],
+    });
+  }
+  toggleHandler(e) {
+    this.toggleAnnotation(e, this.identifier);
+  }
+  render() {
+    const expandableProperties = AnnotationService.state[this.identifier] ? { open: true } : {};
+    return (h("dso-responsive-element", null, h("dso-expandable", Object.assign({ id: this.identifier }, expandableProperties), this.annotationPrefix && h("span", { class: "dso-annotation-prefix" }, this.annotationPrefix), h("div", { class: "dso-annotation-header" }, h("slot", { name: "title" }), h("slot", { name: "addons" }), h("button", { type: "button", class: "dso-tertiary dso-annotation-close-button", onClick: (e) => this.toggleHandler(e) }, h("dso-icon", { icon: "times" }), h("span", { class: "sr-only" }, "Toelichting sluiten"))), h("div", { class: "dso-annotation-content" }, h("slot", null)))));
+  }
+};
+AnnotationOutput.style = annotationOutputCss;
+
+export { AnnotationOutput as dso_annotation_output };

package/dist/esm/dso-attachments-counter.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-1a4dda48.js';
+import { r as registerInstance, h } from './index-ac5a22a3.js';
 
 const attachmentsCounterCss = ":host{display:inline-block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-attachments{color:var(--dso-attachments-counter-color, #666);display:inline-block;font-weight:400;text-decoration:none;white-space:nowrap}";
 

package/dist/esm/dso-autosuggest.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, F as Fragment, a as getElement } from './index-1a4dda48.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment, g as getElement } from './index-ac5a22a3.js';
 import { d as debounce_1 } from './index-f2bf58ce.js';
 import { v as v4 } from './v4-d398bde5.js';
 

package/dist/esm/dso-badge.entry.js

@@ -1,7 +1,7 @@
-import { r as registerInstance, h } from './index-1a4dda48.js';
+import { r as registerInstance, h } from './index-ac5a22a3.js';
 import { c as clsx } from './clsx.m-25174a58.js';
 
-const badgeCss = ":host{display:inline-block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-badge{background-color:#666;border:1px solid #666;border-radius:1em;color:#fff;display:inline-block;font-size:0.875em;line-height:1;min-width:1.5rem;padding:4px 8px;text-align:center}.dso-badge.badge-info{background-color:#6ca4d9;border-color:#6ca4d9;color:#191919}.dso-badge.badge-primary{background-color:#275937;border-color:#275937;color:#fff}.dso-badge.badge-success{background-color:#39870c;border-color:#39870c;color:#fff}.dso-badge.badge-warning{background-color:#dcd400;border-color:#dcd400;color:#191919}.dso-badge.badge-danger{background-color:#ce3f51;border-color:#ce3f51;color:#fff}.dso-badge.badge-error{background-color:#ce3f51;border-color:#ce3f51;color:#fff}.dso-badge.badge-outline{background-color:#fff;border-color:#191919;color:#191919}";
+const badgeCss = ":host{display:inline-block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-badge{background-color:#666;border:1px solid #666;border-radius:1em;color:#fff;display:inline-block;font-size:0.875em;line-height:1;min-width:1.5rem;padding:4px 8px;text-align:center}.dso-badge.badge-info{background-color:#6ca4d9;border-color:#6ca4d9;color:#000}.dso-badge.badge-primary{background-color:#275937;border-color:#275937;color:#fff}.dso-badge.badge-success{background-color:#39870c;border-color:#39870c;color:#fff}.dso-badge.badge-warning{background-color:#dcd400;border-color:#dcd400;color:#000}.dso-badge.badge-danger{background-color:#ce3f51;border-color:#ce3f51;color:#fff}.dso-badge.badge-error{background-color:#ce3f51;border-color:#ce3f51;color:#fff}.dso-badge.badge-outline{background-color:#fff;border-color:#191919;color:#191919}.dso-badge.badge-attention{background-color:#8b4a6a;border-color:#8b4a6a;color:#fff}";
 
 const Badge = class {
   constructor(hostRef) {

package/dist/esm/dso-banner.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-1a4dda48.js';
+import { r as registerInstance, h } from './index-ac5a22a3.js';
 import { c as clsx } from './clsx.m-25174a58.js';
 
 const bannerCss = ":host{display:block}*,*::after,*::before{box-sizing:border-box}.dso-banner{padding:16px 0;position:relative}";

package/dist/esm/dso-card-container.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, F as Fragment } from './index-1a4dda48.js';
+import { r as registerInstance, h, F as Fragment } from './index-ac5a22a3.js';
 
 const cardContainerCss = ":host .dso-card-list{padding-left:0;list-style:none;border-bottom:1px solid #ccc;margin-top:-1px}:host .dso-card-grid{display:grid;gap:32px;grid-template-columns:repeat(3, 1fr);grid-auto-rows:1fr}";
 

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

@@ -1,4 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-1a4dda48.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-ac5a22a3.js';
+import { c as clsx } from './clsx.m-25174a58.js';
 import { i as isModifiedEvent } from './is-modified-event-34370220.js';
 
 const isInteractiveElement = (element) => {
@@ -8,7 +9,7 @@ const isInteractiveElement = (element) => {
     element.tagName.startsWith("DSO-TOGGLETIP"));
 };
 
-const cardCss = ":host .dso-card-selectable,:host .dso-card-image{grid-row:span 2}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host .dso-card-heading{align-items:center;display:flex;justify-content:space-between;margin-bottom:8px}@media screen and (max-width: 480px){:host .dso-card-heading{flex-wrap:wrap}}:host .dso-card-image{margin-right:8px}";
+const cardCss = ":host .dso-card-selectable,:host .dso-card-image{grid-row:span 2}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host .dso-card-heading{align-items:center;display:flex;margin-bottom:8px}@media screen and (max-width: 480px){:host .dso-card-heading{flex-wrap:wrap}}:host .dso-card-image{margin-right:8px}";
 
 const Card = class {
   constructor(hostRef) {
@@ -16,9 +17,10 @@ const Card = class {
     this.dsoCardClicked = createEvent(this, "dsoCardClicked", 7);
     this.isSelectable = false;
     this.hasImage = false;
+    this.clickable = true;
   }
   clickEventHandler(e) {
-    if (!(e.target instanceof HTMLElement)) {
+    if (!(e.target instanceof HTMLElement) || !this.clickable) {
       return;
     }
     let element = e.target;
@@ -40,7 +42,7 @@ const Card = class {
     this.hasImage = this.host.querySelector("*[slot = 'image']") !== null;
   }
   render() {
-    return (h(Host, { onClick: (e) => this.clickEventHandler(e) }, h("div", { class: "dso-card-selectable", hidden: !this.isSelectable }, h("slot", { name: "selectable" })), h("div", { class: "dso-card-image", hidden: !this.hasImage }, h("slot", { name: "image" })), h("div", { class: "dso-card-heading" }, h("slot", { name: "heading" }), h("slot", { name: "interactions" })), h("div", { class: "dso-card-content" }, h("slot", { name: "content" }))));
+    return (h(Host, { class: clsx({ "dso-not-clickable": !this.clickable }), onClick: (e) => this.clickEventHandler(e) }, h("div", { class: "dso-card-selectable", hidden: !this.isSelectable }, h("slot", { name: "selectable" })), h("div", { class: "dso-card-image", hidden: !this.hasImage }, h("slot", { name: "image" })), h("div", { class: "dso-card-heading" }, h("slot", { name: "heading" }), h("slot", { name: "interactions" })), h("div", { class: "dso-card-content" }, h("slot", { name: "content" }))));
   }
   get host() { return getElement(this); }
 };

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

@@ -1,4 +1,4 @@
-import { h, r as registerInstance, c as createEvent, H as Host, a as getElement } from './index-1a4dda48.js';
+import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-ac5a22a3.js';
 import { c as createIdentifier } from './create-identifier-51ee50c4.js';
 
 var DaysOfWeek;

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

@@ -1,8 +1,9 @@
-import { r as registerInstance, h, H as Host, a as getElement } from './index-1a4dda48.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-ac5a22a3.js';
 import { t as tabbable } from './index.esm-8fc07ad8.js';
 import { v as v4 } from './v4-d398bde5.js';
+import { c as createPopper } from './popper-467f7841.js';
 
-const dropdownMenuCss = ":host(:focus){outline:none}:host{display:inline-block;position:relative}";
+const dropdownMenuCss = ":host(:focus){outline:none}:host{display:inline-block}";
 
 const DropdownMenu = class {
   constructor(hostRef) {
@@ -43,6 +44,15 @@ const DropdownMenu = class {
     this.open = false;
     this.dropdownAlign = "left";
     this.checkable = false;
+    this.boundary = undefined;
+  }
+  watchPosition() {
+    if (!this.popper) {
+      return;
+    }
+    this.popper.setOptions({
+      placement: this.dropdownAlign === "right" ? "bottom-end" : "bottom-start",
+    });
   }
   get button() {
     const button = this.host.querySelector('button[slot="toggle"]');
@@ -75,8 +85,35 @@ const DropdownMenu = class {
         li.setAttribute("role", "none");
       }
     }
+    if (this.popper) {
+      return;
+    }
+    const dropdownOptions = this.host.querySelector(".dso-dropdown-options");
+    if (!(dropdownOptions instanceof HTMLElement)) {
+      throw new Error("dropdown options element is not instanceof HTMLElement");
+    }
+    this.popper = createPopper(this.button, dropdownOptions, {
+      placement: this.dropdownAlign === "right" ? "bottom-end" : "bottom-start",
+      modifiers: [
+        {
+          name: "offset",
+          options: {
+            offset: [0, 2], // 2px margin between button and options
+          },
+        },
+        {
+          name: "preventOverflow",
+          options: {
+            boundary: this.boundary ? document.querySelector(this.boundary) : null,
+          },
+          enabled: this.boundary !== undefined,
+        },
+      ],
+    });
   }
   componentDidRender() {
+    var _a;
+    (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update();
     for (const li of Array.from(this.host.getElementsByTagName("li"))) {
       for (const tab of tabbable(li)) {
         tab.setAttribute("role", this.checkable ? "menuitemradio" : "menuitem");
@@ -97,6 +134,10 @@ const DropdownMenu = class {
       }
     });
   }
+  disconnectedCallback() {
+    var _a;
+    (_a = this.popper) === null || _a === void 0 ? void 0 : _a.destroy();
+  }
   getActiveElement(root = document) {
     const activeEl = root.activeElement;
     if (!activeEl) {
@@ -123,6 +164,9 @@ const DropdownMenu = class {
     return (h(Host, { onFocusout: this.focusOutListener, tabindex: this.open ? "-1" : undefined }, h("slot", { name: "toggle" }), h("div", { hidden: !this.open }, h("slot", null))));
   }
   get host() { return getElement(this); }
+  static get watchers() { return {
+    "dropdownAlign": ["watchPosition"]
+  }; }
 };
 DropdownMenu.style = dropdownMenuCss;
 

package/dist/esm/dso-expandable-heading.entry.js

@@ -0,0 +1,43 @@
+import { h, r as registerInstance, c as createEvent, F as Fragment } from './index-ac5a22a3.js';
+import { c as clsx } from './clsx.m-25174a58.js';
+import { v as v4 } from './v4-d398bde5.js';
+
+const Heading = ({ heading, ref, className }, children) => {
+  switch (heading) {
+    default:
+    case "h2":
+      return (h("h2", { ref: ref, class: className }, children));
+    case "h3":
+      return (h("h3", { ref: ref, class: className }, children));
+    case "h4":
+      return (h("h4", { ref: ref, class: className }, children));
+    case "h5":
+      return (h("h5", { ref: ref, class: className }, children));
+    case "h6":
+      return (h("h6", { ref: ref, class: className }, children));
+  }
+};
+
+const expandableHeadingCss = "h1,.h1,h2,.h2,h3,.h3{margin-bottom:16px;margin-top:24px}h1,.h1{line-height:1.25}h1{color:#275937;font-size:2rem;font-weight:700}h2,.h2{line-height:1.33}h2{color:#275937;font-size:1.5rem;font-weight:700}h3,.h3{line-height:1.2}h3{color:#275937;font-size:1.25rem;font-weight:600}h4,.h4,h5,.h5,h6,.h6{margin-bottom:16px;margin-top:12px}h4,.h4{line-height:1.5}h4{color:#275937;font-size:1rem;font-weight:600}h5,.h5{line-height:1.5}h5{color:#191919;font-size:1rem;font-weight:600}h6,.h6{line-height:1.5}:host{display:block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.expandable-heading{align-items:center;display:flex;margin-bottom:8px;margin-top:8px}.expandable-heading h2,.expandable-heading h3,.expandable-heading h4,.expandable-heading h5,.expandable-heading h6{font-size:1rem;margin-bottom:0;margin-right:8px;margin-top:0}.expandable-heading button{align-items:flex-start;cursor:pointer;background-color:transparent;border:0;color:inherit;display:flex;line-height:24px;font-size:inherit;font-weight:inherit;padding:0;text-align:left}.expandable-heading button>dso-icon{flex-shrink:0}.expandable-heading.dso-expandable-heading-black button{color:#000}dso-expandable{padding-left:24px}.addons-end{display:inline-block;margin-left:auto}";
+
+const ExpandableHeading = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.dsoToggle = createEvent(this, "dsoToggle", 7);
+    this.identifier = v4();
+    this.open = undefined;
+    this.heading = "h2";
+    this.color = "default";
+  }
+  toggle(e) {
+    this.open = !this.open;
+    this.dsoToggle.emit({ originalEvent: e, open: this.open });
+  }
+  render() {
+    const expandableProperties = this.open ? { open: true } : {};
+    return (h(Fragment, null, h("div", { class: clsx("expandable-heading", this.color === "black" ? "dso-expandable-heading-black" : "") }, h(Heading, { heading: this.heading }, h("button", { type: "button", "aria-expanded": this.open ? "true" : "false", "aria-controls": this.identifier, onClick: (e) => this.toggle(e) }, h("dso-icon", { icon: this.open ? "chevron-down" : "chevron-right" }), h("slot", { name: "title" }))), h("slot", { name: "addons-start" }), h("div", { class: "addons-end" }, h("slot", { name: "addons-end" }))), h("dso-expandable", Object.assign({ id: this.identifier }, expandableProperties), h("slot", null))));
+  }
+};
+ExpandableHeading.style = expandableHeadingCss;
+
+export { ExpandableHeading as dso_expandable_heading };

package/dist/esm/dso-expandable.entry.js

@@ -0,0 +1,16 @@
+import { r as registerInstance, h, H as Host } from './index-ac5a22a3.js';
+
+const expandableCss = ":host{display:none}:host([open]){display:block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";
+
+const Expandable = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.open = undefined;
+  }
+  render() {
+    return (h(Host, { "aria-hidden": this.open ? "false" : "true" }, h("slot", null)));
+  }
+};
+Expandable.style = expandableCss;
+
+export { Expandable as dso_expandable };