@dso-toolkit/core 54.0.1 → 54.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/dso-accordion.cjs.entry.js +4 -1
- package/dist/cjs/dso-annotation-output.cjs.entry.js +6 -2
- package/dist/cjs/dso-autosuggest.cjs.entry.js +3 -3
- package/dist/cjs/dso-date-picker.cjs.entry.js +16 -2
- package/dist/cjs/dso-dropdown-menu.cjs.entry.js +2 -1
- package/dist/cjs/dso-expandable-heading.cjs.entry.js +2 -2
- package/dist/cjs/dso-expandable.cjs.entry.js +4 -1
- package/dist/cjs/dso-info_2.cjs.entry.js +1 -1
- package/dist/cjs/dso-map-controls.cjs.entry.js +2 -2
- package/dist/cjs/dso-pagination.cjs.entry.js +17 -4
- package/dist/cjs/dso-responsive-element.cjs.entry.js +3 -0
- package/dist/cjs/dso-scrollable.cjs.entry.js +101 -0
- package/dist/cjs/dso-table.cjs.entry.js +3 -0
- package/dist/cjs/dso-toolkit.cjs.js +1 -1
- package/dist/cjs/dso-tooltip.cjs.entry.js +8 -2
- package/dist/cjs/dso-tree-view.cjs.entry.js +8 -1
- package/dist/cjs/dso-viewer-grid.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/accordion/accordion.js +4 -1
- package/dist/collection/components/annotation-output/annotation-output.js +6 -2
- package/dist/collection/components/autosuggest/autosuggest.js +3 -3
- package/dist/collection/components/date-picker/date-picker-month.js +5 -1
- package/dist/collection/components/date-picker/date-picker.js +6 -0
- package/dist/collection/components/date-picker/date-utils.js +5 -1
- package/dist/collection/components/dropdown-menu/dropdown-menu.js +2 -1
- package/dist/collection/components/expandable/expandable.js +9 -2
- package/dist/collection/components/expandable-heading/expandable-heading.css +4 -4
- package/dist/collection/components/expandable-heading/expandable-heading.js +1 -1
- package/dist/collection/components/map-controls/map-controls.css +0 -5
- package/dist/collection/components/map-controls/map-controls.js +1 -1
- package/dist/collection/components/pagination/pagination.js +17 -4
- package/dist/collection/components/responsive-element/responsive-element.js +3 -0
- package/dist/collection/components/scrollable/scrollable.css +50 -0
- package/dist/collection/components/scrollable/scrollable.interfaces.js +1 -0
- package/dist/collection/components/scrollable/scrollable.js +149 -0
- package/dist/collection/components/selectable/selectable.css +1 -1
- package/dist/collection/components/table/table.js +3 -0
- package/dist/collection/components/tooltip/tooltip.js +8 -2
- package/dist/collection/components/tree-view/tree-view.js +8 -1
- package/dist/collection/components/viewer-grid/viewer-grid.css +2 -2
- package/dist/collection/index.js +1 -0
- package/dist/components/dropdown-menu.js +2 -1
- package/dist/components/dso-accordion.js +4 -1
- package/dist/components/dso-annotation-output.js +6 -2
- package/dist/components/dso-autosuggest.js +3 -3
- package/dist/components/dso-date-picker.js +16 -2
- package/dist/components/dso-expandable-heading.js +2 -2
- package/dist/components/dso-map-controls.js +10 -4
- package/dist/components/dso-pagination.js +17 -4
- package/dist/components/dso-scrollable.d.ts +11 -0
- package/dist/components/dso-scrollable.js +6 -0
- package/dist/components/dso-table.js +3 -0
- package/dist/components/dso-tree-view.js +8 -1
- package/dist/components/dso-viewer-grid.js +1 -1
- package/dist/components/expandable.js +4 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +1 -0
- package/dist/components/responsive-element.js +3 -0
- package/dist/components/scrollable.js +115 -0
- package/dist/components/selectable.js +1 -1
- package/dist/components/tooltip.js +8 -2
- package/dist/dso-toolkit/dso-toolkit.esm.js +1 -1
- package/dist/dso-toolkit/p-281aa19e.entry.js +1 -0
- package/dist/dso-toolkit/p-296657d3.entry.js +1 -0
- package/dist/dso-toolkit/{p-fe7ca25f.entry.js → p-313d07f5.entry.js} +1 -1
- package/dist/dso-toolkit/{p-5e50b616.entry.js → p-564a5d95.entry.js} +1 -1
- package/dist/dso-toolkit/p-65e8077e.entry.js +1 -0
- package/dist/dso-toolkit/{p-bb90ea4c.entry.js → p-7912940d.entry.js} +1 -1
- package/dist/dso-toolkit/p-9361b19e.entry.js +1 -0
- package/dist/dso-toolkit/p-ae45e550.entry.js +1 -0
- package/dist/dso-toolkit/p-b049f492.entry.js +1 -0
- package/dist/dso-toolkit/p-b9777372.entry.js +1 -0
- package/dist/dso-toolkit/p-baef3721.entry.js +1 -0
- package/dist/dso-toolkit/p-bc975b99.entry.js +1 -0
- package/dist/dso-toolkit/p-c2215704.entry.js +1 -0
- package/dist/dso-toolkit/{p-fa2f1a1c.entry.js → p-ca4fee8d.entry.js} +1 -1
- package/dist/dso-toolkit/p-e8c46f70.entry.js +1 -0
- package/dist/dso-toolkit/p-f3e38af3.entry.js +1 -0
- package/dist/esm/dso-accordion.entry.js +4 -1
- package/dist/esm/dso-annotation-output.entry.js +6 -2
- package/dist/esm/dso-autosuggest.entry.js +3 -3
- package/dist/esm/dso-date-picker.entry.js +16 -2
- package/dist/esm/dso-dropdown-menu.entry.js +2 -1
- package/dist/esm/dso-expandable-heading.entry.js +2 -2
- package/dist/esm/dso-expandable.entry.js +4 -1
- package/dist/esm/dso-info_2.entry.js +1 -1
- package/dist/esm/dso-map-controls.entry.js +2 -2
- package/dist/esm/dso-pagination.entry.js +17 -4
- package/dist/esm/dso-responsive-element.entry.js +3 -0
- package/dist/esm/dso-scrollable.entry.js +97 -0
- package/dist/esm/dso-table.entry.js +3 -0
- package/dist/esm/dso-toolkit.js +1 -1
- package/dist/esm/dso-tooltip.entry.js +8 -2
- package/dist/esm/dso-tree-view.entry.js +8 -1
- package/dist/esm/dso-viewer-grid.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/expandable/expandable.d.ts +2 -2
- package/dist/types/components/expandable/expandable.interfaces.d.ts +2 -2
- package/dist/types/components/scrollable/scrollable.d.ts +21 -0
- package/dist/types/components/scrollable/scrollable.interfaces.d.ts +4 -0
- package/dist/types/components/tooltip/tooltip.d.ts +1 -0
- package/dist/types/components.d.ts +28 -1
- package/dist/types/index.d.ts +1 -0
- package/package.json +2 -2
- package/dist/dso-toolkit/p-09424a1d.entry.js +0 -1
- package/dist/dso-toolkit/p-36224d6f.entry.js +0 -1
- package/dist/dso-toolkit/p-588bc4d7.entry.js +0 -1
- package/dist/dso-toolkit/p-5de8b79a.entry.js +0 -1
- package/dist/dso-toolkit/p-a1616935.entry.js +0 -1
- package/dist/dso-toolkit/p-ad0b38cf.entry.js +0 -1
- package/dist/dso-toolkit/p-b7580ce3.entry.js +0 -1
- package/dist/dso-toolkit/p-c54ad578.entry.js +0 -1
- package/dist/dso-toolkit/p-cf9b79df.entry.js +0 -1
- package/dist/dso-toolkit/p-d987ef37.entry.js +0 -1
- package/dist/dso-toolkit/p-eaae698e.entry.js +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{h as e,r as t,c as n,H as i}from"./p-98fd1658.js";import{c as o}from"./p-6a1980b4.js";import{v as a}from"./p-5d7f4ff2.js";const h=({heading:t,ref:n,className:i},o)=>{switch(t){default:case"h2":return e("h2",{ref:n,class:i},o);case"h3":return e("h3",{ref:n,class:i},o);case"h4":return e("h4",{ref:n,class:i},o);case"h5":return e("h5",{ref:n,class:i},o);case"h6":return e("h6",{ref:n,class:i},o)}},s=class{constructor(e){t(this,e),this.dsoToggle=n(this,"dsoToggle",3),this.identifier=a(),this.open=void 0,this.heading="h2",this.color="default",this.editAction=void 0}toggle(e){this.open=!this.open,this.dsoToggle.emit({originalEvent:e,open:this.open})}render(){const t=this.open?{open:!0}:{};return e(i,{class:o({"dso-del":"delete"===this.editAction,"dso-ins":"insert"===this.editAction})},"delete"===this.editAction&&e("p",{class:"dso-edit-action-text"},e("span",null,"verwijderd:")),"insert"===this.editAction&&e("p",{class:"dso-edit-action-text"},e("span",null,"toegevoegd:")),e("div",{class:o("expandable-heading","black"===this.color?"dso-expandable-heading-black":"")},e(h,{heading:this.heading},e("button",{type:"button","aria-expanded":this.open?"true":"false","aria-controls":this.identifier,onClick:e=>this.toggle(e)},e("dso-icon",{icon:this.open?"chevron-down":"chevron-right"}),e("slot",{name:"title"}))),e("slot",{name:"addons-start"}),e("div",{class:"addons-end"},e("slot",{name:"addons-end"}))),e("dso-expandable",Object.assign({id:this.identifier},t),e("slot",{slot:"expandable-content"})))}};s.style="h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6{color:#275937}h1,.h1,h2,.h2,h3,.h3{margin-block-end:16px;margin-block-start:24px}h1,.h1{line-height:1.25}h1{font-size:2rem;font-weight:700}h2,.h2{line-height:1.33}h2{color:#275937;font-size:1.5rem;font-weight:700}h3,.h3{line-height:1.2}h3{color:#275937;font-size:1.25rem;font-weight:600}h4,.h4,h5,.h5,h6,.h6{margin-block-end:16px;margin-block-start:12px}h4,.h4{line-height:1.5}h4{color:#275937;font-size:1rem;font-weight:600}h5,.h5{line-height:1.5}h5{color:#191919;font-size:1rem;font-weight:600}h6,.h6{line-height:1.5}ins{background-color:#e4f1d4;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25);color:#000;text-decoration:none}:host{display:block;margin-inline:-8px;padding-inline:8px}:host(.dso-del){background-color:#f5d8dc;color:#000;text-decoration:line-through}:host(.dso-ins){background-color:#e4f1d4;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25);color:#000}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-edit-action-text{margin-bottom:8px;margin-top:-8px}.dso-edit-action-text span{display:inline-block;font-style:italic}.dso-edit-action-text+.expandable-heading{margin-top:0;padding-top:0}.expandable-heading{align-items:center;display:flex;margin-bottom:8px;margin-top:8px}.expandable-heading h2,.expandable-heading h3,.expandable-heading h4,.expandable-heading h5,.expandable-heading h6{font-size:1rem;margin-bottom:0;margin-right:8px;margin-top:0}.expandable-heading button{align-items:flex-start;cursor:pointer;background-color:transparent;border:0;color:inherit;display:flex;line-height:24px;font-size:inherit;font-weight:inherit;padding:0;text-align:left}.expandable-heading button>dso-icon{flex-shrink:0}.expandable-heading.dso-expandable-heading-black button{color:#000}dso-expandable{padding-left:24px}.addons-end{display:inline-block;margin-left:auto}";export{s as dso_expandable_heading}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{h as n,r as t,c as e,H as o,g as s}from"./p-98fd1658.js";import{c as i}from"./p-91963e3d.js";import"./p-5950644a.js";const r=({onApply:t,onCancel:e})=>n("div",{class:"filterpanel-buttons"},n("button",{type:"button",class:"cancel-button",onClick:e},n("span",null,"Annuleren")),n("button",{type:"button",class:"apply-button",onClick:t},n("span",null,"Toepassen"),n("dso-icon",{icon:"chevron-right"}))),a=class{constructor(n){t(this,n),this.dsoCloseOverlay=e(this,"dsoCloseOverlay",7),this.dsoFilterpanelCancel=e(this,"dsoFilterpanelCancel",7),this.dsoFilterpanelApply=e(this,"dsoFilterpanelApply",7),this.dsoMainSizeChange=e(this,"dsoMainSizeChange",7),this.sizeLabelMap={small:"smal",medium:"middel",large:"breed"},this.filterpanelSlot=null,this.overlaySlot=null,this.shrinkMain=()=>{this.mainSize="large"===this.mainSize?"medium":"small"},this.expandMain=()=>{this.mainSize="small"===this.mainSize?"medium":"large"},this.keyDownListener=n=>{"Escape"===n.key&&this.dsoCloseOverlay.emit(n)},this.filterpanelOpen=!1,this.overlayOpen=!1,this.initialMainSize=void 0,this.mainSize="large"}mainSizeWatcher(n,t){var e;this.dsoMainSizeChange.emit({stage:"start",previousSize:t,currentSize:n}),null===(e=this.mapPanel)||void 0===e||e.addEventListener("transitionend",(e=>{"flex-basis"===e.propertyName&&this.dsoMainSizeChange.emit({stage:"end",previousSize:t,currentSize:n})}),{once:!0})}updateFocusTrap(){var n,t;this.filterpanelOpen&&this.overlayOpen||(this.filterpanelFocustrap&&(this.filterpanelOpen&&!(null===(n=this.filterpanel)||void 0===n?void 0:n.hidden)?(this.filterpanelFocustrap.activate(),this.host.addEventListener("keydown",this.keyDownListener)):(this.filterpanelFocustrap.deactivate(),this.host.removeEventListener("keydown",this.keyDownListener))),this.overlayFocustrap&&(this.overlayOpen&&!(null===(t=this.overlay)||void 0===t?void 0:t.hidden)?(this.overlayFocustrap.activate(),this.host.addEventListener("keydown",this.keyDownListener)):(this.overlayFocustrap.deactivate(),this.host.removeEventListener("keydown",this.keyDownListener))))}connectedCallback(){this.filterpanelSlot=this.host.querySelector("div[slot='filterpanel']"),this.overlaySlot=this.host.querySelector("div[slot='overlay']")}componentDidLoad(){this.filterpanel&&this.filterpanelSlot&&(this.filterpanelFocustrap=i([this.filterpanel,this.filterpanelSlot],{escapeDeactivates:!1,allowOutsideClick:!0,tabbableOptions:{getShadowRoot:!0}})),this.overlay&&this.overlaySlot&&(this.overlayFocustrap=i([this.overlay,this.overlaySlot],{escapeDeactivates:!1,allowOutsideClick:!0,tabbableOptions:{getShadowRoot:!0}})),this.updateFocusTrap()}componentWillLoad(){this.initialMainSize&&(this.mainSize=this.initialMainSize)}componentDidUpdate(){this.updateFocusTrap()}disconnectedCallback(){var n,t;null===(n=this.overlayFocustrap)||void 0===n||n.deactivate(),null===(t=this.filterpanelFocustrap)||void 0===t||t.deactivate(),this.host.removeEventListener("keydown",this.keyDownListener)}handleFilterpanelApply(n){this.dsoFilterpanelApply.emit({originalEvent:n})}handleFilterpanelCancel(n){this.dsoFilterpanelCancel.emit({originalEvent:n})}render(){return n(o,Object.assign({},{[this.mainSize]:!0}),n("div",{class:"dso-map-panel",ref:n=>this.mapPanel=n},n("div",{class:"sizing-buttons"},n("span",{class:"sr-only","aria-live":"polite","aria-atomic":"true"},"breedte tekstpaneel: ",this.sizeLabelMap[this.mainSize]),n("button",{type:"button",class:"shrink",disabled:"small"===this.mainSize,onClick:this.shrinkMain},n("span",{class:"sr-only"},"Kaartpaneel smaller maken"),n("dso-icon",{icon:"chevron-left"})),n("button",{type:"button",class:"expand",disabled:"large"===this.mainSize,onClick:this.expandMain},n("span",{class:"sr-only"},"Kaartpaneel breder maken"),n("dso-icon",{icon:"chevron-right"}))),n("div",{class:"main"},n("slot",{name:"main"}))),n("div",{id:"filterpanel",class:"filterpanel",hidden:!this.filterpanelOpen||!this.filterpanelSlot,ref:n=>this.filterpanel=n},n("h1",null,"Uw keuzes"),n(r,{onApply:n=>this.handleFilterpanelApply(n),onCancel:n=>this.handleFilterpanelCancel(n)}),n("slot",{name:"filterpanel"}),n(r,{onApply:n=>this.handleFilterpanelApply(n),onCancel:n=>this.handleFilterpanelCancel(n)})),n("div",{class:"map"},n("slot",{name:"map"})),n("div",{hidden:!this.overlayOpen||!this.overlaySlot,class:"dimscreen"}),n("div",{class:"overlay",hidden:!this.overlayOpen||!this.overlaySlot,ref:n=>this.overlay=n},n("button",{type:"button",class:"overlay-close-button",onClick:n=>this.dsoCloseOverlay.emit(n)},n("dso-icon",{icon:"times"}),n("span",{class:"sr-only"},"sluiten")),n("slot",{name:"overlay"}),n("button",{"aria-hidden":"true",type:"button",class:"overlay-close-button",style:{zIndex:"-100"}},n("dso-icon",{icon:"times"}),n("span",{class:"sr-only"},"sluiten"))))}get host(){return s(this)}static get watchers(){return{mainSize:["mainSizeWatcher"]}}};a.style="*,\n*::after,\n*::before {\n box-sizing: border-box;\n}\n\n:host {\n display: flex;\n height: 100vh;\n overflow: hidden;\n position: relative;\n}\n\n:host([small]) .dso-map-panel {\n flex-basis: 375px;\n min-width: 0;\n max-width: 375px;\n}\n@media screen and (max-width: 375px) {\n :host([small]) .dso-map-panel {\n flex-basis: 100vw;\n max-width: 100vw;\n min-width: 0;\n transition: none;\n }\n}\n\n:host([medium]) .dso-map-panel {\n flex-basis: 624px;\n min-width: 375px;\n max-width: 624px;\n}\n@media screen and (max-width: 624px) {\n :host([medium]) .dso-map-panel {\n flex-basis: 100vw;\n max-width: 100vw;\n min-width: 375px;\n transition: none;\n }\n}\n\n:host([large]) .dso-map-panel {\n flex-basis: 60%;\n min-width: 768px;\n max-width: 1024px;\n}\n@media screen and (max-width: 768px) {\n :host([large]) .dso-map-panel {\n flex-basis: 100vw;\n max-width: 100vw;\n min-width: 768px;\n transition: none;\n }\n}\n\nbutton {\n -webkit-appearance: button;\n color: inherit;\n cursor: pointer;\n font: inherit;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n margin: 0;\n overflow: visible;\n text-transform: none;\n}\nbutton[disabled] {\n cursor: default;\n}\nbutton::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n}\n\n.shrink,\n.expand,\n.overlay-close-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n border: 0;\n color: #39870c;\n line-height: 1;\n padding: 0;\n background-color: transparent;\n}\n.shrink:focus, .shrink:focus-visible,\n.expand:focus,\n.expand:focus-visible,\n.overlay-close-button:focus,\n.overlay-close-button:focus-visible {\n outline-offset: 2px;\n}\n.shrink:active,\n.expand:active,\n.overlay-close-button:active {\n outline: 0;\n}\n.shrink[disabled],\n.expand[disabled],\n.overlay-close-button[disabled] {\n color: #afcf9d;\n}\n.shrink[disabled].dso-spinner-left, .shrink[disabled].dso-spinner-right,\n.expand[disabled].dso-spinner-left,\n.expand[disabled].dso-spinner-right,\n.overlay-close-button[disabled].dso-spinner-left,\n.overlay-close-button[disabled].dso-spinner-right {\n color: #39870c;\n}\n.shrink:not([disabled]):hover,\n.expand:not([disabled]):hover,\n.overlay-close-button:not([disabled]):hover {\n color: #275937;\n text-decoration: underline;\n text-underline-position: under;\n}\n.shrink:not([disabled]):active,\n.expand:not([disabled]):active,\n.overlay-close-button:not([disabled]):active {\n color: #173521;\n}\n.shrink.btn-align,\n.expand.btn-align,\n.overlay-close-button.btn-align {\n line-height: calc(1.5em - 1px);\n padding: 11px 0;\n position: relative;\n}\n.shrink.dso-spinner-left::before,\n.expand.dso-spinner-left::before,\n.overlay-close-button.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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-right: 8px;\n}\n.shrink.dso-spinner-right::after,\n.expand.dso-spinner-right::after,\n.overlay-close-button.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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-left: 8px;\n}\n.shrink dso-icon + span:not(.sr-only),\n.shrink svg.di + span:not(.sr-only),\n.shrink span:not(.sr-only) + dso-icon,\n.shrink span:not(.sr-only) + svg.di,\n.expand dso-icon + span:not(.sr-only),\n.expand svg.di + span:not(.sr-only),\n.expand span:not(.sr-only) + dso-icon,\n.expand span:not(.sr-only) + svg.di,\n.overlay-close-button dso-icon + span:not(.sr-only),\n.overlay-close-button svg.di + span:not(.sr-only),\n.overlay-close-button span:not(.sr-only) + dso-icon,\n.overlay-close-button span:not(.sr-only) + svg.di {\n margin-left: 8px;\n}\n.shrink svg.di.di-chevron-down + span:not(.sr-only),\n.shrink svg.di.di-chevron-up + span:not(.sr-only),\n.shrink span:not(.sr-only) + svg.di.di-chevron-down,\n.shrink span:not(.sr-only) + svg.di.di-chevron-up,\n.expand svg.di.di-chevron-down + span:not(.sr-only),\n.expand svg.di.di-chevron-up + span:not(.sr-only),\n.expand span:not(.sr-only) + svg.di.di-chevron-down,\n.expand span:not(.sr-only) + svg.di.di-chevron-up,\n.overlay-close-button svg.di.di-chevron-down + span:not(.sr-only),\n.overlay-close-button svg.di.di-chevron-up + span:not(.sr-only),\n.overlay-close-button span:not(.sr-only) + svg.di.di-chevron-down,\n.overlay-close-button span:not(.sr-only) + svg.di.di-chevron-up {\n margin-left: 4px;\n}\n.shrink dso-icon[icon=chevron-left] + span:not(.sr-only),\n.shrink dso-icon[icon=chevron-right] + span:not(.sr-only),\n.shrink svg.di.di-angle-down + span:not(.sr-only),\n.shrink svg.di.di-angle-up + span:not(.sr-only),\n.shrink span:not(.sr-only) + svg.di.di-angle-down,\n.shrink span:not(.sr-only) + svg.di.di-angle-up,\n.shrink span:not(.sr-only) + dso-icon[icon=chevron-left],\n.shrink span:not(.sr-only) + dso-icon[icon=chevron-right],\n.expand dso-icon[icon=chevron-left] + span:not(.sr-only),\n.expand dso-icon[icon=chevron-right] + span:not(.sr-only),\n.expand svg.di.di-angle-down + span:not(.sr-only),\n.expand svg.di.di-angle-up + span:not(.sr-only),\n.expand span:not(.sr-only) + svg.di.di-angle-down,\n.expand span:not(.sr-only) + svg.di.di-angle-up,\n.expand span:not(.sr-only) + dso-icon[icon=chevron-left],\n.expand span:not(.sr-only) + dso-icon[icon=chevron-right],\n.overlay-close-button dso-icon[icon=chevron-left] + span:not(.sr-only),\n.overlay-close-button dso-icon[icon=chevron-right] + span:not(.sr-only),\n.overlay-close-button svg.di.di-angle-down + span:not(.sr-only),\n.overlay-close-button svg.di.di-angle-up + span:not(.sr-only),\n.overlay-close-button span:not(.sr-only) + svg.di.di-angle-down,\n.overlay-close-button span:not(.sr-only) + svg.di.di-angle-up,\n.overlay-close-button span:not(.sr-only) + dso-icon[icon=chevron-left],\n.overlay-close-button span:not(.sr-only) + dso-icon[icon=chevron-right] {\n margin-left: 0;\n}\n.shrink dso-icon,\n.shrink svg.di,\n.shrink span,\n.expand dso-icon,\n.expand svg.di,\n.expand span,\n.overlay-close-button dso-icon,\n.overlay-close-button svg.di,\n.overlay-close-button span {\n vertical-align: middle;\n}\n.shrink:hover,\n.expand:hover,\n.overlay-close-button:hover {\n cursor: pointer;\n}\n.shrink[disabled],\n.expand[disabled],\n.overlay-close-button[disabled] {\n display: none;\n}\n\n.overlay-close-button {\n position: absolute;\n top: 8px;\n right: 16px;\n}\n\n.dso-map-panel {\n background-color: #fff;\n box-shadow: 2px 0 8px 0 rgba(0, 0, 0, 0.4);\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 8px;\n position: relative;\n transition: flex-basis 200ms ease-in, max-width 200ms ease-in, min-width 200ms ease-in;\n z-index: 100;\n}\n.dso-map-panel .dso-filterblok-address {\n font-weight: bold;\n margin: 8px 0;\n}\n.dso-map-panel .main {\n height: 100%;\n overflow-y: scroll;\n padding: 0 16px 8px;\n}\n\n.sizing-buttons {\n left: calc(100% + 1px);\n overflow-x: hidden;\n padding: 0 4px 4px 0;\n position: absolute;\n top: 16px;\n transition: left 200ms ease-in;\n width: 44px;\n z-index: -1;\n}\n.sizing-buttons button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n border: 0;\n padding: 8px;\n border-radius: 0;\n border-bottom-right-radius: 4px;\n border-top-right-radius: 4px;\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.4);\n flex: 0 0 100%;\n height: 40px;\n min-width: auto;\n width: 40px;\n}\n.sizing-buttons button:focus, .sizing-buttons button:focus-visible {\n outline-offset: 2px;\n}\n.sizing-buttons button:active {\n outline: 0;\n}\n.sizing-buttons button:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.sizing-buttons button:active {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.sizing-buttons button[disabled], .sizing-buttons button[disabled]:hover {\n background-color: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\n.sizing-buttons button.btn-sm {\n line-height: 1rem;\n}\n.sizing-buttons button.btn-sm dso-icon,\n.sizing-buttons button.btn-sm svg.di, .sizing-buttons button.btn-sm.extern::after, .sizing-buttons button.btn-sm.download::after, .sizing-buttons button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.sizing-buttons button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.sizing-buttons button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.sizing-buttons button > span {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n}\n.sizing-buttons button.dso-spinner-left[disabled], .sizing-buttons button.dso-spinner-right[disabled] {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n}\n.sizing-buttons button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.sizing-buttons button.dso-spinner-left:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.sizing-buttons button.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 16px;\n}\n.sizing-buttons button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.sizing-buttons button.dso-spinner-right:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.sizing-buttons button.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\n.sizing-buttons button:focus-visible {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n outline: none;\n}\n.sizing-buttons button:hover dso-icon {\n color: #fff;\n}\n\n.map {\n height: 100%;\n width: 100%;\n overflow: hidden;\n}\n\n.filterpanel,\n.overlay {\n background-color: #fff;\n height: 100%;\n overflow-y: auto;\n position: absolute;\n z-index: 101;\n}\n\n.filterpanel {\n box-shadow: 2px 0 5px #666;\n padding: 8px 16px;\n left: 0;\n max-width: 896px;\n width: calc(100vw - 40px);\n}\n@media screen and (max-width: 768px) {\n .filterpanel {\n width: 100vw;\n }\n .filterpanel::before {\n display: none !important;\n }\n}\n.filterpanel h1 {\n color: #275937;\n margin-bottom: 16px;\n margin-top: 24px;\n font-size: 2rem;\n font-weight: 700;\n}\n.filterpanel::before {\n content: \"\";\n display: block;\n position: fixed;\n top: 0;\n bottom: 0;\n right: 0;\n left: 896px;\n background-color: rgba(0, 0, 0, 0.5);\n}\n@media screen and (max-width: 936px) {\n .filterpanel::before {\n left: auto;\n width: 40px;\n }\n}\n\n.overlay {\n box-shadow: -2px 0 5px #666;\n padding: 40px 16px 8px;\n right: 0;\n width: 624px;\n}\n@media screen and (max-width: 624px) {\n .overlay {\n width: 100vw;\n }\n}\n\n.dimscreen {\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 624px;\n background-color: rgba(0, 0, 0, 0.5);\n z-index: 102;\n}\n\n.filterpanel-buttons {\n text-align: right;\n}\n.filterpanel-buttons .cancel-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n line-height: 1rem;\n}\n.filterpanel-buttons .cancel-button:focus, .filterpanel-buttons .cancel-button:focus-visible {\n outline-offset: 2px;\n}\n.filterpanel-buttons .cancel-button:active {\n outline: 0;\n}\n.filterpanel-buttons .cancel-button:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.filterpanel-buttons .cancel-button:active {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.filterpanel-buttons .cancel-button[disabled], .filterpanel-buttons .cancel-button[disabled]:hover {\n background-color: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\n.filterpanel-buttons .cancel-button.btn-sm {\n line-height: 1rem;\n}\n.filterpanel-buttons .cancel-button.btn-sm dso-icon,\n.filterpanel-buttons .cancel-button.btn-sm svg.di, .filterpanel-buttons .cancel-button.btn-sm.extern::after, .filterpanel-buttons .cancel-button.btn-sm.download::after, .filterpanel-buttons .cancel-button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.filterpanel-buttons .cancel-button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button dso-icon,\n.filterpanel-buttons .cancel-button svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\n.filterpanel-buttons .cancel-button span + dso-icon,\n.filterpanel-buttons .cancel-button span + svg.di {\n margin-left: 8px;\n margin-right: -8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-left[disabled], .filterpanel-buttons .cancel-button.dso-spinner-right[disabled] {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n}\n.filterpanel-buttons .cancel-button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-left:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-right:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button dso-icon,\n.filterpanel-buttons .cancel-button svg.di, .filterpanel-buttons .cancel-button.extern::after, .filterpanel-buttons .cancel-button.download::after, .filterpanel-buttons .cancel-button.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .apply-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n line-height: 1rem;\n}\n.filterpanel-buttons .apply-button:focus, .filterpanel-buttons .apply-button:focus-visible {\n outline-offset: 2px;\n}\n.filterpanel-buttons .apply-button:active {\n outline: 0;\n}\n.filterpanel-buttons .apply-button:hover {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.filterpanel-buttons .apply-button:active {\n background-color: #173521;\n border-color: #173521;\n color: #fff;\n}\n.filterpanel-buttons .apply-button[disabled], .filterpanel-buttons .apply-button[disabled]:hover {\n background-color: #afcf9d;\n border-color: #afcf9d;\n color: #fff;\n}\n.filterpanel-buttons .apply-button.btn-sm {\n line-height: 1rem;\n}\n.filterpanel-buttons .apply-button.btn-sm dso-icon,\n.filterpanel-buttons .apply-button.btn-sm svg.di, .filterpanel-buttons .apply-button.btn-sm.extern::after, .filterpanel-buttons .apply-button.btn-sm.download::after, .filterpanel-buttons .apply-button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.filterpanel-buttons .apply-button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .apply-button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .apply-button dso-icon,\n.filterpanel-buttons .apply-button svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\n.filterpanel-buttons .apply-button span + dso-icon,\n.filterpanel-buttons .apply-button span + svg.di {\n margin-left: 8px;\n margin-right: -8px;\n}\n.filterpanel-buttons .apply-button.dso-spinner-left[disabled], .filterpanel-buttons .apply-button.dso-spinner-right[disabled] {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.filterpanel-buttons .apply-button.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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.filterpanel-buttons .apply-button.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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.filterpanel-buttons .apply-button dso-icon,\n.filterpanel-buttons .apply-button svg.di, .filterpanel-buttons .apply-button.extern::after, .filterpanel-buttons .apply-button.download::after, .filterpanel-buttons .apply-button.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.filterpanel-buttons .apply-button.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .apply-button.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button + .apply-button {\n margin-left: 16px;\n}";export{a as dso_viewer_grid}
|
|
1
|
+
import{h as n,r as t,c as e,H as o,g as s}from"./p-98fd1658.js";import{c as i}from"./p-91963e3d.js";import"./p-5950644a.js";const r=({onApply:t,onCancel:e})=>n("div",{class:"filterpanel-buttons"},n("button",{type:"button",class:"cancel-button",onClick:e},n("span",null,"Annuleren")),n("button",{type:"button",class:"apply-button",onClick:t},n("span",null,"Toepassen"),n("dso-icon",{icon:"chevron-right"}))),a=class{constructor(n){t(this,n),this.dsoCloseOverlay=e(this,"dsoCloseOverlay",7),this.dsoFilterpanelCancel=e(this,"dsoFilterpanelCancel",7),this.dsoFilterpanelApply=e(this,"dsoFilterpanelApply",7),this.dsoMainSizeChange=e(this,"dsoMainSizeChange",7),this.sizeLabelMap={small:"smal",medium:"middel",large:"breed"},this.filterpanelSlot=null,this.overlaySlot=null,this.shrinkMain=()=>{this.mainSize="large"===this.mainSize?"medium":"small"},this.expandMain=()=>{this.mainSize="small"===this.mainSize?"medium":"large"},this.keyDownListener=n=>{"Escape"===n.key&&this.dsoCloseOverlay.emit(n)},this.filterpanelOpen=!1,this.overlayOpen=!1,this.initialMainSize=void 0,this.mainSize="large"}mainSizeWatcher(n,t){var e;this.dsoMainSizeChange.emit({stage:"start",previousSize:t,currentSize:n}),null===(e=this.mapPanel)||void 0===e||e.addEventListener("transitionend",(e=>{"flex-basis"===e.propertyName&&this.dsoMainSizeChange.emit({stage:"end",previousSize:t,currentSize:n})}),{once:!0})}updateFocusTrap(){var n,t;this.filterpanelOpen&&this.overlayOpen||(this.filterpanelFocustrap&&(this.filterpanelOpen&&!(null===(n=this.filterpanel)||void 0===n?void 0:n.hidden)?(this.filterpanelFocustrap.activate(),this.host.addEventListener("keydown",this.keyDownListener)):(this.filterpanelFocustrap.deactivate(),this.host.removeEventListener("keydown",this.keyDownListener))),this.overlayFocustrap&&(this.overlayOpen&&!(null===(t=this.overlay)||void 0===t?void 0:t.hidden)?(this.overlayFocustrap.activate(),this.host.addEventListener("keydown",this.keyDownListener)):(this.overlayFocustrap.deactivate(),this.host.removeEventListener("keydown",this.keyDownListener))))}connectedCallback(){this.filterpanelSlot=this.host.querySelector("div[slot='filterpanel']"),this.overlaySlot=this.host.querySelector("div[slot='overlay']")}componentDidLoad(){this.filterpanel&&this.filterpanelSlot&&(this.filterpanelFocustrap=i([this.filterpanel,this.filterpanelSlot],{escapeDeactivates:!1,allowOutsideClick:!0,tabbableOptions:{getShadowRoot:!0}})),this.overlay&&this.overlaySlot&&(this.overlayFocustrap=i([this.overlay,this.overlaySlot],{escapeDeactivates:!1,allowOutsideClick:!0,tabbableOptions:{getShadowRoot:!0}})),this.updateFocusTrap()}componentWillLoad(){this.initialMainSize&&(this.mainSize=this.initialMainSize)}componentDidUpdate(){this.updateFocusTrap()}disconnectedCallback(){var n,t;null===(n=this.overlayFocustrap)||void 0===n||n.deactivate(),null===(t=this.filterpanelFocustrap)||void 0===t||t.deactivate(),this.host.removeEventListener("keydown",this.keyDownListener)}handleFilterpanelApply(n){this.dsoFilterpanelApply.emit({originalEvent:n})}handleFilterpanelCancel(n){this.dsoFilterpanelCancel.emit({originalEvent:n})}render(){return n(o,Object.assign({},{[this.mainSize]:!0}),n("div",{class:"dso-map-panel",ref:n=>this.mapPanel=n},n("div",{class:"sizing-buttons"},n("span",{class:"sr-only","aria-live":"polite","aria-atomic":"true"},"breedte tekstpaneel: ",this.sizeLabelMap[this.mainSize]),n("button",{type:"button",class:"shrink",disabled:"small"===this.mainSize,onClick:this.shrinkMain},n("span",{class:"sr-only"},"Kaartpaneel smaller maken"),n("dso-icon",{icon:"chevron-left"})),n("button",{type:"button",class:"expand",disabled:"large"===this.mainSize,onClick:this.expandMain},n("span",{class:"sr-only"},"Kaartpaneel breder maken"),n("dso-icon",{icon:"chevron-right"}))),n("div",{class:"main"},n("slot",{name:"main"}))),n("div",{id:"filterpanel",class:"filterpanel",hidden:!this.filterpanelOpen||!this.filterpanelSlot,ref:n=>this.filterpanel=n},n("h1",null,"Uw keuzes"),n(r,{onApply:n=>this.handleFilterpanelApply(n),onCancel:n=>this.handleFilterpanelCancel(n)}),n("slot",{name:"filterpanel"}),n(r,{onApply:n=>this.handleFilterpanelApply(n),onCancel:n=>this.handleFilterpanelCancel(n)})),n("div",{class:"map"},n("slot",{name:"map"})),n("div",{hidden:!this.overlayOpen||!this.overlaySlot,class:"dimscreen"}),n("div",{class:"overlay",hidden:!this.overlayOpen||!this.overlaySlot,ref:n=>this.overlay=n},n("button",{type:"button",class:"overlay-close-button",onClick:n=>this.dsoCloseOverlay.emit(n)},n("dso-icon",{icon:"times"}),n("span",{class:"sr-only"},"sluiten")),n("slot",{name:"overlay"}),n("button",{"aria-hidden":"true",type:"button",class:"overlay-close-button",style:{zIndex:"-100"}},n("dso-icon",{icon:"times"}),n("span",{class:"sr-only"},"sluiten"))))}get host(){return s(this)}static get watchers(){return{mainSize:["mainSizeWatcher"]}}};a.style="*,\n*::after,\n*::before {\n box-sizing: border-box;\n}\n\n:host {\n display: flex;\n height: 100vh;\n overflow: hidden;\n position: relative;\n}\n\n:host([small]) .dso-map-panel {\n flex-basis: 375px;\n min-width: 0;\n max-width: 375px;\n}\n@media screen and (max-width: 375px) {\n :host([small]) .dso-map-panel {\n flex-basis: 100vw;\n max-width: 100vw;\n min-width: 0;\n transition: none;\n }\n}\n\n:host([medium]) .dso-map-panel {\n flex-basis: 624px;\n min-width: 375px;\n max-width: 624px;\n}\n@media screen and (max-width: 624px) {\n :host([medium]) .dso-map-panel {\n flex-basis: 100vw;\n max-width: 100vw;\n min-width: 375px;\n transition: none;\n }\n}\n\n:host([large]) .dso-map-panel {\n flex-basis: 60%;\n min-width: 768px;\n max-width: 1024px;\n}\n@media screen and (max-width: 768px) {\n :host([large]) .dso-map-panel {\n flex-basis: 100vw;\n max-width: 100vw;\n min-width: 768px;\n transition: none;\n }\n}\n\nbutton {\n -webkit-appearance: button;\n color: inherit;\n cursor: pointer;\n font: inherit;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n margin: 0;\n overflow: visible;\n text-transform: none;\n}\nbutton[disabled] {\n cursor: default;\n}\nbutton::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n}\n\n.shrink,\n.expand,\n.overlay-close-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n border: 0;\n color: #39870c;\n line-height: 1;\n padding: 0;\n background-color: transparent;\n}\n.shrink:focus, .shrink:focus-visible,\n.expand:focus,\n.expand:focus-visible,\n.overlay-close-button:focus,\n.overlay-close-button:focus-visible {\n outline-offset: 2px;\n}\n.shrink:active,\n.expand:active,\n.overlay-close-button:active {\n outline: 0;\n}\n.shrink[disabled],\n.expand[disabled],\n.overlay-close-button[disabled] {\n color: #afcf9d;\n}\n.shrink[disabled].dso-spinner-left, .shrink[disabled].dso-spinner-right,\n.expand[disabled].dso-spinner-left,\n.expand[disabled].dso-spinner-right,\n.overlay-close-button[disabled].dso-spinner-left,\n.overlay-close-button[disabled].dso-spinner-right {\n color: #39870c;\n}\n.shrink:not([disabled]):hover,\n.expand:not([disabled]):hover,\n.overlay-close-button:not([disabled]):hover {\n color: #275937;\n text-decoration: underline;\n text-underline-position: under;\n}\n.shrink:not([disabled]):active,\n.expand:not([disabled]):active,\n.overlay-close-button:not([disabled]):active {\n color: #173521;\n}\n.shrink.btn-align,\n.expand.btn-align,\n.overlay-close-button.btn-align {\n line-height: calc(1.5em - 1px);\n padding: 11px 0;\n position: relative;\n}\n.shrink.dso-spinner-left::before,\n.expand.dso-spinner-left::before,\n.overlay-close-button.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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-right: 8px;\n}\n.shrink.dso-spinner-right::after,\n.expand.dso-spinner-right::after,\n.overlay-close-button.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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-left: 8px;\n}\n.shrink dso-icon + span:not(.sr-only),\n.shrink svg.di + span:not(.sr-only),\n.shrink span:not(.sr-only) + dso-icon,\n.shrink span:not(.sr-only) + svg.di,\n.expand dso-icon + span:not(.sr-only),\n.expand svg.di + span:not(.sr-only),\n.expand span:not(.sr-only) + dso-icon,\n.expand span:not(.sr-only) + svg.di,\n.overlay-close-button dso-icon + span:not(.sr-only),\n.overlay-close-button svg.di + span:not(.sr-only),\n.overlay-close-button span:not(.sr-only) + dso-icon,\n.overlay-close-button span:not(.sr-only) + svg.di {\n margin-left: 8px;\n}\n.shrink svg.di.di-chevron-down + span:not(.sr-only),\n.shrink svg.di.di-chevron-up + span:not(.sr-only),\n.shrink span:not(.sr-only) + svg.di.di-chevron-down,\n.shrink span:not(.sr-only) + svg.di.di-chevron-up,\n.expand svg.di.di-chevron-down + span:not(.sr-only),\n.expand svg.di.di-chevron-up + span:not(.sr-only),\n.expand span:not(.sr-only) + svg.di.di-chevron-down,\n.expand span:not(.sr-only) + svg.di.di-chevron-up,\n.overlay-close-button svg.di.di-chevron-down + span:not(.sr-only),\n.overlay-close-button svg.di.di-chevron-up + span:not(.sr-only),\n.overlay-close-button span:not(.sr-only) + svg.di.di-chevron-down,\n.overlay-close-button span:not(.sr-only) + svg.di.di-chevron-up {\n margin-left: 4px;\n}\n.shrink dso-icon[icon=chevron-left] + span:not(.sr-only),\n.shrink dso-icon[icon=chevron-right] + span:not(.sr-only),\n.shrink svg.di.di-angle-down + span:not(.sr-only),\n.shrink svg.di.di-angle-up + span:not(.sr-only),\n.shrink span:not(.sr-only) + svg.di.di-angle-down,\n.shrink span:not(.sr-only) + svg.di.di-angle-up,\n.shrink span:not(.sr-only) + dso-icon[icon=chevron-left],\n.shrink span:not(.sr-only) + dso-icon[icon=chevron-right],\n.expand dso-icon[icon=chevron-left] + span:not(.sr-only),\n.expand dso-icon[icon=chevron-right] + span:not(.sr-only),\n.expand svg.di.di-angle-down + span:not(.sr-only),\n.expand svg.di.di-angle-up + span:not(.sr-only),\n.expand span:not(.sr-only) + svg.di.di-angle-down,\n.expand span:not(.sr-only) + svg.di.di-angle-up,\n.expand span:not(.sr-only) + dso-icon[icon=chevron-left],\n.expand span:not(.sr-only) + dso-icon[icon=chevron-right],\n.overlay-close-button dso-icon[icon=chevron-left] + span:not(.sr-only),\n.overlay-close-button dso-icon[icon=chevron-right] + span:not(.sr-only),\n.overlay-close-button svg.di.di-angle-down + span:not(.sr-only),\n.overlay-close-button svg.di.di-angle-up + span:not(.sr-only),\n.overlay-close-button span:not(.sr-only) + svg.di.di-angle-down,\n.overlay-close-button span:not(.sr-only) + svg.di.di-angle-up,\n.overlay-close-button span:not(.sr-only) + dso-icon[icon=chevron-left],\n.overlay-close-button span:not(.sr-only) + dso-icon[icon=chevron-right] {\n margin-left: 0;\n}\n.shrink dso-icon,\n.shrink svg.di,\n.shrink span,\n.expand dso-icon,\n.expand svg.di,\n.expand span,\n.overlay-close-button dso-icon,\n.overlay-close-button svg.di,\n.overlay-close-button span {\n vertical-align: middle;\n}\n.shrink:hover,\n.expand:hover,\n.overlay-close-button:hover {\n cursor: pointer;\n}\n.shrink[disabled],\n.expand[disabled],\n.overlay-close-button[disabled] {\n display: none;\n}\n\n.overlay-close-button {\n position: absolute;\n top: 8px;\n right: 16px;\n}\n\n.dso-map-panel {\n background-color: #fff;\n box-shadow: 2px 0 8px 0 rgba(0, 0, 0, 0.4);\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 8px;\n position: relative;\n transition: flex-basis 200ms ease-in, max-width 200ms ease-in, min-width 200ms ease-in;\n z-index: 100;\n}\n.dso-map-panel .dso-filterblok-address {\n font-weight: bold;\n margin: 8px 0;\n}\n.dso-map-panel .main {\n height: 100%;\n overflow-y: scroll;\n padding: 0 16px 8px;\n}\n\n.sizing-buttons {\n left: calc(100% + 1px);\n overflow-x: hidden;\n padding: 0 4px 4px 0;\n position: absolute;\n top: 16px;\n transition: left 200ms ease-in;\n width: 44px;\n z-index: -1;\n}\n.sizing-buttons button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n border: 0;\n padding: 8px;\n border-radius: 0;\n border-bottom-right-radius: 4px;\n border-top-right-radius: 4px;\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.4);\n flex: 0 0 100%;\n height: 40px;\n min-width: auto;\n width: 40px;\n}\n.sizing-buttons button:focus, .sizing-buttons button:focus-visible {\n outline-offset: 2px;\n}\n.sizing-buttons button:active {\n outline: 0;\n}\n.sizing-buttons button:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.sizing-buttons button:active {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.sizing-buttons button[disabled], .sizing-buttons button[disabled]:hover {\n background-color: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\n.sizing-buttons button.btn-sm {\n line-height: 1rem;\n}\n.sizing-buttons button.btn-sm dso-icon,\n.sizing-buttons button.btn-sm svg.di, .sizing-buttons button.btn-sm.extern::after, .sizing-buttons button.btn-sm.download::after, .sizing-buttons button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.sizing-buttons button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.sizing-buttons button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.sizing-buttons button > span {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n}\n.sizing-buttons button.dso-spinner-left[disabled], .sizing-buttons button.dso-spinner-right[disabled] {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n}\n.sizing-buttons button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.sizing-buttons button.dso-spinner-left:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.sizing-buttons button.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 16px;\n}\n.sizing-buttons button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.sizing-buttons button.dso-spinner-right:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.sizing-buttons button.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\n.sizing-buttons button:focus-visible {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n outline: none;\n}\n.sizing-buttons button:hover dso-icon {\n color: #fff;\n}\n\n.map {\n height: 100%;\n width: 100%;\n overflow: hidden;\n}\n\n.filterpanel,\n.overlay {\n background-color: #fff;\n height: 100%;\n overflow-y: auto;\n position: absolute;\n z-index: 101;\n}\n\n.filterpanel {\n box-shadow: 2px 0 5px #666;\n padding: 8px 16px;\n left: 0;\n max-width: 896px;\n width: calc(100vw - 40px);\n}\n@media screen and (max-width: 768px) {\n .filterpanel {\n width: 100vw;\n }\n .filterpanel::before {\n display: none !important;\n }\n}\n.filterpanel h1 {\n color: #275937;\n margin-block-end: 16px;\n margin-block-start: 24px;\n font-size: 2rem;\n font-weight: 700;\n}\n.filterpanel::before {\n content: \"\";\n display: block;\n position: fixed;\n top: 0;\n bottom: 0;\n right: 0;\n left: 896px;\n background-color: rgba(0, 0, 0, 0.5);\n}\n@media screen and (max-width: 936px) {\n .filterpanel::before {\n left: auto;\n width: 40px;\n }\n}\n\n.overlay {\n box-shadow: -2px 0 5px #666;\n padding: 40px 16px 8px;\n right: 0;\n width: 624px;\n}\n@media screen and (max-width: 624px) {\n .overlay {\n width: 100vw;\n }\n}\n\n.dimscreen {\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 624px;\n background-color: rgba(0, 0, 0, 0.5);\n z-index: 102;\n}\n\n.filterpanel-buttons {\n text-align: right;\n}\n.filterpanel-buttons .cancel-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n line-height: 1rem;\n}\n.filterpanel-buttons .cancel-button:focus, .filterpanel-buttons .cancel-button:focus-visible {\n outline-offset: 2px;\n}\n.filterpanel-buttons .cancel-button:active {\n outline: 0;\n}\n.filterpanel-buttons .cancel-button:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.filterpanel-buttons .cancel-button:active {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.filterpanel-buttons .cancel-button[disabled], .filterpanel-buttons .cancel-button[disabled]:hover {\n background-color: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\n.filterpanel-buttons .cancel-button.btn-sm {\n line-height: 1rem;\n}\n.filterpanel-buttons .cancel-button.btn-sm dso-icon,\n.filterpanel-buttons .cancel-button.btn-sm svg.di, .filterpanel-buttons .cancel-button.btn-sm.extern::after, .filterpanel-buttons .cancel-button.btn-sm.download::after, .filterpanel-buttons .cancel-button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.filterpanel-buttons .cancel-button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button dso-icon,\n.filterpanel-buttons .cancel-button svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\n.filterpanel-buttons .cancel-button span + dso-icon,\n.filterpanel-buttons .cancel-button span + svg.di {\n margin-left: 8px;\n margin-right: -8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-left[disabled], .filterpanel-buttons .cancel-button.dso-spinner-right[disabled] {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n}\n.filterpanel-buttons .cancel-button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-left:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-right:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button dso-icon,\n.filterpanel-buttons .cancel-button svg.di, .filterpanel-buttons .cancel-button.extern::after, .filterpanel-buttons .cancel-button.download::after, .filterpanel-buttons .cancel-button.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .apply-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n line-height: 1rem;\n}\n.filterpanel-buttons .apply-button:focus, .filterpanel-buttons .apply-button:focus-visible {\n outline-offset: 2px;\n}\n.filterpanel-buttons .apply-button:active {\n outline: 0;\n}\n.filterpanel-buttons .apply-button:hover {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.filterpanel-buttons .apply-button:active {\n background-color: #173521;\n border-color: #173521;\n color: #fff;\n}\n.filterpanel-buttons .apply-button[disabled], .filterpanel-buttons .apply-button[disabled]:hover {\n background-color: #afcf9d;\n border-color: #afcf9d;\n color: #fff;\n}\n.filterpanel-buttons .apply-button.btn-sm {\n line-height: 1rem;\n}\n.filterpanel-buttons .apply-button.btn-sm dso-icon,\n.filterpanel-buttons .apply-button.btn-sm svg.di, .filterpanel-buttons .apply-button.btn-sm.extern::after, .filterpanel-buttons .apply-button.btn-sm.download::after, .filterpanel-buttons .apply-button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.filterpanel-buttons .apply-button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .apply-button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .apply-button dso-icon,\n.filterpanel-buttons .apply-button svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\n.filterpanel-buttons .apply-button span + dso-icon,\n.filterpanel-buttons .apply-button span + svg.di {\n margin-left: 8px;\n margin-right: -8px;\n}\n.filterpanel-buttons .apply-button.dso-spinner-left[disabled], .filterpanel-buttons .apply-button.dso-spinner-right[disabled] {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.filterpanel-buttons .apply-button.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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.filterpanel-buttons .apply-button.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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.filterpanel-buttons .apply-button dso-icon,\n.filterpanel-buttons .apply-button svg.di, .filterpanel-buttons .apply-button.extern::after, .filterpanel-buttons .apply-button.download::after, .filterpanel-buttons .apply-button.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.filterpanel-buttons .apply-button.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .apply-button.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.filterpanel-buttons .cancel-button + .apply-button {\n margin-left: 16px;\n}";export{a as dso_viewer_grid}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as s,h as e,H as i,g as n}from"./p-98fd1658.js";import{c as o}from"./p-4b8535b7.js";const a=class{constructor(e){t(this,e),this.dsoToggleSection=s(this,"dsoToggleSection",7),this.dsoToggleSectionAnimationEnd=s(this,"dsoToggleSectionAnimationEnd",7),this.variant="default",this.reverseAlign=!1,this.allowMultipleOpen=!1;const{state:i}=o({variant:this.variant||"default",reverseAlign:this.reverseAlign,allowMultipleOpen:this.allowMultipleOpen});this.accordionState=i}updateVariant(t="default"){this.accordionState.variant=t||"default"}updateReverseAlign(t){this.accordionState.reverseAlign=t}updateAllowMultipleOpen(t){if(this.accordionState.allowMultipleOpen=t,!t){const t=Array.from(this.host.querySelectorAll(":scope > dso-accordion-section[open]"));t.shift(),t.forEach((t=>this.controlOpenAttribute(t,!1)))}}async getState(){return this.accordionState}async toggleSection(t,s){const e=Array.from(this.host.querySelectorAll(":scope > dso-accordion-section"));if("number"==typeof t){const s=e[t];s instanceof HTMLElement&&(t=s)}if(!(t instanceof HTMLElement&&e.includes(t)))return;const i=this.isSectionOpen(t);return this.allowMultipleOpen?(this.controlOpenAttribute(t,!i),this.emitToggleEvent(t,e,s),!i):i?(this.controlOpenAttribute(t,!1),this.emitToggleEvent(t,e,s),!1):(await this.closeOpenSections(),this.controlOpenAttribute(t,!0),this.emitToggleEvent(t,e,s),!0)}async animationEnd(t){this.dsoToggleSectionAnimationEnd.emit({section:{element:t,open:this.isSectionOpen(t)}})}async closeOpenSections(){Array.from(this.host.querySelectorAll(":scope > dso-accordion-section")).filter((t=>this.isSectionOpen(t))).forEach((t=>this.controlOpenAttribute(t,!1)))}componentWillLoad(){this.accordionState.variant!==this.variant&&(this.accordionState.variant=this.variant||"default"),this.accordionState.reverseAlign!==this.reverseAlign&&(this.accordionState.reverseAlign=this.reverseAlign),this.accordionState.allowMultipleOpen!==this.allowMultipleOpen&&(this.accordionState.allowMultipleOpen=this.allowMultipleOpen)}render(){return e(i,{class:{"dso-accordion":!0}},e("slot",null))}emitToggleEvent(t,s,e){this.dsoToggleSection.emit({originalEvent:e,section:{element:t,open:this.isSectionOpen(t)},sections:s})}isSectionOpen(t){return"string"==typeof t.getAttribute("open")}controlOpenAttribute(t,s){s?t.setAttribute("open",""):t.removeAttribute("open")}get host(){return n(this)}static get watchers(){return{variant:["updateVariant"],reverseAlign:["updateReverseAlign"],allowMultipleOpen:["updateAllowMultipleOpen"]}}};a.style=":host{display:block}*,*::after,*::before{box-sizing:border-box}";export{a as dso_accordion}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as o,c as t,h as s,g as r}from"./p-98fd1658.js";import{c as e}from"./p-6a1980b4.js";import{d as i}from"./p-1805f5b0.js";const n=new ResizeObserver(i((o=>o.forEach((o=>{var t;return null===(t=function({target:o}){return o.parentNode instanceof ShadowRoot&&a(o.parentNode.host)?o.parentNode.host:o.parentElement&&a(o.parentElement)?o.parentElement:void 0}(o))||void 0===t?void 0:t._setScrollState()}))),50));function a(o){return"DSO-SCROLLABLE"===o.tagName&&"_setScrollState"in o}const l=class{constructor(s){o(this,s),this.dsoScrollEnd=t(this,"dsoScrollEnd",7),this.mutationObserver=new MutationObserver((o=>o.forEach((({target:o})=>{var t;(null===(t=o.parentElement)||void 0===t?void 0:t.closest("dso-scrollable"))===this.host&&this._setScrollState()})))),this.scrollPosition="noScroll"}async _setScrollState(){const o=this.getScrollPosition();this.scrollPosition!==o&&(this.scrollPosition=o,"top"!==this.scrollPosition&&"bottom"!==this.scrollPosition||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;return o<=t?"noScroll":0===s?"top":o-s-t<1?"bottom":s>0?"middle":"noScroll"}componentDidLoad(){this.mutationObserver.observe(this.host,{characterData:!0,attributes:!1,childList:!1,subtree:!0}),this.scrollContainerDiv instanceof HTMLDivElement&&n.observe(this.scrollContainerDiv),this.slottedElements.forEach((o=>n.observe(o)))}disconnectedCallback(){this.scrollContainerDiv instanceof HTMLDivElement&&n.unobserve(this.scrollContainerDiv),this.mutationObserver.disconnect(),this.slottedElements.forEach((o=>n.unobserve(o)))}render(){return s("div",{class:"dso-shadow-container"},s("div",{ref:o=>this.scrollContainerDiv=o,class:e("dso-scroll-container",{[`dso-scroll-${this.scrollPosition}`]:"noScroll"!==this.scrollPosition}),onScroll:()=>this._setScrollState()},s("slot",null)))}get host(){return r(this)}};l.style=':host{display:block;height:100%;overflow-y:hidden}*,*::after,*::before{box-sizing:border-box}.dso-shadow-container{height:100%;position:relative}.dso-shadow-container .dso-scroll-container{height:100%;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;height:24px;left:0;opacity:0;overflow:visible;position:absolute;transition:opacity 150ms ease-in-out;width:100%}.dso-shadow-container .dso-scroll-container::before{background-image:linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));top: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));bottom: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}';export{l as dso_scrollable}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as o,c as t,h as n}from"./p-98fd1658.js";import{A as e}from"./p-89b97fce.js";import"./p-4b8535b7.js";const s=class{constructor(n){o(this,n),this.dsoToggle=t(this,"dsoToggle",3),this.identifier=void 0,this.annotationPrefix=void 0}async toggleAnnotation(o,t){e.toggle(t);const n=e.state[this.identifier];if(void 0===n)throw new Error(`No state found for ${this.identifier}`);this.dsoToggle.emit({originalEvent:o,open:n})}toggleHandler(o){this.toggleAnnotation(o,this.identifier)}render(){return n("dso-responsive-element",null,n("dso-expandable",Object.assign({id:this.identifier},e.state[this.identifier]?{open:!0}:{}),n("div",{slot:"expandable-content"},this.annotationPrefix&&n("span",{class:"dso-annotation-prefix"},this.annotationPrefix),n("div",{class:"dso-annotation-header"},n("slot",{name:"title"}),n("slot",{name:"addons"}),n("button",{type:"button",class:"dso-tertiary dso-annotation-close-button",onClick:o=>this.toggleHandler(o)},n("dso-icon",{icon:"times"}),n("span",{class:"sr-only"},"Toelichting sluiten"))),n("div",{class:"dso-annotation-content"},n("slot",null)))))}};s.style="*,*::after,*::before{box-sizing:border-box}dso-annotation-output{display:block}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-annotation-header{align-items:center;background-color:#f2f2f2;clear:both;display:flex;margin-bottom:2px;margin-top:8px;padding-left:16px;padding-right:8px;padding-top:8px;padding-bottom:8px}.dso-annotation-header>*[slot=title]{color:#000;font-size:1.25rem;margin-bottom:0;margin-top:0}.dso-annotation-header>*:nth-child(2){margin-left:auto}dso-responsive-element[small] .dso-annotation-header,dso-responsive-element[medium] .dso-annotation-header{display:grid;row-gap:8px}dso-responsive-element[small] .dso-annotation-header *[slot=title],dso-responsive-element[medium] .dso-annotation-header *[slot=title]{grid-row:1;grid-column:1}dso-responsive-element[small] .dso-annotation-header *[slot=addons],dso-responsive-element[medium] .dso-annotation-header *[slot=addons]{grid-row:2;grid-column:1;margin-left:initial}dso-responsive-element[small] .dso-annotation-header .dso-annotation-close-button,dso-responsive-element[medium] .dso-annotation-header .dso-annotation-close-button{grid-row:1;grid-column:2;margin-left:8px;text-align:end}.dso-annotation-content{background-color:#f2f2f2;padding-left:16px;padding-right:8px;padding-top:8px;padding-bottom:8px}.dso-annotation-close-button{margin-left:32px}.dso-annotation-prefix{font-style:italic}";export{s as dso_annotation_output}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as n,c as t,h as o,H as e}from"./p-98fd1658.js";import{t as r}from"./p-85b18dbd.js";var i,s,a=function(n,t,o,e){if("a"===o&&!e)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?n!==t||!e:!t.has(n))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===o?e:"a"===o?e.call(n):e?e.value:t.get(n)},l=function(n,t,o,e,r){if("m"===e)throw new TypeError("Private method is not writable");if("a"===e&&!r)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?n!==t||!r:!t.has(n))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===e?r.call(n,o):r?r.value=o:t.set(n,o),o};const d=class{constructor(o){n(this,o),this.dsoZoomIn=t(this,"dsoZoomIn",7),this.dsoZoomOut=t(this,"dsoZoomOut",7),this.dsoToggle=t(this,"dsoToggle",7),this.panelTitle="Kaartlagen",i.set(this,void 0),s.set(this,void 0),this.open=!1,this.disableZoom=void 0,this.hideContent=!this.open}watchOpen(n){n?(this.hideContent=!1,setTimeout((()=>{var n;return null===(n=a(this,i,"f"))||void 0===n?void 0:n.focus()}),r)):setTimeout((()=>{var n;this.hideContent=!0,null===(n=a(this,s,"f"))||void 0===n||n.focus()}),r)}async toggleVisibility(n){this.open=!this.open,this.dsoToggle.emit({originalEvent:n,open:this.open})}render(){return o(e,null,o("button",{type:"button",id:"toggle-visibility-button",class:"toggle-visibility-button",onClick:n=>this.toggleVisibility(n),ref:n=>l(this,s,n,"f")},o("dso-icon",{icon:"layers"}),o("span",null,"Kaartlagen")),o("div",{class:"zoom-buttons"},o("button",{type:"button",onClick:n=>this.dsoZoomIn.emit(n),disabled:"in"===this.disableZoom||"both"===this.disableZoom},o("span",null,"Zoom in"),o("dso-icon",{icon:"plus"})),o("button",{type:"button",onClick:n=>this.dsoZoomOut.emit(n),disabled:"out"===this.disableZoom||"both"===this.disableZoom},o("span",null,"Zoom uit"),o("dso-icon",{icon:"minus"}))),o("section",{hidden:this.hideContent},o("header",null,o("h2",null,this.panelTitle),o("button",{type:"button",class:"close-button",onClick:n=>this.toggleVisibility(n),ref:n=>l(this,i,n,"f")},o("span",null,"Verberg paneel ",this.panelTitle),o("dso-icon",{icon:"times"}))),o("dso-scrollable",null,o("div",{class:"content"},o("slot",null)))))}static get watchers(){return{open:["watchOpen"]}}};i=new WeakMap,s=new WeakMap,d.style=":host {\n background-color: #fff;\n border: 1px solid #ccc;\n bottom: 0;\n display: block;\n font-family: Asap, sans-serif;\n position: absolute;\n top: 0;\n left: 100%;\n transition: transform 300ms ease;\n width: 300px;\n}\n\n*,\n*::after,\n*::before {\n box-sizing: border-box;\n}\n\n:host([open]) {\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3);\n transform: translateX(-100%);\n}\n:host([open]) .toggle-visibility-button {\n display: none;\n}\n\nbutton {\n -webkit-appearance: button;\n color: inherit;\n cursor: pointer;\n font: inherit;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n margin: 0;\n overflow: visible;\n text-transform: none;\n}\nbutton[disabled] {\n cursor: default;\n}\nbutton::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n\n.toggle-visibility-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n border: 0;\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);\n font-weight: 600;\n margin-right: 16px;\n padding: 8px 16px;\n white-space: nowrap;\n position: absolute;\n right: calc(100% + 56px);\n top: 16px;\n}\n.toggle-visibility-button:focus, .toggle-visibility-button:focus-visible {\n outline-offset: 2px;\n}\n.toggle-visibility-button:active {\n outline: 0;\n}\n.toggle-visibility-button:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.toggle-visibility-button:active {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.toggle-visibility-button[disabled], .toggle-visibility-button[disabled]:hover {\n background-color: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\n.toggle-visibility-button.btn-sm {\n line-height: 1rem;\n}\n.toggle-visibility-button.btn-sm dso-icon,\n.toggle-visibility-button.btn-sm svg.di, .toggle-visibility-button.btn-sm.extern::after, .toggle-visibility-button.btn-sm.download::after, .toggle-visibility-button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.toggle-visibility-button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.toggle-visibility-button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.toggle-visibility-button dso-icon,\n.toggle-visibility-button svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\n.toggle-visibility-button span + dso-icon,\n.toggle-visibility-button span + svg.di {\n margin-left: 8px;\n margin-right: -8px;\n}\n.toggle-visibility-button.dso-spinner-left[disabled], .toggle-visibility-button.dso-spinner-right[disabled] {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n}\n.toggle-visibility-button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.toggle-visibility-button.dso-spinner-left:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.toggle-visibility-button.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 16px;\n}\n.toggle-visibility-button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.toggle-visibility-button.dso-spinner-right:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.toggle-visibility-button.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\n.toggle-visibility-button:focus-visible {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n outline: none;\n}\n\n.zoom-buttons {\n border-radius: 4px;\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);\n display: flex;\n flex-wrap: wrap;\n flex: 0 0;\n position: absolute;\n right: calc(100% + 16px);\n top: 16px;\n}\n.zoom-buttons button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n border: 0;\n padding: 8px;\n border-radius: 0;\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n flex: 0 0 100%;\n height: 40px;\n min-width: auto;\n width: 40px;\n}\n.zoom-buttons button:focus, .zoom-buttons button:focus-visible {\n outline-offset: 2px;\n}\n.zoom-buttons button:active {\n outline: 0;\n}\n.zoom-buttons button:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.zoom-buttons button:active {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.zoom-buttons button[disabled], .zoom-buttons button[disabled]:hover {\n background-color: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\n.zoom-buttons button.btn-sm {\n line-height: 1rem;\n}\n.zoom-buttons button.btn-sm dso-icon,\n.zoom-buttons button.btn-sm svg.di, .zoom-buttons button.btn-sm.extern::after, .zoom-buttons button.btn-sm.download::after, .zoom-buttons button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.zoom-buttons button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.zoom-buttons button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.zoom-buttons button > span {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n}\n.zoom-buttons button.dso-spinner-left[disabled], .zoom-buttons button.dso-spinner-right[disabled] {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n}\n.zoom-buttons button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.zoom-buttons button.dso-spinner-left:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.zoom-buttons button.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 16px;\n}\n.zoom-buttons button.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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.zoom-buttons button.dso-spinner-right:not([disabled]):hover::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: %23fff; 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.zoom-buttons button.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\n.zoom-buttons button:focus-visible {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n outline: none;\n}\n.zoom-buttons button + button {\n border-radius: 0;\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px;\n border-top: 1px solid #ccc;\n}\n\n.close-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n border: 0;\n color: #39870c;\n line-height: 1;\n padding: 0;\n background-color: transparent;\n padding: 0;\n position: absolute;\n right: 16px;\n top: 16px;\n}\n.close-button:focus, .close-button:focus-visible {\n outline-offset: 2px;\n}\n.close-button:active {\n outline: 0;\n}\n.close-button[disabled] {\n color: #afcf9d;\n}\n.close-button[disabled].dso-spinner-left, .close-button[disabled].dso-spinner-right {\n color: #39870c;\n}\n.close-button:not([disabled]):hover {\n color: #275937;\n text-decoration: underline;\n text-underline-position: under;\n}\n.close-button:not([disabled]):active {\n color: #173521;\n}\n.close-button.btn-align {\n line-height: calc(1.5em - 1px);\n padding: 11px 0;\n position: relative;\n}\n.close-button.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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-right: 8px;\n}\n.close-button.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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-left: 8px;\n}\n.close-button > span {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n}\n\nsection:not([hidden]) {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\nheader,\n.content {\n padding: 16px;\n}\n\nheader {\n border-bottom: 1px solid #ccc;\n flex-grow: 0;\n position: relative;\n}\nheader h2 {\n color: #275937;\n font-family: \"Asap\", sans-serif;\n line-height: 1;\n margin: 0;\n}";export{d as dso_map_controls}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as s,c as t,h as i,H as e,g as l}from"./p-98fd1658.js";const r=[{width:624,alias:"large"},{width:375,alias:"medium"},{width:0,alias:"small"}],a=class{constructor(i){s(this,i),this.dsoSizeChange=t(this,"dsoSizeChange",7),this.observer=new ResizeObserver((([s])=>{var t,i;if(!s)throw new Error("No entry found");const e=null!==(i=null===(t=r.find((t=>s.contentRect.width>=t.width)))||void 0===t?void 0:t.alias)&&void 0!==i?i:r[0].alias;this.sizeAlias=e,this.dsoSizeChange.emit(e)})),this.sizeAlias=r[0].alias,this.sizeWidth=0}async getSize(){return this.sizeAlias}componentWillLoad(){this.observer.observe(this.host)}disconnectedCallback(){this.observer.unobserve(this.host)}render(){return i(e,{small:"small"===this.sizeAlias,medium:"medium"===this.sizeAlias,large:"large"===this.sizeAlias},i("slot",null))}get host(){return l(this)}};a.style=":host{display:block}";export{a as dso_responsive_element}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,h as o,H as i,g as e}from"./p-98fd1658.js";import{d as r,h as a,c as s,b as n}from"./p-452b1234.js";import{c as p}from"./p-6a1980b4.js";import{d as l}from"./p-1805f5b0.js";var h,d={name:"maxSize",enabled:!0,phase:"main",requiresIfExists:["offset","preventOverflow","flip"],fn:function(t){var o=t.state,i=t.name,e=r(o,t.options),a=o.modifiersData.preventOverflow||{x:0,y:0},s=a.x,n=a.y,p=o.rects.popper,l=p.width,h=p.height,d=o.placement.split("-")[0];o.modifiersData[i]={width:l-e["left"===d?"left":"right"]-s,height:h-e["top"===d?"top":"bottom"]-n}}},c=function(t,o,i,e,r){if("m"===e)throw new TypeError("Private method is not writable");if("a"===e&&!r)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof o?t!==o||!r:!o.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===e?r.call(t,i):r?r.value=i:o.set(t,i),i};const f={name:"applyMaxSize",enabled:!0,phase:n,requires:["maxSize"],fn({state:t}){let{width:o}=t.modifiersData.maxSize;o<160&&(o=160),t.styles.popper=Object.assign(Object.assign({},t.styles.popper),{maxWidth:`${o}px`})}},m=class{constructor(o){t(this,o),this.callbacks={activate:()=>this.active=!0,deactivate:()=>this.active=!1},this.onMouseLeave=()=>{var t;this.element.matches(":hover")||(null===(t=this.target)||void 0===t?void 0:t.matches(":hover"))||this.callbacks.deactivate()},this.keyDownListener=t=>{"Escape"===t.key&&this.deactivate()},this.deactivatePopper=l((()=>{var t;this.hidden=!0,null===(t=this.popper)||void 0===t||t.destroy(),this.popper=void 0}),150),h.set(this,void 0),this.descriptive=!1,this.position="top",this.strategy="auto",this.noArrow=!1,this.stateless=void 0,this.small=void 0,this.active=!1,this.hidden=!0}async activate(){this.active=!0}async deactivate(){this.active=!1}watchPosition(){this.popper&&this.popper.setOptions({placement:this.position})}watchStrategy(){this.setStrategy()}setStrategy(){if(!this.popper)return;if("absolute"===this.strategy||"fixed"===this.strategy)return void this.popper.setOptions({strategy:this.strategy});let t=this.element;for(;t&&t.parentNode!==document;)if(t=t.parentNode instanceof ShadowRoot?t.parentNode.host:t.parentElement,null!==t&&a(t))return void this.popper.setOptions({strategy:"fixed"});this.popper.setOptions({strategy:"absolute"})}watchActive(){this.active?(this.activatePopper(),this.stateless||setTimeout((()=>{var t;null===(t=this.popper)||void 0===t||t.setOptions({modifiers:[{name:"eventListeners",enabled:!0}]}),document.addEventListener("keydown",this.keyDownListener)}))):(document.removeEventListener("keydown",this.keyDownListener),this.deactivatePopper())}listenClick(t){t.stopPropagation()}componentDidLoad(){var t;if(!((null===(t=this.element.shadowRoot)||void 0===t?void 0:t.querySelector(".tooltip"))instanceof HTMLElement))throw new Error("tooltip element is not instanceof HTMLElement");!this.stateless&&this.target&&(this.target.addEventListener("mouseenter",this.callbacks.activate),[this.element,this.target].forEach((t=>t.addEventListener("mouseleave",this.onMouseLeave))),this.target.addEventListener("focus",this.callbacks.activate),this.target.addEventListener("blur",this.callbacks.deactivate))}disconnectedCallback(){var t;null===(t=this.popper)||void 0===t||t.destroy(),!this.stateless&&this.target&&(this.target.removeEventListener("mouseenter",this.callbacks.activate),[this.element,this.target].forEach((t=>t.removeEventListener("mouseleave",this.onMouseLeave))),this.target.removeEventListener("focus",this.callbacks.activate),this.target.removeEventListener("blur",this.callbacks.deactivate)),this.target=void 0}componentDidRender(){var t;this.active&&(null===(t=this.popper)||void 0===t||t.update())}render(){return o(i,{class:{hidden:this.hidden},role:"tooltip"},o("div",{class:p("tooltip",{in:this.active})},!this.noArrow&&o("div",{"data-popper-arrow":!0,class:"tooltip-arrow"}),o("div",{"aria-hidden":!this.descriptive||void 0,class:p("tooltip-inner",{"dso-small":this.small})},o("slot",null))))}activatePopper(){var t;if(this.hidden=!1,this.popper)return;const o=null===(t=this.element.shadowRoot)||void 0===t?void 0:t.querySelector(".tooltip");this.target&&o instanceof HTMLElement&&(this.popper=s(this.target,o,{placement:this.position,modifiers:[d,f,{name:"eventListeners",enabled:!1}]}),this.setStrategy())}get target(){var t;return null!==(t=function(t,o,i,e){if("a"===i&&!e)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof o?t!==o||!e:!o.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===i?e:"a"===i?e.call(t):e?e.value:o.get(t)}(this,h,"f"))&&void 0!==t?t:this.initializeTarget()}set target(t){c(this,h,t,"f")}initializeTarget(){const t=this.element.id;if(!t)return void console.warn("Unable to find reference tooltip has no [id] attribute.");const o=this.element.getRootNode();if(!(o instanceof Document||o instanceof ShadowRoot))return void console.warn("rootNode is not instance of Document or ShadowRoot");const i=o.querySelector(`[aria-describedBy="${t}`);if(i)return c(this,h,i,"f"),i;console.warn(`Unable to find reference with aria-describedby ${t}`)}get element(){return e(this)}static get watchers(){return{position:["watchPosition"],strategy:["watchStrategy"],active:["watchActive"]}}};h=new WeakMap,m.style=":host(.hidden){visibility:hidden}:host-context(dso-toggletip){color:red !important}:host-context(dso-toggletip) *[data-popper-placement=top] .tooltip-arrow{margin-left:3px}:host-context(dso-toggletip) *[data-popper-placement=right] .tooltip-arrow{margin-top:0}:host-context(dso-toggletip) *[data-popper-placement=bottom] .tooltip-arrow{margin-left:3px}:host-context(dso-toggletip) *[data-popper-placement=left]{margin-right:-8px !important}:host-context(dso-toggletip) *[data-popper-placement=left] .tooltip-arrow{margin-top:0}*,*::after,*::before{box-sizing:border-box}.tooltip{font-family:Asap, sans-serif;font-style:normal;font-weight:400;line-height:1.5;line-break:auto;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;word-spacing:normal;word-wrap:normal;white-space:normal;display:block;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));font-size:14px;opacity:0;position:absolute;transition:opacity 0.15s linear;z-index:410}.tooltip.in{opacity:1}.tooltip .tooltip-inner{background-color:#fff;border-radius:4px;color:#191919;display:inline-block;font-size:1rem;max-width:640px;padding:8px 16px;position:relative}.tooltip .tooltip-inner.dso-small{max-width:320px}.tooltip .tooltip-arrow{border-color:transparent;border-style:solid;height:0;width:0}.tooltip[data-popper-placement=top]{margin-top:-3px;padding:6px 0}.tooltip[data-popper-placement=top] .tooltip-arrow{border-top-color:#fff;border-width:6px 6px 0;bottom:0}.tooltip[data-popper-placement=top] .tooltip-arrow{margin-left:-3px}.tooltip[data-popper-placement=right]{margin-left:3px;padding:0 6px}.tooltip[data-popper-placement=right] .tooltip-arrow{border-right-color:#fff;border-width:6px 6px 6px 0;left:0}.tooltip[data-popper-placement=right] .tooltip-arrow{margin-top:-3px}.tooltip[data-popper-placement=bottom]{margin-top:3px;padding:6px 0}.tooltip[data-popper-placement=bottom] .tooltip-arrow{border-bottom-color:#fff;border-width:0 6px 6px;top:0}.tooltip[data-popper-placement=bottom] .tooltip-arrow{margin-left:-3px}.tooltip[data-popper-placement=left]{margin-left:-3px;padding:0 6px}.tooltip[data-popper-placement=left] .tooltip-arrow{border-left-color:#fff;border-width:6px 0 6px 6px;right:0}.tooltip[data-popper-placement=left] .tooltip-arrow{margin-top:-3px}";export{m as dso_tooltip}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{h as e,r as t,c as s,H as i,g as o}from"./p-98fd1658.js";import{c as d}from"./p-6c543986.js";var a;function n(e){if(!e)return;const t=e.split("-");return 3===t.length&&"string"==typeof t[0]&&"string"==typeof t[1]&&"string"==typeof t[2]&&4===t[2].length?function(e,t,s){const i=parseInt(s,10),o=parseInt(t,10),d=parseInt(e,10);if(Number.isInteger(d)&&Number.isInteger(o)&&Number.isInteger(i)&&o>0&&o<=12&&i>0&&i<=31&&d>0)return new Date(d,o-1,i)}(t[2],t[1],t[0]):void 0}function r(e){return e?`${e.getDate().toString(10).padStart(2,"0")}-${(e.getMonth()+1).toString(10).padStart(2,"0")}-${e.getFullYear().toString(10).padStart(2,"0")}`:""}function c(e,t){return!(!e||!t)&&e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate()}function l(e,t){const s=new Date(e);return s.setDate(s.getDate()+t),s}function h(e,t=a.Monday){const s=new Date(e),i=s.getDay(),o=(i<t?7:0)+i-t;return s.setDate(s.getDate()-o),s}function p(e,t=a.Monday){const s=new Date(e),i=s.getDay(),o=6+(i<t?-7:0)-(i-t);return s.setDate(s.getDate()+o),s}function u(e){return new Date(e.getFullYear(),e.getMonth(),1)}function _(e){return new Date(e.getFullYear(),e.getMonth()+1,0)}function f(e,t){const s=new Date(e);return s.setMonth(t),s}function b(e,t){const s=new Date(e);return s.setFullYear(t),s}function g(e,t,s){return m(e,t,s)===e}function m(e,t,s){const i=e.getTime();return t&&t instanceof Date&&i<t.getTime()?t:s&&s instanceof Date&&i>s.getTime()?s:e}!function(e){e[e.Sunday=0]="Sunday",e[e.Monday=1]="Monday",e[e.Tuesday=2]="Tuesday",e[e.Wednesday=3]="Wednesday",e[e.Thursday=4]="Thursday",e[e.Friday=5]="Friday",e[e.Saturday=6]="Saturday"}(a||(a={}));const k=({focusedDay:t,today:s,day:i,onDaySelect:o,onKeyboardNavigation:d,focusedDayRef:a,inRange:n})=>{const l=c(i,s),h=c(i,t),p=i.getMonth()!==t.getMonth();return e("button",{class:{"dso-date__day":!0,"is-today":l},tabIndex:h?0:-1,onClick:function(e){o(e,i)},onKeyDown:d,disabled:!n||p,type:"button",ref:e=>{h&&e&&a&&a(e)}},e("span",{"aria-hidden":"true"},i.getDate()),e("span",{class:"dso-date__vhidden"},r(i)))},x=({selectedDate:t,focusedDate:s,labelledById:i,localization:o,firstDayOfWeek:d,min:n,max:r,onDateSelect:f,onKeyboardNavigation:b,focusedDayRef:m,onMouseDown:x,onFocusIn:v})=>{const y=new Date,w=function(e,t=a.Monday){return function(e,t){const s=[];let i=e;for(;!c(i,t);)s.push(i),i=l(i,1);return s.push(i),s}(h(u(e),t),p(_(e),t))}(s,d);return e("table",{class:"dso-date__table",role:"grid","aria-labelledby":i,onFocusin:v,onMouseDown:x},e("thead",null,e("tr",null,(M=d,z=t=>e("th",{class:"dso-date__table-header",scope:"col"},e("span",{"aria-hidden":"true"},t.substr(0,2)),e("span",{class:"dso-date__vhidden"},t)),(D=o.dayNames).map(((e,t)=>{const s=D[(t+M)%D.length];if(!s)throw new Error("No item found");return z(s)}))))),e("tbody",null,function(e){const t=[];for(let s=0;s<e.length;s+=7)t.push(e.slice(s,s+7));return t}(w).map((i=>e("tr",{class:"dso-date__row"},i.map((i=>e("td",{class:"dso-date__cell",role:"gridcell","aria-selected":c(i,t)?"true":void 0,"aria-current":c(i,y)?"date":void 0},e(k,{day:i,today:y,focusedDay:s,inRange:g(i,n,r),onDaySelect:f,onKeyboardNavigation:b,focusedDayRef:m})))))))));var D,M,z},v={buttonLabel:"Kies datum",placeholder:"dd-mm-jjjj",selectedDateMessage:"Geselecteerde datum is",prevMonthLabel:"Vorige maand",nextMonthLabel:"Volgende maand",monthSelectLabel:"Maand",yearSelectLabel:"Jaar",closeLabel:"Sluiten",keyboardInstruction:"Gebruik de pijltjestoetsen om een dag te kiezen",calendarHeading:"Kies een datum",dayNames:["Zondag","Maandag","Dinsdag","Woensdag","Donderdag","Vrijdag","Zaterdag"],monthNames:["Januari","Februari","Maart","April","Mei","Juni","Juli","Augustus","September","Oktober","November","December"],monthNamesShort:["Jan","Feb","Mrt","Apr","Mei","Jun","Jul","Aug","Sep","Okt","Nov","Dec"]},y=/[^0-9-]+/g,w=class{constructor(e){t(this,e),this.dsoDateChange=s(this,"dsoDateChange",7),this.dsoBlur=s(this,"dsoBlur",7),this.dsoKeyUp=s(this,"dsoKeyUp",7),this.dsoKeyDown=s(this,"dsoKeyDown",7),this.dsoFocus=s(this,"dsoFocus",7),this.monthSelectId=d("DsoDateMonth"),this.yearSelectId=d("DsoDateYear"),this.dialogLabelId=d("DsoDateLabel"),this.localization=v,this.firstDayOfWeek=a.Monday,this.enableActiveFocus=()=>{this.activeFocus=!0},this.disableActiveFocus=()=>{this.activeFocus=!1},this.toggleOpen=e=>{e.preventDefault(),this.open?this.hide(!1):this.show()},this.handleEscKey=e=>{27===e.keyCode&&this.hide()},this.handleBlur=e=>{e.stopPropagation(),this.dsoBlur.emit({component:"dso-date-picker"})},this.handleKeyUp=e=>{e.stopPropagation(),this.dsoKeyUp.emit({component:"dso-date-picker",originalEvent:e})},this.handleKeyDown=e=>{e.stopPropagation(),this.dsoKeyDown.emit({component:"dso-date-picker",originalEvent:e})},this.handleFocus=e=>{e.stopPropagation(),this.dsoFocus.emit({component:"dso-date-picker"})},this.handleTouchStart=e=>{const t=e.changedTouches[0];if(!t)throw new Error("No touch found");this.initialTouchX=t.pageX,this.initialTouchY=t.pageY},this.handleTouchMove=e=>{e.preventDefault()},this.handleTouchEnd=e=>{var t,s;const i=e.changedTouches[0];if(!i)throw new Error("No touch found");const o=i.pageX-(null!==(t=this.initialTouchX)&&void 0!==t?t:0),d=i.pageY-(null!==(s=this.initialTouchY)&&void 0!==s?s:0),a=Math.abs(o)>=70&&Math.abs(d)<=70,n=Math.abs(d)>=70&&Math.abs(o)<=70&&d>0;a?this.addMonths(o<0?1:-1):n&&(this.hide(!1),e.preventDefault()),this.initialTouchY=void 0,this.initialTouchX=void 0},this.handleNextMonthClick=e=>{e.preventDefault(),this.addMonths(1)},this.handlePreviousMonthClick=e=>{e.preventDefault(),this.addMonths(-1)},this.handleFirstFocusableKeydown=e=>{var t;9===e.keyCode&&e.shiftKey&&(null===(t=this.focusedDayNode)||void 0===t||t.focus(),e.preventDefault())},this.handleKeyboardNavigation=e=>{var t;if(9===e.keyCode&&!e.shiftKey)return e.preventDefault(),void(null===(t=this.firstFocusableElement)||void 0===t||t.focus());let s=!0;switch(e.keyCode){case 39:this.addDays(1);break;case 37:this.addDays(-1);break;case 40:this.addDays(7);break;case 38:this.addDays(-7);break;case 33:e.shiftKey?this.addYears(-1):this.addMonths(-1);break;case 34:e.shiftKey?this.addYears(1):this.addMonths(1);break;case 36:this.startOfWeek();break;case 35:this.endOfWeek();break;default:s=!1}s&&(e.preventDefault(),this.enableActiveFocus())},this.handleDaySelect=(e,t)=>{g(t,n(this.min),n(this.max))&&(t.getMonth()===this.focusedDay.getMonth()?(this.setValue(t),this.hide()):this.setFocusedDay(t))},this.handleMonthSelect=e=>{e.target instanceof HTMLSelectElement&&this.setMonth(parseInt(e.target.value,10))},this.handleYearSelect=e=>{e.target instanceof HTMLSelectElement&&this.setYear(parseInt(e.target.value,10))},this.handleInputChange=e=>{const t=function(e,t){const s=e.value,i=e.selectionStart;if(!i)return s;const o=s.slice(0,i),d=s.slice(i,s.length),a=o.replace(t,""),n=a+d.replace(t,""),r=a.length;return e.value=n,e.selectionStart=e.selectionEnd=r,n}(e.target,y);this.setValue(t)},this.prepareEvent=e=>{const t={component:"dso-date-picker",value:"",valueAsDate:void 0};if(e instanceof Date?t.valueAsDate=e:(t.value=e,t.valueAsDate=n(e)),t.valueAsDate&&(t.value=r(t.valueAsDate)),!t.valueAsDate&&this.required&&(t.error="required"),t.value&&!t.valueAsDate&&(t.error="invalid"),t.valueAsDate&&(this.min||this.max)){const e=n(this.min),s=n(this.max),i=m(t.valueAsDate,e,s);i!==t.valueAsDate&&i===e?(t.valueAsDate=void 0,t.error="min-range"):i!==t.valueAsDate&&i===s&&(t.valueAsDate=void 0,t.error="max-range")}return t},this.processFocusedDayNode=e=>{this.focusedDayNode=e,this.activeFocus&&this.open&&setTimeout((()=>e.focus()),0)},this.activeFocus=!1,this.focusedDay=new Date,this.open=!1,this.visible=!1,this.name="date",this.identifier=void 0,this.disabled=!1,this.role=null,this.direction="right",this.required=!1,this.invalid=void 0,this.dsoAutofocus=!1,this.value="",this.min=void 0,this.max=void 0}handleDocumentClick(e){if(!this.open)return;const t=e.composedPath();for(const e of t)if(e instanceof Node&&this.element.contains(e))return;this.hide(!1)}async setFocus(){var e;return null===(e=this.datePickerInput)||void 0===e?void 0:e.focus()}async show(){void 0!==this.hideTimeoutId&&clearTimeout(this.hideTimeoutId),this.visible=!0,setTimeout((()=>{this.open=!0,this.setFocusedDay(n(this.value)||new Date),void 0!==this.focusTimeoutId&&clearTimeout(this.focusTimeoutId),this.focusTimeoutId=setTimeout((()=>{var e;return null===(e=this.monthSelectNode)||void 0===e?void 0:e.focus()}),300)}))}async hide(e=!0){this.open=!1,void 0!==this.focusTimeoutId&&clearTimeout(this.focusTimeoutId),this.hideTimeoutId=setTimeout((()=>{e&&this.datePickerButton&&this.datePickerButton.focus(),this.visible=!1}),500)}addDays(e){this.setFocusedDay(l(this.focusedDay,e))}addMonths(e){this.setMonth(this.focusedDay.getMonth()+e)}addYears(e){this.setYear(this.focusedDay.getFullYear()+e)}startOfWeek(){this.setFocusedDay(h(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(p(this.focusedDay,this.firstDayOfWeek))}setMonth(e){const t=f(u(this.focusedDay),e),s=_(t),i=f(this.focusedDay,e);this.setFocusedDay(m(i,t,s))}setYear(e){const t=b(u(this.focusedDay),e),s=_(t),i=b(this.focusedDay,e);this.setFocusedDay(m(i,t,s))}setFocusedDay(e){this.focusedDay=m(e,n(this.min),n(this.max))}setValue(e){const t=this.prepareEvent(e);this.value="string"==typeof e?e:t.value,this.value!==this.previousValue&&(this.dsoDateChange.emit(t),this.previousValue=this.value)}componentWillLoad(){const e=n(this.min),t=n(this.max);e&&e>this.focusedDay&&(this.focusedDay=e),t&&t<this.focusedDay&&(this.focusedDay=t)}componentDidLoad(){const e=n(this.value);e&&(this.previousValue=this.value=r(e)),this.dsoAutofocus&&this.setFocus()}render(){var t,s;const o=n(this.value),d=o&&r(o),a=(o||this.focusedDay).getFullYear(),c=this.focusedDay.getMonth(),l=this.focusedDay.getFullYear(),h=n(this.min),p=n(this.max),u=h&&h.getMonth()===c&&h.getFullYear()===l,_=p&&p.getMonth()===c&&p.getFullYear()===l;let f=a-10,b=a+10;return h&&(f=Math.max(f,h.getFullYear())),p&&(b=Math.min(b,p.getFullYear())),e(i,null,e("div",{class:{"dso-date":!0,"dso-visible":this.visible}},e("div",{class:"dso-date__input-wrapper"},e("input",{class:"dso-date__input",value:this.value,placeholder:this.localization.placeholder,id:this.identifier,disabled:this.disabled,role:null!==(t=this.role)&&void 0!==t?t:void 0,required:!!this.required||void 0,"aria-autocomplete":"none","aria-invalid":null===(s=this.invalid)||void 0===s?void 0:s.toString(),onInput:this.handleInputChange,onFocus:this.handleFocus,onBlur:this.handleBlur,onKeyUp:this.handleKeyUp,onKeyDown:this.handleKeyDown,autoComplete:"off",ref:e=>this.datePickerInput=e}),e("button",{type:"button",class:"dso-date__toggle",onClick:this.toggleOpen,disabled:this.disabled,ref:e=>this.datePickerButton=e},e("span",{class:"dso-date__toggle-icon"},e("dso-icon",{icon:"calendar"})),e("span",{class:"dso-date__vhidden"},this.localization.buttonLabel,d&&e("span",null,", ",this.localization.selectedDateMessage," ",d)))),e("div",{class:{"dso-date__dialog":!0,"is-left":"left"===this.direction,"is-active":this.open},role:"dialog","aria-modal":"true","aria-hidden":this.open?"false":"true","aria-labelledby":this.dialogLabelId,onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,onTouchEnd:this.handleTouchEnd},e("div",{class:"dso-date__dialog-content",onKeyDown:this.handleEscKey},e("div",{class:"dso-date__vhidden dso-date__instructions","aria-live":"polite"},this.localization.keyboardInstruction),e("div",{class:"dso-date__mobile",onFocusin:this.disableActiveFocus},e("label",{class:"dso-date__mobile-heading"},this.localization.calendarHeading),e("button",{class:"dso-date__close",ref:e=>this.firstFocusableElement=e,onKeyDown:this.handleFirstFocusableKeydown,onClick:()=>this.hide(),type:"button"},e("dso-icon",{icon:"times"}),e("span",{class:"dso-date__vhidden"},this.localization.closeLabel))),e("div",{class:"dso-date__header",onFocusin:this.disableActiveFocus},e("div",null,e("h2",{id:this.dialogLabelId,class:"dso-date__vhidden","aria-live":"polite"},this.localization.monthNames[c]," ",this.focusedDay.getFullYear()),e("label",{htmlFor:this.monthSelectId,class:"dso-date__vhidden"},this.localization.monthSelectLabel),e("div",{class:"dso-date__select"},e("select",{id:this.monthSelectId,class:"dso-date__select--month",ref:e=>this.monthSelectNode=e,onChange:this.handleMonthSelect},function(e,t,s,i){if(s&&i){const{minYear:o,minMonth:d}={minYear:s.getFullYear(),minMonth:s.getMonth()},{maxYear:a,maxMonth:n}={maxYear:i.getFullYear(),maxMonth:i.getMonth()};return e.monthNames.filter(((e,s)=>o===t&&a===t?s>=d&&s>=n:o===t?s>=d:a!==t||s<=n))}if(s){const{minYear:i,minMonth:o}={minYear:s.getFullYear(),minMonth:s.getMonth()};return e.monthNames.filter(((e,s)=>i===t&&s>=o))}if(i){const{maxYear:s,maxMonth:o}={maxYear:i.getFullYear(),maxMonth:i.getMonth()};return e.monthNames.filter(((e,i)=>s===t&&i<=o))}return e.monthNames}(this.localization,a,h,p).map((t=>{const s=this.localization.monthNames.indexOf(t);return e("option",{key:t,value:s,selected:s===c},t)}))),e("div",{class:"dso-date__select-label","aria-hidden":"true"},e("span",null,this.localization.monthNamesShort[c]),e("dso-icon",{icon:"chevron-down"}))),e("label",{htmlFor:this.yearSelectId,class:"dso-date__vhidden"},this.localization.yearSelectLabel),e("div",{class:"dso-date__select"},e("select",{id:this.yearSelectId,class:"dso-date__select--year",onChange:this.handleYearSelect},function(e,t){const s=[];for(let i=e;i<=t;i++)s.push(i);return s}(f,b).map((t=>e("option",{key:t,selected:t===l},t)))),e("div",{class:"dso-date__select-label","aria-hidden":"true"},e("span",null,this.focusedDay.getFullYear()),e("dso-icon",{icon:"chevron-down"})))),e("div",{class:"dso-date__nav"},e("button",{class:"dso-date__prev",onClick:this.handlePreviousMonthClick,disabled:u,type:"button"},e("dso-icon",{icon:"chevron-left"}),e("span",{class:"dso-date__vhidden"},this.localization.prevMonthLabel)),e("button",{class:"dso-date__next",onClick:this.handleNextMonthClick,disabled:_,type:"button"},e("dso-icon",{icon:"chevron-right"}),e("span",{class:"dso-date__vhidden"},this.localization.nextMonthLabel)))),e(x,{selectedDate:o,focusedDate:this.focusedDay,onDateSelect:this.handleDaySelect,onKeyboardNavigation:this.handleKeyboardNavigation,labelledById:this.dialogLabelId,localization:this.localization,firstDayOfWeek:this.firstDayOfWeek,focusedDayRef:this.processFocusedDayNode,min:h,max:p})))))}get element(){return o(this)}};w.style='.sc-dso-date-picker-h{display:block}[invalid].sc-dso-date-picker-h:not([invalid=false]) .dso-date__input.sc-dso-date-picker{border-color:#ce3f51}.dso-date.sc-dso-date-picker *.sc-dso-date-picker,.dso-date.sc-dso-date-picker *.sc-dso-date-picker::before,.dso-date.sc-dso-date-picker *.sc-dso-date-picker::after{box-sizing:border-box}.dso-date.sc-dso-date-picker{box-sizing:border-box;color:#191919;display:block;font-family:"Asap", sans-serif;margin:0;position:relative;text-align:left;width:100%}.dso-date.sc-dso-date-picker:not(.dso-visible) .dso-date__dialog.sc-dso-date-picker{display:none}.dso-date__input.sc-dso-date-picker{display:block;width:100%;height:40px;padding:6px 14px;font-size:1rem;line-height:1.5;color:#191919;background-color:#fff;background-image:none;border:1px solid #275937;border-radius:4px;transition:border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s}.dso-date__input.sc-dso-date-picker::-moz-placeholder{color:#666;opacity:1}.dso-date__input.sc-dso-date-picker:-ms-input-placeholder{color:#666}.dso-date__input.sc-dso-date-picker::-webkit-input-placeholder{color:#666}.dso-date__input.sc-dso-date-picker::-ms-expand{background-color:transparent;border:0}.dso-date__input.sc-dso-date-picker:focus{border-color:#275937;outline:0;box-shadow:inset 0 0 0 1px #275937}.dso-date__input[disabled].sc-dso-date-picker,.dso-date__input[readonly].sc-dso-date-picker,fieldset[disabled].sc-dso-date-picker .dso-date__input.sc-dso-date-picker{background-color:#fff;opacity:1}.dso-date__input[disabled].sc-dso-date-picker,fieldset[disabled].sc-dso-date-picker .dso-date__input.sc-dso-date-picker{cursor:default}.dso-date__input[disabled].sc-dso-date-picker{border-color:#e5e5e5;color:#999}.dso-date__input[readonly].sc-dso-date-picker{border-width:1px}.dso-date__input[type=text].sc-dso-date-picker{line-height:40px}.dso-date__input[size].sc-dso-date-picker{width:auto}.dso-date__toggle.sc-dso-date-picker{-moz-appearance:none;-webkit-appearance:none;-webkit-user-select:none;align-items:center;appearance:none;background:transparent;border:0;border-radius:0;border-bottom-right-radius:4px;border-top-right-radius:4px;color:#39870c;cursor:pointer;display:flex;height:38px;justify-content:center;padding:0;position:absolute;right:0;transform:translateY(-50%);top:50%;user-select:none;width:38px;z-index:101}.dso-date__toggle.sc-dso-date-picker:disabled{color:#afcf9d;cursor:default}.dso-date__dialog.sc-dso-date-picker{border-width:1px;display:flex;right:0;min-width:320px;opacity:0;position:absolute;top:100%;transform:scale(0.96) translateZ(0) translateY(-20px);transform-origin:top right;transition:transform 300ms ease, opacity 300ms ease, visibility 300ms ease;visibility:hidden;will-change:transform, opacity, visibility;z-index:210}@media (max-width: 35.9375em){.dso-date__dialog.sc-dso-date-picker{background:rgba(25, 25, 25, 0.5);bottom:0;position:fixed;left:0;right:0;top:0;transform:translateZ(0);transform-origin:bottom center}}.dso-date__dialog.is-left.sc-dso-date-picker{left:-11px;right:auto;width:auto}.dso-date__dialog.is-active.sc-dso-date-picker{opacity:1;transform:scale(1.0001) translateZ(0) translateY(0);visibility:visible}.dso-date__dialog-content.sc-dso-date-picker{background:#fff;border:1px solid rgba(0, 0, 0, 0.1);border-radius:4px;box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.4);margin-left:auto;margin-right:-1px;margin-top:8px;max-width:310px;min-width:290px;padding:16px;position:relative;transform:none;width:100%;z-index:210}@media (max-width: 35.9375em){.dso-date__dialog-content.sc-dso-date-picker{border:0;border-radius:0;border-top-left-radius:4px;border-top-right-radius:4px;bottom:0;left:0;margin:0;max-width:none;min-height:26em;opacity:0;padding:0 8% 20px;position:absolute;transform:translateZ(0) translateY(100%);transition:transform 400ms ease, opacity 400ms ease, visibility 400ms ease;visibility:hidden;will-change:transform, opacity, visibility}.is-active.sc-dso-date-picker .dso-date__dialog-content.sc-dso-date-picker{opacity:1;transform:translateZ(0) translateY(0);visibility:visible}}.dso-date__table.sc-dso-date-picker{border-collapse:collapse;border-spacing:0;color:#191919;font-size:1rem;font-weight:400;line-height:1.25;min-width:280px;table-layout:fixed;text-align:center;width:100%}.dso-date__table-header.sc-dso-date-picker{font-size:0.875em;font-weight:600;height:36px;line-height:36px;text-align:center;text-decoration:none;text-transform:uppercase}.dso-date__cell.sc-dso-date-picker{height:40px;padding:1px;text-align:center;width:40px}.dso-date__day.sc-dso-date-picker{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;border-radius:50%;box-shadow:0 0 0 1px transparent;color:#191919;cursor:pointer;display:inline-block;font-family:"Asap", sans-serif;font-variant-numeric:tabular-nums;font-weight:400;height:38px;line-height:0;padding:0;position:relative;text-align:center;vertical-align:middle;width:38px;z-index:100}.dso-date__day.is-today.sc-dso-date-picker{background:transparent;height:36px;box-shadow:0 0 0 1px #39870c;width:36px}.dso-date__day.sc-dso-date-picker:hover,.dso-date__day.sc-dso-date-picker:active{background:#39870c;color:#fff}.dso-date__day.sc-dso-date-picker:focus{background:transparent;box-shadow:0 0 0 2px #275937;color:#191919;height:34px;outline:0;width:34px}[aria-selected=true].sc-dso-date-picker .dso-date__day.sc-dso-date-picker{background:#39870c;color:#fff}[aria-selected=true].sc-dso-date-picker .dso-date__day.sc-dso-date-picker:focus{background:transparent}[aria-selected=true].sc-dso-date-picker .dso-date__day.sc-dso-date-picker:focus span[aria-hidden=true].sc-dso-date-picker{background:#39870c;border:1px solid #fff;line-height:32px}.dso-date__day.sc-dso-date-picker:disabled{background:#fff;color:#ccc;cursor:default}.dso-date__day.sc-dso-date-picker span[aria-hidden=true].sc-dso-date-picker{border-radius:50%;display:inline-block;height:34px;line-height:34px;width:34px}.dso-date__header.sc-dso-date-picker{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px;width:100%}.dso-date__header.sc-dso-date-picker span.sc-dso-date-picker{font-size:0.875rem}.dso-date__nav.sc-dso-date-picker{white-space:nowrap}.dso-date__prev.sc-dso-date-picker,.dso-date__next.sc-dso-date-picker{-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:transparent;border:1px solid #39870c;border-radius:4px;box-sizing:border-box;color:#39870c;cursor:pointer;display:inline-flex;font-size:1em;height:32px;justify-content:center;margin-left:8px;padding:0;width:32px}@media (max-width: 35.9375em){.dso-date__prev.sc-dso-date-picker,.dso-date__next.sc-dso-date-picker{height:40px;width:40px}}.dso-date__prev.sc-dso-date-picker:hover,.dso-date__prev.sc-dso-date-picker:active,.dso-date__next.sc-dso-date-picker:hover,.dso-date__next.sc-dso-date-picker:active{background-color:#39870c;color:#fff}.dso-date__prev.sc-dso-date-picker:focus,.dso-date__next.sc-dso-date-picker:focus{background:transparent;color:#39870c}.dso-date__prev.sc-dso-date-picker:disabled,.dso-date__prev.sc-dso-date-picker:disabled:hover,.dso-date__next.sc-dso-date-picker:disabled,.dso-date__next.sc-dso-date-picker:disabled:hover{background-color:#fff;border-color:#afcf9d;color:#afcf9d;opacity:1}.dso-date__prev.sc-dso-date-picker svg.sc-dso-date-picker,.dso-date__next.sc-dso-date-picker svg.sc-dso-date-picker{margin:0 auto}.dso-date__select.sc-dso-date-picker{display:inline-flex;height:28px;line-height:28px;position:relative}.dso-date__select.sc-dso-date-picker span.sc-dso-date-picker{margin-right:4px}.dso-date__select.sc-dso-date-picker select.sc-dso-date-picker{color:#275937;cursor:pointer;font-size:1rem;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:101}.dso-date__select.sc-dso-date-picker select.sc-dso-date-picker:focus+.dso-date__select-label.sc-dso-date-picker{box-shadow:0 0 0 2px #275937}.dso-date__select.sc-dso-date-picker select.sc-dso-date-picker:disabled{color:#afcf9d}.dso-date__select-label.sc-dso-date-picker{align-items:center;border-radius:4px;color:#39870c;display:flex;padding:0 4px 0 8px;pointer-events:none;position:relative;width:100%;z-index:100}.dso-date__select-label.sc-dso-date-picker span.sc-dso-date-picker{font-size:1.25rem;font-weight:600;line-height:1.25}.dso-date__select-label.sc-dso-date-picker svg.sc-dso-date-picker{width:16px;height:16px}.dso-date__mobile.sc-dso-date-picker{align-items:center;border-bottom:1px solid rgba(0, 0, 0, 0.12);display:flex;font-size:1em;justify-content:space-between;margin-bottom:20px;margin-left:-10%;overflow:hidden;padding:12px 20px;position:relative;text-overflow:ellipsis;white-space:nowrap;width:120%}@media (min-width: 36em){.dso-date__mobile.sc-dso-date-picker{border:0;margin:0;overflow:visible;padding:0;position:absolute;right:-16px;top:-16px;width:auto}}.dso-date__mobile-heading.sc-dso-date-picker{display:inline-block;font-weight:600;max-width:84%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 36em){.dso-date__mobile-heading.sc-dso-date-picker{display:none}}.dso-date__close.sc-dso-date-picker{-webkit-appearance:none;align-items:center;appearance:none;background-color:#fff;border:0;border-radius:50%;color:#39870c;cursor:pointer;display:flex;font-size:1em;height:32px;justify-content:center;margin-right:-4px;padding:0;width:32px}@media (min-width: 36em){.dso-date__close.sc-dso-date-picker{margin-right:0;opacity:0}}.dso-date__close.sc-dso-date-picker:focus{box-shadow:0 0 0 2px #275937;outline:none}@media (min-width: 36em){.dso-date__close.sc-dso-date-picker:focus{opacity:1}}.dso-date__vhidden.sc-dso-date-picker{border:0;clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;padding:0;position:absolute;top:0;width:1px}';export{w as dso_date_picker}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as e,c as s,h as t,F as l,f as o,g as c}from"./p-98fd1658.js";import{c as a}from"./p-6a1980b4.js";import{c as i}from"./p-6c543986.js";const d=class{constructor(t){e(this,t),this.dsoClose=s(this,"dsoClose",7),this.fixed=void 0,this.active=void 0}render(){return t(l,null,t("slot",null),!this.fixed&&t("button",{type:"button",onClick:e=>this.dsoClose.emit(e)},t("dso-icon",{icon:"times"}),t("span",{class:"sr-only"},"Sluiten")))}};d.style=":host{display:block;background-color:#f2f2f2;color:#000;padding:16px 32px 16px 16px;position:relative}:host>button{background-color:transparent;border-style:none;padding:0;position:absolute;right:8px;top:8px}:host(:not([active]):not([fixed])){display:none}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}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";const b=class{constructor(t){e(this,t),this.dsoChange=s(this,"dsoChange",7),this.fallbackIdentifier=i("DsoSelectable"),this.type=void 0,this.identifier=void 0,this.name=void 0,this.value=void 0,this.invalid=void 0,this.describedById=void 0,this.labelledById=void 0,this.disabled=void 0,this.required=void 0,this.checked=void 0,this.indeterminate=void 0,this.infoFixed=void 0,this.infoActive=!1}async toggleInfo(e){this.infoActive=null!=e?e:!this.infoActive}componentDidLoad(){var e;null===(e=this.mutationObserver)||void 0===e||e.disconnect(),this.mutationObserver=new MutationObserver((()=>o(this.host))),this.mutationObserver.observe(this.host,{childList:!0}),this.setIndeterminate()}disconnectedCallback(){var e;null===(e=this.mutationObserver)||void 0===e||e.disconnect()}setIndeterminate(){this.input instanceof HTMLInputElement&&"checkbox"===this.type&&(this.input.indeterminate=!!this.indeterminate)}render(){var e;const s=!!this.host.querySelector('[slot="info"]');return t(l,null,t("div",{class:a("dso-selectable-container",{"has-info-button":s})},t("div",{class:"dso-selectable-input-wrapper"},t("input",{type:this.type,id:this.getIdentifier(),value:this.value,name:this.name,"aria-invalid":null===(e=this.invalid)||void 0===e?void 0:e.toString(),"aria-describedby":s&&this.infoFixed?this.describedById:void 0,"aria-labelledBy":this.labelledById,disabled:this.disabled,required:this.required,checked:this.checked,onChange:e=>this.dsoChange.emit(e),ref:e=>this.input=e}),this.labelledById?t("label",null):t("label",{htmlFor:this.getIdentifier()},t("slot",null))),s&&t(l,null,!this.infoFixed&&t("dso-info-button",{active:this.infoActive,onDsoToggle:e=>this.infoActive=e.detail.active}))),s&&t("dso-info",{id:s&&this.infoFixed?this.describedById:void 0,fixed:this.infoFixed,active:this.infoActive,onDsoClose:()=>this.infoActive=!1},t("div",null,t("slot",{name:"info"}))))}getIdentifier(){var e;return null!==(e=this.identifier)&&void 0!==e?e:this.fallbackIdentifier}get host(){return c(this)}static get watchers(){return{indeterminate:["setIndeterminate"]}}};b.style='.sc-dso-selectable-h{display:block;position:relative}.sc-dso-selectable-h .dso-selectable-options.sc-dso-selectable{list-style:none;margin-top:8px;padding-left:0}.sc-dso-selectable-h .dso-selectable-options.sc-dso-selectable li.sc-dso-selectable+li.sc-dso-selectable{margin-top:8px}.sc-dso-selectable-h label.sc-dso-selectable{font-weight:400;line-height:24px;margin:0}.sc-dso-selectable-h input[type=checkbox][disabled].sc-dso-selectable+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=checkbox][disabled].sc-dso-selectable:active+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=checkbox][disabled].sc-dso-selectable:focus+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio][disabled].sc-dso-selectable+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio][disabled].sc-dso-selectable:active+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio][disabled].sc-dso-selectable:focus+label.sc-dso-selectable::before{background-color:#fff;box-shadow:0 0 0 2px #e5e5e5}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable,.sc-dso-selectable-h input[type=radio].sc-dso-selectable{height:24px;left:0;margin:0;opacity:0;position:absolute;top:0;width:24px;z-index:100;zoom:1}@media (prefers-contrast: more){.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable,.sc-dso-selectable-h input[type=radio].sc-dso-selectable{opacity:1}}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:not([disabled]),.sc-dso-selectable-h input[type=radio].sc-dso-selectable:not([disabled]){cursor:pointer}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable+label.sc-dso-selectable,.sc-dso-selectable-h input[type=radio].sc-dso-selectable+label.sc-dso-selectable{display:inline;font-style:normal;padding-left:0}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio].sc-dso-selectable+label.sc-dso-selectable::before{background:#fff;border:0;box-shadow:0 0 0 2px var(--dso-selectable-color, #275937);content:"";height:20px;left:2px;position:absolute;top:2px;width:20px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:focus,.sc-dso-selectable-h input[type=radio].sc-dso-selectable:focus{outline:0}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:focus+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio].sc-dso-selectable:focus+label.sc-dso-selectable::before{box-shadow:0 0 0 3px var(--dso-selectable-color, #275937);height:18px;left:3px;top:3px;width:18px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:active+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=checkbox].active.sc-dso-selectable+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio].sc-dso-selectable:active+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio].active.sc-dso-selectable+label.sc-dso-selectable::before{background-color:#ebf3e6;box-shadow:0 0 0 1px #275937;height:22px;left:1px;top:1px;width:22px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable+label.sc-dso-selectable::before{border-radius:4px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable+label.sc-dso-selectable::after{background:transparent;content:"";left:6px;opacity:0;position:absolute;top:6px;zoom:1}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:checked+label.sc-dso-selectable::after,.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:indeterminate+label.sc-dso-selectable::after{opacity:1}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:checked+label.sc-dso-selectable::after{border:solid;border-color:var(--dso-selectable-color, #39870c);border-top-color:transparent;border-width:0 0 3px 3px;height:8px;transform:rotate(-45deg);width:13px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:indeterminate+label.sc-dso-selectable::after{background-color:var(--dso-selectable-color, #39870c);height:12px;width:12px}.sc-dso-selectable-h input[type=radio].sc-dso-selectable+label.sc-dso-selectable::before{border-radius:50%}.sc-dso-selectable-h input[type=radio].sc-dso-selectable+label.sc-dso-selectable::after{background-color:transparent;border-radius:50%;content:"";height:12px;left:6px;opacity:0;position:absolute;top:6px;width:12px;zoom:1}.sc-dso-selectable-h input[type=radio].sc-dso-selectable:checked+label.sc-dso-selectable::after{background-color:var(--dso-selectable-color, #39870c);opacity:1}.sc-dso-selectable-h>dso-info.sc-dso-selectable{float:none;margin:8px 16px 0 0;width:100%}[invalid].sc-dso-selectable-h{--dso-selectable-color:#ce3f51}.sc-dso-selectable-h:not(:last-child){margin-bottom:8px}*.sc-dso-selectable,*.sc-dso-selectable::after,*.sc-dso-selectable::before{box-sizing:border-box}.dso-selectable-container.sc-dso-selectable{display:inline-block;position:relative;padding-inline-start:32px}.dso-selectable-container.has-info-button.sc-dso-selectable{padding-inline-end:32px}.dso-selectable-container.sc-dso-selectable .dso-selectable-input-wrapper.sc-dso-selectable{display:inline;margin-inline:-32px;min-height:24px;padding-inline:32px}.dso-selectable-container.sc-dso-selectable .dso-selectable-input-wrapper.sc-dso-selectable:focus-within{border-radius:2px;outline-offset:3px;outline:3px solid #008ccc}.dso-selectable-container.sc-dso-selectable .dso-selectable-input-wrapper.sc-dso-selectable input[type=radio].sc-dso-selectable:focus+label.sc-dso-selectable::before,.dso-selectable-container.sc-dso-selectable .dso-selectable-input-wrapper.sc-dso-selectable input[type=checkbox].sc-dso-selectable:focus+label.sc-dso-selectable::before{box-shadow:0 0 0 2px var(--dso-selectable-color, #275937);height:20px;left:2px;top:2px;width:20px}dso-info-button.sc-dso-selectable{position:absolute;right:0;top:0}';export{d as dso_info,b as dso_selectable}
|
|
1
|
+
import{r as e,c as s,h as t,F as l,f as o,g as c}from"./p-98fd1658.js";import{c as a}from"./p-6a1980b4.js";import{c as i}from"./p-6c543986.js";const d=class{constructor(t){e(this,t),this.dsoClose=s(this,"dsoClose",7),this.fixed=void 0,this.active=void 0}render(){return t(l,null,t("slot",null),!this.fixed&&t("button",{type:"button",onClick:e=>this.dsoClose.emit(e)},t("dso-icon",{icon:"times"}),t("span",{class:"sr-only"},"Sluiten")))}};d.style=":host{display:block;background-color:#f2f2f2;color:#000;padding:16px 32px 16px 16px;position:relative}:host>button{background-color:transparent;border-style:none;padding:0;position:absolute;right:8px;top:8px}:host(:not([active]):not([fixed])){display:none}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}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";const b=class{constructor(t){e(this,t),this.dsoChange=s(this,"dsoChange",7),this.fallbackIdentifier=i("DsoSelectable"),this.type=void 0,this.identifier=void 0,this.name=void 0,this.value=void 0,this.invalid=void 0,this.describedById=void 0,this.labelledById=void 0,this.disabled=void 0,this.required=void 0,this.checked=void 0,this.indeterminate=void 0,this.infoFixed=void 0,this.infoActive=!1}async toggleInfo(e){this.infoActive=null!=e?e:!this.infoActive}componentDidLoad(){var e;null===(e=this.mutationObserver)||void 0===e||e.disconnect(),this.mutationObserver=new MutationObserver((()=>o(this.host))),this.mutationObserver.observe(this.host,{childList:!0}),this.setIndeterminate()}disconnectedCallback(){var e;null===(e=this.mutationObserver)||void 0===e||e.disconnect()}setIndeterminate(){this.input instanceof HTMLInputElement&&"checkbox"===this.type&&(this.input.indeterminate=!!this.indeterminate)}render(){var e;const s=!!this.host.querySelector('[slot="info"]');return t(l,null,t("div",{class:a("dso-selectable-container",{"has-info-button":s})},t("div",{class:"dso-selectable-input-wrapper"},t("input",{type:this.type,id:this.getIdentifier(),value:this.value,name:this.name,"aria-invalid":null===(e=this.invalid)||void 0===e?void 0:e.toString(),"aria-describedby":s&&this.infoFixed?this.describedById:void 0,"aria-labelledBy":this.labelledById,disabled:this.disabled,required:this.required,checked:this.checked,onChange:e=>this.dsoChange.emit(e),ref:e=>this.input=e}),this.labelledById?t("label",null):t("label",{htmlFor:this.getIdentifier()},t("slot",null))),s&&t(l,null,!this.infoFixed&&t("dso-info-button",{active:this.infoActive,onDsoToggle:e=>this.infoActive=e.detail.active}))),s&&t("dso-info",{id:s&&this.infoFixed?this.describedById:void 0,fixed:this.infoFixed,active:this.infoActive,onDsoClose:()=>this.infoActive=!1},t("div",null,t("slot",{name:"info"}))))}getIdentifier(){var e;return null!==(e=this.identifier)&&void 0!==e?e:this.fallbackIdentifier}get host(){return c(this)}static get watchers(){return{indeterminate:["setIndeterminate"]}}};b.style='.sc-dso-selectable-h{display:block;position:relative}.sc-dso-selectable-h .dso-selectable-options.sc-dso-selectable{list-style:none;margin-top:8px;padding-left:0}.sc-dso-selectable-h .dso-selectable-options.sc-dso-selectable li.sc-dso-selectable+li.sc-dso-selectable{margin-top:8px}.sc-dso-selectable-h label.sc-dso-selectable{font-weight:400;line-height:24px;margin:0}.sc-dso-selectable-h input[type=checkbox][disabled].sc-dso-selectable+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=checkbox][disabled].sc-dso-selectable:active+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=checkbox][disabled].sc-dso-selectable:focus+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio][disabled].sc-dso-selectable+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio][disabled].sc-dso-selectable:active+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio][disabled].sc-dso-selectable:focus+label.sc-dso-selectable::before{background-color:#fff;box-shadow:0 0 0 2px #e5e5e5}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable,.sc-dso-selectable-h input[type=radio].sc-dso-selectable{height:24px;left:0;margin:0;opacity:0;position:absolute;top:0;width:24px;z-index:100;zoom:1}@media (prefers-contrast: more){.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable,.sc-dso-selectable-h input[type=radio].sc-dso-selectable{opacity:1}}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:not([disabled]),.sc-dso-selectable-h input[type=radio].sc-dso-selectable:not([disabled]){cursor:pointer}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable+label.sc-dso-selectable,.sc-dso-selectable-h input[type=radio].sc-dso-selectable+label.sc-dso-selectable{display:inline;font-style:normal;padding-left:0}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio].sc-dso-selectable+label.sc-dso-selectable::before{background:#fff;border:0;box-shadow:0 0 0 2px var(--dso-selectable-color, #275937);content:"";height:20px;left:2px;position:absolute;top:2px;width:20px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:focus,.sc-dso-selectable-h input[type=radio].sc-dso-selectable:focus{outline:0}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:focus+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio].sc-dso-selectable:focus+label.sc-dso-selectable::before{box-shadow:0 0 0 3px var(--dso-selectable-color, #275937);height:18px;left:3px;top:3px;width:18px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:active+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=checkbox].active.sc-dso-selectable+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio].sc-dso-selectable:active+label.sc-dso-selectable::before,.sc-dso-selectable-h input[type=radio].active.sc-dso-selectable+label.sc-dso-selectable::before{background-color:#ebf3e6;box-shadow:0 0 0 1px #275937;height:22px;left:1px;top:1px;width:22px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable+label.sc-dso-selectable::before{border-radius:4px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable+label.sc-dso-selectable::after{background:transparent;content:"";left:6px;opacity:0;position:absolute;top:6px;zoom:1}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:checked+label.sc-dso-selectable::after,.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:indeterminate+label.sc-dso-selectable::after{opacity:1}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:checked+label.sc-dso-selectable::after{border:solid;border-color:var(--dso-selectable-color, #39870c);border-top-color:transparent;border-width:0 0 3px 3px;height:8px;transform:rotate(-45deg);width:13px}.sc-dso-selectable-h input[type=checkbox].sc-dso-selectable:indeterminate+label.sc-dso-selectable::after{background-color:var(--dso-selectable-color, #39870c);height:12px;width:12px}.sc-dso-selectable-h input[type=radio].sc-dso-selectable+label.sc-dso-selectable::before{border-radius:50%}.sc-dso-selectable-h input[type=radio].sc-dso-selectable+label.sc-dso-selectable::after{background-color:transparent;border-radius:50%;content:"";height:12px;left:6px;opacity:0;position:absolute;top:6px;width:12px;zoom:1}.sc-dso-selectable-h input[type=radio].sc-dso-selectable:checked+label.sc-dso-selectable::after{background-color:var(--dso-selectable-color, #39870c);opacity:1}.sc-dso-selectable-h>dso-info.sc-dso-selectable{float:none;margin:8px 16px 0 0;width:100%}[invalid].sc-dso-selectable-h:not([invalid=false]){--dso-selectable-color:#ce3f51}.sc-dso-selectable-h:not(:last-child){margin-bottom:8px}*.sc-dso-selectable,*.sc-dso-selectable::after,*.sc-dso-selectable::before{box-sizing:border-box}.dso-selectable-container.sc-dso-selectable{display:inline-block;position:relative;padding-inline-start:32px}.dso-selectable-container.has-info-button.sc-dso-selectable{padding-inline-end:32px}.dso-selectable-container.sc-dso-selectable .dso-selectable-input-wrapper.sc-dso-selectable{display:inline;margin-inline:-32px;min-height:24px;padding-inline:32px}.dso-selectable-container.sc-dso-selectable .dso-selectable-input-wrapper.sc-dso-selectable:focus-within{border-radius:2px;outline-offset:3px;outline:3px solid #008ccc}.dso-selectable-container.sc-dso-selectable .dso-selectable-input-wrapper.sc-dso-selectable input[type=radio].sc-dso-selectable:focus+label.sc-dso-selectable::before,.dso-selectable-container.sc-dso-selectable .dso-selectable-input-wrapper.sc-dso-selectable input[type=checkbox].sc-dso-selectable:focus+label.sc-dso-selectable::before{box-shadow:0 0 0 2px var(--dso-selectable-color, #275937);height:20px;left:2px;top:2px;width:20px}dso-info-button.sc-dso-selectable{position:absolute;right:0;top:0}';export{d as dso_info,b as dso_selectable}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as i,c as t,h as n,F as e,g as o}from"./p-98fd1658.js";import{i as a}from"./p-33df9903.js";const s=class{constructor(n){i(this,n),this.dsoSelectPage=t(this,"dsoSelectPage",7),this.sizePositionsMap={small:7,medium:9,large:11},this.availablePositions=void 0,this.totalPages=void 0,this.currentPage=void 0,this.formatHref=i=>"#"+i}sizeChangeHandler(i){this.availablePositions=this.getAvailablePositions(this.sizePositionsMap[i.detail])}clickHandler(i,t){this.dsoSelectPage.emit({originalEvent:i,page:t,isModifiedEvent:a(i)})}componentDidLoad(){var i;null===(i=this.responsiveElement)||void 0===i||i.getSize().then((i=>this.availablePositions=this.getAvailablePositions(this.sizePositionsMap[i])))}render(){var i,t,o;if(!this.totalPages)return null;if(void 0===this.availablePositions)return n("dso-responsive-element",{ref:i=>this.responsiveElement=i});const a=this.availablePositions,s=null!==(i=this.currentPage)&&void 0!==i?i:0,l=this.getPages(s,this.availablePositions,this.totalPages);return n("dso-responsive-element",{ref:i=>this.responsiveElement=i},n("ul",{class:"pagination"},n("li",{class:s<=1||s>this.totalPages?"dso-page-hidden":void 0},n("a",{href:this.formatHref(null!==(t=l[l.indexOf(s)-1])&&void 0!==t?t:1),"aria-label":"Vorige",onClick:i=>{var t;return s&&this.clickHandler(i,null!==(t=l[l.indexOf(s)-1])&&void 0!==t?t:1)}},n("dso-icon",{icon:"chevron-left"}))),l.map((i=>n(e,null,this.showEllipsisBeforeLast(l,i,a)&&n("li",null,n("span",null,"...")),n("li",{key:i,class:s===i?"active":void 0},s===i?n("span",{"aria-current":"page"},i):n("a",{href:this.formatHref(i),onClick:t=>this.clickHandler(t,i)},i)),this.showEllipsisAfterFirst(l,i,a)&&n("li",null,n("span",null,"..."))))),n("li",{class:s<1||s>=this.totalPages?"dso-page-hidden":void 0},n("a",{href:this.formatHref(null!==(o=l[l.indexOf(s)+1])&&void 0!==o?o:this.totalPages),"aria-label":"Volgende",onClick:i=>{var t;return s&&this.totalPages&&this.clickHandler(i,null!==(t=l[l.indexOf(s)+1])&&void 0!==t?t:this.totalPages)}},n("dso-icon",{icon:"chevron-right"})))))}getAvailablePositions(i){return i%2==0?i-1:i<=3?3:i}getPages(i,t,n){return n+2<=t?Array.from({length:n},((i,t)=>t+1)):3===t?[i]:5===t?[1,i,n]:[1,...this.getPageRange(i,t,n),n]}getPageRange(i,t,n){const e=[],o=Math.floor(t/2);if(i<=o)for(let i=2;i<=t-4;i++)e.push(i);if(i>=o&&i<=n-o&&(1===o&&(i>n-2&&e.push(n-2),e.push(i),i<3&&e.push(3)),o>1)){const t=o-3;for(let a=Math.min(i-t,n-o);a<=Math.max(i+t,o);a++)a>2&&a<n-1&&e.push(a)}if(i>n-o)for(let i=n-(t-5);i<=n-1;i++)e.push(i);return e.filter(((i,t,n)=>n.indexOf(i)===t))}showEllipsisAfterFirst(i,t,n){const e=i[i.length-1];if(!e)throw new Error("No totalPages");return 0===i.indexOf(t)&&e>n-2&&!i.some((i=>2===i))&&n>=7}showEllipsisBeforeLast(i,t,n){const e=i[i.length-1];if(!e)throw new Error("No totalPages");return i.indexOf(t)===i.length-1&&e>n-2&&!i.some((i=>i===e-1))&&n>=7}get host(){return o(this)}};s.style=':host{display:block}*,*::after,*::before{box-sizing:border-box}.pagination{padding-inline-start:initial;text-align:center}.pagination>li{display:inline-block;font-weight:bold;line-height:calc(2rem - 4px);text-align:center;vertical-align:middle}.pagination>li>a,.pagination>li>span{align-items:center;color:#39870c;display:flex;height:2rem;justify-content:center;position:relative;width:2rem}.pagination>li>a:active,.pagination>li>span:active{background-color:#ebf3e6}.pagination>li>span{border:2px solid transparent;border-radius:50%}.pagination>li a{line-height:2rem;text-decoration:none}.pagination>li a:hover,.pagination>li a:focus{text-decoration:none}.pagination>li a:hover::after,.pagination>li a:focus::after{border-bottom-color:#39870c}.pagination>li a::after{border-bottom:3px solid transparent;bottom:0;content:"";display:inline-block;left:0;position:absolute;width:100%}.pagination>li.active span{background-color:#39870c;color:#fff}.pagination>li+li{margin-left:8px}.dso-page-hidden{visibility:hidden}';export{s as dso_pagination}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as o,h as t,H as s,g as n}from"./p-98fd1658.js";import{d}from"./p-1805f5b0.js";import{c as e}from"./p-91963e3d.js";import{v as r}from"./p-5d7f4ff2.js";import"./p-5950644a.js";const a=class{constructor(t){o(this,t),this.labelledbyId=r(),this.noModal=!1,this.isResponsive=!1,this.modalActive=!1,this.placeholderHeight=void 0}startResponsiveBehavior(){var o;null===(o=this.resizeObserver)||void 0===o||o.observe(this.host)}componentWillLoad(){this.resizeObserver=new ResizeObserver(d((o=>this.setResponsiveTable(o)),200))}componentDidLoad(){this.startResponsiveBehavior()}componentDidRender(){this.setFocusTrap()}disconnectedCallback(){var o;null===(o=this.resizeObserver)||void 0===o||o.disconnect()}render(){var o,n;const d=null===(n=null===(o=this.host.querySelector(":scope > table > caption"))||void 0===o?void 0:o.textContent)||void 0===n?void 0:n.trim();return t(s,null,this.modalActive&&this.placeholderHeight&&t("div",{class:"dso-table-placeholder",style:{height:`${this.placeholderHeight}px`}}),this.modalActive&&t("div",{class:"dso-modal-overlay"}),t("div",{class:{"dso-modal":this.modalActive}},t("div",Object.assign({class:{"dso-dialog":this.modalActive,"dso-table-dialog":!0},ref:o=>this.focusTrapElement=o},this.modalActive?{"aria-labelledby":this.labelledbyId,role:"dialog"}:{}),(this.isResponsive||!this.noModal)&&t("div",{class:"dso-table-utilities",style:this.modalActive?{display:"none"}:void 0},this.isResponsive&&t("div",{class:"dso-responsive-message"},t("span",null,"beweeg de tabel van links naar rechts")),!this.noModal&&t("button",{type:"button",class:"dso-tertiary open-modal-button",ref:o=>this.buttonElement=o,onClick:()=>this.openModal()},t("span",{class:"sr-only"},"tabel ",null!=d?d:""," "),t("span",null,"vergroten"),t("dso-icon",{icon:"external-link"}))),this.modalActive&&t("div",{class:"dso-header"},t("h2",{id:this.labelledbyId,class:{"sr-only":!d}},d||"Uitvergrote tabel dialoog"),t("button",{type:"button",class:"dso-close",onClick:()=>this.closeModal()},t("dso-icon",{icon:"times"}),t("span",{class:"sr-only"},"Sluiten"))),t("div",{class:{"dso-body":this.modalActive,"dso-table-body":!0}},t("slot",null)))))}openModal(){this.placeholderHeight=this.host.clientHeight,this.modalActive=!0}closeModal(){this.placeholderHeight=void 0,this.modalActive=!1}setFocusTrap(){var o,t;this.modalActive&&this.focusTrapElement&&!this.trap?this.trap=e([this.host,this.focusTrapElement],{escapeDeactivates:!0,clickOutsideDeactivates:o=>!(o instanceof MouseEvent&&o.composedPath()[0]===this.focusTrapElement&&(this.closeModal(),1)),setReturnFocus:null!==(o=this.buttonElement)&&void 0!==o&&o,onDeactivate:()=>this.closeModal(),tabbableOptions:{getShadowRoot:!0}}).activate():!this.modalActive&&this.trap&&(null===(t=this.trap)||void 0===t||t.deactivate(),delete this.trap)}setResponsiveTable([o]){if(!o)throw new Error("No dsoTable found");const t=o.target.querySelector("table");o&&t instanceof HTMLTableElement&&(this.isResponsive=Math.floor(t.getBoundingClientRect().width)>Math.floor(o.contentRect.width))}get host(){return n(this)}};a.style="@keyframes slideInFromTop {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n:host {\n display: block;\n margin-bottom: 24px;\n}\n\n.dso-header {\n min-height: 32px;\n}\n.dso-header h2 {\n color: #275937;\n font-size: 1.5rem;\n font-weight: 700;\n}\n.dso-header .dso-close {\n color: #275937;\n}\n\n:host .dso-modal {\n bottom: 0;\n height: 100%;\n left: 0;\n position: fixed;\n right: 0;\n top: 0;\n z-index: 530;\n inset: 0px;\n height: 100%;\n position: fixed;\n z-index: 530;\n}\n:host .dso-modal .dso-dialog {\n animation: 1s ease-out 0s 1 slideInFromTop;\n margin-top: 15vh;\n margin-left: auto;\n margin-right: auto;\n max-width: 640px;\n opacity: 1;\n background-color: #fff;\n box-shadow: 0 8px 24px 0 rgba(25, 25, 25, 0.4);\n}\n:host .dso-modal .dso-header {\n border-bottom: 1px solid #ccc;\n padding: 16px;\n position: relative;\n}\n:host .dso-modal .dso-header h2 {\n color: #275937;\n margin: 0;\n max-width: calc(100% - 24px);\n}\n:host .dso-modal .dso-header .dso-close {\n background-color: transparent;\n border: 0;\n height: 32px;\n padding: 0;\n position: absolute;\n right: 13px;\n text-align: center;\n top: 16px;\n width: 32px;\n}\n:host .dso-modal .dso-body {\n height: calc(100% - 96px - 1.5rem);\n max-height: calc(70vh - 144px - 1.5em);\n min-height: 1.5rem;\n overflow-x: auto;\n padding: 32px;\n}\n:host .dso-modal .dso-body p {\n margin: 0 0 16px;\n}\n:host .dso-modal .dso-body ul,\n:host .dso-modal .dso-body ol {\n margin-bottom: 16px;\n}\n:host .dso-modal .dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),\n:host .dso-modal .dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list) {\n padding-inline-start: 24px;\n}\n:host .dso-modal .dso-body pre {\n margin: 0 0 16px;\n}\n:host .dso-modal .dso-body blockquote {\n padding: 16px 24px;\n}\n:host .dso-modal .dso-body dso-highlight-box,\n:host .dso-modal .dso-body .dso-highlight-box {\n margin-bottom: 24px;\n}\n:host .dso-modal .dso-body img {\n height: auto;\n max-width: 100%;\n}\n:host .dso-modal .dso-footer {\n min-height: 80px;\n padding: 0 32px 32px;\n text-align: right;\n}\n@media screen and (max-width: 767px) {\n :host .dso-modal .dso-footer .btn + .btn, :host .dso-modal .dso-footer .btn + .dso-primary, :host .dso-modal .dso-footer .btn + .dso-secondary, :host .dso-modal .dso-footer .btn + .dso-tertiary, :host .dso-modal .dso-footer .dso-primary + .btn, :host .dso-modal .dso-footer .dso-primary + .dso-primary, :host .dso-modal .dso-footer .dso-primary + .dso-secondary, :host .dso-modal .dso-footer .dso-primary + .dso-tertiary, :host .dso-modal .dso-footer .dso-secondary + .btn, :host .dso-modal .dso-footer .dso-secondary + .dso-primary, :host .dso-modal .dso-footer .dso-secondary + .dso-secondary, :host .dso-modal .dso-footer .dso-secondary + .dso-tertiary, :host .dso-modal .dso-footer .dso-tertiary + .btn, :host .dso-modal .dso-footer .dso-tertiary + .dso-primary, :host .dso-modal .dso-footer .dso-tertiary + .dso-secondary, :host .dso-modal .dso-footer .dso-tertiary + .dso-tertiary {\n margin-left: 0;\n }\n :host .dso-modal .dso-footer button {\n text-align: center;\n width: 100%;\n }\n :host .dso-modal .dso-footer button + button {\n margin-top: 8px;\n }\n :host .dso-modal .dso-footer button.dso-tertiary,\n:host .dso-modal .dso-footer button.dso-tertiary span, :host .dso-modal .dso-footer button.btn-link,\n:host .dso-modal .dso-footer button.btn-link span {\n float: none;\n }\n}\n@media screen and (min-width: 768px) {\n :host .dso-modal .dso-footer .btn + .dso-secondary, :host .dso-modal .dso-footer .btn + .btn-default, :host .dso-modal .dso-footer .dso-primary + .dso-secondary, :host .dso-modal .dso-footer .dso-primary + .btn-default, :host .dso-modal .dso-footer .dso-secondary + .dso-secondary, :host .dso-modal .dso-footer .dso-secondary + .btn-default, :host .dso-modal .dso-footer .dso-tertiary + .dso-secondary, :host .dso-modal .dso-footer .dso-tertiary + .btn-default {\n margin-left: 16px;\n }\n :host .dso-modal .dso-footer .btn + .dso-tertiary, :host .dso-modal .dso-footer .btn + .btn-link, :host .dso-modal .dso-footer .dso-primary + .dso-tertiary, :host .dso-modal .dso-footer .dso-primary + .btn-link, :host .dso-modal .dso-footer .dso-secondary + .dso-tertiary, :host .dso-modal .dso-footer .dso-secondary + .btn-link, :host .dso-modal .dso-footer .dso-tertiary + .dso-tertiary, :host .dso-modal .dso-footer .dso-tertiary + .btn-link {\n margin-left: 0;\n }\n}\n@media screen and (max-width: 767px) {\n :host .dso-modal .dso-dialog {\n max-width: 100%;\n margin-top: 0;\n }\n :host .dso-modal .dso-footer .btn + .btn, :host .dso-modal .dso-footer .btn + .dso-primary, :host .dso-modal .dso-footer .btn + .dso-secondary, :host .dso-modal .dso-footer .btn + .dso-tertiary, :host .dso-modal .dso-footer .dso-primary + .btn, :host .dso-modal .dso-footer .dso-primary + .dso-primary, :host .dso-modal .dso-footer .dso-primary + .dso-secondary, :host .dso-modal .dso-footer .dso-primary + .dso-tertiary, :host .dso-modal .dso-footer .dso-secondary + .btn, :host .dso-modal .dso-footer .dso-secondary + .dso-primary, :host .dso-modal .dso-footer .dso-secondary + .dso-secondary, :host .dso-modal .dso-footer .dso-secondary + .dso-tertiary, :host .dso-modal .dso-footer .dso-tertiary + .btn, :host .dso-modal .dso-footer .dso-tertiary + .dso-primary, :host .dso-modal .dso-footer .dso-tertiary + .dso-secondary, :host .dso-modal .dso-footer .dso-tertiary + .dso-tertiary {\n margin-left: 0;\n }\n :host .dso-modal .dso-footer button {\n text-align: center;\n width: 100%;\n }\n :host .dso-modal .dso-footer button + button {\n margin-top: 8px;\n }\n :host .dso-modal .dso-footer button.dso-tertiary,\n:host .dso-modal .dso-footer button.dso-tertiary span, :host .dso-modal .dso-footer button.btn-link,\n:host .dso-modal .dso-footer button.btn-link span {\n float: none;\n }\n}\n\n.dso-modal .dso-dialog.dso-table-dialog {\n margin-top: 1rem;\n max-width: calc(100% - 2rem);\n}\n.dso-modal .dso-dialog.dso-table-dialog .dso-body {\n max-height: calc(100vh - 112px - 1.5em - 2rem);\n}\n@media screen and (max-width: 767px) {\n .dso-modal .dso-dialog.dso-table-dialog {\n max-width: 100%;\n }\n}\n\n:host([is-responsive]) .dso-table-body {\n border: 1px solid #ccc;\n margin-bottom: 0;\n overflow-y: hidden;\n width: 100%;\n}\n:host([is-responsive]) .dso-table-body.dso-body {\n width: calc(100% - 64px);\n}\n\n.dso-table-utilities {\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-bottom: 8px;\n}\n.dso-table-utilities .dso-responsive-message {\n margin-bottom: 0;\n}\n.dso-table-utilities .dso-responsive-message:only-child {\n width: 100%;\n}\n.dso-table-utilities .open-modal-button:only-child {\n margin-left: auto;\n}\n\n.dso-responsive-message {\n font-size: 0.8em;\n margin-bottom: 8px;\n position: relative;\n text-align: center;\n}\n\n.dso-tertiary {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n border: 0;\n color: #39870c;\n line-height: 1;\n padding: 0;\n background-color: transparent;\n cursor: pointer;\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[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.btn-align {\n line-height: calc(1.5em - 1px);\n padding: 11px 0;\n position: relative;\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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-right: 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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-left: 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-left: 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-left: 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-left: 0;\n}\n.dso-tertiary dso-icon,\n.dso-tertiary svg.di,\n.dso-tertiary span {\n vertical-align: middle;\n}\n\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n}\n\n.dso-modal-overlay {\n background-color: rgba(255, 255, 255, 0.8);\n bottom: 0;\n display: block;\n left: 0;\n position: fixed;\n right: 0;\n top: 0;\n z-index: 529;\n}\n\n.dso-table-placeholder {\n box-shadow: inset 0 0 0 1px #ccc;\n display: grid;\n place-content: center;\n}";export{a as dso_table}
|
|
@@ -43,7 +43,10 @@ const Accordion = class {
|
|
|
43
43
|
async toggleSection(sectionElement, event) {
|
|
44
44
|
const sections = Array.from(this.host.querySelectorAll(":scope > dso-accordion-section"));
|
|
45
45
|
if (typeof sectionElement === "number") {
|
|
46
|
-
|
|
46
|
+
const section = sections[sectionElement];
|
|
47
|
+
if (section instanceof HTMLElement) {
|
|
48
|
+
sectionElement = section;
|
|
49
|
+
}
|
|
47
50
|
}
|
|
48
51
|
if (!(sectionElement instanceof HTMLElement) || !sections.includes(sectionElement)) {
|
|
49
52
|
return;
|
|
@@ -7,15 +7,19 @@ const annotationOutputCss = "*,*::after,*::before{box-sizing:border-box}dso-anno
|
|
|
7
7
|
const AnnotationOutput = class {
|
|
8
8
|
constructor(hostRef) {
|
|
9
9
|
registerInstance(this, hostRef);
|
|
10
|
-
this.dsoToggle = createEvent(this, "dsoToggle",
|
|
10
|
+
this.dsoToggle = createEvent(this, "dsoToggle", 3);
|
|
11
11
|
this.identifier = undefined;
|
|
12
12
|
this.annotationPrefix = undefined;
|
|
13
13
|
}
|
|
14
14
|
async toggleAnnotation(e, identifier) {
|
|
15
15
|
AnnotationService.toggle(identifier);
|
|
16
|
+
const open = AnnotationService.state[this.identifier];
|
|
17
|
+
if (open === undefined) {
|
|
18
|
+
throw new Error(`No state found for ${this.identifier}`);
|
|
19
|
+
}
|
|
16
20
|
this.dsoToggle.emit({
|
|
17
21
|
originalEvent: e,
|
|
18
|
-
open
|
|
22
|
+
open,
|
|
19
23
|
});
|
|
20
24
|
}
|
|
21
25
|
toggleHandler(e) {
|
|
@@ -129,10 +129,10 @@ const Autosuggest = class {
|
|
|
129
129
|
throw new ReferenceError("Mandatory label for text input not found");
|
|
130
130
|
}
|
|
131
131
|
const label = this.input.labels[0];
|
|
132
|
-
if (label.id) {
|
|
132
|
+
if (label === null || label === void 0 ? void 0 : label.id) {
|
|
133
133
|
this.labelId = label.id;
|
|
134
134
|
}
|
|
135
|
-
else {
|
|
135
|
+
else if (label) {
|
|
136
136
|
label.id = this.labelId;
|
|
137
137
|
}
|
|
138
138
|
this.input.setAttribute("role", "combobox");
|
|
@@ -154,7 +154,7 @@ const Autosuggest = class {
|
|
|
154
154
|
(_c = this.input) === null || _c === void 0 ? void 0 : _c.removeEventListener("focusin", this.onFocusIn);
|
|
155
155
|
}
|
|
156
156
|
markTerms(suggestionValue, terms) {
|
|
157
|
-
if (!suggestionValue || !terms || terms.length === 0) {
|
|
157
|
+
if (!suggestionValue || !terms || terms.length === 0 || terms[0] === undefined) {
|
|
158
158
|
return [""];
|
|
159
159
|
}
|
|
160
160
|
const termRegex = new RegExp(`(${escapeStringRegexp(terms[0])})`, "gi");
|
|
@@ -35,7 +35,11 @@ function parseDutchDate(value) {
|
|
|
35
35
|
return;
|
|
36
36
|
}
|
|
37
37
|
const matches = value.split("-");
|
|
38
|
-
if (matches.length === 3 &&
|
|
38
|
+
if (matches.length === 3 &&
|
|
39
|
+
typeof matches[0] === "string" &&
|
|
40
|
+
typeof matches[1] === "string" &&
|
|
41
|
+
typeof matches[2] === "string" &&
|
|
42
|
+
matches[2].length === 4) {
|
|
39
43
|
return createDate(matches[2], matches[1], matches[0]);
|
|
40
44
|
}
|
|
41
45
|
}
|
|
@@ -171,7 +175,11 @@ function chunk(array, chunkSize) {
|
|
|
171
175
|
function mapWithOffset(array, startingOffset, mapFn) {
|
|
172
176
|
return array.map((_, i) => {
|
|
173
177
|
const adjustedIndex = (i + startingOffset) % array.length;
|
|
174
|
-
|
|
178
|
+
const item = array[adjustedIndex];
|
|
179
|
+
if (!item) {
|
|
180
|
+
throw new Error("No item found");
|
|
181
|
+
}
|
|
182
|
+
return mapFn(item);
|
|
175
183
|
});
|
|
176
184
|
}
|
|
177
185
|
const DatePickerMonth = ({ selectedDate, focusedDate, labelledById, localization, firstDayOfWeek, min, max, onDateSelect, onKeyboardNavigation, focusedDayRef, onMouseDown, onFocusIn, }) => {
|
|
@@ -346,6 +354,9 @@ const DsoDatePicker = class {
|
|
|
346
354
|
};
|
|
347
355
|
this.handleTouchStart = (event) => {
|
|
348
356
|
const touch = event.changedTouches[0];
|
|
357
|
+
if (!touch) {
|
|
358
|
+
throw new Error("No touch found");
|
|
359
|
+
}
|
|
349
360
|
this.initialTouchX = touch.pageX;
|
|
350
361
|
this.initialTouchY = touch.pageY;
|
|
351
362
|
};
|
|
@@ -355,6 +366,9 @@ const DsoDatePicker = class {
|
|
|
355
366
|
this.handleTouchEnd = (event) => {
|
|
356
367
|
var _a, _b;
|
|
357
368
|
const touch = event.changedTouches[0];
|
|
369
|
+
if (!touch) {
|
|
370
|
+
throw new Error("No touch found");
|
|
371
|
+
}
|
|
358
372
|
const distX = touch.pageX - ((_a = this.initialTouchX) !== null && _a !== void 0 ? _a : 0); // get horizontal dist traveled
|
|
359
373
|
const distY = touch.pageY - ((_b = this.initialTouchY) !== null && _b !== void 0 ? _b : 0); // get vertical dist traveled
|
|
360
374
|
const threshold = 70;
|
|
@@ -195,6 +195,7 @@ const DropdownMenu = class {
|
|
|
195
195
|
return activeEl;
|
|
196
196
|
}
|
|
197
197
|
tabInPopup(direction) {
|
|
198
|
+
var _a;
|
|
198
199
|
const tabs = this.tabbables;
|
|
199
200
|
const currentIndex = tabs.findIndex((e) => e === this.getActiveElement());
|
|
200
201
|
let nextIndex = currentIndex + direction;
|
|
@@ -204,7 +205,7 @@ const DropdownMenu = class {
|
|
|
204
205
|
else if (nextIndex < 0) {
|
|
205
206
|
nextIndex = tabs.length - 1;
|
|
206
207
|
}
|
|
207
|
-
tabs[nextIndex].focus();
|
|
208
|
+
(_a = tabs[nextIndex]) === null || _a === void 0 ? void 0 : _a.focus();
|
|
208
209
|
}
|
|
209
210
|
render() {
|
|
210
211
|
return (h(Host, { onFocusout: this.focusOutListener, tabindex: this.open ? "-1" : undefined }, h("slot", { name: "toggle" }), h("div", { hidden: !this.open }, h("slot", null))));
|