@dso-toolkit/core 103.0.0 → 104.0.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/bundle/dso-accordion-section.js +4 -4
- package/dist/bundle/dso-action-list.js +1 -1
- package/dist/bundle/dso-advanced-select.js +4 -4
- package/dist/bundle/dso-alert.js +1 -1
- package/dist/bundle/dso-annotation-activiteit.js +2 -2
- package/dist/bundle/dso-annotation-gebiedsaanwijzing.js +2 -2
- package/dist/bundle/dso-annotation-kaart.js +2 -2
- package/dist/bundle/dso-annotation-locatie.js +1 -1
- package/dist/bundle/dso-annotation-omgevingsnormwaarde.js +2 -2
- package/dist/bundle/dso-badge.js +1 -1
- package/dist/bundle/dso-banner.js +1 -1
- package/dist/bundle/dso-card-container.js +1 -1
- package/dist/bundle/dso-card.js +1 -1
- package/dist/bundle/dso-document-component.js +1 -1
- package/dist/bundle/dso-dropdown-menu-item.js +6 -2
- package/dist/bundle/dso-dropdown-menu.js +1 -1
- package/dist/bundle/dso-grid-column.js +1 -1
- package/dist/bundle/dso-header.js +1 -1
- package/dist/bundle/dso-highlight-box.js +1 -1
- package/dist/bundle/dso-icon-button.js +1 -1
- package/dist/bundle/dso-image-overlay.js +1 -1
- package/dist/bundle/dso-info-button.js +1 -1
- package/dist/bundle/dso-info.js +1 -1
- package/dist/bundle/dso-label.js +1 -1
- package/dist/bundle/dso-legend-group.js +1 -1
- package/dist/bundle/dso-legend-item.js +2 -2
- package/dist/bundle/dso-legend.js +1 -1
- package/dist/bundle/dso-list-button.js +5 -5
- package/dist/bundle/dso-map-base-layers.js +4 -4
- package/dist/bundle/dso-map-controls.js +2 -2
- package/dist/bundle/dso-map-layer-object.js +1 -1
- package/dist/bundle/dso-map-layer.js +1 -1
- package/dist/bundle/dso-map-overlays.js +4 -4
- package/dist/bundle/dso-mark-bar.js +1 -1
- package/dist/bundle/dso-modal.js +1 -1
- package/dist/bundle/dso-onboarding-tip.js +1 -1
- package/dist/bundle/dso-ozon-content-toggletip.js +1 -1
- package/dist/bundle/dso-ozon-content.js +1 -1
- package/dist/bundle/dso-panel.js +1 -1
- package/dist/bundle/dso-plekinfo-card-item.js +1 -1
- package/dist/bundle/dso-plekinfo-card.js +1 -1
- package/dist/bundle/dso-project-item.js +2 -2
- package/dist/bundle/dso-renvooi.js +1 -1
- package/dist/bundle/dso-selectable.js +1 -1
- package/dist/bundle/dso-shopping-cart-item.js +2 -2
- package/dist/bundle/dso-shopping-cart.js +1 -1
- package/dist/bundle/dso-survey-rating.js +3 -3
- package/dist/bundle/dso-table.js +1 -1
- package/dist/bundle/dso-viewer-grid.js +1 -1
- package/dist/bundle/dsot-document-component-demo.js +13 -13
- package/dist/bundle/p--gUaHmK1.js +69 -0
- package/dist/bundle/{p-DHqJaOkE.js → p-B-KTvN4y.js} +1 -1
- package/dist/bundle/{p-C5ts7_Ak.js → p-BB_ih7Hk.js} +2 -2
- package/dist/bundle/{p-VEPEqk4_.js → p-BWa52F1H.js} +1 -1
- package/dist/bundle/p-Bs_nbcJ5.js +130 -0
- package/dist/bundle/{p-T4Dc3DFJ.js → p-CIVR1Iwo.js} +1 -1
- package/dist/bundle/{p-Bn0wLbPn.js → p-COWOGCTP.js} +1 -1
- package/dist/bundle/{p-D49N6P3Z.js → p-CYMksuXA.js} +2 -2
- package/dist/bundle/p-D3Akngmt.js +386 -0
- package/dist/bundle/{p-Cbzkudtw.js → p-DK7XdyJj.js} +9 -4
- package/dist/bundle/p-DwujHx9z.js +1232 -0
- package/dist/bundle/{p-Cq5S5vzL.js → p-DxSsBFIv.js} +2 -2
- package/dist/bundle/p-bSxB3IXF.js +176 -0
- package/dist/bundle/{p-DMsFeivg.js → p-lNRYydvn.js} +30 -4
- package/dist/bundle/{p-k0MQ-KkF.js → p-syG347lq.js} +1 -1
- package/dist/bundle/{p-CNb6BsD9.js → p-zu7axvCG.js} +9 -7
- package/dist/cjs/dso-accordion-section.cjs.entry.js +1 -1
- package/dist/cjs/dso-action-list.cjs.entry.js +1 -1
- package/dist/cjs/dso-advanced-select.cjs.entry.js +1 -1
- package/dist/cjs/dso-alert_7.cjs.entry.js +14 -12
- package/dist/cjs/dso-annotation-activiteit.cjs.entry.js +1 -1
- package/dist/cjs/dso-annotation-gebiedsaanwijzing.cjs.entry.js +1 -1
- package/dist/cjs/dso-annotation-kaart.cjs.entry.js +1 -1
- package/dist/cjs/dso-annotation-locatie_2.cjs.entry.js +2 -2
- package/dist/cjs/dso-annotation-omgevingsnormwaarde.cjs.entry.js +1 -1
- package/dist/cjs/dso-banner.cjs.entry.js +1 -1
- package/dist/cjs/dso-card-container.cjs.entry.js +1 -1
- package/dist/cjs/dso-card.cjs.entry.js +1 -1
- package/dist/cjs/dso-dropdown-menu-item.cjs.entry.js +6 -2
- package/dist/cjs/dso-dropdown-menu.cjs.entry.js +1 -1
- package/dist/cjs/dso-grid-column.cjs.entry.js +1 -1
- package/dist/cjs/dso-header.cjs.entry.js +1 -1
- package/dist/cjs/dso-highlight-box.cjs.entry.js +1 -1
- package/dist/cjs/dso-icon-button.cjs.entry.js +21 -2
- package/dist/cjs/dso-info_3.cjs.entry.js +28 -3
- package/dist/cjs/dso-label_2.cjs.entry.js +1 -1
- package/dist/cjs/dso-list-button.cjs.entry.js +1 -1
- package/dist/cjs/dso-map-controls.cjs.entry.js +1 -1
- package/dist/cjs/dso-map-layer-object.cjs.entry.js +1 -1
- package/dist/cjs/dso-map-layer.cjs.entry.js +1 -1
- package/dist/cjs/dso-plekinfo-card-item.cjs.entry.js +1 -1
- package/dist/cjs/dso-plekinfo-card.cjs.entry.js +1 -1
- package/dist/cjs/dso-renvooi_2.cjs.entry.js +1 -1
- package/dist/cjs/dso-shopping-cart-item.cjs.entry.js +1 -1
- package/dist/cjs/dso-shopping-cart.cjs.entry.js +1 -1
- package/dist/cjs/dso-survey-rating.cjs.entry.js +1 -1
- package/dist/cjs/dso-toolkit.cjs.js +1 -1
- package/dist/cjs/dso-viewer-grid.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/accordion/components/accordion-section.css +1 -3
- package/dist/collection/components/action-list/action-list.css +1 -1
- package/dist/collection/components/advanced-select/advanced-select.css +2 -2
- package/dist/collection/components/alert/alert.css +4 -4
- package/dist/collection/components/annotation/annotation.css +14 -10
- package/dist/collection/components/badge/badge.css +5 -5
- package/dist/collection/components/banner/banner.css +4 -4
- package/dist/collection/components/card/card.css +12 -8
- package/dist/collection/components/card-container/card-container.css +0 -2
- package/dist/collection/components/document-component/document-component.css +166 -57
- package/dist/collection/components/dropdown-menu/dropdown-menu-item/dropdown-menu-item.css +1 -0
- package/dist/collection/components/dropdown-menu/dropdown-menu-item/dropdown-menu-item.js +5 -1
- package/dist/collection/components/dropdown-menu/dropdown-menu.css +11 -11
- package/dist/collection/components/grid-column/grid-column.js +3 -1
- package/dist/collection/components/header/header.css +1 -1
- package/dist/collection/components/highlight-box/highlight-box.css +4 -4
- package/dist/collection/components/icon-button/icon-button.css +22 -21
- package/dist/collection/components/icon-button/icon-button.js +41 -2
- package/dist/collection/components/image-overlay/image-overlay.css +4 -4
- package/dist/collection/components/image-overlay/image-overlay.js +7 -5
- package/dist/collection/components/info/info.css +1 -1
- package/dist/collection/components/info/info.interfaces.js +1 -0
- package/dist/collection/components/info/info.js +50 -7
- package/dist/collection/components/label/label.css +6 -6
- package/dist/collection/components/list-button/list-button.css +3 -3
- package/dist/collection/components/map-controls/map-controls.css +164 -55
- package/dist/collection/components/map-layer/components/map-layer-object.css +2 -2
- package/dist/collection/components/map-layer/map-layer.css +2 -2
- package/dist/collection/components/ozon-content/components/ozon-content-toggletip/ozon-content-toggletip.js +3 -1
- package/dist/collection/components/ozon-content/ozon-content.css +178 -69
- package/dist/collection/components/panel/panel.css +1 -1
- package/dist/collection/components/plekinfo-card/plekinfo-card-item/plekinfo-card-item.css +2 -2
- package/dist/collection/components/plekinfo-card/plekinfo-card.css +3 -2
- package/dist/collection/components/renvooi/renvooi.css +2 -2
- package/dist/collection/components/selectable/selectable.js +24 -1
- package/dist/collection/components/shopping-cart/shopping-cart-item/shopping-cart-item.css +3 -3
- package/dist/collection/components/shopping-cart/shopping-cart.css +1 -1
- package/dist/collection/components/survey-rating/survey-rating.css +9 -9
- package/dist/collection/components/table/table.css +164 -55
- package/dist/collection/components/viewer-grid/viewer-grid.css +3 -3
- package/dist/components/alert.js +1 -1
- package/dist/components/annotation-locatie.js +1 -1
- package/dist/components/badge.js +1 -1
- package/dist/components/document-component.js +1 -1
- package/dist/components/dso-accordion-section.js +1 -1
- package/dist/components/dso-action-list.js +1 -1
- package/dist/components/dso-advanced-select.js +1 -1
- package/dist/components/dso-annotation-activiteit.js +1 -1
- package/dist/components/dso-annotation-gebiedsaanwijzing.js +1 -1
- package/dist/components/dso-annotation-kaart.js +1 -1
- package/dist/components/dso-annotation-omgevingsnormwaarde.js +1 -1
- package/dist/components/dso-banner.js +1 -1
- package/dist/components/dso-card-container.js +1 -1
- package/dist/components/dso-card.js +1 -1
- package/dist/components/dso-dropdown-menu-item.js +1 -1
- package/dist/components/dso-dropdown-menu.js +1 -1
- package/dist/components/dso-grid-column.js +1 -1
- package/dist/components/dso-header.js +1 -1
- package/dist/components/dso-highlight-box.js +1 -1
- package/dist/components/dso-list-button.js +1 -1
- package/dist/components/dso-map-controls.js +1 -1
- package/dist/components/dso-map-layer-object.js +1 -1
- package/dist/components/dso-map-layer.js +1 -1
- package/dist/components/dso-plekinfo-card-item.js +1 -1
- package/dist/components/dso-plekinfo-card.js +1 -1
- package/dist/components/dso-shopping-cart-item.js +1 -1
- package/dist/components/dso-shopping-cart.js +1 -1
- package/dist/components/dso-survey-rating.js +1 -1
- package/dist/components/dso-viewer-grid.js +1 -1
- package/dist/components/icon-button.js +1 -1
- package/dist/components/image-overlay.js +1 -1
- package/dist/components/info.js +1 -1
- package/dist/components/label.js +1 -1
- package/dist/components/ozon-content-toggletip.js +1 -1
- package/dist/components/ozon-content.js +1 -1
- package/dist/components/panel.js +1 -1
- package/dist/components/renvooi.js +1 -1
- package/dist/components/selectable.js +1 -1
- package/dist/components/table.js +1 -1
- package/dist/dso-toolkit/dso-toolkit.esm.js +1 -1
- package/dist/dso-toolkit/p-0bd4359a.entry.js +1 -0
- package/dist/dso-toolkit/p-1a83428e.entry.js +1 -0
- package/dist/dso-toolkit/p-1cbeac39.entry.js +1 -0
- package/dist/dso-toolkit/p-24b06d7f.entry.js +1 -0
- package/dist/dso-toolkit/{p-0262f952.entry.js → p-3474228d.entry.js} +1 -1
- package/dist/dso-toolkit/{p-93e628a3.entry.js → p-3d996ab8.entry.js} +1 -1
- package/dist/dso-toolkit/p-3f519757.entry.js +1 -0
- package/dist/dso-toolkit/p-4fb3a234.entry.js +1 -0
- package/dist/dso-toolkit/{p-5adcc734.entry.js → p-5578a548.entry.js} +1 -1
- package/dist/dso-toolkit/p-681b9112.entry.js +1 -0
- package/dist/dso-toolkit/p-6aac2c86.entry.js +1 -0
- package/dist/dso-toolkit/{p-98a57da4.entry.js → p-6ab91ffc.entry.js} +1 -1
- package/dist/dso-toolkit/{p-53cb1473.entry.js → p-7c1c3774.entry.js} +1 -1
- package/dist/dso-toolkit/{p-842861bd.entry.js → p-7fb97253.entry.js} +1 -1
- package/dist/dso-toolkit/p-90252564.entry.js +1 -0
- package/dist/dso-toolkit/{p-04d83ab7.entry.js → p-93947f6b.entry.js} +1 -1
- package/dist/dso-toolkit/p-9802516f.entry.js +1 -0
- package/dist/dso-toolkit/{p-5646f4e6.entry.js → p-a1104ea3.entry.js} +1 -1
- package/dist/dso-toolkit/p-a5ec568e.entry.js +1 -0
- package/dist/dso-toolkit/p-a9537924.entry.js +1 -0
- package/dist/dso-toolkit/p-aae78745.entry.js +1 -0
- package/dist/dso-toolkit/p-aecf9f7b.entry.js +1 -0
- package/dist/dso-toolkit/{p-313ae4fd.entry.js → p-bd471a11.entry.js} +1 -1
- package/dist/dso-toolkit/{p-55887adb.entry.js → p-c78ebf82.entry.js} +1 -1
- package/dist/dso-toolkit/{p-81f901f1.entry.js → p-ccee0ef7.entry.js} +1 -1
- package/dist/dso-toolkit/{p-e213b2c0.entry.js → p-ce252fc6.entry.js} +1 -1
- package/dist/dso-toolkit/p-d2b3ead1.entry.js +1 -0
- package/dist/dso-toolkit/{p-01819a74.entry.js → p-dabd6116.entry.js} +1 -1
- package/dist/dso-toolkit/{p-4ca411bb.entry.js → p-ecfd8dce.entry.js} +1 -1
- package/dist/dso-toolkit/p-f80e161a.entry.js +1 -0
- package/dist/dso-toolkit/p-fb0c4194.entry.js +1 -0
- package/dist/esm/dso-accordion-section.entry.js +1 -1
- package/dist/esm/dso-action-list.entry.js +1 -1
- package/dist/esm/dso-advanced-select.entry.js +1 -1
- package/dist/esm/dso-alert_7.entry.js +14 -12
- package/dist/esm/dso-annotation-activiteit.entry.js +1 -1
- package/dist/esm/dso-annotation-gebiedsaanwijzing.entry.js +1 -1
- package/dist/esm/dso-annotation-kaart.entry.js +1 -1
- package/dist/esm/dso-annotation-locatie_2.entry.js +2 -2
- package/dist/esm/dso-annotation-omgevingsnormwaarde.entry.js +1 -1
- package/dist/esm/dso-banner.entry.js +1 -1
- package/dist/esm/dso-card-container.entry.js +1 -1
- package/dist/esm/dso-card.entry.js +1 -1
- package/dist/esm/dso-dropdown-menu-item.entry.js +6 -2
- package/dist/esm/dso-dropdown-menu.entry.js +1 -1
- package/dist/esm/dso-grid-column.entry.js +1 -1
- package/dist/esm/dso-header.entry.js +1 -1
- package/dist/esm/dso-highlight-box.entry.js +1 -1
- package/dist/esm/dso-icon-button.entry.js +21 -2
- package/dist/esm/dso-info_3.entry.js +28 -3
- package/dist/esm/dso-label_2.entry.js +1 -1
- package/dist/esm/dso-list-button.entry.js +1 -1
- package/dist/esm/dso-map-controls.entry.js +1 -1
- package/dist/esm/dso-map-layer-object.entry.js +1 -1
- package/dist/esm/dso-map-layer.entry.js +1 -1
- package/dist/esm/dso-plekinfo-card-item.entry.js +1 -1
- package/dist/esm/dso-plekinfo-card.entry.js +1 -1
- package/dist/esm/dso-renvooi_2.entry.js +1 -1
- package/dist/esm/dso-shopping-cart-item.entry.js +1 -1
- package/dist/esm/dso-shopping-cart.entry.js +1 -1
- package/dist/esm/dso-survey-rating.entry.js +1 -1
- package/dist/esm/dso-toolkit.js +1 -1
- package/dist/esm/dso-viewer-grid.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/dropdown-menu/dropdown-menu-item/dropdown-menu-item.d.ts +1 -0
- package/dist/types/components/grid-column/grid-column.d.ts +2 -0
- package/dist/types/components/icon-button/icon-button.d.ts +8 -1
- package/dist/types/components/info/info.d.ts +13 -1
- package/dist/types/components/info/info.interfaces.d.ts +8 -0
- package/dist/types/components/ozon-content/components/ozon-content-toggletip/ozon-content-toggletip.d.ts +2 -0
- package/dist/types/components/selectable/selectable.d.ts +7 -0
- package/dist/types/components.d.ts +58 -5
- package/package.json +3 -3
- package/dist/bundle/p-BhoDbIAQ.js +0 -176
- package/dist/bundle/p-CNbJmSyU.js +0 -69
- package/dist/bundle/p-DDk2ov3h.js +0 -1232
- package/dist/bundle/p-DLbAdYPZ.js +0 -103
- package/dist/bundle/p-pV5ZBLPc.js +0 -386
- package/dist/dso-toolkit/p-170d6663.entry.js +0 -1
- package/dist/dso-toolkit/p-18241351.entry.js +0 -1
- package/dist/dso-toolkit/p-1c5754f0.entry.js +0 -1
- package/dist/dso-toolkit/p-3f1b48b1.entry.js +0 -1
- package/dist/dso-toolkit/p-3f525f8d.entry.js +0 -1
- package/dist/dso-toolkit/p-489094b9.entry.js +0 -1
- package/dist/dso-toolkit/p-4b1a0d10.entry.js +0 -1
- package/dist/dso-toolkit/p-4ecee93c.entry.js +0 -1
- package/dist/dso-toolkit/p-60050330.entry.js +0 -1
- package/dist/dso-toolkit/p-60e95275.entry.js +0 -1
- package/dist/dso-toolkit/p-6403d242.entry.js +0 -1
- package/dist/dso-toolkit/p-79b82b53.entry.js +0 -1
- package/dist/dso-toolkit/p-c369ad55.entry.js +0 -1
- package/dist/dso-toolkit/p-c85aee47.entry.js +0 -1
- package/dist/dso-toolkit/p-cbc3c1f5.entry.js +0 -1
- package/dist/dso-toolkit/p-df8f33a6.entry.js +0 -1
- package/dist/dso-toolkit/p-e2247a98.entry.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as o,HTMLElement as e,createEvent as a,h as r,Fragment as s,transformTag as t}from"@stencil/core/internal/client";import{i as n}from"./i18n.js";import{d}from"./button-group.js";import{d as i}from"./icon.js";import{d as l}from"./icon-button.js";import{d as c}from"./scrollable.js";const b={en:{"dso-map-controls":{title:"Map layers",layersButton:"Map layers",zoomIn:"Zoom in",zoomOut:"Zoom out",hidePanel:"Hide panel {{title}}"}},nl:{"dso-map-controls":{title:"Kaartlagen",layersButton:"Kaartlagen",zoomIn:"Zoom in",zoomOut:"Zoom uit",hidePanel:"Verberg paneel {{title}}"}}};var p,f,m,y,u,g,h,x=function(o,e,a,r,s){if("m"===r)throw new TypeError("Private method is not writable");if("a"===r&&!s)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?o!==e||!s:!e.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===r?s.call(o,a):s?s.value=a:e.set(o,a),a},v=function(o,e,a,r){if("a"===a&&!r)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?o!==e||!r:!e.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===a?r:"a"===a?r.call(o):r?r.value:e.get(o)};const k=o(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoZoomIn=a(this,"dsoZoomIn",7),this.dsoZoomOut=a(this,"dsoZoomOut",7),this.dsoToggle=a(this,"dsoToggle",7),this.open=!1,this.hideContent=!this.open,this.text=n((()=>this.host),b),p.set(this,void 0),f.set(this,void 0),m.set(this,void 0),y.set(this,void 0),u.set(this,void 0),g.set(this,"map-layers-panel"),h.set(this,"map-layers-title"),this.handlePanelKeyDown=o=>{"Escape"===o.key&&this.open&&(o.stopPropagation(),this.toggleVisibility(o))}}handleTransitionEnd(o){o.target===this.host&&"transform"===o.propertyName&&this.applyPostTransitionState()}watchOpen(o){this.clearPostTransitionTimeout(),this.hideContent=!1,x(this,y,window.setTimeout((()=>this.applyPostTransitionState()),350),"f")}async toggleVisibility(o){this.toggleVisibilityInternal(o)}toggleVisibilityInternal(o,e){!this.open&&e&&x(this,u,e,"f"),this.open=!this.open,this.dsoToggle.emit({originalEvent:o,open:this.open})}clearPostTransitionTimeout(){v(this,y,"f")&&(clearTimeout(v(this,y,"f")),x(this,y,void 0,"f"))}applyPostTransitionState(){this.clearPostTransitionTimeout(),this.open?v(this,m,"f")?.setFocus():(this.hideContent=!0,v(this,u,"f")===v(this,f,"f")?v(this,f,"f")?.setFocus():v(this,p,"f")?.focus())}disconnectedCallback(){this.clearPostTransitionTimeout()}render(){return r(s,{key:"f0b8a8d672ff2ecd51954e396da1231aa8d0a8ee"},r("dso-icon-button",{key:"9092607b42c28779166c96823e9c4147c0d166d5",expanded:this.open,label:this.text("layersButton"),icon:"layers",variant:"map","aria-controls":v(this,g,"f"),tooltipPlacement:"left",class:"toggle-visibility-icon-button",onDsoClick:o=>this.toggleVisibilityInternal(o.detail.originalEvent,v(this,f,"f")),ref:o=>x(this,f,o,"f")}),r("button",{key:"74b340eda8d100ce5d7ed991e178610a4452902b",type:"button",class:"dso-map toggle-visibility-button","aria-controls":v(this,g,"f"),"aria-expanded":this.open?"true":"false",onClick:o=>this.toggleVisibilityInternal(o,v(this,p,"f")),ref:o=>x(this,p,o,"f")},r("dso-icon",{key:"5be1b6750d24d17d729c91d48c259677348cf84a",icon:"layers"}),r("span",{key:"078ddcd38105cdcac7d913a8917628dc6683331a"},this.text("layersButton"))),r("dso-button-group",{key:"6bf9253e3357d382835e5e6882c9d1fb153735e2",class:"zoom-buttons",direction:"column"},r("dso-icon-button",{key:"38678972627d1761381393b903fe43f835b2d4b1",label:this.text("zoomIn"),icon:"plus",variant:"map",tooltipPlacement:"left",onDsoClick:o=>this.dsoZoomIn.emit(o.detail.originalEvent),disabled:"in"===this.disableZoom||"both"===this.disableZoom}),r("dso-icon-button",{key:"4ce5007da98518d2d0f34bb54983aad9f7b0b4f0",label:this.text("zoomOut"),icon:"minus",variant:"map",tooltipPlacement:"left",onDsoClick:o=>this.dsoZoomOut.emit(o.detail.originalEvent),disabled:"out"===this.disableZoom||"both"===this.disableZoom})),r("section",{key:"67c0953adb043a32f95dadd1acd0e3e4ce4e67a8",id:v(this,g,"f"),hidden:this.hideContent,role:"region",onKeyDown:this.handlePanelKeyDown,"aria-labelledby":v(this,g,"f")},r("header",{key:"6a3db2fa61ffa819c8a4174cc81d8f6bcf6948d5"},r("h2",{key:"2185d52419678eef2678dae3c7feae148fc674e6",id:v(this,h,"f"),tabIndex:-1},this.text("title")),r("dso-icon-button",{key:"dc34d548a7b7542cd20fdc1e8f7fc7f1cd66f93f",class:"close-button",label:this.text("hidePanel",{title:this.text("title")}),icon:"cross",variant:"tertiary",onDsoClick:o=>this.toggleVisibility(o.detail.originalEvent),ref:o=>x(this,m,o,"f")})),r("dso-scrollable",{key:"8e901c0c6f3ceb1dacc7a324953edeb38b8a5b4f"},r("div",{key:"63fec1fb6ad45ecb6db1ace06502e6273989ec3f",class:"content"},r("slot",{key:"a6f6cf22e6efba5c74fb1f675f85dafdcbf7654b"})))))}get host(){return this}static get watchers(){return{open:[{watchOpen:0}]}}static get style(){return"button { -webkit-appearance: button; color: inherit; cursor: pointer; font: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; line-height: inherit; margin: 0; overflow: visible; text-transform: none; } button[disabled] { cursor: default; } button::-moz-focus-inner { border: 0; padding: 0; } a.dso-primary, button.dso-primary, label.dso-primary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-primary:focus, a.dso-primary:focus-visible, button.dso-primary:focus, button.dso-primary:focus-visible, label.dso-primary:focus, label.dso-primary:focus-visible { outline-offset: 2px; } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { outline: 0; } a.dso-primary.extern::after, a.dso-primary.download::after, button.dso-primary.extern::after, button.dso-primary.download::after, label.dso-primary.extern::after, label.dso-primary.download::after { content: \"\"; display: inline-block; } a.dso-primary, button.dso-primary, label.dso-primary { background-color: var(--_dso-button-primary-background-color, #39870c); border-color: var(--_dso-button-primary-border-color, #39870c); color: var(--_dso-button-primary-color, #fff); float: var(--_dso-button-float-primary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-primary:hover, button.dso-primary:hover, label.dso-primary:hover { background-color: var(--_dso-button-primary-hover-background-color, #275937); border-color: var(--_dso-button-primary-hover-border-color, #275937); color: var(--_dso-button-primary-hover-color, #fff); float: var(--_dso-button-float-primary, none); } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { background-color: var(--_dso-button-primary-active-background-color, #173521); border-color: var(--_dso-button-primary-active-border-color, #173521); color: var(--_dso-button-primary-active-color, #fff); float: var(--_dso-button-float-primary, none); } a.dso-primary[disabled], a.dso-primary[disabled]:hover, button.dso-primary[disabled], button.dso-primary[disabled]:hover, label.dso-primary[disabled], label.dso-primary[disabled]:hover { background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d); border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d); color: var(--_dso-button-primary-disabled-color, #fff); float: var(--_dso-button-float-primary, none); } a.dso-primary.dso-small, button.dso-primary.dso-small, label.dso-primary.dso-small { line-height: 1rem; } a.dso-primary.dso-small dso-icon, a.dso-primary.dso-small.extern::after, a.dso-primary.dso-small.download::after, a.dso-primary.dso-small.dso-spinner::before, button.dso-primary.dso-small dso-icon, button.dso-primary.dso-small.extern::after, button.dso-primary.dso-small.download::after, button.dso-primary.dso-small.dso-spinner::before, label.dso-primary.dso-small dso-icon, label.dso-primary.dso-small.extern::after, label.dso-primary.dso-small.download::after, label.dso-primary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-small.dso-spinner-left::before, button.dso-primary.dso-small.dso-spinner-left::before, label.dso-primary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-small.dso-spinner-right::after, button.dso-primary.dso-small.dso-spinner-right::after, label.dso-primary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { line-height: 1rem; } a.dso-primary.dso-extra-small dso-icon, a.dso-primary.dso-extra-small.extern::after, a.dso-primary.dso-extra-small.download::after, a.dso-primary.dso-extra-small.dso-spinner::before, button.dso-primary.dso-extra-small dso-icon, button.dso-primary.dso-extra-small.extern::after, button.dso-primary.dso-extra-small.download::after, button.dso-primary.dso-extra-small.dso-spinner::before, label.dso-primary.dso-extra-small dso-icon, label.dso-primary.dso-extra-small.extern::after, label.dso-primary.dso-extra-small.download::after, label.dso-primary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-extra-small.dso-spinner-left::before, button.dso-primary.dso-extra-small.dso-spinner-left::before, label.dso-primary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small.dso-spinner-right::after, button.dso-primary.dso-extra-small.dso-spinner-right::after, label.dso-primary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { padding-block: 9px; } a.dso-primary dso-icon:has(+ span:not(.sr-only)), button.dso-primary dso-icon:has(+ span:not(.sr-only)), label.dso-primary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-primary span:not(.sr-only) + dso-icon, button.dso-primary span:not(.sr-only) + dso-icon, label.dso-primary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-primary dso-icon + span:not(.sr-only), button.dso-primary dso-icon + span:not(.sr-only), label.dso-primary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled], button.dso-primary.dso-spinner-left[disabled], button.dso-primary.dso-spinner-right[disabled], label.dso-primary.dso-spinner-left[disabled], label.dso-primary.dso-spinner-right[disabled] { background-color: #39870c; border-color: #39870c; color: #fff; } a.dso-primary.dso-spinner-left::before, button.dso-primary.dso-spinner-left::before, label.dso-primary.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-primary.dso-spinner-right::after, button.dso-primary.dso-spinner-right::after, label.dso-primary.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-primary.download::after, button.dso-primary.download::after, label.dso-primary.download::after { background-image: var(--_dso-di-download-wit); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-primary.extern::after, button.dso-primary.extern::after, label.dso-primary.extern::after { background-image: var(--_dso-di-external-link-wit); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-secondary, button.dso-secondary, label.dso-secondary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-secondary:focus, a.dso-secondary:focus-visible, button.dso-secondary:focus, button.dso-secondary:focus-visible, label.dso-secondary:focus, label.dso-secondary:focus-visible { outline-offset: 2px; } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { outline: 0; } a.dso-secondary.extern::after, a.dso-secondary.download::after, button.dso-secondary.extern::after, button.dso-secondary.download::after, label.dso-secondary.extern::after, label.dso-secondary.download::after { content: \"\"; display: inline-block; } a.dso-secondary, button.dso-secondary, label.dso-secondary { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dso-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-secondary:hover, button.dso-secondary:hover, label.dso-secondary:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dso-button-float-secondary, none); } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dso-button-float-secondary, none); } a.dso-secondary[disabled], a.dso-secondary[disabled]:hover, button.dso-secondary[disabled], button.dso-secondary[disabled]:hover, label.dso-secondary[disabled], label.dso-secondary[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dso-button-float-secondary, none); } a.dso-secondary.dso-small, button.dso-secondary.dso-small, label.dso-secondary.dso-small { line-height: 1rem; } a.dso-secondary.dso-small dso-icon, a.dso-secondary.dso-small.extern::after, a.dso-secondary.dso-small.download::after, a.dso-secondary.dso-small.dso-spinner::before, button.dso-secondary.dso-small dso-icon, button.dso-secondary.dso-small.extern::after, button.dso-secondary.dso-small.download::after, button.dso-secondary.dso-small.dso-spinner::before, label.dso-secondary.dso-small dso-icon, label.dso-secondary.dso-small.extern::after, label.dso-secondary.dso-small.download::after, label.dso-secondary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-small.dso-spinner-left::before, button.dso-secondary.dso-small.dso-spinner-left::before, label.dso-secondary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-small.dso-spinner-right::after, button.dso-secondary.dso-small.dso-spinner-right::after, label.dso-secondary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { line-height: 1rem; } a.dso-secondary.dso-extra-small dso-icon, a.dso-secondary.dso-extra-small.extern::after, a.dso-secondary.dso-extra-small.download::after, a.dso-secondary.dso-extra-small.dso-spinner::before, button.dso-secondary.dso-extra-small dso-icon, button.dso-secondary.dso-extra-small.extern::after, button.dso-secondary.dso-extra-small.download::after, button.dso-secondary.dso-extra-small.dso-spinner::before, label.dso-secondary.dso-extra-small dso-icon, label.dso-secondary.dso-extra-small.extern::after, label.dso-secondary.dso-extra-small.download::after, label.dso-secondary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-extra-small.dso-spinner-left::before, button.dso-secondary.dso-extra-small.dso-spinner-left::before, label.dso-secondary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small.dso-spinner-right::after, button.dso-secondary.dso-extra-small.dso-spinner-right::after, label.dso-secondary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { padding-block: 9px; } a.dso-secondary dso-icon:has(+ span:not(.sr-only)), button.dso-secondary dso-icon:has(+ span:not(.sr-only)), label.dso-secondary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-secondary span:not(.sr-only) + dso-icon, button.dso-secondary span:not(.sr-only) + dso-icon, label.dso-secondary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-secondary dso-icon + span:not(.sr-only), button.dso-secondary dso-icon + span:not(.sr-only), label.dso-secondary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled], button.dso-secondary.dso-spinner-left[disabled], button.dso-secondary.dso-spinner-right[disabled], label.dso-secondary.dso-spinner-left[disabled], label.dso-secondary.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-secondary.dso-spinner-left::before, button.dso-secondary.dso-spinner-left::before, label.dso-secondary.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]):hover::before, button.dso-secondary.dso-spinner-left:not([disabled]):hover::before, label.dso-secondary.dso-spinner-left:not([disabled]):hover::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-spinner-right::after, button.dso-secondary.dso-spinner-right::after, label.dso-secondary.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]):hover::after, button.dso-secondary.dso-spinner-right:not([disabled]):hover::after, label.dso-secondary.dso-spinner-right:not([disabled]):hover::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.download::after, button.dso-secondary.download::after, label.dso-secondary.download::after { background-image: var(--_dso-di-download-grasgroen); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-secondary.download:hover::after, button.dso-secondary.download:hover::after, label.dso-secondary.download:hover::after { background-image: var(--_dso-di-download-bosgroen); } a.dso-secondary.download:active::after, button.dso-secondary.download:active::after, label.dso-secondary.download:active::after { background-image: var(--_dso-di-download-wit); } a.dso-secondary.download[disabled]::after, button.dso-secondary.download[disabled]::after, label.dso-secondary.download[disabled]::after { background-image: var(--_dso-di-download-grasgroen-40); } a.dso-secondary.extern::after, button.dso-secondary.extern::after, label.dso-secondary.extern::after { background-image: var(--_dso-di-external-link-grasgroen); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-secondary.extern:hover::after, button.dso-secondary.extern:hover::after, label.dso-secondary.extern:hover::after { background-image: var(--_dso-di-external-link-bosgroen); } a.dso-secondary.extern:active::after, button.dso-secondary.extern:active::after, label.dso-secondary.extern:active::after { background-image: var(--_dso-di-external-link-wit); } a.dso-secondary.extern[disabled]::after, button.dso-secondary.extern[disabled]::after, label.dso-secondary.extern[disabled]::after { background-image: var(--_dso-di-external-link-grasgroen-40); } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: \"\"; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: \"\"; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dso-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-tertiary:hover, button.dso-tertiary:hover, label.dso-tertiary:hover { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dso-button-float-tertiary, none); } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dso-button-float-tertiary, none); } a.dso-tertiary[disabled], a.dso-tertiary[disabled]:hover, button.dso-tertiary[disabled], button.dso-tertiary[disabled]:hover, label.dso-tertiary[disabled], label.dso-tertiary[disabled]:hover { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dso-button-float-tertiary, none); } a.dso-tertiary.dso-small, button.dso-tertiary.dso-small, label.dso-tertiary.dso-small { line-height: 1rem; } a.dso-tertiary.dso-small dso-icon, a.dso-tertiary.dso-small.extern::after, a.dso-tertiary.dso-small.download::after, a.dso-tertiary.dso-small.dso-spinner::before, button.dso-tertiary.dso-small dso-icon, button.dso-tertiary.dso-small.extern::after, button.dso-tertiary.dso-small.download::after, button.dso-tertiary.dso-small.dso-spinner::before, label.dso-tertiary.dso-small dso-icon, label.dso-tertiary.dso-small.extern::after, label.dso-tertiary.dso-small.download::after, label.dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-small.dso-spinner-left::before, button.dso-tertiary.dso-small.dso-spinner-left::before, label.dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-small.dso-spinner-right::after, button.dso-tertiary.dso-small.dso-spinner-right::after, label.dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { line-height: 1rem; } a.dso-tertiary.dso-extra-small dso-icon, a.dso-tertiary.dso-extra-small.extern::after, a.dso-tertiary.dso-extra-small.download::after, a.dso-tertiary.dso-extra-small.dso-spinner::before, button.dso-tertiary.dso-extra-small dso-icon, button.dso-tertiary.dso-extra-small.extern::after, button.dso-tertiary.dso-extra-small.download::after, button.dso-tertiary.dso-extra-small.dso-spinner::before, label.dso-tertiary.dso-extra-small dso-icon, label.dso-tertiary.dso-extra-small.extern::after, label.dso-tertiary.dso-extra-small.download::after, label.dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-extra-small.dso-spinner-left::before, button.dso-tertiary.dso-extra-small.dso-spinner-left::before, label.dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small.dso-spinner-right::after, button.dso-tertiary.dso-extra-small.dso-spinner-right::after, label.dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { padding-block: 9px; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dso-button-padding-block-tertiary, 0); background-color: transparent; } a.dso-tertiary[disabled].dso-spinner-left, a.dso-tertiary[disabled].dso-spinner-right, button.dso-tertiary[disabled].dso-spinner-left, button.dso-tertiary[disabled].dso-spinner-right, label.dso-tertiary[disabled].dso-spinner-left, label.dso-tertiary[disabled].dso-spinner-right { color: #39870c; } a.dso-tertiary:not([disabled]):hover, button.dso-tertiary:not([disabled]):hover, label.dso-tertiary:not([disabled]):hover { text-decoration: underline; text-underline-position: under; } a.dso-tertiary.dso-align, button.dso-tertiary.dso-align, label.dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } a.dso-tertiary.dso-truncate, button.dso-tertiary.dso-truncate, label.dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } a.dso-tertiary.dso-spinner-left::before, button.dso-tertiary.dso-spinner-left::before, label.dso-tertiary.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } a.dso-tertiary.dso-spinner-right::after, button.dso-tertiary.dso-spinner-right::after, label.dso-tertiary.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } a.dso-tertiary dso-icon + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon, button.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon, label.dso-tertiary dso-icon + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 4px; } a.dso-tertiary dso-icon, a.dso-tertiary span, button.dso-tertiary dso-icon, button.dso-tertiary span, label.dso-tertiary dso-icon, label.dso-tertiary span { vertical-align: middle; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { position: relative; inset-block-start: -2px; } a.dso-tertiary.download::after, button.dso-tertiary.download::after, label.dso-tertiary.download::after { background-image: var(--_dso-button-tertiary-download-icon, var(--_dso-di-download-grasgroen)); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-tertiary.download[disabled]::after, button.dso-tertiary.download[disabled]::after, label.dso-tertiary.download[disabled]::after { background-image: var(--_dso-di-download-grasgroen-40); } a.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):active::after, button.dso-tertiary.download:not([disabled]):hover::after, button.dso-tertiary.download:not([disabled]):active::after, label.dso-tertiary.download:not([disabled]):hover::after, label.dso-tertiary.download:not([disabled]):active::after { background-image: var(--_dso-button-tertiary-download-icon, var(--_dso-di-download-bosgroen)); } a.dso-tertiary.extern::after, button.dso-tertiary.extern::after, label.dso-tertiary.extern::after { background-image: var(--_dso-button-tertiary-external-link-icon, var(--_dso-di-external-link-grasgroen)); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-tertiary.extern[disabled]::after, button.dso-tertiary.extern[disabled]::after, label.dso-tertiary.extern[disabled]::after { background-image: var(--_dso-di-external-link-grasgroen-40); } a.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):active::after, button.dso-tertiary.extern:not([disabled]):hover::after, button.dso-tertiary.extern:not([disabled]):active::after, label.dso-tertiary.extern:not([disabled]):hover::after, label.dso-tertiary.extern:not([disabled]):active::after { background-image: var(--_dso-button-tertiary-external-link-icon, var(--_dso-di-external-link-bosgroen)); } a.dso-map, button.dso-map, label.dso-map { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: 2px; } a.dso-map:active, button.dso-map:active, label.dso-map:active { outline: 0; } a.dso-map, button.dso-map, label.dso-map { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dso-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-map:hover, button.dso-map:hover, label.dso-map:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dso-button-float-secondary, none); } a.dso-map:active, button.dso-map:active, label.dso-map:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dso-button-float-secondary, none); } a.dso-map[disabled], a.dso-map[disabled]:hover, button.dso-map[disabled], button.dso-map[disabled]:hover, label.dso-map[disabled], label.dso-map[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dso-button-float-secondary, none); } a.dso-map.dso-small, button.dso-map.dso-small, label.dso-map.dso-small { line-height: 1rem; } a.dso-map.dso-small dso-icon, a.dso-map.dso-small.extern::after, a.dso-map.dso-small.download::after, a.dso-map.dso-small.dso-spinner::before, button.dso-map.dso-small dso-icon, button.dso-map.dso-small.extern::after, button.dso-map.dso-small.download::after, button.dso-map.dso-small.dso-spinner::before, label.dso-map.dso-small dso-icon, label.dso-map.dso-small.extern::after, label.dso-map.dso-small.download::after, label.dso-map.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-small.dso-spinner-left::before, button.dso-map.dso-small.dso-spinner-left::before, label.dso-map.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-small.dso-spinner-right::after, button.dso-map.dso-small.dso-spinner-right::after, label.dso-map.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { line-height: 1rem; } a.dso-map.dso-extra-small dso-icon, a.dso-map.dso-extra-small.extern::after, a.dso-map.dso-extra-small.download::after, a.dso-map.dso-extra-small.dso-spinner::before, button.dso-map.dso-extra-small dso-icon, button.dso-map.dso-extra-small.extern::after, button.dso-map.dso-extra-small.download::after, button.dso-map.dso-extra-small.dso-spinner::before, label.dso-map.dso-extra-small dso-icon, label.dso-map.dso-extra-small.extern::after, label.dso-map.dso-extra-small.download::after, label.dso-map.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-extra-small.dso-spinner-left::before, button.dso-map.dso-extra-small.dso-spinner-left::before, label.dso-map.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small.dso-spinner-right::after, button.dso-map.dso-extra-small.dso-spinner-right::after, label.dso-map.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { padding-block: 9px; } a.dso-map dso-icon:has(+ span:not(.sr-only)), button.dso-map dso-icon:has(+ span:not(.sr-only)), label.dso-map dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-map span:not(.sr-only) + dso-icon, button.dso-map span:not(.sr-only) + dso-icon, label.dso-map span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-map dso-icon + span:not(.sr-only), button.dso-map dso-icon + span:not(.sr-only), label.dso-map dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-map.dso-spinner-left[disabled], a.dso-map.dso-spinner-right[disabled], button.dso-map.dso-spinner-left[disabled], button.dso-map.dso-spinner-right[disabled], label.dso-map.dso-spinner-left[disabled], label.dso-map.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-map.dso-spinner-left::before, button.dso-map.dso-spinner-left::before, label.dso-map.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]):hover::before, button.dso-map.dso-spinner-left:not([disabled]):hover::before, label.dso-map.dso-spinner-left:not([disabled]):hover::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-spinner-right::after, button.dso-map.dso-spinner-right::after, label.dso-map.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]):hover::after, button.dso-map.dso-spinner-right:not([disabled]):hover::after, label.dso-map.dso-spinner-right:not([disabled]):hover::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-map, button.dso-map, label.dso-map { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5); border: 0; font-weight: 600; margin-inline-end: 16px; padding-block: 8px; padding-inline: 16px; white-space: nowrap; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: -1px; } a.dso-map:has(span.sr-only):has(dso-icon), button.dso-map:has(span.sr-only):has(dso-icon), label.dso-map:has(span.sr-only):has(dso-icon) { padding: 8px; min-inline-size: auto; block-size: 40px; inline-size: 40px; } a.dso-primary, a.dso-primary:hover, a.dso-primary:visited, a.dso-primary:focus-visible { color: #fff; text-decoration: none; } a.dso-secondary { text-decoration: none; } a.dso-secondary, a.dso-secondary:visited:not(:hover):not(:active), a.dso-secondary:focus-visible:not(:hover):not(:active) { color: #39870c; } a.dso-secondary:hover, a.dso-secondary:focus-visible { text-decoration: none; } a.dso-tertiary { text-decoration: none; } a.dso-tertiary, a.dso-tertiary:visited { color: var(--_dso-button-tertiary-color, #39870c); } .dso-primary + .dso-primary, .dso-primary + .dso-secondary, .dso-primary + .dso-tertiary, .dso-secondary + .dso-primary, .dso-secondary + .dso-secondary, .dso-secondary + .dso-tertiary, .dso-tertiary + .dso-primary, .dso-tertiary + .dso-secondary, .dso-tertiary + .dso-tertiary { margin-block-start: var(--_dso-button-after-button-margin-block-start, 0); margin-inline-start: var(--_dso-button-after-button-margin-inline-start, 16px); } :host { background-color: #fff; border: 1px solid #ccc; inset-block-end: 0; display: block; font-family: Asap, sans-serif; position: absolute; inset-block-start: 0; inset-inline-start: 100%; transition: transform 300ms ease; inline-size: 300px; } *, *::after, *::before { box-sizing: border-box; } :host([open]) { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3); transform: translateX(-100%); } :host([open]) .toggle-visibility-button, :host([open]) .toggle-visibility-icon-button { display: none; } :host([open]) .zoom-buttons { inset-block-start: 16px; } .toggle-visibility-icon-button { display: none; } .toggle-visibility-button { position: absolute; inset-inline-end: calc(100% + 56px); inset-block-start: 16px; } .zoom-buttons { position: absolute; inset-inline-end: calc(100% + 16px); inset-block-start: 16px; } .close-button { padding: 0; position: absolute; inset-inline-end: 16px; inset-block-start: 16px; } section:not([hidden]) { display: flex; flex-direction: column; block-size: 100%; } header, .content { padding: 16px; } header { border-block-end: 1px solid #ccc; flex-grow: 0; position: relative; } header h2 { color: #275937; font-family: \"Asap\", sans-serif; line-height: 1; margin: 0; } @media screen and (max-width: 767px) { button.toggle-visibility-button { display: none; } .toggle-visibility-icon-button { display: inline-block; position: absolute; inset-block-start: 16px; inset-inline-end: calc(100% + 16px); } .zoom-buttons { inset-block-start: 72px; } }"}},[257,"dso-map-controls",{open:[1540],disableZoom:[1,"disable-zoom"],hideContent:[32],toggleVisibility:[64]},[[0,"transitionend","handleTransitionEnd"]],{open:[{watchOpen:0}]}]);p=new WeakMap,f=new WeakMap,m=new WeakMap,y=new WeakMap,u=new WeakMap,g=new WeakMap,h=new WeakMap;const w=k,B=function(){"undefined"!=typeof customElements&&["dso-map-controls","dso-button-group","dso-icon","dso-icon-button","dso-scrollable"].forEach((o=>{switch(o){case"dso-map-controls":customElements.get(t(o))||customElements.define(t(o),k);break;case"dso-button-group":customElements.get(t(o))||d();break;case"dso-icon":customElements.get(t(o))||i();break;case"dso-icon-button":customElements.get(t(o))||l();break;case"dso-scrollable":customElements.get(t(o))||c()}}))};export{w as DsoMapControls,B as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as o,HTMLElement as e,createEvent as a,h as s,Fragment as r,transformTag as t}from"@stencil/core/internal/client";import{i as n}from"./i18n.js";import{d}from"./button-group.js";import{d as i}from"./icon.js";import{d as l}from"./icon-button.js";import{d as b}from"./scrollable.js";const c={en:{"dso-map-controls":{title:"Map layers",layersButton:"Map layers",zoomIn:"Zoom in",zoomOut:"Zoom out",hidePanel:"Hide panel {{title}}"}},nl:{"dso-map-controls":{title:"Kaartlagen",layersButton:"Kaartlagen",zoomIn:"Zoom in",zoomOut:"Zoom uit",hidePanel:"Verberg paneel {{title}}"}}};var p,f,m,y,u,g,h,v=function(o,e,a,s,r){if("m"===s)throw new TypeError("Private method is not writable");if("a"===s&&!r)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?o!==e||!r:!e.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===s?r.call(o,a):r?r.value=a:e.set(o,a),a},x=function(o,e,a,s){if("a"===a&&!s)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?o!==e||!s:!e.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===a?s:"a"===a?s.call(o):s?s.value:e.get(o)};const k=o(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoZoomIn=a(this,"dsoZoomIn",7),this.dsoZoomOut=a(this,"dsoZoomOut",7),this.dsoToggle=a(this,"dsoToggle",7),this.open=!1,this.hideContent=!this.open,this.text=n((()=>this.host),c),p.set(this,void 0),f.set(this,void 0),m.set(this,void 0),y.set(this,void 0),u.set(this,void 0),g.set(this,"map-layers-panel"),h.set(this,"map-layers-title"),this.handlePanelKeyDown=o=>{"Escape"===o.key&&this.open&&(o.stopPropagation(),this.toggleVisibility(o))}}handleTransitionEnd(o){o.target===this.host&&"transform"===o.propertyName&&this.applyPostTransitionState()}watchOpen(o){this.clearPostTransitionTimeout(),this.hideContent=!1,v(this,y,window.setTimeout((()=>this.applyPostTransitionState()),350),"f")}async toggleVisibility(o){this.toggleVisibilityInternal(o)}toggleVisibilityInternal(o,e){!this.open&&e&&v(this,u,e,"f"),this.open=!this.open,this.dsoToggle.emit({originalEvent:o,open:this.open})}clearPostTransitionTimeout(){x(this,y,"f")&&(clearTimeout(x(this,y,"f")),v(this,y,void 0,"f"))}applyPostTransitionState(){this.clearPostTransitionTimeout(),this.open?x(this,m,"f")?.setFocus():(this.hideContent=!0,x(this,u,"f")===x(this,f,"f")?x(this,f,"f")?.setFocus():x(this,p,"f")?.focus())}disconnectedCallback(){this.clearPostTransitionTimeout()}render(){return s(r,{key:"f0b8a8d672ff2ecd51954e396da1231aa8d0a8ee"},s("dso-icon-button",{key:"9092607b42c28779166c96823e9c4147c0d166d5",expanded:this.open,label:this.text("layersButton"),icon:"layers",variant:"map","aria-controls":x(this,g,"f"),tooltipPlacement:"left",class:"toggle-visibility-icon-button",onDsoClick:o=>this.toggleVisibilityInternal(o.detail.originalEvent,x(this,f,"f")),ref:o=>v(this,f,o,"f")}),s("button",{key:"74b340eda8d100ce5d7ed991e178610a4452902b",type:"button",class:"dso-map toggle-visibility-button","aria-controls":x(this,g,"f"),"aria-expanded":this.open?"true":"false",onClick:o=>this.toggleVisibilityInternal(o,x(this,p,"f")),ref:o=>v(this,p,o,"f")},s("dso-icon",{key:"5be1b6750d24d17d729c91d48c259677348cf84a",icon:"layers"}),s("span",{key:"078ddcd38105cdcac7d913a8917628dc6683331a"},this.text("layersButton"))),s("dso-button-group",{key:"6bf9253e3357d382835e5e6882c9d1fb153735e2",class:"zoom-buttons",direction:"column"},s("dso-icon-button",{key:"38678972627d1761381393b903fe43f835b2d4b1",label:this.text("zoomIn"),icon:"plus",variant:"map",tooltipPlacement:"left",onDsoClick:o=>this.dsoZoomIn.emit(o.detail.originalEvent),disabled:"in"===this.disableZoom||"both"===this.disableZoom}),s("dso-icon-button",{key:"4ce5007da98518d2d0f34bb54983aad9f7b0b4f0",label:this.text("zoomOut"),icon:"minus",variant:"map",tooltipPlacement:"left",onDsoClick:o=>this.dsoZoomOut.emit(o.detail.originalEvent),disabled:"out"===this.disableZoom||"both"===this.disableZoom})),s("section",{key:"67c0953adb043a32f95dadd1acd0e3e4ce4e67a8",id:x(this,g,"f"),hidden:this.hideContent,role:"region",onKeyDown:this.handlePanelKeyDown,"aria-labelledby":x(this,g,"f")},s("header",{key:"6a3db2fa61ffa819c8a4174cc81d8f6bcf6948d5"},s("h2",{key:"2185d52419678eef2678dae3c7feae148fc674e6",id:x(this,h,"f"),tabIndex:-1},this.text("title")),s("dso-icon-button",{key:"dc34d548a7b7542cd20fdc1e8f7fc7f1cd66f93f",class:"close-button",label:this.text("hidePanel",{title:this.text("title")}),icon:"cross",variant:"tertiary",onDsoClick:o=>this.toggleVisibility(o.detail.originalEvent),ref:o=>v(this,m,o,"f")})),s("dso-scrollable",{key:"8e901c0c6f3ceb1dacc7a324953edeb38b8a5b4f"},s("div",{key:"63fec1fb6ad45ecb6db1ace06502e6273989ec3f",class:"content"},s("slot",{key:"a6f6cf22e6efba5c74fb1f675f85dafdcbf7654b"})))))}get host(){return this}static get watchers(){return{open:[{watchOpen:0}]}}static get style(){return"button { -webkit-appearance: button; color: inherit; cursor: pointer; font: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; line-height: inherit; margin: 0; overflow: visible; text-transform: none; } button[disabled] { cursor: default; } button::-moz-focus-inner { border: 0; padding: 0; } a.dso-primary, button.dso-primary, label.dso-primary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-primary:focus, a.dso-primary:focus-visible, button.dso-primary:focus, button.dso-primary:focus-visible, label.dso-primary:focus, label.dso-primary:focus-visible { outline-offset: 2px; } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { outline: 0; } a.dso-primary.extern::after, a.dso-primary.download::after, button.dso-primary.extern::after, button.dso-primary.download::after, label.dso-primary.extern::after, label.dso-primary.download::after { content: \"\"; display: inline-block; } a.dso-primary, button.dso-primary, label.dso-primary { background-color: var(--_dso-button-primary-background-color, #39870c); border-color: var(--_dso-button-primary-border-color, #39870c); color: var(--_dso-button-primary-color, #fff); float: var(--_dso-button-float-primary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-primary:hover, a.dso-primary:focus-visible, button.dso-primary:hover, button.dso-primary:focus-visible, label.dso-primary:hover, label.dso-primary:focus-visible { background-color: var(--_dso-button-primary-hover-background-color, #275937); border-color: var(--_dso-button-primary-hover-border-color, #275937); color: var(--_dso-button-primary-hover-color, #fff); float: var(--_dso-button-float-primary, none); } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { background-color: var(--_dso-button-primary-active-background-color, #173521); border-color: var(--_dso-button-primary-active-border-color, #173521); color: var(--_dso-button-primary-active-color, #fff); float: var(--_dso-button-float-primary, none); } a.dso-primary[disabled], a.dso-primary[disabled]:hover, a.dso-primary[disabled]:focus-visible, button.dso-primary[disabled], button.dso-primary[disabled]:hover, button.dso-primary[disabled]:focus-visible, label.dso-primary[disabled], label.dso-primary[disabled]:hover, label.dso-primary[disabled]:focus-visible { background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d); border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d); color: var(--_dso-button-primary-disabled-color, #fff); float: var(--_dso-button-float-primary, none); } a.dso-primary.dso-small, button.dso-primary.dso-small, label.dso-primary.dso-small { line-height: 1rem; } a.dso-primary.dso-small dso-icon, a.dso-primary.dso-small.extern::after, a.dso-primary.dso-small.download::after, a.dso-primary.dso-small.dso-spinner::before, button.dso-primary.dso-small dso-icon, button.dso-primary.dso-small.extern::after, button.dso-primary.dso-small.download::after, button.dso-primary.dso-small.dso-spinner::before, label.dso-primary.dso-small dso-icon, label.dso-primary.dso-small.extern::after, label.dso-primary.dso-small.download::after, label.dso-primary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-small.dso-spinner-left::before, button.dso-primary.dso-small.dso-spinner-left::before, label.dso-primary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-small.dso-spinner-right::after, button.dso-primary.dso-small.dso-spinner-right::after, label.dso-primary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { line-height: 1rem; } a.dso-primary.dso-extra-small dso-icon, a.dso-primary.dso-extra-small.extern::after, a.dso-primary.dso-extra-small.download::after, a.dso-primary.dso-extra-small.dso-spinner::before, button.dso-primary.dso-extra-small dso-icon, button.dso-primary.dso-extra-small.extern::after, button.dso-primary.dso-extra-small.download::after, button.dso-primary.dso-extra-small.dso-spinner::before, label.dso-primary.dso-extra-small dso-icon, label.dso-primary.dso-extra-small.extern::after, label.dso-primary.dso-extra-small.download::after, label.dso-primary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-extra-small.dso-spinner-left::before, button.dso-primary.dso-extra-small.dso-spinner-left::before, label.dso-primary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small.dso-spinner-right::after, button.dso-primary.dso-extra-small.dso-spinner-right::after, label.dso-primary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { padding-block: 9px; } a.dso-primary dso-icon:has(+ span:not(.sr-only)), button.dso-primary dso-icon:has(+ span:not(.sr-only)), label.dso-primary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-primary span:not(.sr-only) + dso-icon, button.dso-primary span:not(.sr-only) + dso-icon, label.dso-primary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-primary dso-icon + span:not(.sr-only), button.dso-primary dso-icon + span:not(.sr-only), label.dso-primary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled], button.dso-primary.dso-spinner-left[disabled], button.dso-primary.dso-spinner-right[disabled], label.dso-primary.dso-spinner-left[disabled], label.dso-primary.dso-spinner-right[disabled] { background-color: #39870c; border-color: #39870c; color: #fff; } a.dso-primary.dso-spinner-left::before, button.dso-primary.dso-spinner-left::before, label.dso-primary.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-primary.dso-spinner-right::after, button.dso-primary.dso-spinner-right::after, label.dso-primary.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-primary.download::after, button.dso-primary.download::after, label.dso-primary.download::after { background-image: var(--_dso-di-download-wit); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-primary.extern::after, button.dso-primary.extern::after, label.dso-primary.extern::after { background-image: var(--_dso-di-external-link-wit); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-secondary, button.dso-secondary, label.dso-secondary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-secondary:focus, a.dso-secondary:focus-visible, button.dso-secondary:focus, button.dso-secondary:focus-visible, label.dso-secondary:focus, label.dso-secondary:focus-visible { outline-offset: 2px; } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { outline: 0; } a.dso-secondary.extern::after, a.dso-secondary.download::after, button.dso-secondary.extern::after, button.dso-secondary.download::after, label.dso-secondary.extern::after, label.dso-secondary.download::after { content: \"\"; display: inline-block; } a.dso-secondary, button.dso-secondary, label.dso-secondary { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dso-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-secondary:hover, a.dso-secondary:focus-visible, button.dso-secondary:hover, button.dso-secondary:focus-visible, label.dso-secondary:hover, label.dso-secondary:focus-visible { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dso-button-float-secondary, none); } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dso-button-float-secondary, none); } a.dso-secondary[disabled], a.dso-secondary[disabled]:hover, a.dso-secondary[disabled]:focus-visible, button.dso-secondary[disabled], button.dso-secondary[disabled]:hover, button.dso-secondary[disabled]:focus-visible, label.dso-secondary[disabled], label.dso-secondary[disabled]:hover, label.dso-secondary[disabled]:focus-visible { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dso-button-float-secondary, none); } a.dso-secondary.dso-small, button.dso-secondary.dso-small, label.dso-secondary.dso-small { line-height: 1rem; } a.dso-secondary.dso-small dso-icon, a.dso-secondary.dso-small.extern::after, a.dso-secondary.dso-small.download::after, a.dso-secondary.dso-small.dso-spinner::before, button.dso-secondary.dso-small dso-icon, button.dso-secondary.dso-small.extern::after, button.dso-secondary.dso-small.download::after, button.dso-secondary.dso-small.dso-spinner::before, label.dso-secondary.dso-small dso-icon, label.dso-secondary.dso-small.extern::after, label.dso-secondary.dso-small.download::after, label.dso-secondary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-small.dso-spinner-left::before, button.dso-secondary.dso-small.dso-spinner-left::before, label.dso-secondary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-small.dso-spinner-right::after, button.dso-secondary.dso-small.dso-spinner-right::after, label.dso-secondary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { line-height: 1rem; } a.dso-secondary.dso-extra-small dso-icon, a.dso-secondary.dso-extra-small.extern::after, a.dso-secondary.dso-extra-small.download::after, a.dso-secondary.dso-extra-small.dso-spinner::before, button.dso-secondary.dso-extra-small dso-icon, button.dso-secondary.dso-extra-small.extern::after, button.dso-secondary.dso-extra-small.download::after, button.dso-secondary.dso-extra-small.dso-spinner::before, label.dso-secondary.dso-extra-small dso-icon, label.dso-secondary.dso-extra-small.extern::after, label.dso-secondary.dso-extra-small.download::after, label.dso-secondary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-extra-small.dso-spinner-left::before, button.dso-secondary.dso-extra-small.dso-spinner-left::before, label.dso-secondary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small.dso-spinner-right::after, button.dso-secondary.dso-extra-small.dso-spinner-right::after, label.dso-secondary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { padding-block: 9px; } a.dso-secondary dso-icon:has(+ span:not(.sr-only)), button.dso-secondary dso-icon:has(+ span:not(.sr-only)), label.dso-secondary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-secondary span:not(.sr-only) + dso-icon, button.dso-secondary span:not(.sr-only) + dso-icon, label.dso-secondary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-secondary dso-icon + span:not(.sr-only), button.dso-secondary dso-icon + span:not(.sr-only), label.dso-secondary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled], button.dso-secondary.dso-spinner-left[disabled], button.dso-secondary.dso-spinner-right[disabled], label.dso-secondary.dso-spinner-left[disabled], label.dso-secondary.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-secondary.dso-spinner-left::before, button.dso-secondary.dso-spinner-left::before, label.dso-secondary.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]):hover::before, a.dso-secondary.dso-spinner-left:not([disabled]):focus-visible::before, button.dso-secondary.dso-spinner-left:not([disabled]):hover::before, button.dso-secondary.dso-spinner-left:not([disabled]):focus-visible::before, label.dso-secondary.dso-spinner-left:not([disabled]):hover::before, label.dso-secondary.dso-spinner-left:not([disabled]):focus-visible::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, a.dso-secondary.dso-spinner-left:not([disabled]).dso-small:focus-visible::before, button.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-secondary.dso-spinner-left:not([disabled]).dso-small:focus-visible::before, label.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-secondary.dso-spinner-left:not([disabled]).dso-small:focus-visible::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-spinner-right::after, button.dso-secondary.dso-spinner-right::after, label.dso-secondary.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]):hover::after, a.dso-secondary.dso-spinner-right:not([disabled]):focus-visible::after, button.dso-secondary.dso-spinner-right:not([disabled]):hover::after, button.dso-secondary.dso-spinner-right:not([disabled]):focus-visible::after, label.dso-secondary.dso-spinner-right:not([disabled]):hover::after, label.dso-secondary.dso-spinner-right:not([disabled]):focus-visible::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, a.dso-secondary.dso-spinner-right:not([disabled]).dso-small:focus-visible::after, button.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-secondary.dso-spinner-right:not([disabled]).dso-small:focus-visible::after, label.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-secondary.dso-spinner-right:not([disabled]).dso-small:focus-visible::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.download::after, button.dso-secondary.download::after, label.dso-secondary.download::after { background-image: var(--_dso-di-download-grasgroen); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-secondary.download:hover::after, a.dso-secondary.download:focus-visible::after, button.dso-secondary.download:hover::after, button.dso-secondary.download:focus-visible::after, label.dso-secondary.download:hover::after, label.dso-secondary.download:focus-visible::after { background-image: var(--_dso-di-download-bosgroen); } a.dso-secondary.download:active::after, button.dso-secondary.download:active::after, label.dso-secondary.download:active::after { background-image: var(--_dso-di-download-wit); } a.dso-secondary.download[disabled]::after, button.dso-secondary.download[disabled]::after, label.dso-secondary.download[disabled]::after { background-image: var(--_dso-di-download-grasgroen-40); } a.dso-secondary.extern::after, button.dso-secondary.extern::after, label.dso-secondary.extern::after { background-image: var(--_dso-di-external-link-grasgroen); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-secondary.extern:hover::after, a.dso-secondary.extern:focus-visible::after, button.dso-secondary.extern:hover::after, button.dso-secondary.extern:focus-visible::after, label.dso-secondary.extern:hover::after, label.dso-secondary.extern:focus-visible::after { background-image: var(--_dso-di-external-link-bosgroen); } a.dso-secondary.extern:active::after, button.dso-secondary.extern:active::after, label.dso-secondary.extern:active::after { background-image: var(--_dso-di-external-link-wit); } a.dso-secondary.extern[disabled]::after, button.dso-secondary.extern[disabled]::after, label.dso-secondary.extern[disabled]::after { background-image: var(--_dso-di-external-link-grasgroen-40); } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: \"\"; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: \"\"; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dso-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-tertiary:hover, a.dso-tertiary:focus-visible, button.dso-tertiary:hover, button.dso-tertiary:focus-visible, label.dso-tertiary:hover, label.dso-tertiary:focus-visible { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dso-button-float-tertiary, none); } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dso-button-float-tertiary, none); } a.dso-tertiary[disabled], a.dso-tertiary[disabled]:hover, a.dso-tertiary[disabled]:focus-visible, button.dso-tertiary[disabled], button.dso-tertiary[disabled]:hover, button.dso-tertiary[disabled]:focus-visible, label.dso-tertiary[disabled], label.dso-tertiary[disabled]:hover, label.dso-tertiary[disabled]:focus-visible { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dso-button-float-tertiary, none); } a.dso-tertiary.dso-small, button.dso-tertiary.dso-small, label.dso-tertiary.dso-small { line-height: 1rem; } a.dso-tertiary.dso-small dso-icon, a.dso-tertiary.dso-small.extern::after, a.dso-tertiary.dso-small.download::after, a.dso-tertiary.dso-small.dso-spinner::before, button.dso-tertiary.dso-small dso-icon, button.dso-tertiary.dso-small.extern::after, button.dso-tertiary.dso-small.download::after, button.dso-tertiary.dso-small.dso-spinner::before, label.dso-tertiary.dso-small dso-icon, label.dso-tertiary.dso-small.extern::after, label.dso-tertiary.dso-small.download::after, label.dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-small.dso-spinner-left::before, button.dso-tertiary.dso-small.dso-spinner-left::before, label.dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-small.dso-spinner-right::after, button.dso-tertiary.dso-small.dso-spinner-right::after, label.dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { line-height: 1rem; } a.dso-tertiary.dso-extra-small dso-icon, a.dso-tertiary.dso-extra-small.extern::after, a.dso-tertiary.dso-extra-small.download::after, a.dso-tertiary.dso-extra-small.dso-spinner::before, button.dso-tertiary.dso-extra-small dso-icon, button.dso-tertiary.dso-extra-small.extern::after, button.dso-tertiary.dso-extra-small.download::after, button.dso-tertiary.dso-extra-small.dso-spinner::before, label.dso-tertiary.dso-extra-small dso-icon, label.dso-tertiary.dso-extra-small.extern::after, label.dso-tertiary.dso-extra-small.download::after, label.dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-extra-small.dso-spinner-left::before, button.dso-tertiary.dso-extra-small.dso-spinner-left::before, label.dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small.dso-spinner-right::after, button.dso-tertiary.dso-extra-small.dso-spinner-right::after, label.dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { padding-block: 9px; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dso-button-padding-block-tertiary, 0); background-color: transparent; } a.dso-tertiary[disabled].dso-spinner-left, a.dso-tertiary[disabled].dso-spinner-right, button.dso-tertiary[disabled].dso-spinner-left, button.dso-tertiary[disabled].dso-spinner-right, label.dso-tertiary[disabled].dso-spinner-left, label.dso-tertiary[disabled].dso-spinner-right { color: #39870c; } a.dso-tertiary:not([disabled]):hover, a.dso-tertiary:not([disabled]):active, button.dso-tertiary:not([disabled]):hover, button.dso-tertiary:not([disabled]):active, label.dso-tertiary:not([disabled]):hover, label.dso-tertiary:not([disabled]):active { text-decoration: underline; text-underline-position: under; } a.dso-tertiary.dso-align, button.dso-tertiary.dso-align, label.dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } a.dso-tertiary.dso-truncate, button.dso-tertiary.dso-truncate, label.dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } a.dso-tertiary.dso-spinner-left::before, button.dso-tertiary.dso-spinner-left::before, label.dso-tertiary.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } a.dso-tertiary.dso-spinner-right::after, button.dso-tertiary.dso-spinner-right::after, label.dso-tertiary.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } a.dso-tertiary dso-icon + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon, button.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon, label.dso-tertiary dso-icon + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 4px; } a.dso-tertiary dso-icon, a.dso-tertiary span, button.dso-tertiary dso-icon, button.dso-tertiary span, label.dso-tertiary dso-icon, label.dso-tertiary span { vertical-align: middle; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { position: relative; inset-block-start: -2px; } a.dso-tertiary.download::after, button.dso-tertiary.download::after, label.dso-tertiary.download::after { background-image: var(--_dso-button-tertiary-download-icon, var(--_dso-di-download-grasgroen)); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-tertiary.download[disabled]::after, button.dso-tertiary.download[disabled]::after, label.dso-tertiary.download[disabled]::after { background-image: var(--_dso-di-download-grasgroen-40); } a.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):focus-visible::after, button.dso-tertiary.download:not([disabled]):hover::after, button.dso-tertiary.download:not([disabled]):focus-visible::after, label.dso-tertiary.download:not([disabled]):hover::after, label.dso-tertiary.download:not([disabled]):focus-visible::after { background-image: var(--_dso-button-tertiary-download-icon, var(--_dso-di-download-bosgroen)); } a.dso-tertiary.download:not([disabled]):active::after, button.dso-tertiary.download:not([disabled]):active::after, label.dso-tertiary.download:not([disabled]):active::after { background-image: var(--_dso-button-tertiary-download-icon, var(--_dso-di-download-bosgroen-140)); } a.dso-tertiary.extern::after, button.dso-tertiary.extern::after, label.dso-tertiary.extern::after { background-image: var(--_dso-button-tertiary-external-link-icon, var(--_dso-di-external-link-grasgroen)); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-tertiary.extern[disabled]::after, button.dso-tertiary.extern[disabled]::after, label.dso-tertiary.extern[disabled]::after { background-image: var(--_dso-di-external-link-grasgroen-40); } a.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):focus-visible::after, button.dso-tertiary.extern:not([disabled]):hover::after, button.dso-tertiary.extern:not([disabled]):focus-visible::after, label.dso-tertiary.extern:not([disabled]):hover::after, label.dso-tertiary.extern:not([disabled]):focus-visible::after { background-image: var(--_dso-button-tertiary-external-link-icon, var(--_dso-di-external-link-bosgroen)); } a.dso-tertiary.extern:not([disabled]):active::after, button.dso-tertiary.extern:not([disabled]):active::after, label.dso-tertiary.extern:not([disabled]):active::after { background-image: var(--_dso-button-tertiary-external-link-icon, var(--_dso-di-external-link-bosgroen-140)); } a.dso-map, button.dso-map, label.dso-map { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: 2px; } a.dso-map:active, button.dso-map:active, label.dso-map:active { outline: 0; } a.dso-map.extern::after, a.dso-map.download::after, button.dso-map.extern::after, button.dso-map.download::after, label.dso-map.extern::after, label.dso-map.download::after { content: \"\"; display: inline-block; } a.dso-map, button.dso-map, label.dso-map { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dso-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-map:hover, a.dso-map:focus-visible, button.dso-map:hover, button.dso-map:focus-visible, label.dso-map:hover, label.dso-map:focus-visible { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dso-button-float-secondary, none); } a.dso-map:active, button.dso-map:active, label.dso-map:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dso-button-float-secondary, none); } a.dso-map[disabled], a.dso-map[disabled]:hover, a.dso-map[disabled]:focus-visible, button.dso-map[disabled], button.dso-map[disabled]:hover, button.dso-map[disabled]:focus-visible, label.dso-map[disabled], label.dso-map[disabled]:hover, label.dso-map[disabled]:focus-visible { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dso-button-float-secondary, none); } a.dso-map.dso-small, button.dso-map.dso-small, label.dso-map.dso-small { line-height: 1rem; } a.dso-map.dso-small dso-icon, a.dso-map.dso-small.extern::after, a.dso-map.dso-small.download::after, a.dso-map.dso-small.dso-spinner::before, button.dso-map.dso-small dso-icon, button.dso-map.dso-small.extern::after, button.dso-map.dso-small.download::after, button.dso-map.dso-small.dso-spinner::before, label.dso-map.dso-small dso-icon, label.dso-map.dso-small.extern::after, label.dso-map.dso-small.download::after, label.dso-map.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-small.dso-spinner-left::before, button.dso-map.dso-small.dso-spinner-left::before, label.dso-map.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-small.dso-spinner-right::after, button.dso-map.dso-small.dso-spinner-right::after, label.dso-map.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { line-height: 1rem; } a.dso-map.dso-extra-small dso-icon, a.dso-map.dso-extra-small.extern::after, a.dso-map.dso-extra-small.download::after, a.dso-map.dso-extra-small.dso-spinner::before, button.dso-map.dso-extra-small dso-icon, button.dso-map.dso-extra-small.extern::after, button.dso-map.dso-extra-small.download::after, button.dso-map.dso-extra-small.dso-spinner::before, label.dso-map.dso-extra-small dso-icon, label.dso-map.dso-extra-small.extern::after, label.dso-map.dso-extra-small.download::after, label.dso-map.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-extra-small.dso-spinner-left::before, button.dso-map.dso-extra-small.dso-spinner-left::before, label.dso-map.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small.dso-spinner-right::after, button.dso-map.dso-extra-small.dso-spinner-right::after, label.dso-map.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { padding-block: 9px; } a.dso-map dso-icon:has(+ span:not(.sr-only)), button.dso-map dso-icon:has(+ span:not(.sr-only)), label.dso-map dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-map span:not(.sr-only) + dso-icon, button.dso-map span:not(.sr-only) + dso-icon, label.dso-map span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-map dso-icon + span:not(.sr-only), button.dso-map dso-icon + span:not(.sr-only), label.dso-map dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-map.dso-spinner-left[disabled], a.dso-map.dso-spinner-right[disabled], button.dso-map.dso-spinner-left[disabled], button.dso-map.dso-spinner-right[disabled], label.dso-map.dso-spinner-left[disabled], label.dso-map.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-map.dso-spinner-left::before, button.dso-map.dso-spinner-left::before, label.dso-map.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]):hover::before, a.dso-map.dso-spinner-left:not([disabled]):focus-visible::before, button.dso-map.dso-spinner-left:not([disabled]):hover::before, button.dso-map.dso-spinner-left:not([disabled]):focus-visible::before, label.dso-map.dso-spinner-left:not([disabled]):hover::before, label.dso-map.dso-spinner-left:not([disabled]):focus-visible::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, a.dso-map.dso-spinner-left:not([disabled]).dso-small:focus-visible::before, button.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-map.dso-spinner-left:not([disabled]).dso-small:focus-visible::before, label.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-map.dso-spinner-left:not([disabled]).dso-small:focus-visible::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-spinner-right::after, button.dso-map.dso-spinner-right::after, label.dso-map.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]):hover::after, a.dso-map.dso-spinner-right:not([disabled]):focus-visible::after, button.dso-map.dso-spinner-right:not([disabled]):hover::after, button.dso-map.dso-spinner-right:not([disabled]):focus-visible::after, label.dso-map.dso-spinner-right:not([disabled]):hover::after, label.dso-map.dso-spinner-right:not([disabled]):focus-visible::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, a.dso-map.dso-spinner-right:not([disabled]).dso-small:focus-visible::after, button.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-map.dso-spinner-right:not([disabled]).dso-small:focus-visible::after, label.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-map.dso-spinner-right:not([disabled]).dso-small:focus-visible::after { block-size: 16px; inline-size: 16px; } a.dso-map, button.dso-map, label.dso-map { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5); border: 0; font-weight: 600; margin-inline-end: 16px; padding-block: 8px; padding-inline: 16px; white-space: nowrap; } a.dso-map:has(span.sr-only):has(dso-icon), button.dso-map:has(span.sr-only):has(dso-icon), label.dso-map:has(span.sr-only):has(dso-icon) { padding: 8px; min-inline-size: auto; block-size: 40px; inline-size: 40px; } a.dso-map.download::after, button.dso-map.download::after, label.dso-map.download::after { background-image: var(--_dso-di-download-grasgroen); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-map.download:hover::after, a.dso-map.download:focus-visible::after, button.dso-map.download:hover::after, button.dso-map.download:focus-visible::after, label.dso-map.download:hover::after, label.dso-map.download:focus-visible::after { background-image: var(--_dso-di-download-bosgroen); } a.dso-map.download:active::after, button.dso-map.download:active::after, label.dso-map.download:active::after { background-image: var(--_dso-di-download-wit); } a.dso-map.download[disabled]::after, button.dso-map.download[disabled]::after, label.dso-map.download[disabled]::after { background-image: var(--_dso-di-download-grasgroen-40); } a.dso-map.extern::after, button.dso-map.extern::after, label.dso-map.extern::after { background-image: var(--_dso-di-external-link-grasgroen); background-repeat: no-repeat; background-position: center; background-size: cover; block-size: 24px; inline-size: 24px; vertical-align: top; } a.dso-map.extern:hover::after, a.dso-map.extern:focus-visible::after, button.dso-map.extern:hover::after, button.dso-map.extern:focus-visible::after, label.dso-map.extern:hover::after, label.dso-map.extern:focus-visible::after { background-image: var(--_dso-di-external-link-bosgroen); } a.dso-map.extern:active::after, button.dso-map.extern:active::after, label.dso-map.extern:active::after { background-image: var(--_dso-di-external-link-wit); } a.dso-map.extern[disabled]::after, button.dso-map.extern[disabled]::after, label.dso-map.extern[disabled]::after { background-image: var(--_dso-di-external-link-grasgroen-40); } a.dso-primary, a.dso-primary:hover, a.dso-primary:visited, a.dso-primary:focus-visible { color: #fff; text-decoration: none; } a.dso-secondary, a.dso-map { text-decoration: none; } a.dso-secondary, a.dso-secondary:visited:not(:hover):not(:active):not(:focus-visible), a.dso-map, a.dso-map:visited:not(:hover):not(:active):not(:focus-visible) { color: #39870c; } a.dso-secondary:hover, a.dso-secondary:focus-visible, a.dso-map:hover, a.dso-map:focus-visible { color: #275937; text-decoration: none; } a.dso-secondary:active, a.dso-map:active { color: #fff; } a.dso-tertiary { text-decoration: none; } a.dso-tertiary, a.dso-tertiary:visited:not(:hover):not(:focus-visible):not(:active) { color: var(--_dso-button-tertiary-color, #39870c); } .dso-primary + .dso-primary, .dso-primary + .dso-secondary, .dso-primary + .dso-tertiary, .dso-secondary + .dso-primary, .dso-secondary + .dso-secondary, .dso-secondary + .dso-tertiary, .dso-tertiary + .dso-primary, .dso-tertiary + .dso-secondary, .dso-tertiary + .dso-tertiary { margin-block-start: var(--_dso-button-after-button-margin-block-start, 0); margin-inline-start: var(--_dso-button-after-button-margin-inline-start, 16px); } :host { background-color: #fff; border: 1px solid #ccc; inset-block-end: 0; display: block; font-family: Asap, sans-serif; position: absolute; inset-block-start: 0; inset-inline-start: 100%; transition: transform 300ms ease; inline-size: 300px; } *, *::after, *::before { box-sizing: border-box; } :host([open]) { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3); transform: translateX(-100%); } :host([open]) .toggle-visibility-button, :host([open]) .toggle-visibility-icon-button { display: none; } :host([open]) .zoom-buttons { inset-block-start: 16px; } .toggle-visibility-icon-button { display: none; } .toggle-visibility-button { position: absolute; inset-inline-end: calc(100% + 56px); inset-block-start: 16px; } .zoom-buttons { position: absolute; inset-inline-end: calc(100% + 16px); inset-block-start: 16px; } .close-button { padding: 0; position: absolute; inset-inline-end: 16px; inset-block-start: 16px; } section:not([hidden]) { display: flex; flex-direction: column; block-size: 100%; } header, .content { padding: 16px; } header { border-block-end: 1px solid #ccc; flex-grow: 0; position: relative; } header h2 { color: #275937; font-family: \"Asap\", sans-serif; line-height: 1; margin: 0; } @media screen and (max-width: 767px) { button.toggle-visibility-button { display: none; } .toggle-visibility-icon-button { display: inline-block; position: absolute; inset-block-start: 16px; inset-inline-end: calc(100% + 16px); } .zoom-buttons { inset-block-start: 72px; } }"}},[257,"dso-map-controls",{open:[1540],disableZoom:[1,"disable-zoom"],hideContent:[32],toggleVisibility:[64]},[[0,"transitionend","handleTransitionEnd"]],{open:[{watchOpen:0}]}]);p=new WeakMap,f=new WeakMap,m=new WeakMap,y=new WeakMap,u=new WeakMap,g=new WeakMap,h=new WeakMap;const w=k,z=function(){"undefined"!=typeof customElements&&["dso-map-controls","dso-button-group","dso-icon","dso-icon-button","dso-scrollable"].forEach((o=>{switch(o){case"dso-map-controls":customElements.get(t(o))||customElements.define(t(o),k);break;case"dso-button-group":customElements.get(t(o))||d();break;case"dso-icon":customElements.get(t(o))||i();break;case"dso-icon-button":customElements.get(t(o))||l();break;case"dso-scrollable":customElements.get(t(o))||b()}}))};export{w as DsoMapControls,z as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as o,HTMLElement as t,createEvent as e,h as r,Host as c,transformTag as i}from"@stencil/core/internal/client";import{W as d}from"./wrap-wijzigactie.functional-component.js";import{d as n}from"./slide-toggle.js";const a=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoActiveChange=e(this,"dsoActiveChange",7),this.dsoMouseEnter=e(this,"dsoMouseEnter",7),this.dsoMouseLeave=e(this,"dsoMouseLeave",7),this.handleActiveChange=o=>{this.dsoActiveChange.emit({current:!!this.active,next:!this.active,originalEvent:o})}}render(){return r(c,{key:"f9616a247c24eb96244e639ff024ca5967bb5196",onMouseEnter:()=>this.dsoMouseEnter.emit(),onMouseLeave:()=>this.dsoMouseLeave.emit()},r(d,{key:"149f01c0a69f30d3c20ffaa072dc428f0ef37a19",wijzigactie:this.wijzigactie},r("div",{key:"712d0f01e3534a07d7455ca74ca0f646ca5a0c1d",class:"map-layer-object"},r("div",{key:"cfed9d0d4db2c775852614b4d40fdf9553df0c34"},r("slot",{key:"621b529bcea3858f17c041306f35757dddc7eb25",name:"symbol"})),r("div",{key:"3182baa23cabb03c6ed20228f77093a164c7febd",class:"map-layer-object-heading"},r("slot",{key:"9893441c38120f240cf3e740be3c23e4336023c5"}),r("slot",{key:"898c5345729d8541e162bff741736f75957917b0",name:"label"})),r("div",{key:"7c88070a2f03991c74d269a84bc33428a55fe570",class:"slide-toggle-container"},r("dso-slide-toggle",{key:"bd92a045d8365bb48e809e3a032a672fadc997d2",accessibleLabel:"Toon op kaart",checked:this.active,onDsoActiveChange:this.handleActiveChange})))))}static get style(){return"*,*::after,*::before{box-sizing:border-box}:host{display:block}:host ins,:host del{display:contents;text-decoration:none}:host(:not(:last-child)){margin-block-end:8px}:host([wijzigactie=voegtoe]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#
|
|
1
|
+
import{proxyCustomElement as o,HTMLElement as t,createEvent as e,h as r,Host as c,transformTag as i}from"@stencil/core/internal/client";import{W as d}from"./wrap-wijzigactie.functional-component.js";import{d as n}from"./slide-toggle.js";const a=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoActiveChange=e(this,"dsoActiveChange",7),this.dsoMouseEnter=e(this,"dsoMouseEnter",7),this.dsoMouseLeave=e(this,"dsoMouseLeave",7),this.handleActiveChange=o=>{this.dsoActiveChange.emit({current:!!this.active,next:!this.active,originalEvent:o})}}render(){return r(c,{key:"f9616a247c24eb96244e639ff024ca5967bb5196",onMouseEnter:()=>this.dsoMouseEnter.emit(),onMouseLeave:()=>this.dsoMouseLeave.emit()},r(d,{key:"149f01c0a69f30d3c20ffaa072dc428f0ef37a19",wijzigactie:this.wijzigactie},r("div",{key:"712d0f01e3534a07d7455ca74ca0f646ca5a0c1d",class:"map-layer-object"},r("div",{key:"cfed9d0d4db2c775852614b4d40fdf9553df0c34"},r("slot",{key:"621b529bcea3858f17c041306f35757dddc7eb25",name:"symbol"})),r("div",{key:"3182baa23cabb03c6ed20228f77093a164c7febd",class:"map-layer-object-heading"},r("slot",{key:"9893441c38120f240cf3e740be3c23e4336023c5"}),r("slot",{key:"898c5345729d8541e162bff741736f75957917b0",name:"label"})),r("div",{key:"7c88070a2f03991c74d269a84bc33428a55fe570",class:"slide-toggle-container"},r("dso-slide-toggle",{key:"bd92a045d8365bb48e809e3a032a672fadc997d2",accessibleLabel:"Toon op kaart",checked:this.active,onDsoActiveChange:this.handleActiveChange})))))}static get style(){return"*,*::after,*::before{box-sizing:border-box}:host{display:block}:host ins,:host del{display:contents;text-decoration:none}:host(:not(:last-child)){margin-block-end:8px}:host([wijzigactie=voegtoe]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:#000}:host([wijzigactie=verwijder]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919;--_dso-ozon-content-toggletip-color:#000}.map-layer-object{display:flex;align-items:flex-start;padding:2px;min-block-size:28px}.map-layer-object ::slotted([slot=symbol]){background-color:#fff;display:block;float:inline-start;block-size:24px;margin-block-start:0;margin-inline-end:8px;inline-size:27.6923076923px;overflow:hidden;position:relative}.map-layer-object-heading{display:flex;flex:1;flex-wrap:wrap;align-items:center;gap:4px;min-inline-size:0}.map-layer-object .slide-toggle-container{display:flex;align-items:center}"}},[257,"dso-map-layer-object",{active:[516],wijzigactie:[513]}]),l=a,s=function(){"undefined"!=typeof customElements&&["dso-map-layer-object","dso-slide-toggle"].forEach((o=>{switch(o){case"dso-map-layer-object":customElements.get(i(o))||customElements.define(i(o),a);break;case"dso-slide-toggle":customElements.get(i(o))||n()}}))};export{l as DsoMapLayerObject,s as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as o,HTMLElement as t,createEvent as r,h as e,transformTag as c}from"@stencil/core/internal/client";import{W as n}from"./wrap-wijzigactie.functional-component.js";import{d}from"./slide-toggle.js";const i=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoActiveChange=r(this,"dsoActiveChange",7),this.activatable=!1,this.handleActiveChange=o=>{this.dsoActiveChange.emit({current:!!this.active,next:!this.active,originalEvent:o})}}render(){return e(n,{key:"3b6f2734bc91552a2310ac9056710c8b7771fd6f",wijzigactie:this.wijzigactie},e("div",{key:"390e18062c030bec74ffd0cc9521074801aa4c05",class:"map-layer"},e("div",{key:"cc8604314daf0099ddac282b659f9cf4c0618354",class:"map-layer-heading"},e("slot",{key:"a6a03b1019615b995f2996b7f02e2b8a8690f3fd",name:"name"}),e("slot",{key:"168842628267169c65647513075175e63b9639a0",name:"label"})),this.activatable&&e("div",{key:"f6aed0a178405657b04c162f96369e8dbfda3391",class:"slide-toggle-container"},e("dso-slide-toggle",{key:"a6e682d3f77170648e158c3c92e980ab33e458bf",accessibleLabel:"Toon op kaart",checked:this.active,onDsoActiveChange:this.handleActiveChange}))),e("slot",{key:"2a4219aef3801015d6685877db51b74c18d04d68"}))}static get style(){return"*,*::after,*::before{box-sizing:border-box}:host{display:block;padding:6px}:host ins,:host del{display:contents;text-decoration:none}:host([wijzigactie=voegtoe]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#
|
|
1
|
+
import{proxyCustomElement as o,HTMLElement as t,createEvent as r,h as e,transformTag as c}from"@stencil/core/internal/client";import{W as n}from"./wrap-wijzigactie.functional-component.js";import{d}from"./slide-toggle.js";const i=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoActiveChange=r(this,"dsoActiveChange",7),this.activatable=!1,this.handleActiveChange=o=>{this.dsoActiveChange.emit({current:!!this.active,next:!this.active,originalEvent:o})}}render(){return e(n,{key:"3b6f2734bc91552a2310ac9056710c8b7771fd6f",wijzigactie:this.wijzigactie},e("div",{key:"390e18062c030bec74ffd0cc9521074801aa4c05",class:"map-layer"},e("div",{key:"cc8604314daf0099ddac282b659f9cf4c0618354",class:"map-layer-heading"},e("slot",{key:"a6a03b1019615b995f2996b7f02e2b8a8690f3fd",name:"name"}),e("slot",{key:"168842628267169c65647513075175e63b9639a0",name:"label"})),this.activatable&&e("div",{key:"f6aed0a178405657b04c162f96369e8dbfda3391",class:"slide-toggle-container"},e("dso-slide-toggle",{key:"a6e682d3f77170648e158c3c92e980ab33e458bf",accessibleLabel:"Toon op kaart",checked:this.active,onDsoActiveChange:this.handleActiveChange}))),e("slot",{key:"2a4219aef3801015d6685877db51b74c18d04d68"}))}static get style(){return"*,*::after,*::before{box-sizing:border-box}:host{display:block;padding:6px}:host ins,:host del{display:contents;text-decoration:none}:host([wijzigactie=voegtoe]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:#000}:host([wijzigactie=verwijder]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919;--_dso-ozon-content-toggletip-color:#000}.map-layer{display:flex;justify-content:space-between;min-block-size:32px}.map-layer-heading{display:flex;flex-wrap:wrap;align-items:center;margin-block-end:8px}.map-layer-heading ::slotted([slot=name]){font-weight:600;line-height:1.375em;margin-inline-end:4px}"}},[257,"dso-map-layer",{activatable:[516],active:[516],wijzigactie:[513]}]),a=i,l=function(){"undefined"!=typeof customElements&&["dso-map-layer","dso-slide-toggle"].forEach((o=>{switch(o){case"dso-map-layer":customElements.get(c(o))||customElements.define(c(o),i);break;case"dso-slide-toggle":customElements.get(c(o))||d()}}))};export{a as DsoMapLayer,l as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as o,HTMLElement as t,h as e,Host as r,transformTag as n}from"@stencil/core/internal/client";import{W as i}from"./wrap-wijzigactie.functional-component.js";import{d}from"./truncate.js";const a=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.hasSublabel=!1,this.hasMeta=!1,this.updateSublabel=()=>{this.hasSublabel=(this.sublabelSlot?.assignedNodes({flatten:!0}).length??0)>0},this.updateMeta=()=>{this.hasMeta=(this.metaSlot?.assignedNodes({flatten:!0}).length??0)>0},this.setSublabelSlot=o=>{this.sublabelSlot=o,this.updateSublabel()},this.setMetaSlot=o=>{this.metaSlot=o,this.updateMeta()}}render(){return e(r,{key:"9332992d22684568faa248a958c0dfa3c77ec7d7"},e(i,{key:"f707e754e7ab441c8df8ce503dcbfecdb74aec67",wijzigactie:this.wijzigactie,class:"dso-plekinfo-card-item-container"},e("div",{key:"42d702623a7b74564ec480720bf1e7307f1e9711"},e("slot",{key:"ebae9e4e89df193d4814428200fd5ba6b047a78c",name:"symbol"})),e("div",{key:"8deaf915631b10a6c7ed767ddcd93e816008b24a",class:{content:!0,"no-sublabel":!this.hasSublabel}},e("dso-truncate",{key:"aa4e45467d47d7d9cbf0b07cf8fd335906ef1282",class:"text"},e("slot",{key:"fdad88b5ddb5c32f8e811e51de7084e1357e9e3a",name:"label"}),this.hasSublabel&&" ",e("slot",{key:"e690e14aee6e1ddaa8016e495e9210e46253f90c",name:"sublabel",ref:this.setSublabelSlot,onSlotchange:this.updateSublabel})),e("div",{key:"5cc6f78d41ddc903f11ffe6126b758b0b5050044",class:"meta",hidden:!this.hasMeta},e("slot",{key:"5e1da9d1294f96a03c7c97c56afe813b64911759",name:"meta",ref:this.setMetaSlot,onSlotchange:this.updateMeta})))))}static get style(){return"ins{text-decoration:none;--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#
|
|
1
|
+
import{proxyCustomElement as o,HTMLElement as t,h as e,Host as r,transformTag as n}from"@stencil/core/internal/client";import{W as i}from"./wrap-wijzigactie.functional-component.js";import{d}from"./truncate.js";const a=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.hasSublabel=!1,this.hasMeta=!1,this.updateSublabel=()=>{this.hasSublabel=(this.sublabelSlot?.assignedNodes({flatten:!0}).length??0)>0},this.updateMeta=()=>{this.hasMeta=(this.metaSlot?.assignedNodes({flatten:!0}).length??0)>0},this.setSublabelSlot=o=>{this.sublabelSlot=o,this.updateSublabel()},this.setMetaSlot=o=>{this.metaSlot=o,this.updateMeta()}}render(){return e(r,{key:"9332992d22684568faa248a958c0dfa3c77ec7d7"},e(i,{key:"f707e754e7ab441c8df8ce503dcbfecdb74aec67",wijzigactie:this.wijzigactie,class:"dso-plekinfo-card-item-container"},e("div",{key:"42d702623a7b74564ec480720bf1e7307f1e9711"},e("slot",{key:"ebae9e4e89df193d4814428200fd5ba6b047a78c",name:"symbol"})),e("div",{key:"8deaf915631b10a6c7ed767ddcd93e816008b24a",class:{content:!0,"no-sublabel":!this.hasSublabel}},e("dso-truncate",{key:"aa4e45467d47d7d9cbf0b07cf8fd335906ef1282",class:"text"},e("slot",{key:"fdad88b5ddb5c32f8e811e51de7084e1357e9e3a",name:"label"}),this.hasSublabel&&" ",e("slot",{key:"e690e14aee6e1ddaa8016e495e9210e46253f90c",name:"sublabel",ref:this.setSublabelSlot,onSlotchange:this.updateSublabel})),e("div",{key:"5cc6f78d41ddc903f11ffe6126b758b0b5050044",class:"meta",hidden:!this.hasMeta},e("slot",{key:"5e1da9d1294f96a03c7c97c56afe813b64911759",name:"meta",ref:this.setMetaSlot,onSlotchange:this.updateMeta})))))}static get style(){return"ins{text-decoration:none;--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:#000}del{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919;--_dso-ozon-content-toggletip-color:#000;text-decoration:line-through;--_dso-ozon-content-toggletip-text-decoration:underline line-through}@media screen and (min--moz-device-pixel-ratio: 0){del{font-family:sans-serif}}*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-plekinfo-card-item-container{display:flex;align-items:flex-start;column-gap:8px;inline-size:100%;padding-block:8px;padding-inline:8px}.dso-plekinfo-card-item-container ::slotted([slot=symbol]){background-color:#fff !important;display:block !important;float:inline-start !important;block-size:24px !important;margin-block-start:0 !important;margin-inline-end:8px !important;inline-size:27.6923076923px !important;overflow:hidden !important;position:relative !important;display:flex !important;align-items:center !important;margin-inline-end:0 !important;background-color:transparent !important}.content{min-inline-size:0;display:flex;align-items:baseline;gap:4px;flex:1 1 auto}.text{min-inline-size:0;flex:1 1 auto}.no-sublabel .text{flex-grow:0}del .text{text-decoration:line-through;--_dso-ozon-content-toggletip-text-decoration:underline line-through}@media screen and (min--moz-device-pixel-ratio: 0){del .text{font-family:sans-serif}}slot[name=label]{font-weight:700}.meta{display:flex;flex-wrap:wrap;flex:0 0 auto;gap:4px}"}},[257,"dso-plekinfo-card-item",{wijzigactie:[513],hasSublabel:[32],hasMeta:[32]}]),c=a,l=function(){"undefined"!=typeof customElements&&["dso-plekinfo-card-item","dso-truncate"].forEach((o=>{switch(o){case"dso-plekinfo-card-item":customElements.get(n(o))||customElements.define(n(o),a);break;case"dso-truncate":customElements.get(n(o))||d()}}))};export{c as DsoPlekinfoCardItem,l as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as o,HTMLElement as e,createEvent as t,forceUpdate as n,h as i,Host as r,Fragment as a,transformTag as d}from"@stencil/core/internal/client";import{W as c}from"./wrap-wijzigactie.functional-component.js";import{i as s}from"./is-modified-event.js";import{d as l}from"./icon.js";const b=o(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoPlekinfoCardClick=t(this,"dsoPlekinfoCardClick",7),this.targetBlank=!1}connectedCallback(){this.mutationObserver=new MutationObserver((()=>n(this.host))),this.mutationObserver.observe(this.host,{attributes:!0,childList:!0})}disconnectedCallback(){this.mutationObserver?.disconnect(),delete this.mutationObserver}clickEventHandler(o){o.target instanceof e&&this.href&&this.dsoPlekinfoCardClick.emit({originalEvent:o,isModifiedEvent:s(o)})}get symbolSlottedElement(){return this.host.querySelector(":scope > [slot='symbol']")}get metaSlottedElement(){return this.host.querySelector(":scope > [slot='meta']")}get interaction(){return this.host.querySelector(":scope > [slot='interaction']")}get contentSlottedElement(){return this.host.querySelector(":scope > [slot='content']")}render(){const o=null!==this.symbolSlottedElement;return i(r,{key:"37e2d42e329e416aa2a002e27b88985c1bc8dfc1","has-symbol":o},i(c,{key:"5b672d02afbe549d7383e9e5c9321b1cf21699a1",wijzigactie:this.wijzigactie,class:"dso-plekinfo-card-container"},i("div",{key:"5d0aeffed9e14b5499501c2b81648ede01d406b2",class:"dso-plekinfo-card-symbol",hidden:!o},i("slot",{key:"d16f5cde2c4d73fa073f3f859e4a9b2db1dde3aa",name:"symbol"})),i("div",{key:"f0b610e3c9267f1fbdd64184da762e5c5298790b",class:"dso-plekinfo-card-heading"},i("div",{key:"9660a68461bb35dbf52ada693a65e802de34013b",class:"dso-plekinfo-card-title"},this.href?i("a",{href:this.href,target:this.targetBlank?"_blank":void 0,rel:this.targetBlank?"noopener noreferrer":void 0,class:"heading-anchor",onClick:o=>this.clickEventHandler(o)},i("span",{class:"heading-content"},i("slot",{name:"heading"})),"",this.targetBlank?i(a,null,i("dso-icon",{icon:"external-link"}),i("span",{class:"sr-only"},"(Opent andere website in nieuw tabblad)")):i("dso-icon",{icon:"chevron-right"})):i("span",{class:"heading-content"},i("slot",{name:"heading"})),null!==this.metaSlottedElement&&i("slot",{key:"a7bae25a1b9ffde591dcc77856e2973bc45f33d1",name:"meta"})),null!==this.interaction&&i("slot",{key:"0a29e234b26eb5084c6382c590c53dafa476a05e",name:"interaction"})),null!==this.contentSlottedElement&&i("div",{key:"7aa5d9f54d7afb58190e2415e4e6f9c50c03d720",class:"dso-plekinfo-card-content"},i("slot",{key:"61373b993d2631b311e2233cd3481dc9c2f77609",name:"content"}))))}get host(){return this}static get style(){return"ins{text-decoration:none;--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#
|
|
1
|
+
import{proxyCustomElement as o,HTMLElement as e,createEvent as t,forceUpdate as n,h as i,Host as r,Fragment as a,transformTag as d}from"@stencil/core/internal/client";import{W as c}from"./wrap-wijzigactie.functional-component.js";import{i as s}from"./is-modified-event.js";import{d as l}from"./icon.js";const b=o(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoPlekinfoCardClick=t(this,"dsoPlekinfoCardClick",7),this.targetBlank=!1}connectedCallback(){this.mutationObserver=new MutationObserver((()=>n(this.host))),this.mutationObserver.observe(this.host,{attributes:!0,childList:!0})}disconnectedCallback(){this.mutationObserver?.disconnect(),delete this.mutationObserver}clickEventHandler(o){o.target instanceof e&&this.href&&this.dsoPlekinfoCardClick.emit({originalEvent:o,isModifiedEvent:s(o)})}get symbolSlottedElement(){return this.host.querySelector(":scope > [slot='symbol']")}get metaSlottedElement(){return this.host.querySelector(":scope > [slot='meta']")}get interaction(){return this.host.querySelector(":scope > [slot='interaction']")}get contentSlottedElement(){return this.host.querySelector(":scope > [slot='content']")}render(){const o=null!==this.symbolSlottedElement;return i(r,{key:"37e2d42e329e416aa2a002e27b88985c1bc8dfc1","has-symbol":o},i(c,{key:"5b672d02afbe549d7383e9e5c9321b1cf21699a1",wijzigactie:this.wijzigactie,class:"dso-plekinfo-card-container"},i("div",{key:"5d0aeffed9e14b5499501c2b81648ede01d406b2",class:"dso-plekinfo-card-symbol",hidden:!o},i("slot",{key:"d16f5cde2c4d73fa073f3f859e4a9b2db1dde3aa",name:"symbol"})),i("div",{key:"f0b610e3c9267f1fbdd64184da762e5c5298790b",class:"dso-plekinfo-card-heading"},i("div",{key:"9660a68461bb35dbf52ada693a65e802de34013b",class:"dso-plekinfo-card-title"},this.href?i("a",{href:this.href,target:this.targetBlank?"_blank":void 0,rel:this.targetBlank?"noopener noreferrer":void 0,class:"heading-anchor",onClick:o=>this.clickEventHandler(o)},i("span",{class:"heading-content"},i("slot",{name:"heading"})),"",this.targetBlank?i(a,null,i("dso-icon",{icon:"external-link"}),i("span",{class:"sr-only"},"(Opent andere website in nieuw tabblad)")):i("dso-icon",{icon:"chevron-right"})):i("span",{class:"heading-content"},i("slot",{name:"heading"})),null!==this.metaSlottedElement&&i("slot",{key:"a7bae25a1b9ffde591dcc77856e2973bc45f33d1",name:"meta"})),null!==this.interaction&&i("slot",{key:"0a29e234b26eb5084c6382c590c53dafa476a05e",name:"interaction"})),null!==this.contentSlottedElement&&i("div",{key:"7aa5d9f54d7afb58190e2415e4e6f9c50c03d720",class:"dso-plekinfo-card-content"},i("slot",{key:"61373b993d2631b311e2233cd3481dc9c2f77609",name:"content"}))))}get host(){return this}static get style(){return"ins{text-decoration:none;--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:#000}del{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919;--_dso-ozon-content-toggletip-color:#000;text-decoration:line-through;--_dso-ozon-content-toggletip-text-decoration:underline line-through}@media screen and (min--moz-device-pixel-ratio: 0){del{font-family:sans-serif}}*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-plekinfo-card-container{display:block;inline-size:100%;padding-block:16px;padding-inline:16px}.dso-plekinfo-card-container .dso-plekinfo-card-heading{display:flex;align-items:start;column-gap:8px}.dso-plekinfo-card-container .dso-plekinfo-card-title{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:start;column-gap:8px;min-inline-size:0}.dso-plekinfo-card-container .dso-plekinfo-card-heading+.dso-plekinfo-card-content{margin-block-start:8px}.dso-plekinfo-card-container .dso-plekinfo-card-symbol{grid-row:span 2;margin-inline-end:16px}.dso-plekinfo-card-container .dso-plekinfo-card-symbol:not([hidden]){display:flex;align-items:center;block-size:1.5rem}.dso-plekinfo-card-container:has(.dso-plekinfo-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}ins.dso-plekinfo-card-container:has(.dso-plekinfo-card-heading a:is(:hover,:focus-visible)){background-color:#d8e5c9}del.dso-plekinfo-card-container:has(.dso-plekinfo-card-heading a:is(:hover,:focus-visible)){background-color:#e9cdd1}:host([active]:not([active=false])) .dso-plekinfo-card-container{background-color:#e5e5e5}:host([active]:not([active=false])) ins.dso-plekinfo-card-container{background-color:#ced9bf}:host([active]:not([active=false])) del.dso-plekinfo-card-container{background-color:#ddc3c6}:host([has-symbol]) .dso-plekinfo-card-container{display:grid;grid-template-columns:1fr minmax(0, 100%)}:host([has-symbol]) .dso-plekinfo-card-container .dso-plekinfo-card-heading,:host([has-symbol]) .dso-plekinfo-card-container .dso-plekinfo-card-content{grid-column:2/-1}::slotted([slot=meta]){display:flex !important;justify-content:space-between !important;flex-shrink:0 !important;align-self:end !important}::slotted([slot=heading]){display:inline !important;margin-block:0 !important;font-size:inherit !important;font-weight:700 !important;color:#275937 !important;line-height:inherit !important;overflow-wrap:anywhere !important}.heading-anchor,.dso-plekinfo-card-title>.heading-content{font-size:1.125em;line-height:1.5rem}::slotted([slot=content]){--_dso-rich-content-margin-block:8px;--_dso-rich-content-margin-block-end:0;--_dso-rich-content-margin-block-start:0}::slotted([slot=interaction]){display:flex !important;flex-shrink:0 !important;justify-content:space-between !important;margin-inline-start:auto !important}.heading-anchor{color:#275937;text-decoration:none;white-space:nowrap}.heading-anchor .heading-content{white-space:normal}.heading-anchor dso-icon{margin-inline-start:4px}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}"}},[257,"dso-plekinfo-card",{wijzigactie:[513],href:[513],targetBlank:[4,"target-blank"],active:[516]}]),h=b,f=function(){"undefined"!=typeof customElements&&["dso-plekinfo-card","dso-icon"].forEach((o=>{switch(o){case"dso-plekinfo-card":customElements.get(d(o))||customElements.define(d(o),b);break;case"dso-icon":customElements.get(d(o))||l()}}))};export{h as DsoPlekinfoCard,f as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as e,createEvent as o,forceUpdate as i,h as n,Host as r,Fragment as a,transformTag as s}from"@stencil/core/internal/client";import{d as l}from"./icon.js";import{d}from"./icon-button.js";const c=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.dsoEdit=o(this,"dsoEdit",3),this.dsoDelete=o(this,"dsoDelete",3),this.dsoClose=o(this,"dsoClose",3),this.mode="view",this.editable=!1,this.removable=!1}connectedCallback(){this.mutationObserver=new MutationObserver((()=>i(this.host))),this.mutationObserver.observe(this.host,{attributes:!0,characterData:!0,childList:!0,subtree:!0})}disconnectedCallback(){this.mutationObserver?.disconnect()}get name(){return this.host.querySelector(":scope > [slot='name']")?.textContent?.trim()??""}get hasSubItems(){return!!this.host.querySelector(":scope > dso-shopping-cart-item")}renderActions(){return n("div",{class:"item-actions"},this.editable&&n("dso-icon-button",{icon:"pencil",variant:"tertiary",label:"Wijzig "+this.name,onDsoClick:t=>this.dsoEdit.emit({originalEvent:t.detail.originalEvent})}),this.removable&&n("dso-icon-button",{icon:"trash",variant:"tertiary",label:"Verwijder "+this.name,onDsoClick:t=>this.dsoDelete.emit({originalEvent:t.detail.originalEvent})}))}render(){if("edit"===this.mode)return n(r,{role:"listitem"},n("div",{class:"item item-edit"},n("div",{class:"item-edit-header"},n("slot",{name:"name"}),n("button",{type:"button",class:"dso-tertiary",onClick:t=>this.dsoClose.emit({originalEvent:t})},"Sluiten",n("dso-icon",{icon:"cross"}))),n("div",{class:"item-edit-body"},n("slot",null))));const t=this.warning?.trim();return n(r,{role:"listitem"},n("div",{class:"item"},n("div",{class:"item-header"},n("div",{class:"item-name"},t&&n(a,null,n("dso-icon",{icon:"status-warning","aria-hidden":"true"}),n("span",{class:"sr-only"},t)),n("slot",{name:"name"})),(this.editable||this.removable)&&this.renderActions()),n("slot",{name:"info"})),this.hasSubItems?n("ul",{class:"sub-items",role:"list"},n("slot",null)):n("slot",null))}get host(){return this}static get style(){return":host { display: block; } *, *::after, *::before { box-sizing: border-box; } .sr-only { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; border: 0; overflow: hidden; clip-path: rect(0 0 0 0); } button { -webkit-appearance: button; color: inherit; cursor: pointer; font: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; line-height: inherit; margin: 0; overflow: visible; text-transform: none; } button[disabled] { cursor: default; } button::-moz-focus-inner { border: 0; padding: 0; } button.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } button.dso-tertiary:focus, button.dso-tertiary:focus-visible { outline-offset: 2px; } button.dso-tertiary:active { outline: 0; } button.dso-tertiary.extern::after, button.dso-tertiary.download::after { content: \"\"; display: inline-block; } button.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } button.dso-tertiary:focus, button.dso-tertiary:focus-visible { outline-offset: 2px; } button.dso-tertiary:active { outline: 0; } button.dso-tertiary.extern::after, button.dso-tertiary.download::after { content: \"\"; display: inline-block; } button.dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dso-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } button.dso-tertiary:hover { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dso-button-float-tertiary, none); } button.dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dso-button-float-tertiary, none); } button.dso-tertiary[disabled], button.dso-tertiary[disabled]:hover { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dso-button-float-tertiary, none); } button.dso-tertiary.dso-small { line-height: 1rem; } button.dso-tertiary.dso-small dso-icon, button.dso-tertiary.dso-small.extern::after, button.dso-tertiary.dso-small.download::after, button.dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } button.dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } button.dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } button.dso-tertiary.dso-extra-small { line-height: 1rem; } button.dso-tertiary.dso-extra-small dso-icon, button.dso-tertiary.dso-extra-small.extern::after, button.dso-tertiary.dso-extra-small.download::after, button.dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } button.dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } button.dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } button.dso-tertiary.dso-extra-small { padding-block: 9px; } button.dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dso-button-padding-block-tertiary, 0); background-color: transparent; } button.dso-tertiary[disabled].dso-spinner-left, button.dso-tertiary[disabled].dso-spinner-right { color: #39870c; } button.dso-tertiary:not([disabled]):hover { text-decoration: underline; text-underline-position: under; } button.dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } button.dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } button.dso-tertiary.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } button.dso-tertiary.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } button.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 4px; } button.dso-tertiary dso-icon, button.dso-tertiary span { vertical-align: middle; } button.dso-tertiary { display: flex; align-items: center; } .item { background-color: #fff; padding-block: 16px; padding-inline: 8px; } .sub-items { --_dso-shopping-cart-item-name-weight: normal; --_dso-shopping-cart-item-name-indent: 24px; display: flex; flex-direction: column; gap: 8px; margin-block: 8px 0; margin-inline: 0; padding-block: 0; padding-inline: 0; list-style: none; } .item-edit { display: flex; flex-direction: column; gap: 16px; padding-block: 24px; padding-inline: 24px; } .item-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; } .item-name { display: flex; align-items: flex-start; gap: 0.5rem; min-inline-size: 0; padding-inline-start: var(--_dso-shopping-cart-item-name-indent, 0); } .item-name dso-icon { flex: none; } .item-name ::slotted([slot=name]) { margin-block: 0 !important; margin-inline: 0 !important; font-weight: var(--_dso-shopping-cart-item-name-weight, 600) !important; display: -webkit-box !important; -webkit-line-clamp: var(--_dso-shopping-cart-line-clamp, none) !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } ::slotted([slot=info]) { margin-block: 0.5rem 0 !important; margin-inline: 0 !important; font-size: 0.875rem !important; } .item-actions { flex: none; display: flex; align-items: center; gap: 0.5rem; } .item-edit-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; } .item-edit-header ::slotted([slot=name]) { margin-block: 0 !important; margin-inline: 0 !important; color: #275937 !important; font-size: 1.125rem !important; font-weight: 600 !important; line-height: 1.25 !important; } @media (min-width: 480px) { .item-edit-header ::slotted([slot=name]) { font-size: 1.25rem !important; } }"}},[257,"dso-shopping-cart-item",{mode:[513],warning:[513],editable:[516],removable:[516]}]),b=c,m=function(){"undefined"!=typeof customElements&&["dso-shopping-cart-item","dso-icon","dso-icon-button"].forEach((t=>{switch(t){case"dso-shopping-cart-item":customElements.get(s(t))||customElements.define(s(t),c);break;case"dso-icon":customElements.get(s(t))||l();break;case"dso-icon-button":customElements.get(s(t))||d()}}))};export{b as DsoShoppingCartItem,m as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as e,createEvent as o,forceUpdate as i,h as n,Host as r,Fragment as a,transformTag as s}from"@stencil/core/internal/client";import{d as l}from"./icon.js";import{d}from"./icon-button.js";const c=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.dsoEdit=o(this,"dsoEdit",3),this.dsoDelete=o(this,"dsoDelete",3),this.dsoClose=o(this,"dsoClose",3),this.mode="view",this.editable=!1,this.removable=!1}connectedCallback(){this.mutationObserver=new MutationObserver((()=>i(this.host))),this.mutationObserver.observe(this.host,{attributes:!0,characterData:!0,childList:!0,subtree:!0})}disconnectedCallback(){this.mutationObserver?.disconnect()}get name(){return this.host.querySelector(":scope > [slot='name']")?.textContent?.trim()??""}get hasSubItems(){return!!this.host.querySelector(":scope > dso-shopping-cart-item")}renderActions(){return n("div",{class:"item-actions"},this.editable&&n("dso-icon-button",{icon:"pencil",variant:"tertiary",label:"Wijzig "+this.name,onDsoClick:t=>this.dsoEdit.emit({originalEvent:t.detail.originalEvent})}),this.removable&&n("dso-icon-button",{icon:"trash",variant:"tertiary",label:"Verwijder "+this.name,onDsoClick:t=>this.dsoDelete.emit({originalEvent:t.detail.originalEvent})}))}render(){if("edit"===this.mode)return n(r,{role:"listitem"},n("div",{class:"item item-edit"},n("div",{class:"item-edit-header"},n("slot",{name:"name"}),n("button",{type:"button",class:"dso-tertiary",onClick:t=>this.dsoClose.emit({originalEvent:t})},"Sluiten",n("dso-icon",{icon:"cross"}))),n("div",{class:"item-edit-body"},n("slot",null))));const t=this.warning?.trim();return n(r,{role:"listitem"},n("div",{class:"item"},n("div",{class:"item-header"},n("div",{class:"item-name"},t&&n(a,null,n("dso-icon",{icon:"status-warning","aria-hidden":"true"}),n("span",{class:"sr-only"},t)),n("slot",{name:"name"})),(this.editable||this.removable)&&this.renderActions()),n("slot",{name:"info"})),this.hasSubItems?n("ul",{class:"sub-items",role:"list"},n("slot",null)):n("slot",null))}get host(){return this}static get style(){return":host { display: block; } *, *::after, *::before { box-sizing: border-box; } .sr-only { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; border: 0; overflow: hidden; clip-path: rect(0 0 0 0); } button { -webkit-appearance: button; color: inherit; cursor: pointer; font: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; line-height: inherit; margin: 0; overflow: visible; text-transform: none; } button[disabled] { cursor: default; } button::-moz-focus-inner { border: 0; padding: 0; } button.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } button.dso-tertiary:focus, button.dso-tertiary:focus-visible { outline-offset: 2px; } button.dso-tertiary:active { outline: 0; } button.dso-tertiary.extern::after, button.dso-tertiary.download::after { content: \"\"; display: inline-block; } button.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dso-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } button.dso-tertiary:focus, button.dso-tertiary:focus-visible { outline-offset: 2px; } button.dso-tertiary:active { outline: 0; } button.dso-tertiary.extern::after, button.dso-tertiary.download::after { content: \"\"; display: inline-block; } button.dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dso-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dso-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } button.dso-tertiary:hover, button.dso-tertiary:focus-visible { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dso-button-float-tertiary, none); } button.dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dso-button-float-tertiary, none); } button.dso-tertiary[disabled], button.dso-tertiary[disabled]:hover, button.dso-tertiary[disabled]:focus-visible { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dso-button-float-tertiary, none); } button.dso-tertiary.dso-small { line-height: 1rem; } button.dso-tertiary.dso-small dso-icon, button.dso-tertiary.dso-small.extern::after, button.dso-tertiary.dso-small.download::after, button.dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } button.dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } button.dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } button.dso-tertiary.dso-extra-small { line-height: 1rem; } button.dso-tertiary.dso-extra-small dso-icon, button.dso-tertiary.dso-extra-small.extern::after, button.dso-tertiary.dso-extra-small.download::after, button.dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } button.dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } button.dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } button.dso-tertiary.dso-extra-small { padding-block: 9px; } button.dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dso-button-padding-block-tertiary, 0); background-color: transparent; } button.dso-tertiary[disabled].dso-spinner-left, button.dso-tertiary[disabled].dso-spinner-right { color: #39870c; } button.dso-tertiary:not([disabled]):hover, button.dso-tertiary:not([disabled]):active { text-decoration: underline; text-underline-position: under; } button.dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } button.dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } button.dso-tertiary.dso-spinner-left::before { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } button.dso-tertiary.dso-spinner-right::after { background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E\"); background-repeat: no-repeat; content: \"\"; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } button.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 4px; } button.dso-tertiary dso-icon, button.dso-tertiary span { vertical-align: middle; } button.dso-tertiary { display: flex; align-items: center; } .item { background-color: #fff; padding-block: 16px; padding-inline: 8px; } .sub-items { --_dso-shopping-cart-item-name-weight: normal; --_dso-shopping-cart-item-name-indent: 24px; display: flex; flex-direction: column; gap: 8px; margin-block: 8px 0; margin-inline: 0; padding-block: 0; padding-inline: 0; list-style: none; } .item-edit { display: flex; flex-direction: column; gap: 16px; padding-block: 24px; padding-inline: 24px; } .item-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; } .item-name { display: flex; align-items: flex-start; gap: 0.5rem; min-inline-size: 0; padding-inline-start: var(--_dso-shopping-cart-item-name-indent, 0); } .item-name dso-icon { flex: none; } .item-name ::slotted([slot=name]) { margin-block: 0 !important; margin-inline: 0 !important; font-weight: var(--_dso-shopping-cart-item-name-weight, 600) !important; display: -webkit-box !important; -webkit-line-clamp: var(--_dso-shopping-cart-line-clamp, none) !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } ::slotted([slot=info]) { margin-block: 0.5rem 0 !important; margin-inline: 0 !important; font-size: 0.875rem !important; } .item-actions { flex: none; display: flex; align-items: center; gap: 0.5rem; } .item-edit-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; } .item-edit-header ::slotted([slot=name]) { margin-block: 0 !important; margin-inline: 0 !important; color: #275937 !important; font-size: 1.125rem !important; font-weight: 600 !important; line-height: 1.25 !important; } @media (min-width: 480px) { .item-edit-header ::slotted([slot=name]) { font-size: 1.25rem !important; } }"}},[257,"dso-shopping-cart-item",{mode:[513],warning:[513],editable:[516],removable:[516]}]),b=c,m=function(){"undefined"!=typeof customElements&&["dso-shopping-cart-item","dso-icon","dso-icon-button"].forEach((t=>{switch(t){case"dso-shopping-cart-item":customElements.get(s(t))||customElements.define(s(t),c);break;case"dso-icon":customElements.get(s(t))||l();break;case"dso-icon-button":customElements.get(s(t))||d()}}))};export{b as DsoShoppingCartItem,m as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as o,HTMLElement as t,h as e,transformTag as n}from"@stencil/core/internal/client";const r=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.mode="side"}render(){return e("div",{key:"6487f02b89e9dd12a733410bde3c18effa77e006",class:"shopping-cart"},e("div",{key:"342c1aaf5f8cea9ec54618a0220d9f950519816d",class:"content"},e("div",{key:"0cb026359c10116ff9b72063110c64d5168be696",class:"header"},e("slot",{key:"fa1d098a90c2aeeb82f2bb9133faee8ada538391",name:"heading"}),e("slot",{key:"5ed5ad2f1ca6d40f64839519502c6c05ef90cadd",name:"button"})),e("ul",{key:"2e7cbc6f8fc5c42620a51c2fda11cd9c92120140",class:"items",role:"list"},e("slot",{key:"ccd0090868bc256333bf2c73f4d926e02c44cb3b"}))),e("slot",{key:"35c2329c7352af67412d40aa1ad8818f32d8466c",name:"warning"}))}static get style(){return":host{display:block}*,*::after,*::before{box-sizing:border-box}.shopping-cart{background-color:#e1ecf7}.content{padding-block:16px;padding-inline:16px}.header{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#
|
|
1
|
+
import{proxyCustomElement as o,HTMLElement as t,h as e,transformTag as n}from"@stencil/core/internal/client";const r=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.mode="side"}render(){return e("div",{key:"6487f02b89e9dd12a733410bde3c18effa77e006",class:"shopping-cart"},e("div",{key:"342c1aaf5f8cea9ec54618a0220d9f950519816d",class:"content"},e("div",{key:"0cb026359c10116ff9b72063110c64d5168be696",class:"header"},e("slot",{key:"fa1d098a90c2aeeb82f2bb9133faee8ada538391",name:"heading"}),e("slot",{key:"5ed5ad2f1ca6d40f64839519502c6c05ef90cadd",name:"button"})),e("ul",{key:"2e7cbc6f8fc5c42620a51c2fda11cd9c92120140",class:"items",role:"list"},e("slot",{key:"ccd0090868bc256333bf2c73f4d926e02c44cb3b"}))),e("slot",{key:"35c2329c7352af67412d40aa1ad8818f32d8466c",name:"warning"}))}static get style(){return":host{display:block}*,*::after,*::before{box-sizing:border-box}.shopping-cart{background-color:#e1ecf7}.content{padding-block:16px;padding-inline:16px}.header{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--_dso-link-color:currentColor;--_dso-link-hover-color:currentColor;--_dso-link-visited-color:currentColor;--_dso-link-download-icon:var(--_dso-di-download-zwart);--_dso-link-extern-icon:var(--_dso-di-external-link-zwart);--_dso-link-phone-icon:var(--_dso-di-call-zwart);--_dso-link-mail-icon:var(--_dso-di-mail-outline-zwart);--_dso-link-list-chevron-icon:var(--_dso-di-chevron-right-zwart);--_dso-icon-button-secondary-active-color:#fff;--_dso-icon-button-secondary-active-background-color:#1f472c;--_dso-icon-button-secondary-toggled-color:#fff;--_dso-icon-button-secondary-toggled-background-color:#275937;--_dso-icon-button-secondary-toggled-hover-background-color:#1b3e27;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-toggled-color:#275937;--_dso-icon-button-tertiary-toggled-hover-color:#1b3e27;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-download-icon:var(--_dso-di-download-zwart);--_dso-button-tertiary-external-link-icon:var(--_dso-di-external-link-zwart);--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e1ecf7;color:#191919;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-block-end:16px}::slotted([slot=heading]){margin-block:0 !important;margin-inline:0 !important;color:inherit !important;font-size:1.125rem !important;font-weight:600 !important;line-height:1.25 !important}@media (min-width: 480px){::slotted([slot=heading]){font-size:1.25rem !important}}.items{display:flex;flex-direction:column;gap:8px;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;list-style:none}::slotted([slot=warning]){margin-block:0 !important;margin-inline:0 !important;padding-block:16px !important;padding-inline:16px !important;background-color:#fff !important}:host([mode=side]) .items{--_dso-shopping-cart-line-clamp:2}::slotted([slot=button]){flex-shrink:0 !important}::slotted(.dso-tertiary[slot=button]){--_dso-button-padding-block-tertiary:11px !important}"}},[257,"dso-shopping-cart",{mode:[513]}]),i=r,c=function(){"undefined"!=typeof customElements&&["dso-shopping-cart"].forEach((o=>{"dso-shopping-cart"===o&&(customElements.get(n(o))||customElements.define(n(o),r))}))};export{i as DsoShoppingCart,c as defineCustomElement}
|