@dso-toolkit/core 84.0.0 → 84.1.0

package/dist/components/progress-indicator.js

@@ -27,7 +27,7 @@ const Progressindicator = /*@__PURE__*/ proxyCustomElement(class Progressindicat
         this.text = i18n(() => this.host, translations);
     }
     render() {
-        return (h(Host, { key: '2e428774d55f0e4cde46d20b97f67b371a43f30e' }, h("span", { key: 'edb218f5d97b7abfe0576dda047975cbef17f1ba', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, h("dso-icon", { key: '5fcb04209e9039db06efb3b3cb4017ae78c91d03', icon: "spinner" })), h("span", { key: 'b4870d9ec95a61b18310f76dd84e37bc24d152b7', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
+        return (h(Host, { key: 'cd6737c28d3a68a15a1ef6da4e0f5b50ac6ef7e2' }, h("span", { key: '2ef9ebc64dac7b768da7d38293016586b560cd8c', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, h("dso-icon", { key: '57bac10449cb3640c69bd266065e413b6162840f', icon: "spinner" })), h("span", { key: 'bf4e4016ad21bee5c3264a22288d46c005bb86d7', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
     }
     get host() { return this; }
     static get style() { return progressIndicatorCss(); }

package/dist/components/responsive-element.js

@@ -49,7 +49,7 @@ const ResponsiveElement = /*@__PURE__*/ proxyCustomElement(class ResponsiveEleme
         this.observer.unobserve(this.host);
     }
     render() {
-        return (h(Host, { key: '826f5b0f98bc6658ef8c7e847e6ad8087a586626', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, h("slot", { key: 'b667e74cdcb8b0314a8cb12c9770c7a9b553d515' })));
+        return (h(Host, { key: '5718aa211beb1acabca634055f92410c5df334e8', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, h("slot", { key: 'de6078715bde5780643275f38e0e3d74bd5efb99' })));
     }
     get host() { return this; }
     static get style() { return responsiveElementCss(); }

package/dist/components/scrollable.js

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h, transformTag } from '@
 import { c as clsx } from './clsx.js';
 import { d as debounce } from './index2.js';
 
-const scrollableCss = () => `:host{display:block;block-size:100%;overflow-y:hidden}*,*::after,*::before{box-sizing:border-box}.dso-shadow-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;position:relative}.dso-shadow-container .dso-scroll-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;overflow-y:auto}.dso-shadow-container .dso-scroll-container::before,.dso-shadow-container .dso-scroll-container::after{background-repeat:no-repeat;background-size:100% 24px;content:"";display:block;block-size:24px;inset-inline-start:0;opacity:0;overflow:visible;position:absolute;transition:opacity 150ms ease-in-out;inline-size:100%;pointer-events:none;z-index:1}.dso-shadow-container .dso-scroll-container::before{background-image:linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-start:0}.dso-shadow-container .dso-scroll-container::after{background-image:linear-gradient(to bottom, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-end:0}.dso-shadow-container .dso-scroll-container.dso-scroll-bottom::before{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-top::after{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-middle::before,.dso-shadow-container .dso-scroll-container.dso-scroll-middle::after{opacity:1}`;
+const scrollableCss = () => `:host{display:block;block-size:100%;overflow-y:hidden}*,*::after,*::before{box-sizing:border-box}.dso-shadow-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;position:relative}.dso-shadow-container .dso-scroll-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;overflow-y:auto;padding-inline:var(--_dso-scrollable-container-padding-inline, 0)}.dso-shadow-container .dso-scroll-container::before,.dso-shadow-container .dso-scroll-container::after{background-repeat:no-repeat;background-size:100% 24px;content:"";display:block;block-size:24px;inset-inline-start:0;opacity:0;overflow:visible;position:absolute;transition:opacity 150ms ease-in-out;inline-size:100%;pointer-events:none;z-index:1}.dso-shadow-container .dso-scroll-container::before{background-image:linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-start:0}.dso-shadow-container .dso-scroll-container::after{background-image:linear-gradient(to bottom, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-end:0}.dso-shadow-container .dso-scroll-container.dso-scroll-bottom::before{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-top::after{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-middle::before,.dso-shadow-container .dso-scroll-container.dso-scroll-middle::after{opacity:1}`;
 
 const resizeObserver = new ResizeObserver(debounce((entries) => entries.forEach((entry) => { var _a; return (_a = getScrollableComponentFromResizeObserverEntry(entry)) === null || _a === void 0 ? void 0 : _a._setScrollState(); }), 50));
 function getScrollableComponentFromResizeObserverEntry({ target, }) {
@@ -93,9 +93,9 @@ const Scrollable = /*@__PURE__*/ proxyCustomElement(class Scrollable extends HTM
         this.slottedElements.forEach((element) => resizeObserver.unobserve(element));
     }
     render() {
-        return (h("div", { key: '842ad8c1e4357cdc597d3d5c29bb150d679354fa', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, h("div", { key: '9a67f0aca69c30da42e313420dda9cebc8f142fc', ref: (el) => (this.scrollContainerDiv = el), class: clsx("dso-scroll-container", {
+        return (h("div", { key: '18abce4ff05e2d89d253583a3d2bdf12610ab4b9', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, h("div", { key: '07b52e8d9f21afa30caac15724abe742ea50b12b', ref: (el) => (this.scrollContainerDiv = el), class: clsx("dso-scroll-container", {
                 [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== "noScroll",
-            }), onScroll: () => this._setScrollState() }, h("slot", { key: '8e264a36ad1b1eba2f194e3e93c60af2b481003c' }))));
+            }), onScroll: () => this._setScrollState() }, h("slot", { key: '545716e80e680ac94a26f75e607441f53f452abf' }))));
     }
     get host() { return this; }
     static get style() { return scrollableCss(); }

package/dist/components/scrollable.js.map

@@ -1 +1 @@
-{"file":"scrollable.js","mappings":";;;;AAAA,MAAM,aAAa,GAAG,MAAM,CAAC,oxCAAoxC,CAAC;;ACMlzC,MAAM,cAAc,GAAG,IAAI,cAAc,CACvC,QAAQ,CACN,CAAC,OAA8B,KAC7B,OAAO,CAAC,OAAO,CAAC,CAAC,KAAK,eAAK,OAAA,CAAA,EAAA,GAAA,6CAA6C,CAAC,KAAK,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,eAAe,EAAE,CAAA,EAAA,CAAC,EACrG,EAAE,CACH,CACF;AAED,SAAS,6CAA6C,CAAC,EACrD,MAAM,GACc,EAAA;AACpB,IAAA,IAAI,MAAM,CAAC,UAAU,YAAY,UAAU,IAAI,wBAAwB,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE;AAC/F,QAAA,OAAO,MAAM,CAAC,UAAU,CAAC,IAAI;;IAG/B,IAAI,MAAM,CAAC,aAAa,IAAI,wBAAwB,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE;QAC1E,OAAO,MAAM,CAAC,aAAa;;AAG7B,IAAA,OAAO,SAAS;AAClB;AAEA,SAAS,wBAAwB,CAAC,OAAgB,EAAA;AAChD,IAAA,OAAO,OAAO,CAAC,OAAO,KAAK,gBAAgB;AAC7C;MAOa,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAA,WAAA,CAAA;AALvB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;QAOU,IAAA,CAAA,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,CAAC,OAAO,KACtD,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,MAAM,EAAE,KAAI;;AAC7B,YAAA,MAAM,OAAO,GAAG,CAAA,EAAA,GAAA,MAAM,CAAC,aAAa,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,OAAO,CAAC,gBAAgB,CAAC;AAC/D,YAAA,IAAI,OAAO,KAAK,IAAI,CAAC,IAAI,EAAE;gBACzB;;YAGF,IAAI,CAAC,eAAe,EAAE;SACvB,CAAC,CACH;AAgBD,QAAA,IAAc,CAAA,cAAA,GAAmB,UAAU;AA2F5C;AAzFC;;AAEG;AAEH,IAAA,MAAM,eAAe,GAAA;AACnB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;YAC1B;;AAGF,QAAA,MAAM,cAAc,GAAG,IAAI,CAAC,iBAAiB,EAAE;AAC/C,QAAA,IAAI,IAAI,CAAC,cAAc,KAAK,cAAc,EAAE;AAC1C,YAAA,IAAI,CAAC,cAAc,GAAG,cAAc;AAEpC,YAAA,IAAI,IAAI,CAAC,cAAc,KAAK,KAAK,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE;AACrE,gBAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,CAAC;;;;AAKhE,IAAA,IAAY,eAAe,GAAA;QACzB,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;;IAG/B,iBAAiB,GAAA;AACvB,QAAA,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;AAC5B,YAAA,OAAO,UAAU;;QAGnB,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,kBAAkB;AAEzE,QAAA,IAAI,YAAY,IAAI,YAAY,EAAE;AAChC,YAAA,OAAO,UAAU;;AAGnB,QAAA,IAAI,SAAS,KAAK,CAAC,EAAE;AACnB,YAAA,OAAO,KAAK;;QAGd,IAAI,YAAY,GAAG,SAAS,GAAG,YAAY,GAAG,CAAC,EAAE;AAC/C,YAAA,OAAO,QAAQ;;AAGjB,QAAA,IAAI,SAAS,GAAG,CAAC,EAAE;AACjB,YAAA,OAAO,QAAQ;;AAGjB,QAAA,OAAO,UAAU;;IAGnB,gBAAgB,GAAA;QACd,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE;AACvC,YAAA,aAAa,EAAE,IAAI;AACnB,YAAA,UAAU,EAAE,KAAK;AACjB,YAAA,SAAS,EAAE,KAAK;AAChB,YAAA,OAAO,EAAE,IAAI;AACd,SAAA,CAAC;AAEF,QAAA,IAAI,IAAI,CAAC,kBAAkB,YAAY,cAAc,EAAE;AACrD,YAAA,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,kBAAkB,CAAC;;AAGjD,QAAA,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,OAAO,KAAK,cAAc,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;;IAG5E,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,kBAAkB,YAAY,cAAc,EAAE;AACrD,YAAA,cAAc,CAAC,SAAS,CAAC,IAAI,CAAC,kBAAkB,CAAC;;AAGnD,QAAA,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE;AAElC,QAAA,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,OAAO,KAAK,cAAc,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;;IAG9E,MAAM,GAAA;QACJ,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,kBAAkB,GAAG,EAAE,CAAC,EAAE,KAAK,EAAC,sBAAsB,EAAA,EAC5E,CACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,kBAAkB,GAAG,EAAE,CAAC,EAC3C,KAAK,EAAE,IAAI,CAAC,sBAAsB,EAAE;gBAClC,CAAC,CAAA,WAAA,EAAc,IAAI,CAAC,cAAc,CAAA,CAAE,GAAG,IAAI,CAAC,cAAc,KAAK,UAAU;aAC1E,CAAC,EACF,QAAQ,EAAE,MAAM,IAAI,CAAC,eAAe,EAAE,EAAA,EAEtC,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACF;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement"],"sources":["src/components/scrollable/scrollable.scss?tag=dso-scrollable&encapsulation=shadow","src/components/scrollable/scrollable.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n:host {\r\n  display: block;\r\n  block-size: 100%;\r\n  overflow-y: hidden;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.dso-shadow-container {\r\n  block-size: 100%;\r\n  max-block-size: inherit;\r\n  min-block-size: inherit;\r\n  position: relative;\r\n\r\n  .dso-scroll-container {\r\n    block-size: 100%;\r\n    max-block-size: inherit;\r\n    min-block-size: inherit;\r\n    overflow-y: auto;\r\n\r\n    &::before,\r\n    &::after {\r\n      background-repeat: no-repeat;\r\n      background-size: 100% units.$u3;\r\n      content: \"\";\r\n      display: block;\r\n      block-size: units.$u3;\r\n      inset-inline-start: 0;\r\n      opacity: 0;\r\n      overflow: visible;\r\n      position: absolute;\r\n      transition: opacity 150ms ease-in-out;\r\n      inline-size: 100%;\r\n      pointer-events: none;\r\n      z-index: 1;\r\n    }\r\n\r\n    &::before {\r\n      background-image: linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));\r\n      inset-block-start: 0;\r\n    }\r\n\r\n    &::after {\r\n      background-image: linear-gradient(to bottom, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));\r\n      inset-block-end: 0;\r\n    }\r\n\r\n    &.dso-scroll-bottom {\r\n      &::before {\r\n        opacity: 1;\r\n      }\r\n    }\r\n\r\n    &.dso-scroll-top {\r\n      &::after {\r\n        opacity: 1;\r\n      }\r\n    }\r\n\r\n    &.dso-scroll-middle {\r\n      &::before,\r\n      &::after {\r\n        opacity: 1;\r\n      }\r\n    }\r\n  }\r\n}\r\n","import { Component, Element, Event, EventEmitter, Method, State, h } from \"@stencil/core\";\r\nimport { clsx } from \"clsx\";\r\nimport debounce from \"debounce\";\r\n\r\nimport { DsoScrollEndEvent, ScrollPosition } from \"./scrollable.interfaces\";\r\n\r\nconst resizeObserver = new ResizeObserver(\r\n  debounce(\r\n    (entries: ResizeObserverEntry[]) =>\r\n      entries.forEach((entry) => getScrollableComponentFromResizeObserverEntry(entry)?._setScrollState()),\r\n    50,\r\n  ),\r\n);\r\n\r\nfunction getScrollableComponentFromResizeObserverEntry({\r\n  target,\r\n}: ResizeObserverEntry): HTMLDsoScrollableElement | undefined {\r\n  if (target.parentNode instanceof ShadowRoot && isDsoScrollableComponent(target.parentNode.host)) {\r\n    return target.parentNode.host;\r\n  }\r\n\r\n  if (target.parentElement && isDsoScrollableComponent(target.parentElement)) {\r\n    return target.parentElement;\r\n  }\r\n\r\n  return undefined;\r\n}\r\n\r\nfunction isDsoScrollableComponent(element: Element): element is HTMLDsoScrollableElement {\r\n  return element.tagName === \"DSO-SCROLLABLE\";\r\n}\r\n\r\n@Component({\r\n  tag: \"dso-scrollable\",\r\n  styleUrl: \"scrollable.scss\",\r\n  shadow: true,\r\n})\r\nexport class Scrollable {\r\n  // One MutationObserver per instance because of https://github.com/whatwg/dom/issues/126\r\n  private mutationObserver = new MutationObserver((entries) =>\r\n    entries.forEach(({ target }) => {\r\n      const element = target.parentElement?.closest(\"dso-scrollable\");\r\n      if (element !== this.host) {\r\n        return;\r\n      }\r\n\r\n      this._setScrollState();\r\n    }),\r\n  );\r\n\r\n  private scrollContainerDiv?: HTMLDivElement;\r\n\r\n  private shadowContainerDiv?: HTMLDivElement;\r\n\r\n  @Element()\r\n  host!: HTMLDsoScrollableElement;\r\n\r\n  /**\r\n   * Event emitted when the scrollbar has reached top or bottom.\r\n   */\r\n  @Event()\r\n  dsoScrollEnd!: EventEmitter<DsoScrollEndEvent>;\r\n\r\n  @State()\r\n  scrollPosition: ScrollPosition = \"noScroll\";\r\n\r\n  /**\r\n   * @internal\r\n   */\r\n  @Method()\r\n  async _setScrollState() {\r\n    if (!this.host.isConnected) {\r\n      return;\r\n    }\r\n\r\n    const scrollPosition = this.getScrollPosition();\r\n    if (this.scrollPosition !== scrollPosition) {\r\n      this.scrollPosition = scrollPosition;\r\n\r\n      if (this.scrollPosition === \"top\" || this.scrollPosition === \"bottom\") {\r\n        this.dsoScrollEnd.emit({ scrollEnd: this.scrollPosition });\r\n      }\r\n    }\r\n  }\r\n\r\n  private get slottedElements() {\r\n    return Array.from(this.host.children);\r\n  }\r\n\r\n  private getScrollPosition(): ScrollPosition {\r\n    if (!this.scrollContainerDiv) {\r\n      return \"noScroll\";\r\n    }\r\n\r\n    const { scrollHeight, clientHeight, scrollTop } = this.scrollContainerDiv;\r\n\r\n    if (scrollHeight <= clientHeight) {\r\n      return \"noScroll\";\r\n    }\r\n\r\n    if (scrollTop === 0) {\r\n      return \"top\";\r\n    }\r\n\r\n    if (scrollHeight - scrollTop - clientHeight < 1) {\r\n      return \"bottom\";\r\n    }\r\n\r\n    if (scrollTop > 0) {\r\n      return \"middle\";\r\n    }\r\n\r\n    return \"noScroll\";\r\n  }\r\n\r\n  componentDidLoad(): void {\r\n    this.mutationObserver.observe(this.host, {\r\n      characterData: true,\r\n      attributes: false,\r\n      childList: false,\r\n      subtree: true,\r\n    });\r\n\r\n    if (this.shadowContainerDiv instanceof HTMLDivElement) {\r\n      resizeObserver.observe(this.shadowContainerDiv);\r\n    }\r\n\r\n    this.slottedElements.forEach((element) => resizeObserver.observe(element));\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    if (this.shadowContainerDiv instanceof HTMLDivElement) {\r\n      resizeObserver.unobserve(this.shadowContainerDiv);\r\n    }\r\n\r\n    this.mutationObserver.disconnect();\r\n\r\n    this.slottedElements.forEach((element) => resizeObserver.unobserve(element));\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div ref={(el) => (this.shadowContainerDiv = el)} class=\"dso-shadow-container\">\r\n        <div\r\n          ref={(el) => (this.scrollContainerDiv = el)}\r\n          class={clsx(\"dso-scroll-container\", {\r\n            [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== \"noScroll\",\r\n          })}\r\n          onScroll={() => this._setScrollState()}\r\n        >\r\n          <slot></slot>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"version":3}
+{"file":"scrollable.js","mappings":";;;;AAAA,MAAM,aAAa,GAAG,MAAM,CAAC,s1CAAs1C,CAAC;;ACMp3C,MAAM,cAAc,GAAG,IAAI,cAAc,CACvC,QAAQ,CACN,CAAC,OAA8B,KAC7B,OAAO,CAAC,OAAO,CAAC,CAAC,KAAK,eAAK,OAAA,CAAA,EAAA,GAAA,6CAA6C,CAAC,KAAK,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,eAAe,EAAE,CAAA,EAAA,CAAC,EACrG,EAAE,CACH,CACF;AAED,SAAS,6CAA6C,CAAC,EACrD,MAAM,GACc,EAAA;AACpB,IAAA,IAAI,MAAM,CAAC,UAAU,YAAY,UAAU,IAAI,wBAAwB,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE;AAC/F,QAAA,OAAO,MAAM,CAAC,UAAU,CAAC,IAAI;;IAG/B,IAAI,MAAM,CAAC,aAAa,IAAI,wBAAwB,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE;QAC1E,OAAO,MAAM,CAAC,aAAa;;AAG7B,IAAA,OAAO,SAAS;AAClB;AAEA,SAAS,wBAAwB,CAAC,OAAgB,EAAA;AAChD,IAAA,OAAO,OAAO,CAAC,OAAO,KAAK,gBAAgB;AAC7C;MAOa,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAA,WAAA,CAAA;AALvB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;QAOU,IAAA,CAAA,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,CAAC,OAAO,KACtD,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,MAAM,EAAE,KAAI;;AAC7B,YAAA,MAAM,OAAO,GAAG,CAAA,EAAA,GAAA,MAAM,CAAC,aAAa,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,OAAO,CAAC,gBAAgB,CAAC;AAC/D,YAAA,IAAI,OAAO,KAAK,IAAI,CAAC,IAAI,EAAE;gBACzB;;YAGF,IAAI,CAAC,eAAe,EAAE;SACvB,CAAC,CACH;AAgBD,QAAA,IAAc,CAAA,cAAA,GAAmB,UAAU;AA2F5C;AAzFC;;AAEG;AAEH,IAAA,MAAM,eAAe,GAAA;AACnB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;YAC1B;;AAGF,QAAA,MAAM,cAAc,GAAG,IAAI,CAAC,iBAAiB,EAAE;AAC/C,QAAA,IAAI,IAAI,CAAC,cAAc,KAAK,cAAc,EAAE;AAC1C,YAAA,IAAI,CAAC,cAAc,GAAG,cAAc;AAEpC,YAAA,IAAI,IAAI,CAAC,cAAc,KAAK,KAAK,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE;AACrE,gBAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,CAAC;;;;AAKhE,IAAA,IAAY,eAAe,GAAA;QACzB,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;;IAG/B,iBAAiB,GAAA;AACvB,QAAA,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;AAC5B,YAAA,OAAO,UAAU;;QAGnB,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,kBAAkB;AAEzE,QAAA,IAAI,YAAY,IAAI,YAAY,EAAE;AAChC,YAAA,OAAO,UAAU;;AAGnB,QAAA,IAAI,SAAS,KAAK,CAAC,EAAE;AACnB,YAAA,OAAO,KAAK;;QAGd,IAAI,YAAY,GAAG,SAAS,GAAG,YAAY,GAAG,CAAC,EAAE;AAC/C,YAAA,OAAO,QAAQ;;AAGjB,QAAA,IAAI,SAAS,GAAG,CAAC,EAAE;AACjB,YAAA,OAAO,QAAQ;;AAGjB,QAAA,OAAO,UAAU;;IAGnB,gBAAgB,GAAA;QACd,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE;AACvC,YAAA,aAAa,EAAE,IAAI;AACnB,YAAA,UAAU,EAAE,KAAK;AACjB,YAAA,SAAS,EAAE,KAAK;AAChB,YAAA,OAAO,EAAE,IAAI;AACd,SAAA,CAAC;AAEF,QAAA,IAAI,IAAI,CAAC,kBAAkB,YAAY,cAAc,EAAE;AACrD,YAAA,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,kBAAkB,CAAC;;AAGjD,QAAA,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,OAAO,KAAK,cAAc,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;;IAG5E,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,kBAAkB,YAAY,cAAc,EAAE;AACrD,YAAA,cAAc,CAAC,SAAS,CAAC,IAAI,CAAC,kBAAkB,CAAC;;AAGnD,QAAA,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE;AAElC,QAAA,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,OAAO,KAAK,cAAc,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;;IAG9E,MAAM,GAAA;QACJ,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,kBAAkB,GAAG,EAAE,CAAC,EAAE,KAAK,EAAC,sBAAsB,EAAA,EAC5E,CACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,kBAAkB,GAAG,EAAE,CAAC,EAC3C,KAAK,EAAE,IAAI,CAAC,sBAAsB,EAAE;gBAClC,CAAC,CAAA,WAAA,EAAc,IAAI,CAAC,cAAc,CAAA,CAAE,GAAG,IAAI,CAAC,cAAc,KAAK,UAAU;aAC1E,CAAC,EACF,QAAQ,EAAE,MAAM,IAAI,CAAC,eAAe,EAAE,EAAA,EAEtC,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACF;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement"],"sources":["src/components/scrollable/scrollable.scss?tag=dso-scrollable&encapsulation=shadow","src/components/scrollable/scrollable.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n:host {\r\n  display: block;\r\n  block-size: 100%;\r\n  overflow-y: hidden;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.dso-shadow-container {\r\n  block-size: 100%;\r\n  max-block-size: inherit;\r\n  min-block-size: inherit;\r\n  position: relative;\r\n\r\n  .dso-scroll-container {\r\n    block-size: 100%;\r\n    max-block-size: inherit;\r\n    min-block-size: inherit;\r\n    overflow-y: auto;\r\n    padding-inline: var(--_dso-scrollable-container-padding-inline, 0);\r\n\r\n    &::before,\r\n    &::after {\r\n      background-repeat: no-repeat;\r\n      background-size: 100% units.$u3;\r\n      content: \"\";\r\n      display: block;\r\n      block-size: units.$u3;\r\n      inset-inline-start: 0;\r\n      opacity: 0;\r\n      overflow: visible;\r\n      position: absolute;\r\n      transition: opacity 150ms ease-in-out;\r\n      inline-size: 100%;\r\n      pointer-events: none;\r\n      z-index: 1;\r\n    }\r\n\r\n    &::before {\r\n      background-image: linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));\r\n      inset-block-start: 0;\r\n    }\r\n\r\n    &::after {\r\n      background-image: linear-gradient(to bottom, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));\r\n      inset-block-end: 0;\r\n    }\r\n\r\n    &.dso-scroll-bottom {\r\n      &::before {\r\n        opacity: 1;\r\n      }\r\n    }\r\n\r\n    &.dso-scroll-top {\r\n      &::after {\r\n        opacity: 1;\r\n      }\r\n    }\r\n\r\n    &.dso-scroll-middle {\r\n      &::before,\r\n      &::after {\r\n        opacity: 1;\r\n      }\r\n    }\r\n  }\r\n}\r\n","import { Component, Element, Event, EventEmitter, Method, State, h } from \"@stencil/core\";\r\nimport { clsx } from \"clsx\";\r\nimport debounce from \"debounce\";\r\n\r\nimport { DsoScrollEndEvent, ScrollPosition } from \"./scrollable.interfaces\";\r\n\r\nconst resizeObserver = new ResizeObserver(\r\n  debounce(\r\n    (entries: ResizeObserverEntry[]) =>\r\n      entries.forEach((entry) => getScrollableComponentFromResizeObserverEntry(entry)?._setScrollState()),\r\n    50,\r\n  ),\r\n);\r\n\r\nfunction getScrollableComponentFromResizeObserverEntry({\r\n  target,\r\n}: ResizeObserverEntry): HTMLDsoScrollableElement | undefined {\r\n  if (target.parentNode instanceof ShadowRoot && isDsoScrollableComponent(target.parentNode.host)) {\r\n    return target.parentNode.host;\r\n  }\r\n\r\n  if (target.parentElement && isDsoScrollableComponent(target.parentElement)) {\r\n    return target.parentElement;\r\n  }\r\n\r\n  return undefined;\r\n}\r\n\r\nfunction isDsoScrollableComponent(element: Element): element is HTMLDsoScrollableElement {\r\n  return element.tagName === \"DSO-SCROLLABLE\";\r\n}\r\n\r\n@Component({\r\n  tag: \"dso-scrollable\",\r\n  styleUrl: \"scrollable.scss\",\r\n  shadow: true,\r\n})\r\nexport class Scrollable {\r\n  // One MutationObserver per instance because of https://github.com/whatwg/dom/issues/126\r\n  private mutationObserver = new MutationObserver((entries) =>\r\n    entries.forEach(({ target }) => {\r\n      const element = target.parentElement?.closest(\"dso-scrollable\");\r\n      if (element !== this.host) {\r\n        return;\r\n      }\r\n\r\n      this._setScrollState();\r\n    }),\r\n  );\r\n\r\n  private scrollContainerDiv?: HTMLDivElement;\r\n\r\n  private shadowContainerDiv?: HTMLDivElement;\r\n\r\n  @Element()\r\n  host!: HTMLDsoScrollableElement;\r\n\r\n  /**\r\n   * Event emitted when the scrollbar has reached top or bottom.\r\n   */\r\n  @Event()\r\n  dsoScrollEnd!: EventEmitter<DsoScrollEndEvent>;\r\n\r\n  @State()\r\n  scrollPosition: ScrollPosition = \"noScroll\";\r\n\r\n  /**\r\n   * @internal\r\n   */\r\n  @Method()\r\n  async _setScrollState() {\r\n    if (!this.host.isConnected) {\r\n      return;\r\n    }\r\n\r\n    const scrollPosition = this.getScrollPosition();\r\n    if (this.scrollPosition !== scrollPosition) {\r\n      this.scrollPosition = scrollPosition;\r\n\r\n      if (this.scrollPosition === \"top\" || this.scrollPosition === \"bottom\") {\r\n        this.dsoScrollEnd.emit({ scrollEnd: this.scrollPosition });\r\n      }\r\n    }\r\n  }\r\n\r\n  private get slottedElements() {\r\n    return Array.from(this.host.children);\r\n  }\r\n\r\n  private getScrollPosition(): ScrollPosition {\r\n    if (!this.scrollContainerDiv) {\r\n      return \"noScroll\";\r\n    }\r\n\r\n    const { scrollHeight, clientHeight, scrollTop } = this.scrollContainerDiv;\r\n\r\n    if (scrollHeight <= clientHeight) {\r\n      return \"noScroll\";\r\n    }\r\n\r\n    if (scrollTop === 0) {\r\n      return \"top\";\r\n    }\r\n\r\n    if (scrollHeight - scrollTop - clientHeight < 1) {\r\n      return \"bottom\";\r\n    }\r\n\r\n    if (scrollTop > 0) {\r\n      return \"middle\";\r\n    }\r\n\r\n    return \"noScroll\";\r\n  }\r\n\r\n  componentDidLoad(): void {\r\n    this.mutationObserver.observe(this.host, {\r\n      characterData: true,\r\n      attributes: false,\r\n      childList: false,\r\n      subtree: true,\r\n    });\r\n\r\n    if (this.shadowContainerDiv instanceof HTMLDivElement) {\r\n      resizeObserver.observe(this.shadowContainerDiv);\r\n    }\r\n\r\n    this.slottedElements.forEach((element) => resizeObserver.observe(element));\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    if (this.shadowContainerDiv instanceof HTMLDivElement) {\r\n      resizeObserver.unobserve(this.shadowContainerDiv);\r\n    }\r\n\r\n    this.mutationObserver.disconnect();\r\n\r\n    this.slottedElements.forEach((element) => resizeObserver.unobserve(element));\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div ref={(el) => (this.shadowContainerDiv = el)} class=\"dso-shadow-container\">\r\n        <div\r\n          ref={(el) => (this.scrollContainerDiv = el)}\r\n          class={clsx(\"dso-scroll-container\", {\r\n            [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== \"noScroll\",\r\n          })}\r\n          onScroll={() => this._setScrollState()}\r\n        >\r\n          <slot></slot>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"version":3}

package/dist/components/selectable.js

@@ -69,7 +69,7 @@ const Selectable = /*@__PURE__*/ proxyCustomElement(class Selectable extends HTM
     render() {
         var _a;
         const hasInfo = !!this.host.querySelector('[slot="info"]');
-        return (h(Fragment, { key: 'a55fb2054b681d52958d148268deae88e68c1537' }, h("div", { key: 'd909064a63e008267559be99ea0468da95832ef7', class: "dso-selectable-container" }, h("div", { key: '74df5bd51d27a725a54b94725006886235cc425e', class: "dso-selectable-input-wrapper" }, h("input", { key: 'd6c7cd539f4a6709418c8001d7daad6ed92825c2', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": hasInfo && this.infoFixed ? this.describedById : undefined, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, ref: (el) => (this.input = el) }), !this.labelledById ? (h("label", { htmlFor: this.getIdentifier() }, h("slot", null))) : (h("label", null, h("slot", null)))), hasInfo && !this.infoFixed && (h("dso-info-button", { key: 'f93aab0f09595248ad9d42b60b877af5c4623c6a', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: '363378682d4159a1475137278d47da607455eea1', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: '484259d2cf6716497b3a888d294a1352adf4b8e3' }, h("slot", { key: 'efb26e3615fcbb47d5bbd4f5e4da5d5be80a74bb', name: "info" })))), h("slot", { key: 'bee889f79b7f36a66735d39557df63a10b11a589', name: "options" })));
+        return (h(Fragment, { key: 'c0799053617f1d21fc7c71bf1dcdd2c0474e5a35' }, h("div", { key: '6bb6764d33f362972c2ed98fa6dfc6b04d03384a', class: "dso-selectable-container" }, h("div", { key: '4d5879b1e86e44112b6d54cd4bb71ceb867fd57a', class: "dso-selectable-input-wrapper" }, h("input", { key: '2f9bc05efb1c0e53d6ae3a635cad32f1c9df9ecd', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": hasInfo && this.infoFixed ? this.describedById : undefined, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, ref: (el) => (this.input = el) }), !this.labelledById ? (h("label", { htmlFor: this.getIdentifier() }, h("slot", null))) : (h("label", null, h("slot", null)))), hasInfo && !this.infoFixed && (h("dso-info-button", { key: '13b298f292c430e0c87f2d7881bd2850d590c6be', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: '6633b7e818a3ead5385442e1e6baf4afe5d7c703', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: '9d51a92a11c7d6da8bde627b41b5cae4a47b9b74' }, h("slot", { key: 'c69688647aed9084517ed2915f2d67162eb33c73', name: "info" })))), h("slot", { key: '51cbe5b6d5f9705e1e42a04e86898c4c56b16142', name: "options" })));
     }
     componentDidRender() {
         if (this.input && typeof this.checked === "boolean" && this.input.checked !== this.checked) {

package/dist/components/slide-toggle.js

@@ -33,7 +33,7 @@ const SlideToggle = /*@__PURE__*/ proxyCustomElement(class SlideToggle extends H
         this.hasVisibleLabel = this.host.querySelector("*") !== null;
     }
     render() {
-        return (h(Fragment, { key: '1529a7bb19c7d520afe3680c2f24ff2cead4f86d' }, h("button", Object.assign({ key: '4ee12c87128604cfc5ad871805bcac388ed4bb69', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e) }, (this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), (this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {})), h("svg", { key: 'f1ba967c118604c6ccecda9c0fc0f26c50640515', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, h("g", { key: 'aa2124e210b38429e4e0ac00a7da7f6c25f94f60', fill: "none", "fill-rule": "evenodd" }, h("rect", { key: '563e438bb5c49bbba49d30cbe476eebb28102375', width: "40", height: "20", fill: "currentColor", rx: "10" }), h("circle", { key: '68c9f233ce1c6ef2be07048927596635c9050f49', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (h("label", { key: '0fc8fb13283ea99826a75c585d374d71ba6aef1a', htmlFor: this.identifier }, h("slot", { key: '33a03979232fbcb4b54d8dcf43f7092b893e3739' })))));
+        return (h(Fragment, { key: '723b3e8553042c3515e572c8b0a5ca94c933a141' }, h("button", Object.assign({ key: 'cfcf12b35df8344f3d442455bed59ad9176dbbfc', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e) }, (this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), (this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {})), h("svg", { key: '9e0e9411c3b49758f6a54031c9f5e16d33c80e4e', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, h("g", { key: 'be8ed967ceaa6e94b2c5353cb4fe0c9793a1a1a6', fill: "none", "fill-rule": "evenodd" }, h("rect", { key: 'd6b53ba0db712a9418a17414ee256dc3847be87b', width: "40", height: "20", fill: "currentColor", rx: "10" }), h("circle", { key: '3468791757f3b9ae496e51ae21128c8e4e719b2d', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (h("label", { key: '1c2b74ebf9186ef36cf42e2873f1934bc63b39ca', htmlFor: this.identifier }, h("slot", { key: '63c08372dfbd6114df753cd72c728357fd49e618' })))));
     }
     get host() { return this; }
     static get style() { return slideToggleCss(); }

package/dist/components/table.js

@@ -1281,7 +1281,7 @@ const Table = /*@__PURE__*/ proxyCustomElement(class Table extends HTMLElement {
     render() {
         var _a, _b, _c;
         const caption = (_b = (_a = this.host.querySelector(":scope > table > caption")) === null || _a === void 0 ? void 0 : _a.textContent) === null || _b === void 0 ? void 0 : _b.trim();
-        return (h(Host, { key: '2f54930e404196b3a39f9523ebb7716a43de5de3', "is-responsive": (_c = this.isResponsive) === null || _c === void 0 ? void 0 : _c.toString() }, this.modalActive && this.placeholderHeight && (h("div", { key: '8ce211b734721f6b65f7bd72a573db2aec773411', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive ? (h("dialog", { class: "dso-modal", ref: (element) => (this.dialogElement = element), onClose: this.dialogCloseEventListener }, h("div", { class: "dso-dialog dso-table-dialog", "aria-labelledby": this.labelledbyId }, h("div", { class: "dso-header" }, h("h2", { id: this.labelledbyId, class: { "sr-only": !caption } }, caption || "Uitvergrote tabel dialoog"), h("button", { type: "button", class: "dso-close", onClick: () => this.closeModal() }, h("dso-icon", { icon: "times" }), h("span", { class: "sr-only" }, "Sluiten"))), h("div", { class: "dso-body dso-table-body" }, h("slot", null))))) : (h(Fragment, null, h("div", { class: "dso-table-utilities", hidden: !this.isResponsive && this.noModal }, this.isResponsive && (h("div", { class: "dso-responsive-message" }, h("span", null, "beweeg de tabel van links naar rechts"))), !this.noModal && (h("button", { type: "button", class: "dso-tertiary open-modal-button", onClick: () => this.openModal() }, h("span", { class: "sr-only" }, "tabel ", caption !== null && caption !== void 0 ? caption : "", " "), h("span", null, "vergroten"), h("dso-icon", { icon: "external-link" })))), h("div", { class: "dso-table-body" }, h("slot", null))))));
+        return (h(Host, { key: '274318251014797e66d4161b7724aab3bdfb888d', "is-responsive": (_c = this.isResponsive) === null || _c === void 0 ? void 0 : _c.toString() }, this.modalActive && this.placeholderHeight && (h("div", { key: '3c1f1ea056f3a440fee1e9ee191810046fa2e780', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive ? (h("dialog", { class: "dso-modal", ref: (element) => (this.dialogElement = element), onClose: this.dialogCloseEventListener }, h("div", { class: "dso-dialog dso-table-dialog", "aria-labelledby": this.labelledbyId }, h("div", { class: "dso-header" }, h("h2", { id: this.labelledbyId, class: { "sr-only": !caption } }, caption || "Uitvergrote tabel dialoog"), h("button", { type: "button", class: "dso-close", onClick: () => this.closeModal() }, h("dso-icon", { icon: "times" }), h("span", { class: "sr-only" }, "Sluiten"))), h("div", { class: "dso-body dso-table-body" }, h("slot", null))))) : (h(Fragment, null, h("div", { class: "dso-table-utilities", hidden: !this.isResponsive && this.noModal }, this.isResponsive && (h("div", { class: "dso-responsive-message" }, h("span", null, "beweeg de tabel van links naar rechts"))), !this.noModal && (h("button", { type: "button", class: "dso-tertiary open-modal-button", onClick: () => this.openModal() }, h("span", { class: "sr-only" }, "tabel ", caption !== null && caption !== void 0 ? caption : "", " "), h("span", null, "vergroten"), h("dso-icon", { icon: "external-link" })))), h("div", { class: "dso-table-body" }, h("slot", null))))));
     }
     openModal() {
         this.placeholderHeight = this.host.clientHeight;

package/dist/components/toggletip.js

@@ -56,7 +56,7 @@ const Toggletip = /*@__PURE__*/ proxyCustomElement(class Toggletip extends HTMLE
         };
     }
     render() {
-        return (h(Fragment, { key: 'bace3a8dad270913266b8908e7bb5a5775a1e187' }, h("dso-info-button", { key: '26ad79350c1c57e871bb949e84058d59d8b47989', "aria-describedby": "toggle", onClick: this.click, label: this.label, active: this.active, secondary: this.secondary, ref: (element) => (this.infoButton = element) }), h("dso-tooltip", { key: '7e78e5cd2e561900649c48c8a477655ffa7b41c8', stateless: true, descriptive: true, id: "toggle", strategy: "absolute", active: this.active, position: this.position, small: this.small }, h("slot", { key: '0bb1dcc780c07ef827e215b7643a617df905b695' }))));
+        return (h(Fragment, { key: '5d0c70968e78501d56ee3d10cd72bf5d8cb72a7a' }, h("dso-info-button", { key: 'a420816c0fa911415ffced3f8e5ef07876710009', "aria-describedby": "toggle", onClick: this.click, label: this.label, active: this.active, secondary: this.secondary, ref: (element) => (this.infoButton = element) }), h("dso-tooltip", { key: '943c676aaa520c950f25c37fd85fff50fd1fa692', stateless: true, descriptive: true, id: "toggle", strategy: "absolute", active: this.active, position: this.position, small: this.small }, h("slot", { key: 'a08af99744cf49d69fa3b153afe71730a7bcbb00' }))));
     }
     get host() { return this; }
     static get style() { return toggletipCss(); }

package/dist/components/tooltip.js

@@ -2025,7 +2025,7 @@ const Tooltip = /*@__PURE__*/ proxyCustomElement(class Tooltip extends HTMLEleme
         }
     }
     render() {
-        return (h(Host, { key: '1f1b59d59f25baa8da2f25bbadf43beeeef2ac2f', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, h("div", { key: 'd92cd43bfb19b7db9c2598d2c746793c9a31edd6', class: clsx("tooltip", { in: this.active }) }, !this.noArrow && h("div", { key: 'ee1b57978c56bf8f1d17e11936da0c6d2a3db448', "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { key: '66052d9377af817e7277f9059a48d697c7cfb7bb', "aria-hidden": !this.descriptive || undefined, class: clsx("tooltip-inner", { "dso-small": this.small }) }, h("slot", { key: 'b4ef0631e39f4d12f726c14709c360408d394882' })))));
+        return (h(Host, { key: '658a353a1fda2f9b9ae4df45cb29e926936fc223', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, h("div", { key: '4db68ba328d735039de5baac038133d881aaf9b8', class: clsx("tooltip", { in: this.active }) }, !this.noArrow && h("div", { key: 'a6a45f375b60fb7e069e9512f03fa8e4e80ec829', "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { key: '9a30fa50784c44a8ac066fb7da3b3c25b3489fbd', "aria-hidden": !this.descriptive || undefined, class: clsx("tooltip-inner", { "dso-small": this.small }) }, h("slot", { key: '0d9bc6e77521493e665e77d05c67eec69d758ca9' })))));
     }
     activatePopper() {
         var _a;

package/dist/dso-toolkit/dso-toolkit.esm.js

@@ -1,2 +1,2 @@
-import{p as e,b as o}from"./p-WDDbscLp.js";export{s as setNonce}from"./p-WDDbscLp.js";import{g as a}from"./p-DQuL1Twl.js";var t=()=>{const o=import.meta.url;const a={};if(o!==""){a.resourcesUrl=new URL(".",o).href}return e(a)};t().then((async e=>{await a();return o(JSON.parse('[["p-e40c1f28",[[257,"dso-icon",{"icon":[1]}]]],["p-ee1f217d",[[258,"dsot-document-component-demo",{"showCanvas":[516,"show-canvas"],"jsonFile":[1,"json-file"],"openDefault":[4,"open-default"],"mode":[513],"ozonContentUrlResolver":[16],"ozonContentBegripResolver":[16],"response":[32],"document":[32],"openOrClosed":[32],"openedAnnotation":[32],"filtered":[32],"notApplicable":[32],"activeAnnotationSelectables":[32]},null,{"jsonFile":["jsonFileWatcher"],"openDefault":["openDefaultWatcher"]}]]],["p-3cee63bb",[[257,"dso-accordion-section",{"handleTitle":[1,"handle-title"],"wijzigactie":[1],"heading":[1],"handleUrl":[1,"handle-url"],"status":[1],"attachmentCount":[2,"attachment-count"],"icon":[1],"statusDescription":[1,"status-description"],"open":[516],"hasNestedAccordion":[516,"has-nested-accordion"],"label":[1],"labelStatus":[1,"label-status"],"activatable":[516],"active":[516],"hover":[32],"focusHandle":[64]}]]],["p-f0aa48e2",[[257,"dso-annotation-activiteit",{"wijzigactie":[513],"active":[516],"gewijzigdeLocatie":[516,"gewijzigde-locatie"],"naam":[1],"regelKwalificatie":[1,"regel-kwalificatie"],"locatieNoemers":[16],"regelKwalificatieVoorzetsel":[1,"regel-kwalificatie-voorzetsel"]}]]],["p-056702b8",[[257,"dso-annotation-gebiedsaanwijzing",{"wijzigactie":[513],"active":[516],"gewijzigdeLocatie":[516,"gewijzigde-locatie"],"naam":[1]}]]],["p-d7a12d68",[[257,"dso-annotation-omgevingsnormwaarde",{"wijzigactie":[513],"active":[516],"gewijzigdeLocatie":[516,"gewijzigde-locatie"],"naam":[1],"toelichting":[1],"waardes":[16],"eenheid":[1]}]]],["p-1fcfb9f3",[[257,"dso-legend-item",{"disabled":[516],"disabledMessage":[1,"disabled-message"],"activatable":[516],"active":[516],"showOptions":[32]}]]],["p-91c97704",[[257,"dso-advanced-select",{"options":[16],"active":[16],"activeHint":[1,"active-hint"],"open":[32]},[[8,"keydown","keyDownListener"]]]]],["p-cb89b6d1",[[257,"dso-list-button",{"label":[1],"sublabel":[1],"count":[2],"min":[8],"max":[8],"checked":[516],"disabled":[516],"subcontentPrefix":[1,"subcontent-prefix"]}]]],["p-8ef02e0b",[[257,"dso-map-base-layers",{"group":[1],"baseLayers":[16]}]]],["p-21705ae8",[[257,"dso-map-overlays",{"group":[1],"overlays":[16]}]]],["p-91019a81",[[257,"dso-project-item",{"label":[1]}]]],["p-e3a55f9e",[[257,"dso-annotation-kaart",{"wijzigactie":[513],"naam":[1],"href":[513]}]]],["p-eb93c22f",[[262,"dso-autosuggest",{"suggestions":[16],"loading":[4],"loadingLabel":[1,"loading-label"],"loadingDelayed":[2,"loading-delayed"],"notFoundLabel":[1,"not-found-label"],"mark":[16],"showSuggestions":[32],"selectedSuggestion":[32],"selectedSuggestionGroup":[32],"notFound":[32],"showLoading":[32]},[[4,"click","onDocumentClick"]],{"suggestions":["suggestionsWatcher"]}]]],["p-ba9c436c",[[257,"dso-map-controls",{"open":[1540],"disableZoom":[1,"disable-zoom"],"hideContent":[32],"toggleVisibility":[64]},null,{"open":["watchOpen"]}]]],["p-790906ed",[[257,"dso-modal",{"fullscreen":[516],"modalTitle":[1,"modal-title"],"dialogRole":[1,"dialog-role"],"returnFocus":[4,"return-focus"],"closable":[4],"ariaId":[32]}]]],["p-febbd4e9",[[257,"dso-survey-rating"]]],["p-9641c9f4",[[257,"dso-header",{"mainMenu":[16],"compact":[1],"authStatus":[1,"auth-status"],"loginUrl":[1,"login-url"],"logoutUrl":[1,"logout-url"],"showHelp":[4,"show-help"],"helpUrl":[1,"help-url"],"userProfileName":[1,"user-profile-name"],"userProfileUrl":[1,"user-profile-url"],"userHomeUrl":[1,"user-home-url"],"userHomeActive":[4,"user-home-active"],"visibleMenuItemsCount":[32],"dropdownOptionsOffset":[32]},null,{"mainMenu":["mainMenuChanged"]}]]],["p-4157fc4b",[[257,"dso-mark-bar",{"value":[1],"label":[1],"current":[2],"totalCount":[2,"total-count"],"dsoFocus":[64]}]]],["p-97846c8a",[[257,"dso-onboarding-tip",{"placement":[1],"ready":[32],"popoverOpen":[32]}]]],["p-363449cc",[[257,"dso-pagination",{"totalPages":[2,"total-pages"],"currentPage":[2,"current-page"],"formatHref":[16],"availablePositions":[32]},[[0,"dsoSizeChange","sizeChangeHandler"]]]]],["p-34458b22",[[257,"dso-tree-view",{"collection":[16],"focusItem":[64]}]]],["p-349d1ace",[[257,"dso-action-list-item",{"step":[2],"itemTitle":[1,"item-title"],"flowLine":[4,"flow-line"],"warning":[4],"divider":[4]}]]],["p-b6a9fe80",[[257,"dso-card",{"href":[513],"mode":[513],"active":[516]}]]],["p-556554af",[[257,"dso-document-card",{"href":[513],"active":[516]}]]],["p-c1091cb8",[[257,"dso-history-item",{"type":[513],"href":[513]}]]],["p-0dc38fff",[[257,"dso-renvooi",{"value":[1],"mark":[16]}],[257,"dso-label",{"compact":[516],"removable":[516],"status":[513],"truncate":[516],"removeHover":[32],"removeFocus":[32],"textHover":[32],"textFocus":[32],"isTruncated":[32],"labelText":[32],"_truncateLabel":[64]},[[4,"keydown","keyDownListener"]],{"removable":["watchRemovable"],"truncate":["watchTruncate"]}],[262,"dso-slide-toggle",{"checked":[4],"disabled":[4],"accessibleLabel":[1,"accessible-label"],"labelledbyId":[1,"labelledby-id"],"identifier":[1],"hasVisibleLabel":[32]}]]],["p-0eb57b0b",[[257,"dso-map-layer",{"label":[513],"activatable":[516],"active":[516]}]]],["p-470a09f9",[[257,"dso-map-layer-object",{"active":[516]}]]],["p-6eb56e78",[[257,"dso-plekinfo-card",{"wijzigactie":[513],"href":[513],"targetBlank":[4,"target-blank"],"active":[516]}]]],["p-57b49adb",[[257,"dso-skiplink",{"to":[513],"label":[513]}]]],["p-d42de8a1",[[257,"dso-tijdreis-banner"]]],["p-1f87f7ad",[[257,"dso-accordion",{"variant":[6145],"reverseAlign":[6148,"reverse-align"],"_getState":[64]}]]],["p-49aa2bbc",[[257,"dso-action-list",{"listTitle":[1,"list-title"]}]]],["p-9b17b1e1",[[257,"dso-banner",{"status":[513],"compact":[4],"icon":[516]}]]],["p-feeb6953",[[257,"dso-card-container",{"mode":[513]}]]],["p-aafd4561",[[257,"dso-contact-information"]]],["p-b318a0f9",[[258,"dso-date-picker",{"name":[1],"identifier":[1],"disabled":[516],"required":[516],"invalid":[516],"describedBy":[1,"described-by"],"dsoAutofocus":[4,"dso-autofocus"],"value":[513],"min":[1],"max":[1]}]]],["p-aa4f4650",[[257,"dso-highlight-box",{"yellow":[516],"border":[516],"white":[516],"dropShadow":[516,"drop-shadow"],"step":[514]}]]],["p-9c4d091b",[[257,"dso-input-range",{"min":[2],"max":[2],"value":[2],"step":[2],"label":[1],"unit":[1],"description":[1]}]]],["p-beabb084",[[257,"dso-logo",{"name":[513],"logoUrl":[513,"logo-url"],"label":[513],"labelUrl":[513,"label-url"],"ribbon":[513]}]]],["p-4729e938",[[257,"dso-tab",{"active":[516],"disabled":[516],"href":[1],"_dsoFocus":[64]}]]],["p-4713b9a4",[[257,"dso-tabs"]]],["p-c0d18980",[[257,"dso-viewer-grid",{"filterPanelTitle":[513,"filter-panel-title"],"filterPanelOpen":[516,"filter-panel-open"],"overlayOpen":[516,"overlay-open"],"documentPanelOpen":[516,"document-panel-open"],"mainSize":[513,"main-size"],"activeTab":[1,"active-tab"],"documentPanelSize":[513,"document-panel-size"],"mainPanelExpanded":[4,"main-panel-expanded"],"mainPanelHidden":[4,"main-panel-hidden"],"tabView":[32],"_checkMainPanelVisibility":[64]},null,{"documentPanelOpen":["documentPanelOpenWatcher"],"filterPanelOpen":["filterPanelOpenWatcher"],"overlayOpen":["overlayOpenWatcher"]}]]],["p-e2902f00",[[257,"dso-toggletip",{"label":[1],"position":[1],"small":[4],"secondary":[4],"active":[32]}]]],["p-f36e20b1",[[257,"dso-button-group",{"direction":[513]}]]],["p-9a267127",[[257,"dso-dropdown-menu",{"open":[1540],"dropdownAlign":[1,"dropdown-align"],"dropdownOptionsOffset":[2,"dropdown-options-offset"],"checkable":[4]},[[8,"click","onClick"]]]]],["p-ed6fdb91",[[257,"dso-document-component",{"heading":[1],"kop":[6145],"inhoud":[6145],"open":[516],"filtered":[516],"notApplicable":[516,"not-applicable"],"genesteOntwerpInformatie":[516,"geneste-ontwerp-informatie"],"bevatOntwerpInformatie":[516,"bevat-ontwerp-informatie"],"annotated":[516],"gereserveerd":[6145],"vervallen":[6145],"openAnnotation":[516,"open-annotation"],"alternativeTitle":[513,"alternative-title"],"type":[513],"wijzigactie":[513],"annotationsWijzigactie":[513,"annotations-wijzigactie"],"mark":[16],"recursiveToggle":[8,"recursive-toggle"],"ozonContentUrlResolver":[16],"ozonContentBegripResolver":[16],"mode":[513],"href":[513]}],[257,"dso-annotation-locatie",{"wijzigactie":[513],"active":[516],"gewijzigdeLocatie":[516,"gewijzigde-locatie"],"locatieNoemer":[1,"locatie-noemer"]}]]],["p-b74d6b6a",[[257,"dso-attachments-counter",{"count":[2]}],[257,"dso-expandable",{"open":[516],"enableAnimation":[516,"enable-animation"],"minimumHeight":[2,"minimum-height"],"isClosed":[32]},[[0,"transitionstart","transitionstartHandler"],[0,"transitionend","transitionendHandler"]],{"open":["toggleOpen"]}]]],["p-7c760235",[[257,"dso-progress-indicator",{"label":[1],"size":[513],"block":[516]}]]],["p-f48e56d5",[[257,"dso-responsive-element",{"sizeAlias":[32],"sizeWidth":[32],"getSize":[64]}]]],["p-2d6c125f",[[257,"dso-scrollable",{"scrollPosition":[32],"_setScrollState":[64]}]]],["p-56c7c642",[[257,"dso-icon-button",{"icon":[513],"label":[513],"variant":[513],"tooltipPlacement":[513,"tooltip-placement"],"disabled":[516],"showTooltip":[32],"setFocus":[64]}]]],["p-1a5e129d",[[257,"dso-info-button",{"active":[1540],"secondary":[4],"label":[1],"hover":[32],"setFocus":[64]}]]],["p-02e56b4d",[[262,"dso-selectable",{"type":[1],"identifier":[1],"name":[1],"value":[1],"invalid":[4],"describedById":[1,"described-by-id"],"labelledById":[1,"labelled-by-id"],"disabled":[4],"required":[4],"checked":[516],"indeterminate":[4],"infoFixed":[4,"info-fixed"],"infoActive":[32],"toggleInfo":[64]},null,{"indeterminate":["setIndeterminate"]}],[257,"dso-info",{"fixed":[516],"active":[516]}]]],["p-ab36d75f",[[257,"dso-tooltip",{"descriptive":[516],"position":[1],"strategy":[1],"noArrow":[4,"no-arrow"],"stateless":[4],"small":[4],"active":[1540],"hidden":[32],"activate":[64],"deactivate":[64]},null,{"position":["watchPosition"],"strategy":["watchStrategy"],"active":["watchActive"]}]]],["p-3b9fea45",[[257,"dso-ozon-content",{"content":[1],"inline":[516],"mark":[16],"urlResolver":[16],"begripResolver":[16],"state":[32]},null,{"content":["contentWatcher"]}],[257,"dso-alert",{"status":[513],"roleAlert":[4,"role-alert"],"compact":[516],"closable":[4]}],[257,"dso-image-overlay",{"wijzigactie":[1],"active":[32],"zoomable":[32]},[[2,"load","loadListener"]]],[257,"dso-panel",{"closeButtonLabel":[1,"close-button-label"],"emphasized":[4]}],[257,"dso-ozon-content-toggletip",{"icon":[513],"active":[32],"showToggletip":[32]}],[257,"dso-table",{"noModal":[516,"no-modal"],"isResponsive":[32],"modalActive":[32],"placeholderHeight":[32]}],[257,"dso-badge",{"status":[1]}]]]]'),e)}));
+import{p as e,b as o}from"./p-WDDbscLp.js";export{s as setNonce}from"./p-WDDbscLp.js";import{g as a}from"./p-DQuL1Twl.js";var t=()=>{const o=import.meta.url;const a={};if(o!==""){a.resourcesUrl=new URL(".",o).href}return e(a)};t().then((async e=>{await a();return o(JSON.parse('[["p-ee1f217d",[[258,"dsot-document-component-demo",{"showCanvas":[516,"show-canvas"],"jsonFile":[1,"json-file"],"openDefault":[4,"open-default"],"mode":[513],"ozonContentUrlResolver":[16],"ozonContentBegripResolver":[16],"response":[32],"document":[32],"openOrClosed":[32],"openedAnnotation":[32],"filtered":[32],"notApplicable":[32],"activeAnnotationSelectables":[32]},null,{"jsonFile":["jsonFileWatcher"],"openDefault":["openDefaultWatcher"]}]]],["p-3cee63bb",[[257,"dso-accordion-section",{"handleTitle":[1,"handle-title"],"wijzigactie":[1],"heading":[1],"handleUrl":[1,"handle-url"],"status":[1],"attachmentCount":[2,"attachment-count"],"icon":[1],"statusDescription":[1,"status-description"],"open":[516],"hasNestedAccordion":[516,"has-nested-accordion"],"label":[1],"labelStatus":[1,"label-status"],"activatable":[516],"active":[516],"hover":[32],"focusHandle":[64]}]]],["p-f0aa48e2",[[257,"dso-annotation-activiteit",{"wijzigactie":[513],"active":[516],"gewijzigdeLocatie":[516,"gewijzigde-locatie"],"naam":[1],"regelKwalificatie":[1,"regel-kwalificatie"],"locatieNoemers":[16],"regelKwalificatieVoorzetsel":[1,"regel-kwalificatie-voorzetsel"]}]]],["p-056702b8",[[257,"dso-annotation-gebiedsaanwijzing",{"wijzigactie":[513],"active":[516],"gewijzigdeLocatie":[516,"gewijzigde-locatie"],"naam":[1]}]]],["p-d7a12d68",[[257,"dso-annotation-omgevingsnormwaarde",{"wijzigactie":[513],"active":[516],"gewijzigdeLocatie":[516,"gewijzigde-locatie"],"naam":[1],"toelichting":[1],"waardes":[16],"eenheid":[1]}]]],["p-4c8f74b9",[[257,"dso-legend-item",{"disabled":[516],"disabledMessage":[1,"disabled-message"],"activatable":[516],"active":[516],"showOptions":[32]}]]],["p-91c97704",[[257,"dso-advanced-select",{"options":[16],"active":[16],"activeHint":[1,"active-hint"],"open":[32]},[[8,"keydown","keyDownListener"]]]]],["p-47295f4b",[[257,"dso-list-button",{"label":[1],"sublabel":[1],"count":[2],"min":[8],"max":[8],"checked":[516],"disabled":[516],"subcontentPrefix":[1,"subcontent-prefix"]}]]],["p-d86767c6",[[257,"dso-map-base-layers",{"group":[1],"baseLayers":[16]}]]],["p-d934baef",[[257,"dso-map-overlays",{"group":[1],"overlays":[16]}]]],["p-f56d918c",[[257,"dso-project-item",{"label":[1]}]]],["p-e3a55f9e",[[257,"dso-annotation-kaart",{"wijzigactie":[513],"naam":[1],"href":[513]}]]],["p-eb93c22f",[[262,"dso-autosuggest",{"suggestions":[16],"loading":[4],"loadingLabel":[1,"loading-label"],"loadingDelayed":[2,"loading-delayed"],"notFoundLabel":[1,"not-found-label"],"mark":[16],"showSuggestions":[32],"selectedSuggestion":[32],"selectedSuggestionGroup":[32],"notFound":[32],"showLoading":[32]},[[4,"click","onDocumentClick"]],{"suggestions":["suggestionsWatcher"]}]]],["p-c2a94e5b",[[257,"dso-legend",{"tabItems":[16]}]]],["p-30dd509e",[[257,"dso-map-controls",{"open":[1540],"disableZoom":[1,"disable-zoom"],"hideContent":[32],"toggleVisibility":[64]},null,{"open":["watchOpen"]}]]],["p-f8b708de",[[257,"dso-modal",{"fullscreen":[516],"modalTitle":[1,"modal-title"],"dialogRole":[1,"dialog-role"],"returnFocus":[4,"return-focus"],"closable":[4],"ariaId":[32]}]]],["p-9da36147",[[257,"dso-survey-rating"]]],["p-9641c9f4",[[257,"dso-header",{"mainMenu":[16],"compact":[1],"authStatus":[1,"auth-status"],"loginUrl":[1,"login-url"],"logoutUrl":[1,"logout-url"],"showHelp":[4,"show-help"],"helpUrl":[1,"help-url"],"userProfileName":[1,"user-profile-name"],"userProfileUrl":[1,"user-profile-url"],"userHomeUrl":[1,"user-home-url"],"userHomeActive":[4,"user-home-active"],"visibleMenuItemsCount":[32],"dropdownOptionsOffset":[32]},null,{"mainMenu":["mainMenuChanged"]}]]],["p-00e02bdd",[[257,"dso-mark-bar",{"value":[1],"label":[1],"current":[2],"totalCount":[2,"total-count"],"dsoFocus":[64]}]]],["p-5b894c59",[[257,"dso-onboarding-tip",{"placement":[1],"ready":[32],"popoverOpen":[32]}]]],["p-363449cc",[[257,"dso-pagination",{"totalPages":[2,"total-pages"],"currentPage":[2,"current-page"],"formatHref":[16],"availablePositions":[32]},[[0,"dsoSizeChange","sizeChangeHandler"]]]]],["p-faf9bd05",[[257,"dso-tree-view",{"collection":[16],"focusItem":[64]}]]],["p-349d1ace",[[257,"dso-action-list-item",{"step":[2],"itemTitle":[1,"item-title"],"flowLine":[4,"flow-line"],"warning":[4],"divider":[4]}]]],["p-b6a9fe80",[[257,"dso-card",{"href":[513],"mode":[513],"active":[516]}]]],["p-556554af",[[257,"dso-document-card",{"href":[513],"active":[516]}]]],["p-c1091cb8",[[257,"dso-history-item",{"type":[513],"href":[513]}]]],["p-abe1dae2",[[257,"dso-renvooi",{"value":[1],"mark":[16]}],[257,"dso-label",{"compact":[516],"removable":[516],"status":[513],"truncate":[516],"removeHover":[32],"removeFocus":[32],"textHover":[32],"textFocus":[32],"isTruncated":[32],"labelText":[32],"_truncateLabel":[64]},[[4,"keydown","keyDownListener"]],{"removable":["watchRemovable"],"truncate":["watchTruncate"]}],[262,"dso-slide-toggle",{"checked":[4],"disabled":[4],"accessibleLabel":[1,"accessible-label"],"labelledbyId":[1,"labelledby-id"],"identifier":[1],"hasVisibleLabel":[32]}]]],["p-e78fcea9",[[257,"dso-map-layer",{"label":[513],"activatable":[516],"active":[516]}]]],["p-5be4766f",[[257,"dso-map-layer-object",{"active":[516]}]]],["p-0c228b3c",[[257,"dso-plekinfo-card",{"wijzigactie":[513],"href":[513],"targetBlank":[4,"target-blank"],"active":[516]}]]],["p-5c283c16",[[257,"dso-skiplink",{"to":[513],"label":[513]}]]],["p-770e2178",[[257,"dso-tijdreis-banner"]]],["p-1f87f7ad",[[257,"dso-accordion",{"variant":[6145],"reverseAlign":[6148,"reverse-align"],"_getState":[64]}]]],["p-49aa2bbc",[[257,"dso-action-list",{"listTitle":[1,"list-title"]}]]],["p-9b17b1e1",[[257,"dso-banner",{"status":[513],"compact":[4],"icon":[516]}]]],["p-feeb6953",[[257,"dso-card-container",{"mode":[513]}]]],["p-aafd4561",[[257,"dso-contact-information"]]],["p-b318a0f9",[[258,"dso-date-picker",{"name":[1],"identifier":[1],"disabled":[516],"required":[516],"invalid":[516],"describedBy":[1,"described-by"],"dsoAutofocus":[4,"dso-autofocus"],"value":[513],"min":[1],"max":[1]}]]],["p-aa4f4650",[[257,"dso-highlight-box",{"yellow":[516],"border":[516],"white":[516],"dropShadow":[516,"drop-shadow"],"step":[514]}]]],["p-9c4d091b",[[257,"dso-input-range",{"min":[2],"max":[2],"value":[2],"step":[2],"label":[1],"unit":[1],"description":[1]}]]],["p-ed149a75",[[257,"dso-logo",{"name":[513],"logoUrl":[513,"logo-url"],"label":[513],"labelUrl":[513,"label-url"],"ribbon":[513]}]]],["p-4729e938",[[257,"dso-tab",{"active":[516],"disabled":[516],"href":[1],"_dsoFocus":[64]}]]],["p-ae5a8660",[[257,"dso-tabs"]]],["p-5a2002a7",[[257,"dso-viewer-grid",{"filterPanelTitle":[513,"filter-panel-title"],"filterPanelOpen":[516,"filter-panel-open"],"overlayOpen":[516,"overlay-open"],"documentPanelOpen":[516,"document-panel-open"],"mainSize":[513,"main-size"],"activeTab":[1,"active-tab"],"documentPanelSize":[513,"document-panel-size"],"mainPanelExpanded":[4,"main-panel-expanded"],"mainPanelHidden":[4,"main-panel-hidden"],"tabView":[32],"_checkMainPanelVisibility":[64]},null,{"documentPanelOpen":["documentPanelOpenWatcher"],"filterPanelOpen":["filterPanelOpenWatcher"],"overlayOpen":["overlayOpenWatcher"]}]]],["p-9eca8361",[[257,"dso-toggletip",{"label":[1],"position":[1],"small":[4],"secondary":[4],"active":[32]}]]],["p-f36e20b1",[[257,"dso-button-group",{"direction":[513]}]]],["p-9a267127",[[257,"dso-dropdown-menu",{"open":[1540],"dropdownAlign":[1,"dropdown-align"],"dropdownOptionsOffset":[2,"dropdown-options-offset"],"checkable":[4]},[[8,"click","onClick"]]]]],["p-cccde8af",[[257,"dso-icon-button",{"icon":[513],"label":[513],"variant":[513],"tooltipPlacement":[513,"tooltip-placement"],"disabled":[516],"showTooltip":[32],"setFocus":[64]}],[257,"dso-icon",{"icon":[1]}]]],["p-3ab854dd",[[257,"dso-document-component",{"heading":[1],"kop":[6145],"inhoud":[6145],"open":[516],"filtered":[516],"notApplicable":[516,"not-applicable"],"genesteOntwerpInformatie":[516,"geneste-ontwerp-informatie"],"bevatOntwerpInformatie":[516,"bevat-ontwerp-informatie"],"annotated":[516],"gereserveerd":[6145],"vervallen":[6145],"openAnnotation":[516,"open-annotation"],"alternativeTitle":[513,"alternative-title"],"type":[513],"wijzigactie":[513],"annotationsWijzigactie":[513,"annotations-wijzigactie"],"mark":[16],"recursiveToggle":[8,"recursive-toggle"],"ozonContentUrlResolver":[16],"ozonContentBegripResolver":[16],"mode":[513],"href":[513]}],[257,"dso-annotation-locatie",{"wijzigactie":[513],"active":[516],"gewijzigdeLocatie":[516,"gewijzigde-locatie"],"locatieNoemer":[1,"locatie-noemer"]}]]],["p-b74d6b6a",[[257,"dso-attachments-counter",{"count":[2]}],[257,"dso-expandable",{"open":[516],"enableAnimation":[516,"enable-animation"],"minimumHeight":[2,"minimum-height"],"isClosed":[32]},[[0,"transitionstart","transitionstartHandler"],[0,"transitionend","transitionendHandler"]],{"open":["toggleOpen"]}]]],["p-faeacd73",[[257,"dso-progress-indicator",{"label":[1],"size":[513],"block":[516]}]]],["p-bb247b4e",[[257,"dso-responsive-element",{"sizeAlias":[32],"sizeWidth":[32],"getSize":[64]}]]],["p-573bfc8f",[[257,"dso-scrollable",{"scrollPosition":[32],"_setScrollState":[64]}]]],["p-1a5e129d",[[257,"dso-info-button",{"active":[1540],"secondary":[4],"label":[1],"hover":[32],"setFocus":[64]}]]],["p-c1c57c67",[[262,"dso-selectable",{"type":[1],"identifier":[1],"name":[1],"value":[1],"invalid":[4],"describedById":[1,"described-by-id"],"labelledById":[1,"labelled-by-id"],"disabled":[4],"required":[4],"checked":[516],"indeterminate":[4],"infoFixed":[4,"info-fixed"],"infoActive":[32],"toggleInfo":[64]},null,{"indeterminate":["setIndeterminate"]}],[257,"dso-info",{"fixed":[516],"active":[516]}]]],["p-5387f2db",[[257,"dso-tooltip",{"descriptive":[516],"position":[1],"strategy":[1],"noArrow":[4,"no-arrow"],"stateless":[4],"small":[4],"active":[1540],"hidden":[32],"activate":[64],"deactivate":[64]},null,{"position":["watchPosition"],"strategy":["watchStrategy"],"active":["watchActive"]}]]],["p-e64d2887",[[257,"dso-ozon-content",{"content":[1],"inline":[516],"mark":[16],"urlResolver":[16],"begripResolver":[16],"annotated":[516],"state":[32]},null,{"content":["contentWatcher"]}],[257,"dso-alert",{"status":[513],"roleAlert":[4,"role-alert"],"compact":[516],"closable":[4]}],[257,"dso-image-overlay",{"wijzigactie":[1],"active":[32],"zoomable":[32]},[[2,"load","loadListener"]]],[257,"dso-panel",{"closeButtonLabel":[1,"close-button-label"],"emphasized":[4]}],[257,"dso-ozon-content-toggletip",{"icon":[513],"active":[32],"showToggletip":[32]}],[257,"dso-table",{"noModal":[516,"no-modal"],"isResponsive":[32],"modalActive":[32],"placeholderHeight":[32]}],[257,"dso-badge",{"status":[1]}]]]]'),e)}));
 //# sourceMappingURL=dso-toolkit.esm.js.map

package/dist/dso-toolkit/{p-4157fc4b.entry.js → p-00e02bdd.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as i,h as o}from"./p-WDDbscLp.js";const n=()=>`*,*::after,*::before{box-sizing:border-box}:host{display:block;background-color:#fff}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}.dso-mark-bar{display:flex;flex-grow:1}.dso-mark-bar .dso-mark-bar-input{display:flex;position:relative;inline-size:100%}.dso-mark-bar .dso-mark-bar-input input{background-color:transparent;background-image:none;border:1px solid #275937;border-radius:4px;box-shadow:none;display:block;font-size:1rem;block-size:2.5rem;line-height:2.5rem;padding-inline:2.5rem;padding-block:6px;transition:border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;inline-size:100%;border-start-end-radius:0;border-end-end-radius:0;border-inline-end:0}.dso-mark-bar .dso-mark-bar-input input:focus{border-color:#275937;box-shadow:inset 0 0 0 1px #275937;outline:0}.dso-mark-bar .dso-mark-bar-input input::-ms-clear{display:none}.dso-mark-bar .dso-mark-bar-input input:not(:placeholder-shown)+label{inline-size:2.5rem;padding-inline-end:8px}.dso-mark-bar .dso-mark-bar-input input:not(:placeholder-shown)+label .label-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}.dso-mark-bar .dso-mark-bar-input label{inset-block-end:8px;block-size:2.5rem;inset-inline-start:0;inset-inline-end:40px;padding-block:8px;padding-inline-start:8px;cursor:text;position:absolute;inset-block-start:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.dso-mark-bar .dso-mark-bar-input label dso-icon{color:#39870c;cursor:default;margin:-8px;padding:8px;inline-size:2.5rem;block-size:2.5rem}.dso-mark-bar .dso-mark-bar-input label .label-text{margin-inline-start:8px;color:#666}.dso-mark-bar .dso-mark-bar-input dso-icon-button{position:absolute;inset-inline-end:8px;inset-block-start:8px}.dso-button-container{position:relative;display:flex;align-items:center;gap:8px;flex-shrink:0;padding-inline:8px;border:1px solid #275937;border-inline-start:0;border-start-end-radius:4px;border-end-end-radius:4px}.dso-button-container dso-icon-button{--dso-icon-button-tertiary-border:0;cursor:pointer}.dso-button-container dso-icon-button:disabled{color:#ccc;cursor:default}.dso-button-container .divider{position:absolute;inset-inline-start:0;inset-block-start:8px;inset-block-end:8px;inline-size:1px;background-color:#ccc}`;const a=class{constructor(o){e(this,o);this.dsoInput=i(this,"dsoInput",3);this.dsoNext=i(this,"dsoNext",3);this.dsoPrevious=i(this,"dsoPrevious",3);this.dsoClear=i(this,"dsoClear",3);this.label="Zoeken in document";this.handleInput=e=>{if(!(e.target instanceof HTMLInputElement)){return}this.dsoInput.emit({originalEvent:e,value:e.target.value})};this.handleNext=e=>{this.dsoNext.emit({originalEvent:e})};this.handlePrevious=e=>{this.dsoPrevious.emit({originalEvent:e})};this.handleClear=e=>{this.dsoClear.emit({originalEvent:e})};this.handleKeyDown=e=>{if(e.key==="Enter"){this.handleNext(e)}}}async dsoFocus(e={}){var i,o;(i=this.inputElement)===null||i===void 0?void 0:i.focus();if(e.select){(o=this.inputElement)===null||o===void 0?void 0:o.select()}}render(){const e=this.current||0;const i=this.totalCount||0;return o("div",{key:"efd4d5aeab981b0a61a4b2a79d8098a907ef6d63",class:"dso-mark-bar"},o("div",{key:"40efb59d5c0bcbe6ab271e88d1c5fc599ca79a66",class:"dso-mark-bar-input"},o("input",{key:"ea6117a0218b34b780e8e383d1e4d3b49beb99fe",type:"text",id:"search-input",value:this.value,onInput:this.handleInput,onKeyDown:this.handleKeyDown,placeholder:" ",ref:e=>this.inputElement=e}),o("label",{key:"e30c6afd4344b6ec13316a5a2a2147d364c71373",htmlFor:"search-input"},o("dso-icon",{key:"ed6c04ed53bcdeaea2547f5b4e7ce53c084a53fc",class:"dso-search-icon",icon:"search"}),o("span",{key:"6ee71ee1e63d65d79f13b03fe7cc29cdb50157e1",class:"label-text"},this.label)),o("dso-icon-button",{key:"03e173fc78136fa255ee1a0790bc74290649b4ad",icon:"times",variant:"tertiary",label:"Zoekopdracht legen",onDsoClick:e=>this.handleClear(e.detail.originalEvent)})),o("div",{key:"1bd44063ed8bf564d7dd43c5b7f6973e42238f0b",class:"dso-button-container"},o("span",{key:"347612ee2a6ac3be28f5ea0425499e1896dd94ce",class:"divider"}),o("dso-icon-button",{key:"830789193f1d31d1bbe099fb435beed7b1d24dd3",icon:"chevron-up",variant:"tertiary",label:"Vorig zoekresultaat",onDsoClick:e=>this.handlePrevious(e.detail.originalEvent),disabled:e<=1}),o("span",{key:"1eb7cc36f9868b8a2b82a3a75ebce890cd30c350"},e,"/",i),o("dso-icon-button",{key:"b4bf13a6be43b48529da397b9144f6ec543e3e11",icon:"chevron-down",variant:"tertiary",label:"Volgend zoekresultaat",onDsoClick:e=>this.handleNext(e.detail.originalEvent),disabled:e>=i})))}};a.style=n();export{a as dso_mark_bar};
-//# sourceMappingURL=p-4157fc4b.entry.js.map
+import{r as e,c as i,h as o}from"./p-WDDbscLp.js";const n=()=>`*,*::after,*::before{box-sizing:border-box}:host{display:block;background-color:#fff}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}.dso-mark-bar{display:flex;flex-grow:1}.dso-mark-bar .dso-mark-bar-input{display:flex;position:relative;inline-size:100%}.dso-mark-bar .dso-mark-bar-input input{background-color:transparent;background-image:none;border:1px solid #275937;border-radius:4px;box-shadow:none;display:block;font-size:1rem;block-size:2.5rem;line-height:2.5rem;padding-inline:2.5rem;padding-block:6px;transition:border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;inline-size:100%;border-start-end-radius:0;border-end-end-radius:0;border-inline-end:0}.dso-mark-bar .dso-mark-bar-input input:focus{border-color:#275937;box-shadow:inset 0 0 0 1px #275937;outline:0}.dso-mark-bar .dso-mark-bar-input input::-ms-clear{display:none}.dso-mark-bar .dso-mark-bar-input input:not(:placeholder-shown)+label{inline-size:2.5rem;padding-inline-end:8px}.dso-mark-bar .dso-mark-bar-input input:not(:placeholder-shown)+label .label-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}.dso-mark-bar .dso-mark-bar-input label{inset-block-end:8px;block-size:2.5rem;inset-inline-start:0;inset-inline-end:40px;padding-block:8px;padding-inline-start:8px;cursor:text;position:absolute;inset-block-start:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.dso-mark-bar .dso-mark-bar-input label dso-icon{color:#39870c;cursor:default;margin:-8px;padding:8px;inline-size:2.5rem;block-size:2.5rem}.dso-mark-bar .dso-mark-bar-input label .label-text{margin-inline-start:8px;color:#666}.dso-mark-bar .dso-mark-bar-input dso-icon-button{position:absolute;inset-inline-end:8px;inset-block-start:8px}.dso-button-container{position:relative;display:flex;align-items:center;gap:8px;flex-shrink:0;padding-inline:8px;border:1px solid #275937;border-inline-start:0;border-start-end-radius:4px;border-end-end-radius:4px}.dso-button-container dso-icon-button{--dso-icon-button-tertiary-border:0;cursor:pointer}.dso-button-container dso-icon-button:disabled{color:#ccc;cursor:default}.dso-button-container .divider{position:absolute;inset-inline-start:0;inset-block-start:8px;inset-block-end:8px;inline-size:1px;background-color:#ccc}`;const a=class{constructor(o){e(this,o);this.dsoInput=i(this,"dsoInput",3);this.dsoNext=i(this,"dsoNext",3);this.dsoPrevious=i(this,"dsoPrevious",3);this.dsoClear=i(this,"dsoClear",3);this.label="Zoeken in document";this.handleInput=e=>{if(!(e.target instanceof HTMLInputElement)){return}this.dsoInput.emit({originalEvent:e,value:e.target.value})};this.handleNext=e=>{this.dsoNext.emit({originalEvent:e})};this.handlePrevious=e=>{this.dsoPrevious.emit({originalEvent:e})};this.handleClear=e=>{this.dsoClear.emit({originalEvent:e})};this.handleKeyDown=e=>{if(e.key==="Enter"){this.handleNext(e)}}}async dsoFocus(e={}){var i,o;(i=this.inputElement)===null||i===void 0?void 0:i.focus();if(e.select){(o=this.inputElement)===null||o===void 0?void 0:o.select()}}render(){const e=this.current||0;const i=this.totalCount||0;return o("div",{key:"479f935010eaa312fb947a2bc86f4120156f72b7",class:"dso-mark-bar"},o("div",{key:"6f800ec39af642b5947ea302440756826c32468e",class:"dso-mark-bar-input"},o("input",{key:"39a5a73bab3522acdbe6e8d18727c453bb1ffb73",type:"text",id:"search-input",value:this.value,onInput:this.handleInput,onKeyDown:this.handleKeyDown,placeholder:" ",ref:e=>this.inputElement=e}),o("label",{key:"de1aa601a7d49e90a707002c6554ef12970d354c",htmlFor:"search-input"},o("dso-icon",{key:"ed3c5a20769c9cb5137300b6c7bf83bd02e33bb0",class:"dso-search-icon",icon:"search"}),o("span",{key:"6cbbfbfece06520c7f7ca7148f92227d76489c6e",class:"label-text"},this.label)),o("dso-icon-button",{key:"0e2b0f00578e857ee292e2c276516efcebcbba98",icon:"times",variant:"tertiary",label:"Zoekopdracht legen",onDsoClick:e=>this.handleClear(e.detail.originalEvent)})),o("div",{key:"753c2a3ae343240ba4234631b8ea93318e22632e",class:"dso-button-container"},o("span",{key:"9ec607afe4347550280631389368f2847bb53fe6",class:"divider"}),o("dso-icon-button",{key:"ea6c03677bfd7a89b34d0a4416e8d5f38dab2124",icon:"chevron-up",variant:"tertiary",label:"Vorig zoekresultaat",onDsoClick:e=>this.handlePrevious(e.detail.originalEvent),disabled:e<=1}),o("span",{key:"b5fbeba0936fd222057f7ec38fc90e2c0c4c0cbe"},e,"/",i),o("dso-icon-button",{key:"01ee5a34b52a660705b451ecf9b72ba738c7fe1d",icon:"chevron-down",variant:"tertiary",label:"Volgend zoekresultaat",onDsoClick:e=>this.handleNext(e.detail.originalEvent),disabled:e>=i})))}};a.style=n();export{a as dso_mark_bar};
+//# sourceMappingURL=p-00e02bdd.entry.js.map

package/dist/dso-toolkit/{p-6eb56e78.entry.js → p-0c228b3c.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,c as e,f as r,h as i,F as n,H as a,g as t}from"./p-WDDbscLp.js";import{i as d}from"./p-Hgv-pDpy.js";const s=()=>`ins{text-decoration:none}ins{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}ins{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919}ins{box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:colors.$zwart}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;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}del{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919}del{--_dso-ozon-content-toggletip-color:colors.$zwart;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{padding-block:16px;padding-inline:16px;inline-size:100%}.dso-plekinfo-card-container .dso-plekinfo-card-heading{display:flex;align-items:start;column-gap:8px}@media screen and (max-width: 480px){.dso-plekinfo-card-container .dso-plekinfo-card-heading{flex-wrap:wrap}}.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:8px}.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}@media screen and (max-width: 480px){::slotted([slot=meta]){flex-basis:100% !important;margin-block-start:8px !important}}::slotted([slot=heading]){display:inline !important;font-size:1.125em !important;font-weight:700 !important;color:#275937 !important;line-height:1.25 !important;margin-block-end:0 !important;margin-block-start:0 !important}::slotted([slot=content]){--_dt-rich-content-margin-block:8px;--_dt-rich-content-margin-block-end:0;--_dt-rich-content-margin-block-start:0}::slotted([slot=interaction]){display:flex !important;justify-content:space-between !important;margin-inline-start:auto !important}@media screen and (max-width: 480px){::slotted([slot=interaction]){flex-basis:100% !important;margin-block-start:16px !important}}.heading-anchor{color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}.heading-anchor .icon-container{position:relative;padding-inline-end:24px}.heading-anchor .icon-container dso-icon{position:absolute;inset-inline-end:0;inset-block-end:-3px;block-size:24px;inline-size:24px}`;const c=({wijzigactie:o},e)=>{if(o==="voegtoe"){return i("ins",{class:"dso-plekinfo-card-container"},e)}if(o==="verwijder"){return i("del",{class:"dso-plekinfo-card-container"},e)}return i("div",{class:"dso-plekinfo-card-container"},e)};const l=class{constructor(r){o(this,r);this.dsoPlekinfoCardClick=e(this,"dsoPlekinfoCardClick",7);this.targetBlank=false}connectedCallback(){this.mutationObserver=new MutationObserver((()=>r(this.host)));this.mutationObserver.observe(this.host,{attributes:true,childList:true})}disconnectedCallback(){var o;(o=this.mutationObserver)===null||o===void 0?void 0:o.disconnect();delete this.mutationObserver}clickEventHandler(o){if(!(o.target instanceof HTMLElement)||!this.href){return}return this.dsoPlekinfoCardClick.emit({originalEvent:o,isModifiedEvent:d(o)})}get symbolSlottedElement(){return this.host.querySelector("[slot='symbol']")}get metaSlottedElement(){return this.host.querySelector("[slot='meta']")}get interaction(){return this.host.querySelector("[slot='interaction']")}render(){const o=this.symbolSlottedElement!==null;return i(a,{key:"6aaecfcce7d84584571fbbb40b79d143ac79779e","has-symbol":o},i(c,{key:"0c22b39580fead2392e72641345329588ef18e91",wijzigactie:this.wijzigactie},i("div",{key:"8b2882c9a98c2f75a5c64a2058fc2be6496b4623",class:"dso-plekinfo-card-symbol",hidden:!o},i("slot",{key:"b967d6a1c7abcd6e5bf3d535bc3645306e931f88",name:"symbol"})),i("div",{key:"66efb9d7642e6a6a77c8bef9413b06e36e59a7a5",class:"dso-plekinfo-card-heading"},this.href?i("a",{href:this.href,target:this.targetBlank?"_blank":undefined,rel:this.targetBlank?"noopener noreferrer":undefined,class:"heading-anchor",onClick:o=>this.clickEventHandler(o)},i("span",{class:"icon-container"},this.targetBlank?i(n,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("slot",{name:"heading"}))):i("slot",{name:"heading"}),this.metaSlottedElement!==null&&i("slot",{key:"448d3c56d45cd086f86495fa91a5c867fa70ed15",name:"meta"}),this.interaction!==null&&i("slot",{key:"b753670011c4628c188a069b18cac0daff756836",name:"interaction"})),i("div",{key:"36994c07c528b9d80f7825fc1bdec22626c82098",class:"dso-plekinfo-card-content"},i("slot",{key:"dc8ae54f969a6d49adb536daf9b934752512ad11",name:"content"}))))}get host(){return t(this)}};l.style=s();export{l as dso_plekinfo_card};
-//# sourceMappingURL=p-6eb56e78.entry.js.map
+import{r as o,c as e,f as r,h as i,F as n,H as t,g as a}from"./p-WDDbscLp.js";import{i as d}from"./p-Hgv-pDpy.js";const s=()=>`ins{text-decoration:none}ins{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}ins{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919}ins{box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:colors.$zwart}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;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}del{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919}del{--_dso-ozon-content-toggletip-color:colors.$zwart;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{padding-block:16px;padding-inline:16px;inline-size:100%}.dso-plekinfo-card-container .dso-plekinfo-card-heading{display:flex;align-items:start;column-gap:8px}@media screen and (max-width: 480px){.dso-plekinfo-card-container .dso-plekinfo-card-heading{flex-wrap:wrap}}.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:8px}.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}@media screen and (max-width: 480px){::slotted([slot=meta]){flex-basis:100% !important;margin-block-start:8px !important}}::slotted([slot=heading]){display:inline !important;font-size:1.125em !important;font-weight:700 !important;color:#275937 !important;line-height:1.25 !important;margin-block-end:0 !important;margin-block-start:0 !important}::slotted([slot=content]){--_dt-rich-content-margin-block:8px;--_dt-rich-content-margin-block-end:0;--_dt-rich-content-margin-block-start:0}::slotted([slot=interaction]){display:flex !important;justify-content:space-between !important;margin-inline-start:auto !important}@media screen and (max-width: 480px){::slotted([slot=interaction]){flex-basis:100% !important;margin-block-start:16px !important}}.heading-anchor{color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}.heading-anchor .icon-container{position:relative;padding-inline-end:24px}.heading-anchor .icon-container dso-icon{position:absolute;inset-inline-end:0;inset-block-end:-3px;block-size:24px;inline-size:24px}`;const c=({wijzigactie:o},e)=>{if(o==="voegtoe"){return i("ins",{class:"dso-plekinfo-card-container"},e)}if(o==="verwijder"){return i("del",{class:"dso-plekinfo-card-container"},e)}return i("div",{class:"dso-plekinfo-card-container"},e)};const l=class{constructor(r){o(this,r);this.dsoPlekinfoCardClick=e(this,"dsoPlekinfoCardClick",7);this.targetBlank=false}connectedCallback(){this.mutationObserver=new MutationObserver((()=>r(this.host)));this.mutationObserver.observe(this.host,{attributes:true,childList:true})}disconnectedCallback(){var o;(o=this.mutationObserver)===null||o===void 0?void 0:o.disconnect();delete this.mutationObserver}clickEventHandler(o){if(!(o.target instanceof HTMLElement)||!this.href){return}return this.dsoPlekinfoCardClick.emit({originalEvent:o,isModifiedEvent:d(o)})}get symbolSlottedElement(){return this.host.querySelector("[slot='symbol']")}get metaSlottedElement(){return this.host.querySelector("[slot='meta']")}get interaction(){return this.host.querySelector("[slot='interaction']")}render(){const o=this.symbolSlottedElement!==null;return i(t,{key:"88281278c8b439633eab1a9ca448cc94d2cae443","has-symbol":o},i(c,{key:"1b81d16887550c21bd06cac6124e7ae17c5b0cff",wijzigactie:this.wijzigactie},i("div",{key:"bd448966c8f8ba32614f1b65bb08fbec194c3e28",class:"dso-plekinfo-card-symbol",hidden:!o},i("slot",{key:"08db6c3eab68d220d04d3fdde741959cbdc69908",name:"symbol"})),i("div",{key:"71561f242890f6bea2229d7aef72fddceb4e5b37",class:"dso-plekinfo-card-heading"},this.href?i("a",{href:this.href,target:this.targetBlank?"_blank":undefined,rel:this.targetBlank?"noopener noreferrer":undefined,class:"heading-anchor",onClick:o=>this.clickEventHandler(o)},i("span",{class:"icon-container"},this.targetBlank?i(n,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("slot",{name:"heading"}))):i("slot",{name:"heading"}),this.metaSlottedElement!==null&&i("slot",{key:"5082d7a4cf6690023ca4dd9d5196fe6b2ae30cf5",name:"meta"}),this.interaction!==null&&i("slot",{key:"321d20c96a0b8a3f32d779a3bdda44a2f9b8eec5",name:"interaction"})),i("div",{key:"05a7e71a09d5807496b65b2d9294d2ce249ae1de",class:"dso-plekinfo-card-content"},i("slot",{key:"28be581464755c8626cab40c8af0b90b84db430d",name:"content"}))))}get host(){return a(this)}};l.style=s();export{l as dso_plekinfo_card};
+//# sourceMappingURL=p-0c228b3c.entry.js.map

package/dist/dso-toolkit/{p-ba9c436c.entry.js → p-30dd509e.entry.js}

@@ -1,2 +1,2 @@
-import{r as n,c as o,h as e,F as a,g as s}from"./p-WDDbscLp.js";import{i as r}from"./p-C0ZvZbHD.js";const t={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}}"}}};const d=()=>`button {\n  -webkit-appearance: button;\n  color: inherit;\n  cursor: pointer;\n  font: inherit;\n  font-family: inherit;\n  font-size: inherit;\n  line-height: inherit;\n  margin: 0;\n  overflow: visible;\n  text-transform: none;\n}\nbutton[disabled] {\n  cursor: default;\n}\nbutton::-moz-focus-inner {\n  border: 0;\n  padding: 0;\n}\n\na.dso-primary,\nbutton.dso-primary,\nlabel.dso-primary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\na.dso-primary:focus, a.dso-primary:focus-visible,\nbutton.dso-primary:focus,\nbutton.dso-primary:focus-visible,\nlabel.dso-primary:focus,\nlabel.dso-primary:focus-visible {\n  outline-offset: 2px;\n}\na.dso-primary:active,\nbutton.dso-primary:active,\nlabel.dso-primary:active {\n  outline: 0;\n}\na.dso-primary.extern::after, a.dso-primary.download::after,\nbutton.dso-primary.extern::after,\nbutton.dso-primary.download::after,\nlabel.dso-primary.extern::after,\nlabel.dso-primary.download::after {\n  content: "";\n  display: inline-block;\n  margin-inline-start: 8px;\n}\na.dso-primary,\nbutton.dso-primary,\nlabel.dso-primary {\n  background-color: var(--_dso-button-primary-background-color, #39870c);\n  border-color: var(--_dso-button-primary-border-color, #39870c);\n  color: var(--_dso-button-primary-color, #fff);\n}\na.dso-primary,\nbutton.dso-primary,\nlabel.dso-primary {\n  border-width: 1px;\n  border-style: solid;\n  border-radius: 4px;\n  line-height: 1.5;\n  min-inline-size: 56px;\n  padding-block: 11px;\n  padding-inline: 15px;\n}\na.dso-primary:hover,\nbutton.dso-primary:hover,\nlabel.dso-primary:hover {\n  background-color: var(--_dso-button-primary-hover-background-color, #275937);\n  border-color: var(--_dso-button-primary-hover-border-color, #275937);\n  color: var(--_dso-button-primary-hover-color, #fff);\n}\na.dso-primary:active,\nbutton.dso-primary:active,\nlabel.dso-primary:active {\n  background-color: var(--_dso-button-primary-active-background-color, #173521);\n  border-color: var(--_dso-button-primary-active-border-color, #173521);\n  color: var(--_dso-button-primary-active-color, #fff);\n}\na.dso-primary[disabled], a.dso-primary[disabled]:hover,\nbutton.dso-primary[disabled],\nbutton.dso-primary[disabled]:hover,\nlabel.dso-primary[disabled],\nlabel.dso-primary[disabled]:hover {\n  background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d);\n  border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d);\n  color: var(--_dso-button-primary-disabled-color, #fff);\n}\na.dso-primary.dso-small,\nbutton.dso-primary.dso-small,\nlabel.dso-primary.dso-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-primary.dso-small dso-icon,\nbutton.dso-primary.dso-small.extern::after,\nbutton.dso-primary.dso-small.download::after,\nbutton.dso-primary.dso-small.dso-spinner::before,\nlabel.dso-primary.dso-small dso-icon,\nlabel.dso-primary.dso-small.extern::after,\nlabel.dso-primary.dso-small.download::after,\nlabel.dso-primary.dso-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-primary.dso-small.dso-spinner-left::before,\nbutton.dso-primary.dso-small.dso-spinner-left::before,\nlabel.dso-primary.dso-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-primary.dso-small.dso-spinner-right::after,\nbutton.dso-primary.dso-small.dso-spinner-right::after,\nlabel.dso-primary.dso-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-primary.dso-extra-small,\nbutton.dso-primary.dso-extra-small,\nlabel.dso-primary.dso-extra-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-primary.dso-extra-small dso-icon,\nbutton.dso-primary.dso-extra-small.extern::after,\nbutton.dso-primary.dso-extra-small.download::after,\nbutton.dso-primary.dso-extra-small.dso-spinner::before,\nlabel.dso-primary.dso-extra-small dso-icon,\nlabel.dso-primary.dso-extra-small.extern::after,\nlabel.dso-primary.dso-extra-small.download::after,\nlabel.dso-primary.dso-extra-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-primary.dso-extra-small.dso-spinner-left::before,\nbutton.dso-primary.dso-extra-small.dso-spinner-left::before,\nlabel.dso-primary.dso-extra-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-primary.dso-extra-small.dso-spinner-right::after,\nbutton.dso-primary.dso-extra-small.dso-spinner-right::after,\nlabel.dso-primary.dso-extra-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-primary.dso-extra-small,\nbutton.dso-primary.dso-extra-small,\nlabel.dso-primary.dso-extra-small {\n  padding-block: 9px;\n}\na.dso-primary dso-icon:has(+ span:not(.sr-only)),\nbutton.dso-primary dso-icon:has(+ span:not(.sr-only)),\nlabel.dso-primary dso-icon:has(+ span:not(.sr-only)) {\n  margin-inline-start: -8px;\n}\na.dso-primary span:not(.sr-only) + dso-icon,\nbutton.dso-primary span:not(.sr-only) + dso-icon,\nlabel.dso-primary span:not(.sr-only) + dso-icon {\n  margin-inline-start: 8px;\n  margin-inline-end: -8px;\n}\na.dso-primary dso-icon + span:not(.sr-only),\nbutton.dso-primary dso-icon + span:not(.sr-only),\nlabel.dso-primary dso-icon + span:not(.sr-only) {\n  margin-inline-start: 8px;\n}\na.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled],\nbutton.dso-primary.dso-spinner-left[disabled],\nbutton.dso-primary.dso-spinner-right[disabled],\nlabel.dso-primary.dso-spinner-left[disabled],\nlabel.dso-primary.dso-spinner-right[disabled] {\n  background-color: #39870c;\n  border-color: #39870c;\n  color: #fff;\n}\na.dso-primary.dso-spinner-left::before,\nbutton.dso-primary.dso-spinner-left::before,\nlabel.dso-primary.dso-spinner-left::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-primary.dso-spinner-right::after,\nbutton.dso-primary.dso-spinner-right::after,\nlabel.dso-primary.dso-spinner-right::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-primary.download::after,\nbutton.dso-primary.download::after,\nlabel.dso-primary.download::after {\n  background: url("./di.svg#download-wit") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-primary.extern::after,\nbutton.dso-primary.extern::after,\nlabel.dso-primary.extern::after {\n  background: url("./di.svg#external-link-wit") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-secondary,\nbutton.dso-secondary,\nlabel.dso-secondary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\na.dso-secondary:focus, a.dso-secondary:focus-visible,\nbutton.dso-secondary:focus,\nbutton.dso-secondary:focus-visible,\nlabel.dso-secondary:focus,\nlabel.dso-secondary:focus-visible {\n  outline-offset: 2px;\n}\na.dso-secondary:active,\nbutton.dso-secondary:active,\nlabel.dso-secondary:active {\n  outline: 0;\n}\na.dso-secondary.extern::after, a.dso-secondary.download::after,\nbutton.dso-secondary.extern::after,\nbutton.dso-secondary.download::after,\nlabel.dso-secondary.extern::after,\nlabel.dso-secondary.download::after {\n  content: "";\n  display: inline-block;\n  margin-inline-start: 8px;\n}\na.dso-secondary,\nbutton.dso-secondary,\nlabel.dso-secondary {\n  background-color: var(--_dso-button-secondary-background-color, #fff);\n  border-color: var(--_dso-button-secondary-border-color, #39870c);\n  color: var(--_dso-button-secondary-color, #39870c);\n}\na.dso-secondary,\nbutton.dso-secondary,\nlabel.dso-secondary {\n  border-width: 1px;\n  border-style: solid;\n  border-radius: 4px;\n  line-height: 1.5;\n  min-inline-size: 56px;\n  padding-block: 11px;\n  padding-inline: 15px;\n}\na.dso-secondary:hover,\nbutton.dso-secondary:hover,\nlabel.dso-secondary:hover {\n  background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce);\n  border-color: var(--_dso-button-secondary-hover-border-color, #275937);\n  color: var(--_dso-button-secondary-hover-color, #275937);\n}\na.dso-secondary:active,\nbutton.dso-secondary:active,\nlabel.dso-secondary:active {\n  background-color: var(--_dso-button-secondary-active-background-color, #275937);\n  border-color: var(--_dso-button-secondary-active-border-color, #275937);\n  color: var(--_dso-button-secondary-active-color, #fff);\n}\na.dso-secondary[disabled], a.dso-secondary[disabled]:hover,\nbutton.dso-secondary[disabled],\nbutton.dso-secondary[disabled]:hover,\nlabel.dso-secondary[disabled],\nlabel.dso-secondary[disabled]:hover {\n  background-color: var(--_dso-button-secondary-disabled-background-color, #fff);\n  border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d);\n  color: var(--_dso-button-secondary-disabled-color, #afcf9d);\n}\na.dso-secondary.dso-small,\nbutton.dso-secondary.dso-small,\nlabel.dso-secondary.dso-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-secondary.dso-small dso-icon,\nbutton.dso-secondary.dso-small.extern::after,\nbutton.dso-secondary.dso-small.download::after,\nbutton.dso-secondary.dso-small.dso-spinner::before,\nlabel.dso-secondary.dso-small dso-icon,\nlabel.dso-secondary.dso-small.extern::after,\nlabel.dso-secondary.dso-small.download::after,\nlabel.dso-secondary.dso-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-secondary.dso-small.dso-spinner-left::before,\nbutton.dso-secondary.dso-small.dso-spinner-left::before,\nlabel.dso-secondary.dso-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-small.dso-spinner-right::after,\nbutton.dso-secondary.dso-small.dso-spinner-right::after,\nlabel.dso-secondary.dso-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-extra-small,\nbutton.dso-secondary.dso-extra-small,\nlabel.dso-secondary.dso-extra-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-secondary.dso-extra-small dso-icon,\nbutton.dso-secondary.dso-extra-small.extern::after,\nbutton.dso-secondary.dso-extra-small.download::after,\nbutton.dso-secondary.dso-extra-small.dso-spinner::before,\nlabel.dso-secondary.dso-extra-small dso-icon,\nlabel.dso-secondary.dso-extra-small.extern::after,\nlabel.dso-secondary.dso-extra-small.download::after,\nlabel.dso-secondary.dso-extra-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-secondary.dso-extra-small.dso-spinner-left::before,\nbutton.dso-secondary.dso-extra-small.dso-spinner-left::before,\nlabel.dso-secondary.dso-extra-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-extra-small.dso-spinner-right::after,\nbutton.dso-secondary.dso-extra-small.dso-spinner-right::after,\nlabel.dso-secondary.dso-extra-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-extra-small,\nbutton.dso-secondary.dso-extra-small,\nlabel.dso-secondary.dso-extra-small {\n  padding-block: 9px;\n}\na.dso-secondary dso-icon:has(+ span:not(.sr-only)),\nbutton.dso-secondary dso-icon:has(+ span:not(.sr-only)),\nlabel.dso-secondary dso-icon:has(+ span:not(.sr-only)) {\n  margin-inline-start: -8px;\n}\na.dso-secondary span:not(.sr-only) + dso-icon,\nbutton.dso-secondary span:not(.sr-only) + dso-icon,\nlabel.dso-secondary span:not(.sr-only) + dso-icon {\n  margin-inline-start: 8px;\n  margin-inline-end: -8px;\n}\na.dso-secondary dso-icon + span:not(.sr-only),\nbutton.dso-secondary dso-icon + span:not(.sr-only),\nlabel.dso-secondary dso-icon + span:not(.sr-only) {\n  margin-inline-start: 8px;\n}\na.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled],\nbutton.dso-secondary.dso-spinner-left[disabled],\nbutton.dso-secondary.dso-spinner-right[disabled],\nlabel.dso-secondary.dso-spinner-left[disabled],\nlabel.dso-secondary.dso-spinner-right[disabled] {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #39870c;\n}\na.dso-secondary.dso-spinner-left::before,\nbutton.dso-secondary.dso-spinner-left::before,\nlabel.dso-secondary.dso-spinner-left::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-secondary.dso-spinner-left:not([disabled]):hover::before,\nbutton.dso-secondary.dso-spinner-left:not([disabled]):hover::before,\nlabel.dso-secondary.dso-spinner-left:not([disabled]):hover::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before,\nbutton.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before,\nlabel.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-spinner-right::after,\nbutton.dso-secondary.dso-spinner-right::after,\nlabel.dso-secondary.dso-spinner-right::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-secondary.dso-spinner-right:not([disabled]):hover::after,\nbutton.dso-secondary.dso-spinner-right:not([disabled]):hover::after,\nlabel.dso-secondary.dso-spinner-right:not([disabled]):hover::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after,\nbutton.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after,\nlabel.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.download::after,\nbutton.dso-secondary.download::after,\nlabel.dso-secondary.download::after {\n  background: url("./di.svg#download") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-secondary.download:hover::after,\nbutton.dso-secondary.download:hover::after,\nlabel.dso-secondary.download:hover::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#download-wit"));\n}\na.dso-secondary.download[disabled]::after,\nbutton.dso-secondary.download[disabled]::after,\nlabel.dso-secondary.download[disabled]::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40"));\n}\na.dso-secondary.extern::after,\nbutton.dso-secondary.extern::after,\nlabel.dso-secondary.extern::after {\n  background: url("./di.svg#external-link") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-secondary.extern:hover::after,\nbutton.dso-secondary.extern:hover::after,\nlabel.dso-secondary.extern:hover::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-wit"));\n}\na.dso-secondary.extern[disabled]::after,\nbutton.dso-secondary.extern[disabled]::after,\nlabel.dso-secondary.extern[disabled]::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40"));\n}\na.dso-tertiary,\nbutton.dso-tertiary,\nlabel.dso-tertiary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\na.dso-tertiary:focus, a.dso-tertiary:focus-visible,\nbutton.dso-tertiary:focus,\nbutton.dso-tertiary:focus-visible,\nlabel.dso-tertiary:focus,\nlabel.dso-tertiary:focus-visible {\n  outline-offset: 2px;\n}\na.dso-tertiary:active,\nbutton.dso-tertiary:active,\nlabel.dso-tertiary:active {\n  outline: 0;\n}\na.dso-tertiary.extern::after, a.dso-tertiary.download::after,\nbutton.dso-tertiary.extern::after,\nbutton.dso-tertiary.download::after,\nlabel.dso-tertiary.extern::after,\nlabel.dso-tertiary.download::after {\n  content: "";\n  display: inline-block;\n  margin-inline-start: 8px;\n}\na.dso-tertiary,\nbutton.dso-tertiary,\nlabel.dso-tertiary {\n  border: 0;\n  color: #39870c;\n  line-height: 1;\n  padding: 0;\n  background-color: transparent;\n}\na.dso-tertiary[disabled],\nbutton.dso-tertiary[disabled],\nlabel.dso-tertiary[disabled] {\n  color: #afcf9d;\n}\na.dso-tertiary[disabled].dso-spinner-left, a.dso-tertiary[disabled].dso-spinner-right,\nbutton.dso-tertiary[disabled].dso-spinner-left,\nbutton.dso-tertiary[disabled].dso-spinner-right,\nlabel.dso-tertiary[disabled].dso-spinner-left,\nlabel.dso-tertiary[disabled].dso-spinner-right {\n  color: #39870c;\n}\na.dso-tertiary:not([disabled]):hover,\nbutton.dso-tertiary:not([disabled]):hover,\nlabel.dso-tertiary:not([disabled]):hover {\n  color: #275937;\n  text-decoration: underline;\n  text-underline-position: under;\n}\na.dso-tertiary:not([disabled]):active,\nbutton.dso-tertiary:not([disabled]):active,\nlabel.dso-tertiary:not([disabled]):active {\n  color: #173521;\n}\na.dso-tertiary.dso-align,\nbutton.dso-tertiary.dso-align,\nlabel.dso-tertiary.dso-align {\n  line-height: calc(1.5em - 1px);\n  padding-block: 11px;\n  padding-inline: 0;\n  position: relative;\n}\na.dso-tertiary.dso-truncate,\nbutton.dso-tertiary.dso-truncate,\nlabel.dso-tertiary.dso-truncate {\n  max-inline-size: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\na.dso-tertiary.dso-spinner-left::before,\nbutton.dso-tertiary.dso-spinner-left::before,\nlabel.dso-tertiary.dso-spinner-left::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: middle;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-tertiary.dso-spinner-right::after,\nbutton.dso-tertiary.dso-spinner-right::after,\nlabel.dso-tertiary.dso-spinner-right::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: middle;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-tertiary dso-icon + span:not(.sr-only),\na.dso-tertiary span:not(.sr-only) + dso-icon,\nbutton.dso-tertiary dso-icon + span:not(.sr-only),\nbutton.dso-tertiary span:not(.sr-only) + dso-icon,\nlabel.dso-tertiary dso-icon + span:not(.sr-only),\nlabel.dso-tertiary span:not(.sr-only) + dso-icon {\n  margin-inline-start: 8px;\n}\na.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),\na.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),\na.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],\na.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right],\nbutton.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),\nbutton.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),\nbutton.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],\nbutton.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right],\nlabel.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),\nlabel.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),\nlabel.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],\nlabel.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] {\n  margin-inline-start: 0;\n}\na.dso-tertiary dso-icon,\na.dso-tertiary span,\nbutton.dso-tertiary dso-icon,\nbutton.dso-tertiary span,\nlabel.dso-tertiary dso-icon,\nlabel.dso-tertiary span {\n  vertical-align: middle;\n}\na.dso-tertiary.extern::after, a.dso-tertiary.download::after,\nbutton.dso-tertiary.extern::after,\nbutton.dso-tertiary.download::after,\nlabel.dso-tertiary.extern::after,\nlabel.dso-tertiary.download::after {\n  position: relative;\n  inset-block-start: -2px;\n}\na.dso-tertiary.download::after,\nbutton.dso-tertiary.download::after,\nlabel.dso-tertiary.download::after {\n  background: url("./di.svg#download") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-tertiary.download[disabled]::after,\nbutton.dso-tertiary.download[disabled]::after,\nlabel.dso-tertiary.download[disabled]::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40"));\n}\na.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):active::after,\nbutton.dso-tertiary.download:not([disabled]):hover::after,\nbutton.dso-tertiary.download:not([disabled]):active::after,\nlabel.dso-tertiary.download:not([disabled]):hover::after,\nlabel.dso-tertiary.download:not([disabled]):active::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen"));\n}\na.dso-tertiary.extern::after,\nbutton.dso-tertiary.extern::after,\nlabel.dso-tertiary.extern::after {\n  background: url("./di.svg#external-link") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-tertiary.extern[disabled]::after,\nbutton.dso-tertiary.extern[disabled]::after,\nlabel.dso-tertiary.extern[disabled]::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40"));\n}\na.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):active::after,\nbutton.dso-tertiary.extern:not([disabled]):hover::after,\nbutton.dso-tertiary.extern:not([disabled]):active::after,\nlabel.dso-tertiary.extern:not([disabled]):hover::after,\nlabel.dso-tertiary.extern:not([disabled]):active::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen"));\n}\na.dso-map,\nbutton.dso-map,\nlabel.dso-map {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\na.dso-map:focus, a.dso-map:focus-visible,\nbutton.dso-map:focus,\nbutton.dso-map:focus-visible,\nlabel.dso-map:focus,\nlabel.dso-map:focus-visible {\n  outline-offset: 2px;\n}\na.dso-map:active,\nbutton.dso-map:active,\nlabel.dso-map:active {\n  outline: 0;\n}\na.dso-map,\nbutton.dso-map,\nlabel.dso-map {\n  background-color: var(--_dso-button-secondary-background-color, #fff);\n  border-color: var(--_dso-button-secondary-border-color, #39870c);\n  color: var(--_dso-button-secondary-color, #39870c);\n}\na.dso-map,\nbutton.dso-map,\nlabel.dso-map {\n  border-width: 1px;\n  border-style: solid;\n  border-radius: 4px;\n  line-height: 1.5;\n  min-inline-size: 56px;\n  padding-block: 11px;\n  padding-inline: 15px;\n}\na.dso-map:hover,\nbutton.dso-map:hover,\nlabel.dso-map:hover {\n  background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce);\n  border-color: var(--_dso-button-secondary-hover-border-color, #275937);\n  color: var(--_dso-button-secondary-hover-color, #275937);\n}\na.dso-map:active,\nbutton.dso-map:active,\nlabel.dso-map:active {\n  background-color: var(--_dso-button-secondary-active-background-color, #275937);\n  border-color: var(--_dso-button-secondary-active-border-color, #275937);\n  color: var(--_dso-button-secondary-active-color, #fff);\n}\na.dso-map[disabled], a.dso-map[disabled]:hover,\nbutton.dso-map[disabled],\nbutton.dso-map[disabled]:hover,\nlabel.dso-map[disabled],\nlabel.dso-map[disabled]:hover {\n  background-color: var(--_dso-button-secondary-disabled-background-color, #fff);\n  border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d);\n  color: var(--_dso-button-secondary-disabled-color, #afcf9d);\n}\na.dso-map.dso-small,\nbutton.dso-map.dso-small,\nlabel.dso-map.dso-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-map.dso-small dso-icon,\nbutton.dso-map.dso-small.extern::after,\nbutton.dso-map.dso-small.download::after,\nbutton.dso-map.dso-small.dso-spinner::before,\nlabel.dso-map.dso-small dso-icon,\nlabel.dso-map.dso-small.extern::after,\nlabel.dso-map.dso-small.download::after,\nlabel.dso-map.dso-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-map.dso-small.dso-spinner-left::before,\nbutton.dso-map.dso-small.dso-spinner-left::before,\nlabel.dso-map.dso-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-small.dso-spinner-right::after,\nbutton.dso-map.dso-small.dso-spinner-right::after,\nlabel.dso-map.dso-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-extra-small,\nbutton.dso-map.dso-extra-small,\nlabel.dso-map.dso-extra-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-map.dso-extra-small dso-icon,\nbutton.dso-map.dso-extra-small.extern::after,\nbutton.dso-map.dso-extra-small.download::after,\nbutton.dso-map.dso-extra-small.dso-spinner::before,\nlabel.dso-map.dso-extra-small dso-icon,\nlabel.dso-map.dso-extra-small.extern::after,\nlabel.dso-map.dso-extra-small.download::after,\nlabel.dso-map.dso-extra-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-map.dso-extra-small.dso-spinner-left::before,\nbutton.dso-map.dso-extra-small.dso-spinner-left::before,\nlabel.dso-map.dso-extra-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-extra-small.dso-spinner-right::after,\nbutton.dso-map.dso-extra-small.dso-spinner-right::after,\nlabel.dso-map.dso-extra-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-extra-small,\nbutton.dso-map.dso-extra-small,\nlabel.dso-map.dso-extra-small {\n  padding-block: 9px;\n}\na.dso-map dso-icon:has(+ span:not(.sr-only)),\nbutton.dso-map dso-icon:has(+ span:not(.sr-only)),\nlabel.dso-map dso-icon:has(+ span:not(.sr-only)) {\n  margin-inline-start: -8px;\n}\na.dso-map span:not(.sr-only) + dso-icon,\nbutton.dso-map span:not(.sr-only) + dso-icon,\nlabel.dso-map span:not(.sr-only) + dso-icon {\n  margin-inline-start: 8px;\n  margin-inline-end: -8px;\n}\na.dso-map dso-icon + span:not(.sr-only),\nbutton.dso-map dso-icon + span:not(.sr-only),\nlabel.dso-map dso-icon + span:not(.sr-only) {\n  margin-inline-start: 8px;\n}\na.dso-map.dso-spinner-left[disabled], a.dso-map.dso-spinner-right[disabled],\nbutton.dso-map.dso-spinner-left[disabled],\nbutton.dso-map.dso-spinner-right[disabled],\nlabel.dso-map.dso-spinner-left[disabled],\nlabel.dso-map.dso-spinner-right[disabled] {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #39870c;\n}\na.dso-map.dso-spinner-left::before,\nbutton.dso-map.dso-spinner-left::before,\nlabel.dso-map.dso-spinner-left::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-map.dso-spinner-left:not([disabled]):hover::before,\nbutton.dso-map.dso-spinner-left:not([disabled]):hover::before,\nlabel.dso-map.dso-spinner-left:not([disabled]):hover::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before,\nbutton.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before,\nlabel.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-spinner-right::after,\nbutton.dso-map.dso-spinner-right::after,\nlabel.dso-map.dso-spinner-right::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-map.dso-spinner-right:not([disabled]):hover::after,\nbutton.dso-map.dso-spinner-right:not([disabled]):hover::after,\nlabel.dso-map.dso-spinner-right:not([disabled]):hover::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after,\nbutton.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after,\nlabel.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map,\nbutton.dso-map,\nlabel.dso-map {\n  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);\n  border: 0;\n  font-weight: 600;\n  margin-inline-end: 16px;\n  padding-block: 8px;\n  padding-inline: 16px;\n  white-space: nowrap;\n}\na.dso-map:focus, a.dso-map:focus-visible,\nbutton.dso-map:focus,\nbutton.dso-map:focus-visible,\nlabel.dso-map:focus,\nlabel.dso-map:focus-visible {\n  outline-offset: -1px;\n}\na.dso-map:has(span.sr-only):has(dso-icon),\nbutton.dso-map:has(span.sr-only):has(dso-icon),\nlabel.dso-map:has(span.sr-only):has(dso-icon) {\n  padding: 8px;\n  min-inline-size: auto;\n  block-size: 40px;\n  inline-size: 40px;\n}\n\na.dso-primary {\n  text-decoration: none;\n}\na.dso-primary, a.dso-primary:visited {\n  color: #fff;\n}\na.dso-secondary {\n  text-decoration: none;\n}\na.dso-secondary, a.dso-secondary:visited {\n  color: #39870c;\n}\na.dso-secondary:hover, a.dso-secondary:visited:hover {\n  color: #275937;\n}\na.dso-tertiary {\n  text-decoration: none;\n}\na.dso-tertiary, a.dso-tertiary:visited {\n  color: #39870c;\n}\n\n.dso-primary + .dso-primary,\n.dso-primary + .dso-secondary,\n.dso-primary + .dso-tertiary,\n.dso-secondary + .dso-primary,\n.dso-secondary + .dso-secondary,\n.dso-secondary + .dso-tertiary,\n.dso-tertiary + .dso-primary,\n.dso-tertiary + .dso-secondary,\n.dso-tertiary + .dso-tertiary {\n  margin-inline-start: 16px;\n}\n\n:host {\n  background-color: #fff;\n  border: 1px solid #ccc;\n  inset-block-end: 0;\n  display: block;\n  font-family: Asap, sans-serif;\n  position: absolute;\n  inset-block-start: 0;\n  inset-inline-start: 100%;\n  transition: transform 300ms ease;\n  inline-size: 300px;\n}\n\n*,\n*::after,\n*::before {\n  box-sizing: border-box;\n}\n\n.sr-only {\n  position: absolute;\n  inline-size: 1px;\n  block-size: 1px;\n  padding: 0;\n  margin: -1px;\n  border: 0;\n  overflow: hidden;\n  clip-path: rect(0 0 0 0);\n}\n\n:host([open]) {\n  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3);\n  transform: translateX(-100%);\n}\n:host([open]) .toggle-visibility-button {\n  display: none;\n}\n:host([open]) .zoom-buttons {\n  inset-block-start: 16px;\n}\n\n.toggle-visibility-button {\n  position: absolute;\n  inset-inline-end: calc(100% + 56px);\n  inset-block-start: 16px;\n}\n\n.zoom-buttons {\n  position: absolute;\n  inset-inline-end: calc(100% + 16px);\n  inset-block-start: 16px;\n}\n\n.close-button {\n  padding: 0;\n  position: absolute;\n  inset-inline-end: 16px;\n  inset-block-start: 16px;\n}\n\nsection:not([hidden]) {\n  display: flex;\n  flex-direction: column;\n  block-size: 100%;\n}\n\nheader,\n.content {\n  padding: 16px;\n}\n\nheader {\n  border-block-end: 1px solid #ccc;\n  flex-grow: 0;\n  position: relative;\n}\nheader h2 {\n  color: #275937;\n  font-family: "Asap", sans-serif;\n  line-height: 1;\n  margin: 0;\n}\n\n@media screen and (max-width: 767px) {\n  button.toggle-visibility-button {\n    block-size: 40px;\n    margin-inline-end: 0;\n    min-inline-size: auto;\n    inset-inline-end: calc(100% + 16px);\n    inline-size: 40px;\n  }\n  button.toggle-visibility-button dso-icon {\n    margin-inline-end: 0;\n  }\n  button.toggle-visibility-button span {\n    position: absolute;\n    inline-size: 1px;\n    block-size: 1px;\n    padding: 0;\n    margin: -1px;\n    border: 0;\n    overflow: hidden;\n    clip-path: rect(0 0 0 0);\n  }\n  .zoom-buttons {\n    inset-block-start: 72px;\n  }\n}`;var i=undefined&&undefined.__classPrivateFieldGet||function(n,o,e,a){if(e==="a"&&!a)throw new TypeError("Private accessor was defined without a getter");if(typeof o==="function"?n!==o||!a:!o.has(n))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?a:e==="a"?a.call(n):a?a.value:o.get(n)};var l=undefined&&undefined.__classPrivateFieldSet||function(n,o,e,a,s){if(a==="m")throw new TypeError("Private method is not writable");if(a==="a"&&!s)throw new TypeError("Private accessor was defined without a setter");if(typeof o==="function"?n!==o||!s:!o.has(n))throw new TypeError("Cannot write private member to an object whose class did not declare it");return a==="a"?s.call(n,e):s?s.value=e:o.set(n,e),e};var c,b;const p=300;const f=class{constructor(e){n(this,e);this.dsoZoomIn=o(this,"dsoZoomIn",7);this.dsoZoomOut=o(this,"dsoZoomOut",7);this.dsoToggle=o(this,"dsoToggle",7);this.open=false;this.hideContent=!this.open;this.text=r((()=>this.host),t);c.set(this,void 0);b.set(this,void 0)}watchOpen(n){if(n){this.hideContent=false;setTimeout((()=>{var n;return(n=i(this,c,"f"))===null||n===void 0?void 0:n.focus()}),p)}else{setTimeout((()=>{var n;this.hideContent=true;(n=i(this,b,"f"))===null||n===void 0?void 0:n.focus()}),p)}}async toggleVisibility(n){this.open=!this.open;this.dsoToggle.emit({originalEvent:n,open:this.open})}render(){return e(a,{key:"722122cab93d6027100d73c0a062808c211fa86f"},e("button",{key:"9c2494d749d43f2027010f9bed93f61d8255fdc1",type:"button",id:"toggle-visibility-button",class:"dso-map toggle-visibility-button",onClick:n=>this.toggleVisibility(n),ref:n=>l(this,b,n,"f")},e("dso-icon",{key:"b4e4c503dfa2b35f2a1567c95e90d1f8622f9b11",icon:"layers"}),e("span",{key:"0e43af8aa45adba0719a4cfdc35189014fc1c60a"},this.text("layersButton"))),e("dso-button-group",{key:"08fdb4c7547322a9bd300303f8e0a8658c793218",class:"zoom-buttons",direction:"column"},e("button",{key:"ca9932bcaf47796eac7bceb314f5455c8accd40c",type:"button",class:"dso-map",onClick:n=>this.dsoZoomIn.emit(n),disabled:this.disableZoom==="in"||this.disableZoom==="both"},e("span",{key:"878448cf48eac59999e72d7fc6e5b54ac62cf518",class:"sr-only"},this.text("zoomIn")),e("dso-icon",{key:"e121e3eb29330509e3fe7fb56e9514b7a8ddd39b",icon:"plus"})),e("button",{key:"21f4a250c6f32ee8a9848e270cd01fcadab646ac",type:"button",class:"dso-map",onClick:n=>this.dsoZoomOut.emit(n),disabled:this.disableZoom==="out"||this.disableZoom==="both"},e("span",{key:"076869983f44e00f1cfc0a9a8f2ace5c8fb5cc28",class:"sr-only"},this.text("zoomOut")),e("dso-icon",{key:"c3b9436f36f15a2da4928f1ce315afbdd2ecbb2b",icon:"minus"}))),e("section",{key:"0d5fbd3b1a98ae9bd18acf92e33032b10e5f7033",hidden:this.hideContent},e("header",{key:"f1975ef9f36394fa6f6dee8b10a23f8c743a20ae"},e("h2",{key:"af03b33a9505f1bcb2dfce82316c7c977773ea06"},this.text("title")),e("button",{key:"c711ae9d9cd0de0958b10fa1bfbb9cca327b11c3",type:"button",class:"dso-tertiary close-button",onClick:n=>this.toggleVisibility(n),ref:n=>l(this,c,n,"f")},e("span",{key:"5cd14d3d0ae393c28e2cff37208d51391a1fb355",class:"sr-only"},this.text("hidePanel",{title:this.text("title")})),e("dso-icon",{key:"21d1c28b34ae17a3f5429c0179e3fd2159e98591",icon:"times"}))),e("dso-scrollable",{key:"15bc3d4ee0d7060b10ce197780829c7ab9c0838a"},e("div",{key:"7cdf7b9433a9b5ce96d4bf28823858bcf1f8b578",class:"content"},e("slot",{key:"b89f849740d209313f059e08893825031f3828ef"})))))}get host(){return s(this)}static get watchers(){return{open:["watchOpen"]}}};c=new WeakMap,b=new WeakMap;f.style=d();export{f as dso_map_controls};
-//# sourceMappingURL=p-ba9c436c.entry.js.map
+import{r as n,c as o,h as e,F as a,g as s}from"./p-WDDbscLp.js";import{i as r}from"./p-C0ZvZbHD.js";const t={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}}"}}};const d=()=>`button {\n  -webkit-appearance: button;\n  color: inherit;\n  cursor: pointer;\n  font: inherit;\n  font-family: inherit;\n  font-size: inherit;\n  line-height: inherit;\n  margin: 0;\n  overflow: visible;\n  text-transform: none;\n}\nbutton[disabled] {\n  cursor: default;\n}\nbutton::-moz-focus-inner {\n  border: 0;\n  padding: 0;\n}\n\na.dso-primary,\nbutton.dso-primary,\nlabel.dso-primary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\na.dso-primary:focus, a.dso-primary:focus-visible,\nbutton.dso-primary:focus,\nbutton.dso-primary:focus-visible,\nlabel.dso-primary:focus,\nlabel.dso-primary:focus-visible {\n  outline-offset: 2px;\n}\na.dso-primary:active,\nbutton.dso-primary:active,\nlabel.dso-primary:active {\n  outline: 0;\n}\na.dso-primary.extern::after, a.dso-primary.download::after,\nbutton.dso-primary.extern::after,\nbutton.dso-primary.download::after,\nlabel.dso-primary.extern::after,\nlabel.dso-primary.download::after {\n  content: "";\n  display: inline-block;\n  margin-inline-start: 8px;\n}\na.dso-primary,\nbutton.dso-primary,\nlabel.dso-primary {\n  background-color: var(--_dso-button-primary-background-color, #39870c);\n  border-color: var(--_dso-button-primary-border-color, #39870c);\n  color: var(--_dso-button-primary-color, #fff);\n}\na.dso-primary,\nbutton.dso-primary,\nlabel.dso-primary {\n  border-width: 1px;\n  border-style: solid;\n  border-radius: 4px;\n  line-height: 1.5;\n  min-inline-size: 56px;\n  padding-block: 11px;\n  padding-inline: 15px;\n}\na.dso-primary:hover,\nbutton.dso-primary:hover,\nlabel.dso-primary:hover {\n  background-color: var(--_dso-button-primary-hover-background-color, #275937);\n  border-color: var(--_dso-button-primary-hover-border-color, #275937);\n  color: var(--_dso-button-primary-hover-color, #fff);\n}\na.dso-primary:active,\nbutton.dso-primary:active,\nlabel.dso-primary:active {\n  background-color: var(--_dso-button-primary-active-background-color, #173521);\n  border-color: var(--_dso-button-primary-active-border-color, #173521);\n  color: var(--_dso-button-primary-active-color, #fff);\n}\na.dso-primary[disabled], a.dso-primary[disabled]:hover,\nbutton.dso-primary[disabled],\nbutton.dso-primary[disabled]:hover,\nlabel.dso-primary[disabled],\nlabel.dso-primary[disabled]:hover {\n  background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d);\n  border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d);\n  color: var(--_dso-button-primary-disabled-color, #fff);\n}\na.dso-primary.dso-small,\nbutton.dso-primary.dso-small,\nlabel.dso-primary.dso-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-primary.dso-small dso-icon,\nbutton.dso-primary.dso-small.extern::after,\nbutton.dso-primary.dso-small.download::after,\nbutton.dso-primary.dso-small.dso-spinner::before,\nlabel.dso-primary.dso-small dso-icon,\nlabel.dso-primary.dso-small.extern::after,\nlabel.dso-primary.dso-small.download::after,\nlabel.dso-primary.dso-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-primary.dso-small.dso-spinner-left::before,\nbutton.dso-primary.dso-small.dso-spinner-left::before,\nlabel.dso-primary.dso-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-primary.dso-small.dso-spinner-right::after,\nbutton.dso-primary.dso-small.dso-spinner-right::after,\nlabel.dso-primary.dso-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-primary.dso-extra-small,\nbutton.dso-primary.dso-extra-small,\nlabel.dso-primary.dso-extra-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-primary.dso-extra-small dso-icon,\nbutton.dso-primary.dso-extra-small.extern::after,\nbutton.dso-primary.dso-extra-small.download::after,\nbutton.dso-primary.dso-extra-small.dso-spinner::before,\nlabel.dso-primary.dso-extra-small dso-icon,\nlabel.dso-primary.dso-extra-small.extern::after,\nlabel.dso-primary.dso-extra-small.download::after,\nlabel.dso-primary.dso-extra-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-primary.dso-extra-small.dso-spinner-left::before,\nbutton.dso-primary.dso-extra-small.dso-spinner-left::before,\nlabel.dso-primary.dso-extra-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-primary.dso-extra-small.dso-spinner-right::after,\nbutton.dso-primary.dso-extra-small.dso-spinner-right::after,\nlabel.dso-primary.dso-extra-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-primary.dso-extra-small,\nbutton.dso-primary.dso-extra-small,\nlabel.dso-primary.dso-extra-small {\n  padding-block: 9px;\n}\na.dso-primary dso-icon:has(+ span:not(.sr-only)),\nbutton.dso-primary dso-icon:has(+ span:not(.sr-only)),\nlabel.dso-primary dso-icon:has(+ span:not(.sr-only)) {\n  margin-inline-start: -8px;\n}\na.dso-primary span:not(.sr-only) + dso-icon,\nbutton.dso-primary span:not(.sr-only) + dso-icon,\nlabel.dso-primary span:not(.sr-only) + dso-icon {\n  margin-inline-start: 8px;\n  margin-inline-end: -8px;\n}\na.dso-primary dso-icon + span:not(.sr-only),\nbutton.dso-primary dso-icon + span:not(.sr-only),\nlabel.dso-primary dso-icon + span:not(.sr-only) {\n  margin-inline-start: 8px;\n}\na.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled],\nbutton.dso-primary.dso-spinner-left[disabled],\nbutton.dso-primary.dso-spinner-right[disabled],\nlabel.dso-primary.dso-spinner-left[disabled],\nlabel.dso-primary.dso-spinner-right[disabled] {\n  background-color: #39870c;\n  border-color: #39870c;\n  color: #fff;\n}\na.dso-primary.dso-spinner-left::before,\nbutton.dso-primary.dso-spinner-left::before,\nlabel.dso-primary.dso-spinner-left::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-primary.dso-spinner-right::after,\nbutton.dso-primary.dso-spinner-right::after,\nlabel.dso-primary.dso-spinner-right::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-primary.download::after,\nbutton.dso-primary.download::after,\nlabel.dso-primary.download::after {\n  background: url("./di.svg#download-wit") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-primary.extern::after,\nbutton.dso-primary.extern::after,\nlabel.dso-primary.extern::after {\n  background: url("./di.svg#external-link-wit") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-secondary,\nbutton.dso-secondary,\nlabel.dso-secondary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\na.dso-secondary:focus, a.dso-secondary:focus-visible,\nbutton.dso-secondary:focus,\nbutton.dso-secondary:focus-visible,\nlabel.dso-secondary:focus,\nlabel.dso-secondary:focus-visible {\n  outline-offset: 2px;\n}\na.dso-secondary:active,\nbutton.dso-secondary:active,\nlabel.dso-secondary:active {\n  outline: 0;\n}\na.dso-secondary.extern::after, a.dso-secondary.download::after,\nbutton.dso-secondary.extern::after,\nbutton.dso-secondary.download::after,\nlabel.dso-secondary.extern::after,\nlabel.dso-secondary.download::after {\n  content: "";\n  display: inline-block;\n  margin-inline-start: 8px;\n}\na.dso-secondary,\nbutton.dso-secondary,\nlabel.dso-secondary {\n  background-color: var(--_dso-button-secondary-background-color, #fff);\n  border-color: var(--_dso-button-secondary-border-color, #39870c);\n  color: var(--_dso-button-secondary-color, #39870c);\n}\na.dso-secondary,\nbutton.dso-secondary,\nlabel.dso-secondary {\n  border-width: 1px;\n  border-style: solid;\n  border-radius: 4px;\n  line-height: 1.5;\n  min-inline-size: 56px;\n  padding-block: 11px;\n  padding-inline: 15px;\n}\na.dso-secondary:hover,\nbutton.dso-secondary:hover,\nlabel.dso-secondary:hover {\n  background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce);\n  border-color: var(--_dso-button-secondary-hover-border-color, #275937);\n  color: var(--_dso-button-secondary-hover-color, #275937);\n}\na.dso-secondary:active,\nbutton.dso-secondary:active,\nlabel.dso-secondary:active {\n  background-color: var(--_dso-button-secondary-active-background-color, #275937);\n  border-color: var(--_dso-button-secondary-active-border-color, #275937);\n  color: var(--_dso-button-secondary-active-color, #fff);\n}\na.dso-secondary[disabled], a.dso-secondary[disabled]:hover,\nbutton.dso-secondary[disabled],\nbutton.dso-secondary[disabled]:hover,\nlabel.dso-secondary[disabled],\nlabel.dso-secondary[disabled]:hover {\n  background-color: var(--_dso-button-secondary-disabled-background-color, #fff);\n  border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d);\n  color: var(--_dso-button-secondary-disabled-color, #afcf9d);\n}\na.dso-secondary.dso-small,\nbutton.dso-secondary.dso-small,\nlabel.dso-secondary.dso-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-secondary.dso-small dso-icon,\nbutton.dso-secondary.dso-small.extern::after,\nbutton.dso-secondary.dso-small.download::after,\nbutton.dso-secondary.dso-small.dso-spinner::before,\nlabel.dso-secondary.dso-small dso-icon,\nlabel.dso-secondary.dso-small.extern::after,\nlabel.dso-secondary.dso-small.download::after,\nlabel.dso-secondary.dso-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-secondary.dso-small.dso-spinner-left::before,\nbutton.dso-secondary.dso-small.dso-spinner-left::before,\nlabel.dso-secondary.dso-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-small.dso-spinner-right::after,\nbutton.dso-secondary.dso-small.dso-spinner-right::after,\nlabel.dso-secondary.dso-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-extra-small,\nbutton.dso-secondary.dso-extra-small,\nlabel.dso-secondary.dso-extra-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-secondary.dso-extra-small dso-icon,\nbutton.dso-secondary.dso-extra-small.extern::after,\nbutton.dso-secondary.dso-extra-small.download::after,\nbutton.dso-secondary.dso-extra-small.dso-spinner::before,\nlabel.dso-secondary.dso-extra-small dso-icon,\nlabel.dso-secondary.dso-extra-small.extern::after,\nlabel.dso-secondary.dso-extra-small.download::after,\nlabel.dso-secondary.dso-extra-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-secondary.dso-extra-small.dso-spinner-left::before,\nbutton.dso-secondary.dso-extra-small.dso-spinner-left::before,\nlabel.dso-secondary.dso-extra-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-extra-small.dso-spinner-right::after,\nbutton.dso-secondary.dso-extra-small.dso-spinner-right::after,\nlabel.dso-secondary.dso-extra-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-extra-small,\nbutton.dso-secondary.dso-extra-small,\nlabel.dso-secondary.dso-extra-small {\n  padding-block: 9px;\n}\na.dso-secondary dso-icon:has(+ span:not(.sr-only)),\nbutton.dso-secondary dso-icon:has(+ span:not(.sr-only)),\nlabel.dso-secondary dso-icon:has(+ span:not(.sr-only)) {\n  margin-inline-start: -8px;\n}\na.dso-secondary span:not(.sr-only) + dso-icon,\nbutton.dso-secondary span:not(.sr-only) + dso-icon,\nlabel.dso-secondary span:not(.sr-only) + dso-icon {\n  margin-inline-start: 8px;\n  margin-inline-end: -8px;\n}\na.dso-secondary dso-icon + span:not(.sr-only),\nbutton.dso-secondary dso-icon + span:not(.sr-only),\nlabel.dso-secondary dso-icon + span:not(.sr-only) {\n  margin-inline-start: 8px;\n}\na.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled],\nbutton.dso-secondary.dso-spinner-left[disabled],\nbutton.dso-secondary.dso-spinner-right[disabled],\nlabel.dso-secondary.dso-spinner-left[disabled],\nlabel.dso-secondary.dso-spinner-right[disabled] {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #39870c;\n}\na.dso-secondary.dso-spinner-left::before,\nbutton.dso-secondary.dso-spinner-left::before,\nlabel.dso-secondary.dso-spinner-left::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-secondary.dso-spinner-left:not([disabled]):hover::before,\nbutton.dso-secondary.dso-spinner-left:not([disabled]):hover::before,\nlabel.dso-secondary.dso-spinner-left:not([disabled]):hover::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before,\nbutton.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before,\nlabel.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.dso-spinner-right::after,\nbutton.dso-secondary.dso-spinner-right::after,\nlabel.dso-secondary.dso-spinner-right::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-secondary.dso-spinner-right:not([disabled]):hover::after,\nbutton.dso-secondary.dso-spinner-right:not([disabled]):hover::after,\nlabel.dso-secondary.dso-spinner-right:not([disabled]):hover::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after,\nbutton.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after,\nlabel.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-secondary.download::after,\nbutton.dso-secondary.download::after,\nlabel.dso-secondary.download::after {\n  background: url("./di.svg#download") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-secondary.download:hover::after,\nbutton.dso-secondary.download:hover::after,\nlabel.dso-secondary.download:hover::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#download-wit"));\n}\na.dso-secondary.download[disabled]::after,\nbutton.dso-secondary.download[disabled]::after,\nlabel.dso-secondary.download[disabled]::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40"));\n}\na.dso-secondary.extern::after,\nbutton.dso-secondary.extern::after,\nlabel.dso-secondary.extern::after {\n  background: url("./di.svg#external-link") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-secondary.extern:hover::after,\nbutton.dso-secondary.extern:hover::after,\nlabel.dso-secondary.extern:hover::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-wit"));\n}\na.dso-secondary.extern[disabled]::after,\nbutton.dso-secondary.extern[disabled]::after,\nlabel.dso-secondary.extern[disabled]::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40"));\n}\na.dso-tertiary,\nbutton.dso-tertiary,\nlabel.dso-tertiary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\na.dso-tertiary:focus, a.dso-tertiary:focus-visible,\nbutton.dso-tertiary:focus,\nbutton.dso-tertiary:focus-visible,\nlabel.dso-tertiary:focus,\nlabel.dso-tertiary:focus-visible {\n  outline-offset: 2px;\n}\na.dso-tertiary:active,\nbutton.dso-tertiary:active,\nlabel.dso-tertiary:active {\n  outline: 0;\n}\na.dso-tertiary.extern::after, a.dso-tertiary.download::after,\nbutton.dso-tertiary.extern::after,\nbutton.dso-tertiary.download::after,\nlabel.dso-tertiary.extern::after,\nlabel.dso-tertiary.download::after {\n  content: "";\n  display: inline-block;\n  margin-inline-start: 8px;\n}\na.dso-tertiary,\nbutton.dso-tertiary,\nlabel.dso-tertiary {\n  border: 0;\n  color: #39870c;\n  line-height: 1;\n  padding: 0;\n  background-color: transparent;\n}\na.dso-tertiary[disabled],\nbutton.dso-tertiary[disabled],\nlabel.dso-tertiary[disabled] {\n  color: #afcf9d;\n}\na.dso-tertiary[disabled].dso-spinner-left, a.dso-tertiary[disabled].dso-spinner-right,\nbutton.dso-tertiary[disabled].dso-spinner-left,\nbutton.dso-tertiary[disabled].dso-spinner-right,\nlabel.dso-tertiary[disabled].dso-spinner-left,\nlabel.dso-tertiary[disabled].dso-spinner-right {\n  color: #39870c;\n}\na.dso-tertiary:not([disabled]):hover,\nbutton.dso-tertiary:not([disabled]):hover,\nlabel.dso-tertiary:not([disabled]):hover {\n  color: #275937;\n  text-decoration: underline;\n  text-underline-position: under;\n}\na.dso-tertiary:not([disabled]):active,\nbutton.dso-tertiary:not([disabled]):active,\nlabel.dso-tertiary:not([disabled]):active {\n  color: #173521;\n}\na.dso-tertiary.dso-align,\nbutton.dso-tertiary.dso-align,\nlabel.dso-tertiary.dso-align {\n  line-height: calc(1.5em - 1px);\n  padding-block: 11px;\n  padding-inline: 0;\n  position: relative;\n}\na.dso-tertiary.dso-truncate,\nbutton.dso-tertiary.dso-truncate,\nlabel.dso-tertiary.dso-truncate {\n  max-inline-size: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\na.dso-tertiary.dso-spinner-left::before,\nbutton.dso-tertiary.dso-spinner-left::before,\nlabel.dso-tertiary.dso-spinner-left::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: middle;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-tertiary.dso-spinner-right::after,\nbutton.dso-tertiary.dso-spinner-right::after,\nlabel.dso-tertiary.dso-spinner-right::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: middle;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-tertiary dso-icon + span:not(.sr-only),\na.dso-tertiary span:not(.sr-only) + dso-icon,\nbutton.dso-tertiary dso-icon + span:not(.sr-only),\nbutton.dso-tertiary span:not(.sr-only) + dso-icon,\nlabel.dso-tertiary dso-icon + span:not(.sr-only),\nlabel.dso-tertiary span:not(.sr-only) + dso-icon {\n  margin-inline-start: 8px;\n}\na.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),\na.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),\na.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],\na.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right],\nbutton.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),\nbutton.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),\nbutton.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],\nbutton.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right],\nlabel.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),\nlabel.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),\nlabel.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],\nlabel.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] {\n  margin-inline-start: 0;\n}\na.dso-tertiary dso-icon,\na.dso-tertiary span,\nbutton.dso-tertiary dso-icon,\nbutton.dso-tertiary span,\nlabel.dso-tertiary dso-icon,\nlabel.dso-tertiary span {\n  vertical-align: middle;\n}\na.dso-tertiary.extern::after, a.dso-tertiary.download::after,\nbutton.dso-tertiary.extern::after,\nbutton.dso-tertiary.download::after,\nlabel.dso-tertiary.extern::after,\nlabel.dso-tertiary.download::after {\n  position: relative;\n  inset-block-start: -2px;\n}\na.dso-tertiary.download::after,\nbutton.dso-tertiary.download::after,\nlabel.dso-tertiary.download::after {\n  background: url("./di.svg#download") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-tertiary.download[disabled]::after,\nbutton.dso-tertiary.download[disabled]::after,\nlabel.dso-tertiary.download[disabled]::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40"));\n}\na.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):active::after,\nbutton.dso-tertiary.download:not([disabled]):hover::after,\nbutton.dso-tertiary.download:not([disabled]):active::after,\nlabel.dso-tertiary.download:not([disabled]):hover::after,\nlabel.dso-tertiary.download:not([disabled]):active::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen"));\n}\na.dso-tertiary.extern::after,\nbutton.dso-tertiary.extern::after,\nlabel.dso-tertiary.extern::after {\n  background: url("./di.svg#external-link") no-repeat center;\n  background-size: cover;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n}\na.dso-tertiary.extern[disabled]::after,\nbutton.dso-tertiary.extern[disabled]::after,\nlabel.dso-tertiary.extern[disabled]::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40"));\n}\na.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):active::after,\nbutton.dso-tertiary.extern:not([disabled]):hover::after,\nbutton.dso-tertiary.extern:not([disabled]):active::after,\nlabel.dso-tertiary.extern:not([disabled]):hover::after,\nlabel.dso-tertiary.extern:not([disabled]):active::after {\n  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen"));\n}\na.dso-map,\nbutton.dso-map,\nlabel.dso-map {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\na.dso-map:focus, a.dso-map:focus-visible,\nbutton.dso-map:focus,\nbutton.dso-map:focus-visible,\nlabel.dso-map:focus,\nlabel.dso-map:focus-visible {\n  outline-offset: 2px;\n}\na.dso-map:active,\nbutton.dso-map:active,\nlabel.dso-map:active {\n  outline: 0;\n}\na.dso-map,\nbutton.dso-map,\nlabel.dso-map {\n  background-color: var(--_dso-button-secondary-background-color, #fff);\n  border-color: var(--_dso-button-secondary-border-color, #39870c);\n  color: var(--_dso-button-secondary-color, #39870c);\n}\na.dso-map,\nbutton.dso-map,\nlabel.dso-map {\n  border-width: 1px;\n  border-style: solid;\n  border-radius: 4px;\n  line-height: 1.5;\n  min-inline-size: 56px;\n  padding-block: 11px;\n  padding-inline: 15px;\n}\na.dso-map:hover,\nbutton.dso-map:hover,\nlabel.dso-map:hover {\n  background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce);\n  border-color: var(--_dso-button-secondary-hover-border-color, #275937);\n  color: var(--_dso-button-secondary-hover-color, #275937);\n}\na.dso-map:active,\nbutton.dso-map:active,\nlabel.dso-map:active {\n  background-color: var(--_dso-button-secondary-active-background-color, #275937);\n  border-color: var(--_dso-button-secondary-active-border-color, #275937);\n  color: var(--_dso-button-secondary-active-color, #fff);\n}\na.dso-map[disabled], a.dso-map[disabled]:hover,\nbutton.dso-map[disabled],\nbutton.dso-map[disabled]:hover,\nlabel.dso-map[disabled],\nlabel.dso-map[disabled]:hover {\n  background-color: var(--_dso-button-secondary-disabled-background-color, #fff);\n  border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d);\n  color: var(--_dso-button-secondary-disabled-color, #afcf9d);\n}\na.dso-map.dso-small,\nbutton.dso-map.dso-small,\nlabel.dso-map.dso-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-map.dso-small dso-icon,\nbutton.dso-map.dso-small.extern::after,\nbutton.dso-map.dso-small.download::after,\nbutton.dso-map.dso-small.dso-spinner::before,\nlabel.dso-map.dso-small dso-icon,\nlabel.dso-map.dso-small.extern::after,\nlabel.dso-map.dso-small.download::after,\nlabel.dso-map.dso-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-map.dso-small.dso-spinner-left::before,\nbutton.dso-map.dso-small.dso-spinner-left::before,\nlabel.dso-map.dso-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-small.dso-spinner-right::after,\nbutton.dso-map.dso-small.dso-spinner-right::after,\nlabel.dso-map.dso-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-extra-small,\nbutton.dso-map.dso-extra-small,\nlabel.dso-map.dso-extra-small {\n  line-height: 1rem;\n}\na.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,\nbutton.dso-map.dso-extra-small dso-icon,\nbutton.dso-map.dso-extra-small.extern::after,\nbutton.dso-map.dso-extra-small.download::after,\nbutton.dso-map.dso-extra-small.dso-spinner::before,\nlabel.dso-map.dso-extra-small dso-icon,\nlabel.dso-map.dso-extra-small.extern::after,\nlabel.dso-map.dso-extra-small.download::after,\nlabel.dso-map.dso-extra-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\na.dso-map.dso-extra-small.dso-spinner-left::before,\nbutton.dso-map.dso-extra-small.dso-spinner-left::before,\nlabel.dso-map.dso-extra-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-extra-small.dso-spinner-right::after,\nbutton.dso-map.dso-extra-small.dso-spinner-right::after,\nlabel.dso-map.dso-extra-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-extra-small,\nbutton.dso-map.dso-extra-small,\nlabel.dso-map.dso-extra-small {\n  padding-block: 9px;\n}\na.dso-map dso-icon:has(+ span:not(.sr-only)),\nbutton.dso-map dso-icon:has(+ span:not(.sr-only)),\nlabel.dso-map dso-icon:has(+ span:not(.sr-only)) {\n  margin-inline-start: -8px;\n}\na.dso-map span:not(.sr-only) + dso-icon,\nbutton.dso-map span:not(.sr-only) + dso-icon,\nlabel.dso-map span:not(.sr-only) + dso-icon {\n  margin-inline-start: 8px;\n  margin-inline-end: -8px;\n}\na.dso-map dso-icon + span:not(.sr-only),\nbutton.dso-map dso-icon + span:not(.sr-only),\nlabel.dso-map dso-icon + span:not(.sr-only) {\n  margin-inline-start: 8px;\n}\na.dso-map.dso-spinner-left[disabled], a.dso-map.dso-spinner-right[disabled],\nbutton.dso-map.dso-spinner-left[disabled],\nbutton.dso-map.dso-spinner-right[disabled],\nlabel.dso-map.dso-spinner-left[disabled],\nlabel.dso-map.dso-spinner-right[disabled] {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #39870c;\n}\na.dso-map.dso-spinner-left::before,\nbutton.dso-map.dso-spinner-left::before,\nlabel.dso-map.dso-spinner-left::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-map.dso-spinner-left:not([disabled]):hover::before,\nbutton.dso-map.dso-spinner-left:not([disabled]):hover::before,\nlabel.dso-map.dso-spinner-left:not([disabled]):hover::before {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\na.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before,\nbutton.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before,\nlabel.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map.dso-spinner-right::after,\nbutton.dso-map.dso-spinner-right::after,\nlabel.dso-map.dso-spinner-right::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-map.dso-spinner-right:not([disabled]):hover::after,\nbutton.dso-map.dso-spinner-right:not([disabled]):hover::after,\nlabel.dso-map.dso-spinner-right:not([disabled]):hover::after {\n  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");\n  background-repeat: no-repeat;\n  content: "";\n  display: inline-block;\n  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\na.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after,\nbutton.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after,\nlabel.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\na.dso-map,\nbutton.dso-map,\nlabel.dso-map {\n  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);\n  border: 0;\n  font-weight: 600;\n  margin-inline-end: 16px;\n  padding-block: 8px;\n  padding-inline: 16px;\n  white-space: nowrap;\n}\na.dso-map:focus, a.dso-map:focus-visible,\nbutton.dso-map:focus,\nbutton.dso-map:focus-visible,\nlabel.dso-map:focus,\nlabel.dso-map:focus-visible {\n  outline-offset: -1px;\n}\na.dso-map:has(span.sr-only):has(dso-icon),\nbutton.dso-map:has(span.sr-only):has(dso-icon),\nlabel.dso-map:has(span.sr-only):has(dso-icon) {\n  padding: 8px;\n  min-inline-size: auto;\n  block-size: 40px;\n  inline-size: 40px;\n}\n\na.dso-primary {\n  text-decoration: none;\n}\na.dso-primary, a.dso-primary:visited {\n  color: #fff;\n}\na.dso-secondary {\n  text-decoration: none;\n}\na.dso-secondary, a.dso-secondary:visited {\n  color: #39870c;\n}\na.dso-secondary:hover, a.dso-secondary:visited:hover {\n  color: #275937;\n}\na.dso-tertiary {\n  text-decoration: none;\n}\na.dso-tertiary, a.dso-tertiary:visited {\n  color: #39870c;\n}\n\n.dso-primary + .dso-primary,\n.dso-primary + .dso-secondary,\n.dso-primary + .dso-tertiary,\n.dso-secondary + .dso-primary,\n.dso-secondary + .dso-secondary,\n.dso-secondary + .dso-tertiary,\n.dso-tertiary + .dso-primary,\n.dso-tertiary + .dso-secondary,\n.dso-tertiary + .dso-tertiary {\n  margin-inline-start: 16px;\n}\n\n:host {\n  background-color: #fff;\n  border: 1px solid #ccc;\n  inset-block-end: 0;\n  display: block;\n  font-family: Asap, sans-serif;\n  position: absolute;\n  inset-block-start: 0;\n  inset-inline-start: 100%;\n  transition: transform 300ms ease;\n  inline-size: 300px;\n}\n\n*,\n*::after,\n*::before {\n  box-sizing: border-box;\n}\n\n.sr-only {\n  position: absolute;\n  inline-size: 1px;\n  block-size: 1px;\n  padding: 0;\n  margin: -1px;\n  border: 0;\n  overflow: hidden;\n  clip-path: rect(0 0 0 0);\n}\n\n:host([open]) {\n  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3);\n  transform: translateX(-100%);\n}\n:host([open]) .toggle-visibility-button {\n  display: none;\n}\n:host([open]) .zoom-buttons {\n  inset-block-start: 16px;\n}\n\n.toggle-visibility-button {\n  position: absolute;\n  inset-inline-end: calc(100% + 56px);\n  inset-block-start: 16px;\n}\n\n.zoom-buttons {\n  position: absolute;\n  inset-inline-end: calc(100% + 16px);\n  inset-block-start: 16px;\n}\n\n.close-button {\n  padding: 0;\n  position: absolute;\n  inset-inline-end: 16px;\n  inset-block-start: 16px;\n}\n\nsection:not([hidden]) {\n  display: flex;\n  flex-direction: column;\n  block-size: 100%;\n}\n\nheader,\n.content {\n  padding: 16px;\n}\n\nheader {\n  border-block-end: 1px solid #ccc;\n  flex-grow: 0;\n  position: relative;\n}\nheader h2 {\n  color: #275937;\n  font-family: "Asap", sans-serif;\n  line-height: 1;\n  margin: 0;\n}\n\n@media screen and (max-width: 767px) {\n  button.toggle-visibility-button {\n    block-size: 40px;\n    margin-inline-end: 0;\n    min-inline-size: auto;\n    inset-inline-end: calc(100% + 16px);\n    inline-size: 40px;\n  }\n  button.toggle-visibility-button dso-icon {\n    margin-inline-end: 0;\n  }\n  button.toggle-visibility-button span {\n    position: absolute;\n    inline-size: 1px;\n    block-size: 1px;\n    padding: 0;\n    margin: -1px;\n    border: 0;\n    overflow: hidden;\n    clip-path: rect(0 0 0 0);\n  }\n  .zoom-buttons {\n    inset-block-start: 72px;\n  }\n}`;var i=undefined&&undefined.__classPrivateFieldGet||function(n,o,e,a){if(e==="a"&&!a)throw new TypeError("Private accessor was defined without a getter");if(typeof o==="function"?n!==o||!a:!o.has(n))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?a:e==="a"?a.call(n):a?a.value:o.get(n)};var l=undefined&&undefined.__classPrivateFieldSet||function(n,o,e,a,s){if(a==="m")throw new TypeError("Private method is not writable");if(a==="a"&&!s)throw new TypeError("Private accessor was defined without a setter");if(typeof o==="function"?n!==o||!s:!o.has(n))throw new TypeError("Cannot write private member to an object whose class did not declare it");return a==="a"?s.call(n,e):s?s.value=e:o.set(n,e),e};var c,b;const p=300;const f=class{constructor(e){n(this,e);this.dsoZoomIn=o(this,"dsoZoomIn",7);this.dsoZoomOut=o(this,"dsoZoomOut",7);this.dsoToggle=o(this,"dsoToggle",7);this.open=false;this.hideContent=!this.open;this.text=r((()=>this.host),t);c.set(this,void 0);b.set(this,void 0)}watchOpen(n){if(n){this.hideContent=false;setTimeout((()=>{var n;return(n=i(this,c,"f"))===null||n===void 0?void 0:n.focus()}),p)}else{setTimeout((()=>{var n;this.hideContent=true;(n=i(this,b,"f"))===null||n===void 0?void 0:n.focus()}),p)}}async toggleVisibility(n){this.open=!this.open;this.dsoToggle.emit({originalEvent:n,open:this.open})}render(){return e(a,{key:"524335d692fdfbaaf7060919b018350cfb02227a"},e("button",{key:"73236dc19d7a737a433c63c12bc78c74429346c4",type:"button",id:"toggle-visibility-button",class:"dso-map toggle-visibility-button",onClick:n=>this.toggleVisibility(n),ref:n=>l(this,b,n,"f")},e("dso-icon",{key:"13048c13b65e68b8c9b4f06720997d5464a93c08",icon:"layers"}),e("span",{key:"5b530075e4c3424ab712ebf3eb2676e8529282f8"},this.text("layersButton"))),e("dso-button-group",{key:"6410b36883686d32a44257e49aa0335371513c14",class:"zoom-buttons",direction:"column"},e("button",{key:"555763ec8a3f18e25f154e96cd2f0e798e5cf9fd",type:"button",class:"dso-map",onClick:n=>this.dsoZoomIn.emit(n),disabled:this.disableZoom==="in"||this.disableZoom==="both"},e("span",{key:"c64e310a910b8152a5db1380931663efe14e0f40",class:"sr-only"},this.text("zoomIn")),e("dso-icon",{key:"bd16af8e69a17ea43c99acc806ec5849334c6fdf",icon:"plus"})),e("button",{key:"8b7250ddd0dda081989ac4ee999482cd53fc472f",type:"button",class:"dso-map",onClick:n=>this.dsoZoomOut.emit(n),disabled:this.disableZoom==="out"||this.disableZoom==="both"},e("span",{key:"c3eb515a6ceee241639e7d4be170d7a624ad7cdc",class:"sr-only"},this.text("zoomOut")),e("dso-icon",{key:"2c9b0796853d8acdf69037bcc0f27c1a6553cdbc",icon:"minus"}))),e("section",{key:"1b673eb2e40686c4760cbb8a71327e8e52151478",hidden:this.hideContent},e("header",{key:"6419f5fe83c202e1110fae27339b8c1fbd31b116"},e("h2",{key:"cd7186cae05c68a8ef4340ef10ac0ef4010039d4"},this.text("title")),e("button",{key:"422c6d0b671b8b9618d5a44b144a16bedf243d8f",type:"button",class:"dso-tertiary close-button",onClick:n=>this.toggleVisibility(n),ref:n=>l(this,c,n,"f")},e("span",{key:"5ad7d9a46c1b6e92c518a6579c256b3bf5bc500a",class:"sr-only"},this.text("hidePanel",{title:this.text("title")})),e("dso-icon",{key:"690f0dff0598dad4a293a789fc1a0169467c8c43",icon:"times"}))),e("dso-scrollable",{key:"47eaf3c3a078bd6a986a760674ec436450f9737f"},e("div",{key:"41b06e6b50c1e8f09c6ac3ae322c709bf2f8dc10",class:"content"},e("slot",{key:"ed5514912e3aea637b67a2caf4b96d955dc75ab9"})))))}get host(){return s(this)}static get watchers(){return{open:["watchOpen"]}}};c=new WeakMap,b=new WeakMap;f.style=d();export{f as dso_map_controls};
+//# sourceMappingURL=p-30dd509e.entry.js.map