@dso-toolkit/core 79.0.1 → 79.1.0

package/dist/dso-toolkit/{p-cd149043.entry.js → p-46de999c.entry.js}

@@ -1,2 +1,2 @@
-import{r as n,c as t,f as o,h as e,F as s,g as i}from"./p-DxWmN7gh.js";import{c as r}from"./p-ChV9xqsO.js";const d="*,\n*::after,\n*::before {\n  box-sizing: border-box;\n}\n\n:host {\n  display: block;\n}\n\n.sr-only {\n  position: absolute;\n  inline-size: 1px;\n  block-size: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  border: 0;\n}\n\n.dso-tertiary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\n.dso-tertiary:focus, .dso-tertiary:focus-visible {\n  outline-offset: 2px;\n}\n.dso-tertiary:active {\n  outline: 0;\n}\n.dso-tertiary {\n  border: 0;\n  color: #39870c;\n  line-height: 1;\n  padding: 0;\n  background-color: transparent;\n}\n.dso-tertiary[disabled] {\n  color: #afcf9d;\n}\n.dso-tertiary[disabled].dso-spinner-left, .dso-tertiary[disabled].dso-spinner-right {\n  color: #39870c;\n}\n.dso-tertiary:not([disabled]):hover {\n  color: #275937;\n  text-decoration: underline;\n  text-underline-position: under;\n}\n.dso-tertiary:not([disabled]):active {\n  color: #173521;\n}\n.dso-tertiary.dso-align {\n  line-height: calc(1.5em - 1px);\n  padding-block: 11px;\n  padding-inline: 0;\n  position: relative;\n}\n.dso-tertiary.dso-truncate {\n  max-inline-size: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.dso-tertiary.dso-spinner-left::before {\n  background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  content: \"\";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: middle;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\n.dso-tertiary.dso-spinner-right::after {\n  background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  content: \"\";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: middle;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\n.dso-tertiary dso-icon + span:not(.sr-only),\n.dso-tertiary svg.di + span:not(.sr-only),\n.dso-tertiary span:not(.sr-only) + dso-icon,\n.dso-tertiary span:not(.sr-only) + svg.di {\n  margin-inline-start: 8px;\n}\n.dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),\n.dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),\n.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,\n.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up {\n  margin-inline-start: 4px;\n}\n.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),\n.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),\n.dso-tertiary svg.di.di-angle-down + span:not(.sr-only),\n.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),\n.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,\n.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,\n.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],\n.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] {\n  margin-inline-start: 0;\n}\n.dso-tertiary dso-icon,\n.dso-tertiary svg.di,\n.dso-tertiary span {\n  vertical-align: middle;\n}\n.dso-tertiary {\n  cursor: pointer;\n}\n\n.dso-input-number {\n  align-items: center;\n  display: flex;\n}\n.dso-input-number .dso-input-step-counter {\n  text-align: center;\n  inline-size: 1.5rem;\n  font-size: 14px;\n}\n\n.dso-button-group {\n  display: flex;\n  flex-direction: row;\n}\n.dso-button-group.dso-disabled > * {\n  background-color: #fff;\n  border-color: #e5e5e5;\n  color: #666;\n}\n.dso-button-group.dso-disabled > * {\n  pointer-events: none;\n}\n.dso-button-group > * {\n  border-radius: 0;\n}\n.dso-button-group > *:first-child {\n  border-radius: 4px 0 0 4px;\n}\n.dso-button-group > *:not(:first-child) {\n  border-inline-start-style: none !important;\n}\n.dso-button-group > *:last-child {\n  border-radius: 0 4px 4px 0;\n}\n.dso-button-group > *:only-child {\n  border-radius: 4px;\n}\n.dso-button-group > .dso-input-number {\n  border-style: solid;\n  border-width: 1px;\n  flex-wrap: nowrap;\n  padding-block: 0;\n  padding-inline: 16px;\n}\n.dso-button-group > .dso-input-number {\n  background-color: #fff;\n  border-color: #ccc;\n  color: #191919;\n}\n@media screen and (max-width: 767px) {\n  .dso-button-group > .dso-input-number {\n    justify-content: center;\n  }\n}\n.dso-button-group > *:hover + .dso-input-number,\n.dso-button-group > *:focus + .dso-input-number {\n  background-color: #fff;\n  border-color: #d7e7ce;\n  color: #191919;\n}\n.dso-button-group > *.dso-selected + .dso-input-number {\n  box-shadow: inset 0 -1px 0 0 #39870c, inset 0 1px 0 0 #39870c, inset -1px 0 0 0 #39870c;\n}\n.dso-button-group > *.dso-selected + .dso-input-number {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #191919;\n}\n.dso-button-group > *:active + .dso-input-number, .dso-button-group > *:active + .dso-input-number:hover,\n.dso-button-group > *.active + .dso-input-number,\n.dso-button-group > *.active + .dso-input-number:hover {\n  background-color: #fff;\n  border-color: #d7e7ce;\n  color: #191919;\n}\n.dso-button-group > *.disabled + .dso-input-number, .dso-button-group > *.disabled + .dso-input-number:hover,\n.dso-button-group > *[disabled] + .dso-input-number,\n.dso-button-group > *[disabled] + .dso-input-number:hover {\n  opacity: 1;\n}\n.dso-button-group > *.disabled + .dso-input-number, .dso-button-group > *.disabled + .dso-input-number:hover,\n.dso-button-group > *[disabled] + .dso-input-number,\n.dso-button-group > *[disabled] + .dso-input-number:hover {\n  background-color: #fff;\n  border-color: #ccc;\n  color: #666;\n}\n.dso-button-group .dso-list-button {\n  padding-inline-end: 15px;\n}\n\n.dso-list-button {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\n.dso-list-button:focus, .dso-list-button:focus-visible {\n  outline-offset: 2px;\n}\n.dso-list-button:active {\n  outline: 0;\n}\n.dso-list-button {\n  background-color: #fff;\n  border-color: #ccc;\n  color: #191919;\n}\n.dso-list-button {\n  border-radius: 4px;\n  border-width: 1px;\n  border-style: solid;\n  font-weight: 600;\n  padding-block: 15px;\n  padding-inline: 15px 47px;\n  position: relative;\n  text-align: start;\n  white-space: normal;\n  inline-size: 100%;\n  cursor: pointer;\n}\n.dso-list-button:hover, .dso-list-button:focus {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #191919;\n}\n.dso-list-button:active, .dso-list-button:active:hover, .dso-list-button.active, .dso-list-button.active:hover {\n  background-color: #fff;\n  border-color: #d7e7ce;\n  color: #191919;\n}\n.dso-list-button.disabled, .dso-list-button.disabled:hover, .dso-list-button[disabled], .dso-list-button[disabled]:hover {\n  background-color: #fff;\n  border-color: #ccc;\n  color: #666;\n}\n.dso-list-button.disabled, .dso-list-button.disabled:hover, .dso-list-button[disabled], .dso-list-button[disabled]:hover {\n  opacity: 1;\n}\n.dso-list-button dso-selectable:not(:last-child) {\n  margin-block-end: 0;\n}\n.dso-list-button .dso-selectable-container label {\n  font-weight: 700;\n}\n.dso-list-button.dso-selected {\n  border-color: #39870c;\n  border-width: 1px;\n  box-shadow: inset 0px 0px 0px 1px #39870c, inset -1px 0px 0px 0px #39870c;\n}\n@media screen and (min-width: 768px) {\n  .dso-list-button.dso-selected.dso-single-count {\n    border-inline-end: 0;\n    box-shadow: #39870c 0px 1px 0px 0px inset, #39870c 1px 0px 0px 0px inset, #39870c 0px -1px 0px 0px inset;\n  }\n}\n.dso-list-button label {\n  cursor: inherit;\n}\n.dso-list-button > span {\n  display: block;\n}\n.dso-list-button .dso-sublabel,\n.dso-list-button .subcontent {\n  font-weight: 400;\n  inline-size: 100%;\n  padding-inline-start: 32px;\n}\n.dso-list-button dso-icon {\n  block-size: 24px;\n  color: #39870c;\n  inset-block-start: 15px;\n  inset-inline-end: 15px;\n  inline-size: 24px;\n  page-break-before: always;\n  position: absolute;\n}\n@media screen and (max-width: 767px) {\n  .dso-list-button.dso-selected.dso-single-count::after {\n    inline-size: 0;\n  }\n}";const a=class{constructor(o){n(this,o);this.dsoCountChange=t(this,"dsoCountChange",7);this.dsoSelectedChange=t(this,"dsoSelectedChange",7);this.checked=false;this.disabled=false}get subcontentSlot(){return this.host.querySelector("[slot='subcontent']")}connectedCallback(){this.mutationObserver=new MutationObserver((()=>o(this.host)));this.mutationObserver.observe(this.host,{characterData:true,childList:true,subtree:true,attributes:true})}componentDidRender(){var n,t;if(!((n=this.subcontentSlot)===null||n===void 0?void 0:n.hasAttribute("aria-hidden"))){(t=this.subcontentSlot)===null||t===void 0?void 0:t.setAttribute("aria-hidden","true")}}disconnectedCallback(){var n;(n=this.mutationObserver)===null||n===void 0?void 0:n.disconnect();delete this.mutationObserver}stepValue(n,t){if(typeof this.count==="number"){const o=t==="increment"?this.count+1:this.count-1;if(!this.isNewCountValid(o)){return}this.dsoCountChange.emit({originalEvent:n,count:o})}}handleSelectClick(n){n.preventDefault();if(this.count!==undefined){this.dsoCountChange.emit({originalEvent:n,count:this.count>0?0:1});return}this.dsoSelectedChange.emit({originalEvent:n,checked:!this.checked})}isNewCountValid(n){return!(this.min!==undefined&&this.max!==undefined&&(n<Number(this.min)||n>Number(this.max)))}render(){const n=this.checked||this.count!==undefined&&this.count>0;return e("div",{key:"0b37e11b902caa51517815e5e6611d9a487c02d4",class:r(["dso-button-group",{"dso-disabled":this.disabled}])},e("div",{key:"df0de94d57ad3c1420421867cb2fa185caa03f4b",class:r(["dso-list-button",{"dso-selected":n,"dso-single-count":this.count===1}]),onClick:n=>this.handleSelectClick(n)},e("dso-selectable",{key:"579bf88e96f44505bd5b7b70e15f332416a39ec3",type:"checkbox",value:"list-button",name:"naam",checked:n,disabled:this.disabled},this.label,this.sublabel&&e("span",{key:"7aba20871104e042986a071ad2a82aef9b0bc26b",class:"sr-only"}," ",this.sublabel),this.subcontentSlot&&e("span",{key:"772c09a4fe393b10ff3d1996e307557f3c301b37",class:"sr-only"},this.subcontentPrefix&&this.subcontentPrefix+":"," ",e("span",{key:"64715a207f0fcedb22c9b777249b56cdf9e1528e",innerHTML:this.subcontentSlot.innerHTML}))),this.sublabel&&e("span",{key:"7ea31d7e3b7276ad0dda4ee09738929d2a3df418",class:"dso-sublabel"},this.sublabel),this.subcontentSlot&&e("div",{key:"302368b9c0914043d4d3a629427a2102ebc1e0bb",class:"subcontent"},e("slot",{key:"cd32b056e94a40ae2eeffac0fe6d213eaa88b6ae",name:"subcontent"}))),this.count!==undefined&&this.count>0&&e("div",{key:"d20d5a677a0a2a984cf9e4a96f8f1598a1b35020",class:"dso-input-number"},this.count>1&&e(s,null,e("button",{key:"e659f2d94e8111cbc0a63d752b319c99864ef4b8",type:"button",class:"dso-tertiary",disabled:this.count===Number(this.min)||this.disabled,onClick:n=>this.stepValue(n,"decrement")},e("dso-icon",{key:"897a934abd9c2911121718c9e0009d52d4adca48",icon:"minus-circle"}),e("span",{key:"8c1ec9ed11bbc94b67e1e230c7e02e9420fd96ad",class:"sr-only"},"Aantal verlagen")),e("span",{key:"1a22c11173c7bc113a10e0c1f9b4e7122dfe8d20",class:"dso-input-step-counter","aria-label":"Aantal","aria-live":"polite"},this.count)),e("button",{key:"bf56c331d501c94eb5c7f961fbd60226778c7edc",type:"button",class:"dso-tertiary",disabled:this.count===Number(this.max)||this.disabled,onClick:n=>this.stepValue(n,"increment")},e("dso-icon",{key:"f4f812d0a1041ebb3dcc45e624e5d568248b414e",icon:"plus-circle"}),e("span",{key:"57962f76c796ae1d63406a701dd5a873697cc022",class:"sr-only"},"Aantal verhogen"))))}get host(){return i(this)}};a.style=d;export{a as dso_list_button};
-//# sourceMappingURL=p-cd149043.entry.js.map
+import{r as n,c as t,f as o,h as e,F as s,g as i}from"./p-DxWmN7gh.js";import{c as r}from"./p-ChV9xqsO.js";const d="*,\n*::after,\n*::before {\n  box-sizing: border-box;\n}\n\n:host {\n  display: block;\n}\n\n.sr-only {\n  position: absolute;\n  inline-size: 1px;\n  block-size: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  border: 0;\n}\n\n.dso-tertiary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\n.dso-tertiary:focus, .dso-tertiary:focus-visible {\n  outline-offset: 2px;\n}\n.dso-tertiary:active {\n  outline: 0;\n}\n.dso-tertiary {\n  border: 0;\n  color: #39870c;\n  line-height: 1;\n  padding: 0;\n  background-color: transparent;\n}\n.dso-tertiary[disabled] {\n  color: #afcf9d;\n}\n.dso-tertiary[disabled].dso-spinner-left, .dso-tertiary[disabled].dso-spinner-right {\n  color: #39870c;\n}\n.dso-tertiary:not([disabled]):hover {\n  color: #275937;\n  text-decoration: underline;\n  text-underline-position: under;\n}\n.dso-tertiary:not([disabled]):active {\n  color: #173521;\n}\n.dso-tertiary.dso-align {\n  line-height: calc(1.5em - 1px);\n  padding-block: 11px;\n  padding-inline: 0;\n  position: relative;\n}\n.dso-tertiary.dso-truncate {\n  max-inline-size: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.dso-tertiary.dso-spinner-left::before {\n  background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  content: \"\";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: middle;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\n.dso-tertiary.dso-spinner-right::after {\n  background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  content: \"\";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: middle;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\n.dso-tertiary dso-icon + span:not(.sr-only),\n.dso-tertiary svg.di + span:not(.sr-only),\n.dso-tertiary span:not(.sr-only) + dso-icon,\n.dso-tertiary span:not(.sr-only) + svg.di {\n  margin-inline-start: 8px;\n}\n.dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),\n.dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),\n.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,\n.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up {\n  margin-inline-start: 4px;\n}\n.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),\n.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),\n.dso-tertiary svg.di.di-angle-down + span:not(.sr-only),\n.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),\n.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,\n.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,\n.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],\n.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] {\n  margin-inline-start: 0;\n}\n.dso-tertiary dso-icon,\n.dso-tertiary svg.di,\n.dso-tertiary span {\n  vertical-align: middle;\n}\n.dso-tertiary {\n  cursor: pointer;\n}\n\n.dso-input-number {\n  align-items: center;\n  display: flex;\n}\n.dso-input-number .dso-input-step-counter {\n  text-align: center;\n  inline-size: 1.5rem;\n  font-size: 14px;\n}\n\n.dso-button-group {\n  display: flex;\n  flex-direction: row;\n}\n.dso-button-group.dso-disabled > * {\n  background-color: #fff;\n  border-color: #e5e5e5;\n  color: #666;\n}\n.dso-button-group.dso-disabled > * {\n  pointer-events: none;\n}\n.dso-button-group > * {\n  border-radius: 0;\n}\n.dso-button-group > *:first-child {\n  border-radius: 4px 0 0 4px;\n}\n.dso-button-group > *:not(:first-child) {\n  border-inline-start-style: none !important;\n}\n.dso-button-group > *:last-child {\n  border-radius: 0 4px 4px 0;\n}\n.dso-button-group > *:only-child {\n  border-radius: 4px;\n}\n.dso-button-group > .dso-input-number {\n  border-style: solid;\n  border-width: 1px;\n  flex-wrap: nowrap;\n  padding-block: 0;\n  padding-inline: 16px;\n}\n.dso-button-group > .dso-input-number {\n  background-color: #fff;\n  border-color: #ccc;\n  color: #191919;\n}\n@media screen and (max-width: 767px) {\n  .dso-button-group > .dso-input-number {\n    justify-content: center;\n  }\n}\n.dso-button-group > *:hover + .dso-input-number,\n.dso-button-group > *:focus + .dso-input-number {\n  background-color: #fff;\n  border-color: #d7e7ce;\n  color: #191919;\n}\n.dso-button-group > *.dso-selected + .dso-input-number {\n  box-shadow: inset 0 -1px 0 0 #39870c, inset 0 1px 0 0 #39870c, inset -1px 0 0 0 #39870c;\n}\n.dso-button-group > *.dso-selected + .dso-input-number {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #191919;\n}\n.dso-button-group > *:active + .dso-input-number, .dso-button-group > *:active + .dso-input-number:hover,\n.dso-button-group > *.active + .dso-input-number,\n.dso-button-group > *.active + .dso-input-number:hover {\n  background-color: #fff;\n  border-color: #d7e7ce;\n  color: #191919;\n}\n.dso-button-group > *.disabled + .dso-input-number, .dso-button-group > *.disabled + .dso-input-number:hover,\n.dso-button-group > *[disabled] + .dso-input-number,\n.dso-button-group > *[disabled] + .dso-input-number:hover {\n  opacity: 1;\n}\n.dso-button-group > *.disabled + .dso-input-number, .dso-button-group > *.disabled + .dso-input-number:hover,\n.dso-button-group > *[disabled] + .dso-input-number,\n.dso-button-group > *[disabled] + .dso-input-number:hover {\n  background-color: #fff;\n  border-color: #ccc;\n  color: #666;\n}\n.dso-button-group .dso-list-button {\n  padding-inline-end: 15px;\n}\n\n.dso-list-button {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\n.dso-list-button:focus, .dso-list-button:focus-visible {\n  outline-offset: 2px;\n}\n.dso-list-button:active {\n  outline: 0;\n}\n.dso-list-button {\n  background-color: #fff;\n  border-color: #ccc;\n  color: #191919;\n}\n.dso-list-button {\n  border-radius: 4px;\n  border-width: 1px;\n  border-style: solid;\n  font-weight: 600;\n  padding-block: 15px;\n  padding-inline: 15px 47px;\n  position: relative;\n  text-align: start;\n  white-space: normal;\n  inline-size: 100%;\n  cursor: pointer;\n}\n.dso-list-button:hover, .dso-list-button:focus {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #191919;\n}\n.dso-list-button:active, .dso-list-button:active:hover, .dso-list-button.active, .dso-list-button.active:hover {\n  background-color: #fff;\n  border-color: #d7e7ce;\n  color: #191919;\n}\n.dso-list-button.disabled, .dso-list-button.disabled:hover, .dso-list-button[disabled], .dso-list-button[disabled]:hover {\n  background-color: #fff;\n  border-color: #ccc;\n  color: #666;\n}\n.dso-list-button.disabled, .dso-list-button.disabled:hover, .dso-list-button[disabled], .dso-list-button[disabled]:hover {\n  opacity: 1;\n}\n.dso-list-button dso-selectable:not(:last-child) {\n  margin-block-end: 0;\n}\n.dso-list-button .dso-selectable-container label {\n  font-weight: 700;\n}\n.dso-list-button.dso-selected {\n  border-color: #39870c;\n  border-width: 1px;\n  box-shadow: inset 0px 0px 0px 1px #39870c, inset -1px 0px 0px 0px #39870c;\n}\n@media screen and (min-width: 768px) {\n  .dso-list-button.dso-selected.dso-single-count {\n    border-inline-end: 0;\n    box-shadow: #39870c 0px 1px 0px 0px inset, #39870c 1px 0px 0px 0px inset, #39870c 0px -1px 0px 0px inset;\n  }\n}\n.dso-list-button label {\n  cursor: inherit;\n}\n.dso-list-button > span {\n  display: block;\n}\n.dso-list-button .dso-sublabel,\n.dso-list-button .subcontent {\n  font-weight: 400;\n  inline-size: 100%;\n  padding-inline-start: 32px;\n}\n.dso-list-button dso-icon {\n  block-size: 24px;\n  color: #39870c;\n  inset-block-start: 15px;\n  inset-inline-end: 15px;\n  inline-size: 24px;\n  page-break-before: always;\n  position: absolute;\n}\n@media screen and (max-width: 767px) {\n  .dso-list-button.dso-selected.dso-single-count::after {\n    inline-size: 0;\n  }\n}";const a=class{constructor(o){n(this,o);this.dsoCountChange=t(this,"dsoCountChange",7);this.dsoSelectedChange=t(this,"dsoSelectedChange",7);this.checked=false;this.disabled=false}get subcontentSlot(){return this.host.querySelector("[slot='subcontent']")}connectedCallback(){this.mutationObserver=new MutationObserver((()=>o(this.host)));this.mutationObserver.observe(this.host,{characterData:true,childList:true,subtree:true,attributes:true})}componentDidRender(){var n,t;if(!((n=this.subcontentSlot)===null||n===void 0?void 0:n.hasAttribute("aria-hidden"))){(t=this.subcontentSlot)===null||t===void 0?void 0:t.setAttribute("aria-hidden","true")}}disconnectedCallback(){var n;(n=this.mutationObserver)===null||n===void 0?void 0:n.disconnect();delete this.mutationObserver}stepValue(n,t){if(typeof this.count==="number"){const o=t==="increment"?this.count+1:this.count-1;if(!this.isNewCountValid(o)){return}this.dsoCountChange.emit({originalEvent:n,count:o})}}handleSelectClick(n){n.preventDefault();if(this.count!==undefined){this.dsoCountChange.emit({originalEvent:n,count:this.count>0?0:1});return}this.dsoSelectedChange.emit({originalEvent:n,checked:!this.checked})}isNewCountValid(n){return!(this.min!==undefined&&this.max!==undefined&&(n<Number(this.min)||n>Number(this.max)))}render(){const n=this.checked||this.count!==undefined&&this.count>0;return e("div",{key:"8aceb891a4bf706da844766b7961b7dfd3b78919",class:r(["dso-button-group",{"dso-disabled":this.disabled}])},e("div",{key:"4cd2f7a1ee81380b8acb67d73adeca684e3d5f57",class:r(["dso-list-button",{"dso-selected":n,"dso-single-count":this.count===1}]),onClick:n=>this.handleSelectClick(n)},e("dso-selectable",{key:"522fd6d9884adafc6bc6ac5e2138b13f6dd331dc",type:"checkbox",value:"list-button",name:"naam",checked:n,disabled:this.disabled},this.label,this.sublabel&&e("span",{key:"e7695d1d0eb19fd3d17d37d8cb9d1a7f5247dd7e",class:"sr-only"}," ",this.sublabel),this.subcontentSlot&&e("span",{key:"8258f5cd10f264e8a0d3c0a61953ded159705893",class:"sr-only"},this.subcontentPrefix&&this.subcontentPrefix+":"," ",e("span",{key:"1827dd58c8465c41cbbbd2b0d0841e285da7f3a0",innerHTML:this.subcontentSlot.innerHTML}))),this.sublabel&&e("span",{key:"5b9dc1c1da7b592702e68d686c3fb223d228738a",class:"dso-sublabel"},this.sublabel),this.subcontentSlot&&e("div",{key:"0c3f1b903ed1c0d970c2da48056b817d1d5780cb",class:"subcontent"},e("slot",{key:"65f5024a2f75c7098334379ebfa945494517b709",name:"subcontent"}))),this.count!==undefined&&this.count>0&&e("div",{key:"0219ac62a9df180d5708d9b54417ff9d7bda695c",class:"dso-input-number"},this.count>1&&e(s,{key:"603924707f6d09d8c4e4351a0a48aece262280cc"},e("dso-icon-button",{key:"5c2dd136a96d0016faab48751b783e2961dd8e70",label:"Aantal verlagen",variant:"tertiary",icon:"minus-circle",disabled:this.count===Number(this.min)||this.disabled,onDsoClick:n=>this.stepValue(n,"decrement")}),e("span",{key:"ca8666eae32565be519f9b8c8ccaa6e39799a7a6",class:"dso-input-step-counter","aria-label":"Aantal","aria-live":"polite"},this.count)),e("dso-icon-button",{key:"1207e8e0258adcc777f51576c197c2f5e8d98f5e",label:"Aantal verhogen",variant:"tertiary",icon:"plus-circle",disabled:this.count===Number(this.max)||this.disabled,onDsoClick:n=>this.stepValue(n,"increment")})))}get host(){return i(this)}};a.style=d;export{a as dso_list_button};
+//# sourceMappingURL=p-46de999c.entry.js.map

package/dist/dso-toolkit/p-46de999c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["listButtonCss","ListButton","constructor","hostRef","this","checked","disabled","subcontentSlot","host","querySelector","connectedCallback","mutationObserver","MutationObserver","forceUpdate","observe","characterData","childList","subtree","attributes","componentDidRender","_a","hasAttribute","_b","setAttribute","disconnectedCallback","disconnect","stepValue","e","direction","count","newValue","isNewCountValid","dsoCountChange","emit","originalEvent","handleSelectClick","preventDefault","undefined","dsoSelectedChange","min","max","Number","render","selected","h","key","class","clsx","onClick","type","value","name","label","sublabel","subcontentPrefix","innerHTML","Fragment","variant","icon","onDsoClick"],"sources":["src/components/list-button/list-button.scss?tag=dso-list-button&encapsulation=shadow","src/components/list-button/list-button.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/components/button\";\r\n@use \"~dso-toolkit/src/components/selectable\";\r\n@use \"~dso-toolkit/src/components/form-control\";\r\n@use \"~dso-toolkit/src/utilities\";\r\n\r\n@use \"list-button.variables\" as list-button-variables;\r\n\r\n@include utilities.box-sizing();\r\n\r\n@mixin _state-styling($background-color: inherit, $border-color: inherit, $color: inherit) {\r\n  & {\r\n    background-color: $background-color;\r\n    border-color: $border-color;\r\n    color: $color;\r\n  }\r\n}\r\n\r\n:host {\r\n  display: block;\r\n}\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n.dso-tertiary {\r\n  @include button.tertiary($modifiers: false);\r\n\r\n  // stylelint-disable-next-line no-duplicate-selectors -- needed to fix sass deprecation warnings: #2724\r\n  & {\r\n    cursor: pointer;\r\n  }\r\n}\r\n\r\n.dso-input-number {\r\n  align-items: center;\r\n  display: flex;\r\n\r\n  .dso-input-step-counter {\r\n    text-align: center;\r\n    inline-size: units.$ru3;\r\n    font-size: list-button-variables.$font-size-count;\r\n  }\r\n}\r\n\r\n.dso-button-group {\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  &.dso-disabled {\r\n    > * {\r\n      @include _state-styling(colors.$wit, colors.$grijs-10, colors.$grijs-60);\r\n\r\n      // stylelint-disable-next-line no-duplicate-selectors -- needed to fix sass deprecation warnings: #2724\r\n      & {\r\n        pointer-events: none;\r\n      }\r\n    }\r\n  }\r\n\r\n  > * {\r\n    border-radius: 0;\r\n\r\n    &:first-child {\r\n      border-radius: list-button-variables.$border-radius 0 0 list-button-variables.$border-radius;\r\n    }\r\n\r\n    &:not(:first-child) {\r\n      border-inline-start-style: none !important;\r\n    }\r\n\r\n    &:last-child {\r\n      border-radius: 0 list-button-variables.$border-radius list-button-variables.$border-radius 0;\r\n    }\r\n\r\n    &:only-child {\r\n      border-radius: list-button-variables.$border-radius;\r\n    }\r\n  }\r\n\r\n  > .dso-input-number {\r\n    border-style: solid;\r\n    border-width: 1px;\r\n    flex-wrap: nowrap;\r\n    padding-block: 0;\r\n    padding-inline: units.$u2;\r\n\r\n    @include _state-styling(colors.$wit, colors.$grijs-20, colors.$grijs-90);\r\n\r\n    @media screen and (max-width: media-query-breakpoints.$screen-xs-max) {\r\n      justify-content: center;\r\n    }\r\n  }\r\n\r\n  > *:hover + .dso-input-number,\r\n  > *:focus + .dso-input-number {\r\n    @include _state-styling(colors.$wit, button.$secondary-hover-background-color, colors.$grijs-90);\r\n  }\r\n\r\n  > *.dso-selected + .dso-input-number {\r\n    box-shadow:\r\n      inset 0 -1px 0 0 button.$secondary-border-color,\r\n      inset 0 1px 0 0 button.$secondary-border-color,\r\n      inset -1px 0 0 0 button.$secondary-border-color;\r\n\r\n    @include _state-styling(colors.$wit, button.$secondary-border-color, colors.$grijs-90);\r\n  }\r\n\r\n  > *:active + .dso-input-number,\r\n  > *.active + .dso-input-number {\r\n    &,\r\n    &:hover {\r\n      @include _state-styling(colors.$wit, button.$secondary-hover-background-color, colors.$grijs-90);\r\n    }\r\n  }\r\n\r\n  > *.disabled + .dso-input-number,\r\n  > *[disabled] + .dso-input-number {\r\n    &,\r\n    &:hover {\r\n      opacity: 1;\r\n\r\n      @include _state-styling(colors.$wit, colors.$grijs-20, colors.$grijs-60);\r\n    }\r\n  }\r\n\r\n  .dso-list-button {\r\n    padding-inline-end: #{units.$u2 - 1};\r\n  }\r\n}\r\n\r\n.dso-list-button {\r\n  @include button.base($modifiers: false);\r\n  @include _state-styling(colors.$wit, colors.$grijs-20, colors.$grijs-90);\r\n\r\n  // stylelint-disable-next-line no-duplicate-selectors -- needed to fix sass deprecation warnings: #2977\r\n  & {\r\n    border-radius: button.$border-radius;\r\n    border-width: 1px;\r\n    border-style: solid;\r\n    font-weight: 600;\r\n    padding-block: #{units.$u2 - 1};\r\n    padding-inline: #{units.$u2 - 1} #{units.$u6 - 1};\r\n    position: relative;\r\n    text-align: start;\r\n    white-space: normal;\r\n    inline-size: 100%;\r\n    cursor: pointer;\r\n  }\r\n\r\n  &:hover,\r\n  &:focus {\r\n    @include _state-styling(colors.$wit, button.$secondary-border-color, colors.$grijs-90);\r\n  }\r\n\r\n  &:active,\r\n  &.active {\r\n    &,\r\n    &:hover {\r\n      @include _state-styling(colors.$wit, button.$secondary-hover-background-color, colors.$grijs-90);\r\n    }\r\n  }\r\n\r\n  &.disabled,\r\n  &[disabled] {\r\n    &,\r\n    &:hover {\r\n      @include _state-styling(colors.$wit, colors.$grijs-20, colors.$grijs-60);\r\n\r\n      // stylelint-disable-next-line no-duplicate-selectors -- needed to fix sass deprecation warnings: #2724\r\n      & {\r\n        opacity: 1;\r\n      }\r\n    }\r\n  }\r\n\r\n  dso-selectable:not(:last-child) {\r\n    margin-block-end: 0;\r\n  }\r\n\r\n  .dso-selectable-container label {\r\n    font-weight: 700;\r\n  }\r\n\r\n  &.dso-selected {\r\n    border-color: colors.$grasgroen;\r\n    border-width: 1px;\r\n    box-shadow:\r\n      inset 0px 0px 0px 1px colors.$grasgroen,\r\n      inset -1px 0px 0px 0px colors.$grasgroen;\r\n\r\n    &.dso-single-count {\r\n      @media screen and (min-width: media-query-breakpoints.$screen-sm-min) {\r\n        border-inline-end: 0;\r\n        box-shadow:\r\n          colors.$grasgroen 0px 1px 0px 0px inset,\r\n          colors.$grasgroen 1px 0px 0px 0px inset,\r\n          colors.$grasgroen 0px -1px 0px 0px inset;\r\n      }\r\n    }\r\n  }\r\n\r\n  label {\r\n    cursor: inherit;\r\n  }\r\n\r\n  > span {\r\n    display: block;\r\n  }\r\n\r\n  .dso-sublabel,\r\n  .subcontent {\r\n    font-weight: 400;\r\n    inline-size: 100%;\r\n    padding-inline-start: selectable.$size + units.$u1;\r\n  }\r\n\r\n  dso-icon {\r\n    block-size: units.$u3;\r\n    color: colors.$grasgroen;\r\n    inset-block-start: #{units.$u2 - 1};\r\n    inset-inline-end: #{units.$u2 - 1};\r\n    inline-size: units.$u3;\r\n    page-break-before: always;\r\n    position: absolute;\r\n  }\r\n\r\n  @media screen and (max-width: media-query-breakpoints.$screen-xs-max) {\r\n    &.dso-selected.dso-single-count {\r\n      &::after {\r\n        inline-size: 0;\r\n      }\r\n    }\r\n  }\r\n}\r\n","import {\r\n  Component,\r\n  ComponentInterface,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  Fragment,\r\n  Prop,\r\n  forceUpdate,\r\n  h,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\nimport { ListButtonChangeEvent, ListButtonSelectedEvent } from \"./list-button.interfaces\";\r\n\r\n@Component({\r\n  tag: \"dso-list-button\",\r\n  shadow: true,\r\n  styleUrl: \"list-button.scss\",\r\n})\r\nexport class ListButton implements ComponentInterface {\r\n  @Element()\r\n  host!: HTMLDsoListButtonElement;\r\n\r\n  private mutationObserver?: MutationObserver;\r\n\r\n  private get subcontentSlot() {\r\n    return this.host.querySelector<HTMLElement>(\"[slot='subcontent']\");\r\n  }\r\n\r\n  /**\r\n   * The label of the List Button.\r\n   */\r\n  @Prop()\r\n  label?: string;\r\n\r\n  /**\r\n   * The sublabel of the List Button.\r\n   */\r\n  @Prop()\r\n  sublabel?: string;\r\n\r\n  /**\r\n   * When defined the count can show on the List Button.\r\n   */\r\n  @Prop()\r\n  count?: number;\r\n\r\n  /**\r\n   * The minimum value.\r\n   */\r\n  @Prop()\r\n  min?: string | number;\r\n\r\n  /**\r\n   * The maximum value.\r\n   */\r\n  @Prop()\r\n  max?: string | number;\r\n\r\n  /**\r\n   * Whether the List Button is checked.\r\n   */\r\n  @Prop({ reflect: true })\r\n  checked = false;\r\n\r\n  /**\r\n   * Whether the List Button is disabled.\r\n   */\r\n  @Prop({ reflect: true })\r\n  disabled = false;\r\n\r\n  /**\r\n   * Prefix to subcontent for the purpose of screenreading.\r\n   */\r\n  @Prop()\r\n  subcontentPrefix?: string;\r\n\r\n  /**\r\n   * Emitted when the user changes the count.\r\n   */\r\n  @Event()\r\n  dsoCountChange!: EventEmitter<ListButtonChangeEvent>;\r\n\r\n  /**\r\n   * Emitted when the user activates the List Button itself.\r\n   *\r\n   * Does not fire when the user activates the count controls.\r\n   */\r\n  @Event()\r\n  dsoSelectedChange!: EventEmitter<ListButtonSelectedEvent>;\r\n\r\n  connectedCallback() {\r\n    this.mutationObserver = new MutationObserver(() => forceUpdate(this.host));\r\n\r\n    this.mutationObserver.observe(this.host, {\r\n      characterData: true,\r\n      childList: true,\r\n      subtree: true,\r\n      attributes: true,\r\n    });\r\n  }\r\n\r\n  componentDidRender(): void {\r\n    if (!this.subcontentSlot?.hasAttribute(\"aria-hidden\")) {\r\n      this.subcontentSlot?.setAttribute(\"aria-hidden\", \"true\");\r\n    }\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.mutationObserver?.disconnect();\r\n    delete this.mutationObserver;\r\n  }\r\n\r\n  private stepValue(e: Event, direction: \"increment\" | \"decrement\"): void {\r\n    if (typeof this.count === \"number\") {\r\n      const newValue = direction === \"increment\" ? this.count + 1 : this.count - 1;\r\n\r\n      if (!this.isNewCountValid(newValue)) {\r\n        return;\r\n      }\r\n\r\n      this.dsoCountChange.emit({\r\n        originalEvent: e,\r\n        count: newValue,\r\n      });\r\n    }\r\n  }\r\n\r\n  private handleSelectClick(e: Event): void {\r\n    e.preventDefault();\r\n\r\n    if (this.count !== undefined) {\r\n      this.dsoCountChange.emit({\r\n        originalEvent: e,\r\n        count: this.count > 0 ? 0 : 1,\r\n      });\r\n\r\n      return;\r\n    }\r\n\r\n    this.dsoSelectedChange.emit({\r\n      originalEvent: e,\r\n      checked: !this.checked,\r\n    });\r\n  }\r\n\r\n  private isNewCountValid(newValue: number): boolean {\r\n    return !(\r\n      this.min !== undefined &&\r\n      this.max !== undefined &&\r\n      (newValue < Number(this.min) || newValue > Number(this.max))\r\n    );\r\n  }\r\n\r\n  render() {\r\n    const selected = this.checked || (this.count !== undefined && this.count > 0);\r\n\r\n    return (\r\n      <div class={clsx([\"dso-button-group\", { \"dso-disabled\": this.disabled }])}>\r\n        <div\r\n          class={clsx([\"dso-list-button\", { \"dso-selected\": selected, \"dso-single-count\": this.count === 1 }])}\r\n          onClick={(e) => this.handleSelectClick(e)}\r\n        >\r\n          <dso-selectable type=\"checkbox\" value=\"list-button\" name=\"naam\" checked={selected} disabled={this.disabled}>\r\n            {this.label}\r\n            {this.sublabel && <span class=\"sr-only\"> {this.sublabel}</span>}\r\n            {this.subcontentSlot && (\r\n              <span class=\"sr-only\">\r\n                {this.subcontentPrefix && this.subcontentPrefix + \":\"}{\" \"}\r\n                <span innerHTML={this.subcontentSlot.innerHTML}></span>\r\n              </span>\r\n            )}\r\n          </dso-selectable>\r\n          {this.sublabel && <span class=\"dso-sublabel\">{this.sublabel}</span>}\r\n          {this.subcontentSlot && (\r\n            <div class=\"subcontent\">\r\n              <slot name=\"subcontent\" />\r\n            </div>\r\n          )}\r\n        </div>\r\n\r\n        {this.count !== undefined && this.count > 0 && (\r\n          <div class=\"dso-input-number\">\r\n            {this.count > 1 && (\r\n              <Fragment>\r\n                <dso-icon-button\r\n                  label=\"Aantal verlagen\"\r\n                  variant=\"tertiary\"\r\n                  icon=\"minus-circle\"\r\n                  disabled={this.count === Number(this.min) || this.disabled}\r\n                  onDsoClick={(e) => this.stepValue(e, \"decrement\")}\r\n                />\r\n                <span class=\"dso-input-step-counter\" aria-label=\"Aantal\" aria-live=\"polite\">\r\n                  {this.count}\r\n                </span>\r\n              </Fragment>\r\n            )}\r\n\r\n            <dso-icon-button\r\n              label=\"Aantal verhogen\"\r\n              variant=\"tertiary\"\r\n              icon=\"plus-circle\"\r\n              disabled={this.count === Number(this.max) || this.disabled}\r\n              onDsoClick={(e) => this.stepValue(e, \"increment\")}\r\n            />\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"2GAAA,MAAMA,EAAgB,k3S,MCoBTC,EAAU,MALvB,WAAAC,CAAAC,G,8GAiDEC,KAAOC,QAAG,MAMVD,KAAQE,SAAG,KA6IZ,CAzLC,kBAAYC,GACV,OAAOH,KAAKI,KAAKC,cAA2B,sB,CAiE9C,iBAAAC,GACEN,KAAKO,iBAAmB,IAAIC,kBAAiB,IAAMC,EAAYT,KAAKI,QAEpEJ,KAAKO,iBAAiBG,QAAQV,KAAKI,KAAM,CACvCO,cAAe,KACfC,UAAW,KACXC,QAAS,KACTC,WAAY,M,CAIhB,kBAAAC,G,QACE,MAAKC,EAAAhB,KAAKG,kBAAgB,MAAAa,SAAA,SAAAA,EAAAC,aAAa,gBAAgB,EACrDC,EAAAlB,KAAKG,kBAAgB,MAAAe,SAAA,SAAAA,EAAAC,aAAa,cAAe,O,EAIrD,oBAAAC,G,OACEJ,EAAAhB,KAAKO,oBAAkB,MAAAS,SAAA,SAAAA,EAAAK,oBAChBrB,KAAKO,gB,CAGN,SAAAe,CAAUC,EAAUC,GAC1B,UAAWxB,KAAKyB,QAAU,SAAU,CAClC,MAAMC,EAAWF,IAAc,YAAcxB,KAAKyB,MAAQ,EAAIzB,KAAKyB,MAAQ,EAE3E,IAAKzB,KAAK2B,gBAAgBD,GAAW,CACnC,M,CAGF1B,KAAK4B,eAAeC,KAAK,CACvBC,cAAeP,EACfE,MAAOC,G,EAKL,iBAAAK,CAAkBR,GACxBA,EAAES,iBAEF,GAAIhC,KAAKyB,QAAUQ,UAAW,CAC5BjC,KAAK4B,eAAeC,KAAK,CACvBC,cAAeP,EACfE,MAAOzB,KAAKyB,MAAQ,EAAI,EAAI,IAG9B,M,CAGFzB,KAAKkC,kBAAkBL,KAAK,CAC1BC,cAAeP,EACftB,SAAUD,KAAKC,S,CAIX,eAAA0B,CAAgBD,GACtB,QACE1B,KAAKmC,MAAQF,WACbjC,KAAKoC,MAAQH,YACZP,EAAWW,OAAOrC,KAAKmC,MAAQT,EAAWW,OAAOrC,KAAKoC,M,CAI3D,MAAAE,GACE,MAAMC,EAAWvC,KAAKC,SAAYD,KAAKyB,QAAUQ,WAAajC,KAAKyB,MAAQ,EAE3E,OACEe,EAAK,OAAAC,IAAA,2CAAAC,MAAOC,EAAK,CAAC,mBAAoB,CAAE,eAAgB3C,KAAKE,aAC3DsC,EAAA,OAAAC,IAAA,2CACEC,MAAOC,EAAK,CAAC,kBAAmB,CAAE,eAAgBJ,EAAU,mBAAoBvC,KAAKyB,QAAU,KAC/FmB,QAAUrB,GAAMvB,KAAK+B,kBAAkBR,IAEvCiB,EAAgB,kBAAAC,IAAA,2CAAAI,KAAK,WAAWC,MAAM,cAAcC,KAAK,OAAO9C,QAASsC,EAAUrC,SAAUF,KAAKE,UAC/FF,KAAKgD,MACLhD,KAAKiD,UAAYT,EAAM,QAAAC,IAAA,2CAAAC,MAAM,WAAS,IAAG1C,KAAKiD,UAC9CjD,KAAKG,gBACJqC,EAAM,QAAAC,IAAA,2CAAAC,MAAM,WACT1C,KAAKkD,kBAAoBlD,KAAKkD,iBAAmB,IAAK,IACvDV,EAAM,QAAAC,IAAA,2CAAAU,UAAWnD,KAAKG,eAAegD,cAI1CnD,KAAKiD,UAAYT,EAAM,QAAAC,IAAA,2CAAAC,MAAM,gBAAgB1C,KAAKiD,UAClDjD,KAAKG,gBACJqC,EAAK,OAAAC,IAAA,2CAAAC,MAAM,cACTF,EAAA,QAAAC,IAAA,2CAAMM,KAAK,iBAKhB/C,KAAKyB,QAAUQ,WAAajC,KAAKyB,MAAQ,GACxCe,EAAK,OAAAC,IAAA,2CAAAC,MAAM,oBACR1C,KAAKyB,MAAQ,GACZe,EAACY,EAAQ,CAAAX,IAAA,4CACPD,EACE,mBAAAC,IAAA,2CAAAO,MAAM,kBACNK,QAAQ,WACRC,KAAK,eACLpD,SAAUF,KAAKyB,QAAUY,OAAOrC,KAAKmC,MAAQnC,KAAKE,SAClDqD,WAAahC,GAAMvB,KAAKsB,UAAUC,EAAG,eAEvCiB,EAAA,QAAAC,IAAA,2CAAMC,MAAM,yBAAwB,aAAY,SAAQ,YAAW,UAChE1C,KAAKyB,QAKZe,EACE,mBAAAC,IAAA,2CAAAO,MAAM,kBACNK,QAAQ,WACRC,KAAK,cACLpD,SAAUF,KAAKyB,QAAUY,OAAOrC,KAAKoC,MAAQpC,KAAKE,SAClDqD,WAAahC,GAAMvB,KAAKsB,UAAUC,EAAG,gB","ignoreList":[]}

package/dist/dso-toolkit/p-4a4f56ed.entry.js

@@ -0,0 +1,2 @@
+import{r as d,h as a,F as e}from"./p-DxWmN7gh.js";const s=":host .dso-card-list{padding-inline-start:0;list-style:none;border-block-end:1px solid #ccc;margin-block-start:-1px}:host .dso-card-grid{display:grid;gap:32px;grid-auto-rows:1fr}@media (max-width: 991px){:host .dso-card-grid{grid-template-columns:repeat(1, 1fr)}}@media (min-width: 992px) and (max-width: 1199px){:host .dso-card-grid{grid-template-columns:repeat(2, 1fr)}}@media (min-width: 1200px){:host .dso-card-grid{grid-template-columns:repeat(3, 1fr)}}";const r=class{constructor(a){d(this,a);this.mode="list"}render(){return a(e,null,this.mode==="list"&&a("ul",{key:"d593775800ecb1923ef9ad855255e7dd37ea591a",class:"dso-card-list"},a("slot",{key:"7ea9f4b7e848bf3afa2039f5ec4ab14ce2573243"})),this.mode==="grid"&&a("div",{key:"b4ce1e46af681b37be5e7d53ee56be82a286d9c7",class:"dso-card-grid"},a("slot",{key:"1d29ddba3f221ee0a507ba93a36869a24e4ad19f"})))}};r.style=s;export{r as dso_card_container};
+//# sourceMappingURL=p-4a4f56ed.entry.js.map

package/dist/dso-toolkit/{p-f65ace88.entry.js → p-4c1c2071.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,c as n,h as l,F as e}from"./p-DxWmN7gh.js";import{i as r}from"./p-Hgv-pDpy.js";const a=':host {\n  block-size: var(--_dso-logo-block-size, 3rem);\n  display: grid;\n  grid-template-areas: "target wordmark label";\n  grid-template-columns: repeat(3, max-content);\n  grid-template-rows: 100%;\n  gap: 16px;\n  font-size: 1.5rem;\n  font-weight: 500;\n  align-items: center;\n  container-type: size;\n  container-name: logo;\n}\n:host .logo-url,\n:host .logo-label-url {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  text-decoration: none;\n}\n:host .logo-url:hover, :host .logo-url:focus-visible, :host .logo-url:active,\n:host .logo-label-url:hover,\n:host .logo-label-url:focus-visible,\n:host .logo-label-url:active {\n  text-decoration: underline;\n}\n:host .logo-url, :host .logo-url:hover, :host .logo-url:focus, :host .logo-url:visited,\n:host .logo-label-url,\n:host .logo-label-url:hover,\n:host .logo-label-url:focus,\n:host .logo-label-url:visited {\n  color: #275937;\n}\n\n:host([logo-url]:not([logo-url=""])[ribbon]:not([ribbon=""])) {\n  grid-template-areas: "targetwordmark label";\n}\n:host([logo-url]:not([logo-url=""])[ribbon]:not([ribbon=""])) .logo-url,\n:host([logo-url]:not([logo-url=""])[ribbon]:not([ribbon=""])) .logo-ribbon {\n  grid-area: targetwordmark;\n}\n\n.logo-label-url {\n  grid-area: label;\n}\n\n.logo-target {\n  grid-area: target;\n  max-block-size: 48px;\n  max-inline-size: 48px;\n  inline-size: 100%;\n  display: block;\n  aspect-ratio: 1/1;\n}\n\n.logo-wordmark {\n  grid-area: wordmark;\n}\n\n@container logo (max-height: 47px) {\n  .logo-wordmark,\n  .logo-label {\n    font-size: 50cqb;\n    line-height: 1;\n  }\n}\n.logo-wordmark-omgevings {\n  color: #39870c;\n}\n\n.logo-wordmark-loket {\n  color: #275937;\n}\n\n.logo-label {\n  grid-area: label;\n  color: #275937;\n  margin-inline-start: 1rem;\n}\n\n.logo-ribbon {\n  grid-area: wordmark;\n  place-self: start end;\n  display: flex;\n  place-items: center;\n  background-color: #8b4a6a;\n  border-radius: 3px;\n  transform: rotate(3deg);\n  padding-block: 0;\n  padding-inline: 8px;\n  font-size: 0.75rem;\n  font-weight: normal;\n  text-transform: uppercase;\n  color: #fff;\n}\n@container logo (max-height: 47px) {\n  .logo-ribbon {\n    block-size: 28cqb;\n    font-size: 25cqb;\n  }\n}\n\n.inner {\n  fill: #e17000;\n}\n\n.middle {\n  fill: #275937;\n}\n\n.outer {\n  fill: #80bc00;\n}\n\n@media screen and (max-width: 767px) {\n  :host([label]) {\n    grid-template-areas: "target label";\n    grid-template-columns: max-content minmax(130px, max-content);\n  }\n  :host([label]) .logo-wordmark {\n    display: none;\n  }\n  :host([label]) .logo-ribbon {\n    grid-area: label;\n  }\n  :host([label]) .logo-label {\n    margin-inline-start: 0;\n    text-wrap: balance;\n    overflow-wrap: normal;\n  }\n  :host([logo-url][ribbon]) .logo-label-url + .logo-ribbon {\n    grid-area: label;\n  }\n}\n@media screen and (max-width: 480px) {\n  .logo-ribbon {\n    transform: rotate(3deg) translateY(-7px);\n  }\n}';const t=({name:o})=>{const n=o.split("|");return l(e,null,l("svg",{fill:"none",viewBox:"0 0 48 48",height:"100%",class:"logo-target"},l("path",{class:"outer",d:"M26 0a24 24 0 1 0 0 47.9A24 24 0 0 0 24 0Z"}),l("path",{class:"middle",d:"M24 8A16 16 0 0 0 8 24 16 16 0 1 0 24 8Z"}),l("path",{class:"inner",d:"M24 32a8 8 0 0 0 0-16 8 8 0 0 0 0 16Z"})),l("div",{class:"logo-wordmark"},l("span",{class:"logo-wordmark-omgevings"},n[0]),n.length===2&&l("span",{class:"logo-wordmark-loket"},n[1])))};const i=class{constructor(l){o(this,l);this.dsoLogoClick=n(this,"dsoLogoClick",7);this.dsoLabelClick=n(this,"dsoLabelClick",7);this.name="Omgevings|loket";this.handleLogoClick=o=>{this.dsoLogoClick.emit({originalEvent:o,url:this.logoUrl,isModifiedEvent:r(o)})};this.handleLabelClick=o=>{this.dsoLabelClick.emit({originalEvent:o,url:this.labelUrl,isModifiedEvent:r(o)})}}render(){return l(e,null,this.logoUrl?l("a",{class:"logo-url",href:this.logoUrl,onClick:this.handleLogoClick},l(t,{name:this.name})):l(t,{name:this.name}),this.label&&(!this.labelUrl?l("span",{class:"logo-label"},this.label):l("a",{class:"logo-label-url",href:this.labelUrl,onClick:this.handleLabelClick},l("span",{class:"logo-label"},this.label))),this.ribbon&&l("div",{key:"25eec1d7172269ce1acc285de6ec98c187825fa1",class:"logo-ribbon"},this.ribbon))}};i.style=a;export{i as dso_logo};
-//# sourceMappingURL=p-f65ace88.entry.js.map
+import{r as o,c as n,h as l,F as e}from"./p-DxWmN7gh.js";import{i as r}from"./p-Hgv-pDpy.js";const a=':host {\n  block-size: var(--_dso-logo-block-size, 3rem);\n  display: grid;\n  grid-template-areas: "target wordmark label";\n  grid-template-columns: repeat(3, max-content);\n  grid-template-rows: 100%;\n  gap: 16px;\n  font-size: 1.5rem;\n  font-weight: 500;\n  align-items: center;\n  container-type: size;\n  container-name: logo;\n}\n:host .logo-url,\n:host .logo-label-url {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  text-decoration: none;\n}\n:host .logo-url:hover, :host .logo-url:focus-visible, :host .logo-url:active,\n:host .logo-label-url:hover,\n:host .logo-label-url:focus-visible,\n:host .logo-label-url:active {\n  text-decoration: underline;\n}\n:host .logo-url, :host .logo-url:hover, :host .logo-url:focus, :host .logo-url:visited,\n:host .logo-label-url,\n:host .logo-label-url:hover,\n:host .logo-label-url:focus,\n:host .logo-label-url:visited {\n  color: #275937;\n}\n\n:host([logo-url]:not([logo-url=""])[ribbon]:not([ribbon=""])) {\n  grid-template-areas: "targetwordmark label";\n}\n:host([logo-url]:not([logo-url=""])[ribbon]:not([ribbon=""])) .logo-url,\n:host([logo-url]:not([logo-url=""])[ribbon]:not([ribbon=""])) .logo-ribbon {\n  grid-area: targetwordmark;\n}\n\n.logo-label-url {\n  grid-area: label;\n}\n\n.logo-target {\n  grid-area: target;\n  max-block-size: 48px;\n  max-inline-size: 48px;\n  inline-size: 100%;\n  display: block;\n  aspect-ratio: 1/1;\n}\n\n.logo-wordmark {\n  grid-area: wordmark;\n}\n\n@container logo (max-height: 47px) {\n  .logo-wordmark,\n  .logo-label {\n    font-size: 50cqb;\n    line-height: 1;\n  }\n}\n.logo-wordmark-omgevings {\n  color: #39870c;\n}\n\n.logo-wordmark-loket {\n  color: #275937;\n}\n\n.logo-label {\n  grid-area: label;\n  color: #275937;\n  margin-inline-start: 1rem;\n}\n\n.logo-ribbon {\n  grid-area: wordmark;\n  place-self: start end;\n  display: flex;\n  place-items: center;\n  background-color: #8b4a6a;\n  border-radius: 3px;\n  transform: rotate(3deg);\n  padding-block: 0;\n  padding-inline: 8px;\n  font-size: 0.75rem;\n  font-weight: normal;\n  text-transform: uppercase;\n  color: #fff;\n}\n@container logo (max-height: 47px) {\n  .logo-ribbon {\n    block-size: 28cqb;\n    font-size: 25cqb;\n  }\n}\n\n.inner {\n  fill: #e17000;\n}\n\n.middle {\n  fill: #275937;\n}\n\n.outer {\n  fill: #80bc00;\n}\n\n@media screen and (max-width: 767px) {\n  :host([label]) {\n    grid-template-areas: "target label";\n    grid-template-columns: max-content minmax(130px, max-content);\n  }\n  :host([label]) .logo-wordmark {\n    display: none;\n  }\n  :host([label]) .logo-ribbon {\n    grid-area: label;\n  }\n  :host([label]) .logo-label {\n    margin-inline-start: 0;\n    text-wrap: balance;\n    overflow-wrap: normal;\n  }\n  :host([logo-url][ribbon]) .logo-label-url + .logo-ribbon {\n    grid-area: label;\n  }\n}\n@media screen and (max-width: 480px) {\n  .logo-ribbon {\n    transform: rotate(3deg) translateY(-7px);\n  }\n}';const t=({name:o})=>{const n=o.split("|");return l(e,null,l("svg",{fill:"none",viewBox:"0 0 48 48",height:"100%",class:"logo-target"},l("path",{class:"outer",d:"M26 0a24 24 0 1 0 0 47.9A24 24 0 0 0 24 0Z"}),l("path",{class:"middle",d:"M24 8A16 16 0 0 0 8 24 16 16 0 1 0 24 8Z"}),l("path",{class:"inner",d:"M24 32a8 8 0 0 0 0-16 8 8 0 0 0 0 16Z"})),l("div",{class:"logo-wordmark"},l("span",{class:"logo-wordmark-omgevings"},n[0]),n.length===2&&l("span",{class:"logo-wordmark-loket"},n[1])))};const i=class{constructor(l){o(this,l);this.dsoLogoClick=n(this,"dsoLogoClick",7);this.dsoLabelClick=n(this,"dsoLabelClick",7);this.name="Omgevings|loket";this.handleLogoClick=o=>{this.dsoLogoClick.emit({originalEvent:o,url:this.logoUrl,isModifiedEvent:r(o)})};this.handleLabelClick=o=>{this.dsoLabelClick.emit({originalEvent:o,url:this.labelUrl,isModifiedEvent:r(o)})}}render(){return l(e,null,this.logoUrl?l("a",{class:"logo-url",href:this.logoUrl,onClick:this.handleLogoClick},l(t,{name:this.name})):l(t,{name:this.name}),this.label&&(!this.labelUrl?l("span",{class:"logo-label"},this.label):l("a",{class:"logo-label-url",href:this.labelUrl,onClick:this.handleLabelClick},l("span",{class:"logo-label"},this.label))),this.ribbon&&l("div",{key:"960973e315c312de8867f4fb0c7d10821d73a1a3",class:"logo-ribbon"},this.ribbon))}};i.style=a;export{i as dso_logo};
+//# sourceMappingURL=p-4c1c2071.entry.js.map

package/dist/dso-toolkit/{p-d8df33bb.entry.js → p-50292d0e.entry.js}

@@ -1,2 +1,2 @@
-import{r as s,h as r}from"./p-DxWmN7gh.js";const a=":host{display:block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.progress{margin-block-end:8px}.progress .progress-bar{background-color:#fff;border:1px solid #39870c;display:block;block-size:16px}.progress .progress-bar>span{background-color:#39870c;float:inline-start;block-size:100%;inline-size:0%}.progress .progress-bar+span{font-size:14px;margin-block-start:8px}";const e=class{constructor(r){s(this,r);this.min=0;this.max=100}render(){const s=Math.round(this.progress);const a=`${s}%`;return r("div",{key:"5c6007b6ce579b2733a5e2506617fb0b66b14083",class:"progress"},r("span",{key:"254a965d5956d001657536d0b62e189553791d48",class:"progress-bar",role:"progressbar","aria-labelledby":"progress-bar-label","aria-valuenow":s,"aria-valuemin":this.min,"aria-valuemax":this.max},r("span",{key:"b3ae04b47755b6697c3c56301ab7d08681076cd6",style:{width:`${a}`}})),r("span",{key:"6ed0af3622feb21b31244add08b63527b36ce266",id:"progress-bar-label"},r("slot",{key:"94adb0a9158443321c5a53a5ecd79a123612b8af"})))}};e.style=a;export{e as dso_progress_bar};
-//# sourceMappingURL=p-d8df33bb.entry.js.map
+import{r as s,h as r}from"./p-DxWmN7gh.js";const a=":host{display:block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.progress{margin-block-end:8px}.progress .progress-bar{background-color:#fff;border:1px solid #39870c;display:block;block-size:16px}.progress .progress-bar>span{background-color:#39870c;float:inline-start;block-size:100%;inline-size:0%}.progress .progress-bar+span{font-size:14px;margin-block-start:8px}";const e=class{constructor(r){s(this,r);this.min=0;this.max=100}render(){const s=Math.round(this.progress);const a=`${s}%`;return r("div",{key:"fadc3ce49184687a5ed6d384477679f02c443afc",class:"progress"},r("span",{key:"36db93b5a7a749b8435df14918caa82883a134bb",class:"progress-bar",role:"progressbar","aria-labelledby":"progress-bar-label","aria-valuenow":s,"aria-valuemin":this.min,"aria-valuemax":this.max},r("span",{key:"d69c3f5879bd06d518c63527489971bd2fa76749",style:{width:`${a}`}})),r("span",{key:"032c53996cc324c5bfed12ab6e7ae6500d4600ea",id:"progress-bar-label"},r("slot",{key:"08e1a0cba14ac76650c10a7175a9d66c2d9f999a"})))}};e.style=a;export{e as dso_progress_bar};
+//# sourceMappingURL=p-50292d0e.entry.js.map

package/dist/dso-toolkit/{p-71eae744.entry.js → p-57a9ed50.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as i,F as s,g as e}from"./p-DxWmN7gh.js";const o="*,*::after,*::before{box-sizing:border-box}:host{display:inline-block;--tooltip-margin-block-start:0;--tooltip-margin-inline-start:3px;--tooltip-margin-inline-end:units.$u1 * -1 !important}:host(:focus){outline:none;z-index:410}";const h=class{constructor(i){t(this,i);this.active=false;this.label="Toelichting";this.position="right";this.click=()=>{if(this.active){this.close()}else{this.open()}};this.open=()=>{this.active=true;this.host.addEventListener("keydown",this.keyDownListener);this.host.addEventListener("focusout",this.focusOutListener)};this.close=()=>{this.host.removeEventListener("focusout",this.focusOutListener);this.host.removeEventListener("keydown",this.keyDownListener);this.active=false};this.focusOutListener=t=>{if(!this.host.contains(t.relatedTarget)){this.close()}};this.keyDownListener=t=>{var i;if(!t.defaultPrevented&&t.key==="Escape"){this.close();(i=this.infoButton)===null||i===void 0?void 0:i.setFocus();t.preventDefault()}return}}render(){return i(s,null,i("dso-info-button",{key:"ed1c4c1dd5ff84030e74ce568666481a546dbef5","aria-describedby":"toggle",onClick:this.click,label:this.label,active:this.active,secondary:this.secondary,ref:t=>this.infoButton=t}),i("dso-tooltip",{key:"48d22cbdbf55a6b73b72b1b52047329661af9837",stateless:true,descriptive:true,id:"toggle",strategy:"absolute",active:this.active,position:this.position,small:this.small},i("slot",{key:"9261b395053da5a89f5d4d2edf6f7e0e6661a95b"})))}get host(){return e(this)}};h.style=o;export{h as dso_toggletip};
-//# sourceMappingURL=p-71eae744.entry.js.map
+import{r as t,h as i,F as s,g as e}from"./p-DxWmN7gh.js";const o="*,*::after,*::before{box-sizing:border-box}:host{display:inline-block;--tooltip-margin-block-start:0;--tooltip-margin-inline-start:3px;--tooltip-margin-inline-end:units.$u1 * -1 !important}:host(:focus){outline:none;z-index:410}";const h=class{constructor(i){t(this,i);this.active=false;this.label="Toelichting";this.position="right";this.click=()=>{if(this.active){this.close()}else{this.open()}};this.open=()=>{this.active=true;this.host.addEventListener("keydown",this.keyDownListener);this.host.addEventListener("focusout",this.focusOutListener)};this.close=()=>{this.host.removeEventListener("focusout",this.focusOutListener);this.host.removeEventListener("keydown",this.keyDownListener);this.active=false};this.focusOutListener=t=>{if(!this.host.contains(t.relatedTarget)){this.close()}};this.keyDownListener=t=>{var i;if(!t.defaultPrevented&&t.key==="Escape"){this.close();(i=this.infoButton)===null||i===void 0?void 0:i.setFocus();t.preventDefault()}return}}render(){return i(s,{key:"7190ef67053c5fdcb2b6a1e7ebd21bdcad959bed"},i("dso-info-button",{key:"d88f88663a452f07644c2bece85cac83a7446d9e","aria-describedby":"toggle",onClick:this.click,label:this.label,active:this.active,secondary:this.secondary,ref:t=>this.infoButton=t}),i("dso-tooltip",{key:"c4c33c1f756c1358c678ff9225ebcff8809f5d53",stateless:true,descriptive:true,id:"toggle",strategy:"absolute",active:this.active,position:this.position,small:this.small},i("slot",{key:"97c153371afe3e1bdcbb8681eb56d68457982da4"})))}get host(){return e(this)}};h.style=o;export{h as dso_toggletip};
+//# sourceMappingURL=p-57a9ed50.entry.js.map

package/dist/dso-toolkit/{p-71eae744.entry.js.map → p-57a9ed50.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["toggletipCss","Toggletip","constructor","hostRef","this","active","label","position","click","close","open","host","addEventListener","keyDownListener","focusOutListener","removeEventListener","event","contains","relatedTarget","defaultPrevented","key","_a","infoButton","setFocus","preventDefault","render","h","Fragment","onClick","secondary","ref","element","stateless","descriptive","id","strategy","small"],"sources":["src/components/toggletip/toggletip.scss?tag=dso-toggletip&encapsulation=shadow","src/components/toggletip/toggletip.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: inline-block;\r\n\r\n  // tooltip arrow placement exceptions\r\n  --tooltip-margin-block-start: 0;\r\n  --tooltip-margin-inline-start: 3px;\r\n  --tooltip-margin-inline-end: units.$u1 * -1 !important;\r\n}\r\n\r\n:host(:focus) {\r\n  outline: none;\r\n  z-index: zindex.$tooltip;\r\n}\r\n","import { Placement } from \"@popperjs/core\";\r\nimport { Component, Element, Fragment, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-toggletip\",\r\n  styleUrl: \"toggletip.scss\",\r\n  shadow: true,\r\n})\r\nexport class Toggletip {\r\n  @Element()\r\n  host!: HTMLDsoToggletipElement;\r\n\r\n  @State()\r\n  active = false;\r\n\r\n  /**\r\n   * Toggletip label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting\";\r\n\r\n  /**\r\n   * Toggletip position.\r\n   */\r\n  @Prop()\r\n  position: Placement = \"right\";\r\n\r\n  /**\r\n   * Set to true for small Toggletip.\r\n   */\r\n  @Prop()\r\n  small?: boolean;\r\n\r\n  /**\r\n   * Set to true for secondary Toggletip.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  private infoButton?: HTMLDsoInfoButtonElement;\r\n\r\n  private click = () => {\r\n    if (this.active) {\r\n      this.close();\r\n    } else {\r\n      this.open();\r\n    }\r\n  };\r\n\r\n  private open = () => {\r\n    this.active = true;\r\n    this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n    this.host.addEventListener(\"focusout\", this.focusOutListener);\r\n  };\r\n\r\n  private close = () => {\r\n    this.host.removeEventListener(\"focusout\", this.focusOutListener);\r\n    this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n    this.active = false;\r\n  };\r\n\r\n  private focusOutListener = (event: FocusEvent) => {\r\n    if (!this.host.contains(event.relatedTarget as Node)) {\r\n      this.close();\r\n    }\r\n  };\r\n\r\n  private keyDownListener = (event: KeyboardEvent) => {\r\n    if (!event.defaultPrevented && event.key === \"Escape\") {\r\n      this.close();\r\n      this.infoButton?.setFocus();\r\n      event.preventDefault();\r\n    }\r\n\r\n    return;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <dso-info-button\r\n          aria-describedby=\"toggle\"\r\n          onClick={this.click}\r\n          label={this.label}\r\n          active={this.active}\r\n          secondary={this.secondary}\r\n          ref={(element) => (this.infoButton = element)}\r\n        />\r\n        <dso-tooltip\r\n          stateless\r\n          descriptive\r\n          id=\"toggle\"\r\n          strategy=\"absolute\"\r\n          active={this.active}\r\n          position={this.position}\r\n          small={this.small}\r\n        >\r\n          <slot />\r\n        </dso-tooltip>\r\n      </>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"yDAAA,MAAMA,EAAe,uO,MCQRC,EAAS,MALtB,WAAAC,CAAAC,G,UAUEC,KAAMC,OAAG,MAMTD,KAAKE,MAAG,cAMRF,KAAQG,SAAc,QAgBdH,KAAKI,MAAG,KACd,GAAIJ,KAAKC,OAAQ,CACfD,KAAKK,O,KACA,CACLL,KAAKM,M,GAIDN,KAAIM,KAAG,KACbN,KAAKC,OAAS,KACdD,KAAKO,KAAKC,iBAAiB,UAAWR,KAAKS,iBAC3CT,KAAKO,KAAKC,iBAAiB,WAAYR,KAAKU,iBAAiB,EAGvDV,KAAKK,MAAG,KACdL,KAAKO,KAAKI,oBAAoB,WAAYX,KAAKU,kBAC/CV,KAAKO,KAAKI,oBAAoB,UAAWX,KAAKS,iBAC9CT,KAAKC,OAAS,KAAK,EAGbD,KAAAU,iBAAoBE,IAC1B,IAAKZ,KAAKO,KAAKM,SAASD,EAAME,eAAwB,CACpDd,KAAKK,O,GAIDL,KAAAS,gBAAmBG,I,MACzB,IAAKA,EAAMG,kBAAoBH,EAAMI,MAAQ,SAAU,CACrDhB,KAAKK,SACLY,EAAAjB,KAAKkB,cAAY,MAAAD,SAAA,SAAAA,EAAAE,WACjBP,EAAMQ,gB,CAGR,OA4BH,CAzBC,MAAAC,GACE,OACEC,EAAAC,EAAA,KACED,EAAA,mBAAAN,IAAA,8DACmB,SACjBQ,QAASxB,KAAKI,MACdF,MAAOF,KAAKE,MACZD,OAAQD,KAAKC,OACbwB,UAAWzB,KAAKyB,UAChBC,IAAMC,GAAa3B,KAAKkB,WAAaS,IAEvCL,EAAA,eAAAN,IAAA,2CACEY,UAAS,KACTC,YAAW,KACXC,GAAG,SACHC,SAAS,WACT9B,OAAQD,KAAKC,OACbE,SAAUH,KAAKG,SACf6B,MAAOhC,KAAKgC,OAEZV,EAAQ,QAAAN,IAAA,8C","ignoreList":[]}
+{"version":3,"names":["toggletipCss","Toggletip","constructor","hostRef","this","active","label","position","click","close","open","host","addEventListener","keyDownListener","focusOutListener","removeEventListener","event","contains","relatedTarget","defaultPrevented","key","_a","infoButton","setFocus","preventDefault","render","h","Fragment","onClick","secondary","ref","element","stateless","descriptive","id","strategy","small"],"sources":["src/components/toggletip/toggletip.scss?tag=dso-toggletip&encapsulation=shadow","src/components/toggletip/toggletip.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: inline-block;\r\n\r\n  // tooltip arrow placement exceptions\r\n  --tooltip-margin-block-start: 0;\r\n  --tooltip-margin-inline-start: 3px;\r\n  --tooltip-margin-inline-end: units.$u1 * -1 !important;\r\n}\r\n\r\n:host(:focus) {\r\n  outline: none;\r\n  z-index: zindex.$tooltip;\r\n}\r\n","import { Placement } from \"@popperjs/core\";\r\nimport { Component, Element, Fragment, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-toggletip\",\r\n  styleUrl: \"toggletip.scss\",\r\n  shadow: true,\r\n})\r\nexport class Toggletip {\r\n  @Element()\r\n  host!: HTMLDsoToggletipElement;\r\n\r\n  @State()\r\n  active = false;\r\n\r\n  /**\r\n   * Toggletip label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting\";\r\n\r\n  /**\r\n   * Toggletip position.\r\n   */\r\n  @Prop()\r\n  position: Placement = \"right\";\r\n\r\n  /**\r\n   * Set to true for small Toggletip.\r\n   */\r\n  @Prop()\r\n  small?: boolean;\r\n\r\n  /**\r\n   * Set to true for secondary Toggletip.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  private infoButton?: HTMLDsoInfoButtonElement;\r\n\r\n  private click = () => {\r\n    if (this.active) {\r\n      this.close();\r\n    } else {\r\n      this.open();\r\n    }\r\n  };\r\n\r\n  private open = () => {\r\n    this.active = true;\r\n    this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n    this.host.addEventListener(\"focusout\", this.focusOutListener);\r\n  };\r\n\r\n  private close = () => {\r\n    this.host.removeEventListener(\"focusout\", this.focusOutListener);\r\n    this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n    this.active = false;\r\n  };\r\n\r\n  private focusOutListener = (event: FocusEvent) => {\r\n    if (!this.host.contains(event.relatedTarget as Node)) {\r\n      this.close();\r\n    }\r\n  };\r\n\r\n  private keyDownListener = (event: KeyboardEvent) => {\r\n    if (!event.defaultPrevented && event.key === \"Escape\") {\r\n      this.close();\r\n      this.infoButton?.setFocus();\r\n      event.preventDefault();\r\n    }\r\n\r\n    return;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <Fragment>\r\n        <dso-info-button\r\n          aria-describedby=\"toggle\"\r\n          onClick={this.click}\r\n          label={this.label}\r\n          active={this.active}\r\n          secondary={this.secondary}\r\n          ref={(element) => (this.infoButton = element)}\r\n        />\r\n        <dso-tooltip\r\n          stateless\r\n          descriptive\r\n          id=\"toggle\"\r\n          strategy=\"absolute\"\r\n          active={this.active}\r\n          position={this.position}\r\n          small={this.small}\r\n        >\r\n          <slot />\r\n        </dso-tooltip>\r\n      </Fragment>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"yDAAA,MAAMA,EAAe,uO,MCQRC,EAAS,MALtB,WAAAC,CAAAC,G,UAUEC,KAAMC,OAAG,MAMTD,KAAKE,MAAG,cAMRF,KAAQG,SAAc,QAgBdH,KAAKI,MAAG,KACd,GAAIJ,KAAKC,OAAQ,CACfD,KAAKK,O,KACA,CACLL,KAAKM,M,GAIDN,KAAIM,KAAG,KACbN,KAAKC,OAAS,KACdD,KAAKO,KAAKC,iBAAiB,UAAWR,KAAKS,iBAC3CT,KAAKO,KAAKC,iBAAiB,WAAYR,KAAKU,iBAAiB,EAGvDV,KAAKK,MAAG,KACdL,KAAKO,KAAKI,oBAAoB,WAAYX,KAAKU,kBAC/CV,KAAKO,KAAKI,oBAAoB,UAAWX,KAAKS,iBAC9CT,KAAKC,OAAS,KAAK,EAGbD,KAAAU,iBAAoBE,IAC1B,IAAKZ,KAAKO,KAAKM,SAASD,EAAME,eAAwB,CACpDd,KAAKK,O,GAIDL,KAAAS,gBAAmBG,I,MACzB,IAAKA,EAAMG,kBAAoBH,EAAMI,MAAQ,SAAU,CACrDhB,KAAKK,SACLY,EAAAjB,KAAKkB,cAAY,MAAAD,SAAA,SAAAA,EAAAE,WACjBP,EAAMQ,gB,CAGR,OA4BH,CAzBC,MAAAC,GACE,OACEC,EAACC,EAAQ,CAAAP,IAAA,4CACPM,EAAA,mBAAAN,IAAA,8DACmB,SACjBQ,QAASxB,KAAKI,MACdF,MAAOF,KAAKE,MACZD,OAAQD,KAAKC,OACbwB,UAAWzB,KAAKyB,UAChBC,IAAMC,GAAa3B,KAAKkB,WAAaS,IAEvCL,EAAA,eAAAN,IAAA,2CACEY,UAAS,KACTC,YAAW,KACXC,GAAG,SACHC,SAAS,WACT9B,OAAQD,KAAKC,OACbE,SAAUH,KAAKG,SACf6B,MAAOhC,KAAKgC,OAEZV,EAAQ,QAAAN,IAAA,8C","ignoreList":[]}

package/dist/dso-toolkit/p-5ab79fb4.entry.js

@@ -0,0 +1,2 @@
+import{r as o,c as n,h as e,H as t,g as i}from"./p-DxWmN7gh.js";import{p as r}from"./p-B31olq-p.js";import"./p-gdsca1fx.js";const a="*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}::slotted([slot=heading]){display:flex !important;align-items:center !important;margin-block-end:0 !important;margin-block-start:0 !important;color:#fff !important;line-height:1.375 !important}:host{--_dso-button-primary-background-color:#fff;--_dso-button-primary-border-color:#fff;--_dso-button-primary-color:#000;--_dso-button-primary-hover-background-color:#ccc;--_dso-button-primary-hover-border-color:#ccc;--_dso-button-primary-hover-color:#000;--_dso-button-primary-active-background-color:#999;--_dso-button-primary-active-border-color:#999;--_dso-button-primary-active-color:#000;--_dso-button-primary-disabled-background-color:#fff;--_dso-button-primary-disabled-border-color:#fff;--_dso-button-primary-disabled-color:#b2b2b2;--_dso-button-secondary-background-color:#fff;--_dso-button-secondary-border-color:#fff;--_dso-button-secondary-color:#000;--_dso-button-secondary-hover-background-color:#ccc;--_dso-button-secondary-hover-border-color:#ccc;--_dso-button-secondary-hover-color:#000;--_dso-button-secondary-active-background-color:#999;--_dso-button-secondary-active-border-color:#999;--_dso-button-secondary-active-color:#000;--_dso-button-secondary-disabled-background-color:#fff;--_dso-button-secondary-disabled-border-color:#fff;--_dso-button-secondary-disabled-color:#b2b2b2;display:block;filter:drop-shadow(2px 2px 16px rgba(0, 0, 0, 0.4));transition:visibility 400ms, opacity 400ms}:host(:not([ready])){opacity:1;animation:400ms ease-in 1 normal both fadeInOpacity}:host([popover]){margin:0 !important;border:0;padding:0;background-color:transparent;overflow:unset}.onboarding-tip{font-family:Asap, sans-serif;font-style:normal;font-weight:400;line-height:1.5;line-break:auto;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;overflow-wrap:anywhere;word-spacing:normal;word-wrap:normal;white-space:normal;font-size:14px;inset-block-start:0;inset-inline-start:0;z-index:410}@media screen and (max-width: 360px){.onboarding-tip{padding-inline-start:8px !important}}.dso-close{position:absolute;inset-block-start:4px;inset-inline-end:4px}.onboarding-tip-inner{--link-color:#fff;--link-hover-color:#b2b2b2;--link-visited-color:#7f7f7f;max-inline-size:min(360px, 100vw - 2 * 8px);max-block-size:calc(100vh - 10px);overflow:auto;padding-block:32px 8px;padding-inline:8px;border-radius:4px;display:block;font-size:1rem;position:relative;z-index:2}.onboarding-tip-inner{--_dso-icon-button-tertiary-color:#fff;background-color:#2b5780;border-color:#2b5780;color:#fff}@media screen and (max-width: 991px){.onboarding-tip-inner{max-block-size:unset}}.onboarding-tip-arrow{border-start-start-radius:4px;position:absolute;block-size:20px;inline-size:20px;background:#2b5780;z-index:1;pointer-events:none}.onboarding-tip-content-wrapper{padding-inline:16px;padding-block-end:16px}.onboarding-tip-content-heading{display:flex}.onboarding-tip-content-heading dso-icon{margin-inline-end:8px}@keyframes fadeInOpacity{0%{opacity:0}100%{opacity:1}}";const d=class{constructor(e){o(this,e);this.dsoClose=n(this,"dsoClose",7);this.placement="right";this.ready=false}componentDidRender(){if(!this.host.matches(":popover-open")){this.host.showPopover()}if(!this.cleanUp&&this.referenceElement&&this.tipArrowRef instanceof HTMLElement){this.cleanUp=r({referenceElement:this.referenceElement,tipRef:this.host,tipArrowRef:this.tipArrowRef,placementTip:`${this.placement}-start`,topPositionSmallViewPort:true,halfMainAxisOffset:true})}}disconnectedCallback(){var o;if(this.host.matches(":popover-open")){this.host.hidePopover()}(o=this.cleanUp)===null||o===void 0?void 0:o.call(this);this.cleanUp=undefined}render(){return e(t,{key:"bd723d0214e5604c3f99c7cf5ece0e1cbe6607d3",popover:"manual",ready:this.ready,onAnimationend:()=>this.ready=true},e("div",{key:"16615b7d71fde79e7f399e3ed98e25d869309fca",class:"onboarding-tip",role:"tooltip"},e("div",{key:"821435d563c0c65647111b8e78fc4ba977409b96",class:"onboarding-tip-inner"},e("div",{key:"f4c3a23d25bd18e1ceee8ae18f7619dc14b9e7b7",class:"onboarding-tip-content-wrapper"},this.headingSlottedElement!==null&&e("div",{key:"b83c3a2cd62a9f86efff9653a04b7c3d6db73b69",class:"onboarding-tip-content-heading"},e("dso-icon",{key:"3cf10004da4f636ab8d08a1eb7ec6361fb788e36",icon:"light-bulb"}),e("slot",{key:"912bb0c3e062bdc1c1f72bcf1fd4d0e9b4253b67",name:"heading"})),e("dso-icon-button",{key:"7f8372c8f6677687f2fb372b4015851b326a030b",class:"dso-close",label:"Sluiten",variant:"tertiary",icon:"times",onDsoClick:o=>this.dsoClose.emit({originalEvent:o})}),e("slot",{key:"1b4cd3b10a3d52f60b6592a33c6922d9a2a2b6b1"}))),e("div",{key:"6adcfa3c5ffc54d275fe2d35621f075669ddb254",class:"onboarding-tip-arrow",ref:o=>this.tipArrowRef=o})))}get headingSlottedElement(){return this.host.querySelector("[slot='heading']")}get referenceElement(){const o=this.host.id;if(!o){console.warn("Unable to find reference. Onboarding Tip has no [id] attribute.");return}const n=this.host.getRootNode();if(!(n instanceof Document||n instanceof ShadowRoot)){console.warn(`rootNode is not instance of Document or ShadowRoot`);return}const e=n.querySelector(`[aria-describedby="${o}"]`);if(!e){console.warn(`Unable to find reference element with aria-describedby ${o}`);return}return e}get host(){return i(this)}};d.style=a;export{d as dso_onboarding_tip};
+//# sourceMappingURL=p-5ab79fb4.entry.js.map

package/dist/dso-toolkit/p-5ab79fb4.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["onboardingTipCss","OnboardingTip","constructor","hostRef","this","placement","ready","componentDidRender","host","matches","showPopover","cleanUp","referenceElement","tipArrowRef","HTMLElement","positionTooltip","tipRef","placementTip","topPositionSmallViewPort","halfMainAxisOffset","disconnectedCallback","hidePopover","_a","call","undefined","render","h","Host","key","popover","onAnimationend","class","role","headingSlottedElement","icon","name","label","variant","onDsoClick","e","dsoClose","emit","originalEvent","ref","querySelector","id","console","warn","rootNode","getRootNode","Document","ShadowRoot","reference"],"sources":["src/components/onboarding-tip/onboarding-tip.scss?tag=dso-onboarding-tip&encapsulation=shadow","src/components/onboarding-tip/onboarding-tip.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n\r\n@use \"~dso-toolkit/src/components/button\";\r\n\r\n@use \"~dso-toolkit/src/global/mixins/set-colors.mixin\" as set-colors;\r\n\r\n@use \"onboarding-tip.variables\" as onboarding-tip-variables;\r\n\r\n@include utilities.box-sizing();\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n::slotted([slot=\"heading\"]) {\r\n  display: flex !important;\r\n  align-items: center !important;\r\n\r\n  margin-block-end: 0 !important;\r\n  margin-block-start: 0 !important;\r\n\r\n  color: colors.$wit !important;\r\n  line-height: 1.375 !important;\r\n}\r\n\r\n:host {\r\n  --_dso-button-primary-background-color: #{colors.$wit};\r\n  --_dso-button-primary-border-color: #{colors.$wit};\r\n  --_dso-button-primary-color: #{colors.$zwart};\r\n  --_dso-button-primary-hover-background-color: #{colors.$grijs-20};\r\n  --_dso-button-primary-hover-border-color: #{colors.$grijs-20};\r\n  --_dso-button-primary-hover-color: #{colors.$zwart};\r\n  --_dso-button-primary-active-background-color: #{colors.$grijs-40};\r\n  --_dso-button-primary-active-border-color: #{colors.$grijs-40};\r\n  --_dso-button-primary-active-color: #{colors.$zwart};\r\n  --_dso-button-primary-disabled-background-color: #{colors.$wit};\r\n  --_dso-button-primary-disabled-border-color: #{colors.$wit};\r\n  --_dso-button-primary-disabled-color: #{colors.$grijs-30};\r\n\r\n  --_dso-button-secondary-background-color: #{colors.$wit};\r\n  --_dso-button-secondary-border-color: #{colors.$wit};\r\n  --_dso-button-secondary-color: #{colors.$zwart};\r\n  --_dso-button-secondary-hover-background-color: #{colors.$grijs-20};\r\n  --_dso-button-secondary-hover-border-color: #{colors.$grijs-20};\r\n  --_dso-button-secondary-hover-color: #{colors.$zwart};\r\n  --_dso-button-secondary-active-background-color: #{colors.$grijs-40};\r\n  --_dso-button-secondary-active-border-color: #{colors.$grijs-40};\r\n  --_dso-button-secondary-active-color: #{colors.$zwart};\r\n  --_dso-button-secondary-disabled-background-color: #{colors.$wit};\r\n  --_dso-button-secondary-disabled-border-color: #{colors.$wit};\r\n  --_dso-button-secondary-disabled-color: #{colors.$grijs-30};\r\n\r\n  display: block;\r\n  filter: drop-shadow(2px 2px 16px rgba(0, 0, 0, 0.4));\r\n\r\n  // Visibility & opacity are updated using Floating-UI\r\n  transition:\r\n    visibility onboarding-tip-variables.$transition-time,\r\n    opacity onboarding-tip-variables.$transition-time;\r\n}\r\n\r\n// Startup fade-in transition\r\n:host(:not([ready])) {\r\n  opacity: 1;\r\n  animation: onboarding-tip-variables.$transition-time ease-in 1 normal both fadeInOpacity;\r\n}\r\n\r\n:host([popover]) {\r\n  margin: 0 !important;\r\n  border: 0;\r\n  padding: 0;\r\n  background-color: transparent;\r\n  overflow: unset;\r\n}\r\n\r\n.onboarding-tip {\r\n  font-family: typography.$font-family-base;\r\n  font-style: normal;\r\n  font-weight: 400;\r\n  line-height: typography.$line-height-base;\r\n  line-break: auto;\r\n  text-align: start;\r\n  text-decoration: none;\r\n  text-shadow: none;\r\n  text-transform: none;\r\n  letter-spacing: normal;\r\n  overflow-wrap: anywhere;\r\n  word-spacing: normal;\r\n  word-wrap: normal;\r\n  white-space: normal;\r\n  font-size: typography.$font-size-small;\r\n  inset-block-start: 0;\r\n  inset-inline-start: 0;\r\n  z-index: zindex.$onboarding-tip;\r\n\r\n  @media screen and (max-width: onboarding-tip-variables.$max-inline-size) {\r\n    padding-inline-start: units.$u1 !important;\r\n  }\r\n}\r\n\r\n.dso-close {\r\n  position: absolute;\r\n  inset-block-start: 4px;\r\n  inset-inline-end: 4px;\r\n}\r\n\r\n.onboarding-tip-inner {\r\n  --link-color: #{colors.$wit};\r\n  --link-hover-color: #{colors.$grijs-30};\r\n  --link-visited-color: #{colors.$grijs-50};\r\n\r\n  max-inline-size: min(#{onboarding-tip-variables.$max-inline-size}, calc(100vw - 2 * #{units.$u1}));\r\n  max-block-size: calc(100vh - 10px); // 10px is the padding given to floating-ui\r\n  overflow: auto;\r\n  padding-block: onboarding-tip-variables.$padding-block;\r\n  padding-inline: onboarding-tip-variables.$padding-inline;\r\n  border-radius: onboarding-tip-variables.$border-radius;\r\n  display: block;\r\n  font-size: typography.$root-font-size-base;\r\n  position: relative;\r\n  z-index: 2; // z-index higher than the arrow\r\n\r\n  @include set-colors.apply(onboarding-tip-variables.$background-color, $icons: false, $links: false);\r\n\r\n  @media screen and (max-width: media-query-breakpoints.$screen-sm-max) {\r\n    max-block-size: unset;\r\n  }\r\n}\r\n\r\n.onboarding-tip-arrow {\r\n  border-start-start-radius: onboarding-tip-variables.$border-radius;\r\n  position: absolute;\r\n  block-size: onboarding-tip-variables.$arrow-block-size;\r\n  inline-size: onboarding-tip-variables.$arrow-inline-size;\r\n  background: onboarding-tip-variables.$background-color;\r\n  z-index: 1;\r\n  pointer-events: none;\r\n}\r\n\r\n.onboarding-tip-content-wrapper {\r\n  padding-inline: units.$u2;\r\n  padding-block-end: units.$u2;\r\n}\r\n\r\n.onboarding-tip-content-heading {\r\n  display: flex;\r\n\r\n  dso-icon {\r\n    margin-inline-end: units.$u1;\r\n  }\r\n}\r\n\r\n@keyframes fadeInOpacity {\r\n  0% {\r\n    opacity: 0;\r\n  }\r\n  100% {\r\n    opacity: 1;\r\n  }\r\n}\r\n","import { Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, State, h } from \"@stencil/core\";\r\n\r\nimport { positionTooltip } from \"../../functional-components/tooltip/position-tooltip.function\";\r\nimport { TooltipClean, TooltipPlacement } from \"../../functional-components/tooltip/tooltip.interfaces\";\r\n\r\nimport { OnboardingTipCloseEvent } from \"./onboarding-tip.interfaces\";\r\n\r\n@Component({\r\n  tag: \"dso-onboarding-tip\",\r\n  styleUrl: \"onboarding-tip.scss\",\r\n  shadow: true,\r\n})\r\nexport class OnboardingTip implements ComponentInterface {\r\n  @Element()\r\n  private host!: HTMLDsoOnboardingTipElement;\r\n\r\n  /**\r\n   * Where to place the Onboarding Tip relative to its reference element.\r\n   */\r\n  @Prop()\r\n  placement: TooltipPlacement = \"right\";\r\n\r\n  /**\r\n   * Emitted when the user closes the Onboarding Tip.\r\n   */\r\n  @Event()\r\n  dsoClose!: EventEmitter<OnboardingTipCloseEvent>;\r\n\r\n  @State()\r\n  ready = false;\r\n\r\n  componentDidRender() {\r\n    if (!this.host.matches(\":popover-open\")) {\r\n      this.host.showPopover();\r\n    }\r\n\r\n    if (!this.cleanUp && this.referenceElement && this.tipArrowRef instanceof HTMLElement) {\r\n      this.cleanUp = positionTooltip({\r\n        referenceElement: this.referenceElement,\r\n        tipRef: this.host,\r\n        tipArrowRef: this.tipArrowRef,\r\n        placementTip: `${this.placement}-start`,\r\n        topPositionSmallViewPort: true,\r\n        halfMainAxisOffset: true,\r\n      });\r\n    }\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    if (this.host.matches(\":popover-open\")) {\r\n      this.host.hidePopover();\r\n    }\r\n\r\n    this.cleanUp?.();\r\n    this.cleanUp = undefined;\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host popover=\"manual\" ready={this.ready} onAnimationend={() => (this.ready = true)}>\r\n        <div class=\"onboarding-tip\" role=\"tooltip\">\r\n          <div class=\"onboarding-tip-inner\">\r\n            <div class=\"onboarding-tip-content-wrapper\">\r\n              {this.headingSlottedElement !== null && (\r\n                <div class=\"onboarding-tip-content-heading\">\r\n                  <dso-icon icon=\"light-bulb\"></dso-icon>\r\n                  <slot name=\"heading\" />\r\n                </div>\r\n              )}\r\n              <dso-icon-button\r\n                class=\"dso-close\"\r\n                label=\"Sluiten\"\r\n                variant=\"tertiary\"\r\n                icon=\"times\"\r\n                onDsoClick={(e) => this.dsoClose.emit({ originalEvent: e })}\r\n              />\r\n              <slot></slot>\r\n            </div>\r\n          </div>\r\n          <div class=\"onboarding-tip-arrow\" ref={(ref) => (this.tipArrowRef = ref)}></div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  private tipArrowRef: HTMLDivElement | undefined;\r\n\r\n  private get headingSlottedElement() {\r\n    return this.host.querySelector(\"[slot='heading']\");\r\n  }\r\n\r\n  private cleanUp: TooltipClean | undefined;\r\n\r\n  private get referenceElement(): HTMLElement | undefined {\r\n    const id = this.host.id;\r\n\r\n    if (!id) {\r\n      console.warn(\"Unable to find reference. Onboarding Tip has no [id] attribute.\");\r\n\r\n      return;\r\n    }\r\n\r\n    const rootNode = this.host.getRootNode();\r\n    if (!(rootNode instanceof Document || rootNode instanceof ShadowRoot)) {\r\n      console.warn(`rootNode is not instance of Document or ShadowRoot`);\r\n\r\n      return;\r\n    }\r\n\r\n    const reference = rootNode.querySelector<HTMLElement>(`[aria-describedby=\"${id}\"]`);\r\n    if (!reference) {\r\n      console.warn(`Unable to find reference element with aria-describedby ${id}`);\r\n\r\n      return;\r\n    }\r\n\r\n    return reference;\r\n  }\r\n}\r\n"],"mappings":"4HAAA,MAAMA,EAAmB,omG,MCYZC,EAAa,MAL1B,WAAAC,CAAAC,G,6CAaEC,KAASC,UAAqB,QAS9BD,KAAKE,MAAG,KAyFT,CAvFC,kBAAAC,GACE,IAAKH,KAAKI,KAAKC,QAAQ,iBAAkB,CACvCL,KAAKI,KAAKE,a,CAGZ,IAAKN,KAAKO,SAAWP,KAAKQ,kBAAoBR,KAAKS,uBAAuBC,YAAa,CACrFV,KAAKO,QAAUI,EAAgB,CAC7BH,iBAAkBR,KAAKQ,iBACvBI,OAAQZ,KAAKI,KACbK,YAAaT,KAAKS,YAClBI,aAAc,GAAGb,KAAKC,kBACtBa,yBAA0B,KAC1BC,mBAAoB,M,EAK1B,oBAAAC,G,MACE,GAAIhB,KAAKI,KAAKC,QAAQ,iBAAkB,CACtCL,KAAKI,KAAKa,a,EAGZC,EAAAlB,KAAKO,WAAO,MAAAW,SAAA,SAAAA,EAAAC,KAAAnB,MACZA,KAAKO,QAAUa,S,CAGjB,MAAAC,GACE,OACEC,EAACC,EAAK,CAAAC,IAAA,2CAAAC,QAAQ,SAASvB,MAAOF,KAAKE,MAAOwB,eAAgB,IAAO1B,KAAKE,MAAQ,MAC5EoB,EAAA,OAAAE,IAAA,2CAAKG,MAAM,iBAAiBC,KAAK,WAC/BN,EAAK,OAAAE,IAAA,2CAAAG,MAAM,wBACTL,EAAK,OAAAE,IAAA,2CAAAG,MAAM,kCACR3B,KAAK6B,wBAA0B,MAC9BP,EAAA,OAAAE,IAAA,2CAAKG,MAAM,kCACTL,EAAU,YAAAE,IAAA,2CAAAM,KAAK,eACfR,EAAA,QAAAE,IAAA,2CAAMO,KAAK,aAGfT,EAAA,mBAAAE,IAAA,2CACEG,MAAM,YACNK,MAAM,UACNC,QAAQ,WACRH,KAAK,QACLI,WAAaC,GAAMnC,KAAKoC,SAASC,KAAK,CAAEC,cAAeH,MAEzDb,EAAA,QAAAE,IAAA,+CAGJF,EAAK,OAAAE,IAAA,2CAAAG,MAAM,uBAAuBY,IAAMA,GAASvC,KAAKS,YAAc8B,K,CAQ5E,yBAAYV,GACV,OAAO7B,KAAKI,KAAKoC,cAAc,mB,CAKjC,oBAAYhC,GACV,MAAMiC,EAAKzC,KAAKI,KAAKqC,GAErB,IAAKA,EAAI,CACPC,QAAQC,KAAK,mEAEb,M,CAGF,MAAMC,EAAW5C,KAAKI,KAAKyC,cAC3B,KAAMD,aAAoBE,UAAYF,aAAoBG,YAAa,CACrEL,QAAQC,KAAK,sDAEb,M,CAGF,MAAMK,EAAYJ,EAASJ,cAA2B,sBAAsBC,OAC5E,IAAKO,EAAW,CACdN,QAAQC,KAAK,0DAA0DF,KAEvE,M,CAGF,OAAOO,C","ignoreList":[]}

package/dist/dso-toolkit/{p-b6d75e39.entry.js → p-71c54b0e.entry.js}

@@ -1,2 +1,2 @@
-import{h as e,F as t,r as o,c as i}from"./p-DxWmN7gh.js";import{c as n}from"./p-ChV9xqsO.js";const s=({owner:o,ancestors:i,item:r,index:a,level:l,setSize:c})=>{var d,u,h,p;return e("li",{key:r.id,class:n("tree-item",{"has-child":r.hasItems,"is-expanded":!!r.open&&!!((d=r.items)===null||d===void 0?void 0:d.length)}),role:"none"},e("div",{class:"tree-branch-control"},r.hasItems?e("div",{onClick:e=>o.itemClick(e,i,r)},e("dso-icon",{icon:r.open?"minus-square":"plus-square"})):e("dso-icon",null)),e("p",{class:n("tree-content",{active:r.active},{selected:r.selected}),tabindex:l===1&&a===0?0:-1,role:"treeitem","aria-expanded":r.hasItems?""+(!!r.open&&!!((u=r.items)===null||u===void 0?void 0:u.length)):undefined,"aria-current":r.active?"true":undefined,"aria-level":l,"aria-setsize":c,"aria-posinset":a+1,"aria-busy":r.loading?"true":undefined,"data-item-id":r.id,onClick:e=>o.itemClick(e,i,r)},r.selected&&e("span",{class:"sr-only"},"Resultaat: "),r.href?e("a",{href:r.href,tabindex:"-1"},r.label):e("span",null,r.label),(h=r.icons)===null||h===void 0?void 0:h.map((t=>e("dso-icon",{icon:t.icon,title:t.label})))),r.open&&e(t,null,r.hasItems&&!r.items&&r.loading?e("dso-progress-indicator",{size:"small",label:"Resultaten laden: een moment geduld alstublieft."}):e("ul",{role:"group"},(p=r.items)===null||p===void 0?void 0:p.map(((t,n,a)=>e(s,{owner:o,ancestors:[...i,r],item:t,index:n,level:l+1,setSize:a.length}))))))};const r=':host ul{list-style-type:none;padding-inline-start:32px;position:relative}:host li{position:relative}:host ul[role=tree]{padding-inline-start:0}:host ul[role=group]::before{border-inline-start:1px solid #275937;content:"";block-size:8px;inset-inline-start:44px;position:absolute;inset-block-start:0;inline-size:0}:host li:not(.has-child)::before{border-block-start:1px solid #275937;content:"";block-size:0;inset-inline-start:12px;position:absolute;inset-block-start:20px;inline-size:16px}:host li:not(.has-child)::after{border-inline-start:1px solid #275937;content:"";block-size:100%;inset-inline-start:12px;position:absolute;inset-block-start:8px;inline-size:0}:host li:not(.has-child):last-child::after{block-size:20px;inset-block-start:0}:host li.has-child::before{border-block-start:1px solid #275937;content:"";block-size:0;inset-inline-start:24px;position:absolute;inset-block-start:20px;inline-size:4px}:host li.has-child:not(:last-child)::after{border-inline-start:1px solid #275937;content:"";block-size:calc(100% - 24px);inset-inline-start:12px;position:absolute;inset-block-start:32px;inline-size:0}:host li.has-child.is-expanded:last-child::after{border-inline-start:1px solid #275937;content:"";block-size:calc(100% - 32px);inset-inline-start:12px;position:absolute;inset-block-start:32px;inline-size:0}:host .tree-branch-control{color:#39870c;display:inline-block;font-size:16px;margin-block:8px;margin-inline:0 8px;vertical-align:top}:host .tree-branch-control>div{cursor:pointer}:host .tree-content{cursor:pointer;display:inline-block;margin-block:8px;margin-inline:0;max-inline-size:calc(100% - 40px)}:host .tree-content a{color:#191919;text-decoration:underline}:host .tree-content a:hover,:host .tree-content a:focus{color:#191919;text-decoration:none}:host .tree-content a:active{text-decoration:none}:host .tree-content.selected{color:#191919;font-weight:700;text-decoration:underline}:host .tree-content.selected:hover,:host .tree-content.selected:focus{text-decoration:none}:host .tree-content.active{color:#8b4a6a;font-style:italic;font-weight:700;text-decoration:underline}:host .tree-content.active:hover,:host .tree-content.active:focus{text-decoration:none}:host .tree-content.active a{color:#8b4a6a}:host .tree-content.active a:hover,:host .tree-content.active a:focus{text-decoration:none}:host .tree-content dso-icon{color:#39870c;font-size:0.75em;margin-inline-start:0.5em;vertical-align:text-bottom}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}';const a=class{constructor(e){o(this,e);this.dsoOpenItem=i(this,"dsoOpenItem",7);this.dsoCloseItem=i(this,"dsoCloseItem",7);this.dsoClickItem=i(this,"dsoClickItem",7);this.keyDownListener=e=>{if(e.defaultPrevented){return}const t=e=>e.length===1&&e.match(/\S/);const o=e.composedPath().find((e=>e instanceof HTMLElement?e.className==="dso-tree":false));if(!(e.target instanceof HTMLParagraphElement)||!(o instanceof HTMLElement)){return}switch(e.key){case"ArrowDown":a.moveFocus(o,e.target,"next");break;case"ArrowUp":a.moveFocus(o,e.target,"previous");break;case"ArrowRight":a.expandItemOrFocusChild(o,e.target);break;case"ArrowLeft":a.collapseItemOrFocusParent(o,e.target);break;case"End":a.moveFocus(o,e.target,"last");break;case"Home":a.moveFocus(o,e.target,"first");break;case"Enter":case" ":e.target.click();break;default:if(t(e.key)){if(a.setFocusByFirstCharacter(o,e.target,e.key,e.shiftKey)){break}}return}e.preventDefault()};this.itemClick=(e,t,o)=>{if(!(e.target instanceof HTMLElement)){return}const i=e.target.closest(".tree-content");if(i){const n=e.composedPath().find((e=>e instanceof HTMLElement?e.className==="dso-tree":false));if(!(i instanceof HTMLParagraphElement)||!(n instanceof HTMLElement)){return}a.setFocus(n,i);this.dsoClickItem.emit({path:[...t,o],originalEvent:e});return}if(o.open){this.dsoCloseItem.emit([...t,o])}else{this.dsoOpenItem.emit([...t,o])}}}async focusItem(e){var t;const o=this.tree;if(!o||e.length===0){return false}const i=e[e.length-1];if(!i){throw new Error("No itemToFocus found")}const n=Array.from((t=o.querySelectorAll("p"))!==null&&t!==void 0?t:[]).filter((e=>e.offsetWidth>0&&e.offsetHeight>0)).find((e=>e.dataset["itemId"]===i.id));if(!n){return false}a.setFocus(o,n);return true}static setFocus(e,t){if(t){Array.from(e.querySelectorAll("p")).filter((e=>e.tabIndex===0)).forEach((e=>e.tabIndex=-1));t.tabIndex=0;t.focus()}}static moveFocus(e,t,o){const i=Array.from(e.querySelectorAll("p")).filter((e=>e.offsetWidth>0&&e.offsetHeight>0));let n=0;switch(o){case"first":n=0;break;case"previous":n=i.indexOf(t)-1;break;case"next":n=i.indexOf(t)+1;break;case"last":n=i.length-1;break}const s=i[n];if(!s){throw new Error("No focusableItem found")}a.setFocus(e,s)}static expandItemOrFocusChild(e,t){var o;if((t===null||t===void 0?void 0:t.getAttribute("aria-expanded"))==="true"){a.moveFocus(e,t,"next")}else{const e=(o=t.previousElementSibling)===null||o===void 0?void 0:o.firstElementChild;if(e instanceof HTMLElement){e.click()}}}static collapseItemOrFocusParent(e,t){var o,i,n;if((t===null||t===void 0?void 0:t.getAttribute("aria-expanded"))==="true"){const e=(o=t.previousElementSibling)===null||o===void 0?void 0:o.firstElementChild;if(e instanceof HTMLElement){e.click()}}else{const o=(n=(i=t===null||t===void 0?void 0:t.parentElement)===null||i===void 0?void 0:i.parentElement)===null||n===void 0?void 0:n.previousElementSibling;if(o instanceof HTMLElement){a.setFocus(e,o)}}}static setFocusByFirstCharacter(e,t,o,i){const n=Array.from(e.querySelectorAll("p")).filter((e=>e.offsetWidth>0&&e.offsetHeight>0));if(i){n.reverse()}const s=n.indexOf(t);o=o.toLowerCase();let r=n.find(((e,t)=>{var i;return t>s&&((i=e.textContent)===null||i===void 0?void 0:i.toLowerCase().startsWith(o))}));if(!r){r=n.find(((e,t)=>{var i;return t<s&&((i=e.textContent)===null||i===void 0?void 0:i.toLowerCase().startsWith(o))}))}if(r){a.setFocus(e,r);return true}return false}render(){var t;return e("div",{key:"df518bf4e90740863ffefdbd13598671010a8126",id:"tree",class:"dso-tree",onKeyDown:e=>this.keyDownListener(e),ref:e=>this.tree=e},e("ul",{key:"17b6a9e1c6051321ef13dff80d28876bda733ad9",role:"tree","aria-label":"Objectenboom"},(t=this.collection)===null||t===void 0?void 0:t.map(((t,o)=>e(s,{owner:this,ancestors:[],item:t,index:o,level:1,setSize:this.collection.length})))))}};a.style=r;export{a as dso_tree_view};
-//# sourceMappingURL=p-b6d75e39.entry.js.map
+import{h as e,F as t,r as o,c as i}from"./p-DxWmN7gh.js";import{c as n}from"./p-ChV9xqsO.js";const s=({owner:o,ancestors:i,item:r,index:a,level:l,setSize:c})=>{var d,u,h,p;return e("li",{key:r.id,class:n("tree-item",{"has-child":r.hasItems,"is-expanded":!!r.open&&!!((d=r.items)===null||d===void 0?void 0:d.length)}),role:"none"},e("div",{class:"tree-branch-control"},r.hasItems?e("div",{onClick:e=>o.itemClick(e,i,r)},e("dso-icon",{icon:r.open?"minus-square":"plus-square"})):e("dso-icon",null)),e("p",{class:n("tree-content",{active:r.active},{selected:r.selected}),tabindex:l===1&&a===0?0:-1,role:"treeitem","aria-expanded":r.hasItems?""+(!!r.open&&!!((u=r.items)===null||u===void 0?void 0:u.length)):undefined,"aria-current":r.active?"true":undefined,"aria-level":l,"aria-setsize":c,"aria-posinset":a+1,"aria-busy":r.loading?"true":undefined,"data-item-id":r.id,onClick:e=>o.itemClick(e,i,r)},r.selected&&e("span",{class:"sr-only"},"Resultaat: "),r.href?e("a",{href:r.href,tabindex:"-1"},r.label):e("span",null,r.label),(h=r.icons)===null||h===void 0?void 0:h.map((t=>e("dso-icon",{icon:t.icon,title:t.label})))),r.open&&e(t,null,r.hasItems&&!r.items&&r.loading?e("dso-progress-indicator",{size:"small",label:"Resultaten laden: een moment geduld alstublieft."}):e("ul",{role:"group"},(p=r.items)===null||p===void 0?void 0:p.map(((t,n,a)=>e(s,{owner:o,ancestors:[...i,r],item:t,index:n,level:l+1,setSize:a.length}))))))};const r=':host ul{list-style-type:none;padding-inline-start:32px;position:relative}:host li{position:relative}:host ul[role=tree]{padding-inline-start:0}:host ul[role=group]::before{border-inline-start:1px solid #275937;content:"";block-size:8px;inset-inline-start:44px;position:absolute;inset-block-start:0;inline-size:0}:host li:not(.has-child)::before{border-block-start:1px solid #275937;content:"";block-size:0;inset-inline-start:12px;position:absolute;inset-block-start:20px;inline-size:16px}:host li:not(.has-child)::after{border-inline-start:1px solid #275937;content:"";block-size:100%;inset-inline-start:12px;position:absolute;inset-block-start:8px;inline-size:0}:host li:not(.has-child):last-child::after{block-size:20px;inset-block-start:0}:host li.has-child::before{border-block-start:1px solid #275937;content:"";block-size:0;inset-inline-start:24px;position:absolute;inset-block-start:20px;inline-size:4px}:host li.has-child:not(:last-child)::after{border-inline-start:1px solid #275937;content:"";block-size:calc(100% - 24px);inset-inline-start:12px;position:absolute;inset-block-start:32px;inline-size:0}:host li.has-child.is-expanded:last-child::after{border-inline-start:1px solid #275937;content:"";block-size:calc(100% - 32px);inset-inline-start:12px;position:absolute;inset-block-start:32px;inline-size:0}:host .tree-branch-control{color:#39870c;display:inline-block;font-size:16px;margin-block:8px;margin-inline:0 8px;vertical-align:top}:host .tree-branch-control>div{cursor:pointer}:host .tree-content{cursor:pointer;display:inline-block;margin-block:8px;margin-inline:0;max-inline-size:calc(100% - 40px)}:host .tree-content a{color:#191919;text-decoration:underline}:host .tree-content a:hover,:host .tree-content a:focus{color:#191919;text-decoration:none}:host .tree-content a:active{text-decoration:none}:host .tree-content.selected{color:#191919;font-weight:700;text-decoration:underline}:host .tree-content.selected:hover,:host .tree-content.selected:focus{text-decoration:none}:host .tree-content.active{color:#8b4a6a;font-style:italic;font-weight:700;text-decoration:underline}:host .tree-content.active:hover,:host .tree-content.active:focus{text-decoration:none}:host .tree-content.active a{color:#8b4a6a}:host .tree-content.active a:hover,:host .tree-content.active a:focus{text-decoration:none}:host .tree-content dso-icon{color:#39870c;font-size:0.75em;margin-inline-start:0.5em;vertical-align:text-bottom}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}';const a=class{constructor(e){o(this,e);this.dsoOpenItem=i(this,"dsoOpenItem",7);this.dsoCloseItem=i(this,"dsoCloseItem",7);this.dsoClickItem=i(this,"dsoClickItem",7);this.keyDownListener=e=>{if(e.defaultPrevented){return}const t=e=>e.length===1&&e.match(/\S/);const o=e.composedPath().find((e=>e instanceof HTMLElement?e.className==="dso-tree":false));if(!(e.target instanceof HTMLParagraphElement)||!(o instanceof HTMLElement)){return}switch(e.key){case"ArrowDown":a.moveFocus(o,e.target,"next");break;case"ArrowUp":a.moveFocus(o,e.target,"previous");break;case"ArrowRight":a.expandItemOrFocusChild(o,e.target);break;case"ArrowLeft":a.collapseItemOrFocusParent(o,e.target);break;case"End":a.moveFocus(o,e.target,"last");break;case"Home":a.moveFocus(o,e.target,"first");break;case"Enter":case" ":e.target.click();break;default:if(t(e.key)){if(a.setFocusByFirstCharacter(o,e.target,e.key,e.shiftKey)){break}}return}e.preventDefault()};this.itemClick=(e,t,o)=>{if(!(e.target instanceof HTMLElement)){return}const i=e.target.closest(".tree-content");if(i){const n=e.composedPath().find((e=>e instanceof HTMLElement?e.className==="dso-tree":false));if(!(i instanceof HTMLParagraphElement)||!(n instanceof HTMLElement)){return}a.setFocus(n,i);this.dsoClickItem.emit({path:[...t,o],originalEvent:e});return}if(o.open){this.dsoCloseItem.emit([...t,o])}else{this.dsoOpenItem.emit([...t,o])}}}async focusItem(e){var t;const o=this.tree;if(!o||e.length===0){return false}const i=e[e.length-1];if(!i){throw new Error("No itemToFocus found")}const n=Array.from((t=o.querySelectorAll("p"))!==null&&t!==void 0?t:[]).filter((e=>e.offsetWidth>0&&e.offsetHeight>0)).find((e=>e.dataset["itemId"]===i.id));if(!n){return false}a.setFocus(o,n);return true}static setFocus(e,t){if(t){Array.from(e.querySelectorAll("p")).filter((e=>e.tabIndex===0)).forEach((e=>e.tabIndex=-1));t.tabIndex=0;t.focus()}}static moveFocus(e,t,o){const i=Array.from(e.querySelectorAll("p")).filter((e=>e.offsetWidth>0&&e.offsetHeight>0));let n=0;switch(o){case"first":n=0;break;case"previous":n=i.indexOf(t)-1;break;case"next":n=i.indexOf(t)+1;break;case"last":n=i.length-1;break}const s=i[n];if(!s){throw new Error("No focusableItem found")}a.setFocus(e,s)}static expandItemOrFocusChild(e,t){var o;if((t===null||t===void 0?void 0:t.getAttribute("aria-expanded"))==="true"){a.moveFocus(e,t,"next")}else{const e=(o=t.previousElementSibling)===null||o===void 0?void 0:o.firstElementChild;if(e instanceof HTMLElement){e.click()}}}static collapseItemOrFocusParent(e,t){var o,i,n;if((t===null||t===void 0?void 0:t.getAttribute("aria-expanded"))==="true"){const e=(o=t.previousElementSibling)===null||o===void 0?void 0:o.firstElementChild;if(e instanceof HTMLElement){e.click()}}else{const o=(n=(i=t===null||t===void 0?void 0:t.parentElement)===null||i===void 0?void 0:i.parentElement)===null||n===void 0?void 0:n.previousElementSibling;if(o instanceof HTMLElement){a.setFocus(e,o)}}}static setFocusByFirstCharacter(e,t,o,i){const n=Array.from(e.querySelectorAll("p")).filter((e=>e.offsetWidth>0&&e.offsetHeight>0));if(i){n.reverse()}const s=n.indexOf(t);o=o.toLowerCase();let r=n.find(((e,t)=>{var i;return t>s&&((i=e.textContent)===null||i===void 0?void 0:i.toLowerCase().startsWith(o))}));if(!r){r=n.find(((e,t)=>{var i;return t<s&&((i=e.textContent)===null||i===void 0?void 0:i.toLowerCase().startsWith(o))}))}if(r){a.setFocus(e,r);return true}return false}render(){var t;return e("div",{key:"9f0f3d06ee48804645afeb14f831b9bf9c2cee82",id:"tree",class:"dso-tree",onKeyDown:e=>this.keyDownListener(e),ref:e=>this.tree=e},e("ul",{key:"a85271c494f56136fa56581389c03668347514ed",role:"tree","aria-label":"Objectenboom"},(t=this.collection)===null||t===void 0?void 0:t.map(((t,o)=>e(s,{owner:this,ancestors:[],item:t,index:o,level:1,setSize:this.collection.length})))))}};a.style=r;export{a as dso_tree_view};
+//# sourceMappingURL=p-71c54b0e.entry.js.map

package/dist/dso-toolkit/{p-f4d66373.entry.js → p-7229ccdf.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,c as d,h as s,g as l}from"./p-DxWmN7gh.js";import{g as i}from"./p-CodDyi2J.js";import{i as a}from"./p-B_kXuEcW.js";import{v as e}from"./p-BF0_OXTe.js";const t={en:{"dso-modal":{close:"Close",dialog:"Dialog"}},nl:{"dso-modal":{close:"Sluiten",dialog:"Dialoog"}}};const r="@keyframes ModalFadeIn{0%{opacity:0}100%{opacity:1}}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([fullscreen]) dialog{inline-size:100dvi;block-size:100dvb}:host([fullscreen]) dialog .dso-dialog{display:flex;flex-direction:column;inline-size:100%;block-size:100%}:host([fullscreen]) dialog .dso-dialog>dso-scrollable{flex-grow:1;max-block-size:unset}:host([fullscreen]) dialog .dso-footer{flex-shrink:0}@media screen and (max-width: 480px){:host dialog{inline-size:100dvi;block-size:100dvb}:host dialog .dso-dialog{display:flex;flex-direction:column;inline-size:100%;block-size:100%}:host dialog .dso-dialog>dso-scrollable{flex-grow:1;max-block-size:unset}:host dialog .dso-footer{flex-shrink:0}}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}button{-webkit-appearance:button;color:inherit;cursor:pointer;font:inherit;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;overflow:visible;text-transform:none}button[disabled]{cursor:default}button::-moz-focus-inner{border:0;padding:0}.dso-modal{overflow:visible;padding:0;border:0}.dso-modal::backdrop{background-color:rgba(255, 255, 255, 0.8)}.dso-modal .dso-dialog{inline-size:640px;background-color:#fff;opacity:1;box-shadow:0 8px 24px 0 rgba(25, 25, 25, 0.4);animation:200ms ease-out 0s 1 ModalFadeIn}.dso-modal .dso-header{position:relative;padding:16px;border-block-end:1px solid #ccc}.dso-modal .dso-header h2{max-inline-size:calc(100% - 24px);margin:0;color:#275937}.dso-modal .dso-header .dso-close{position:absolute;inset-block-start:16px;inset-inline-end:13px;block-size:32px;inline-size:32px;padding:0;background-color:transparent;border:0;text-align:center}.dso-modal>.dso-dialog>.dso-body p{margin-block:0 var(--_dt-rich-content-margin-block, 16px);margin-inline:0}.dso-modal>.dso-dialog>.dso-body ul,.dso-modal>.dso-dialog>.dso-body ol{margin-block-end:16px}.dso-modal>.dso-dialog>.dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),.dso-modal>.dso-dialog>.dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list){padding-inline-start:24px}.dso-modal>.dso-dialog>.dso-body ul ul,.dso-modal>.dso-dialog>.dso-body ul ol,.dso-modal>.dso-dialog>.dso-body ol ul,.dso-modal>.dso-dialog>.dso-body ol ol{margin-block-end:0}.dso-modal>.dso-dialog>.dso-body pre{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>.dso-body blockquote{padding-block:16px;padding-inline:24px}.dso-modal>.dso-dialog>.dso-body dso-highlight-box,.dso-modal>.dso-dialog>.dso-body .dso-highlight-box{margin-block-end:24px}.dso-modal>.dso-dialog>.dso-body img{block-size:auto;max-inline-size:100%}.dso-modal>.dso-dialog>.dso-body{block-size:calc(100% - 96px - 1.5rem);max-block-size:calc(70vh - 144px - 1.5em);min-block-size:1.5rem;overflow-x:auto;padding:32px}.dso-modal>.dso-dialog>dso-scrollable{block-size:calc(100% - 96px - 1.5rem);max-block-size:calc(70vh - 144px - 1.5em);min-block-size:6.5rem}.dso-modal>.dso-dialog>dso-scrollable .dso-body p{margin-block:0 var(--_dt-rich-content-margin-block, 16px);margin-inline:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol{margin-block-end:16px}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),.dso-modal>.dso-dialog>dso-scrollable .dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list){padding-inline-start:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ul ol,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol ol{margin-block-end:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body pre{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body blockquote{padding-block:16px;padding-inline:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body dso-highlight-box,.dso-modal>.dso-dialog>dso-scrollable .dso-body .dso-highlight-box{margin-block-end:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body img{block-size:auto;max-inline-size:100%}.dso-modal>.dso-dialog>dso-scrollable .dso-body{padding:32px}.dso-modal .dso-body:focus-visible{outline:none}@media screen and (max-width: 767px){.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}.dso-modal .dso-footer button{inline-size:100%;text-align:center}.dso-modal .dso-footer button+button{margin-block-start:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span{float:none}}.dso-modal .dso-footer{min-block-size:80px;padding-block:16px;padding-inline:32px;text-align:end}@media screen and (min-width: 768px){.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary{margin-inline-start:16px}.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}}@media screen and (max-width: 767px){.dso-modal .dso-dialog{max-inline-size:100%;margin-block-start:0}.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}.dso-modal .dso-footer button{inline-size:100%;text-align:center}.dso-modal .dso-footer button+button{margin-block-start:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span{float:none}}@media screen and (max-height: 380px){.dso-modal .dso-dialog{min-block-size:216px;margin-block-start:8px;margin-block-end:8px}.dso-modal .dso-header{padding-block:8px;padding-inline:16px}.dso-modal .dso-header .dso-close{inset-block-start:8px}.dso-modal .dso-body{padding-block:16px;padding-inline:24px}.dso-modal .dso-footer{min-block-size:auto;overflow:auto;padding-block:8px;padding-inline:32px}}.dso-close dso-icon{color:#39870c}";const n=class{constructor(s){o(this,s);this.dsoClose=d(this,"dsoClose",7);this.ariaId=e();this.dialogRole="dialog";this.returnFocus=undefined;this.closable=false;this.text=a((()=>this.host),t);this.blockEscapeKey=o=>{if(o.key==="Escape"){o.preventDefault();if(this.closable){this.dsoClose.emit({originalEvent:o})}}}}get hasFooter(){return this.host.querySelector("[slot='footer']")!==null}componentDidLoad(){var o;if((o=this.htmlDialogElement)===null||o===void 0?void 0:o.isConnected){const o=i();if(o instanceof HTMLElement){this.returnFocusElement=o}this.htmlDialogElement.showModal()}}disconnectedCallback(){var o,d,s;(o=this.htmlDialogElement)===null||o===void 0?void 0:o.close();if(this.returnFocus===false){return}(s=(d=this.returnFocus)!==null&&d!==void 0?d:this.returnFocusElement)===null||s===void 0?void 0:s.focus()}handleDialogClick(o){if(!this.closable){return}if(o.target===this.htmlDialogElement){this.dsoClose.emit({originalEvent:o})}}render(){var o;return s("dialog",{key:"5eaf8af4a00b6cea08b9872f996c9a7f0e50e17d",class:"dso-modal",role:(o=this.dialogRole)!==null&&o!==void 0?o:undefined,"aria-modal":"true","aria-labelledby":this.ariaId,ref:o=>this.htmlDialogElement=o,onClick:o=>this.handleDialogClick(o),onKeyDown:o=>this.blockEscapeKey(o)},s("div",{key:"54dfc35e622941cceeb9b1b1db6e9f61fb1ee54b",class:"dso-dialog",role:"document"},this.modalTitle?s("div",{class:"dso-header"},s("h2",{id:this.ariaId},this.modalTitle),this.closable&&s("button",{type:"button",class:"dso-close",onClick:o=>this.dsoClose.emit({originalEvent:o})},s("dso-icon",{icon:"times"}),s("span",{class:"sr-only"},this.text("close")))):s("span",{class:"sr-only",id:this.ariaId},this.text("dialog")),s("dso-scrollable",{key:"970b0770174b51254db71bbb4ea22bdade8523b2"},s("div",{key:"e8ac2cb14083dbb5d548fa3850d90b1233c5262e",class:"dso-body",tabIndex:0},s("slot",{key:"781818fbf88305b194650eb940ee73022c07ada8",name:"body"}))),this.hasFooter&&s("div",{key:"0ea3d9327df101d07b19f171c8f7ce1cf1b96d3b",class:"dso-footer"},s("slot",{key:"c42adf6d3d293ab3bfc3278125bc99932ed3d55b",name:"footer"}))))}get host(){return l(this)}};n.style=r;export{n as dso_modal};
-//# sourceMappingURL=p-f4d66373.entry.js.map
+import{r as o,c as d,h as s,g as l}from"./p-DxWmN7gh.js";import{g as i}from"./p-CodDyi2J.js";import{i as a}from"./p-B_kXuEcW.js";import{v as e}from"./p-BF0_OXTe.js";const t={en:{"dso-modal":{close:"Close",dialog:"Dialog"}},nl:{"dso-modal":{close:"Sluiten",dialog:"Dialoog"}}};const r="@keyframes ModalFadeIn{0%{opacity:0}100%{opacity:1}}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([fullscreen]) dialog{inline-size:100dvi;block-size:100dvb}:host([fullscreen]) dialog .dso-dialog{display:flex;flex-direction:column;inline-size:100%;block-size:100%}:host([fullscreen]) dialog .dso-dialog>dso-scrollable{flex-grow:1;max-block-size:unset}:host([fullscreen]) dialog .dso-footer{flex-shrink:0}@media screen and (max-width: 480px){:host dialog{inline-size:100dvi;block-size:100dvb}:host dialog .dso-dialog{display:flex;flex-direction:column;inline-size:100%;block-size:100%}:host dialog .dso-dialog>dso-scrollable{flex-grow:1;max-block-size:unset}:host dialog .dso-footer{flex-shrink:0}}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}button{-webkit-appearance:button;color:inherit;cursor:pointer;font:inherit;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;overflow:visible;text-transform:none}button[disabled]{cursor:default}button::-moz-focus-inner{border:0;padding:0}.dso-modal{overflow:visible;padding:0;border:0}.dso-modal::backdrop{background-color:rgba(255, 255, 255, 0.8)}.dso-modal .dso-dialog{inline-size:640px;background-color:#fff;opacity:1;box-shadow:0 8px 24px 0 rgba(25, 25, 25, 0.4);animation:200ms ease-out 0s 1 ModalFadeIn}.dso-modal .dso-header{position:relative;padding:16px;border-block-end:1px solid #ccc}.dso-modal .dso-header h2{max-inline-size:calc(100% - 24px);margin:0;color:#275937}.dso-modal .dso-header .dso-close{position:absolute;inset-block-start:16px;inset-inline-end:13px;block-size:32px;inline-size:32px;padding:0;background-color:transparent;border:0;text-align:center}.dso-modal>.dso-dialog>.dso-body p{margin-block:0 var(--_dt-rich-content-margin-block, 16px);margin-inline:0}.dso-modal>.dso-dialog>.dso-body ul,.dso-modal>.dso-dialog>.dso-body ol{margin-block-end:16px}.dso-modal>.dso-dialog>.dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),.dso-modal>.dso-dialog>.dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list){padding-inline-start:24px}.dso-modal>.dso-dialog>.dso-body ul ul,.dso-modal>.dso-dialog>.dso-body ul ol,.dso-modal>.dso-dialog>.dso-body ol ul,.dso-modal>.dso-dialog>.dso-body ol ol{margin-block-end:0}.dso-modal>.dso-dialog>.dso-body pre{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>.dso-body blockquote{padding-block:16px;padding-inline:24px}.dso-modal>.dso-dialog>.dso-body dso-highlight-box,.dso-modal>.dso-dialog>.dso-body .dso-highlight-box{margin-block-end:24px}.dso-modal>.dso-dialog>.dso-body img{block-size:auto;max-inline-size:100%}.dso-modal>.dso-dialog>.dso-body{block-size:calc(100% - 96px - 1.5rem);max-block-size:calc(70vh - 144px - 1.5em);min-block-size:1.5rem;overflow-x:auto;padding:32px}.dso-modal>.dso-dialog>dso-scrollable{block-size:calc(100% - 96px - 1.5rem);max-block-size:calc(70vh - 144px - 1.5em);min-block-size:6.5rem}.dso-modal>.dso-dialog>dso-scrollable .dso-body p{margin-block:0 var(--_dt-rich-content-margin-block, 16px);margin-inline:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol{margin-block-end:16px}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),.dso-modal>.dso-dialog>dso-scrollable .dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list){padding-inline-start:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ul ol,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol ol{margin-block-end:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body pre{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body blockquote{padding-block:16px;padding-inline:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body dso-highlight-box,.dso-modal>.dso-dialog>dso-scrollable .dso-body .dso-highlight-box{margin-block-end:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body img{block-size:auto;max-inline-size:100%}.dso-modal>.dso-dialog>dso-scrollable .dso-body{padding:32px}.dso-modal .dso-body:focus-visible{outline:none}@media screen and (max-width: 767px){.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}.dso-modal .dso-footer button{inline-size:100%;text-align:center}.dso-modal .dso-footer button+button{margin-block-start:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span{float:none}}.dso-modal .dso-footer{min-block-size:80px;padding-block:16px;padding-inline:32px;text-align:end}@media screen and (min-width: 768px){.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary{margin-inline-start:16px}.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}}@media screen and (max-width: 767px){.dso-modal .dso-dialog{max-inline-size:100%;margin-block-start:0}.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}.dso-modal .dso-footer button{inline-size:100%;text-align:center}.dso-modal .dso-footer button+button{margin-block-start:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span{float:none}}@media screen and (max-height: 380px){.dso-modal .dso-dialog{min-block-size:216px;margin-block-start:8px;margin-block-end:8px}.dso-modal .dso-header{padding-block:8px;padding-inline:16px}.dso-modal .dso-header .dso-close{inset-block-start:8px}.dso-modal .dso-body{padding-block:16px;padding-inline:24px}.dso-modal .dso-footer{min-block-size:auto;overflow:auto;padding-block:8px;padding-inline:32px}}.dso-modal .dso-header dso-icon-button{position:absolute;inset-block-start:22px;inset-inline-end:17px}";const n=class{constructor(s){o(this,s);this.dsoClose=d(this,"dsoClose",7);this.ariaId=e();this.dialogRole="dialog";this.returnFocus=undefined;this.closable=false;this.text=a((()=>this.host),t);this.blockEscapeKey=o=>{if(o.key==="Escape"){o.preventDefault();if(this.closable){this.dsoClose.emit({originalEvent:o})}}}}get hasFooter(){return this.host.querySelector("[slot='footer']")!==null}componentDidLoad(){var o;if((o=this.htmlDialogElement)===null||o===void 0?void 0:o.isConnected){const o=i();if(o instanceof HTMLElement){this.returnFocusElement=o}this.htmlDialogElement.showModal()}}disconnectedCallback(){var o,d,s;(o=this.htmlDialogElement)===null||o===void 0?void 0:o.close();if(this.returnFocus===false){return}(s=(d=this.returnFocus)!==null&&d!==void 0?d:this.returnFocusElement)===null||s===void 0?void 0:s.focus()}handleDialogClick(o){if(!this.closable){return}if(o.target===this.htmlDialogElement){this.dsoClose.emit({originalEvent:o})}}render(){var o;return s("dialog",{key:"0a59daede2da8cea1862697b21a2c0cefe2ad2ba",class:"dso-modal",role:(o=this.dialogRole)!==null&&o!==void 0?o:undefined,"aria-modal":"true","aria-labelledby":this.ariaId,ref:o=>this.htmlDialogElement=o,onClick:o=>this.handleDialogClick(o),onKeyDown:o=>this.blockEscapeKey(o)},s("div",{key:"1aa3945eefc77e466cf5f5a8176441f3341227c9",class:"dso-dialog",role:"document"},this.modalTitle?s("div",{class:"dso-header"},s("h2",{id:this.ariaId},this.modalTitle),this.closable&&s("dso-icon-button",{id:"close-modal",icon:"times",variant:"tertiary",label:this.text("close"),onDsoClick:o=>this.dsoClose.emit({originalEvent:o})})):s("span",{class:"sr-only",id:this.ariaId},this.text("dialog")),s("dso-scrollable",{key:"8b4f73119c03e79c411cf2be522a22347d5734ba"},s("div",{key:"eaf1dd3795fd7f29f784b19028a29f4adef739b1",class:"dso-body",tabIndex:0},s("slot",{key:"6941bcfc9c5c38fbc1b4a7e54f5f6abf9b83938c",name:"body"}))),this.hasFooter&&s("div",{key:"f1367f0059cde476a93126459a97e79be952ae4e",class:"dso-footer"},s("slot",{key:"0ac156c12718075bebb54010cc360c118faa7bfd",name:"footer"}))))}get host(){return l(this)}};n.style=r;export{n as dso_modal};
+//# sourceMappingURL=p-7229ccdf.entry.js.map

package/dist/dso-toolkit/p-7229ccdf.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["translations","en","close","dialog","nl","modalCss","Modal","constructor","hostRef","this","ariaId","v4","dialogRole","returnFocus","undefined","closable","text","i18n","host","blockEscapeKey","e","key","preventDefault","dsoClose","emit","originalEvent","hasFooter","querySelector","componentDidLoad","_a","htmlDialogElement","isConnected","activeElement","getActiveElement","HTMLElement","returnFocusElement","showModal","disconnectedCallback","_c","_b","focus","handleDialogClick","target","render","h","class","role","ref","element","onClick","onKeyDown","modalTitle","id","icon","variant","label","onDsoClick","tabIndex","name"],"sources":["src/components/modal/modal.i18n.ts","src/components/modal/modal.scss?tag=dso-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"sourcesContent":["import { Resource } from \"../../utils/i18n\";\r\n\r\nexport const translations: Resource = {\r\n  en: {\r\n    \"dso-modal\": {\r\n      close: \"Close\",\r\n      dialog: \"Dialog\",\r\n    },\r\n  },\r\n  nl: {\r\n    \"dso-modal\": {\r\n      close: \"Sluiten\",\r\n      dialog: \"Dialoog\",\r\n    },\r\n  },\r\n};\r\n","@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/button\";\r\n@use \"~dso-toolkit/src/components/modal\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: block;\r\n}\r\n\r\n// fullscreen option\r\n:host([fullscreen]) dialog {\r\n  @include modal.fullscreen();\r\n}\r\n\r\n// Go to fullscreen on =< 480px viewport\r\n@media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n  :host dialog {\r\n    @include modal.fullscreen();\r\n  }\r\n}\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\nbutton {\r\n  @include button.element();\r\n}\r\n\r\n.dso-modal {\r\n  @include modal.root();\r\n\r\n  .dso-header {\r\n    dso-icon-button {\r\n      position: absolute;\r\n      inset-block-start: 22px;\r\n      inset-inline-end: 17px;\r\n    }\r\n  }\r\n}\r\n","import { Component, ComponentInterface, Element, Event, EventEmitter, Prop, State, h } from \"@stencil/core\";\r\nimport { v4 } from \"uuid\";\r\n\r\nimport { getActiveElement } from \"../../utils/get-active-element\";\r\nimport { i18n } from \"../../utils/i18n\";\r\n\r\nimport { translations } from \"./modal.i18n\";\r\nimport { ModalCloseEvent } from \"./modal.interfaces\";\r\n\r\n@Component({\r\n  tag: \"dso-modal\",\r\n  styleUrl: \"modal.scss\",\r\n  shadow: true,\r\n})\r\nexport class Modal implements ComponentInterface {\r\n  private htmlDialogElement?: HTMLDialogElement;\r\n\r\n  @Element()\r\n  host!: HTMLDsoModalElement;\r\n\r\n  @State()\r\n  ariaId = v4();\r\n\r\n  /**\r\n   * when set the modal will be shown in fullscreen.\r\n   */\r\n  @Prop({ reflect: true })\r\n  fullscreen?: boolean;\r\n\r\n  /**\r\n   * The title of the Modal.\r\n   */\r\n  @Prop()\r\n  modalTitle?: string;\r\n\r\n  /**\r\n   * the role for the modal `dialog` | `alert` | `alertdialog`.\r\n   */\r\n  @Prop()\r\n  dialogRole: string | null = \"dialog\";\r\n\r\n  /**\r\n   * The element to return focus to after the modal is closed.\r\n   *\r\n   * * `undefined` will return focus to the previously focused element (default).\r\n   * * `false` will not return focus to any element.\r\n   * * or, provide your own `HTMLElement` that will receive focus upon closing.\r\n   */\r\n  @Prop()\r\n  returnFocus: false | HTMLElement | undefined = undefined;\r\n\r\n  /**\r\n   * when `false` the close button in the header will not be rendered.\r\n   *\r\n   * Needs `modalTitle` to be set.\r\n   */\r\n  @Prop()\r\n  closable = false;\r\n\r\n  private returnFocusElement: HTMLElement | undefined;\r\n\r\n  /**\r\n   * Emitted when the user:\r\n   * - clicks the close button\r\n   * - dismisses the Modal with the Escape button\r\n   * - clicks or taps outside the Modal\r\n   */\r\n  @Event()\r\n  dsoClose!: EventEmitter<ModalCloseEvent>;\r\n\r\n  get hasFooter() {\r\n    return this.host.querySelector(\"[slot='footer']\") !== null;\r\n  }\r\n\r\n  private text = i18n(() => this.host, translations);\r\n\r\n  componentDidLoad(): void {\r\n    if (this.htmlDialogElement?.isConnected) {\r\n      const activeElement = getActiveElement();\r\n      if (activeElement instanceof HTMLElement) {\r\n        this.returnFocusElement = activeElement;\r\n      }\r\n\r\n      this.htmlDialogElement.showModal();\r\n    }\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.htmlDialogElement?.close();\r\n\r\n    if (this.returnFocus === false) {\r\n      return;\r\n    }\r\n\r\n    (this.returnFocus ?? this.returnFocusElement)?.focus();\r\n  }\r\n\r\n  private handleDialogClick(e: MouseEvent) {\r\n    if (!this.closable) {\r\n      return;\r\n    }\r\n\r\n    if (e.target === this.htmlDialogElement) {\r\n      this.dsoClose.emit({ originalEvent: e });\r\n    }\r\n  }\r\n\r\n  private blockEscapeKey = (e: KeyboardEvent) => {\r\n    if (e.key === \"Escape\") {\r\n      e.preventDefault();\r\n\r\n      if (this.closable) {\r\n        this.dsoClose.emit({ originalEvent: e });\r\n      }\r\n    }\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <dialog\r\n        class=\"dso-modal\"\r\n        role={this.dialogRole ?? undefined}\r\n        aria-modal=\"true\"\r\n        aria-labelledby={this.ariaId}\r\n        ref={(element) => (this.htmlDialogElement = element)}\r\n        onClick={(e) => this.handleDialogClick(e)}\r\n        onKeyDown={(e) => this.blockEscapeKey(e)}\r\n      >\r\n        <div class=\"dso-dialog\" role=\"document\">\r\n          {this.modalTitle ? (\r\n            <div class=\"dso-header\">\r\n              <h2 id={this.ariaId}>{this.modalTitle}</h2>\r\n              {this.closable && (\r\n                <dso-icon-button\r\n                  id=\"close-modal\"\r\n                  icon=\"times\"\r\n                  variant=\"tertiary\"\r\n                  label={this.text(\"close\")}\r\n                  onDsoClick={(e) => this.dsoClose.emit({ originalEvent: e })}\r\n                />\r\n              )}\r\n            </div>\r\n          ) : (\r\n            <span class=\"sr-only\" id={this.ariaId}>\r\n              {this.text(\"dialog\")}\r\n            </span>\r\n          )}\r\n\r\n          <dso-scrollable>\r\n            <div class=\"dso-body\" tabIndex={0}>\r\n              <slot name=\"body\" />\r\n            </div>\r\n          </dso-scrollable>\r\n\r\n          {this.hasFooter && (\r\n            <div class=\"dso-footer\">\r\n              <slot name=\"footer\" />\r\n            </div>\r\n          )}\r\n        </div>\r\n      </dialog>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"qKAEO,MAAMA,EAAyB,CACpCC,GAAI,CACF,YAAa,CACXC,MAAO,QACPC,OAAQ,WAGZC,GAAI,CACF,YAAa,CACXF,MAAO,UACPC,OAAQ,aCZd,MAAME,EAAW,8pN,MCcJC,EAAK,MALlB,WAAAC,CAAAC,G,6CAYEC,KAAMC,OAAGC,IAkBTF,KAAUG,WAAkB,SAU5BH,KAAWI,YAAoCC,UAQ/CL,KAAQM,SAAG,MAiBHN,KAAAO,KAAOC,GAAK,IAAMR,KAAKS,MAAMlB,GAiC7BS,KAAAU,eAAkBC,IACxB,GAAIA,EAAEC,MAAQ,SAAU,CACtBD,EAAEE,iBAEF,GAAIb,KAAKM,SAAU,CACjBN,KAAKc,SAASC,KAAK,CAAEC,cAAeL,G,GAmD3C,CA7FC,aAAIM,GACF,OAAOjB,KAAKS,KAAKS,cAAc,qBAAuB,I,CAKxD,gBAAAC,G,MACE,IAAIC,EAAApB,KAAKqB,qBAAmB,MAAAD,SAAA,SAAAA,EAAAE,YAAa,CACvC,MAAMC,EAAgBC,IACtB,GAAID,aAAyBE,YAAa,CACxCzB,KAAK0B,mBAAqBH,C,CAG5BvB,KAAKqB,kBAAkBM,W,EAI3B,oBAAAC,G,WACER,EAAApB,KAAKqB,qBAAmB,MAAAD,SAAA,SAAAA,EAAA3B,QAExB,GAAIO,KAAKI,cAAgB,MAAO,CAC9B,M,EAGFyB,GAACC,EAAA9B,KAAKI,eAAW,MAAA0B,SAAA,EAAAA,EAAI9B,KAAK0B,sBAAqB,MAAAG,SAAA,SAAAA,EAAAE,O,CAGzC,iBAAAC,CAAkBrB,GACxB,IAAKX,KAAKM,SAAU,CAClB,M,CAGF,GAAIK,EAAEsB,SAAWjC,KAAKqB,kBAAmB,CACvCrB,KAAKc,SAASC,KAAK,CAAEC,cAAeL,G,EAcxC,MAAAuB,G,MACE,OACEC,EAAA,UAAAvB,IAAA,2CACEwB,MAAM,YACNC,MAAMjB,EAAApB,KAAKG,cAAc,MAAAiB,SAAA,EAAAA,EAAAf,UACd,oBACM,kBAAAL,KAAKC,OACtBqC,IAAMC,GAAavC,KAAKqB,kBAAoBkB,EAC5CC,QAAU7B,GAAMX,KAAKgC,kBAAkBrB,GACvC8B,UAAY9B,GAAMX,KAAKU,eAAeC,IAEtCwB,EAAA,OAAAvB,IAAA,2CAAKwB,MAAM,aAAaC,KAAK,YAC1BrC,KAAK0C,WACJP,EAAA,OAAKC,MAAM,cACTD,EAAI,MAAAQ,GAAI3C,KAAKC,QAASD,KAAK0C,YAC1B1C,KAAKM,UACJ6B,EAAA,mBACEQ,GAAG,cACHC,KAAK,QACLC,QAAQ,WACRC,MAAO9C,KAAKO,KAAK,SACjBwC,WAAapC,GAAMX,KAAKc,SAASC,KAAK,CAAEC,cAAeL,OAK7DwB,EAAA,QAAMC,MAAM,UAAUO,GAAI3C,KAAKC,QAC5BD,KAAKO,KAAK,WAIf4B,EAAA,kBAAAvB,IAAA,4CACEuB,EAAA,OAAAvB,IAAA,2CAAKwB,MAAM,WAAWY,SAAU,GAC9Bb,EAAA,QAAAvB,IAAA,2CAAMqC,KAAK,WAIdjD,KAAKiB,WACJkB,EAAK,OAAAvB,IAAA,2CAAAwB,MAAM,cACTD,EAAM,QAAAvB,IAAA,2CAAAqC,KAAK,a","ignoreList":[]}

package/dist/dso-toolkit/{p-f5f8682c.entry.js → p-734acd5e.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as s,h as i,g as a}from"./p-DxWmN7gh.js";import{i as o}from"./p-B_kXuEcW.js";import{v as d}from"./p-BF0_OXTe.js";const r={en:{"dso-map-base-layers":{background:"Background"}},nl:{"dso-map-base-layers":{background:"Achtergrond"}}};const n=":host{display:block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}fieldset{border:0;margin:0;min-inline-size:0;padding:0}fieldset .control-label{display:inline-block;font-weight:bold;margin-block-end:8px;max-inline-size:100%;text-align:start}p[slot=info]{margin:0}";const t=class{constructor(i){e(this,i);this.dsoBaseLayerChange=s(this,"dsoBaseLayerChange",7);this.selectableRefs={};this.group=d();this.text=o((()=>this.host),r)}baseLayerChangeHandler(e){this.dsoBaseLayerChange.emit({activeBaseLayer:e})}componentDidRender(){this.baseLayers.filter((e=>{var s,i;return!e.disabled&&((i=(s=this.previousBaselayers)===null||s===void 0?void 0:s.find((s=>s.id===e.id)))===null||i===void 0?void 0:i.disabled)===true})).forEach((e=>{var s;(s=this.selectableRefs[e.id])===null||s===void 0?void 0:s.toggleInfo(false)}));this.previousBaselayers=this.baseLayers}render(){for(const e in this.selectableRefs){delete this.selectableRefs[e]}return i("fieldset",{key:"f905ab8e7758f4ee8eadd3687fc18445770bf611",class:"form-group dso-radios"},i("legend",{key:"d498d24d45289126c215c7efb691d0ea540f309a",class:"sr-only"},"Achtergrond"),i("div",{key:"77a480daed34c328881671403de969757f35c4c8",class:"dso-label-container"},i("span",{key:"00d32dd55f7061bb15c4fb03f2e7e8381068aa61",class:"control-label","aria-hidden":"true"},this.text("background"))),i("div",{key:"6793671b625b99be9dfc32d07c64947f41e0f046",class:"dso-field-container"},this.baseLayers.map((e=>i("dso-selectable",{key:e.id,type:"radio",value:e.name,checked:e.checked,disabled:e.disabled,name:this.group,ref:s=>s&&(this.selectableRefs[e.id]=s),onDsoChange:()=>this.baseLayerChangeHandler(e)},e.name,e.info?i("p",{slot:"info"},e.info):null)))))}get host(){return a(this)}};t.style=n;export{t as dso_map_base_layers};
-//# sourceMappingURL=p-f5f8682c.entry.js.map
+import{r as e,c as s,h as a,g as i}from"./p-DxWmN7gh.js";import{i as o}from"./p-B_kXuEcW.js";import{v as d}from"./p-BF0_OXTe.js";const r={en:{"dso-map-base-layers":{background:"Background"}},nl:{"dso-map-base-layers":{background:"Achtergrond"}}};const n=":host{display:block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}fieldset{border:0;margin:0;min-inline-size:0;padding:0}fieldset .control-label{display:inline-block;font-weight:bold;margin-block-end:8px;max-inline-size:100%;text-align:start}p[slot=info]{margin:0}";const t=class{constructor(a){e(this,a);this.dsoBaseLayerChange=s(this,"dsoBaseLayerChange",7);this.selectableRefs={};this.group=d();this.text=o((()=>this.host),r)}baseLayerChangeHandler(e){this.dsoBaseLayerChange.emit({activeBaseLayer:e})}componentDidRender(){this.baseLayers.filter((e=>{var s,a;return!e.disabled&&((a=(s=this.previousBaselayers)===null||s===void 0?void 0:s.find((s=>s.id===e.id)))===null||a===void 0?void 0:a.disabled)===true})).forEach((e=>{var s;(s=this.selectableRefs[e.id])===null||s===void 0?void 0:s.toggleInfo(false)}));this.previousBaselayers=this.baseLayers}render(){for(const e in this.selectableRefs){delete this.selectableRefs[e]}return a("fieldset",{key:"d351f02282a8206a59c25f1d7e484996d5537c9f",class:"form-group dso-radios"},a("legend",{key:"b736d3b6a64da13e71a4e4fd40753ce5c2f9de15",class:"sr-only"},"Achtergrond"),a("div",{key:"60065fac46d1cc18953e7fd82afa4b538e23158c",class:"dso-label-container"},a("span",{key:"a77189ede3009e2077b636219d80de3a41b84f9e",class:"control-label","aria-hidden":"true"},this.text("background"))),a("div",{key:"85efd3afe696404da277b7616b17d3d9fcb92adf",class:"dso-field-container"},this.baseLayers.map((e=>a("dso-selectable",{key:e.id,type:"radio",value:e.name,checked:e.checked,disabled:e.disabled,name:this.group,ref:s=>s&&(this.selectableRefs[e.id]=s),onDsoChange:()=>this.baseLayerChangeHandler(e)},e.name,e.info?a("p",{slot:"info"},e.info):null)))))}get host(){return i(this)}};t.style=n;export{t as dso_map_base_layers};
+//# sourceMappingURL=p-734acd5e.entry.js.map

package/dist/dso-toolkit/{p-070eb5c1.entry.js → p-79616f47.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,c as t,h as s,g as e}from"./p-DxWmN7gh.js";import{c as i}from"./p-ChV9xqsO.js";import{d as r}from"./p-DDU8nTJS.js";import"./p-BFTU3MAI.js";const n=':host{display:block;block-size:100%;overflow-y:hidden}*,*::after,*::before{box-sizing:border-box}.dso-shadow-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;position:relative}.dso-shadow-container .dso-scroll-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;overflow-y:auto}.dso-shadow-container .dso-scroll-container::before,.dso-shadow-container .dso-scroll-container::after{background-repeat:no-repeat;background-size:100% 24px;content:"";display:block;block-size:24px;inset-inline-start:0;opacity:0;overflow:visible;position:absolute;transition:opacity 150ms ease-in-out;inline-size:100%;pointer-events:none;z-index:1}.dso-shadow-container .dso-scroll-container::before{background-image:linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-start:0}.dso-shadow-container .dso-scroll-container::after{background-image:linear-gradient(to bottom, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-end:0}.dso-shadow-container .dso-scroll-container.dso-scroll-bottom::before{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-top::after{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-middle::before,.dso-shadow-container .dso-scroll-container.dso-scroll-middle::after{opacity:1}';const a=new ResizeObserver(r((o=>o.forEach((o=>{var t;return(t=c(o))===null||t===void 0?void 0:t._setScrollState()}))),50));function c({target:o}){if(o.parentNode instanceof ShadowRoot&&l(o.parentNode.host)){return o.parentNode.host}if(o.parentElement&&l(o.parentElement)){return o.parentElement}return undefined}function l(o){return o.tagName==="DSO-SCROLLABLE"}const d=class{constructor(s){o(this,s);this.dsoScrollEnd=t(this,"dsoScrollEnd",7);this.mutationObserver=new MutationObserver((o=>o.forEach((({target:o})=>{var t;const s=(t=o.parentElement)===null||t===void 0?void 0:t.closest("dso-scrollable");if(s!==this.host){return}this._setScrollState()}))));this.scrollPosition="noScroll"}async _setScrollState(){if(!this.host.isConnected){return}const o=this.getScrollPosition();if(this.scrollPosition!==o){this.scrollPosition=o;if(this.scrollPosition==="top"||this.scrollPosition==="bottom"){this.dsoScrollEnd.emit({scrollEnd:this.scrollPosition})}}}get slottedElements(){return Array.from(this.host.children)}getScrollPosition(){if(!this.scrollContainerDiv){return"noScroll"}const{scrollHeight:o,clientHeight:t,scrollTop:s}=this.scrollContainerDiv;if(o<=t){return"noScroll"}if(s===0){return"top"}if(o-s-t<1){return"bottom"}if(s>0){return"middle"}return"noScroll"}componentDidLoad(){this.mutationObserver.observe(this.host,{characterData:true,attributes:false,childList:false,subtree:true});if(this.shadowContainerDiv instanceof HTMLDivElement){a.observe(this.shadowContainerDiv)}this.slottedElements.forEach((o=>a.observe(o)))}disconnectedCallback(){if(this.shadowContainerDiv instanceof HTMLDivElement){a.unobserve(this.shadowContainerDiv)}this.mutationObserver.disconnect();this.slottedElements.forEach((o=>a.unobserve(o)))}render(){return s("div",{key:"7661be0bc59f860cbe6934c0469d027f26eb9153",ref:o=>this.shadowContainerDiv=o,class:"dso-shadow-container"},s("div",{key:"bd738b961218461c8b7f2845ee1ba04b526e62d3",ref:o=>this.scrollContainerDiv=o,class:i("dso-scroll-container",{[`dso-scroll-${this.scrollPosition}`]:this.scrollPosition!=="noScroll"}),onScroll:()=>this._setScrollState()},s("slot",{key:"c0fca19598b5adb1d1d8ae7fab6177ae794b07b4"})))}get host(){return e(this)}};d.style=n;export{d as dso_scrollable};
-//# sourceMappingURL=p-070eb5c1.entry.js.map
+import{r as o,c as t,h as s,g as e}from"./p-DxWmN7gh.js";import{c as i}from"./p-ChV9xqsO.js";import{d as r}from"./p-DDU8nTJS.js";import"./p-BFTU3MAI.js";const n=':host{display:block;block-size:100%;overflow-y:hidden}*,*::after,*::before{box-sizing:border-box}.dso-shadow-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;position:relative}.dso-shadow-container .dso-scroll-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;overflow-y:auto}.dso-shadow-container .dso-scroll-container::before,.dso-shadow-container .dso-scroll-container::after{background-repeat:no-repeat;background-size:100% 24px;content:"";display:block;block-size:24px;inset-inline-start:0;opacity:0;overflow:visible;position:absolute;transition:opacity 150ms ease-in-out;inline-size:100%;pointer-events:none;z-index:1}.dso-shadow-container .dso-scroll-container::before{background-image:linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-start:0}.dso-shadow-container .dso-scroll-container::after{background-image:linear-gradient(to bottom, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-end:0}.dso-shadow-container .dso-scroll-container.dso-scroll-bottom::before{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-top::after{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-middle::before,.dso-shadow-container .dso-scroll-container.dso-scroll-middle::after{opacity:1}';const a=new ResizeObserver(r((o=>o.forEach((o=>{var t;return(t=l(o))===null||t===void 0?void 0:t._setScrollState()}))),50));function l({target:o}){if(o.parentNode instanceof ShadowRoot&&c(o.parentNode.host)){return o.parentNode.host}if(o.parentElement&&c(o.parentElement)){return o.parentElement}return undefined}function c(o){return o.tagName==="DSO-SCROLLABLE"}const d=class{constructor(s){o(this,s);this.dsoScrollEnd=t(this,"dsoScrollEnd",7);this.mutationObserver=new MutationObserver((o=>o.forEach((({target:o})=>{var t;const s=(t=o.parentElement)===null||t===void 0?void 0:t.closest("dso-scrollable");if(s!==this.host){return}this._setScrollState()}))));this.scrollPosition="noScroll"}async _setScrollState(){if(!this.host.isConnected){return}const o=this.getScrollPosition();if(this.scrollPosition!==o){this.scrollPosition=o;if(this.scrollPosition==="top"||this.scrollPosition==="bottom"){this.dsoScrollEnd.emit({scrollEnd:this.scrollPosition})}}}get slottedElements(){return Array.from(this.host.children)}getScrollPosition(){if(!this.scrollContainerDiv){return"noScroll"}const{scrollHeight:o,clientHeight:t,scrollTop:s}=this.scrollContainerDiv;if(o<=t){return"noScroll"}if(s===0){return"top"}if(o-s-t<1){return"bottom"}if(s>0){return"middle"}return"noScroll"}componentDidLoad(){this.mutationObserver.observe(this.host,{characterData:true,attributes:false,childList:false,subtree:true});if(this.shadowContainerDiv instanceof HTMLDivElement){a.observe(this.shadowContainerDiv)}this.slottedElements.forEach((o=>a.observe(o)))}disconnectedCallback(){if(this.shadowContainerDiv instanceof HTMLDivElement){a.unobserve(this.shadowContainerDiv)}this.mutationObserver.disconnect();this.slottedElements.forEach((o=>a.unobserve(o)))}render(){return s("div",{key:"70329cb775aa7b06be2e6fcb1e28670f735c2467",ref:o=>this.shadowContainerDiv=o,class:"dso-shadow-container"},s("div",{key:"ff50504d84fad62027ea67742b64ddae2be63f47",ref:o=>this.scrollContainerDiv=o,class:i("dso-scroll-container",{[`dso-scroll-${this.scrollPosition}`]:this.scrollPosition!=="noScroll"}),onScroll:()=>this._setScrollState()},s("slot",{key:"ab03fe8a94df6fd40037376a054c474d75197944"})))}get host(){return e(this)}};d.style=n;export{d as dso_scrollable};
+//# sourceMappingURL=p-79616f47.entry.js.map

package/dist/dso-toolkit/{p-b96ae76d.entry.js → p-798a1b91.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,c as i,H as s,g as a}from"./p-DxWmN7gh.js";import{c as n}from"./p-ChV9xqsO.js";const o=":host{display:inline-block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size: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}";const r=class{constructor(t){e(this,t)}render(){return t("span",{key:"7bc1608fbe166e44971fe220ab4d6d5ee80aa6cd",class:"dso-attachments"},this.count," ",t("span",{key:"6a1ad89f68cff3c54069c0631fe823149fd57f06",class:"sr-only"},"bijlage",this.count!==1?"n":""),t("dso-icon",{key:"8f45aec5a772805bace01ae3b79e25b52e18a815",icon:"paperclip"}))}};r.style=o;const c=":host([enable-animation]){display:grid;grid-template-rows:0fr;overflow:hidden;opacity:0;transition:grid-template-rows 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}:host([enable-animation]:not([open=true])) .slot-container{min-block-size:0;visibility:hidden;transition:visibility 260ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}:host(:not([enable-animation])),:host([enable-animation=false]){display:none}:host([open][enable-animation]:not([open=false])){grid-template-rows:1fr;opacity:1}:host([open][enable-animation]:not([open=false])) .slot-container{visibility:visible}:host([open]:not([enable-animation]):not([open=false])),:host([open][enable-animation=false]:not([open=false])){display:block}*,*::after,*::before{box-sizing:border-box}";const d=class{constructor(t){e(this,t);this.dsoExpandableAnimationStart=i(this,"dsoExpandableAnimationStart",3);this.dsoExpandableAnimationEnd=i(this,"dsoExpandableAnimationEnd",3);this.enableAnimation=false;this.isClosed=true}toggleOpen(){if(!this.enableAnimation){this.isClosed=!this.open}}transitionstartHandler(e){e.stopPropagation();if(e.propertyName==="grid-template-rows"){this.dsoExpandableAnimationStart.emit({currentOpen:!!this.open,nextOpen:!this.open})}}transitionendHandler(e){e.stopPropagation();if(e.propertyName==="grid-template-rows"){this.isClosed=!this.open;this.dsoExpandableAnimationEnd.emit({bodyHeight:this.bodyHeight,open:!!this.open})}}render(){return t(s,{key:"0ac682bd5e9d129cdf4328de0a4284ccad034b65","aria-hidden":this.open?"false":"true",class:n({"dso-animate-ready":this.enableAnimation,"dso-hide":this.isClosed})},t("div",{key:"a231cdd101a5be780dc5da7c08138e1f3e2290e5",class:"slot-container"},t("slot",{key:"ab6aee1ae95ca0767352ccfce24f240b6a05d8dd"})))}get host(){return a(this)}static get watchers(){return{open:["toggleOpen"]}}};d.style=c;export{r as dso_attachments_counter,d as dso_expandable};
-//# sourceMappingURL=p-b96ae76d.entry.js.map
+import{r as e,h as t,c as i,H as s,g as a}from"./p-DxWmN7gh.js";import{c as n}from"./p-ChV9xqsO.js";const o=":host{display:inline-block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size: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}";const r=class{constructor(t){e(this,t)}render(){return t("span",{key:"b11de72fcb7669716ed27ed4bfb65ee395b6c4bd",class:"dso-attachments"},this.count," ",t("span",{key:"2b9017488e1a4d57983863b38f2bcf928d984a21",class:"sr-only"},"bijlage",this.count!==1?"n":""),t("dso-icon",{key:"cf3647f6e9d3ad22d614323aae84d8eaa196b5df",icon:"paperclip"}))}};r.style=o;const d=":host([enable-animation]){display:grid;grid-template-rows:0fr;overflow:hidden;opacity:0;transition:grid-template-rows 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}:host([enable-animation]:not([open=true])) .slot-container{min-block-size:0;visibility:hidden;transition:visibility 260ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}:host(:not([enable-animation])),:host([enable-animation=false]){display:none}:host([open][enable-animation]:not([open=false])){grid-template-rows:1fr;opacity:1}:host([open][enable-animation]:not([open=false])) .slot-container{visibility:visible}:host([open]:not([enable-animation]):not([open=false])),:host([open][enable-animation=false]:not([open=false])){display:block}*,*::after,*::before{box-sizing:border-box}";const c=class{constructor(t){e(this,t);this.dsoExpandableAnimationStart=i(this,"dsoExpandableAnimationStart",3);this.dsoExpandableAnimationEnd=i(this,"dsoExpandableAnimationEnd",3);this.enableAnimation=false;this.isClosed=true}toggleOpen(){if(!this.enableAnimation){this.isClosed=!this.open}}transitionstartHandler(e){e.stopPropagation();if(e.propertyName==="grid-template-rows"){this.dsoExpandableAnimationStart.emit({currentOpen:!!this.open,nextOpen:!this.open})}}transitionendHandler(e){e.stopPropagation();if(e.propertyName==="grid-template-rows"){this.isClosed=!this.open;this.dsoExpandableAnimationEnd.emit({bodyHeight:this.bodyHeight,open:!!this.open})}}render(){return t(s,{key:"0ac682bd5e9d129cdf4328de0a4284ccad034b65","aria-hidden":this.open?"false":"true",class:n({"dso-animate-ready":this.enableAnimation,"dso-hide":this.isClosed})},t("div",{key:"a231cdd101a5be780dc5da7c08138e1f3e2290e5",class:"slot-container"},t("slot",{key:"ab6aee1ae95ca0767352ccfce24f240b6a05d8dd"})))}get host(){return a(this)}static get watchers(){return{open:["toggleOpen"]}}};c.style=d;export{r as dso_attachments_counter,c as dso_expandable};
+//# sourceMappingURL=p-798a1b91.entry.js.map

package/dist/dso-toolkit/{p-c6413a5c.entry.js → p-7c9c4915.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,F as a}from"./p-DxWmN7gh.js";const d=":host{display:block;padding:16px;border:1px solid #ccc;border-radius:4px}*,*::after,*::before{box-sizing:border-box}::slotted(dl[slot=progress]),::slotted(dl[slot=status]){--_dt-dl-margin-block-end:0;--_dt-dl-before-display:none;--_dt-dl-dt-font-weight:normal;--_dt-dl-dd-margin-block-start:0;--_dt-dl-dd-margin-inline-start:units.$u1;--_dt-dl-dd-padding-inline-start:0;--_dt-dl-dt-inline-size:auto;--_dt-dl-dd-last-margin-block-end:0;--_dt-mark-bg-color:none;--_dt-mark-padding-block:0;--_dt-mark-color:inherit;--_dt-mark-font-weight:600;display:flex !important;flex-wrap:wrap;column-gap:16px}::slotted([slot=status]){--_dt-dl-font-size:0.875rem}::slotted([slot=title]){margin-block:0 !important;font-size:1.25rem !important}::slotted([slot=actions]){display:flex}.project-item-header{display:flex;gap:16px;flex-wrap:nowrap;align-items:flex-start;margin-block-end:16px}.project-item-title{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;flex-grow:1}.project-item-actions{display:flex;flex-shrink:0;flex-wrap:nowrap}.project-item-info{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;align-items:flex-end}";const s=class{constructor(t){e(this,t)}render(){return t(a,null,t("div",{key:"3f6f705655b7fbde410073f7aba7eee3a9b4feba",class:"project-item-header"},t("div",{key:"0cb5f89e8b954c92250d962e9c9f1bc5b4119f9b",class:"project-item-title"},t("slot",{key:"28c5ceeeb66296b6a9b8496affbab1281327c1fa",name:"title"}),this.label&&t("dso-label",{key:"24ffac7d385243bc5c036c2c9a73fb0ce8311c0c",status:"error",compact:true},this.label)),t("div",{key:"170cef0ae20cc0448ac7da6d85bb0ae5cab6a1c4",class:"project-item-actions"},t("slot",{key:"8c420d7f28efff7ad57f2f1081f7ec40da781315",name:"actions"}))),t("div",{key:"015ba5e768aec917c3a6b32b3cf042eedb402ae5",class:"project-item-info"},t("div",{key:"be9c29e22475bdfc56e24e9edbf9ce6e757aa07b",class:"project-item-progress"},t("slot",{key:"56303705113e4cc6ed95da93e9bc4de6de017f8e",name:"progress"})),t("div",{key:"25c772dbb4b1b19061dfd9c330abe5e0fafb0072",class:"project-item-status"},t("slot",{key:"5fe845352612008ffa6d690967994a2fc7c980c4",name:"status"}))))}};s.style=d;export{s as dso_project_item};
-//# sourceMappingURL=p-c6413a5c.entry.js.map
+import{r as e,h as t,F as a}from"./p-DxWmN7gh.js";const d=":host{display:block;padding:16px;border:1px solid #ccc;border-radius:4px}*,*::after,*::before{box-sizing:border-box}::slotted(dl[slot=progress]),::slotted(dl[slot=status]){--_dt-dl-margin-block-end:0;--_dt-dl-before-display:none;--_dt-dl-dt-font-weight:normal;--_dt-dl-dd-margin-block-start:0;--_dt-dl-dd-margin-inline-start:units.$u1;--_dt-dl-dd-padding-inline-start:0;--_dt-dl-dt-inline-size:auto;--_dt-dl-dd-last-margin-block-end:0;--_dt-mark-bg-color:none;--_dt-mark-padding-block:0;--_dt-mark-color:inherit;--_dt-mark-font-weight:600;display:flex !important;flex-wrap:wrap;column-gap:16px}::slotted([slot=status]){--_dt-dl-font-size:0.875rem}::slotted([slot=title]){margin-block:0 !important;font-size:1.25rem !important}::slotted([slot=actions]){display:flex}.project-item-header{display:flex;gap:16px;flex-wrap:nowrap;align-items:flex-start;margin-block-end:16px}.project-item-title{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;flex-grow:1}.project-item-actions{display:flex;flex-shrink:0;flex-wrap:nowrap}.project-item-info{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;align-items:flex-end}";const s=class{constructor(t){e(this,t)}render(){return t(a,{key:"9c322e99bb0c79734200f27a2469720413413545"},t("div",{key:"79587c24d9ee9385b0eb9ab32d13b8e464fff378",class:"project-item-header"},t("div",{key:"94997c3b36d9214ea3afd8c6f321c319d3dacf1a",class:"project-item-title"},t("slot",{key:"feaf20c56c765fa56981cb6300cb16c9617a4f40",name:"title"}),this.label&&t("dso-label",{key:"f3adc64db8f1897177e3fb9fc052326685aba79c",status:"error",compact:true},this.label)),t("div",{key:"f8ef593d6b46ba091e4f2a63e118b667579fa35b",class:"project-item-actions"},t("slot",{key:"9346c22768782faadb8e8fab102fd809d3c72f3c",name:"actions"}))),t("div",{key:"bf9e4cfe31d1c3113955002c604803bb3cf43c2b",class:"project-item-info"},t("div",{key:"84d56570fd648edef357ec6d6ec1acfd91155ed4",class:"project-item-progress"},t("slot",{key:"08d2f101cddd41c37c81cf2a17b17b1b307c57a1",name:"progress"})),t("div",{key:"9551bb47c5dafe548437852044e61b6835bde9ab",class:"project-item-status"},t("slot",{key:"591f4a199283729366b064e356a0ebf41cfdbcb7",name:"status"}))))}};s.style=d;export{s as dso_project_item};
+//# sourceMappingURL=p-7c9c4915.entry.js.map

package/dist/dso-toolkit/{p-c6413a5c.entry.js.map → p-7c9c4915.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["projectItemCss","ProjectItem","render","h","Fragment","key","class","name","this","label","status","compact"],"sources":["src/components/project-item/project-item.scss?tag=dso-project-item&encapsulation=shadow","src/components/project-item/project-item.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n\r\n:host {\r\n  display: block;\r\n\r\n  padding: units.$u2;\r\n\r\n  border: 1px solid colors.$grijs-20;\r\n  border-radius: calc(units.$u1 / 2);\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n::slotted(dl[slot=\"progress\"]),\r\n::slotted(dl[slot=\"status\"]) {\r\n  --_dt-dl-margin-block-end: 0;\r\n  --_dt-dl-before-display: none;\r\n  --_dt-dl-dt-font-weight: normal;\r\n  --_dt-dl-dd-margin-block-start: 0;\r\n  --_dt-dl-dd-margin-inline-start: units.$u1;\r\n  --_dt-dl-dd-padding-inline-start: 0;\r\n  --_dt-dl-dt-inline-size: auto;\r\n  --_dt-dl-dd-last-margin-block-end: 0;\r\n\r\n  --_dt-mark-bg-color: none;\r\n  --_dt-mark-padding-block: 0;\r\n  --_dt-mark-color: inherit;\r\n  --_dt-mark-font-weight: 600;\r\n\r\n  display: flex !important;\r\n  flex-wrap: wrap;\r\n  column-gap: units.$u2;\r\n}\r\n\r\n::slotted([slot=\"status\"]) {\r\n  --_dt-dl-font-size: 0.875rem;\r\n}\r\n\r\n::slotted([slot=\"title\"]) {\r\n  margin-block: 0 !important;\r\n  font-size: 1.25rem !important;\r\n}\r\n\r\n::slotted([slot=\"actions\"]) {\r\n  display: flex;\r\n}\r\n\r\n.project-item-header {\r\n  display: flex;\r\n  gap: units.$u2;\r\n  flex-wrap: nowrap;\r\n  align-items: flex-start;\r\n\r\n  margin-block-end: units.$u2;\r\n}\r\n\r\n.project-item-title {\r\n  display: flex;\r\n  gap: units.$u2;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  flex-wrap: wrap;\r\n  flex-grow: 1;\r\n}\r\n\r\n.project-item-actions {\r\n  display: flex;\r\n  flex-shrink: 0;\r\n  flex-wrap: nowrap;\r\n}\r\n\r\n.project-item-info {\r\n  display: flex;\r\n  gap: units.$u2;\r\n  justify-content: space-between;\r\n  flex-wrap: wrap;\r\n  align-items: flex-end;\r\n}\r\n","import { Component, ComponentInterface, Fragment, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-project-item\",\r\n  styleUrl: \"project-item.scss\",\r\n  shadow: true,\r\n})\r\nexport class ProjectItem implements ComponentInterface {\r\n  /**\r\n   * The label of the project item.\r\n   */\r\n  @Prop()\r\n  label?: string;\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <div class=\"project-item-header\">\r\n          <div class=\"project-item-title\">\r\n            <slot name=\"title\" />\r\n            {this.label && (\r\n              <dso-label status=\"error\" compact>\r\n                {this.label}\r\n              </dso-label>\r\n            )}\r\n          </div>\r\n          <div class=\"project-item-actions\">\r\n            <slot name=\"actions\" />\r\n          </div>\r\n        </div>\r\n        <div class=\"project-item-info\">\r\n          <div class=\"project-item-progress\">\r\n            <slot name=\"progress\" />\r\n          </div>\r\n          <div class=\"project-item-status\">\r\n            <slot name=\"status\" />\r\n          </div>\r\n        </div>\r\n      </>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"kDAAA,MAAMA,EAAiB,4oC,MCOVC,EAAW,M,yBAOtB,MAAAC,GACE,OACEC,EAAAC,EAAA,KACED,EAAK,OAAAE,IAAA,2CAAAC,MAAM,uBACTH,EAAK,OAAAE,IAAA,2CAAAC,MAAM,sBACTH,EAAM,QAAAE,IAAA,2CAAAE,KAAK,UACVC,KAAKC,OACJN,EAAA,aAAAE,IAAA,2CAAWK,OAAO,QAAQC,QAAO,MAC9BH,KAAKC,QAIZN,EAAK,OAAAE,IAAA,2CAAAC,MAAM,wBACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,cAGfJ,EAAK,OAAAE,IAAA,2CAAAC,MAAM,qBACTH,EAAK,OAAAE,IAAA,2CAAAC,MAAM,yBACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,cAEbJ,EAAK,OAAAE,IAAA,2CAAAC,MAAM,uBACTH,EAAM,QAAAE,IAAA,2CAAAE,KAAK,a","ignoreList":[]}
+{"version":3,"names":["projectItemCss","ProjectItem","render","h","Fragment","key","class","name","this","label","status","compact"],"sources":["src/components/project-item/project-item.scss?tag=dso-project-item&encapsulation=shadow","src/components/project-item/project-item.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n\r\n:host {\r\n  display: block;\r\n\r\n  padding: units.$u2;\r\n\r\n  border: 1px solid colors.$grijs-20;\r\n  border-radius: calc(units.$u1 / 2);\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n::slotted(dl[slot=\"progress\"]),\r\n::slotted(dl[slot=\"status\"]) {\r\n  --_dt-dl-margin-block-end: 0;\r\n  --_dt-dl-before-display: none;\r\n  --_dt-dl-dt-font-weight: normal;\r\n  --_dt-dl-dd-margin-block-start: 0;\r\n  --_dt-dl-dd-margin-inline-start: units.$u1;\r\n  --_dt-dl-dd-padding-inline-start: 0;\r\n  --_dt-dl-dt-inline-size: auto;\r\n  --_dt-dl-dd-last-margin-block-end: 0;\r\n\r\n  --_dt-mark-bg-color: none;\r\n  --_dt-mark-padding-block: 0;\r\n  --_dt-mark-color: inherit;\r\n  --_dt-mark-font-weight: 600;\r\n\r\n  display: flex !important;\r\n  flex-wrap: wrap;\r\n  column-gap: units.$u2;\r\n}\r\n\r\n::slotted([slot=\"status\"]) {\r\n  --_dt-dl-font-size: 0.875rem;\r\n}\r\n\r\n::slotted([slot=\"title\"]) {\r\n  margin-block: 0 !important;\r\n  font-size: 1.25rem !important;\r\n}\r\n\r\n::slotted([slot=\"actions\"]) {\r\n  display: flex;\r\n}\r\n\r\n.project-item-header {\r\n  display: flex;\r\n  gap: units.$u2;\r\n  flex-wrap: nowrap;\r\n  align-items: flex-start;\r\n\r\n  margin-block-end: units.$u2;\r\n}\r\n\r\n.project-item-title {\r\n  display: flex;\r\n  gap: units.$u2;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  flex-wrap: wrap;\r\n  flex-grow: 1;\r\n}\r\n\r\n.project-item-actions {\r\n  display: flex;\r\n  flex-shrink: 0;\r\n  flex-wrap: nowrap;\r\n}\r\n\r\n.project-item-info {\r\n  display: flex;\r\n  gap: units.$u2;\r\n  justify-content: space-between;\r\n  flex-wrap: wrap;\r\n  align-items: flex-end;\r\n}\r\n","import { Component, ComponentInterface, Fragment, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-project-item\",\r\n  styleUrl: \"project-item.scss\",\r\n  shadow: true,\r\n})\r\nexport class ProjectItem implements ComponentInterface {\r\n  /**\r\n   * The label of the project item.\r\n   */\r\n  @Prop()\r\n  label?: string;\r\n\r\n  render() {\r\n    return (\r\n      <Fragment>\r\n        <div class=\"project-item-header\">\r\n          <div class=\"project-item-title\">\r\n            <slot name=\"title\" />\r\n            {this.label && (\r\n              <dso-label status=\"error\" compact>\r\n                {this.label}\r\n              </dso-label>\r\n            )}\r\n          </div>\r\n          <div class=\"project-item-actions\">\r\n            <slot name=\"actions\" />\r\n          </div>\r\n        </div>\r\n        <div class=\"project-item-info\">\r\n          <div class=\"project-item-progress\">\r\n            <slot name=\"progress\" />\r\n          </div>\r\n          <div class=\"project-item-status\">\r\n            <slot name=\"status\" />\r\n          </div>\r\n        </div>\r\n      </Fragment>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"kDAAA,MAAMA,EAAiB,4oC,MCOVC,EAAW,M,yBAOtB,MAAAC,GACE,OACEC,EAACC,EAAQ,CAAAC,IAAA,4CACPF,EAAK,OAAAE,IAAA,2CAAAC,MAAM,uBACTH,EAAK,OAAAE,IAAA,2CAAAC,MAAM,sBACTH,EAAM,QAAAE,IAAA,2CAAAE,KAAK,UACVC,KAAKC,OACJN,EAAA,aAAAE,IAAA,2CAAWK,OAAO,QAAQC,QAAO,MAC9BH,KAAKC,QAIZN,EAAK,OAAAE,IAAA,2CAAAC,MAAM,wBACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,cAGfJ,EAAK,OAAAE,IAAA,2CAAAC,MAAM,qBACTH,EAAK,OAAAE,IAAA,2CAAAC,MAAM,yBACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,cAEbJ,EAAK,OAAAE,IAAA,2CAAAC,MAAM,uBACTH,EAAM,QAAAE,IAAA,2CAAAE,KAAK,a","ignoreList":[]}

package/dist/dso-toolkit/{p-f3e22802.entry.js → p-80e3a910.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as o}from"./p-DxWmN7gh.js";const n=":host{--_dso-di-background-image:none;--_dso-link-icon-padding-inline-start:0;--_dso-link-icon-padding-inline-end:0;display:block}*,*::after,*::before{box-sizing:border-box}::slotted([slot=anchor-items]),::slotted([slot=info-items]){display:flex !important;flex-wrap:wrap !important;gap:16px 24px !important;padding-inline-start:0 !important;list-style:none !important}@media screen and (max-width: 991px){::slotted([slot=anchor-items]),::slotted([slot=info-items]){flex-direction:column !important;gap:16px !important}}::slotted([slot=info-items]){margin-block-end:0 !important}::slotted([slot=heading]){margin-block:0 16px !important;font-size:16px !important}";const e=class{constructor(o){t(this,o)}render(){return o("div",{key:"a511c3b7e61371a74f3e55c0a71abaf56768cb52",class:"dso-contact-information"},o("slot",{key:"98fae6e8614de0c46fb8fb5d55e77f5807dc4231",name:"heading"}),o("slot",{key:"b84cd2bcc9a9874110d302b16ece15d37ab35896",name:"anchor-items"}),o("slot",{key:"32bae418af1a46f538c8cb4dde38e347f99cf7b1",name:"info-items"}))}};e.style=n;export{e as dso_contact_information};
-//# sourceMappingURL=p-f3e22802.entry.js.map
+import{r as t,h as o}from"./p-DxWmN7gh.js";const n=":host{--_dso-di-background-image:none;--_dso-link-icon-padding-inline-start:0;--_dso-link-icon-padding-inline-end:0;display:block}*,*::after,*::before{box-sizing:border-box}::slotted([slot=anchor-items]),::slotted([slot=info-items]){display:flex !important;flex-wrap:wrap !important;gap:16px 24px !important;padding-inline-start:0 !important;list-style:none !important}@media screen and (max-width: 991px){::slotted([slot=anchor-items]),::slotted([slot=info-items]){flex-direction:column !important;gap:16px !important}}::slotted([slot=info-items]){margin-block-end:0 !important}::slotted([slot=heading]){margin-block:0 16px !important;font-size:16px !important}";const e=class{constructor(o){t(this,o)}render(){return o("div",{key:"bbabd0b1c2088b6e7fffdd7c51dcbad08205a7e7",class:"dso-contact-information"},o("slot",{key:"e002381ccc600ede34f2d024d9ff6afa992d497b",name:"heading"}),o("slot",{key:"f03b77b304836ccfe8cf48b310ea79f6fbdebb61",name:"anchor-items"}),o("slot",{key:"b73bae3565c07464938d138c31fe5a9f3156e1f4",name:"info-items"}))}};e.style=n;export{e as dso_contact_information};
+//# sourceMappingURL=p-80e3a910.entry.js.map

package/dist/dso-toolkit/p-829b8003.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as i,h as o}from"./p-DxWmN7gh.js";const n="*,*::after,*::before{box-sizing:border-box}:host{display:block;background-color:#fff}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-mark-bar{display:flex;flex-grow:1}.dso-mark-bar .dso-mark-bar-input{display:flex;position:relative;inline-size:100%}.dso-mark-bar .dso-mark-bar-input input{background-color:transparent;background-image:none;border:1px solid #275937;border-radius:4px;box-shadow:none;display:block;font-size:1rem;block-size:2.5rem;line-height:2.5rem;padding-inline:2.5rem;padding-block:6px;transition:border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;inline-size:100%;border-start-end-radius:0;border-end-end-radius:0;border-inline-end:0}.dso-mark-bar .dso-mark-bar-input input:focus{border-color:#275937;box-shadow:inset 0 0 0 1px #275937;outline:0}.dso-mark-bar .dso-mark-bar-input input::-ms-clear{display:none}.dso-mark-bar .dso-mark-bar-input input:not(:placeholder-shown)+label{inline-size:2.5rem;padding-inline-end:8px}.dso-mark-bar .dso-mark-bar-input input:not(:placeholder-shown)+label .label-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-mark-bar .dso-mark-bar-input label{inset-block-end:8px;block-size:2.5rem;inset-inline-start:0;inset-inline-end:40px;padding-block:8px;padding-inline-start:8px;cursor:text;position:absolute;inset-block-start:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.dso-mark-bar .dso-mark-bar-input label dso-icon{color:#39870c;cursor:default;margin:-8px;padding:8px;inline-size:2.5rem;block-size:2.5rem}.dso-mark-bar .dso-mark-bar-input label .label-text{margin-inline-start:8px;color:#666}.dso-mark-bar .dso-mark-bar-input dso-icon-button{position:absolute;inset-inline-end:8px;inset-block-start:8px}.dso-button-container{position:relative;display:flex;align-items:center;gap:8px;flex-shrink:0;padding-inline:8px;border:1px solid #275937;border-inline-start:0;border-start-end-radius:4px;border-end-end-radius:4px}.dso-button-container dso-icon-button{--dso-icon-button-tertiary-border:0;cursor:pointer}.dso-button-container dso-icon-button:disabled{color:#ccc;cursor:default}.dso-button-container .divider{position:absolute;inset-inline-start:0;inset-block-start:8px;inset-block-end:8px;inline-size:1px;background-color:#ccc}";const a=class{constructor(o){e(this,o);this.dsoInput=i(this,"dsoInput",3);this.dsoNext=i(this,"dsoNext",3);this.dsoPrevious=i(this,"dsoPrevious",3);this.dsoClear=i(this,"dsoClear",3);this.label="Zoeken in document";this.handleInput=e=>{if(!(e.target instanceof HTMLInputElement)){return}this.dsoInput.emit({originalEvent:e,value:e.target.value})};this.handleNext=e=>{this.dsoNext.emit({originalEvent:e})};this.handlePrevious=e=>{this.dsoPrevious.emit({originalEvent:e})};this.handleClear=e=>{this.dsoClear.emit({originalEvent:e})};this.handleKeyDown=e=>{if(e.key==="Enter"){this.handleNext(e)}}}async dsoFocus(e={}){var i,o;(i=this.inputElement)===null||i===void 0?void 0:i.focus();if(e.select){(o=this.inputElement)===null||o===void 0?void 0:o.select()}}render(){const e=this.current||0;const i=this.totalCount||0;return o("div",{key:"3f2390f17346e0f6e8f5922c8205b7d0dbb68f89",class:"dso-mark-bar"},o("div",{key:"19da44807b5d7be12bf74f601412e0228ada4a49",class:"dso-mark-bar-input"},o("input",{key:"fd26a40b6539bc0ac7638e587776819d9a8e2831",type:"text",id:"search-input",value:this.value,onInput:this.handleInput,onKeyDown:this.handleKeyDown,placeholder:" ",ref:e=>this.inputElement=e}),o("label",{key:"6b6599311c0068af1470cf2f04defc603740064f",htmlFor:"search-input"},o("dso-icon",{key:"61e5cf281785c47181144e6a06fbc4f92f1f4ae9",class:"dso-search-icon",icon:"search"}),o("span",{key:"7a7b144411738a1d804e7c75256adccbf922b864",class:"label-text"},this.label)),o("dso-icon-button",{key:"bb929394de046b8a3acaff79bda1a51a0768870a",icon:"times",variant:"tertiary",label:"Zoekopdracht legen",onDsoClick:e=>this.handleClear(e.detail.originalEvent)})),o("div",{key:"32c06190f96d124d6f2d7ac6fe207aedd4af9638",class:"dso-button-container"},o("span",{key:"988bd229b69150fcc6107f6e291a00c76b04e8b5",class:"divider"}),o("dso-icon-button",{key:"40ae708d4a8676e617d728d3d326d50767394046",icon:"chevron-up",variant:"tertiary",label:"Vorig zoekresultaat",onDsoClick:e=>this.handlePrevious(e.detail.originalEvent),disabled:e<=1}),o("span",{key:"973aa6d3df09e3809bbcd4c2b96dee8144cae2d6"},e,"/",i),o("dso-icon-button",{key:"a26fc60b7e05fe6725f444476afe85345c9f13b8",icon:"chevron-down",variant:"tertiary",label:"Volgend zoekresultaat",onDsoClick:e=>this.handleNext(e.detail.originalEvent),disabled:e>=i})))}};a.style=n;export{a as dso_mark_bar};
+//# sourceMappingURL=p-829b8003.entry.js.map

package/dist/dso-toolkit/p-829b8003.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["markBarCss","MarkBar","constructor","hostRef","this","label","handleInput","e","target","HTMLInputElement","dsoInput","emit","originalEvent","value","handleNext","dsoNext","handlePrevious","dsoPrevious","handleClear","dsoClear","handleKeyDown","key","dsoFocus","options","_a","inputElement","focus","select","_b","render","current","totalCount","h","class","type","id","onInput","onKeyDown","placeholder","ref","element","htmlFor","icon","variant","onDsoClick","detail","disabled"],"sources":["src/components/mark-bar/mark-bar.scss?tag=dso-mark-bar&encapsulation=shadow","src/components/mark-bar/mark-bar.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/scaffolding\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n@use \"~dso-toolkit/src/components/form-control\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: block;\r\n  background-color: colors.$wit;\r\n}\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n$block-size: units.$ru5;\r\n$focus-border-width: 1px;\r\n\r\n.dso-mark-bar {\r\n  display: flex;\r\n  flex-grow: 1;\r\n\r\n  .dso-mark-bar-input {\r\n    display: flex;\r\n    position: relative;\r\n    inline-size: 100%;\r\n\r\n    input {\r\n      background-color: transparent;\r\n      background-image: none;\r\n      border: 1px solid form-control.$focus-border-color;\r\n      border-radius: 4px;\r\n      box-shadow: none;\r\n      display: block;\r\n      font-size: typography.$root-font-size-base;\r\n      block-size: $block-size;\r\n      line-height: $block-size;\r\n      padding-inline: $block-size;\r\n      padding-block: 6px;\r\n      transition:\r\n        border-color ease-in-out 0.15s,\r\n        box-shadow ease-in-out 0.15s;\r\n      inline-size: 100%;\r\n      border-start-end-radius: 0;\r\n      border-end-end-radius: 0;\r\n      border-inline-end: 0;\r\n\r\n      &:focus {\r\n        border-color: form-control.$focus-border-color;\r\n        box-shadow: inset 0 0 0 form-control.$focus-border-width form-control.$focus-border-color;\r\n        outline: 0;\r\n      }\r\n\r\n      &::-ms-clear {\r\n        display: none;\r\n      }\r\n\r\n      &:not(:placeholder-shown) + label {\r\n        inline-size: $block-size;\r\n        padding-inline-end: units.$u1;\r\n\r\n        .label-text {\r\n          @include utilities.sr-only();\r\n        }\r\n      }\r\n    }\r\n\r\n    label {\r\n      inset-block-end: units.$u1;\r\n      block-size: $block-size;\r\n      inset-inline-start: 0;\r\n      inset-inline-end: units.$u5;\r\n      padding-block: units.$u1;\r\n      padding-inline-start: units.$u1;\r\n      cursor: text;\r\n      position: absolute;\r\n      inset-block-start: 0;\r\n      overflow: hidden;\r\n      /* stylelint-disable declaration-property-value-disallowed-list -- The following properties are needed to emulate the browser native placeholder attribute behavior */\r\n      white-space: nowrap;\r\n      text-overflow: ellipsis;\r\n      /* stylelint-enable-next-line declaration-property-value-disallowed-list */\r\n\r\n      dso-icon {\r\n        color: colors.$grasgroen;\r\n        cursor: default;\r\n        margin: -8px;\r\n        padding: 8px;\r\n        inline-size: $block-size;\r\n        block-size: $block-size;\r\n      }\r\n\r\n      .label-text {\r\n        margin-inline-start: units.$u1;\r\n        color: colors.$grijs-60;\r\n      }\r\n    }\r\n\r\n    dso-icon-button {\r\n      position: absolute;\r\n      inset-inline-end: units.$u1;\r\n      inset-block-start: units.$u1;\r\n    }\r\n  }\r\n}\r\n\r\n.dso-button-container {\r\n  position: relative;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  gap: units.$u1;\r\n  flex-shrink: 0;\r\n\r\n  padding-inline: units.$u1;\r\n\r\n  border: 1px solid colors.$bosgroen;\r\n  border-inline-start: 0;\r\n  border-start-end-radius: scaffolding.$border-radius-base;\r\n  border-end-end-radius: scaffolding.$border-radius-base;\r\n\r\n  dso-icon-button {\r\n    --dso-icon-button-tertiary-border: 0;\r\n    cursor: pointer;\r\n\r\n    &:disabled {\r\n      color: colors.$grijs-20;\r\n      cursor: default;\r\n    }\r\n  }\r\n\r\n  .divider {\r\n    position: absolute;\r\n    inset-inline-start: 0;\r\n    inset-block-start: units.$u1;\r\n    inset-block-end: units.$u1;\r\n\r\n    inline-size: 1px;\r\n\r\n    background-color: colors.$grijs-20;\r\n  }\r\n}\r\n","import { Component, ComponentInterface, Event, EventEmitter, Method, Prop, h } from \"@stencil/core\";\r\n\r\nimport {\r\n  MarkBarClearEvent,\r\n  MarkBarFocusOptions,\r\n  MarkBarInputEvent,\r\n  MarkBarPaginationEvent,\r\n} from \"./mark-bar.interfaces\";\r\n\r\n@Component({\r\n  tag: \"dso-mark-bar\",\r\n  styleUrl: \"./mark-bar.scss\",\r\n  shadow: true,\r\n})\r\nexport class MarkBar implements ComponentInterface {\r\n  /**\r\n   * The current search value.\r\n   */\r\n  @Prop()\r\n  value?: string;\r\n\r\n  /**\r\n   * The label for the input field.\r\n   */\r\n  @Prop()\r\n  label = \"Zoeken in document\";\r\n\r\n  /**\r\n   * The current (one-based) highlighted search item.\r\n   */\r\n  @Prop()\r\n  current?: number;\r\n\r\n  /**\r\n   * Total number of search results.\r\n   */\r\n  @Prop()\r\n  totalCount?: number;\r\n\r\n  /**\r\n   * Focuses the input field.\r\n   */\r\n  @Method()\r\n  async dsoFocus(options: MarkBarFocusOptions = {}) {\r\n    this.inputElement?.focus();\r\n\r\n    if (options.select) {\r\n      this.inputElement?.select();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Emitted each time the user types in the search field.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoInput!: EventEmitter<MarkBarInputEvent>;\r\n\r\n  /**\r\n   * Emitted when user activates \"next search result\" button.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoNext!: EventEmitter<MarkBarPaginationEvent>;\r\n\r\n  /**\r\n   * Emitted when user activates \"previous search result\" button.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoPrevious!: EventEmitter<MarkBarPaginationEvent>;\r\n\r\n  /**\r\n   * Emitted when user activates \"clear search result\" button.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoClear!: EventEmitter<MarkBarClearEvent>;\r\n\r\n  private inputElement?: HTMLInputElement;\r\n\r\n  private handleInput = (e: Event) => {\r\n    if (!(e.target instanceof HTMLInputElement)) {\r\n      return;\r\n    }\r\n\r\n    this.dsoInput.emit({\r\n      originalEvent: e,\r\n      value: e.target.value,\r\n    });\r\n  };\r\n\r\n  private handleNext = (originalEvent: MouseEvent | KeyboardEvent) => {\r\n    this.dsoNext.emit({ originalEvent });\r\n  };\r\n\r\n  private handlePrevious = (originalEvent: MouseEvent) => {\r\n    this.dsoPrevious.emit({ originalEvent });\r\n  };\r\n\r\n  private handleClear = (originalEvent: MouseEvent) => {\r\n    this.dsoClear.emit({ originalEvent });\r\n  };\r\n\r\n  private handleKeyDown = (e: KeyboardEvent) => {\r\n    if (e.key === \"Enter\") {\r\n      this.handleNext(e);\r\n    }\r\n  };\r\n\r\n  render() {\r\n    const current = this.current || 0;\r\n    const totalCount = this.totalCount || 0;\r\n\r\n    return (\r\n      <div class=\"dso-mark-bar\">\r\n        <div class=\"dso-mark-bar-input\">\r\n          <input\r\n            type=\"text\"\r\n            id=\"search-input\"\r\n            value={this.value}\r\n            onInput={this.handleInput}\r\n            onKeyDown={this.handleKeyDown}\r\n            placeholder=\" \"\r\n            ref={(element) => (this.inputElement = element)}\r\n          />\r\n          <label htmlFor=\"search-input\">\r\n            <dso-icon class=\"dso-search-icon\" icon=\"search\"></dso-icon>\r\n            <span class=\"label-text\">{this.label}</span>\r\n          </label>\r\n          <dso-icon-button\r\n            icon=\"times\"\r\n            variant=\"tertiary\"\r\n            label=\"Zoekopdracht legen\"\r\n            onDsoClick={(e) => this.handleClear(e.detail.originalEvent)}\r\n          />\r\n        </div>\r\n        <div class=\"dso-button-container\">\r\n          <span class=\"divider\" />\r\n          <dso-icon-button\r\n            icon=\"chevron-up\"\r\n            variant=\"tertiary\"\r\n            label=\"Vorig zoekresultaat\"\r\n            onDsoClick={(e) => this.handlePrevious(e.detail.originalEvent)}\r\n            disabled={current <= 1}\r\n          />\r\n          <span>\r\n            {current}/{totalCount}\r\n          </span>\r\n          <dso-icon-button\r\n            icon=\"chevron-down\"\r\n            variant=\"tertiary\"\r\n            label=\"Volgend zoekresultaat\"\r\n            onDsoClick={(e) => this.handleNext(e.detail.originalEvent)}\r\n            disabled={current >= totalCount}\r\n          />\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"kDAAA,MAAMA,EAAa,u0E,MCcNC,EAAO,MALpB,WAAAC,CAAAC,G,0JAgBEC,KAAKC,MAAG,qBAoDAD,KAAAE,YAAeC,IACrB,KAAMA,EAAEC,kBAAkBC,kBAAmB,CAC3C,M,CAGFL,KAAKM,SAASC,KAAK,CACjBC,cAAeL,EACfM,MAAON,EAAEC,OAAOK,OAChB,EAGIT,KAAAU,WAAcF,IACpBR,KAAKW,QAAQJ,KAAK,CAAEC,iBAAgB,EAG9BR,KAAAY,eAAkBJ,IACxBR,KAAKa,YAAYN,KAAK,CAAEC,iBAAgB,EAGlCR,KAAAc,YAAeN,IACrBR,KAAKe,SAASR,KAAK,CAAEC,iBAAgB,EAG/BR,KAAAgB,cAAiBb,IACvB,GAAIA,EAAEc,MAAQ,QAAS,CACrBjB,KAAKU,WAAWP,E,EAsDrB,CAjHC,cAAMe,CAASC,EAA+B,I,SAC5CC,EAAApB,KAAKqB,gBAAc,MAAAD,SAAA,SAAAA,EAAAE,QAEnB,GAAIH,EAAQI,OAAQ,EAClBC,EAAAxB,KAAKqB,gBAAc,MAAAG,SAAA,SAAAA,EAAAD,Q,EA2DvB,MAAAE,GACE,MAAMC,EAAU1B,KAAK0B,SAAW,EAChC,MAAMC,EAAa3B,KAAK2B,YAAc,EAEtC,OACEC,EAAA,OAAAX,IAAA,2CAAKY,MAAM,gBACTD,EAAK,OAAAX,IAAA,2CAAAY,MAAM,sBACTD,EACE,SAAAX,IAAA,2CAAAa,KAAK,OACLC,GAAG,eACHtB,MAAOT,KAAKS,MACZuB,QAAShC,KAAKE,YACd+B,UAAWjC,KAAKgB,cAChBkB,YAAY,IACZC,IAAMC,GAAapC,KAAKqB,aAAee,IAEzCR,EAAO,SAAAX,IAAA,2CAAAoB,QAAQ,gBACbT,EAAA,YAAAX,IAAA,2CAAUY,MAAM,kBAAkBS,KAAK,WACvCV,EAAM,QAAAX,IAAA,2CAAAY,MAAM,cAAc7B,KAAKC,QAEjC2B,EAAA,mBAAAX,IAAA,2CACEqB,KAAK,QACLC,QAAQ,WACRtC,MAAM,qBACNuC,WAAarC,GAAMH,KAAKc,YAAYX,EAAEsC,OAAOjC,kBAGjDoB,EAAK,OAAAX,IAAA,2CAAAY,MAAM,wBACTD,EAAM,QAAAX,IAAA,2CAAAY,MAAM,YACZD,EAAA,mBAAAX,IAAA,2CACEqB,KAAK,aACLC,QAAQ,WACRtC,MAAM,sBACNuC,WAAarC,GAAMH,KAAKY,eAAeT,EAAEsC,OAAOjC,eAChDkC,SAAUhB,GAAW,IAEvBE,EAAA,QAAAX,IAAA,4CACGS,EAAO,IAAGC,GAEbC,EAAA,mBAAAX,IAAA,2CACEqB,KAAK,eACLC,QAAQ,WACRtC,MAAM,wBACNuC,WAAarC,GAAMH,KAAKU,WAAWP,EAAEsC,OAAOjC,eAC5CkC,SAAUhB,GAAWC,K","ignoreList":[]}

package/dist/dso-toolkit/p-83448a26.entry.js

@@ -0,0 +1,2 @@
+import{r as s,h as a}from"./p-DxWmN7gh.js";import{c as o}from"./p-ChV9xqsO.js";const e=":host{display:block}*,*::after,*::before{box-sizing:border-box}.dso-banner{padding-block:16px;padding-inline:0;position:relative}.dso-banner.dso-compact{padding-block:12px;padding-inline:0}";const n=class{constructor(a){s(this,a);this.compact=false;this.icon=false}render(){return a("section",{key:"d19ab00faab47b26f6cc5dbda513eabfebde19f6",class:o("dso-banner",`alert-${this.status}`,{"dso-compact":this.compact}),role:"alert"},a("slot",{key:"5b5a7b14ebf06f9d12a88ff89d9591aa643579bc"}))}};n.style=e;export{n as dso_banner};
+//# sourceMappingURL=p-83448a26.entry.js.map

package/dist/dso-toolkit/p-8972246f.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,f as n,h as a,g as o}from"./p-DxWmN7gh.js";import{i}from"./p-Hgv-pDpy.js";const d="*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-document-card-container{padding-block:16px;padding-inline:16px;inline-size:100%}.dso-document-card-container .dso-document-card-heading{align-items:center;display:flex}@media screen and (max-width: 480px){.dso-document-card-container .dso-document-card-heading{flex-wrap:wrap}}.dso-document-card-container:has(.dso-document-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}:host([active]:not([active=false])) .dso-document-card-container{background-color:#e5e5e5}::slotted([slot=meta]){display:flex !important;justify-content:space-between !important;flex-shrink:0 !important;align-self:end !important}@media screen and (max-width: 480px){::slotted([slot=meta]){flex-basis:100% !important;margin-block-start:16px !important}}::slotted([slot=heading]){display:inline !important;color:#275937 !important;font-size:1.125em !important;font-weight:700 !important;line-height:1.25 !important;margin-block-end:0 !important;margin-block-start:0 !important}.heading-anchor{color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.heading-anchor .icon-container{position:relative;padding-inline-end:24px}.heading-anchor .icon-container dso-icon{position:absolute;inset-inline-end:0;inset-block-end:-3px;block-size:24px;inline-size:24px}::slotted([slot=type]){--_dt-info-button-margin-inline-start:0;display:flex !important;gap:8px !important}.dso-document-card-heading+.dso-document-card-type,.dso-document-card-heading+.dso-document-card-status,.dso-document-card-type+.dso-document-card-status{margin-block-start:8px}";const c=class{constructor(n){e(this,n);this.dsoDocumentCardClick=t(this,"dsoDocumentCardClick",7)}connectedCallback(){this.mutationObserver=new MutationObserver((()=>n(this.host)));this.mutationObserver.observe(this.host,{attributes:true,childList:true})}disconnectedCallback(){var e;(e=this.mutationObserver)===null||e===void 0?void 0:e.disconnect();delete this.mutationObserver}clickEventHandler(e){if(!(e.target instanceof HTMLElement)||!this.href){return}return this.dsoDocumentCardClick.emit({originalEvent:e,isModifiedEvent:i(e)})}get metaSlottedElement(){return this.host.querySelector("[slot='meta']")}render(){return a("div",{key:"bbd724d0e936c3f7adb87aff14b8e30b85c7b0c9",class:"dso-document-card-container"},a("div",{key:"4e8689ef58c31d4f490f105afe64b17c4f764cca",class:"dso-document-card-heading"},a("a",{key:"f8aa9dbc91f3307d6d7042599fab6d7d9ee110c7",href:this.href,class:"heading-anchor",onClick:e=>this.clickEventHandler(e)},a("span",{key:"35815a6a48d9ff6666197b0facbf30b4eef242cf",class:"icon-container"},a("dso-icon",{key:"80a301e406813a4874aa64a565ef9cef7663a494",icon:"chevron-right"}),a("slot",{key:"79bb4598f8e89d9ac047347910c3e0dae3877fbf",name:"heading"}))),this.metaSlottedElement!==null&&a("slot",{key:"94090520fef0be8297eeb50848e67ef2b3440367",name:"meta"})),a("div",{key:"5499a344d6a3b3e486df41e789cc1eb20634cbd2",class:"dso-document-card-type"},a("slot",{key:"0f535e6c5b5574e9844e5ccb6a3fcb0f4fb15770",name:"type"})),a("div",{key:"da465fb5a9994e922a87954beebfc95b64b04d06",class:"dso-document-card-status"},a("slot",{key:"eac2432d9123f912c7d37270c570e6dc23ca147b",name:"status"})))}get host(){return o(this)}};c.style=d;export{c as dso_document_card};
+//# sourceMappingURL=p-8972246f.entry.js.map