@dso-toolkit/core 45.0.1 → 45.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (192) hide show
  1. package/dist/cjs/dso-accordion-section.cjs.entry.js +110 -0
  2. package/dist/cjs/dso-accordion.cjs.entry.js +297 -0
  3. package/dist/cjs/dso-alert.cjs.entry.js +3 -3
  4. package/dist/cjs/dso-attachments-counter.cjs.entry.js +3 -3
  5. package/dist/cjs/dso-autosuggest.cjs.entry.js +1 -1
  6. package/dist/cjs/dso-badge.cjs.entry.js +1 -1
  7. package/dist/cjs/dso-banner.cjs.entry.js +2 -2
  8. package/dist/cjs/dso-date-picker.cjs.entry.js +2 -2
  9. package/dist/cjs/dso-dropdown-menu.cjs.entry.js +3 -3
  10. package/dist/cjs/dso-header.cjs.entry.js +6 -6
  11. package/dist/cjs/dso-helpcenter-panel.cjs.entry.js +59 -3
  12. package/dist/cjs/dso-highlight-box.cjs.entry.js +2 -2
  13. package/dist/cjs/dso-icon.cjs.entry.js +2 -2
  14. package/dist/cjs/dso-image-overlay.cjs.entry.js +11 -5
  15. package/dist/cjs/dso-info-button.cjs.entry.js +4 -3
  16. package/dist/cjs/dso-info_2.cjs.entry.js +3 -3
  17. package/dist/cjs/dso-label.cjs.entry.js +1 -1
  18. package/dist/cjs/dso-map-base-layers.cjs.entry.js +1 -1
  19. package/dist/cjs/dso-map-controls.cjs.entry.js +2 -2
  20. package/dist/cjs/dso-map-overlays.cjs.entry.js +1 -1
  21. package/dist/cjs/dso-ozon-content.cjs.entry.js +77 -16
  22. package/dist/cjs/dso-pagination.cjs.entry.js +99 -7
  23. package/dist/cjs/dso-progress-bar.cjs.entry.js +2 -2
  24. package/dist/cjs/dso-progress-indicator.cjs.entry.js +1 -1
  25. package/dist/cjs/dso-responsive-element.cjs.entry.js +6 -1
  26. package/dist/cjs/dso-table.cjs.entry.js +89 -0
  27. package/dist/cjs/dso-toggletip.cjs.entry.js +2 -2
  28. package/dist/cjs/dso-toolkit.cjs.js +2 -2
  29. package/dist/cjs/dso-tooltip.cjs.entry.js +1 -1
  30. package/dist/cjs/dso-tree-view.cjs.entry.js +1 -1
  31. package/dist/cjs/dso-viewer-grid.cjs.entry.js +11 -5
  32. package/dist/cjs/{focus-trap.esm-a85643b0.js → focus-trap.esm-e2addb10.js} +28 -11
  33. package/dist/cjs/{index-0a7c679a.js → index-4066351a.js} +7 -0
  34. package/dist/cjs/{index.esm-3520a2a6.js → index.esm-50325ea2.js} +110 -12
  35. package/dist/cjs/loader.cjs.js +2 -2
  36. package/dist/collection/collection-manifest.json +3 -0
  37. package/dist/collection/components/accordion/accordion.css +9 -0
  38. package/dist/collection/components/accordion/accordion.interfaces.js +1 -0
  39. package/dist/collection/components/accordion/accordion.js +260 -0
  40. package/dist/collection/components/accordion/accordion.template.js +26 -0
  41. package/dist/collection/components/accordion/components/accordion-section.css +221 -0
  42. package/dist/collection/components/accordion/components/accordion-section.js +292 -0
  43. package/dist/collection/components/alert/alert.css +14 -51
  44. package/dist/collection/components/alert/alert.js +1 -0
  45. package/dist/collection/components/attachments-counter/attachments-counter.css +0 -12
  46. package/dist/collection/components/attachments-counter/attachments-counter.js +2 -1
  47. package/dist/collection/components/banner/banner.css +0 -4
  48. package/dist/collection/components/date-picker/date-picker.css +2 -2
  49. package/dist/collection/components/dropdown-menu/dropdown-menu.css +0 -7
  50. package/dist/collection/components/header/header.css +38 -390
  51. package/dist/collection/components/header/header.js +22 -24
  52. package/dist/collection/components/header/header.template.js +1 -1
  53. package/dist/collection/components/helpcenter-panel/helpcenter-panel.css +21 -104
  54. package/dist/collection/components/helpcenter-panel/helpcenter-panel.js +71 -5
  55. package/dist/collection/components/highlight-box/highlight-box.css +1 -3
  56. package/dist/collection/components/image-overlay/image-overlay.css +37 -1134
  57. package/dist/collection/components/image-overlay/image-overlay.js +13 -3
  58. package/dist/collection/components/image-overlay/image-overlay.template.js +9 -1
  59. package/dist/collection/components/info/info.css +19 -1070
  60. package/dist/collection/components/info/info.js +1 -0
  61. package/dist/collection/components/info-button/info-button.css +8 -17
  62. package/dist/collection/components/info-button/info-button.js +9 -3
  63. package/dist/collection/components/map-controls/map-controls.css +20 -1172
  64. package/dist/collection/components/ozon-content/nodes/figuur.node.js +41 -6
  65. package/dist/collection/components/ozon-content/nodes/lijst.node.js +25 -0
  66. package/dist/collection/components/ozon-content/nodes/table.node/table.node.js +8 -7
  67. package/dist/collection/components/ozon-content/ozon-content-mapper.js +2 -0
  68. package/dist/collection/components/ozon-content/ozon-content.css +39 -49
  69. package/dist/collection/components/pagination/pagination.css +1 -0
  70. package/dist/collection/components/pagination/pagination.js +122 -14
  71. package/dist/collection/components/progress-bar/progress-bar.css +1 -1
  72. package/dist/collection/components/responsive-element/responsive-element.interfaces.js +1 -0
  73. package/dist/collection/components/responsive-element/responsive-element.js +48 -1
  74. package/dist/collection/components/responsive-element/responsive-element.template.js +4 -2
  75. package/dist/collection/components/table/table.css +296 -0
  76. package/dist/collection/components/table/table.interfaces.js +1 -0
  77. package/dist/collection/components/table/table.js +146 -0
  78. package/dist/collection/components/table/table.template.js +26 -0
  79. package/dist/collection/components/toggletip/toggletip.css +4 -0
  80. package/dist/collection/components/viewer-grid/viewer-grid.css +34 -1300
  81. package/dist/collection/components/viewer-grid/viewer-grid.js +12 -1
  82. package/dist/custom-elements/index.d.ts +18 -0
  83. package/dist/custom-elements/index.js +2052 -1230
  84. package/dist/dso-toolkit/dso-toolkit.esm.js +1 -1
  85. package/dist/dso-toolkit/p-02b2e01c.entry.js +1 -0
  86. package/dist/dso-toolkit/{p-d780f9ff.entry.js → p-05a9e206.entry.js} +1 -1
  87. package/dist/dso-toolkit/p-1a19ce42.entry.js +1 -0
  88. package/dist/dso-toolkit/p-22c35db5.js +5 -0
  89. package/dist/dso-toolkit/{p-361528b4.entry.js → p-2e74485e.entry.js} +1 -1
  90. package/dist/dso-toolkit/p-2f6b1092.entry.js +1 -0
  91. package/dist/dso-toolkit/{p-bf4d6f63.entry.js → p-3381c859.entry.js} +1 -1
  92. package/dist/dso-toolkit/{p-3799366e.entry.js → p-37a34037.entry.js} +1 -1
  93. package/dist/dso-toolkit/p-383227b9.entry.js +1 -0
  94. package/dist/dso-toolkit/p-42450cfe.js +1 -0
  95. package/dist/dso-toolkit/p-4c44d27c.entry.js +1 -0
  96. package/dist/dso-toolkit/{p-91b6a181.entry.js → p-4fd140e9.entry.js} +1 -1
  97. package/dist/dso-toolkit/p-53c7bf4f.entry.js +1 -0
  98. package/dist/dso-toolkit/p-662b7663.entry.js +1 -0
  99. package/dist/dso-toolkit/{p-d60876c2.entry.js → p-67b11174.entry.js} +1 -1
  100. package/dist/dso-toolkit/{p-375a2523.entry.js → p-6a414479.entry.js} +1 -1
  101. package/dist/dso-toolkit/{p-e4bcafc4.entry.js → p-6cac0292.entry.js} +1 -1
  102. package/dist/dso-toolkit/p-7213783b.entry.js +1 -0
  103. package/dist/dso-toolkit/p-83de460b.entry.js +1 -0
  104. package/dist/dso-toolkit/p-9aaadf4f.entry.js +1 -0
  105. package/dist/dso-toolkit/p-a5a5b24b.entry.js +1 -0
  106. package/dist/dso-toolkit/p-a9b0a83e.entry.js +1 -0
  107. package/dist/dso-toolkit/p-ac0c0eee.entry.js +1 -0
  108. package/dist/dso-toolkit/p-b6afe104.entry.js +1 -0
  109. package/dist/dso-toolkit/{p-590cbab6.entry.js → p-b9531adb.entry.js} +1 -1
  110. package/dist/dso-toolkit/{p-6bc71e48.entry.js → p-d2255268.entry.js} +1 -1
  111. package/dist/dso-toolkit/p-de50f5f1.entry.js +1 -0
  112. package/dist/dso-toolkit/p-e16b5d71.entry.js +1 -0
  113. package/dist/dso-toolkit/p-ea1d4c81.entry.js +1 -0
  114. package/dist/dso-toolkit/p-eb326df8.entry.js +1 -0
  115. package/dist/dso-toolkit/{p-25f8dbc6.entry.js → p-ec3b8800.entry.js} +1 -1
  116. package/dist/dso-toolkit/{p-16635f4b.entry.js → p-f1b5baf9.entry.js} +1 -1
  117. package/dist/dso-toolkit/p-f8b023c4.js +5 -0
  118. package/dist/esm/dso-accordion-section.entry.js +106 -0
  119. package/dist/esm/dso-accordion.entry.js +293 -0
  120. package/dist/esm/dso-alert.entry.js +3 -3
  121. package/dist/esm/dso-attachments-counter.entry.js +3 -3
  122. package/dist/esm/dso-autosuggest.entry.js +1 -1
  123. package/dist/esm/dso-badge.entry.js +1 -1
  124. package/dist/esm/dso-banner.entry.js +2 -2
  125. package/dist/esm/dso-date-picker.entry.js +2 -2
  126. package/dist/esm/dso-dropdown-menu.entry.js +3 -3
  127. package/dist/esm/dso-header.entry.js +6 -6
  128. package/dist/esm/dso-helpcenter-panel.entry.js +59 -3
  129. package/dist/esm/dso-highlight-box.entry.js +2 -2
  130. package/dist/esm/dso-icon.entry.js +2 -2
  131. package/dist/esm/dso-image-overlay.entry.js +11 -5
  132. package/dist/esm/dso-info-button.entry.js +4 -3
  133. package/dist/esm/dso-info_2.entry.js +3 -3
  134. package/dist/esm/dso-label.entry.js +1 -1
  135. package/dist/esm/dso-map-base-layers.entry.js +1 -1
  136. package/dist/esm/dso-map-controls.entry.js +2 -2
  137. package/dist/esm/dso-map-overlays.entry.js +1 -1
  138. package/dist/esm/dso-ozon-content.entry.js +77 -16
  139. package/dist/esm/dso-pagination.entry.js +99 -7
  140. package/dist/esm/dso-progress-bar.entry.js +2 -2
  141. package/dist/esm/dso-progress-indicator.entry.js +1 -1
  142. package/dist/esm/dso-responsive-element.entry.js +6 -1
  143. package/dist/esm/dso-table.entry.js +85 -0
  144. package/dist/esm/dso-toggletip.entry.js +2 -2
  145. package/dist/esm/dso-toolkit.js +2 -2
  146. package/dist/esm/dso-tooltip.entry.js +1 -1
  147. package/dist/esm/dso-tree-view.entry.js +1 -1
  148. package/dist/esm/dso-viewer-grid.entry.js +11 -5
  149. package/dist/esm/{focus-trap.esm-a01ad6c9.js → focus-trap.esm-e3b5bde3.js} +28 -11
  150. package/dist/esm/{index-1602fde1.js → index-771c1291.js} +7 -1
  151. package/dist/esm/{index.esm-45465af7.js → index.esm-4510c39e.js} +110 -12
  152. package/dist/esm/loader.js +2 -2
  153. package/dist/types/components/accordion/accordion.d.ts +32 -0
  154. package/dist/types/components/accordion/accordion.interfaces.d.ts +20 -0
  155. package/dist/types/components/accordion/accordion.template.d.ts +2 -0
  156. package/dist/types/components/accordion/components/accordion-section.d.ts +25 -0
  157. package/dist/types/components/helpcenter-panel/helpcenter-panel.d.ts +11 -0
  158. package/dist/types/components/image-overlay/image-overlay.d.ts +3 -0
  159. package/dist/types/components/info-button/info-button.d.ts +1 -0
  160. package/dist/types/components/ozon-content/nodes/figuur.node.d.ts +4 -1
  161. package/dist/types/components/ozon-content/nodes/lijst.node.d.ts +6 -0
  162. package/dist/types/components/pagination/pagination.d.ts +15 -0
  163. package/dist/types/components/responsive-element/responsive-element.d.ts +5 -2
  164. package/dist/types/components/responsive-element/responsive-element.interfaces.d.ts +5 -0
  165. package/dist/types/components/responsive-element/responsive-element.template.d.ts +1 -1
  166. package/dist/types/components/table/table.d.ts +26 -0
  167. package/dist/types/components/table/table.interfaces.d.ts +3 -0
  168. package/dist/types/components/table/table.template.d.ts +2 -0
  169. package/dist/types/components.d.ts +128 -0
  170. package/package.json +4 -3
  171. package/readme.md +0 -7
  172. package/dist/collection/icon/dso-icon-sass-function.js +0 -42
  173. package/dist/dso-toolkit/dso-toolkit.css +0 -1
  174. package/dist/dso-toolkit/p-02272301.entry.js +0 -1
  175. package/dist/dso-toolkit/p-10a6db1a.entry.js +0 -1
  176. package/dist/dso-toolkit/p-131d54e3.js +0 -5
  177. package/dist/dso-toolkit/p-1450f113.entry.js +0 -1
  178. package/dist/dso-toolkit/p-15d0f2eb.entry.js +0 -1
  179. package/dist/dso-toolkit/p-3b5f957e.entry.js +0 -1
  180. package/dist/dso-toolkit/p-49938275.entry.js +0 -1
  181. package/dist/dso-toolkit/p-5a56d726.entry.js +0 -1
  182. package/dist/dso-toolkit/p-5e5fbd41.js +0 -5
  183. package/dist/dso-toolkit/p-68d49733.entry.js +0 -1
  184. package/dist/dso-toolkit/p-7b716383.entry.js +0 -1
  185. package/dist/dso-toolkit/p-b95bc2c7.entry.js +0 -1
  186. package/dist/dso-toolkit/p-c1070a58.entry.js +0 -1
  187. package/dist/dso-toolkit/p-c62606a3.js +0 -1
  188. package/dist/dso-toolkit/p-e7888d49.entry.js +0 -1
  189. package/dist/dso-toolkit/p-eb17d45e.entry.js +0 -1
  190. package/dist/dso-toolkit/p-f726111e.entry.js +0 -1
  191. package/dist/dso-toolkit/p-fd8a8509.entry.js +0 -1
  192. package/dist/types/icon/dso-icon-sass-function.d.ts +0 -4
@@ -5,6 +5,7 @@
5
5
  * It contains typing information for all components that exist in this project.
6
6
  */
7
7
  import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
8
+ import { AccordionHeading, AccordionInternalState, AccordionSectionState, AccordionSectionToggleEvent, AccordionVariant } from "./components/accordion/accordion.interfaces";
8
9
  import { Suggestion } from "./components/autosuggest/autosuggest";
9
10
  import { DsoDatePickerChangeEvent, DsoDatePickerDirection, DsoDatePickerFocusEvent, DsoDatePickerKeyboardEvent } from "./components/date-picker/date-picker";
10
11
  import { HeaderClickEvent, HeaderClickMenuItemEvent, HeaderMenuItem } from "./components/header/header.interfaces";
@@ -13,10 +14,54 @@ import { BaseLayer, BaseLayerChangeEvent } from "./components/map-base-layers/ma
13
14
  import { Overlay, OverlayChangeEvent } from "./components/map-overlays/map-overlays.interfaces";
14
15
  import { OzonContentAnchorClick, OzonContentClick } from "./components/ozon-content/ozon-content.interfaces";
15
16
  import { PaginationSelectPageEvent } from "./components/pagination/pagination.interfaces";
17
+ import { ResponsiveElementSize } from "./components/responsive-element/responsive-element.interfaces";
16
18
  import { SelectableChangeEvent } from "./components/selectable/selectable";
17
19
  import { TreeViewItem, TreeViewPointerEvent } from "./components/tree-view/tree-view.interfaces";
18
20
  import { FilterpanelEvent, MainSize, ViewerGridChangeSizeEvent } from "./components/viewer-grid/viewer-grid";
19
21
  export namespace Components {
22
+ interface DsoAccordion {
23
+ /**
24
+ * Allows multiple sections to be open at the same time.
25
+ */
26
+ "allowMultipleOpen": boolean;
27
+ /**
28
+ * Closes all sections belonging to this accordion.
29
+ */
30
+ "closeOpenSections": () => Promise<void>;
31
+ "getState": () => Promise<AccordionInternalState>;
32
+ /**
33
+ * Places the chevron at the opposite side. Note: this mode does not display `state`, `attachmentCount` or `status` props on child `<dso-accordion-section>` elements
34
+ */
35
+ "reverseAlign": boolean;
36
+ /**
37
+ * Toggle a section. Pass the `<dso-accordion-section>` element or the index of the section.
38
+ */
39
+ "toggleSection": (sectionElement: HTMLElement | number, event?: MouseEvent | undefined) => Promise<void>;
40
+ "variant"?: AccordionVariant;
41
+ }
42
+ interface DsoAccordionSection {
43
+ /**
44
+ * `attachmentCount` takes precedence over `icon`
45
+ */
46
+ "attachmentCount"?: number;
47
+ "handleTitle"?: string;
48
+ /**
49
+ * When set the handle will render as a `<a>`. When undefined it renders as a `<button>`
50
+ */
51
+ "handleUrl"?: string;
52
+ "heading": AccordionHeading;
53
+ "icon"?: string;
54
+ "open": boolean;
55
+ /**
56
+ * `state` takes precedence over `attachmentCount` and `icon`
57
+ */
58
+ "state"?: AccordionSectionState;
59
+ "status"?: string;
60
+ /**
61
+ * Toggle this section
62
+ */
63
+ "toggleSection": () => Promise<void>;
64
+ }
20
65
  interface DsoAlert {
21
66
  /**
22
67
  * Whether or not to show the role attribute with value "alert". To control the tooltip add the `role-alert` attribute.
@@ -233,6 +278,7 @@ export namespace Components {
233
278
  "size"?: 'small' | 'medium' | 'large';
234
279
  }
235
280
  interface DsoResponsiveElement {
281
+ "getSize": () => Promise<ResponsiveElementSize>;
236
282
  }
237
283
  interface DsoSelectable {
238
284
  "checked"?: boolean;
@@ -248,6 +294,16 @@ export namespace Components {
248
294
  "type": 'checkbox' | 'radio';
249
295
  "value": string;
250
296
  }
297
+ interface DsoTable {
298
+ /**
299
+ * Indicates whether the table is currently horizontally scrollable
300
+ */
301
+ "isResponsive": boolean;
302
+ /**
303
+ * Prevents the table being opened in a modal.
304
+ */
305
+ "noModal": boolean;
306
+ }
251
307
  interface DsoToggletip {
252
308
  "label": string;
253
309
  "position": "top" | "right" | "bottom" | "left";
@@ -318,6 +374,18 @@ export namespace Components {
318
374
  }
319
375
  }
320
376
  declare global {
377
+ interface HTMLDsoAccordionElement extends Components.DsoAccordion, HTMLStencilElement {
378
+ }
379
+ var HTMLDsoAccordionElement: {
380
+ prototype: HTMLDsoAccordionElement;
381
+ new (): HTMLDsoAccordionElement;
382
+ };
383
+ interface HTMLDsoAccordionSectionElement extends Components.DsoAccordionSection, HTMLStencilElement {
384
+ }
385
+ var HTMLDsoAccordionSectionElement: {
386
+ prototype: HTMLDsoAccordionSectionElement;
387
+ new (): HTMLDsoAccordionSectionElement;
388
+ };
321
389
  interface HTMLDsoAlertElement extends Components.DsoAlert, HTMLStencilElement {
322
390
  }
323
391
  var HTMLDsoAlertElement: {
@@ -462,6 +530,12 @@ declare global {
462
530
  prototype: HTMLDsoSelectableElement;
463
531
  new (): HTMLDsoSelectableElement;
464
532
  };
533
+ interface HTMLDsoTableElement extends Components.DsoTable, HTMLStencilElement {
534
+ }
535
+ var HTMLDsoTableElement: {
536
+ prototype: HTMLDsoTableElement;
537
+ new (): HTMLDsoTableElement;
538
+ };
465
539
  interface HTMLDsoToggletipElement extends Components.DsoToggletip, HTMLStencilElement {
466
540
  }
467
541
  var HTMLDsoToggletipElement: {
@@ -487,6 +561,8 @@ declare global {
487
561
  new (): HTMLDsoViewerGridElement;
488
562
  };
489
563
  interface HTMLElementTagNameMap {
564
+ "dso-accordion": HTMLDsoAccordionElement;
565
+ "dso-accordion-section": HTMLDsoAccordionSectionElement;
490
566
  "dso-alert": HTMLDsoAlertElement;
491
567
  "dso-attachments-counter": HTMLDsoAttachmentsCounterElement;
492
568
  "dso-autosuggest": HTMLDsoAutosuggestElement;
@@ -511,6 +587,7 @@ declare global {
511
587
  "dso-progress-indicator": HTMLDsoProgressIndicatorElement;
512
588
  "dso-responsive-element": HTMLDsoResponsiveElementElement;
513
589
  "dso-selectable": HTMLDsoSelectableElement;
590
+ "dso-table": HTMLDsoTableElement;
514
591
  "dso-toggletip": HTMLDsoToggletipElement;
515
592
  "dso-tooltip": HTMLDsoTooltipElement;
516
593
  "dso-tree-view": HTMLDsoTreeViewElement;
@@ -518,6 +595,40 @@ declare global {
518
595
  }
519
596
  }
520
597
  declare namespace LocalJSX {
598
+ interface DsoAccordion {
599
+ /**
600
+ * Allows multiple sections to be open at the same time.
601
+ */
602
+ "allowMultipleOpen"?: boolean;
603
+ /**
604
+ * Emitted when a section is toggled. `event.detail.originalEvent` contains the original `MouseEvent` when the section is toggled by clicking on the header `event.detail.section` contains the toggled section and its new opened value.\ `event.detail.sections` contains all `<dso-accordion-section>` elements belonging to this accordion.
605
+ */
606
+ "onDsoToggleSection"?: (event: CustomEvent<AccordionSectionToggleEvent>) => void;
607
+ /**
608
+ * Places the chevron at the opposite side. Note: this mode does not display `state`, `attachmentCount` or `status` props on child `<dso-accordion-section>` elements
609
+ */
610
+ "reverseAlign"?: boolean;
611
+ "variant"?: AccordionVariant;
612
+ }
613
+ interface DsoAccordionSection {
614
+ /**
615
+ * `attachmentCount` takes precedence over `icon`
616
+ */
617
+ "attachmentCount"?: number;
618
+ "handleTitle"?: string;
619
+ /**
620
+ * When set the handle will render as a `<a>`. When undefined it renders as a `<button>`
621
+ */
622
+ "handleUrl"?: string;
623
+ "heading"?: AccordionHeading;
624
+ "icon"?: string;
625
+ "open"?: boolean;
626
+ /**
627
+ * `state` takes precedence over `attachmentCount` and `icon`
628
+ */
629
+ "state"?: AccordionSectionState;
630
+ "status"?: string;
631
+ }
521
632
  interface DsoAlert {
522
633
  /**
523
634
  * Whether or not to show the role attribute with value "alert". To control the tooltip add the `role-alert` attribute.
@@ -773,6 +884,7 @@ declare namespace LocalJSX {
773
884
  "size"?: 'small' | 'medium' | 'large';
774
885
  }
775
886
  interface DsoResponsiveElement {
887
+ "onDsoSizeChange"?: (event: CustomEvent<ResponsiveElementSize>) => void;
776
888
  }
777
889
  interface DsoSelectable {
778
890
  "checked"?: boolean;
@@ -788,6 +900,16 @@ declare namespace LocalJSX {
788
900
  "type": 'checkbox' | 'radio';
789
901
  "value": string;
790
902
  }
903
+ interface DsoTable {
904
+ /**
905
+ * Indicates whether the table is currently horizontally scrollable
906
+ */
907
+ "isResponsive"?: boolean;
908
+ /**
909
+ * Prevents the table being opened in a modal.
910
+ */
911
+ "noModal"?: boolean;
912
+ }
791
913
  interface DsoToggletip {
792
914
  "label"?: string;
793
915
  "position"?: "top" | "right" | "bottom" | "left";
@@ -859,6 +981,8 @@ declare namespace LocalJSX {
859
981
  "overlayOpen"?: boolean;
860
982
  }
861
983
  interface IntrinsicElements {
984
+ "dso-accordion": DsoAccordion;
985
+ "dso-accordion-section": DsoAccordionSection;
862
986
  "dso-alert": DsoAlert;
863
987
  "dso-attachments-counter": DsoAttachmentsCounter;
864
988
  "dso-autosuggest": DsoAutosuggest;
@@ -883,6 +1007,7 @@ declare namespace LocalJSX {
883
1007
  "dso-progress-indicator": DsoProgressIndicator;
884
1008
  "dso-responsive-element": DsoResponsiveElement;
885
1009
  "dso-selectable": DsoSelectable;
1010
+ "dso-table": DsoTable;
886
1011
  "dso-toggletip": DsoToggletip;
887
1012
  "dso-tooltip": DsoTooltip;
888
1013
  "dso-tree-view": DsoTreeView;
@@ -893,6 +1018,8 @@ export { LocalJSX as JSX };
893
1018
  declare module "@stencil/core" {
894
1019
  export namespace JSX {
895
1020
  interface IntrinsicElements {
1021
+ "dso-accordion": LocalJSX.DsoAccordion & JSXBase.HTMLAttributes<HTMLDsoAccordionElement>;
1022
+ "dso-accordion-section": LocalJSX.DsoAccordionSection & JSXBase.HTMLAttributes<HTMLDsoAccordionSectionElement>;
896
1023
  "dso-alert": LocalJSX.DsoAlert & JSXBase.HTMLAttributes<HTMLDsoAlertElement>;
897
1024
  "dso-attachments-counter": LocalJSX.DsoAttachmentsCounter & JSXBase.HTMLAttributes<HTMLDsoAttachmentsCounterElement>;
898
1025
  "dso-autosuggest": LocalJSX.DsoAutosuggest & JSXBase.HTMLAttributes<HTMLDsoAutosuggestElement>;
@@ -917,6 +1044,7 @@ declare module "@stencil/core" {
917
1044
  "dso-progress-indicator": LocalJSX.DsoProgressIndicator & JSXBase.HTMLAttributes<HTMLDsoProgressIndicatorElement>;
918
1045
  "dso-responsive-element": LocalJSX.DsoResponsiveElement & JSXBase.HTMLAttributes<HTMLDsoResponsiveElementElement>;
919
1046
  "dso-selectable": LocalJSX.DsoSelectable & JSXBase.HTMLAttributes<HTMLDsoSelectableElement>;
1047
+ "dso-table": LocalJSX.DsoTable & JSXBase.HTMLAttributes<HTMLDsoTableElement>;
920
1048
  "dso-toggletip": LocalJSX.DsoToggletip & JSXBase.HTMLAttributes<HTMLDsoToggletipElement>;
921
1049
  "dso-tooltip": LocalJSX.DsoTooltip & JSXBase.HTMLAttributes<HTMLDsoTooltipElement>;
922
1050
  "dso-tree-view": LocalJSX.DsoTreeView & JSXBase.HTMLAttributes<HTMLDsoTreeViewElement>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dso-toolkit/core",
3
- "version": "45.0.1",
3
+ "version": "45.2.0",
4
4
  "description": "DSO Toolkit Web Components",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/custom-elements/index.js",
@@ -22,11 +22,12 @@
22
22
  "dependencies": {
23
23
  "@popperjs/core": "^2.11.5",
24
24
  "@stencil/core": "2.10.0",
25
+ "@stencil/store": "^2.0.0",
25
26
  "clsx": "1.1.1",
26
27
  "escape-string-regexp": "^5.0.0",
27
- "focus-trap": "^6.8.1",
28
+ "focus-trap": "^7.0.0",
28
29
  "popper-max-size-modifier": "^0.2.0",
29
- "tabbable": "^5.3.1",
30
+ "tabbable": "^6.0.0",
30
31
  "uuid": "^8.3.2"
31
32
  },
32
33
  "devDependencies": {
package/readme.md CHANGED
@@ -1,10 +1,3 @@
1
1
  # `@dso-toolkit/core`
2
2
 
3
3
  See https://www.github.com/dso-toolkit/dso-toolkit
4
-
5
- ## `di()` en `di-variant()` SCSS mixins
6
-
7
- Dit project bevat een dataUri implementatie. Zie `di.scss` en `dso-icon-sass-function.ts` in `/packages/core/src/icon`.
8
-
9
- * `dso-icon-sass-function.ts`: Bevat een Sass function die aan de Sass compiler van de Stencil Components wordt meegegeven. Deze functie moet in elke Stencil Component stylesheet gebruikt worden om iconen te "preloaden" door ze in te lezen op een custom property.
10
- * `di.scss`: Bevat de `di()` en `di-variant()` mixins. Deze mixin maakt een `background-image` met een verwijzing naar een custom property `--dso-icon`. Beide mixins hebben een argument met het alias naar het icoon. De waarde van `--dso-icon` is een verwijzing naar het eerder ingeladen icoon.
@@ -1,42 +0,0 @@
1
- import { instance as sass } from '@stencil/sass';
2
- import cheerio from 'cheerio';
3
- import { readFileSync, existsSync } from 'fs';
4
- import { resolve, dirname } from 'path';
5
- import svgToDataUri from 'mini-svg-data-uri';
6
- const iconsPath = resolve(dirname(require.resolve('@dso-toolkit/sources')), '../src', 'icons');
7
- // Replace this regex with the same logic as in @dso-toolkit/css gulpfile.js
8
- const styleRegex = (selector) => new RegExp(`${selector} {([\\s\\S]+?)}`);
9
- export const dsoIcon = {
10
- 'dso-icon($icon, $variant: null)': function (sassIconAlias, sassVariant) {
11
- if (!(sassIconAlias instanceof sass.types.String)) {
12
- throw new TypeError('Expected $icon to be of type String');
13
- }
14
- const iconAlias = sassIconAlias.getValue();
15
- const iconPath = resolve(iconsPath, `${iconAlias}.svg`);
16
- const icon = readFileSync(iconPath).toString('utf-8');
17
- const style = getStyle(iconAlias, sassVariant instanceof sass.types.String ? sassVariant.getValue() : null);
18
- const svg = style ? bundleSvgStyle(icon, style) : icon;
19
- const dataUri = svgToDataUri(svg);
20
- return new sass.types.String(`url("${dataUri}")`);
21
- }
22
- };
23
- function getStyle(icon, variant) {
24
- var _a, _b;
25
- const stylesheetPath = resolve(iconsPath, `${icon}.scss`);
26
- if (!existsSync(stylesheetPath)) {
27
- return null;
28
- }
29
- const css = sass
30
- .renderSync({ file: stylesheetPath })
31
- .css
32
- .toString('utf-8');
33
- const selector = `${icon}${variant ? `:${variant}` : ''}`;
34
- const regex = styleRegex(selector);
35
- return (_b = (_a = css.match(regex)) === null || _a === void 0 ? void 0 : _a[1]) !== null && _b !== void 0 ? _b : null;
36
- }
37
- function bundleSvgStyle(svg, style) {
38
- const $ = cheerio.load(svg, { xmlMode: true });
39
- const inlineStyle = style.trim().split('\n').map(l => l.trim()).join('');
40
- const $svg = $('svg').attr('style', inlineStyle);
41
- return $.html($svg);
42
- }
@@ -1 +0,0 @@
1
- @media screen and (min-width: 481px){.alert{padding:19px 16px 19px 63px}}@media screen and (max-width: 480px){.alert{padding:63px 16px 16px}}dso-alert>.dso-rich-content *:first-child{margin-top:0 !important}dso-alert>.dso-rich-content *:last-child{margin-bottom:0 !important}dso-alert>.dso-rich-content h1,dso-alert>.dso-rich-content h2,dso-alert>.dso-rich-content h3,dso-alert>.dso-rich-content h4,dso-alert>.dso-rich-content h5,dso-alert>.dso-rich-content h6,dso-alert>.dso-rich-content .h1,dso-alert>.dso-rich-content .h2,dso-alert>.dso-rich-content .h3,dso-alert>.dso-rich-content .h4,dso-alert>.dso-rich-content .h5,dso-alert>.dso-rich-content .h6{color:#000;font-size:1em;line-height:1.5;margin-bottom:8px;margin-top:8px}dso-alert>.dso-rich-content .btn,dso-alert>.dso-rich-content .dso-primary,dso-alert>.dso-rich-content .dso-secondary,dso-alert>.dso-rich-content .dso-tertiary{background-color:rgba(25, 25, 25, 0.05);border-radius:4px;border:1px solid transparent;padding:6px 12px}dso-alert>.dso-rich-content .btn:hover,dso-alert>.dso-rich-content .btn:active,dso-alert>.dso-rich-content .dso-primary:hover,dso-alert>.dso-rich-content .dso-primary:active,dso-alert>.dso-rich-content .dso-secondary:hover,dso-alert>.dso-rich-content .dso-secondary:active,dso-alert>.dso-rich-content .dso-tertiary:hover,dso-alert>.dso-rich-content .dso-tertiary:active{background-color:rgba(25, 25, 25, 0.2);color:#000}dso-alert a,dso-alert a:not(.btn):visited{color:#191919}dso-alert a:hover,dso-alert a:focus,dso-alert a:active,dso-alert a:visited{color:#191919}dso-alert a:active{text-decoration:none}dso-alert a.download::after{background:var(--dso-icon, var(--di-download-grijs90)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-alert a.extern::after{background:var(--dso-icon, var(--di-external-link-grijs90)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-banner a{text-decoration:underline}dso-banner a,dso-banner a:hover,dso-banner a:focus,dso-banner a:active,dso-banner a:visited{color:#191919}dso-banner a:active{text-decoration:none}dso-banner a.download::after{background:var(--dso-icon, var(--di-download-grijs90)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-banner a.extern::after{background:var(--dso-icon, var(--di-external-link-grijs90)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-banner .row>div{line-height:1.5;position:relative}dso-banner .row>div button{position:absolute;right:16px;top:0}dso-banner .row>div button dso-icon,dso-banner .row>div button svg.di{color:#000}@media screen and (min-width: 481px){dso-banner .row>div{padding-left:48px}}@media screen and (max-width: 480px){dso-banner .row>div{padding-top:39px}}dso-banner .row>div::before{content:"";display:inline-block;left:16px;position:absolute;top:0}dso-banner .row>div>.dso-rich-content{padding-right:24px}dso-banner .row>div>.dso-rich-content h1,dso-banner .row>div>.dso-rich-content h2,dso-banner .row>div>.dso-rich-content h3,dso-banner .row>div>.dso-rich-content h4,dso-banner .row>div>.dso-rich-content h5,dso-banner .row>div>.dso-rich-content h6{color:#000;font-size:1rem;line-height:1.5;margin-bottom:0}dso-banner .row>div>.dso-rich-content h1+p,dso-banner .row>div>.dso-rich-content h2+p,dso-banner .row>div>.dso-rich-content h3+p,dso-banner .row>div>.dso-rich-content h4+p,dso-banner .row>div>.dso-rich-content h5+p,dso-banner .row>div>.dso-rich-content h6+p{display:inline}dso-banner .row>div>.dso-rich-content h1+p+*,dso-banner .row>div>.dso-rich-content h2+p+*,dso-banner .row>div>.dso-rich-content h3+p+*,dso-banner .row>div>.dso-rich-content h4+p+*,dso-banner .row>div>.dso-rich-content h5+p+*,dso-banner .row>div>.dso-rich-content h6+p+*{margin-top:16px}dso-banner .row>div>.dso-rich-content>h2:first-child{float:left;margin-right:8px}dso-banner .row>div>.dso-rich-content *:first-child{margin-top:0}dso-banner .row>div>.dso-rich-content *:last-child{margin-bottom:0}@media screen and (max-width: 480px){dso-banner .row>div>.dso-rich-content{padding-right:0}}dso-banner[status=danger]{color:#191919;background-color:#f5d8dc;border-color:#f5d8dc}dso-banner[status=danger] .row>div::before{background:var(--dso-icon, var(--di-status-danger)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-banner[status=warning]{color:#191919;background-color:#f8f6cc;border-color:#f8f6cc}dso-banner[status=warning] .row>div::before{background:var(--dso-icon, var(--di-status-warning)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-dropdown-menu>.dso-primary::after,dso-dropdown-menu>.dso-secondary::after,dso-dropdown-menu>.dso-tertiary::after,dso-dropdown-menu>.btn::after{content:"";display:inline-block}dso-dropdown-menu>.dso-primary::after,dso-dropdown-menu>.dso-secondary::after,dso-dropdown-menu>.btn::after{margin-left:8px}dso-dropdown-menu>.dso-primary::after,dso-dropdown-menu>.btn-primary::after{background:var(--dso-icon, var(--di-chevron-down-wit)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-dropdown-menu>.dso-secondary::after,dso-dropdown-menu>.btn-default::after{background:var(--dso-icon, var(--di-chevron-down)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-dropdown-menu>.dso-secondary:hover::after,dso-dropdown-menu>.btn-default:hover::after{--dso-icon:var(--di-chevron-down-wit)}dso-dropdown-menu>.dso-tertiary::after,dso-dropdown-menu>.btn-link::after{background:var(--dso-icon, var(--di-chevron-down)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px;margin-left:4px;position:relative;top:-2px}dso-dropdown-menu>.dso-tertiary:hover::after,dso-dropdown-menu>.btn-link:hover::after{--dso-icon:var(--di-chevron-down-scampi)}dso-dropdown-menu .dso-group-label{color:#999;font-size:0.875em;font-weight:400;margin:0;padding:4px 20px 2px;text-transform:uppercase}dso-dropdown-menu ul{margin:0;padding:0}dso-dropdown-menu ul:not(:last-child){border-bottom:1px solid #e5e5e5;margin-bottom:11px;padding-bottom:11px}dso-dropdown-menu .dso-dropdown-options{background-clip:padding-box;background-color:#fff;border-radius:4px;border:1px solid rgba(0, 0, 0, 0.15);box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.4);font-size:1rem;margin:2px 0 0;min-width:160px;padding:5px 0;position:absolute;text-align:left;top:100%;z-index:220}dso-dropdown-menu .dso-dropdown-options li{list-style:none}dso-dropdown-menu .dso-dropdown-options li a:visited{color:#191919}dso-dropdown-menu .dso-dropdown-options li a,dso-dropdown-menu .dso-dropdown-options li button{text-decoration:none;clear:both;color:#191919;display:block;font-weight:400;line-height:1.5;padding:3px 20px;text-decoration:none;white-space:nowrap}dso-dropdown-menu .dso-dropdown-options li a:hover,dso-dropdown-menu .dso-dropdown-options li a:focus,dso-dropdown-menu .dso-dropdown-options li a:active,dso-dropdown-menu .dso-dropdown-options li button:hover,dso-dropdown-menu .dso-dropdown-options li button:focus,dso-dropdown-menu .dso-dropdown-options li button:active{text-decoration:underline}dso-dropdown-menu .dso-dropdown-options li a:hover,dso-dropdown-menu .dso-dropdown-options li a:focus,dso-dropdown-menu .dso-dropdown-options li button:hover,dso-dropdown-menu .dso-dropdown-options li button:focus{background-color:#39870c;border-color:#39870c;color:#fff;text-decoration:none}dso-dropdown-menu .dso-dropdown-options li button{background-color:transparent;border:0;border-radius:0;text-align:inherit;width:100%}dso-dropdown-menu[dropdown-align=right] .dso-dropdown-options{right:0}dso-dropdown-menu[open]>.dso-primary::after,dso-dropdown-menu[open]>.btn-primary::after{--dso-icon:var(--di-chevron-up-wit)}dso-dropdown-menu[open]>.dso-secondary::after,dso-dropdown-menu[open]>.btn-default::after{--dso-icon:var(--di-chevron-up)}dso-dropdown-menu[open]>.dso-secondary:hover::after,dso-dropdown-menu[open]>.btn-default:hover::after{--dso-icon:var(--di-chevron-up-wit)}dso-dropdown-menu[open]>.dso-tertiary::after,dso-dropdown-menu[open]>.btn-link::after{--dso-icon:var(--di-chevron-up)}dso-dropdown-menu[open]>.dso-tertiary:hover::after,dso-dropdown-menu[open]>.btn-link:hover::after{--dso-icon:var(--di-chevron-up-scampi)}dso-dropdown-menu[checkable] .dso-group-label{padding-left:40px}dso-dropdown-menu[checkable] li a,dso-dropdown-menu[checkable] li button{padding-left:40px}dso-dropdown-menu[checkable] li.dso-checked a:not(:focus),dso-dropdown-menu[checkable] li.dso-checked button:not(:focus){background-color:#39870c;border-color:#39870c;color:#fff}dso-dropdown-menu[checkable] li.dso-checked a::before,dso-dropdown-menu[checkable] li.dso-checked button::before{background:var(--dso-icon, var(--di-check-wit)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px;content:"";display:block;float:left;margin-left:-32px;margin-right:8px}dso-highlight-box>.dso-rich-content *:first-child{margin-top:0}dso-highlight-box>*:last-child{margin-bottom:0}dso-highlight-box .dso-tertiary:not([disabled]):hover,dso-highlight-box .dso-tertiary:not([disabled]):hover dso-icon,dso-highlight-box .dso-tertiary:not([disabled]):hover svg.di,dso-highlight-box .btn-link:not([disabled]):hover,dso-highlight-box .btn-link:not([disabled]):hover dso-icon,dso-highlight-box .btn-link:not([disabled]):hover svg.di{text-decoration:underline}dso-highlight-box.dso-has-counter{padding-top:2.5rem;position:relative}dso-highlight-box .dso-step-counter{background-color:#275937;border:8px solid #79b929;border-radius:50%;box-sizing:content-box;color:#fff;font-size:1.25rem;font-weight:500;height:2rem;left:16px;line-height:2rem;position:absolute;text-align:center;top:-1.5rem;width:2rem}dso-highlight-box .dso-step-counter svg.di{height:1.5rem;margin-top:0.25rem;width:1.5rem}dso-highlight-box dso-icon{vertical-align:text-top}dso-highlight-box[yellow],dso-highlight-box:not([border]):not([white]){--di-chevron-right-grijs90:url("data:image/svg+xml,%3csvg id='chevron-right' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23191919%3b'%3e %3cpath fill='currentColor' d='M9%2c19a.93.93%2c0%2c0%2c1-.67-.29%2c1%2c1%2c0%2c0%2c1%2c0-1.42l5-5.29-5-5.29a1%2c1%2c0%2c0%2c1%2c0-1.42.93.93%2c0%2c0%2c1%2c1.35%2c0L16%2c12%2c9.62%2c18.71A.93.93%2c0%2c0%2c1%2c9%2c19Z'/%3e %3c/svg%3e")}dso-highlight-box[yellow] .dso-tertiary:not([disabled]),dso-highlight-box[yellow] .btn-link:not([disabled]),dso-highlight-box:not([border]):not([white]) .dso-tertiary:not([disabled]),dso-highlight-box:not([border]):not([white]) .btn-link:not([disabled]){color:#191919}dso-highlight-box[yellow] .dso-tertiary:not([disabled]):hover,dso-highlight-box[yellow] .dso-tertiary:not([disabled]):hover dso-icon,dso-highlight-box[yellow] .dso-tertiary:not([disabled]):hover svg.di,dso-highlight-box[yellow] .dso-tertiary:not([disabled]):focus,dso-highlight-box[yellow] .dso-tertiary:not([disabled]):focus dso-icon,dso-highlight-box[yellow] .dso-tertiary:not([disabled]):focus svg.di,dso-highlight-box[yellow] .btn-link:not([disabled]):hover,dso-highlight-box[yellow] .btn-link:not([disabled]):hover dso-icon,dso-highlight-box[yellow] .btn-link:not([disabled]):hover svg.di,dso-highlight-box[yellow] .btn-link:not([disabled]):focus,dso-highlight-box[yellow] .btn-link:not([disabled]):focus dso-icon,dso-highlight-box[yellow] .btn-link:not([disabled]):focus svg.di,dso-highlight-box:not([border]):not([white]) .dso-tertiary:not([disabled]):hover,dso-highlight-box:not([border]):not([white]) .dso-tertiary:not([disabled]):hover dso-icon,dso-highlight-box:not([border]):not([white]) .dso-tertiary:not([disabled]):hover svg.di,dso-highlight-box:not([border]):not([white]) .dso-tertiary:not([disabled]):focus,dso-highlight-box:not([border]):not([white]) .dso-tertiary:not([disabled]):focus dso-icon,dso-highlight-box:not([border]):not([white]) .dso-tertiary:not([disabled]):focus svg.di,dso-highlight-box:not([border]):not([white]) .btn-link:not([disabled]):hover,dso-highlight-box:not([border]):not([white]) .btn-link:not([disabled]):hover dso-icon,dso-highlight-box:not([border]):not([white]) .btn-link:not([disabled]):hover svg.di,dso-highlight-box:not([border]):not([white]) .btn-link:not([disabled]):focus,dso-highlight-box:not([border]):not([white]) .btn-link:not([disabled]):focus dso-icon,dso-highlight-box:not([border]):not([white]) .btn-link:not([disabled]):focus svg.di{color:#666}dso-highlight-box[yellow] a:not(.btn):not(.dso-primary):not(.dso-secondary):not(.dso-tertiary),dso-highlight-box[yellow] a:visited:not(.btn):not(.dso-primary):not(.dso-secondary):not(.dso-tertiary),dso-highlight-box:not([border]):not([white]) a:not(.btn):not(.dso-primary):not(.dso-secondary):not(.dso-tertiary),dso-highlight-box:not([border]):not([white]) a:visited:not(.btn):not(.dso-primary):not(.dso-secondary):not(.dso-tertiary){color:#191919}dso-highlight-box:not([border]):not([white]) .dso-link-list li{margin-bottom:16px}dso-highlight-box:not([border]):not([white]) .dso-link-list li:last-child{margin-bottom:0}dso-highlight-box:not([border]):not([white]) .dso-link-list a{text-decoration:none;color:#191919}dso-highlight-box:not([border]):not([white]) .dso-link-list a:hover,dso-highlight-box:not([border]):not([white]) .dso-link-list a:focus,dso-highlight-box:not([border]):not([white]) .dso-link-list a:active{text-decoration:underline}dso-highlight-box:not([border]):not([white]) .dso-link-list a::before,dso-highlight-box:not([border]):not([white]) .dso-link-list a:active::before,dso-highlight-box:not([border]):not([white]) .dso-link-list a:focus::before,dso-highlight-box:not([border]):not([white]) .dso-link-list a:hover::before{background:var(--dso-icon, var(--di-chevron-right-grijs90)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-highlight-box:not([border]):not([white]) .dso-link-list a:active{color:#191919;text-decoration:none}dso-highlight-box:not([border]):not([white]) .dso-link-list a.download::after{background:var(--dso-icon, var(--di-download-grijs90)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-highlight-box:not([border]):not([white]) .dso-link-list a.extern::after{background:var(--dso-icon, var(--di-external-link-grijs90)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px}dso-info .dso-rich-content *:first-child{margin-top:0}dso-info .dso-rich-content img{display:block;margin:8px auto;max-width:100%}dso-info .dso-rich-content a:not(.btn):not(.dso-primary):not(.dso-secondary):not(.dso-tertiary),dso-info .dso-rich-content a:hover,dso-info .dso-rich-content a:focus,dso-info .dso-rich-content a:active,dso-info .dso-rich-content a:visited{color:#191919}dso-info .dso-rich-content a:active{text-decoration:none}dso-info .dso-rich-content .dso-tertiary:not([disabled]),dso-info .dso-rich-content .btn-link:not([disabled]){color:#000}dso-info .dso-rich-content .dso-tertiary:not([disabled]):hover,dso-info .dso-rich-content .dso-tertiary:not([disabled]):hover dso-icon,dso-info .dso-rich-content .dso-tertiary:not([disabled]):hover svg.di,dso-info .dso-rich-content .dso-tertiary:not([disabled]):focus,dso-info .dso-rich-content .dso-tertiary:not([disabled]):focus dso-icon,dso-info .dso-rich-content .dso-tertiary:not([disabled]):focus svg.di,dso-info .dso-rich-content .btn-link:not([disabled]):hover,dso-info .dso-rich-content .btn-link:not([disabled]):hover dso-icon,dso-info .dso-rich-content .btn-link:not([disabled]):hover svg.di,dso-info .dso-rich-content .btn-link:not([disabled]):focus,dso-info .dso-rich-content .btn-link:not([disabled]):focus dso-icon,dso-info .dso-rich-content .btn-link:not([disabled]):focus svg.di{color:#666;text-decoration:underline}dso-label span[slot=symbol]{background-color:#fff;display:block;float:left;height:20px;margin-top:2px;margin-right:8px;width:24px;overflow:hidden;position:relative}dso-label span[slot=symbol]>span{display:block;position:absolute;top:0;bottom:0;left:0;right:0}dso-map-controls>*+*{margin-top:32px}dso-selectable .dso-rich-content[slot=info] *:first-child{margin-top:0}dso-selectable .dso-rich-content[slot=info] img{display:block;margin:8px auto;max-width:100%}dso-selectable .dso-rich-content[slot=info] a:not(.btn):not(.dso-primary):not(.dso-secondary):not(.dso-tertiary),dso-selectable .dso-rich-content[slot=info] a:hover,dso-selectable .dso-rich-content[slot=info] a:focus,dso-selectable .dso-rich-content[slot=info] a:active,dso-selectable .dso-rich-content[slot=info] a:visited{color:#191919}dso-selectable .dso-rich-content[slot=info] a:active{text-decoration:none}dso-selectable .dso-rich-content[slot=info] .dso-tertiary:not([disabled]),dso-selectable .dso-rich-content[slot=info] .btn-link:not([disabled]){color:#000}dso-selectable .dso-rich-content[slot=info] .dso-tertiary:not([disabled]):hover,dso-selectable .dso-rich-content[slot=info] .dso-tertiary:not([disabled]):hover dso-icon,dso-selectable .dso-rich-content[slot=info] .dso-tertiary:not([disabled]):hover svg.di,dso-selectable .dso-rich-content[slot=info] .dso-tertiary:not([disabled]):focus,dso-selectable .dso-rich-content[slot=info] .dso-tertiary:not([disabled]):focus dso-icon,dso-selectable .dso-rich-content[slot=info] .dso-tertiary:not([disabled]):focus svg.di,dso-selectable .dso-rich-content[slot=info] .btn-link:not([disabled]):hover,dso-selectable .dso-rich-content[slot=info] .btn-link:not([disabled]):hover dso-icon,dso-selectable .dso-rich-content[slot=info] .btn-link:not([disabled]):hover svg.di,dso-selectable .dso-rich-content[slot=info] .btn-link:not([disabled]):focus,dso-selectable .dso-rich-content[slot=info] .btn-link:not([disabled]):focus dso-icon,dso-selectable .dso-rich-content[slot=info] .btn-link:not([disabled]):focus svg.di{color:#666;text-decoration:underline}dso-viewer-grid .dso-filterblok{margin-left:-16px;margin-right:-16px}dso-viewer-grid .dso-filterblok .dso-filterblok-address{font-weight:bold;margin:8px 0}@media screen and (max-width: 480px){dso-viewer-grid .dso-filterblok .dso-context-wrapper .dso-context-container{flex-basis:auto}}
@@ -1 +0,0 @@
1
- import{r as s,h as t,H as i,g as l}from"./p-c62606a3.js";const e=[{width:624,alias:"large"},{width:375,alias:"medium"},{width:0,alias:"small"}];let a=class{constructor(t){s(this,t),this.sizeAlias=e[0].alias,this.sizeWidth=0,this.observer=new ResizeObserver((([s])=>{var t,i;const l=null!==(i=null===(t=e.find((t=>s.contentRect.width>=t.width)))||void 0===t?void 0:t.alias)&&void 0!==i?i:e[0].alias;this.sizeAlias=l}))}componentWillLoad(){this.observer.observe(this.host)}disconnectedCallback(){this.observer.unobserve(this.host)}render(){return t(i,{small:"small"===this.sizeAlias,medium:"medium"===this.sizeAlias,large:"large"===this.sizeAlias},t("slot",null))}get host(){return l(this)}};a.style=":host{display:block}";export{a as dso_responsive_element}
@@ -1 +0,0 @@
1
- import{r as n,c as t,h as o,H as e}from"./p-c62606a3.js";var r,a,s=function(n,t,o,e){if("a"===o&&!e)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?n!==t||!e:!t.has(n))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===o?e:"a"===o?e.call(n):e?e.value:t.get(n)},i=function(n,t,o,e,r){if("m"===e)throw new TypeError("Private method is not writable");if("a"===e&&!r)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?n!==t||!r:!t.has(n))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===e?r.call(n,o):r?r.value=o:t.set(n,o),o};let d=class{constructor(o){n(this,o),this.dsoZoomIn=t(this,"dsoZoomIn",7),this.dsoZoomOut=t(this,"dsoZoomOut",7),this.panelTitle="Kaartlagen",this.open=!1,this.hideContent=!this.open,r.set(this,void 0),a.set(this,void 0)}watchOpen(n){n?(this.hideContent=!1,setTimeout((()=>s(this,r,"f").focus()),300)):setTimeout((()=>{this.hideContent=!0,s(this,a,"f").focus()}),300)}render(){return o(e,null,o("button",{type:"button",id:"toggle-visibility-button",onClick:()=>this.open=!this.open,ref:n=>i(this,a,n,"f")},o("dso-icon",{icon:"layers"}),o("span",null,"Kaartlagen")),o("div",{id:"zoom-buttons"},o("button",{type:"button",onClick:n=>this.dsoZoomIn.emit(n),disabled:"in"===this.disableZoom||"both"===this.disableZoom},o("span",null,"Zoom in"),o("dso-icon",{icon:"plus"})),o("button",{type:"button",onClick:n=>this.dsoZoomOut.emit(n),disabled:"out"===this.disableZoom||"both"===this.disableZoom},o("span",null,"Zoom uit"),o("dso-icon",{icon:"minus"}))),o("section",{hidden:this.hideContent},o("header",null,o("h2",null,this.panelTitle),o("button",{type:"button",id:"close-button",onClick:()=>this.open=!1,ref:n=>i(this,r,n,"f")},o("span",null,"Verberg paneel ",this.panelTitle),o("dso-icon",{icon:"times"}))),o("div",{class:"content"},o("slot",null))))}static get watchers(){return{open:["watchOpen"]}}};r=new WeakMap,a=new WeakMap,d.style="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\n.btn {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n}\n.btn:focus, .btn:focus-visible {\n outline-offset: 2px;\n}\n.btn:active {\n outline: 0;\n}\n.btn.extern::after, .btn.download::after {\n content: \"\";\n display: inline-block;\n height: 1.5em;\n margin-left: 8px;\n vertical-align: top;\n width: 1.5em;\n}\n\n.btn-primary {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n background-color: #b62f41;\n}\n.btn-primary:hover {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.btn-primary:active {\n background-color: #15301e;\n border-color: #15301e;\n color: #fff;\n}\n.btn-primary[disabled], .btn-primary[disabled]:hover {\n background-color: #afcf9d;\n border-color: #afcf9d;\n color: #fff;\n}\n.btn-primary.btn-sm {\n line-height: 1rem;\n}\n.btn-primary.btn-sm dso-icon,\n.btn-primary.btn-sm svg.di, .btn-primary.btn-sm.extern::after, .btn-primary.btn-sm.download::after, .btn-primary.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.btn-primary.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.btn-primary.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.btn-primary.download::after {\n background: var(--dso-icon, var(--di-download-wit)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n.btn-primary.extern::after {\n background: var(--dso-icon, var(--di-external-link-wit)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n.btn-primary dso-icon,\n.btn-primary svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\n.btn-primary span + dso-icon,\n.btn-primary span + svg.di {\n margin-left: 8px;\n margin-right: -8px;\n}\n.btn-primary.dso-spinner-left[disabled], .btn-primary.dso-spinner-right[disabled] {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.btn-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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.btn-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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n\na.btn-primary {\n text-decoration: none;\n background-color: #b62f41;\n}\na.btn-primary, a.btn-primary:visited {\n color: #fff;\n}\n\n.btn-default {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n background-color: #b62f41;\n}\n.btn-default:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n.btn-default:active {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n.btn-default[disabled], .btn-default[disabled]:hover {\n background-color: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\n.btn-default.btn-sm {\n line-height: 1rem;\n}\n.btn-default.btn-sm dso-icon,\n.btn-default.btn-sm svg.di, .btn-default.btn-sm.extern::after, .btn-default.btn-sm.download::after, .btn-default.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n.btn-default.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n.btn-default.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n.btn-default.download::after {\n background: var(--dso-icon, var(--di-download)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n.btn-default.download:hover::after {\n --dso-icon: var(--di-download-wit);\n}\n.btn-default.download[disabled]::after {\n --dso-icon: var(--di-download-grasgroen-40);\n}\n.btn-default.extern::after {\n background: var(--dso-icon, var(--di-external-link)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n.btn-default.extern:hover::after {\n --dso-icon: var(--di-external-link-wit);\n}\n.btn-default.extern[disabled]::after {\n --dso-icon: var(--di-external-link-grasgroen-40);\n}\n.btn-default dso-icon,\n.btn-default svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\n.btn-default span + dso-icon,\n.btn-default span + svg.di {\n margin-left: 8px;\n margin-right: -8px;\n}\n.btn-default.dso-spinner-left[disabled], .btn-default.dso-spinner-right[disabled] {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n}\n.btn-default.dso-spinner-left::before {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.btn-default.dso-spinner-left:not([disabled]):hover::before {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n.btn-default.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 16px;\n}\n.btn-default.dso-spinner-right::after {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.btn-default.dso-spinner-right:not([disabled]):hover::after {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n.btn-default.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\n\na.btn-default {\n text-decoration: none;\n background-color: #b62f41;\n}\na.btn-default, a.btn-default:visited {\n color: #39870c;\n}\na.btn-default:hover, a.btn-default:visited:hover {\n color: #fff;\n}\n\n.btn-link {\n border: 0;\n color: #39870c;\n line-height: 1;\n padding: 0;\n background-color: transparent;\n background-color: #b62f41;\n}\n.btn-link[disabled] {\n color: #afcf9d;\n}\n.btn-link[disabled].dso-spinner-left, .btn-link[disabled].dso-spinner-right {\n color: #39870c;\n}\n.btn-link:not([disabled]):hover {\n color: #676cb0;\n text-decoration: underline;\n text-underline-position: under;\n}\n.btn-link:not([disabled]):active {\n color: #676cb0;\n}\n.btn-link.btn-align {\n line-height: calc(1.5em - 1px);\n padding: 11px 0;\n position: relative;\n}\n.btn-link.extern::after, .btn-link.download::after {\n position: relative;\n top: -2px;\n}\n.btn-link.download::after {\n background: var(--dso-icon, var(--di-download)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n.btn-link.download[disabled]::after {\n --dso-icon: var(--di-download-grasgroen-40);\n}\n.btn-link.download:not([disabled]):hover::after, .btn-link.download:not([disabled]):active::after {\n --dso-icon: var(--di-download-scampi);\n}\n.btn-link.extern::after {\n background: var(--dso-icon, var(--di-external-link)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n.btn-link.extern[disabled]::after {\n --dso-icon: var(--di-external-link-grasgroen-40);\n}\n.btn-link.extern:not([disabled]):hover::after, .btn-link.extern:not([disabled]):active::after {\n --dso-icon: var(--di-external-link-scampi);\n}\n.btn-link.dso-spinner-left::before {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-right: 8px;\n}\n.btn-link.dso-spinner-right::after {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-left: 8px;\n}\n.btn-link dso-icon + span:not(.sr-only),\n.btn-link svg.di + span:not(.sr-only),\n.btn-link span:not(.sr-only) + dso-icon,\n.btn-link span:not(.sr-only) + svg.di {\n margin-left: 8px;\n}\n.btn-link dso-icon[icon=chevron-left] + span:not(.sr-only),\n.btn-link dso-icon[icon=chevron-right] + span:not(.sr-only),\n.btn-link svg.di.di-angle-down + span:not(.sr-only),\n.btn-link svg.di.di-angle-up + span:not(.sr-only),\n.btn-link span:not(.sr-only) + svg.di.di-angle-down,\n.btn-link span:not(.sr-only) + svg.di.di-angle-up,\n.btn-link span:not(.sr-only) + dso-icon[icon=chevron-left],\n.btn-link span:not(.sr-only) + dso-icon[icon=chevron-right] {\n margin-left: 0;\n}\n.btn-link dso-icon,\n.btn-link svg.di,\n.btn-link span {\n vertical-align: middle;\n}\n\na.btn-link {\n text-decoration: none;\n background-color: #b62f41;\n}\na.btn-link, a.btn-link:visited {\n color: #39870c;\n}\n\n.btn-block {\n display: block;\n width: 100%;\n}\n.btn-block + .btn-block {\n margin-top: 5px;\n}\n\ninput[type=submit].btn-block,\ninput[type=reset].btn-block,\ninput[type=button].btn-block {\n width: 100%;\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-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n}\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 height: 1.5em;\n margin-left: 8px;\n vertical-align: top;\n width: 1.5em;\n}\na.dso-primary:hover,\nbutton.dso-primary:hover,\nlabel.dso-primary:hover {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\na.dso-primary:active,\nbutton.dso-primary:active,\nlabel.dso-primary:active {\n background-color: #15301e;\n border-color: #15301e;\n 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: #afcf9d;\n border-color: #afcf9d;\n color: #fff;\n}\na.dso-primary.btn-sm,\nbutton.dso-primary.btn-sm,\nlabel.dso-primary.btn-sm {\n line-height: 1rem;\n}\na.dso-primary.btn-sm dso-icon,\na.dso-primary.btn-sm svg.di, a.dso-primary.btn-sm.extern::after, a.dso-primary.btn-sm.download::after, a.dso-primary.btn-sm.dso-spinner::before,\nbutton.dso-primary.btn-sm dso-icon,\nbutton.dso-primary.btn-sm svg.di,\nbutton.dso-primary.btn-sm.extern::after,\nbutton.dso-primary.btn-sm.download::after,\nbutton.dso-primary.btn-sm.dso-spinner::before,\nlabel.dso-primary.btn-sm dso-icon,\nlabel.dso-primary.btn-sm svg.di,\nlabel.dso-primary.btn-sm.extern::after,\nlabel.dso-primary.btn-sm.download::after,\nlabel.dso-primary.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\na.dso-primary.btn-sm.dso-spinner-left::before,\nbutton.dso-primary.btn-sm.dso-spinner-left::before,\nlabel.dso-primary.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\na.dso-primary.btn-sm.dso-spinner-right::after,\nbutton.dso-primary.btn-sm.dso-spinner-right::after,\nlabel.dso-primary.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\na.dso-primary.download::after,\nbutton.dso-primary.download::after,\nlabel.dso-primary.download::after {\n background: var(--dso-icon, var(--di-download-wit)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\na.dso-primary.extern::after,\nbutton.dso-primary.extern::after,\nlabel.dso-primary.extern::after {\n background: var(--dso-icon, var(--di-external-link-wit)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\na.dso-primary dso-icon,\na.dso-primary svg.di,\nbutton.dso-primary dso-icon,\nbutton.dso-primary svg.di,\nlabel.dso-primary dso-icon,\nlabel.dso-primary svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\na.dso-primary span + dso-icon,\na.dso-primary span + svg.di,\nbutton.dso-primary span + dso-icon,\nbutton.dso-primary span + svg.di,\nlabel.dso-primary span + dso-icon,\nlabel.dso-primary span + svg.di {\n margin-left: 8px;\n margin-right: -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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\na.dso-secondary,\nbutton.dso-secondary,\nlabel.dso-secondary {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n}\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 height: 1.5em;\n margin-left: 8px;\n vertical-align: top;\n width: 1.5em;\n}\na.dso-secondary:hover,\nbutton.dso-secondary:hover,\nlabel.dso-secondary:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\na.dso-secondary:active,\nbutton.dso-secondary:active,\nlabel.dso-secondary:active {\n background-color: #275937;\n border-color: #275937;\n 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: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\na.dso-secondary.btn-sm,\nbutton.dso-secondary.btn-sm,\nlabel.dso-secondary.btn-sm {\n line-height: 1rem;\n}\na.dso-secondary.btn-sm dso-icon,\na.dso-secondary.btn-sm svg.di, a.dso-secondary.btn-sm.extern::after, a.dso-secondary.btn-sm.download::after, a.dso-secondary.btn-sm.dso-spinner::before,\nbutton.dso-secondary.btn-sm dso-icon,\nbutton.dso-secondary.btn-sm svg.di,\nbutton.dso-secondary.btn-sm.extern::after,\nbutton.dso-secondary.btn-sm.download::after,\nbutton.dso-secondary.btn-sm.dso-spinner::before,\nlabel.dso-secondary.btn-sm dso-icon,\nlabel.dso-secondary.btn-sm svg.di,\nlabel.dso-secondary.btn-sm.extern::after,\nlabel.dso-secondary.btn-sm.download::after,\nlabel.dso-secondary.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\na.dso-secondary.btn-sm.dso-spinner-left::before,\nbutton.dso-secondary.btn-sm.dso-spinner-left::before,\nlabel.dso-secondary.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\na.dso-secondary.btn-sm.dso-spinner-right::after,\nbutton.dso-secondary.btn-sm.dso-spinner-right::after,\nlabel.dso-secondary.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\na.dso-secondary.download::after,\nbutton.dso-secondary.download::after,\nlabel.dso-secondary.download::after {\n background: var(--dso-icon, var(--di-download)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\na.dso-secondary.download:hover::after,\nbutton.dso-secondary.download:hover::after,\nlabel.dso-secondary.download:hover::after {\n --dso-icon: var(--di-download-wit);\n}\na.dso-secondary.download[disabled]::after,\nbutton.dso-secondary.download[disabled]::after,\nlabel.dso-secondary.download[disabled]::after {\n --dso-icon: var(--di-download-grasgroen-40);\n}\na.dso-secondary.extern::after,\nbutton.dso-secondary.extern::after,\nlabel.dso-secondary.extern::after {\n background: var(--dso-icon, var(--di-external-link)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\na.dso-secondary.extern:hover::after,\nbutton.dso-secondary.extern:hover::after,\nlabel.dso-secondary.extern:hover::after {\n --dso-icon: var(--di-external-link-wit);\n}\na.dso-secondary.extern[disabled]::after,\nbutton.dso-secondary.extern[disabled]::after,\nlabel.dso-secondary.extern[disabled]::after {\n --dso-icon: var(--di-external-link-grasgroen-40);\n}\na.dso-secondary dso-icon,\na.dso-secondary svg.di,\nbutton.dso-secondary dso-icon,\nbutton.dso-secondary svg.di,\nlabel.dso-secondary dso-icon,\nlabel.dso-secondary svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\na.dso-secondary span + dso-icon,\na.dso-secondary span + svg.di,\nbutton.dso-secondary span + dso-icon,\nbutton.dso-secondary span + svg.di,\nlabel.dso-secondary span + dso-icon,\nlabel.dso-secondary span + svg.di {\n margin-left: 8px;\n margin-right: -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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\na.dso-secondary.dso-spinner-left:not([disabled]).btn-sm:hover::before,\nbutton.dso-secondary.dso-spinner-left:not([disabled]).btn-sm:hover::before,\nlabel.dso-secondary.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 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 height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\na.dso-secondary.dso-spinner-right:not([disabled]).btn-sm:hover::after,\nbutton.dso-secondary.dso-spinner-right:not([disabled]).btn-sm:hover::after,\nlabel.dso-secondary.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\na.dso-tertiary,\nbutton.dso-tertiary,\nlabel.dso-tertiary {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n border: 0;\n color: #39870c;\n line-height: 1;\n padding: 0;\n background-color: transparent;\n}\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 height: 1.5em;\n margin-left: 8px;\n vertical-align: top;\n width: 1.5em;\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: #676cb0;\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: #676cb0;\n}\na.dso-tertiary.btn-align,\nbutton.dso-tertiary.btn-align,\nlabel.dso-tertiary.btn-align {\n line-height: calc(1.5em - 1px);\n padding: 11px 0;\n position: relative;\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 top: -2px;\n}\na.dso-tertiary.download::after,\nbutton.dso-tertiary.download::after,\nlabel.dso-tertiary.download::after {\n background: var(--dso-icon, var(--di-download)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\na.dso-tertiary.download[disabled]::after,\nbutton.dso-tertiary.download[disabled]::after,\nlabel.dso-tertiary.download[disabled]::after {\n --dso-icon: var(--di-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 --dso-icon: var(--di-download-scampi);\n}\na.dso-tertiary.extern::after,\nbutton.dso-tertiary.extern::after,\nlabel.dso-tertiary.extern::after {\n background: var(--dso-icon, var(--di-external-link)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\na.dso-tertiary.extern[disabled]::after,\nbutton.dso-tertiary.extern[disabled]::after,\nlabel.dso-tertiary.extern[disabled]::after {\n --dso-icon: var(--di-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 --dso-icon: var(--di-external-link-scampi);\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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-right: 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 height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-left: 8px;\n}\na.dso-tertiary dso-icon + span:not(.sr-only),\na.dso-tertiary svg.di + span:not(.sr-only),\na.dso-tertiary span:not(.sr-only) + dso-icon,\na.dso-tertiary span:not(.sr-only) + svg.di,\nbutton.dso-tertiary dso-icon + span:not(.sr-only),\nbutton.dso-tertiary svg.di + span:not(.sr-only),\nbutton.dso-tertiary span:not(.sr-only) + dso-icon,\nbutton.dso-tertiary span:not(.sr-only) + svg.di,\nlabel.dso-tertiary dso-icon + span:not(.sr-only),\nlabel.dso-tertiary svg.di + span:not(.sr-only),\nlabel.dso-tertiary span:not(.sr-only) + dso-icon,\nlabel.dso-tertiary span:not(.sr-only) + svg.di {\n margin-left: 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 svg.di.di-angle-down + span:not(.sr-only),\na.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),\na.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,\na.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,\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 svg.di.di-angle-down + span:not(.sr-only),\nbutton.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),\nbutton.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,\nbutton.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,\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 svg.di.di-angle-down + span:not(.sr-only),\nlabel.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),\nlabel.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,\nlabel.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,\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-left: 0;\n}\na.dso-tertiary dso-icon,\na.dso-tertiary svg.di,\na.dso-tertiary span,\nbutton.dso-tertiary dso-icon,\nbutton.dso-tertiary svg.di,\nbutton.dso-tertiary span,\nlabel.dso-tertiary dso-icon,\nlabel.dso-tertiary svg.di,\nlabel.dso-tertiary span {\n vertical-align: middle;\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: #fff;\n}\na.dso-tertiary {\n text-decoration: none;\n}\na.dso-tertiary, a.dso-tertiary:visited {\n color: #39870c;\n}\n\n.btn:not(.dso-list-button) + .btn:not(.dso-list-button),\n.btn:not(.dso-list-button) + .dso-primary,\n.btn:not(.dso-list-button) + .dso-secondary,\n.btn:not(.dso-list-button) + .dso-tertiary,\n.dso-primary + .btn:not(.dso-list-button),\n.dso-primary + .dso-primary,\n.dso-primary + .dso-secondary,\n.dso-primary + .dso-tertiary,\n.dso-secondary + .btn:not(.dso-list-button),\n.dso-secondary + .dso-primary,\n.dso-secondary + .dso-secondary,\n.dso-secondary + .dso-tertiary,\n.dso-tertiary + .btn:not(.dso-list-button),\n.dso-tertiary + .dso-primary,\n.dso-tertiary + .dso-secondary,\n.dso-tertiary + .dso-tertiary {\n margin-left: 16px;\n}\n\n:host {\n background-color: #fff;\n border: 1px solid #ccc;\n bottom: 0;\n display: block;\n font-family: Asap, sans-serif;\n position: absolute;\n top: 0;\n left: 100%;\n transition: transform 300ms ease;\n width: 300px;\n}\n\n*,\n*::after,\n*::before {\n box-sizing: border-box;\n}\n\n:host([open]) {\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3);\n transform: translateX(-100%);\n}\n:host([open]) #toggle-visibility-button {\n display: none;\n}\n\n#toggle-visibility-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n border: 0;\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);\n font-weight: 600;\n margin-right: 16px;\n padding: 8px 16px;\n white-space: nowrap;\n position: absolute;\n right: calc(100% + 56px);\n top: 16px;\n}\n#toggle-visibility-button:focus, #toggle-visibility-button:focus-visible {\n outline-offset: 2px;\n}\n#toggle-visibility-button:active {\n outline: 0;\n}\n#toggle-visibility-button.extern::after, #toggle-visibility-button.download::after {\n content: \"\";\n display: inline-block;\n height: 1.5em;\n margin-left: 8px;\n vertical-align: top;\n width: 1.5em;\n}\n#toggle-visibility-button:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n#toggle-visibility-button:active {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n#toggle-visibility-button[disabled], #toggle-visibility-button[disabled]:hover {\n background-color: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\n#toggle-visibility-button.btn-sm {\n line-height: 1rem;\n}\n#toggle-visibility-button.btn-sm dso-icon,\n#toggle-visibility-button.btn-sm svg.di, #toggle-visibility-button.btn-sm.extern::after, #toggle-visibility-button.btn-sm.download::after, #toggle-visibility-button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n#toggle-visibility-button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n#toggle-visibility-button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n#toggle-visibility-button.download::after {\n background: var(--dso-icon, var(--di-download)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n#toggle-visibility-button.download:hover::after {\n --dso-icon: var(--di-download-wit);\n}\n#toggle-visibility-button.download[disabled]::after {\n --dso-icon: var(--di-download-grasgroen-40);\n}\n#toggle-visibility-button.extern::after {\n background: var(--dso-icon, var(--di-external-link)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n#toggle-visibility-button.extern:hover::after {\n --dso-icon: var(--di-external-link-wit);\n}\n#toggle-visibility-button.extern[disabled]::after {\n --dso-icon: var(--di-external-link-grasgroen-40);\n}\n#toggle-visibility-button dso-icon,\n#toggle-visibility-button svg.di {\n margin-left: -8px;\n margin-right: 8px;\n}\n#toggle-visibility-button span + dso-icon,\n#toggle-visibility-button span + svg.di {\n margin-left: 8px;\n margin-right: -8px;\n}\n#toggle-visibility-button.dso-spinner-left[disabled], #toggle-visibility-button.dso-spinner-right[disabled] {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n}\n#toggle-visibility-button.dso-spinner-left::before {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n#toggle-visibility-button.dso-spinner-left:not([disabled]):hover::before {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n#toggle-visibility-button.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 16px;\n}\n#toggle-visibility-button.dso-spinner-right::after {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n#toggle-visibility-button.dso-spinner-right:not([disabled]):hover::after {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n#toggle-visibility-button.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\n#toggle-visibility-button:focus-visible {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n outline: none;\n}\n\n#zoom-buttons {\n border-radius: 4px;\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);\n display: flex;\n flex-wrap: wrap;\n flex: 0 0;\n position: absolute;\n right: calc(100% + 16px);\n top: 16px;\n}\n#zoom-buttons button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n line-height: 1.5;\n min-width: 56px;\n padding: 11px 15px;\n border: 0;\n padding: 8px;\n border-radius: 0;\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n flex: 0 0 100%;\n height: 40px;\n min-width: auto;\n width: 40px;\n}\n#zoom-buttons button:focus, #zoom-buttons button:focus-visible {\n outline-offset: 2px;\n}\n#zoom-buttons button:active {\n outline: 0;\n}\n#zoom-buttons button.extern::after, #zoom-buttons button.download::after {\n content: \"\";\n display: inline-block;\n height: 1.5em;\n margin-left: 8px;\n vertical-align: top;\n width: 1.5em;\n}\n#zoom-buttons button:hover {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n}\n#zoom-buttons button:active {\n background-color: #275937;\n border-color: #275937;\n color: #fff;\n}\n#zoom-buttons button[disabled], #zoom-buttons button[disabled]:hover {\n background-color: #fff;\n border-color: #afcf9d;\n color: #afcf9d;\n}\n#zoom-buttons button.btn-sm {\n line-height: 1rem;\n}\n#zoom-buttons button.btn-sm dso-icon,\n#zoom-buttons button.btn-sm svg.di, #zoom-buttons button.btn-sm.extern::after, #zoom-buttons button.btn-sm.download::after, #zoom-buttons button.btn-sm.dso-spinner::before {\n margin-bottom: -4px;\n margin-top: -4px;\n}\n#zoom-buttons button.btn-sm.dso-spinner-left::before {\n height: 16px;\n width: 16px;\n}\n#zoom-buttons button.btn-sm.dso-spinner-right::after {\n height: 16px;\n width: 16px;\n}\n#zoom-buttons button.download::after {\n background: var(--dso-icon, var(--di-download)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n#zoom-buttons button.download:hover::after {\n --dso-icon: var(--di-download-wit);\n}\n#zoom-buttons button.download[disabled]::after {\n --dso-icon: var(--di-download-grasgroen-40);\n}\n#zoom-buttons button.extern::after {\n background: var(--dso-icon, var(--di-external-link)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n#zoom-buttons button.extern:hover::after {\n --dso-icon: var(--di-external-link-wit);\n}\n#zoom-buttons button.extern[disabled]::after {\n --dso-icon: var(--di-external-link-grasgroen-40);\n}\n#zoom-buttons button > span {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n}\n#zoom-buttons button.dso-spinner-left[disabled], #zoom-buttons button.dso-spinner-right[disabled] {\n background-color: #fff;\n border-color: #39870c;\n color: #39870c;\n}\n#zoom-buttons button.dso-spinner-left::before {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n#zoom-buttons button.dso-spinner-left:not([disabled]):hover::before {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-right: 8px;\n}\n#zoom-buttons button.dso-spinner-left:not([disabled]).btn-sm:hover::before {\n height: 16px;\n width: 16px;\n}\n#zoom-buttons button.dso-spinner-right::after {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n#zoom-buttons button.dso-spinner-right:not([disabled]):hover::after {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: top;\n width: 24px;\n margin-left: 8px;\n}\n#zoom-buttons button.dso-spinner-right:not([disabled]).btn-sm:hover::after {\n height: 16px;\n width: 16px;\n}\n#zoom-buttons button:focus-visible {\n background-color: #39870c;\n border-color: #39870c;\n color: #fff;\n outline: none;\n}\n#zoom-buttons button + button {\n border-radius: 0;\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px;\n border-top: 1px solid #ccc;\n}\n\n#close-button {\n display: inline-block;\n font-size: 1em;\n font-weight: 500;\n margin-bottom: 0;\n text-decoration: none;\n touch-action: manipulation;\n text-align: left;\n user-select: none;\n vertical-align: middle;\n border: 0;\n color: #39870c;\n line-height: 1;\n padding: 0;\n background-color: transparent;\n padding: 0;\n position: absolute;\n right: 16px;\n top: 16px;\n}\n#close-button:focus, #close-button:focus-visible {\n outline-offset: 2px;\n}\n#close-button:active {\n outline: 0;\n}\n#close-button.extern::after, #close-button.download::after {\n content: \"\";\n display: inline-block;\n height: 1.5em;\n margin-left: 8px;\n vertical-align: top;\n width: 1.5em;\n}\n#close-button[disabled] {\n color: #afcf9d;\n}\n#close-button[disabled].dso-spinner-left, #close-button[disabled].dso-spinner-right {\n color: #39870c;\n}\n#close-button:not([disabled]):hover {\n color: #676cb0;\n text-decoration: underline;\n text-underline-position: under;\n}\n#close-button:not([disabled]):active {\n color: #676cb0;\n}\n#close-button.btn-align {\n line-height: calc(1.5em - 1px);\n padding: 11px 0;\n position: relative;\n}\n#close-button.extern::after, #close-button.download::after {\n position: relative;\n top: -2px;\n}\n#close-button.download::after {\n background: var(--dso-icon, var(--di-download)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n#close-button.download[disabled]::after {\n --dso-icon: var(--di-download-grasgroen-40);\n}\n#close-button.download:not([disabled]):hover::after, #close-button.download:not([disabled]):active::after {\n --dso-icon: var(--di-download-scampi);\n}\n#close-button.extern::after {\n background: var(--dso-icon, var(--di-external-link)) no-repeat;\n background-position: center;\n background-size: cover;\n height: 24px;\n vertical-align: top;\n width: 24px;\n}\n#close-button.extern[disabled]::after {\n --dso-icon: var(--di-external-link-grasgroen-40);\n}\n#close-button.extern:not([disabled]):hover::after, #close-button.extern:not([disabled]):active::after {\n --dso-icon: var(--di-external-link-scampi);\n}\n#close-button.dso-spinner-left::before {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-right: 8px;\n}\n#close-button.dso-spinner-right::after {\n background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n content: \"\";\n display: inline-block;\n height: 24px;\n vertical-align: middle;\n width: 24px;\n margin-left: 8px;\n}\n#close-button > span {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n}\n\nsection:not([hidden]) {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\nheader,\n.content {\n padding: 16px;\n}\n\nheader {\n border-bottom: 1px solid #ccc;\n flex-grow: 0;\n position: relative;\n}\nheader h2 {\n color: #275937;\n font-family: \"Asap\", sans-serif;\n line-height: 1;\n margin: 0;\n}\n\n.content {\n flex-grow: 1;\n overflow-y: auto;\n}";export{d as dso_map_controls}
@@ -1,5 +0,0 @@
1
- import{t as n,f as t,i as e,a as r}from"./p-5e5fbd41.js";
2
- /*!
3
- * focus-trap 6.8.1
4
- * @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE
5
- */function o(n,t){var e=Object.keys(n);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(n);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(n,t).enumerable}))),e.push.apply(e,r)}return e}function u(n,t,e){return t in n?Object.defineProperty(n,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):n[t]=e,n}var i,a=(i=[],{activateTrap:function(n){if(i.length>0){var t=i[i.length-1];t!==n&&t.pause()}var e=i.indexOf(n);-1===e||i.splice(e,1),i.push(n)},deactivateTrap:function(n){var t=i.indexOf(n);-1!==t&&i.splice(t,1),i.length>0&&i[i.length-1].unpause()}}),c=function(n){return setTimeout(n,0)},f=function(n,t){var e=-1;return n.every((function(n,r){return!t(n)||(e=r,!1)})),e},s=function(n){for(var t=arguments.length,e=new Array(t>1?t-1:0),r=1;r<t;r++)e[r-1]=arguments[r];return"function"==typeof n?n.apply(void 0,e):n},v=function(n){return n.target.shadowRoot&&"function"==typeof n.composedPath?n.composedPath()[0]:n.target},l=function(i,l){var b,d=(null==l?void 0:l.document)||document,p=function(n){for(var t=1;t<arguments.length;t++){var e=null!=arguments[t]?arguments[t]:{};t%2?o(Object(e),!0).forEach((function(t){u(n,t,e[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(e)):o(Object(e)).forEach((function(t){Object.defineProperty(n,t,Object.getOwnPropertyDescriptor(e,t))}))}return n}({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0},l),h={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0},w=function(n,t,e){return n&&void 0!==n[t]?n[t]:p[e||t]},m=function(n){return h.containerGroups.findIndex((function(t){var e=t.tabbableNodes;return t.container.contains(n)||e.find((function(t){return t===n}))}))},F=function(n){var t=p[n];if("function"==typeof t){for(var e=arguments.length,r=new Array(e>1?e-1:0),o=1;o<e;o++)r[o-1]=arguments[o];t=t.apply(void 0,r)}if(!t){if(void 0===t||!1===t)return t;throw new Error("`".concat(n,"` was specified but was not a node, or did not return a node"))}var u=t;if("string"==typeof t&&!(u=d.querySelector(t)))throw new Error("`".concat(n,"` as selector refers to no known node"));return u},O=function(){var n=F("initialFocus");if(!1===n)return!1;if(void 0===n)if(m(d.activeElement)>=0)n=d.activeElement;else{var t=h.tabbableGroups[0];n=t&&t.firstTabbableNode||F("fallbackFocus")}if(!n)throw new Error("Your focus-trap needs to have at least one focusable element");return n},j=function(){if(h.containerGroups=h.containers.map((function(r){var o=n(r,p.tabbableOptions),u=t(r,p.tabbableOptions);return{container:r,tabbableNodes:o,focusableNodes:u,firstTabbableNode:o.length>0?o[0]:null,lastTabbableNode:o.length>0?o[o.length-1]:null,nextTabbableNode:function(n){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],r=u.findIndex((function(t){return t===n}));if(!(r<0))return t?u.slice(r+1).find((function(n){return e(n,p.tabbableOptions)})):u.slice(0,r).reverse().find((function(n){return e(n,p.tabbableOptions)}))}}})),h.tabbableGroups=h.containerGroups.filter((function(n){return n.tabbableNodes.length>0})),h.tabbableGroups.length<=0&&!F("fallbackFocus"))throw new Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times")},y=function n(t){!1!==t&&t!==d.activeElement&&(t&&t.focus?(t.focus({preventScroll:!!p.preventScroll}),h.mostRecentlyFocusedNode=t,function(n){return n.tagName&&"input"===n.tagName.toLowerCase()&&"function"==typeof n.select}(t)&&t.select()):n(O()))},k=function(n){var t=F("setReturnFocus",n);return t||!1!==t&&n},T=function(n){var t=v(n);m(t)>=0||(s(p.clickOutsideDeactivates,n)?b.deactivate({returnFocus:p.returnFocusOnDeactivate&&!r(t,p.tabbableOptions)}):s(p.allowOutsideClick,n)||n.preventDefault())},E=function(n){var t=v(n),e=m(t)>=0;e||t instanceof Document?e&&(h.mostRecentlyFocusedNode=t):(n.stopImmediatePropagation(),y(h.mostRecentlyFocusedNode||O()))},D=function(n){if(function(n){return"Escape"===n.key||"Esc"===n.key||27===n.keyCode}(n)&&!1!==s(p.escapeDeactivates,n))return n.preventDefault(),void b.deactivate();(function(n){return"Tab"===n.key||9===n.keyCode})(n)&&function(n){var t=v(n);j();var o=null;if(h.tabbableGroups.length>0){var u=m(t),i=u>=0?h.containerGroups[u]:void 0;if(u<0)o=n.shiftKey?h.tabbableGroups[h.tabbableGroups.length-1].lastTabbableNode:h.tabbableGroups[0].firstTabbableNode;else if(n.shiftKey){var a=f(h.tabbableGroups,(function(n){return t===n.firstTabbableNode}));a<0&&(i.container===t||r(t,p.tabbableOptions)&&!e(t,p.tabbableOptions)&&!i.nextTabbableNode(t,!1))&&(a=u),a>=0&&(o=h.tabbableGroups[0===a?h.tabbableGroups.length-1:a-1].lastTabbableNode)}else{var c=f(h.tabbableGroups,(function(n){return t===n.lastTabbableNode}));c<0&&(i.container===t||r(t,p.tabbableOptions)&&!e(t,p.tabbableOptions)&&!i.nextTabbableNode(t))&&(c=u),c>=0&&(o=h.tabbableGroups[c===h.tabbableGroups.length-1?0:c+1].firstTabbableNode)}}else o=F("fallbackFocus");o&&(n.preventDefault(),y(o))}(n)},N=function(n){if(!s(p.clickOutsideDeactivates,n)){var t=v(n);m(t)>=0||s(p.allowOutsideClick,n)||(n.preventDefault(),n.stopImmediatePropagation())}},A=function(){if(h.active)return a.activateTrap(b),h.delayInitialFocusTimer=p.delayInitialFocus?c((function(){y(O())})):y(O()),d.addEventListener("focusin",E,!0),d.addEventListener("mousedown",T,{capture:!0,passive:!1}),d.addEventListener("touchstart",T,{capture:!0,passive:!1}),d.addEventListener("click",N,{capture:!0,passive:!1}),d.addEventListener("keydown",D,{capture:!0,passive:!1}),b},g=function(){if(h.active)return d.removeEventListener("focusin",E,!0),d.removeEventListener("mousedown",T,!0),d.removeEventListener("touchstart",T,!0),d.removeEventListener("click",N,!0),d.removeEventListener("keydown",D,!0),b};return(b={activate:function(n){if(h.active)return this;var t=w(n,"onActivate"),e=w(n,"onPostActivate"),r=w(n,"checkCanFocusTrap");r||j(),h.active=!0,h.paused=!1,h.nodeFocusedBeforeActivation=d.activeElement,t&&t();var o=function(){r&&j(),A(),e&&e()};return r?(r(h.containers.concat()).then(o,o),this):(o(),this)},deactivate:function(n){if(!h.active)return this;clearTimeout(h.delayInitialFocusTimer),h.delayInitialFocusTimer=void 0,g(),h.active=!1,h.paused=!1,a.deactivateTrap(b);var t=w(n,"onDeactivate"),e=w(n,"onPostDeactivate"),r=w(n,"checkCanReturnFocus");t&&t();var o=w(n,"returnFocus","returnFocusOnDeactivate"),u=function(){c((function(){o&&y(k(h.nodeFocusedBeforeActivation)),e&&e()}))};return o&&r?(r(k(h.nodeFocusedBeforeActivation)).then(u,u),this):(u(),this)},pause:function(){return h.paused||!h.active||(h.paused=!0,g()),this},unpause:function(){return h.paused&&h.active?(h.paused=!1,j(),A(),this):this},updateContainerElements:function(n){var t=[].concat(n).filter(Boolean);return h.containers=t.map((function(n){return"string"==typeof n?d.querySelector(n):n})),h.active&&j(),this}}).updateContainerElements(i),b};export{l as c}