@dso-toolkit/core 68.4.0 → 69.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/annotation-list-renvooi-values-9836dd5d.js +13 -0
- package/dist/cjs/annotation-list-renvooi-values-9836dd5d.js.map +1 -0
- package/dist/cjs/dso-accordion-section.cjs.entry.js +26 -6
- package/dist/cjs/dso-accordion-section.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-alert_6.cjs.entry.js +19 -6
- package/dist/cjs/dso-alert_6.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-annotation-activiteit.cjs.entry.js +2 -1
- package/dist/cjs/dso-annotation-activiteit.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-annotation-locatie_2.cjs.entry.js +1 -1
- package/dist/cjs/dso-annotation-locatie_2.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-annotation-omgevingsnormwaarde.cjs.entry.js +2 -1
- package/dist/cjs/dso-annotation-omgevingsnormwaarde.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-dropdown-menu.cjs.entry.js +1 -1
- package/dist/cjs/dso-helpcenter-panel.cjs.entry.js +2 -2
- package/dist/cjs/dso-highlight-box.cjs.entry.js +1 -1
- package/dist/cjs/dso-icon.cjs.entry.js +1 -1
- package/dist/cjs/dso-info-button.cjs.entry.js +1 -1
- package/dist/cjs/dso-info_2.cjs.entry.js +1 -1
- package/dist/cjs/dso-input-range.cjs.entry.js +2 -2
- package/dist/cjs/dso-label_3.cjs.entry.js +196 -0
- package/dist/cjs/dso-label_3.cjs.entry.js.map +1 -0
- package/dist/cjs/dso-legend-item.cjs.entry.js +2 -2
- package/dist/cjs/dso-list-button.cjs.entry.js +2 -2
- package/dist/cjs/dso-list-button.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-logo.cjs.entry.js +1 -1
- package/dist/cjs/dso-map-base-layers.cjs.entry.js +1 -1
- package/dist/cjs/dso-map-controls.cjs.entry.js +1 -1
- package/dist/cjs/dso-map-overlays.cjs.entry.js +1 -1
- package/dist/cjs/dso-mark-bar.cjs.entry.js +1 -1
- package/dist/cjs/dso-modal.cjs.entry.js +2 -2
- package/dist/cjs/dso-plekinfo-card.cjs.entry.js +1 -1
- package/dist/cjs/dso-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/dso-progress-indicator.cjs.entry.js +1 -1
- package/dist/cjs/dso-project-item.cjs.entry.js +1 -1
- package/dist/cjs/dso-toolkit.cjs.js +1 -1
- package/dist/cjs/{dso-label_2.cjs.entry.js → dso-tooltip.cjs.entry.js} +8 -123
- package/dist/cjs/dso-tooltip.cjs.entry.js.map +1 -0
- package/dist/cjs/dsot-document-component-demo.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/accordion/components/accordion-section.css +44 -10
- package/dist/collection/components/accordion/components/accordion-section.interfaces.js.map +1 -1
- package/dist/collection/components/accordion/components/accordion-section.js +85 -5
- package/dist/collection/components/accordion/components/accordion-section.js.map +1 -1
- package/dist/collection/components/annotation/annotation-activiteit/annotation-activiteit.js +2 -1
- package/dist/collection/components/annotation/annotation-activiteit/annotation-activiteit.js.map +1 -1
- package/dist/collection/components/annotation/annotation-list-renvooi-values.js +5 -0
- package/dist/collection/components/annotation/annotation-list-renvooi-values.js.map +1 -0
- package/dist/collection/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.js +2 -1
- package/dist/collection/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.js.map +1 -1
- package/dist/collection/components/document-component/document-component.js +38 -4
- package/dist/collection/components/document-component/document-component.js.map +1 -1
- package/dist/collection/components/document-component/document-component.models.js.map +1 -1
- package/dist/collection/components/document-component-demo/document-component.demo.js +1 -1
- package/dist/collection/components/dropdown-menu/dropdown-menu.js +1 -1
- package/dist/collection/components/helpcenter-panel/helpcenter-panel.js +2 -2
- package/dist/collection/components/highlight-box/highlight-box.js +1 -1
- package/dist/collection/components/icon/icon.js +1 -1
- package/dist/collection/components/info/info.js +1 -1
- package/dist/collection/components/info-button/info-button.js +1 -1
- package/dist/collection/components/input-range/input-range.js +2 -2
- package/dist/collection/components/label/label.js +3 -3
- package/dist/collection/components/legend-item/legend-item.js +2 -2
- package/dist/collection/components/list-button/list-button.css +0 -7
- package/dist/collection/components/list-button/list-button.js +1 -1
- package/dist/collection/components/logo/logo.js +1 -1
- package/dist/collection/components/map-base-layers/map-base-layers.js +1 -1
- package/dist/collection/components/map-controls/map-controls.js +1 -1
- package/dist/collection/components/map-overlays/map-overlays.js +1 -1
- package/dist/collection/components/mark-bar/mark-bar.js +1 -1
- package/dist/collection/components/modal/modal.js +2 -2
- package/dist/collection/components/ozon-content/nodes/{opschrift.node.js → kop.node.js} +3 -3
- package/dist/collection/components/ozon-content/nodes/kop.node.js.map +1 -0
- package/dist/collection/components/ozon-content/ozon-content-context.interface.js.map +1 -1
- package/dist/collection/components/ozon-content/ozon-content-mapper.js +8 -4
- package/dist/collection/components/ozon-content/ozon-content-mapper.js.map +1 -1
- package/dist/collection/components/ozon-content/ozon-content.js +26 -1
- package/dist/collection/components/ozon-content/ozon-content.js.map +1 -1
- package/dist/collection/components/plekinfo-card/plekinfo-card.js +1 -1
- package/dist/collection/components/progress-bar/progress-bar.js +1 -1
- package/dist/collection/components/progress-indicator/progress-indicator.js +1 -1
- package/dist/collection/components/project-item/project-item.js +1 -1
- package/dist/collection/components/renvooi/renvooi.js +8 -5
- package/dist/collection/components/renvooi/renvooi.js.map +1 -1
- package/dist/components/annotation-list-renvooi-values.js +11 -0
- package/dist/components/annotation-list-renvooi-values.js.map +1 -0
- package/dist/components/document-component.js +2 -1
- package/dist/components/document-component.js.map +1 -1
- package/dist/components/dropdown-menu.js +1 -1
- package/dist/components/dso-accordion-section.js +44 -16
- package/dist/components/dso-accordion-section.js.map +1 -1
- package/dist/components/dso-annotation-activiteit.js +2 -1
- package/dist/components/dso-annotation-activiteit.js.map +1 -1
- package/dist/components/dso-annotation-omgevingsnormwaarde.js +2 -1
- package/dist/components/dso-annotation-omgevingsnormwaarde.js.map +1 -1
- package/dist/components/dso-helpcenter-panel.js +2 -2
- package/dist/components/dso-highlight-box.js +1 -1
- package/dist/components/dso-input-range.js +2 -2
- package/dist/components/dso-legend-item.js +2 -2
- package/dist/components/dso-list-button.js +2 -2
- package/dist/components/dso-list-button.js.map +1 -1
- package/dist/components/dso-logo.js +1 -1
- package/dist/components/dso-map-base-layers.js +1 -1
- package/dist/components/dso-map-controls.js +1 -1
- package/dist/components/dso-map-overlays.js +1 -1
- package/dist/components/dso-mark-bar.js +1 -1
- package/dist/components/dso-modal.js +2 -2
- package/dist/components/dso-plekinfo-card.js +1 -1
- package/dist/components/dso-progress-bar.js +1 -1
- package/dist/components/dso-project-item.js +1 -1
- package/dist/components/dsot-document-component-demo.js +1 -1
- package/dist/components/icon.js +1 -1
- package/dist/components/info-button.js +1 -1
- package/dist/components/info.js +1 -1
- package/dist/components/label.js +3 -3
- package/dist/components/ozon-content.js +20 -6
- package/dist/components/ozon-content.js.map +1 -1
- package/dist/components/progress-indicator.js +1 -1
- package/dist/components/renvooi.js +8 -5
- package/dist/components/renvooi.js.map +1 -1
- package/dist/dso-toolkit/dso-toolkit.esm.js +1 -1
- package/dist/dso-toolkit/dso-toolkit.esm.js.map +1 -1
- package/dist/dso-toolkit/{p-b3deb707.entry.js → p-0499bdce.entry.js} +2 -2
- package/dist/dso-toolkit/p-0499bdce.entry.js.map +1 -0
- package/dist/dso-toolkit/{p-a6df0d43.entry.js → p-1746cde9.entry.js} +2 -2
- package/dist/dso-toolkit/p-1746cde9.entry.js.map +1 -0
- package/dist/dso-toolkit/{p-f1dc313d.entry.js → p-1ec998ba.entry.js} +2 -2
- package/dist/dso-toolkit/{p-35186e39.entry.js → p-236e6d02.entry.js} +2 -2
- package/dist/dso-toolkit/p-276777d7.entry.js +2 -0
- package/dist/dso-toolkit/p-276777d7.entry.js.map +1 -0
- package/dist/dso-toolkit/{p-ad38ad02.entry.js → p-40d7c6bf.entry.js} +2 -2
- package/dist/dso-toolkit/p-4549dc10.entry.js +2 -0
- package/dist/dso-toolkit/p-4549dc10.entry.js.map +1 -0
- package/dist/dso-toolkit/{p-ee7e35f5.entry.js → p-4bcf2efb.entry.js} +2 -2
- package/dist/dso-toolkit/{p-7e626a87.entry.js → p-4e8fa5f6.entry.js} +2 -2
- package/dist/dso-toolkit/p-55306107.entry.js +2 -0
- package/dist/dso-toolkit/{p-fccb414d.entry.js.map → p-55306107.entry.js.map} +1 -1
- package/dist/dso-toolkit/{p-faa6b9d5.entry.js → p-5ec31b61.entry.js} +2 -2
- package/dist/dso-toolkit/{p-8b5409ad.entry.js → p-60e40f8f.entry.js} +2 -2
- package/dist/dso-toolkit/p-631af6b1.entry.js +2 -0
- package/dist/dso-toolkit/p-631af6b1.entry.js.map +1 -0
- package/dist/dso-toolkit/p-8597633a.entry.js +2 -0
- package/dist/dso-toolkit/{p-1aefb8a6.entry.js.map → p-8597633a.entry.js.map} +1 -1
- package/dist/dso-toolkit/{p-e19e851b.entry.js → p-943ad4a8.entry.js} +2 -2
- package/dist/dso-toolkit/{p-80c945ed.entry.js → p-984d922e.entry.js} +2 -2
- package/dist/dso-toolkit/{p-d9cb06fc.entry.js → p-99d7326e.entry.js} +2 -2
- package/dist/dso-toolkit/{p-007802e5.entry.js → p-9d176f6f.entry.js} +2 -2
- package/dist/dso-toolkit/{p-3be76968.entry.js → p-a496f58f.entry.js} +2 -2
- package/dist/dso-toolkit/{p-8a3e9f50.entry.js → p-b57af35d.entry.js} +2 -2
- package/dist/dso-toolkit/p-b5c5ca39.entry.js +2 -0
- package/dist/dso-toolkit/{p-9dbebb2e.entry.js.map → p-b5c5ca39.entry.js.map} +1 -1
- package/dist/dso-toolkit/p-b73839a2.js +2 -0
- package/dist/dso-toolkit/p-b73839a2.js.map +1 -0
- package/dist/dso-toolkit/p-beaa587d.entry.js +2 -0
- package/dist/dso-toolkit/p-beaa587d.entry.js.map +1 -0
- package/dist/dso-toolkit/{p-8cc798d5.entry.js → p-cf32927d.entry.js} +2 -2
- package/dist/dso-toolkit/p-d343ecd3.entry.js +2 -0
- package/dist/dso-toolkit/p-d343ecd3.entry.js.map +1 -0
- package/dist/dso-toolkit/p-d51d44f7.entry.js +2 -0
- package/dist/dso-toolkit/p-d51d44f7.entry.js.map +1 -0
- package/dist/dso-toolkit/{p-a341b666.entry.js → p-ed33d023.entry.js} +2 -2
- package/dist/dso-toolkit/{p-7e2c9463.entry.js → p-fed0928b.entry.js} +2 -2
- package/dist/esm/annotation-list-renvooi-values-ed9c0ff3.js +11 -0
- package/dist/esm/annotation-list-renvooi-values-ed9c0ff3.js.map +1 -0
- package/dist/esm/dso-accordion-section.entry.js +26 -6
- package/dist/esm/dso-accordion-section.entry.js.map +1 -1
- package/dist/esm/dso-alert_6.entry.js +19 -6
- package/dist/esm/dso-alert_6.entry.js.map +1 -1
- package/dist/esm/dso-annotation-activiteit.entry.js +2 -1
- package/dist/esm/dso-annotation-activiteit.entry.js.map +1 -1
- package/dist/esm/dso-annotation-locatie_2.entry.js +1 -1
- package/dist/esm/dso-annotation-locatie_2.entry.js.map +1 -1
- package/dist/esm/dso-annotation-omgevingsnormwaarde.entry.js +2 -1
- package/dist/esm/dso-annotation-omgevingsnormwaarde.entry.js.map +1 -1
- package/dist/esm/dso-dropdown-menu.entry.js +1 -1
- package/dist/esm/dso-helpcenter-panel.entry.js +2 -2
- package/dist/esm/dso-highlight-box.entry.js +1 -1
- package/dist/esm/dso-icon.entry.js +1 -1
- package/dist/esm/dso-info-button.entry.js +1 -1
- package/dist/esm/dso-info_2.entry.js +1 -1
- package/dist/esm/dso-input-range.entry.js +2 -2
- package/dist/esm/dso-label_3.entry.js +190 -0
- package/dist/esm/dso-label_3.entry.js.map +1 -0
- package/dist/esm/dso-legend-item.entry.js +2 -2
- package/dist/esm/dso-list-button.entry.js +2 -2
- package/dist/esm/dso-list-button.entry.js.map +1 -1
- package/dist/esm/dso-logo.entry.js +1 -1
- package/dist/esm/dso-map-base-layers.entry.js +1 -1
- package/dist/esm/dso-map-controls.entry.js +1 -1
- package/dist/esm/dso-map-overlays.entry.js +1 -1
- package/dist/esm/dso-mark-bar.entry.js +1 -1
- package/dist/esm/dso-modal.entry.js +2 -2
- package/dist/esm/dso-plekinfo-card.entry.js +1 -1
- package/dist/esm/dso-progress-bar.entry.js +1 -1
- package/dist/esm/dso-progress-indicator.entry.js +1 -1
- package/dist/esm/dso-project-item.entry.js +1 -1
- package/dist/esm/dso-toolkit.js +1 -1
- package/dist/esm/{dso-label_2.entry.js → dso-tooltip.entry.js} +4 -118
- package/dist/esm/dso-tooltip.entry.js.map +1 -0
- package/dist/esm/dsot-document-component-demo.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/accordion/components/accordion-section.d.ts +16 -1
- package/dist/types/components/accordion/components/accordion-section.interfaces.d.ts +11 -0
- package/dist/types/components/annotation/annotation-list-renvooi-values.d.ts +7 -0
- package/dist/types/components/document-component/document-component.d.ts +7 -0
- package/dist/types/components/document-component/document-component.models.d.ts +1 -1
- package/dist/types/components/ozon-content/nodes/{opschrift.node.d.ts → kop.node.d.ts} +2 -2
- package/dist/types/components/ozon-content/ozon-content-context.interface.d.ts +1 -0
- package/dist/types/components/ozon-content/ozon-content.d.ts +4 -0
- package/dist/types/components/renvooi/renvooi.d.ts +1 -0
- package/dist/types/components.d.ts +45 -2
- package/package.json +3 -3
- package/dist/cjs/dso-label_2.cjs.entry.js.map +0 -1
- package/dist/cjs/dso-renvooi_2.cjs.entry.js +0 -76
- package/dist/cjs/dso-renvooi_2.cjs.entry.js.map +0 -1
- package/dist/collection/components/ozon-content/nodes/opschrift.node.js.map +0 -1
- package/dist/dso-toolkit/p-1a3140fc.entry.js +0 -2
- package/dist/dso-toolkit/p-1a3140fc.entry.js.map +0 -1
- package/dist/dso-toolkit/p-1aefb8a6.entry.js +0 -2
- package/dist/dso-toolkit/p-4b70b133.entry.js +0 -2
- package/dist/dso-toolkit/p-4b70b133.entry.js.map +0 -1
- package/dist/dso-toolkit/p-6fe845b2.entry.js +0 -2
- package/dist/dso-toolkit/p-6fe845b2.entry.js.map +0 -1
- package/dist/dso-toolkit/p-7fa13a99.entry.js +0 -2
- package/dist/dso-toolkit/p-7fa13a99.entry.js.map +0 -1
- package/dist/dso-toolkit/p-9dbebb2e.entry.js +0 -2
- package/dist/dso-toolkit/p-a6df0d43.entry.js.map +0 -1
- package/dist/dso-toolkit/p-b3deb707.entry.js.map +0 -1
- package/dist/dso-toolkit/p-d8c11809.entry.js +0 -2
- package/dist/dso-toolkit/p-d8c11809.entry.js.map +0 -1
- package/dist/dso-toolkit/p-fca1f5bd.entry.js +0 -2
- package/dist/dso-toolkit/p-fca1f5bd.entry.js.map +0 -1
- package/dist/dso-toolkit/p-fccb414d.entry.js +0 -2
- package/dist/esm/dso-label_2.entry.js.map +0 -1
- package/dist/esm/dso-renvooi_2.entry.js +0 -71
- package/dist/esm/dso-renvooi_2.entry.js.map +0 -1
- /package/dist/dso-toolkit/{p-f1dc313d.entry.js.map → p-1ec998ba.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-35186e39.entry.js.map → p-236e6d02.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-ad38ad02.entry.js.map → p-40d7c6bf.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-ee7e35f5.entry.js.map → p-4bcf2efb.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-7e626a87.entry.js.map → p-4e8fa5f6.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-faa6b9d5.entry.js.map → p-5ec31b61.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-8b5409ad.entry.js.map → p-60e40f8f.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-e19e851b.entry.js.map → p-943ad4a8.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-80c945ed.entry.js.map → p-984d922e.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-d9cb06fc.entry.js.map → p-99d7326e.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-007802e5.entry.js.map → p-9d176f6f.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-3be76968.entry.js.map → p-a496f58f.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-8a3e9f50.entry.js.map → p-b57af35d.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-8cc798d5.entry.js.map → p-cf32927d.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-a341b666.entry.js.map → p-ed33d023.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-7e2c9463.entry.js.map → p-fed0928b.entry.js.map} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stateMap","success","info","warning","danger","error","accordionSectionCss","DsoAccordionSectionStyle0","log","window","console","bind","HandleElement","handleUrl","onClick","open","handleElementRef","children","h","href","ref","type","Handle","heading","class","HandleIcon","state","icon","attachmentCount","HandleStateIcon","count","AccordionSection","constructor","hostRef","this","hasNestedAccordion","hover","handleClick","event","dsoToggleClick","emit","originalEvent","handleExpandableAnimationStart","e","dsoAnimationStart","animation","scrollIntoView","behavior","detail","bodyHeight","handleExpandableAnimationEnd","dsoAnimationEnd","focusHandle","_a","focus","containsNestedAccordion","host","querySelector","componentWillLoad","accordion","_getState","then","accordionState","forceUpdate","isNeutral","variant","JSON","stringify","bodyClientRect","sectionBody","getBoundingClientRect","headingClientRect","_b","sectionHeading","sectionBottomY","top","height","innerHeight","box","scrollTop","scrollY","document","documentElement","body","clientTop","expandedAccordionHeight","shouldScrollToTopOfSection","scrollTo","closest","render","reverseAlign","hasAddons","statusDescription","status","Host","key","wijzigactie","hidden","onMouseenter","onMouseleave","element","Fragment","value","handleTitle","label","labelStatus","compact","enableAnimation","minimumHeight","onDsoExpandableAnimationStart","onDsoExpandableAnimationEnd"],"sources":["src/components/accordion/components/accordion-section.interfaces.ts","src/components/accordion/components/accordion-section.scss?tag=dso-accordion-section&encapsulation=shadow","src/components/accordion/components/accordion-section.tsx"],"sourcesContent":["export type AccordionSectionState = \"success\" | \"info\" | \"warning\" | \"danger\" | \"error\";\r\n\r\nexport type AccordionHeading = \"h2\" | \"h3\" | \"h4\" | \"h5\";\r\n\r\nexport type AccordionSectionWijzigactie = \"voegtoe\" | \"verwijder\";\r\n\r\nexport const stateMap: Record<AccordionSectionState, string> = {\r\n success: \"succes:\",\r\n info: \"info:\",\r\n warning: \"waarschuwing:\",\r\n danger: \"fout:\",\r\n error: \"fout:\",\r\n};\r\n\r\nexport interface AccordionSectionToggleClickEvent {\r\n /**\r\n * The original MouseEvent that triggered the click.\r\n *\r\n * In case the Section Handle is an <a> this event can be used to preventDefault() so the framework router is reponsible for navigating the user.\r\n */\r\n originalEvent?: MouseEvent;\r\n\r\n /**\r\n * The requested state. If the Accordion Section is closed, `open = true`.\r\n */\r\n open: boolean;\r\n}\r\n\r\nexport interface AccordionSectionAnimationStartEvent {\r\n /**\r\n * Helper function to scroll the Accordion Section into view.\r\n */\r\n scrollIntoView(behavior?: ScrollBehavior): void;\r\n\r\n /**\r\n * Whether or not the Accordion opening or closing.\r\n */\r\n animation: \"opening\" | \"closing\";\r\n}\r\n\r\nexport interface AccordionSectionAnimationEndEvent {\r\n /**\r\n * Helper function to scroll the Accordion Section into view.\r\n */\r\n scrollIntoView(behavior?: ScrollBehavior): void;\r\n\r\n /**\r\n * The state of the Accordion Section after animation.\r\n */\r\n open: boolean;\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n\r\n@use \"~dso-toolkit/src/components/accordion\";\r\n@use \"~dso-toolkit/src/components/anchor\";\r\n\r\n@use \"accordion-section-theme-compact\";\r\n@use \"accordion-section-theme-compact-black\";\r\n@use \"accordion-section-theme-conclusion\";\r\n@use \"accordion-section-theme-default\";\r\n@use \"accordion-section-theme-neutral\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n.sr-only {\r\n @include utilities.sr-only();\r\n}\r\n\r\n:host {\r\n display: block;\r\n\r\n .dso-section-handle {\r\n font-size: 1em;\r\n font-weight: 600;\r\n line-height: accordion.$handle-line-height;\r\n margin: 0;\r\n position: relative;\r\n\r\n > a:active {\r\n text-decoration: none;\r\n }\r\n\r\n a {\r\n @include anchor.clean();\r\n }\r\n\r\n .dso-status {\r\n font-weight: 400;\r\n text-decoration: underline;\r\n }\r\n }\r\n\r\n .dso-section-handle > button,\r\n .dso-section-handle > a {\r\n align-items: flex-start;\r\n background-color: transparent;\r\n border: 0;\r\n cursor: pointer;\r\n display: flex;\r\n font-family: typography.$font-family-base;\r\n font-size: 1em;\r\n font-weight: 600;\r\n line-height: accordion.$handle-line-height;\r\n margin: 0;\r\n padding-block: accordion.$block-padding;\r\n padding-inline: accordion.$inline-padding;\r\n text-align: start;\r\n inline-size: 100%;\r\n word-break: break-word;\r\n\r\n dso-icon {\r\n flex-shrink: 0;\r\n\r\n &.dso-section-handle-chevron {\r\n @include utilities.transition(transform);\r\n\r\n transform: rotate(0);\r\n }\r\n }\r\n\r\n > .dso-section-handle-addons:first-child,\r\n > dso-icon:first-child {\r\n margin-inline-end: units.$u1;\r\n }\r\n\r\n > dso-icon:last-child {\r\n margin-inline-start: auto;\r\n }\r\n\r\n > .dso-section-handle-addons:last-child {\r\n margin-inline-start: auto;\r\n\r\n dso-attachments-counter,\r\n dso-icon {\r\n margin-inline-start: units.$u2;\r\n }\r\n }\r\n\r\n > dso-label {\r\n margin-inline-start: auto;\r\n padding-inline-start: units.$u1;\r\n word-break: normal;\r\n\r\n & + dso-icon:last-child,\r\n & + .dso-section-handle-addons:last-child {\r\n margin-inline-start: units.$u1;\r\n }\r\n }\r\n }\r\n}\r\n\r\n:host([open]:not([open=\"false\"])) {\r\n .dso-section-handle {\r\n > button,\r\n > a {\r\n .dso-section-handle-chevron {\r\n &:first-child {\r\n transform: rotate(90deg);\r\n }\r\n\r\n &:last-child {\r\n transform: rotate(-180deg);\r\n }\r\n }\r\n }\r\n }\r\n}\r\n\r\n.dso-section-body {\r\n background-color: colors.$wit;\r\n border-block-start: 0;\r\n margin-block-start: accordion.$border-radius * -1;\r\n\r\n .dso-section-body-content {\r\n padding-block: units.$u2 + accordion.$border-radius units.$u2;\r\n padding-inline: units.$u2;\r\n }\r\n}\r\n\r\n// Default\r\n:host(.dso-accordion-default) {\r\n @include accordion-section-theme-default.dso-web-component-accordion-default();\r\n}\r\n\r\n:host(.dso-accordion-default[open]:not([open=\"false\"])) {\r\n @include accordion-section-theme-default.dso-web-component-accordion-default-open();\r\n}\r\n\r\n:host(.dso-accordion-default.dso-nested-accordion[open]:not([open=\"false\"])) {\r\n @include accordion-section-theme-default.dso-web-component-accordion-default-open-nested();\r\n}\r\n\r\n// Compact\r\n:host(.dso-accordion-compact) {\r\n @include accordion-section-theme-compact.dso-web-component-accordion-compact();\r\n}\r\n\r\n:host(.dso-accordion-compact.dso-accordion-reverse-align) {\r\n @include accordion-section-theme-compact.dso-web-component-accordion-compact-reverse();\r\n}\r\n\r\n:host(.dso-accordion-compact[open]:not([open=\"false\"]):not(.dso-nested-accordion)) {\r\n @include accordion-section-theme-compact.dso-web-component-accordion-compact-open();\r\n}\r\n\r\n:host(.dso-accordion-compact.dso-nested-accordion[open]:not([open=\"false\"])) {\r\n @include accordion-section-theme-compact.dso-web-component-accordion-compact-open-nested();\r\n}\r\n\r\n// Compact black\r\n:host(.dso-accordion-compact-black) {\r\n @include accordion-section-theme-compact-black.dso-web-component-accordion-compact-black();\r\n}\r\n\r\n:host(.dso-accordion-compact-black.dso-accordion-wijzigactie-voegtoe) {\r\n @include accordion-section-theme-compact-black.dso-web-component-accordion-compact-black-voegtoe();\r\n}\r\n\r\n:host(.dso-accordion-compact-black.dso-accordion-wijzigactie-verwijder) {\r\n @include accordion-section-theme-compact-black.dso-web-component-accordion-compact-black-verwijder();\r\n}\r\n\r\n:host(.dso-accordion-compact-black.dso-accordion-reverse-align) {\r\n @include accordion-section-theme-compact-black.dso-web-component-accordion-compact-black-reverse();\r\n}\r\n\r\n:host(.dso-accordion-compact-black[open]:not([open=\"false\"])) {\r\n @include accordion-section-theme-compact-black.dso-web-component-accordion-compact-black-open();\r\n}\r\n\r\n:host(.dso-accordion-compact-black.dso-nested-accordion[open]:not([open=\"false\"])) {\r\n @include accordion-section-theme-compact-black.dso-web-component-accordion-compact-black-open-nested();\r\n}\r\n\r\n// Conclusion\r\n:host(.dso-accordion-conclusion) {\r\n @include accordion-section-theme-conclusion.dso-web-component-accordion-conclusion();\r\n}\r\n\r\n:host(.dso-accordion-conclusion[open]:not([open=\"false\"]):not(.dso-nested-accordion)) {\r\n @include accordion-section-theme-conclusion.dso-web-component-accordion-conclusion-open();\r\n}\r\n\r\n:host(.dso-accordion-conclusion.dso-nested-accordion[open]:not([open=\"false\"])) {\r\n @include accordion-section-theme-conclusion.dso-web-component-accordion-conclusion-open-nested();\r\n}\r\n\r\n// Neutral\r\n:host(.dso-accordion-neutral) {\r\n @include accordion-section-theme-neutral.dso-web-component-accordion-neutral();\r\n}\r\n\r\n:host(.dso-accordion-neutral[open]:not([open=\"false\"])) {\r\n @include accordion-section-theme-neutral.dso-web-component-accordion-neutral-open();\r\n}\r\n\r\n:host(.dso-accordion-neutral.dso-nested-accordion[open]:not([open=\"false\"])) {\r\n @include accordion-section-theme-neutral.dso-web-component-accordion-neutral-open-nested();\r\n}\r\n","import {\r\n Component,\r\n ComponentInterface,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n forceUpdate,\r\n Fragment,\r\n FunctionalComponent,\r\n h,\r\n Host,\r\n Method,\r\n Prop,\r\n State,\r\n} from \"@stencil/core\";\r\n\r\nimport { AccordionInternalState } from \"../accordion.interfaces\";\r\nimport {\r\n AccordionHeading,\r\n AccordionSectionAnimationEndEvent,\r\n AccordionSectionAnimationStartEvent,\r\n AccordionSectionState,\r\n AccordionSectionToggleClickEvent,\r\n AccordionSectionWijzigactie,\r\n stateMap,\r\n} from \"./accordion-section.interfaces\";\r\nimport { ExpandableAnimationEndEvent } from \"../../expandable/expandable\";\r\nimport { LabelStatus } from \"../../label/label.interfaces\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\n\r\n// eslint-disable-next-line no-console\r\nconst log = (window as any)[\"_dsoLog\"] === true ? console.log.bind(console.log) : function () {};\r\n\r\nconst HandleElement: FunctionalComponent<{\r\n handleUrl: string | undefined;\r\n open: boolean;\r\n handleElementRef: (element: HTMLAnchorElement | HTMLButtonElement | undefined) => void;\r\n onClick: (e: MouseEvent) => void;\r\n}> = ({ handleUrl, onClick, open, handleElementRef }, children) => {\r\n if (handleUrl) {\r\n return (\r\n <a href={handleUrl} onClick={onClick} aria-expanded={open ? \"true\" : \"false\"} ref={handleElementRef}>\r\n {children}\r\n </a>\r\n );\r\n }\r\n\r\n return (\r\n <button type=\"button\" onClick={onClick} aria-expanded={open ? \"true\" : \"false\"} ref={handleElementRef}>\r\n {children}\r\n </button>\r\n );\r\n};\r\n\r\nconst Handle: FunctionalComponent<{\r\n heading: AccordionHeading;\r\n ref: (element: HTMLHeadingElement | undefined) => void;\r\n}> = ({ heading, ref }, children) => {\r\n switch (heading) {\r\n default:\r\n case \"h2\":\r\n return (\r\n <h2 ref={ref} class=\"dso-section-handle\">\r\n {children}\r\n </h2>\r\n );\r\n case \"h3\":\r\n return (\r\n <h3 ref={ref} class=\"dso-section-handle\">\r\n {children}\r\n </h3>\r\n );\r\n case \"h4\":\r\n return (\r\n <h4 ref={ref} class=\"dso-section-handle\">\r\n {children}\r\n </h4>\r\n );\r\n case \"h5\":\r\n return (\r\n <h5 ref={ref} class=\"dso-section-handle\">\r\n {children}\r\n </h5>\r\n );\r\n }\r\n};\r\n\r\nconst HandleIcon: FunctionalComponent<{\r\n state?: AccordionSectionState;\r\n icon?: string;\r\n attachmentCount?: number;\r\n}> = ({ state, icon, attachmentCount }) => {\r\n if (state) {\r\n return <HandleStateIcon state={state} />;\r\n }\r\n\r\n if (attachmentCount) {\r\n return <dso-attachments-counter count={attachmentCount}></dso-attachments-counter>;\r\n }\r\n\r\n if (icon) {\r\n return <dso-icon icon={icon}></dso-icon>;\r\n }\r\n};\r\n\r\nconst HandleStateIcon: FunctionalComponent<{ state: AccordionSectionState }> = ({ state }) => {\r\n if (state === \"error\") {\r\n return <dso-icon icon=\"status-error\"></dso-icon>;\r\n }\r\n\r\n if (state === \"danger\") {\r\n return <dso-icon icon=\"status-danger\"></dso-icon>;\r\n }\r\n\r\n if (state === \"success\") {\r\n return <dso-icon icon=\"status-success\"></dso-icon>;\r\n }\r\n\r\n if (state === \"info\") {\r\n return <dso-icon icon=\"status-info\"></dso-icon>;\r\n }\r\n\r\n if (state === \"warning\") {\r\n return <dso-icon icon=\"status-warning\"></dso-icon>;\r\n }\r\n};\r\n\r\n@Component({\r\n tag: \"dso-accordion-section\",\r\n styleUrl: \"accordion-section.scss\",\r\n shadow: true,\r\n})\r\nexport class AccordionSection implements ComponentInterface {\r\n private accordionState?: AccordionInternalState;\r\n\r\n private sectionBody?: HTMLDivElement;\r\n\r\n private sectionHeading?: HTMLHeadingElement;\r\n\r\n @Element()\r\n host!: HTMLDsoAccordionSectionElement;\r\n\r\n /**\r\n * The title of the handle\r\n */\r\n @Prop()\r\n handleTitle!: RenvooiValue | undefined;\r\n\r\n /**\r\n * An optional 'wijzigactie' that signals if the section is added or removed.\r\n */\r\n @Prop()\r\n wijzigactie?: AccordionSectionWijzigactie;\r\n\r\n /**\r\n * Which heading element to use.\r\n */\r\n @Prop()\r\n heading: AccordionHeading = \"h2\";\r\n\r\n /**\r\n * When set the handle will render as a `<a>`. When undefined it renders as a `<button>`\r\n */\r\n @Prop()\r\n handleUrl?: string;\r\n\r\n /**\r\n * `state` takes precedence over `attachmentCount` and `icon`\r\n */\r\n @Prop()\r\n status?: AccordionSectionState;\r\n\r\n /**\r\n * `attachmentCount` takes precedence over `icon`\r\n */\r\n @Prop()\r\n attachmentCount?: number;\r\n\r\n /**\r\n * To set an icon in the heading handle.\r\n */\r\n @Prop()\r\n icon?: string;\r\n\r\n /**\r\n * The status of the section.\r\n */\r\n @Prop()\r\n statusDescription?: string;\r\n\r\n /**\r\n * Set the Accordion Section open.\r\n */\r\n @Prop({ reflect: true })\r\n open = false;\r\n\r\n /**\r\n * Set when this Accordion Section contains or will contain an Accordion.\r\n */\r\n @Prop({ reflect: true })\r\n hasNestedAccordion = false;\r\n\r\n /**\r\n * The label to be displayed in the heading handle inside a Label (optional)\r\n */\r\n @Prop()\r\n label?: string;\r\n\r\n /**\r\n * The status of the Label in the heading handle (optional)\r\n */\r\n @Prop()\r\n labelStatus?: LabelStatus;\r\n\r\n /**\r\n * Calling this method will set focus to the handle.\r\n */\r\n @Method()\r\n async focusHandle() {\r\n this.handleElementRef?.focus();\r\n }\r\n\r\n @State()\r\n hover = false;\r\n\r\n get containsNestedAccordion() {\r\n return this.host.querySelector(\"dso-accordion\") !== null;\r\n }\r\n\r\n componentWillLoad() {\r\n this.accordion?._getState().then((state) => {\r\n this.accordionState = state;\r\n\r\n forceUpdate(this.host);\r\n });\r\n }\r\n\r\n get isNeutral() {\r\n return this.accordionState?.variant === \"neutral\";\r\n }\r\n\r\n private async scrollIntoView(bodyHeight: number | undefined, behavior: ScrollBehavior = \"auto\"): Promise<void> {\r\n log(\r\n `DSO Toolkit [Accordion Section] scrollIntoView(bodyHeight: ${JSON.stringify(\r\n bodyHeight,\r\n )}, behavior: ${JSON.stringify(behavior)})`,\r\n );\r\n\r\n const bodyClientRect = this.sectionBody?.getBoundingClientRect();\r\n const headingClientRect = this.sectionHeading?.getBoundingClientRect();\r\n\r\n log(`DSO Toolkit [Accordion Section] const bodyClientRect = ${JSON.stringify(bodyClientRect)};`);\r\n log(`DSO Toolkit [Accordion Section] const headingClientRect = ${JSON.stringify(headingClientRect)};`);\r\n log(`DSO Toolkit [Accordion Section] this.accordionState = ${JSON.stringify(this.accordionState)};`);\r\n log(`DSO Toolkit [Accordion Section] this.open = ${JSON.stringify(this.open)};`);\r\n\r\n if (!bodyClientRect || !headingClientRect || !this.accordionState) {\r\n log(`DSO Toolkit [Accordion Section] returning`);\r\n\r\n return;\r\n }\r\n\r\n // this y is relative to the top of the viewport.\r\n const sectionBottomY = headingClientRect.top + headingClientRect.height + (this.open ? (bodyHeight ?? 0) : 0);\r\n\r\n log(`DSO Toolkit [Accordion Section] const sectionBottomY = ${JSON.stringify(sectionBottomY)};`);\r\n log(`DSO Toolkit [Accordion Section] window.innerHeight = ${JSON.stringify(window.innerHeight)};`);\r\n\r\n const box = this.host.getBoundingClientRect();\r\n\r\n const scrollTop = window.scrollY || document.documentElement.scrollTop || document.body.scrollTop;\r\n const clientTop = document.documentElement.clientTop || document.body.clientTop || 0;\r\n const top = box.top + scrollTop - clientTop;\r\n\r\n log(\"DSO Toolkit [Accordion Section] scroll\", { box, scrollTop, clientTop, top });\r\n\r\n if (sectionBottomY > window.innerHeight) {\r\n log(\r\n `DSO Toolkit [Accordion Section] sectionBottomY > window.innerHeight === ${JSON.stringify(\r\n sectionBottomY > window.innerHeight,\r\n )};`,\r\n );\r\n\r\n const expandedAccordionHeight = sectionBottomY - headingClientRect.top;\r\n const shouldScrollToTopOfSection = expandedAccordionHeight > window.innerHeight;\r\n\r\n log(\r\n `DSO Toolkit [Accordion Section] const expandedAccordionHeight = ${JSON.stringify(expandedAccordionHeight)};`,\r\n );\r\n log(\r\n `DSO Toolkit [Accordion Section] const shouldScrollToTopOfSection = ${JSON.stringify(\r\n shouldScrollToTopOfSection,\r\n )};`,\r\n );\r\n\r\n window.scrollTo({\r\n top: shouldScrollToTopOfSection ? top : top - (window.innerHeight - expandedAccordionHeight),\r\n behavior,\r\n });\r\n } else if (headingClientRect.top < 0) {\r\n log(\r\n `DSO Toolkit [Accordion Section] headingClientRect.top < 0 === ${JSON.stringify(headingClientRect.top < 0)};`,\r\n );\r\n\r\n window.scrollTo({\r\n top,\r\n behavior,\r\n });\r\n }\r\n }\r\n\r\n private get accordion() {\r\n return this.host.closest(\"dso-accordion\");\r\n }\r\n\r\n private handleClick = (event: MouseEvent) => {\r\n this.dsoToggleClick.emit({\r\n originalEvent: event,\r\n open: !this.open,\r\n });\r\n };\r\n\r\n private handleExpandableAnimationStart = (e: CustomEvent<any>) => {\r\n this.dsoAnimationStart.emit({\r\n animation: this.open ? \"opening\" : \"closing\",\r\n scrollIntoView: (behavior: ScrollBehavior = \"auto\") => this.scrollIntoView(e.detail.bodyHeight, behavior),\r\n });\r\n };\r\n\r\n private handleExpandableAnimationEnd = (e: CustomEvent<ExpandableAnimationEndEvent>) => {\r\n this.dsoAnimationEnd.emit({\r\n open: this.open,\r\n scrollIntoView: (behavior: ScrollBehavior = \"auto\") => this.scrollIntoView(e.detail.bodyHeight, behavior),\r\n });\r\n };\r\n\r\n /**\r\n * Emitted when the user activates the toggle button.\r\n */\r\n @Event({ bubbles: false })\r\n dsoToggleClick!: EventEmitter<AccordionSectionToggleClickEvent>;\r\n\r\n /**\r\n * Event emitted when the Accordion Section starts its toggle animation.\r\n */\r\n @Event({ bubbles: false })\r\n dsoAnimationStart!: EventEmitter<AccordionSectionAnimationStartEvent>;\r\n\r\n /**\r\n * Event emitted when the Accordion Section completes its toggle animation.\r\n */\r\n @Event({ bubbles: false })\r\n dsoAnimationEnd!: EventEmitter<AccordionSectionAnimationEndEvent>;\r\n\r\n private handleElementRef?: HTMLAnchorElement | HTMLButtonElement;\r\n\r\n render() {\r\n const { variant, reverseAlign } = this.accordionState ?? {};\r\n const hasAddons = !!this.statusDescription || !!this.status || !!this.icon || !!this.attachmentCount;\r\n\r\n return (\r\n <Host\r\n class={{\r\n \"dso-accordion-section\": true,\r\n [\"dso-accordion-\" + variant]: true,\r\n \"dso-nested-accordion\": this.hasNestedAccordion || this.containsNestedAccordion,\r\n \"dso-accordion-reverse-align\": reverseAlign ?? false,\r\n [\"dso-accordion-wijzigactie-\" + this.wijzigactie]: !!this.wijzigactie,\r\n }}\r\n hidden={!variant}\r\n onMouseenter={() => (this.hover = true)}\r\n onMouseleave={() => (this.hover = false)}\r\n >\r\n <Handle heading={this.heading} ref={(element) => (this.sectionHeading = element)}>\r\n <HandleElement\r\n handleUrl={this.handleUrl}\r\n onClick={this.handleClick}\r\n open={this.open}\r\n handleElementRef={(e) => (this.handleElementRef = e)}\r\n >\r\n {reverseAlign ? (\r\n <Fragment>\r\n {hasAddons && (\r\n <div class=\"dso-section-handle-addons\">\r\n <HandleIcon icon={this.icon} />\r\n </div>\r\n )}\r\n <dso-renvooi value={this.handleTitle} />\r\n {this.label && (\r\n <dso-label status={this.labelStatus} compact>\r\n {this.label}\r\n </dso-label>\r\n )}\r\n <dso-icon class=\"dso-section-handle-chevron\" icon=\"chevron-down\"></dso-icon>\r\n </Fragment>\r\n ) : (\r\n <Fragment>\r\n <dso-icon class=\"dso-section-handle-chevron\" icon=\"chevron-right\"></dso-icon>\r\n\r\n {this.status && <span class=\"sr-only\">{stateMap[this.status]}</span>}\r\n\r\n <span>\r\n <dso-renvooi value={this.handleTitle} />\r\n {this.isNeutral && (\r\n <dso-icon class=\"info-icon\" icon={this.open || this.hover ? \"info-active\" : \"info\"} />\r\n )}\r\n </span>\r\n\r\n {this.label && (\r\n <dso-label status={this.labelStatus} compact>\r\n {this.label}\r\n </dso-label>\r\n )}\r\n\r\n {hasAddons && (\r\n <div class=\"dso-section-handle-addons\">\r\n {this.statusDescription && <span class=\"dso-status\">{this.statusDescription}</span>}\r\n <HandleIcon state={this.status} icon={this.icon} attachmentCount={this.attachmentCount} />\r\n </div>\r\n )}\r\n </Fragment>\r\n )}\r\n </HandleElement>\r\n </Handle>\r\n <dso-expandable\r\n class=\"dso-section-body\"\r\n open={this.open}\r\n enableAnimation\r\n minimumHeight={this.isNeutral ? 0 : 4}\r\n onDsoExpandableAnimationStart={this.handleExpandableAnimationStart}\r\n onDsoExpandableAnimationEnd={this.handleExpandableAnimationEnd}\r\n >\r\n <div class=\"dso-section-body-content\" ref={(element) => (this.sectionBody = element)}>\r\n <slot />\r\n </div>\r\n </dso-expandable>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,c as s,h as i,a}from"./p-abc59cdf.js";import{i as o}from"./p-078b7eca.js";import{v as t}from"./p-82796232.js";const l={en:{"dso-map-overlays":{title:"Maplayers"}},nl:{"dso-map-overlays":{title:"Kaartlagen"}}};const n=":host{display:block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}fieldset{border:0;margin:0;min-inline-size:0;padding:0}fieldset .control-label{display:inline-block;font-weight:bold;margin-block-end:8px;max-inline-size:100%;text-align:start}p[slot=info]{margin:0}";const r=n;const d=class{constructor(i){e(this,i);this.dsoToggleOverlay=s(this,"dsoToggleOverlay",7);this.selectableRefs={};this.group=t();this.text=o((()=>this.host),l)}overlayChangeHandler(e,s){const{checked:i}=s.detail;this.dsoToggleOverlay.emit({overlay:e,checked:i})}componentDidRender(){this.overlays.filter((e=>{var s,i;return!e.disabled&&((i=(s=this.previousOverlays)===null||s===void 0?void 0:s.find((s=>s.id===e.id)))===null||i===void 0?void 0:i.disabled)===true})).forEach((e=>{var s;(s=this.selectableRefs[e.id])===null||s===void 0?void 0:s.toggleInfo(false)}));this.previousOverlays=this.overlays}render(){for(const e in this.selectableRefs){delete this.selectableRefs[e]}return i("fieldset",{key:"2092eeaf0e10ac4d8836e097895570e1457a4c3a",class:"form-group dso-checkboxes"},i("legend",{key:"fdb0cec1cd8deee591c8b83b87902009f1817bda",class:"sr-only"},"Kaartlagen"),i("div",{key:"d96f4e9495957dff19ce17bc26948a97b2a1e524",class:"dso-label-container"},i("span",{key:"2ee2223b049367caab7713e011e9d7a0fec50b8a",class:"control-label","aria-hidden":"true"},this.text("title"))),i("div",{key:"8649873d384127bfb109459a8b523bc6a480a199",class:"dso-field-container"},this.overlays.map((e=>i("dso-selectable",{key:e.id,type:"checkbox",value:e.name,checked:e.checked,disabled:e.disabled,name:this.group,ref:s=>s&&(this.selectableRefs[e.id]=s),onDsoChange:s=>this.overlayChangeHandler(e,s)},e.name,e.info?i("p",{slot:"info"},e.info):null)))))}get host(){return a(this)}};d.style=r;export{d as dso_map_overlays};
|
|
2
|
-
//# sourceMappingURL=p-fccb414d.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"dso-label.dso-tooltip.entry.js","mappings":"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","names":[],"sources":["src/components/label/label.scss?tag=dso-label&encapsulation=shadow","src/components/label/label.tsx","../../node_modules/popper-max-size-modifier/dist/popper-max-size-modifier.esm.js","src/components/tooltip/tooltip.scss?tag=dso-tooltip&encapsulation=shadow","src/components/tooltip/tooltip.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/label\";\r\n\r\n:host {\r\n display: inline-block;\r\n max-inline-size: 100%;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n// Todo: Replace .sr-only selector with web component specific selector, no need for .sr-only if we can generate the SCSS\r\n.sr-only {\r\n @include utilities.sr-only();\r\n}\r\n\r\n.dso-label {\r\n @include label.root();\r\n\r\n &.dso-hover {\r\n .dso-label-content {\r\n text-decoration: line-through;\r\n }\r\n }\r\n}\r\n\r\n.dso-truncate.dso-label-content {\r\n display: inline-block;\r\n max-inline-size: 100%;\r\n overflow: hidden;\r\n text-overflow: ellipsis; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n vertical-align: bottom;\r\n white-space: nowrap; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n}\r\n\r\n:host([removable]) {\r\n .dso-truncate.dso-label-content {\r\n max-inline-size: calc(100% - (units.$u3 + 4px));\r\n }\r\n}\r\n","import {\r\n h,\r\n Component,\r\n ComponentInterface,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n Fragment,\r\n Method,\r\n Prop,\r\n State,\r\n Watch,\r\n Listen,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\nimport debounce from \"debounce\";\r\nimport { LabelStatus } from \"./label.interfaces\";\r\n\r\nconst resizeObserver = new ResizeObserver(\r\n debounce((entries: ResizeObserverEntry[]) => {\r\n entries.forEach(({ target }) => {\r\n if (isDsoLabelComponent(target)) {\r\n target._truncateLabel();\r\n }\r\n });\r\n }, 150),\r\n);\r\n\r\nfunction isDsoLabelComponent(element: Element): element is HTMLDsoLabelElement {\r\n return element.tagName === \"DSO-LABEL\";\r\n}\r\n\r\nfunction hasEllipses(el: HTMLElement): boolean {\r\n return el.scrollWidth > el.clientWidth;\r\n}\r\n\r\n@Component({\r\n tag: \"dso-label\",\r\n styleUrl: \"label.scss\",\r\n shadow: true,\r\n})\r\nexport class Label implements ComponentInterface {\r\n private labelContent: HTMLSpanElement | undefined;\r\n\r\n private mutationObserver?: MutationObserver;\r\n\r\n @Element()\r\n private host!: HTMLDsoLabelElement;\r\n\r\n /**\r\n * For compact Label\r\n */\r\n @Prop()\r\n compact?: boolean;\r\n\r\n /**\r\n * Shows a button that can be used to remove the Label.\r\n */\r\n @Prop({ reflect: true })\r\n removable?: boolean;\r\n\r\n /**\r\n * The status of this Label.\r\n */\r\n @Prop()\r\n status?: LabelStatus;\r\n\r\n /**\r\n * Emitted when the user activates the remove button.\r\n */\r\n @Event()\r\n dsoRemoveClick!: EventEmitter<MouseEvent>;\r\n\r\n @State()\r\n removeHover?: boolean;\r\n\r\n @State()\r\n removeFocus?: boolean;\r\n\r\n /**\r\n * Whether the Label is allowed to truncate the contents if it does not fit the container element.\r\n */\r\n @Prop()\r\n truncate?: boolean;\r\n\r\n @State()\r\n textHover?: boolean;\r\n\r\n @State()\r\n textFocus?: boolean;\r\n\r\n @State()\r\n isTruncated = false;\r\n\r\n @State()\r\n labelText = \"\";\r\n\r\n @Watch(\"removable\")\r\n watchRemovable(removable: boolean) {\r\n if (removable) {\r\n this.startMutationObserver();\r\n } else {\r\n this.stopMutationObserver();\r\n }\r\n }\r\n\r\n @Watch(\"truncate\")\r\n watchTruncate(truncate: boolean) {\r\n if (truncate) {\r\n this.startTruncate();\r\n } else {\r\n this.stopTruncate();\r\n }\r\n }\r\n\r\n @Listen(\"keydown\", { target: \"document\" })\r\n keyDownListener(event: KeyboardEvent) {\r\n if (event.key === \"Escape\") {\r\n this.textHover = false;\r\n this.textFocus = false;\r\n }\r\n }\r\n\r\n /**\r\n * @internal\r\n */\r\n @Method()\r\n async _truncateLabel() {\r\n setTimeout(() => {\r\n this.isTruncated = !!this.labelContent && hasEllipses(this.labelContent);\r\n });\r\n }\r\n\r\n private syncLabelText() {\r\n this.labelText = this.host.textContent?.trim() ?? \"\";\r\n }\r\n\r\n componentDidLoad() {\r\n if (this.truncate) {\r\n this.startTruncate();\r\n }\r\n\r\n if (this.removable) {\r\n this.startMutationObserver();\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n this.stopTruncate();\r\n\r\n this.stopMutationObserver(true);\r\n }\r\n\r\n /** The mutationObserver fetches the text placed inside the label, this is then used for the remove button and tooltip. */\r\n private startMutationObserver(): void {\r\n this.mutationObserver = new MutationObserver(() => this.syncLabelText());\r\n\r\n this.mutationObserver.observe(this.host, {\r\n characterData: true,\r\n childList: true,\r\n subtree: true,\r\n attributes: true,\r\n });\r\n\r\n this.syncLabelText();\r\n }\r\n\r\n private stopMutationObserver(force = false): void {\r\n if (force || !(this.truncate && this.removable)) {\r\n this.mutationObserver?.disconnect();\r\n\r\n delete this.mutationObserver;\r\n }\r\n }\r\n\r\n private startTruncate(): void {\r\n resizeObserver.observe(this.host);\r\n this.startMutationObserver();\r\n this._truncateLabel();\r\n }\r\n\r\n private stopTruncate(): void {\r\n resizeObserver.unobserve(this.host);\r\n this.stopMutationObserver();\r\n this.isTruncated = false;\r\n }\r\n\r\n render() {\r\n return (\r\n <Fragment>\r\n <span\r\n aria-describedby=\"toggle-anchor\"\r\n class={clsx(\"dso-label\", {\r\n [`dso-label-${this.status}`]: this.status,\r\n \"dso-compact\": this.compact && !this.removable,\r\n \"dso-hover\": this.removeHover || this.removeFocus,\r\n })}\r\n >\r\n <slot name=\"symbol\"></slot>\r\n <span\r\n class={clsx(\"dso-label-content\", {\r\n \"dso-truncate\": !!this.truncate,\r\n })}\r\n ref={(element) => (this.labelContent = element)}\r\n tabindex={this.truncate && this.isTruncated ? 0 : undefined}\r\n onMouseEnter={() => (this.textHover = true)}\r\n onMouseLeave={() => (this.textHover = false)}\r\n onFocus={() => (this.textFocus = true)}\r\n onBlur={() => (this.textFocus = false)}\r\n >\r\n <slot></slot>\r\n </span>\r\n {this.removable && (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => this.dsoRemoveClick.emit(e)}\r\n onMouseEnter={() => (this.removeHover = true)}\r\n onMouseLeave={() => (this.removeHover = false)}\r\n onFocus={() => (this.removeFocus = true)}\r\n onBlur={() => (this.removeFocus = false)}\r\n >\r\n <span class=\"sr-only\">Verwijder: {this.labelText}</span>\r\n <dso-icon icon=\"times\"></dso-icon>\r\n </button>\r\n )}\r\n </span>\r\n {this.isTruncated && (\r\n <dso-tooltip\r\n stateless\r\n id=\"toggle-anchor\"\r\n active={this.textHover || this.textFocus}\r\n position=\"top\"\r\n strategy=\"absolute\"\r\n >\r\n {this.labelText}\r\n </dso-tooltip>\r\n )}\r\n </Fragment>\r\n );\r\n }\r\n}\r\n","import { detectOverflow } from '@popperjs/core';\n\nvar maxSize = {\n name: 'maxSize',\n enabled: true,\n phase: 'main',\n requiresIfExists: ['offset', 'preventOverflow', 'flip'],\n fn: function fn(_ref) {\n var state = _ref.state,\n name = _ref.name,\n options = _ref.options;\n var overflow = detectOverflow(state, options);\n\n var _ref2 = state.modifiersData.preventOverflow || {\n x: 0,\n y: 0\n },\n x = _ref2.x,\n y = _ref2.y;\n\n var _state$rects$popper = state.rects.popper,\n width = _state$rects$popper.width,\n height = _state$rects$popper.height;\n\n var _state$placement$spli = state.placement.split('-'),\n basePlacement = _state$placement$spli[0];\n\n var widthProp = basePlacement === 'left' ? 'left' : 'right';\n var heightProp = basePlacement === 'top' ? 'top' : 'bottom';\n state.modifiersData[name] = {\n width: width - overflow[widthProp] - x,\n height: height - overflow[heightProp] - y\n };\n }\n};\n\nexport default maxSize;\n","@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n\r\n@use \"tooltip.variables\" as tooltip-variables;\r\n\r\n:host(.hidden) {\r\n visibility: hidden;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.tooltip {\r\n font-family: typography.$font-family-base;\r\n // We deliberately do NOT reset font-size.\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: typography.$line-height-base;\r\n line-break: auto;\r\n text-align: start;\r\n text-decoration: none;\r\n text-shadow: none;\r\n text-transform: none;\r\n letter-spacing: normal;\r\n word-break: break-word;\r\n word-spacing: normal;\r\n word-wrap: normal;\r\n white-space: normal;\r\n\r\n --link-color: #{colors.$grasgroen};\r\n display: block;\r\n filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));\r\n font-size: typography.$font-size-small;\r\n opacity: 0;\r\n position: absolute;\r\n transition: opacity tooltip-variables.$transition-duration linear;\r\n z-index: zindex.$tooltip;\r\n\r\n &.in {\r\n opacity: tooltip-variables.$opacity;\r\n\r\n .tooltip-inner {\r\n max-block-size: 200vh; // an extreme max-block-size, just to be sure it always fits\r\n overflow: auto;\r\n visibility: visible;\r\n padding-block: tooltip-variables.$padding-block; // set padding-block here to hide the div when the .in class is not active\r\n padding-inline: tooltip-variables.$padding-inline; // set padding-inline here to hide the div when the .in class is not active\r\n }\r\n }\r\n\r\n &:not(.in) {\r\n .tooltip-inner {\r\n max-block-size: 0; // hide the element\r\n overflow: hidden;\r\n visibility: hidden;\r\n transition: all 0s linear tooltip-variables.$transition-duration; // delay all the properties with a 0s linear animation till the parent opacity animation time has passed\r\n }\r\n }\r\n\r\n .tooltip-inner {\r\n background-color: colors.$wit;\r\n border-radius: tooltip-variables.$border-radius;\r\n color: colors.$grijs-90;\r\n display: inline-block;\r\n font-size: typography.$root-font-size-base;\r\n max-inline-size: tooltip-variables.$max-inline-size;\r\n position: relative;\r\n\r\n &.dso-small {\r\n max-inline-size: tooltip-variables.$max-inline-size-small;\r\n }\r\n }\r\n\r\n .tooltip-arrow {\r\n border-color: transparent;\r\n border-style: solid;\r\n block-size: 0;\r\n inline-size: 0;\r\n }\r\n\r\n &[data-popper-placement=\"top\"] {\r\n margin-block-start: -3px;\r\n padding-block: tooltip-variables.$arrow-inline-size;\r\n padding-inline: 0;\r\n\r\n .tooltip-arrow {\r\n inset-block-end: 0;\r\n border-block-start-color: tooltip-variables.$arrow-color;\r\n border-width: tooltip-variables.$arrow-inline-size;\r\n border-block-end-width: 0;\r\n margin-inline-start: var(--tooltip-margin-inline-start, tooltip-variables.$arrow-margin * -1);\r\n }\r\n }\r\n\r\n &[data-popper-placement=\"right\"] {\r\n margin-inline-start: 3px;\r\n padding-block: 0;\r\n padding-inline: tooltip-variables.$arrow-inline-size;\r\n\r\n .tooltip-arrow {\r\n inset-inline-start: 0;\r\n border-inline-end-color: tooltip-variables.$arrow-color;\r\n border-width: tooltip-variables.$arrow-inline-size;\r\n border-inline-start-width: 0;\r\n margin-block-start: var(--tooltip-margin-block-start, tooltip-variables.$arrow-margin * -1);\r\n }\r\n }\r\n\r\n &[data-popper-placement=\"bottom\"] {\r\n margin-block-start: 3px;\r\n padding-block: tooltip-variables.$arrow-inline-size;\r\n padding-inline: 0;\r\n\r\n .tooltip-arrow {\r\n inset-block-start: 0;\r\n border-block-end-color: tooltip-variables.$arrow-color;\r\n border-width: tooltip-variables.$arrow-inline-size;\r\n border-block-start-width: 0;\r\n margin-inline-start: var(--tooltip-margin-inline-start, tooltip-variables.$arrow-margin * -1);\r\n }\r\n }\r\n\r\n &[data-popper-placement=\"left\"] {\r\n margin-inline-start: -3px;\r\n margin-inline-end: var(--tooltip-margin-inline-end, unset);\r\n padding-block: 0;\r\n padding-inline: tooltip-variables.$arrow-inline-size;\r\n\r\n .tooltip-arrow {\r\n inset-inline-end: 0;\r\n border-inline-start-color: tooltip-variables.$arrow-color;\r\n border-width: tooltip-variables.$arrow-inline-size;\r\n border-inline-end-width: 0;\r\n margin-block-start: var(--tooltip-margin-block-start, tooltip-variables.$arrow-margin * -1);\r\n }\r\n }\r\n}\r\n","import { beforeWrite, createPopper, Instance as PopperInstance, Placement, State as PopperState } from \"@popperjs/core\";\r\nimport maxSize from \"popper-max-size-modifier\";\r\nimport { h, Component, Element, Host, Method, Prop, State, Watch, ComponentInterface } from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\nimport { hasOverflow } from \"../../utils/has-overflow\";\r\nimport debounce from \"debounce\";\r\n\r\n// Keep const in sync with $tooltip-transition-duration in dso-toolkit/src/components/tooltip/tooltip.scss tooltip_root() mixin\r\nconst transitionDuration = 150;\r\n\r\nconst applyMaxSize = {\r\n name: \"applyMaxSize\",\r\n enabled: true,\r\n phase: beforeWrite,\r\n requires: [\"maxSize\"],\r\n fn({ state }: { state: PopperState }) {\r\n let { width } = state.modifiersData.maxSize;\r\n if (width < 160) {\r\n width = 160;\r\n }\r\n\r\n state.styles.popper = {\r\n ...state.styles.popper,\r\n maxWidth: `${width}px`,\r\n };\r\n },\r\n};\r\n\r\n@Component({\r\n tag: \"dso-tooltip\",\r\n styleUrl: \"tooltip.scss\",\r\n shadow: true,\r\n})\r\nexport class Tooltip implements ComponentInterface {\r\n /**\r\n * Defines if the tooltip is descriptive. A descriptive tooltip contains a meaningful message. Tooltips that are not descriptive are hidden from screenreaders using `aria-hidden`.\r\n */\r\n @Prop({\r\n reflect: true,\r\n })\r\n descriptive = false;\r\n\r\n /**\r\n * Set position of tooltip relative to target\r\n */\r\n @Prop()\r\n position: Placement = \"top\";\r\n\r\n /**\r\n * Set position strategy of tooltip\r\n */\r\n @Prop()\r\n strategy: \"auto\" | \"absolute\" | \"fixed\" = \"auto\";\r\n\r\n /**\r\n * Set attribute `no-arrow` to hide the arrow\r\n */\r\n @Prop()\r\n noArrow = false;\r\n\r\n /**\r\n * Deactivates mouseover behaviour\r\n */\r\n @Prop()\r\n stateless?: boolean;\r\n\r\n /**\r\n * Defines if the tooltip has a smaller max-width\r\n */\r\n @Prop()\r\n small?: boolean;\r\n\r\n /**\r\n * Whether or not to show the tooltip. To control the tooltip add the `active` attribute or use the `activate()` and `deactivate()` instance methods.\r\n */\r\n @Prop({ reflect: true, mutable: true })\r\n active = false;\r\n\r\n /**\r\n * Activate the tooltip (Sets the `active` attribute)\r\n */\r\n @Method()\r\n async activate(): Promise<void> {\r\n this.active = true;\r\n }\r\n\r\n /**\r\n * Deactivate the tooltip (Removes the `active` attribute)\r\n */\r\n @Method()\r\n async deactivate(): Promise<void> {\r\n this.active = false;\r\n }\r\n\r\n @Watch(\"position\")\r\n watchPosition() {\r\n if (!this.popper) {\r\n return;\r\n }\r\n\r\n this.popper.setOptions({\r\n placement: this.position,\r\n });\r\n }\r\n\r\n @Watch(\"strategy\")\r\n watchStrategy() {\r\n this.setStrategy();\r\n }\r\n\r\n private setStrategy() {\r\n if (!this.popper) {\r\n return;\r\n }\r\n\r\n if (this.strategy === \"absolute\" || this.strategy === \"fixed\") {\r\n this.popper.setOptions({\r\n strategy: this.strategy,\r\n });\r\n\r\n return;\r\n }\r\n\r\n let element: Element | null = this.element;\r\n while (element && element.parentNode !== document) {\r\n element = element.parentNode instanceof ShadowRoot ? element.parentNode.host : element.parentElement;\r\n if (element !== null && hasOverflow(element)) {\r\n this.popper.setOptions({\r\n strategy: \"fixed\",\r\n });\r\n\r\n return;\r\n }\r\n }\r\n\r\n this.popper.setOptions({\r\n strategy: \"absolute\",\r\n });\r\n }\r\n\r\n @Watch(\"active\")\r\n watchActive() {\r\n if (this.active) {\r\n this.activatePopper();\r\n\r\n if (!this.stateless) {\r\n setTimeout(() => {\r\n this.popper?.setOptions({\r\n modifiers: [{ name: \"eventListeners\", enabled: true }],\r\n });\r\n document.addEventListener(\"keydown\", this.keyDownListener);\r\n });\r\n }\r\n } else {\r\n document.removeEventListener(\"keydown\", this.keyDownListener);\r\n this.deactivatePopper();\r\n }\r\n }\r\n\r\n @Element()\r\n private element!: HTMLDsoTooltipElement;\r\n\r\n private popper: PopperInstance | undefined;\r\n\r\n private callbacks: TooltipCallbacks = {\r\n activate: () => (this.active = true),\r\n deactivate: () => {\r\n // Zie https://github.com/dso-toolkit/dso-toolkit/issues/2997#issuecomment-2654330094 voor de aanleiding\r\n // van setTimeout() met 2ms.\r\n setTimeout(() => {\r\n if (this.element.isConnected) {\r\n this.active = false;\r\n }\r\n }, 2);\r\n },\r\n };\r\n\r\n private onMouseLeave = () => {\r\n if (!this.element.matches(\":hover\") && !this.target?.matches(\":hover\")) {\r\n this.callbacks.deactivate();\r\n }\r\n };\r\n\r\n @State()\r\n private hidden = true;\r\n\r\n private listenClick(e: MouseEvent) {\r\n e.stopPropagation();\r\n }\r\n\r\n componentDidLoad(): void {\r\n const tooltip = this.element.shadowRoot?.querySelector(\".tooltip\");\r\n if (!(tooltip instanceof HTMLElement)) {\r\n throw new Error(\"tooltip element is not instanceof HTMLElement\");\r\n }\r\n\r\n if (!this.stateless && this.target) {\r\n this.target.addEventListener(\"mouseenter\", this.callbacks.activate);\r\n [this.element, this.target].forEach((element) => element.addEventListener(\"mouseleave\", this.onMouseLeave));\r\n this.target.addEventListener(\"focus\", this.callbacks.activate);\r\n this.target.addEventListener(\"blur\", this.callbacks.deactivate);\r\n }\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.popper?.destroy();\r\n\r\n if (!this.stateless && this.target) {\r\n this.target.removeEventListener(\"mouseenter\", this.callbacks.activate);\r\n [this.element, this.target].forEach((element) => element.removeEventListener(\"mouseleave\", this.onMouseLeave));\r\n this.target.removeEventListener(\"focus\", this.callbacks.activate);\r\n this.target.removeEventListener(\"blur\", this.callbacks.deactivate);\r\n }\r\n\r\n this.target = undefined;\r\n }\r\n\r\n componentDidRender() {\r\n if (this.active) {\r\n this.popper?.update();\r\n }\r\n }\r\n\r\n private keyDownListener = (event: KeyboardEvent) => {\r\n if (event.key === \"Escape\") {\r\n this.deactivate();\r\n }\r\n };\r\n\r\n render() {\r\n return (\r\n <Host class={{ hidden: this.hidden }} role=\"tooltip\" onClick={this.listenClick}>\r\n <div class={clsx(\"tooltip\", { in: this.active })}>\r\n {!this.noArrow && <div data-popper-arrow class=\"tooltip-arrow\"></div>}\r\n <div aria-hidden={!this.descriptive || undefined} class={clsx(\"tooltip-inner\", { \"dso-small\": this.small })}>\r\n <slot></slot>\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n\r\n private deactivatePopper = debounce(() => {\r\n this.hidden = true;\r\n this.popper?.destroy();\r\n this.popper = undefined;\r\n }, transitionDuration);\r\n\r\n private activatePopper(): void {\r\n this.hidden = false;\r\n\r\n if (this.popper) {\r\n return;\r\n }\r\n\r\n const tooltip = this.element.shadowRoot?.querySelector(\".tooltip\");\r\n\r\n if (this.target && tooltip instanceof HTMLElement) {\r\n this.popper = createPopper(this.target, tooltip, {\r\n placement: this.position,\r\n modifiers: [maxSize, applyMaxSize, { name: \"eventListeners\", enabled: false }],\r\n });\r\n\r\n this.setStrategy();\r\n }\r\n }\r\n\r\n private get target(): HTMLElement | undefined {\r\n return this.#target ?? this.initializeTarget();\r\n }\r\n\r\n private set target(element: HTMLElement | undefined) {\r\n this.#target = element;\r\n }\r\n\r\n #target?: HTMLElement;\r\n\r\n private initializeTarget(): HTMLElement | undefined {\r\n const id = this.element.id;\r\n\r\n if (!id) {\r\n console.warn(\"Unable to find reference tooltip has no [id] attribute.\");\r\n\r\n return;\r\n }\r\n\r\n const rootNode = this.element.getRootNode();\r\n if (!(rootNode instanceof Document || rootNode instanceof ShadowRoot)) {\r\n console.warn(`rootNode is not instance of Document or ShadowRoot`);\r\n\r\n return;\r\n }\r\n\r\n const reference = rootNode.querySelector<HTMLElement>(`[aria-describedBy=\"${id}`);\r\n if (!reference) {\r\n console.warn(`Unable to find reference with aria-describedby ${id}`);\r\n\r\n return;\r\n }\r\n\r\n this.#target = reference;\r\n return reference;\r\n }\r\n}\r\n\r\ninterface TooltipCallbacks {\r\n activate: () => void;\r\n deactivate: () => void;\r\n}\r\n"],"version":3}
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, h, F as Fragment, c as createEvent, a as getElement } from './index-91149367.js';
|
|
2
|
-
import { v as v4 } from './v4-c74494dc.js';
|
|
3
|
-
|
|
4
|
-
const renvooiCss = "ins{text-decoration:none}ins{--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#e4f1d4;border-color:#e4f1d4;color:#191919}ins a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}ins a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}ins a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}ins a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}ins{box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25)}del{--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#f5d8dc;border-color:#f5d8dc;color:#191919}del a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}del a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}del a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}del a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}del{text-decoration:line-through}@media screen and (min--moz-device-pixel-ratio: 0){del{font-family:sans-serif}}:host{display:inline}*,*::after,*::before{box-sizing:border-box}.text{text-decoration:var(--_dso-renvooi-text-decoration)}";
|
|
5
|
-
const DsoRenvooiStyle0 = renvooiCss;
|
|
6
|
-
|
|
7
|
-
const RenvooiRender = ({ value }) => {
|
|
8
|
-
if (typeof value === "string" || !value) {
|
|
9
|
-
// This element is used for --_dso-renvooi-text-decoration
|
|
10
|
-
return h("span", { class: "text" }, value);
|
|
11
|
-
}
|
|
12
|
-
if (Array.isArray(value)) {
|
|
13
|
-
return (h(Fragment, null, value.map((v, i, { length }) => (h(Fragment, null, h(RenvooiRender, { value: v }), i < length - 1 ? ", " : "")))));
|
|
14
|
-
}
|
|
15
|
-
if ("toegevoegd" in value) {
|
|
16
|
-
return h("ins", null, value.toegevoegd);
|
|
17
|
-
}
|
|
18
|
-
if ("verwijderd" in value) {
|
|
19
|
-
return h("del", null, value.verwijderd);
|
|
20
|
-
}
|
|
21
|
-
return (h(Fragment, null, h("del", null, value.was), " ", h("ins", null, value.wordt)));
|
|
22
|
-
};
|
|
23
|
-
const Renvooi = class {
|
|
24
|
-
constructor(hostRef) {
|
|
25
|
-
registerInstance(this, hostRef);
|
|
26
|
-
}
|
|
27
|
-
render() {
|
|
28
|
-
return h(RenvooiRender, { key: '36c91038b0c2213d537e02f78d2a7111ed91cd77', value: this.value });
|
|
29
|
-
}
|
|
30
|
-
};
|
|
31
|
-
Renvooi.style = DsoRenvooiStyle0;
|
|
32
|
-
|
|
33
|
-
const slideToggleCss = ".sc-dso-slide-toggle-h{display:inline-block;padding-block-start:2px}button.dso-slider.sc-dso-slide-toggle{border:0;padding:0}button.dso-slider.sc-dso-slide-toggle:focus-visible{outline:2px solid #323232;outline-offset:1px}button.dso-slider.sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#999;transition:fill 0.25s}button.dso-slider.sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{transition:transform 260ms cubic-bezier(0.4, 0, 0.2, 1);transform:translateX(10px);fill:#fff}button.dso-slider[aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#275937}button.dso-slider[aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{transform:translateX(30px);fill:#fff}button.dso-slider[disabled].sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#ccc}button.dso-slider[disabled].sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{fill:#e5e5e5}button.dso-slider[disabled][aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle rect.sc-dso-slide-toggle{fill:#a8bcaf}button.dso-slider[disabled][aria-checked=true].sc-dso-slide-toggle svg.sc-dso-slide-toggle circle.sc-dso-slide-toggle{fill:#e5e5e5}.dso-slider.sc-dso-slide-toggle{border-radius:24px;display:inline-flex}.dso-slider.sc-dso-slide-toggle:hover{cursor:pointer}";
|
|
34
|
-
const DsoSlideToggleStyle0 = slideToggleCss;
|
|
35
|
-
|
|
36
|
-
const SlideToggle = class {
|
|
37
|
-
constructor(hostRef) {
|
|
38
|
-
registerInstance(this, hostRef);
|
|
39
|
-
this.dsoActiveChange = createEvent(this, "dsoActiveChange", 5);
|
|
40
|
-
/**
|
|
41
|
-
* Set to true if Slide Toggle is checked.
|
|
42
|
-
*/
|
|
43
|
-
this.checked = false;
|
|
44
|
-
/**
|
|
45
|
-
* Disables the Slide Toggle, preventing it from checking/unchecking and therefor not emitting any events.
|
|
46
|
-
*/
|
|
47
|
-
this.disabled = false;
|
|
48
|
-
/**
|
|
49
|
-
* Provide an `id` for the `<button>`. Useful for placing your to place your own `<label for="id">`.
|
|
50
|
-
*/
|
|
51
|
-
this.identifier = v4();
|
|
52
|
-
}
|
|
53
|
-
handleSwitch(e) {
|
|
54
|
-
this.dsoActiveChange.emit({
|
|
55
|
-
originalEvent: e,
|
|
56
|
-
checked: !this.checked,
|
|
57
|
-
});
|
|
58
|
-
}
|
|
59
|
-
componentWillLoad() {
|
|
60
|
-
this.hasVisibleLabel = this.host.querySelector("*") !== null;
|
|
61
|
-
}
|
|
62
|
-
render() {
|
|
63
|
-
return (h(Fragment, null, h("button", Object.assign({ key: '5aee4d9968329a8df970a172e481d00aa89f6cfc', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e) }, (this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), (this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {})), h("svg", { key: '470f2fef216e0b5fc3d450af8285c007a376d1f6', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, h("g", { key: 'd013d54c54240c42ab7a2fe35cfaf8ff82fbe36d', fill: "none", "fill-rule": "evenodd" }, h("rect", { key: 'abb51b7d6bf57c19945644d93d7f7651c728ec74', width: "40", height: "20", fill: "currentColor", rx: "10" }), h("circle", { key: 'b4b6842b0a7acb77de82d79b9932dfaa3e0ae7c4', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (h("label", { key: '718c01776b005c142c58c3f5a96f956c8cecab5a', htmlFor: this.identifier }, h("slot", { key: '398f532a0442e039704f9fcd130eafb33a19b55f' })))));
|
|
64
|
-
}
|
|
65
|
-
get host() { return getElement(this); }
|
|
66
|
-
};
|
|
67
|
-
SlideToggle.style = DsoSlideToggleStyle0;
|
|
68
|
-
|
|
69
|
-
export { Renvooi as dso_renvooi, SlideToggle as dso_slide_toggle };
|
|
70
|
-
|
|
71
|
-
//# sourceMappingURL=dso-renvooi_2.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"dso-renvooi.dso-slide-toggle.entry.js","mappings":";;;AAAA,MAAM,UAAU,GAAG,4zDAA4zD,CAAC;AACh1D,yBAAe,UAAU;;ACOzB,MAAM,aAAa,GAA4C,CAAC,EAAE,KAAK,EAAE;IACvE,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,KAAK,EAAE;;QAEvC,OAAO,YAAM,KAAK,EAAC,MAAM,IAAE,KAAK,CAAQ,CAAC;KAC1C;IAED,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;QACxB,QACE,kBACG,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,MAC1B,kBACE,EAAC,aAAa,IAAC,KAAK,EAAE,CAAC,GAAI,EAC1B,CAAC,GAAG,MAAM,GAAG,CAAC,GAAG,IAAI,GAAG,EAAE,CAC1B,CACJ,CAAC,CACD,EACH;KACH;IAED,IAAI,YAAY,IAAI,KAAK,EAAE;QACzB,OAAO,eAAM,KAAK,CAAC,UAAU,CAAO,CAAC;KACtC;IAED,IAAI,YAAY,IAAI,KAAK,EAAE;QACzB,OAAO,eAAM,KAAK,CAAC,UAAU,CAAO,CAAC;KACtC;IAED,QACE,kBACE,eAAM,KAAK,CAAC,GAAG,CAAO,OAAC,eAAM,KAAK,CAAC,KAAK,CAAO,CAC9C,EACH;AACJ,CAAC,CAAC;MAUW,OAAO;;;;IAOlB,MAAM;QACJ,OAAO,EAAC,aAAa,qDAAC,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CAAC;KAC7C;;;;AC3DH,MAAM,cAAc,GAAG,g3CAAg3C,CAAC;AACx4C,6BAAe,cAAc;;MCShB,WAAW;IANxB;;;;;;QAcE,YAAO,GAAG,KAAK,CAAC;;;;QAMhB,aAAQ,GAAG,KAAK,CAAC;;;;QAqBjB,eAAU,GAAG,EAAE,EAAE,CAAC;KA+CnB;IAvCS,YAAY,CAAC,CAAQ;QAC3B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;YACxB,aAAa,EAAE,CAAC;YAChB,OAAO,EAAE,CAAC,IAAI,CAAC,OAAO;SACvB,CAAC,CAAC;KACJ;IAED,iBAAiB;QACf,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC;KAC9D;IAED,MAAM;QACJ,QACE,kBACE,6EACE,EAAE,EAAE,IAAI,CAAC,UAAU,EACnB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,YAAY,kBACJ,EAAE,GAAG,IAAI,CAAC,OAAO,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,KAC/B,IAAI,CAAC,eAAe,GAAG,EAAE,YAAY,EAAE,IAAI,CAAC,eAAe,EAAE,GAAG,EAAE,IAClE,IAAI,CAAC,YAAY,GAAG,EAAE,iBAAiB,EAAE,IAAI,CAAC,YAAY,EAAE,GAAG,EAAE,IAEtE,4DAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,IAChF,0DAAG,IAAI,EAAC,MAAM,eAAW,SAAS,IAChC,6DAAM,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,cAAc,EAAC,EAAE,EAAC,IAAI,GAAG,EAC3D,+DAAQ,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,GAAG,EAAC,IAAI,EAAC,cAAc,GAAG,CAC1C,CACA,CACC,EACR,IAAI,CAAC,eAAe,KACnB,8DAAO,OAAO,EAAE,IAAI,CAAC,UAAU,IAC7B,8DAAQ,CACF,CACT,CACA,EACH;KACH;;;;;;;","names":[],"sources":["src/components/renvooi/renvooi.scss?tag=dso-renvooi&encapsulation=shadow","src/components/renvooi/renvooi.tsx","src/components/slide-toggle/slide-toggle.scss?tag=dso-slide-toggle&encapsulation=scoped","src/components/slide-toggle/slide-toggle.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n\r\n@use \"~dso-toolkit/src/components/insert/insert\";\r\n@use \"~dso-toolkit/src/components/delete/delete\";\r\n\r\n:host {\r\n display: inline;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.text {\r\n text-decoration: var(--_dso-renvooi-text-decoration);\r\n}\r\n","import { Component, ComponentInterface, Fragment, FunctionalComponent, Prop, h } from \"@stencil/core\";\r\n\r\nimport { RenvooiValue } from \"./renvooi.interfaces\";\r\n\r\ninterface RenvooiRenderProps {\r\n value: RenvooiValue | RenvooiValue[] | undefined;\r\n}\r\n\r\nconst RenvooiRender: FunctionalComponent<RenvooiRenderProps> = ({ value }) => {\r\n if (typeof value === \"string\" || !value) {\r\n // This element is used for --_dso-renvooi-text-decoration\r\n return <span class=\"text\">{value}</span>;\r\n }\r\n\r\n if (Array.isArray(value)) {\r\n return (\r\n <>\r\n {value.map((v, i, { length }) => (\r\n <>\r\n <RenvooiRender value={v} />\r\n {i < length - 1 ? \", \" : \"\"}\r\n </>\r\n ))}\r\n </>\r\n );\r\n }\r\n\r\n if (\"toegevoegd\" in value) {\r\n return <ins>{value.toegevoegd}</ins>;\r\n }\r\n\r\n if (\"verwijderd\" in value) {\r\n return <del>{value.verwijderd}</del>;\r\n }\r\n\r\n return (\r\n <>\r\n <del>{value.was}</del> <ins>{value.wordt}</ins>\r\n </>\r\n );\r\n};\r\n\r\n/**\r\n * Met dit component kan een `RenvooiValue` worden gepresenteerd.\r\n */\r\n@Component({\r\n tag: \"dso-renvooi\",\r\n styleUrl: \"renvooi.scss\",\r\n shadow: true,\r\n})\r\nexport class Renvooi implements ComponentInterface {\r\n /**\r\n * The renvooi value to render.\r\n */\r\n @Prop()\r\n value?: RenvooiValue | RenvooiValue[];\r\n\r\n render() {\r\n return <RenvooiRender value={this.value} />;\r\n }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n\r\n$slide-toggle-height: 20px;\r\n\r\n:host {\r\n display: inline-block;\r\n padding-block-start: (typography.$line-height-base * typography.$font-size-base - $slide-toggle-height) * 0.5;\r\n}\r\n\r\nbutton.dso-slider {\r\n border: 0;\r\n padding: 0;\r\n\r\n &:focus-visible {\r\n outline: 2px solid colors.$grijs-80;\r\n outline-offset: 1px;\r\n }\r\n\r\n svg {\r\n rect {\r\n fill: colors.$grijs-40;\r\n transition: fill 0.25s;\r\n }\r\n\r\n circle {\r\n @include utilities.transition(transform);\r\n\r\n transform: translateX(10px);\r\n fill: colors.$wit;\r\n }\r\n }\r\n\r\n &[aria-checked=\"true\"] svg {\r\n rect {\r\n fill: colors.$bosgroen;\r\n }\r\n\r\n circle {\r\n transform: translateX(30px);\r\n fill: colors.$wit;\r\n }\r\n }\r\n\r\n &[disabled] svg {\r\n rect {\r\n fill: colors.$grijs-20;\r\n }\r\n\r\n circle {\r\n fill: colors.$grijs-10;\r\n }\r\n }\r\n\r\n &[disabled][aria-checked=\"true\"] svg {\r\n rect {\r\n fill: colors.$bosgroen-40;\r\n }\r\n\r\n circle {\r\n fill: colors.$grijs-10;\r\n }\r\n }\r\n}\r\n\r\n.dso-slider {\r\n border-radius: units.$u3;\r\n display: inline-flex;\r\n\r\n &:hover {\r\n cursor: pointer;\r\n }\r\n}\r\n","import { h, Component, ComponentInterface, Event, Prop, EventEmitter, Element, State, Fragment } from \"@stencil/core\";\r\nimport { v4 } from \"uuid\";\r\nimport { SlideToggleActiveEvent } from \"./slide-toggle.interfaces\";\r\n\r\n@Component({\r\n tag: \"dso-slide-toggle\",\r\n styleUrl: \"slide-toggle.scss\",\r\n scoped: true,\r\n shadow: false,\r\n})\r\nexport class SlideToggle implements ComponentInterface {\r\n @Element()\r\n private host!: HTMLDsoSlideToggleElement;\r\n\r\n /**\r\n * Set to true if Slide Toggle is checked.\r\n */\r\n @Prop()\r\n checked = false;\r\n\r\n /**\r\n * Disables the Slide Toggle, preventing it from checking/unchecking and therefor not emitting any events.\r\n */\r\n @Prop()\r\n disabled = false;\r\n\r\n /**\r\n * When provided the `<button>` will be labelled with `aria-label`. For a visible label provide a `<span>` inside the component.\r\n */\r\n @Prop()\r\n accessibleLabel?: string;\r\n\r\n /**\r\n * Provide the `id` of the element that labels this element. this property sets the `aria-labelledby` on the switch button.\r\n */\r\n @Prop()\r\n labelledbyId?: string;\r\n\r\n @State()\r\n hasVisibleLabel?: boolean;\r\n\r\n /**\r\n * Provide an `id` for the `<button>`. Useful for placing your to place your own `<label for=\"id\">`.\r\n */\r\n @Prop()\r\n identifier = v4();\r\n\r\n /**\r\n * Emitted when user checks or unchecks the Slide Toggle.\r\n */\r\n @Event({ composed: false })\r\n dsoActiveChange!: EventEmitter<SlideToggleActiveEvent>;\r\n\r\n private handleSwitch(e: Event): void {\r\n this.dsoActiveChange.emit({\r\n originalEvent: e,\r\n checked: !this.checked,\r\n });\r\n }\r\n\r\n componentWillLoad(): void {\r\n this.hasVisibleLabel = this.host.querySelector(\"*\") !== null;\r\n }\r\n\r\n render() {\r\n return (\r\n <>\r\n <button\r\n id={this.identifier}\r\n role=\"switch\"\r\n class=\"dso-slider\"\r\n aria-checked={\"\" + this.checked}\r\n disabled={this.disabled}\r\n onClick={(e) => this.handleSwitch(e)}\r\n {...(this.accessibleLabel ? { \"aria-label\": this.accessibleLabel } : {})}\r\n {...(this.labelledbyId ? { \"aria-labelledby\": this.labelledbyId } : {})}\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"20\" viewBox=\"0 0 40 20\">\r\n <g fill=\"none\" fill-rule=\"evenodd\">\r\n <rect width=\"40\" height=\"20\" fill=\"currentColor\" rx=\"10\" />\r\n <circle cy=\"10\" r=\"8\" fill=\"currentColor\" />\r\n </g>\r\n </svg>\r\n </button>\r\n {this.hasVisibleLabel && (\r\n <label htmlFor={this.identifier}>\r\n <slot />\r\n </label>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|