npm - @dso-toolkit/core - Versions diffs - 58.0.1 → 58.2.0 - Mend

@dso-toolkit/core 58.0.1 → 58.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 (486) hide show

package/dist/collection/components/viewer-grid/viewer-grid.js CHANGED Viewed

@@ -157,7 +157,8 @@ export class ViewerGrid {
           "references": {
             "MainSize": {
               "location": "import",
-              "path": "./viewer-grid.interfaces"
+              "path": "./viewer-grid.interfaces",
+              "id": "src/components/viewer-grid/viewer-grid.interfaces.ts::MainSize"
             }
           }
         },
@@ -196,7 +197,8 @@ export class ViewerGrid {
           "references": {
             "ViewerGridCloseOverlayEvent": {
               "location": "import",
-              "path": "./viewer-grid.interfaces"
+              "path": "./viewer-grid.interfaces",
+              "id": "src/components/viewer-grid/viewer-grid.interfaces.ts::ViewerGridCloseOverlayEvent"
             }
           }
         }
@@ -216,7 +218,8 @@ export class ViewerGrid {
           "references": {
             "ViewerGridFilterpanelCancelEvent": {
               "location": "import",
-              "path": "./viewer-grid.interfaces"
+              "path": "./viewer-grid.interfaces",
+              "id": "src/components/viewer-grid/viewer-grid.interfaces.ts::ViewerGridFilterpanelCancelEvent"
             }
           }
         }
@@ -236,7 +239,8 @@ export class ViewerGrid {
           "references": {
             "ViewerGridFilterpanelApplyEvent": {
               "location": "import",
-              "path": "./viewer-grid.interfaces"
+              "path": "./viewer-grid.interfaces",
+              "id": "src/components/viewer-grid/viewer-grid.interfaces.ts::ViewerGridFilterpanelApplyEvent"
             }
           }
         }
@@ -256,7 +260,8 @@ export class ViewerGrid {
           "references": {
             "ViewerGridChangeSizeEvent": {
               "location": "import",
-              "path": "./viewer-grid.interfaces"
+              "path": "./viewer-grid.interfaces",
+              "id": "src/components/viewer-grid/viewer-grid.interfaces.ts::ViewerGridChangeSizeEvent"
             }
           }
         }

package/dist/collection/components/viewer-grid/viewer-grid.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"viewer-grid.js","sourceRoot":"","sources":["../../../src/components/viewer-grid/viewer-grid.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, Component, Prop, State, Host, Element, Event, EventEmitter, Watch } from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\nimport {\r\n MainSize,\r\n TabLabelMap,\r\n Tabs,\r\n ViewerGridChangeSizeEvent,\r\n ViewerGridCloseOverlayEvent,\r\n ViewerGridFilterpanelApplyEvent,\r\n ViewerGridFilterpanelCancelEvent,\r\n tabs,\r\n} from \"./viewer-grid.interfaces\";\r\nimport { Filterpanel, MainPanel, Overlay } from \"./components\";\r\n\r\nconst tabViewWidth = 768 + 40;\r\n\r\n@Component({\r\n tag: \"dso-viewer-grid\",\r\n styleUrl: \"viewer-grid.scss\",\r\n shadow: true,\r\n})\r\nexport class ViewerGrid {\r\n private mediaCondition = `(min-width: ${tabViewWidth}px)`;\r\n\r\n private tabLabelMap: TabLabelMap = {\r\n main: \"Hoofdpaneel\",\r\n map: \"Kaart\",\r\n };\r\n\r\n private mainPanel?: HTMLDivElement;\r\n\r\n /*\r\n Set to true when filterpanel should show.\r\n /\r\n @Prop({ reflect: true })\r\n filterpanelOpen = false;\r\n\r\n /\r\n Set to true when overlay should show.\r\n /\r\n @Prop({ reflect: true })\r\n overlayOpen = false;\r\n\r\n /\r\n Size of the main content panel when component loads. Changing this attribute afterwards has no effect.\r\n \r\n Default size is `large`.\r\n /\r\n @Prop()\r\n initialMainSize?: MainSize;\r\n\r\n @State()\r\n mainSize: MainSize = \"large\";\r\n\r\n @State()\r\n tabView = window.innerWidth < tabViewWidth;\r\n\r\n @State()\r\n activeTab: Tabs = \"main\";\r\n\r\n /\r\n Emitted when user wants to close the overlay.\r\n /\r\n @Event()\r\n dsoCloseOverlay!: EventEmitter<ViewerGridCloseOverlayEvent>;\r\n\r\n /\r\n Emitted when user cancels filterpanel.\r\n /\r\n @Event()\r\n dsoFilterpanelCancel!: EventEmitter<ViewerGridFilterpanelCancelEvent>;\r\n\r\n /\r\n Emitted when user applies filterpanel options.\r\n /\r\n @Event()\r\n dsoFilterpanelApply!: EventEmitter<ViewerGridFilterpanelApplyEvent>;\r\n\r\n /\r\n Emitted before and after main size animation. Inspect `detail` property for more information.\r\n */\r\n @Event()\r\n dsoMainSizeChange!: EventEmitter<ViewerGridChangeSizeEvent>;\r\n\r\n @Element()\r\n host!: HTMLDsoViewerGridElement;\r\n\r\n private filterpanel: HTMLDialogElement \| undefined;\r\n\r\n private filterpanelSlot: HTMLElement \| null = null;\r\n\r\n private overlay: HTMLDialogElement \| undefined;\r\n\r\n private overlaySlot: HTMLDivElement \| null = null;\r\n\r\n @Watch(\"mainSize\")\r\n mainSizeWatcher(currentSize: MainSize, previousSize: MainSize) {\r\n this.dsoMainSizeChange.emit({\r\n stage: \"start\",\r\n previousSize,\r\n currentSize,\r\n });\r\n\r\n this.mainPanel?.addEventListener(\r\n \"transitionend\",\r\n (e) => {\r\n if (e.propertyName === \"flex-basis\") {\r\n this.dsoMainSizeChange.emit({\r\n stage: \"end\",\r\n previousSize,\r\n currentSize,\r\n });\r\n }\r\n },\r\n { once: true }\r\n );\r\n }\r\n\r\n @Watch(\"filterpanelOpen\")\r\n filterpanelOpenWatcher(open: boolean) {\r\n if (!this.filterpanelSlot) {\r\n console.warn(\"slot 'filterpanel' has not been set\");\r\n }\r\n\r\n if (open) {\r\n this.filterpanel?.showModal();\r\n } else {\r\n this.filterpanel?.close();\r\n }\r\n }\r\n\r\n @Watch(\"overlayOpen\")\r\n overlayOpenWatcher(open: boolean) {\r\n if (!this.overlaySlot) {\r\n console.warn(\"slot 'overlay' has not been set\");\r\n }\r\n\r\n if (open) {\r\n this.overlay?.showModal();\r\n } else {\r\n this.overlay?.close();\r\n }\r\n }\r\n\r\n private shrinkMain = () => {\r\n this.mainSize = this.mainSize === \"large\" ? \"medium\" : \"small\";\r\n };\r\n\r\n private expandMain = () => {\r\n this.mainSize = this.mainSize === \"small\" ? \"medium\" : \"large\";\r\n };\r\n\r\n private changeListener = (largeScreen: MediaQueryListEvent) => (this.tabView = !largeScreen.matches);\r\n\r\n connectedCallback() {\r\n window.matchMedia(this.mediaCondition).addEventListener(\"change\", this.changeListener);\r\n\r\n this.filterpanelSlot = this.host.querySelector<HTMLDivElement>(\"div[slot='filterpanel']\");\r\n\r\n this.overlaySlot = this.host.querySelector<HTMLDivElement>(\"div[slot='overlay']\");\r\n }\r\n\r\n componentDidLoad() {\r\n if (this.filterpanelOpen && this.filterpanelSlot) {\r\n this.filterpanel?.showModal();\r\n }\r\n\r\n if (this.overlayOpen && this.overlaySlot) {\r\n this.overlay?.showModal();\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n if (this.initialMainSize) {\r\n this.mainSize = this.initialMainSize;\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n window.matchMedia(this.mediaCondition).removeEventListener(\"change\", this.changeListener);\r\n }\r\n\r\n private handleFilterpanelApply(mouseEvent: MouseEvent \| Event) {\r\n this.dsoFilterpanelApply.emit({ originalEvent: mouseEvent });\r\n }\r\n\r\n private handleFilterpanelCancel(mouseEvent: MouseEvent \| Event) {\r\n this.dsoFilterpanelCancel.emit({ originalEvent: mouseEvent });\r\n }\r\n\r\n render() {\r\n return (\r\n <Host {...{ [this.mainSize]: true }}>\r\n {this.tabView && (\r\n <nav class=\"dso-navbar\">\r\n <ul class=\"dso-nav dso-nav-sub\">\r\n {tabs.map((tab) => (\r\n <li key={tab} class={clsx({ \"dso-active\": this.activeTab === tab })}>\r\n <button type=\"button\" class=\"dso-tertiary\" onClick={() => (this.activeTab = tab)}>\r\n {this.tabLabelMap[tab]}\r\n </button>\r\n </li>\r\n ))}\r\n </ul>\r\n </nav>\r\n )}\r\n {(!this.tabView \|\| (this.tabView && this.activeTab === \"main\")) && (\r\n <MainPanel\r\n ref={(element: HTMLDivElement \| undefined) => (this.mainPanel = element)}\r\n tabView={this.tabView}\r\n mainSize={this.mainSize}\r\n shrinkMain={this.shrinkMain}\r\n expandMain={this.expandMain}\r\n ></MainPanel>\r\n )}\r\n <Filterpanel\r\n ref={(element) => (this.filterpanel = element)}\r\n onApply={(e) => this.handleFilterpanelApply(e)}\r\n onCancel={(e) => this.handleFilterpanelCancel(e)}\r\n ></Filterpanel>\r\n {(!this.tabView \|\| (this.tabView && this.activeTab === \"map\")) && (\r\n <div class=\"map\">\r\n <slot name=\"map\" />\r\n </div>\r\n )}\r\n <Overlay\r\n ref={(element) => (this.overlay = element)}\r\n dsoCloseOverlay={(e) => this.dsoCloseOverlay.emit({ originalEvent: e })}\r\n ></Overlay>\r\n </Host>\r\n );\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"viewer-grid.js","sourceRoot":"","sources":["../../../src/components/viewer-grid/viewer-grid.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, Component, Prop, State, Host, Element, Event, EventEmitter, Watch } from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\nimport {\r\n MainSize,\r\n TabLabelMap,\r\n Tabs,\r\n ViewerGridChangeSizeEvent,\r\n ViewerGridCloseOverlayEvent,\r\n ViewerGridFilterpanelApplyEvent,\r\n ViewerGridFilterpanelCancelEvent,\r\n tabs,\r\n} from \"./viewer-grid.interfaces\";\r\nimport { Filterpanel, MainPanel, Overlay } from \"./components\";\r\n\r\nconst tabViewWidth = 768 + 40;\r\n\r\n@Component({\r\n tag: \"dso-viewer-grid\",\r\n styleUrl: \"viewer-grid.scss\",\r\n shadow: true,\r\n})\r\nexport class ViewerGrid {\r\n private mediaCondition = `(min-width: ${tabViewWidth}px)`;\r\n\r\n private tabLabelMap: TabLabelMap = {\r\n main: \"Hoofdpaneel\",\r\n map: \"Kaart\",\r\n };\r\n\r\n private mainPanel?: HTMLDivElement;\r\n\r\n /*\r\n Set to true when filterpanel should show.\r\n /\r\n @Prop({ reflect: true })\r\n filterpanelOpen = false;\r\n\r\n /\r\n Set to true when overlay should show.\r\n /\r\n @Prop({ reflect: true })\r\n overlayOpen = false;\r\n\r\n /\r\n Size of the main content panel when component loads. Changing this attribute afterwards has no effect.\r\n \r\n Default size is `large`.\r\n /\r\n @Prop()\r\n initialMainSize?: MainSize;\r\n\r\n @State()\r\n mainSize: MainSize = \"large\";\r\n\r\n @State()\r\n tabView = window.innerWidth < tabViewWidth;\r\n\r\n @State()\r\n activeTab: Tabs = \"main\";\r\n\r\n /\r\n Emitted when user wants to close the overlay.\r\n /\r\n @Event()\r\n dsoCloseOverlay!: EventEmitter<ViewerGridCloseOverlayEvent>;\r\n\r\n /\r\n Emitted when user cancels filterpanel.\r\n /\r\n @Event()\r\n dsoFilterpanelCancel!: EventEmitter<ViewerGridFilterpanelCancelEvent>;\r\n\r\n /\r\n Emitted when user applies filterpanel options.\r\n /\r\n @Event()\r\n dsoFilterpanelApply!: EventEmitter<ViewerGridFilterpanelApplyEvent>;\r\n\r\n /\r\n Emitted before and after main size animation. Inspect `detail` property for more information.\r\n */\r\n @Event()\r\n dsoMainSizeChange!: EventEmitter<ViewerGridChangeSizeEvent>;\r\n\r\n @Element()\r\n host!: HTMLDsoViewerGridElement;\r\n\r\n private filterpanel: HTMLDialogElement \| undefined;\r\n\r\n private filterpanelSlot: HTMLElement \| null = null;\r\n\r\n private overlay: HTMLDialogElement \| undefined;\r\n\r\n private overlaySlot: HTMLDivElement \| null = null;\r\n\r\n @Watch(\"mainSize\")\r\n mainSizeWatcher(currentSize: MainSize, previousSize: MainSize) {\r\n this.dsoMainSizeChange.emit({\r\n stage: \"start\",\r\n previousSize,\r\n currentSize,\r\n });\r\n\r\n this.mainPanel?.addEventListener(\r\n \"transitionend\",\r\n (e) => {\r\n if (e.propertyName === \"flex-basis\") {\r\n this.dsoMainSizeChange.emit({\r\n stage: \"end\",\r\n previousSize,\r\n currentSize,\r\n });\r\n }\r\n },\r\n { once: true }\r\n );\r\n }\r\n\r\n @Watch(\"filterpanelOpen\")\r\n filterpanelOpenWatcher(open: boolean) {\r\n if (!this.filterpanelSlot) {\r\n console.warn(\"slot 'filterpanel' has not been set\");\r\n }\r\n\r\n if (open) {\r\n this.filterpanel?.showModal();\r\n } else {\r\n this.filterpanel?.close();\r\n }\r\n }\r\n\r\n @Watch(\"overlayOpen\")\r\n overlayOpenWatcher(open: boolean) {\r\n if (!this.overlaySlot) {\r\n console.warn(\"slot 'overlay' has not been set\");\r\n }\r\n\r\n if (open) {\r\n this.overlay?.showModal();\r\n } else {\r\n this.overlay?.close();\r\n }\r\n }\r\n\r\n private shrinkMain = () => {\r\n this.mainSize = this.mainSize === \"large\" ? \"medium\" : \"small\";\r\n };\r\n\r\n private expandMain = () => {\r\n this.mainSize = this.mainSize === \"small\" ? \"medium\" : \"large\";\r\n };\r\n\r\n private changeListener = (largeScreen: MediaQueryListEvent) => (this.tabView = !largeScreen.matches);\r\n\r\n connectedCallback() {\r\n window.matchMedia(this.mediaCondition).addEventListener(\"change\", this.changeListener);\r\n\r\n this.filterpanelSlot = this.host.querySelector<HTMLDivElement>(\"div[slot='filterpanel']\");\r\n\r\n this.overlaySlot = this.host.querySelector<HTMLDivElement>(\"div[slot='overlay']\");\r\n }\r\n\r\n componentDidLoad() {\r\n if (this.filterpanelOpen && this.filterpanelSlot) {\r\n this.filterpanel?.showModal();\r\n }\r\n\r\n if (this.overlayOpen && this.overlaySlot) {\r\n this.overlay?.showModal();\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n if (this.initialMainSize) {\r\n this.mainSize = this.initialMainSize;\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n window.matchMedia(this.mediaCondition).removeEventListener(\"change\", this.changeListener);\r\n }\r\n\r\n private handleFilterpanelApply(mouseEvent: MouseEvent \| Event) {\r\n this.dsoFilterpanelApply.emit({ originalEvent: mouseEvent });\r\n }\r\n\r\n private handleFilterpanelCancel(mouseEvent: MouseEvent \| Event) {\r\n this.dsoFilterpanelCancel.emit({ originalEvent: mouseEvent });\r\n }\r\n\r\n render() {\r\n return (\r\n <Host {...{ [this.mainSize]: true }}>\r\n {this.tabView && (\r\n <nav class=\"dso-navbar\">\r\n <ul class=\"dso-nav dso-nav-sub\">\r\n {tabs.map((tab) => (\r\n <li key={tab} class={clsx({ \"dso-active\": this.activeTab === tab })}>\r\n <button type=\"button\" class=\"dso-tertiary\" onClick={() => (this.activeTab = tab)}>\r\n {this.tabLabelMap[tab]}\r\n </button>\r\n </li>\r\n ))}\r\n </ul>\r\n </nav>\r\n )}\r\n {(!this.tabView \|\| (this.tabView && this.activeTab === \"main\")) && (\r\n <MainPanel\r\n ref={(element: HTMLDivElement \| undefined) => (this.mainPanel = element)}\r\n tabView={this.tabView}\r\n mainSize={this.mainSize}\r\n shrinkMain={this.shrinkMain}\r\n expandMain={this.expandMain}\r\n ></MainPanel>\r\n )}\r\n <Filterpanel\r\n ref={(element) => (this.filterpanel = element)}\r\n onApply={(e) => this.handleFilterpanelApply(e)}\r\n onCancel={(e) => this.handleFilterpanelCancel(e)}\r\n ></Filterpanel>\r\n {(!this.tabView \|\| (this.tabView && this.activeTab === \"map\")) && (\r\n <div class=\"map\">\r\n <slot name=\"map\" />\r\n </div>\r\n )}\r\n <Overlay\r\n ref={(element) => (this.overlay = element)}\r\n dsoCloseOverlay={(e) => this.dsoCloseOverlay.emit({ originalEvent: e })}\r\n ></Overlay>\r\n </Host>\r\n );\r\n }\r\n}\r\n"]}

package/dist/components/alert.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { c as clsx } from './clsx.m.js';
+import { c as clsx } from './clsx.js';
 import { d as defineCustomElement$1 } from './icon.js';
 const alertCss = ":host{display:block}:host(:not(:first-child)){margin-top:24px}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.alert{border:1px solid transparent;line-height:1.5;margin-bottom:24px;min-height:64px;position:relative}@media screen and (min-width: 481px){.alert{padding:19px 16px 19px 63px}}@media screen and (max-width: 480px){.alert{padding:63px 16px 16px}}.alert:not(:first-child){margin-top:24px}.alert.alert-success{color:#000;background-color:#e4f1d4;border-color:#e4f1d4}.alert.alert-error{color:#000;background-color:#f5d8dc;border-color:#f5d8dc}.alert.alert-warning{color:#000;background-color:#f8f6cc;border-color:#f8f6cc}.alert.alert-info{color:#000;background-color:#e1ecf7;border-color:#e1ecf7}.alert dso-icon{left:15px;position:absolute;top:15px;height:32px;width:32px}";

package/dist/components/alert.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"alert.js","mappings":";;;;AAAA,MAAM,QAAQ,GAAG,83BAA83B;;MCQl4B,KAAK;;;;;;;;EAoBhB,MAAM;IACJ,MAAM,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChD,IAAI,CAAC,MAAM,EAAE;MACX,MAAM,IAAI,KAAK,CAAC,kBAAkB,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;KAClD;IAED,QACE,WAAK,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,SAAS,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,SAAS,GAAG,OAAO,GAAG,SAAS,IAC3F,gBAAU,IAAI,EAAE,SAAS,GAAG,IAAI,CAAC,MAAM,GAAa,EACpD,YAAM,KAAK,EAAC,SAAS,IAAE,MAAM,MAAS,EACtC,eAAa,CACT,EACN;GACH;;;;;;AApBc,eAAS,GAAG,IAAI,GAAG,CAAiB;EACjD,CAAC,SAAS,EAAE,QAAQ,CAAC;EACrB,CAAC,MAAM,EAAE,WAAW,CAAC;EACrB,CAAC,SAAS,EAAE,cAAc,CAAC;EAC3B,CAAC,OAAO,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/alert/alert.scss?tag=dso-alert&encapsulation=shadow","./src/components/alert/alert.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/alert\";\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n:host(:not(:first-child)) {\r\n margin-top: units.$u3;\r\n}\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.alert {\r\n @include alert.root();\r\n\r\n dso-icon {\r\n @include alert.icon-position();\r\n\r\n height: units.$u4;\r\n width: units.$u4;\r\n }\r\n}\r\n","import { Component, h, Prop } from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\n@Component({\r\n tag: \"dso-alert\",\r\n styleUrl: \"alert.scss\",\r\n shadow: true,\r\n})\r\nexport class Alert {\r\n /*\r\n Set status of alert\r\n /\r\n @Prop()\r\n status!: \"success\" \| \"info\" \| \"warning\" \| \"error\";\r\n\r\n /\r\n Whether or not to show the role attribute with value \"alert\". To control the tooltip add the `role-alert` attribute.\r\n */\r\n @Prop()\r\n roleAlert?: boolean;\r\n\r\n private static statusMap = new Map<string, string>([\r\n [\"success\", \"Gelukt\"],\r\n [\"info\", \"Opmerking\"],\r\n [\"warning\", \"Waarschuwing\"],\r\n [\"error\", \"Fout\"],\r\n ]);\r\n\r\n render() {\r\n const status = Alert.statusMap.get(this.status);\r\n if (!status) {\r\n throw new Error(`Invalid status ${this.status}`);\r\n }\r\n\r\n return (\r\n <div class={clsx(\"alert\", `alert-${this.status}`)} role={this.roleAlert ? \"alert\" : undefined}>\r\n <dso-icon icon={\"status-\" + this.status}></dso-icon>\r\n <span class=\"sr-only\">{status}:</span>\r\n <slot></slot>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"alert.js","mappings":";;;;AAAA,MAAM,QAAQ,GAAG,83BAA83B;;MCQl4B,KAAK;;;;;;;;EAoBhB,MAAM;IACJ,MAAM,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChD,IAAI,CAAC,MAAM,EAAE;MACX,MAAM,IAAI,KAAK,CAAC,kBAAkB,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;KAClD;IAED,QACE,WAAK,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,SAAS,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,SAAS,GAAG,OAAO,GAAG,SAAS,IAC3F,gBAAU,IAAI,EAAE,SAAS,GAAG,IAAI,CAAC,MAAM,GAAa,EACpD,YAAM,KAAK,EAAC,SAAS,IAAE,MAAM,MAAS,EACtC,eAAa,CACT,EACN;GACH;;;;;;AApBc,eAAS,GAAG,IAAI,GAAG,CAAiB;EACjD,CAAC,SAAS,EAAE,QAAQ,CAAC;EACrB,CAAC,MAAM,EAAE,WAAW,CAAC;EACrB,CAAC,SAAS,EAAE,cAAc,CAAC;EAC3B,CAAC,OAAO,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/alert/alert.scss?tag=dso-alert&encapsulation=shadow","src/components/alert/alert.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/alert\";\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n:host(:not(:first-child)) {\r\n margin-top: units.$u3;\r\n}\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.alert {\r\n @include alert.root();\r\n\r\n dso-icon {\r\n @include alert.icon-position();\r\n\r\n height: units.$u4;\r\n width: units.$u4;\r\n }\r\n}\r\n","import { Component, h, Prop } from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\n@Component({\r\n tag: \"dso-alert\",\r\n styleUrl: \"alert.scss\",\r\n shadow: true,\r\n})\r\nexport class Alert {\r\n /*\r\n Set status of alert\r\n /\r\n @Prop()\r\n status!: \"success\" \| \"info\" \| \"warning\" \| \"error\";\r\n\r\n /\r\n Whether or not to show the role attribute with value \"alert\". To control the tooltip add the `role-alert` attribute.\r\n */\r\n @Prop()\r\n roleAlert?: boolean;\r\n\r\n private static statusMap = new Map<string, string>([\r\n [\"success\", \"Gelukt\"],\r\n [\"info\", \"Opmerking\"],\r\n [\"warning\", \"Waarschuwing\"],\r\n [\"error\", \"Fout\"],\r\n ]);\r\n\r\n render() {\r\n const status = Alert.statusMap.get(this.status);\r\n if (!status) {\r\n throw new Error(`Invalid status ${this.status}`);\r\n }\r\n\r\n return (\r\n <div class={clsx(\"alert\", `alert-${this.status}`)} role={this.roleAlert ? \"alert\" : undefined}>\r\n <dso-icon icon={\"status-\" + this.status}></dso-icon>\r\n <span class=\"sr-only\">{status}:</span>\r\n <slot></slot>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/annotation-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"annotation-button.js","mappings":";;;AAAA,MAAM,mBAAmB,GAAG,s71BAAs71B;;MCYr81B,gBAAgB;;;;;IAmBnB,gBAAW,GAAG,CAAC,CAAa;MAClC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;KAC5D,CAAC;;gBAVK,KAAK;;EAYZ,MAAM;IACJ,QACE,cACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,cAAc,mBACL,IAAI,CAAC,UAAU,mBACf,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,EACnC,OAAO,EAAE,IAAI,CAAC,WAAW,IAEzB,gBAAU,IAAI,EAAC,OAAO,GAAY,EAClC,YAAM,KAAK,EAAC,SAAS,2BAA4B,CAC1C,EACT;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/annotation-button/annotation-button.scss?tag=dso-annotation-button","./src/components/annotation-button/annotation-button.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/button/button\";\r\n\r\ndso-annotation-button {\r\n display: block;\r\n}\r\n\r\n.sr-only {\r\n @include utilities.sr-only();\r\n}\r\n","import { h, Component, ComponentInterface, Event, Prop, EventEmitter } from \"@stencil/core\";\r\n\r\nexport interface AnnotationButtonClickEvent {\r\n originalEvent: Event;\r\n open: boolean;\r\n}\r\n\r\n@Component({\r\n tag: \"dso-annotation-button\",\r\n styleUrl: \"annotation-button.scss\",\r\n // No shadowdom for a11y reasons (aria-controls pointing to element inside another component)\r\n})\r\nexport class AnnotationButton implements ComponentInterface {\r\n /*\r\n To link the Annotation Button with `aria-controls` to a different element, most likely an Annotation Output.\r\n /\r\n @Prop()\r\n identifier!: string \| undefined;\r\n\r\n /\r\n Set to true when the annotation is open.\r\n /\r\n @Prop()\r\n open = false;\r\n\r\n /\r\n Emitted when user activates the button.\r\n */\r\n @Event({ bubbles: false })\r\n dsoClick!: EventEmitter<AnnotationButtonClickEvent>;\r\n\r\n private handleClick = (e: MouseEvent) => {\r\n this.dsoClick.emit({ originalEvent: e, open: !this.open });\r\n };\r\n\r\n render() {\r\n return (\r\n <button\r\n type=\"button\"\r\n class=\"dso-tertiary\"\r\n aria-controls={this.identifier}\r\n aria-expanded={this.open.toString()}\r\n onClick={this.handleClick}\r\n >\r\n <dso-icon icon=\"label\"></dso-icon>\r\n <span class=\"sr-only\">Toelichting bekijken</span>\r\n </button>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"annotation-button.js","mappings":";;;AAAA,MAAM,mBAAmB,GAAG,s71BAAs71B;;MCYr81B,gBAAgB;;;;;IAmBnB,gBAAW,GAAG,CAAC,CAAa;MAClC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;KAC5D,CAAC;;gBAVK,KAAK;;EAYZ,MAAM;IACJ,QACE,cACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,cAAc,mBACL,IAAI,CAAC,UAAU,mBACf,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,EACnC,OAAO,EAAE,IAAI,CAAC,WAAW,IAEzB,gBAAU,IAAI,EAAC,OAAO,GAAY,EAClC,YAAM,KAAK,EAAC,SAAS,2BAA4B,CAC1C,EACT;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/annotation-button/annotation-button.scss?tag=dso-annotation-button","src/components/annotation-button/annotation-button.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/button/button\";\r\n\r\ndso-annotation-button {\r\n display: block;\r\n}\r\n\r\n.sr-only {\r\n @include utilities.sr-only();\r\n}\r\n","import { h, Component, ComponentInterface, Event, Prop, EventEmitter } from \"@stencil/core\";\r\n\r\nexport interface AnnotationButtonClickEvent {\r\n originalEvent: Event;\r\n open: boolean;\r\n}\r\n\r\n@Component({\r\n tag: \"dso-annotation-button\",\r\n styleUrl: \"annotation-button.scss\",\r\n // No shadowdom for a11y reasons (aria-controls pointing to element inside another component)\r\n})\r\nexport class AnnotationButton implements ComponentInterface {\r\n /*\r\n To link the Annotation Button with `aria-controls` to a different element, most likely an Annotation Output.\r\n /\r\n @Prop()\r\n identifier!: string \| undefined;\r\n\r\n /\r\n Set to true when the annotation is open.\r\n /\r\n @Prop()\r\n open = false;\r\n\r\n /\r\n Emitted when user activates the button.\r\n */\r\n @Event({ bubbles: false })\r\n dsoClick!: EventEmitter<AnnotationButtonClickEvent>;\r\n\r\n private handleClick = (e: MouseEvent) => {\r\n this.dsoClick.emit({ originalEvent: e, open: !this.open });\r\n };\r\n\r\n render() {\r\n return (\r\n <button\r\n type=\"button\"\r\n class=\"dso-tertiary\"\r\n aria-controls={this.identifier}\r\n aria-expanded={this.open.toString()}\r\n onClick={this.handleClick}\r\n >\r\n <dso-icon icon=\"label\"></dso-icon>\r\n <span class=\"sr-only\">Toelichting bekijken</span>\r\n </button>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/annotation-output.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"annotation-output.js","mappings":";;;;;AAAA,MAAM,mBAAmB,GAAG,m6CAAm6C;;MCWl7C,gBAAgB;;;;;IAyBnB,kBAAa,GAAG,CAAC,CAAa;MACpC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,CAAC,CAAC;KAC1C,CAAC;;;gBAVK,KAAK;;EAYZ,MAAM;IACJ,QACE,kCACE,sBAAgB,EAAE,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IACjD,IAAI,CAAC,gBAAgB,IAAI,YAAM,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,gBAAgB,CAAQ,EAC5F,WAAK,KAAK,EAAC,uBAAuB,IAChC,YAAM,IAAI,EAAC,OAAO,GAAG,EACrB,YAAM,IAAI,EAAC,QAAQ,GAAG,EACtB,cAAQ,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,0CAA0C,EAAC,OAAO,EAAE,IAAI,CAAC,aAAa,IAChG,gBAAU,IAAI,EAAC,OAAO,GAAY,EAClC,YAAM,KAAK,EAAC,SAAS,0BAA2B,CACzC,CACL,EACN,WAAK,KAAK,EAAC,wBAAwB,IACjC,eAAQ,CACJ,CACS,CACM,EACzB;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/annotation-output/annotation-output.scss?tag=dso-annotation-output","./src/components/annotation-output/annotation-output.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n\r\n@include utilities.box-sizing();\r\n\r\ndso-annotation-output {\r\n display: block;\r\n}\r\n\r\n.sr-only {\r\n @include utilities.sr-only();\r\n}\r\n\r\n.dso-annotation-header {\r\n align-items: center;\r\n background-color: colors.$grijs-5;\r\n clear: both;\r\n display: flex;\r\n margin-bottom: 2px;\r\n margin-top: units.$u1;\r\n padding-left: units.$u2;\r\n padding-right: units.$u1;\r\n padding-top: units.$u1;\r\n padding-bottom: units.$u1;\r\n\r\n > [slot=\"title\"] {\r\n color: colors.$zwart;\r\n font-size: 1.25rem;\r\n margin-bottom: 0;\r\n margin-top: 0;\r\n }\r\n\r\n > :nth-child(2) {\r\n margin-left: auto;\r\n }\r\n}\r\n\r\ndso-responsive-element[small],\r\ndso-responsive-element[medium] {\r\n .dso-annotation-header {\r\n display: grid;\r\n row-gap: units.$u1;\r\n\r\n [slot=\"title\"] {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n [slot=\"addons\"] {\r\n grid-row: 2;\r\n grid-column: 1;\r\n margin-left: initial;\r\n }\r\n\r\n .dso-annotation-close-button {\r\n grid-row: 1;\r\n grid-column: 2;\r\n margin-left: units.$u1;\r\n text-align: end;\r\n }\r\n }\r\n}\r\n\r\n.dso-annotation-content {\r\n background-color: colors.$grijs-5;\r\n padding-left: units.$u2;\r\n padding-right: units.$u1;\r\n padding-top: units.$u1;\r\n padding-bottom: units.$u1;\r\n}\r\n\r\n.dso-annotation-close-button {\r\n margin-left: units.$u4;\r\n}\r\n\r\n.dso-annotation-prefix {\r\n font-style: italic;\r\n}\r\n","import { h, Component, ComponentInterface, Event, EventEmitter, Prop } from \"@stencil/core\";\r\n\r\nexport interface AnnotationOutputCloseEvent {\r\n originalEvent: Event;\r\n}\r\n\r\n@Component({\r\n tag: \"dso-annotation-output\",\r\n styleUrl: \"annotation-output.scss\",\r\n // No shadowdom for a11y reasons (aria-controls being set inside another component)\r\n})\r\nexport class AnnotationOutput implements ComponentInterface {\r\n /*\r\n The annotation-button that toggles this component should have the same identifier.\r\n /\r\n @Prop({ reflect: true })\r\n identifier!: string;\r\n\r\n /\r\n This text will be displayed above the annotation-output when opened\r\n /\r\n @Prop({ reflect: true })\r\n annotationPrefix?: string;\r\n\r\n /\r\n Set to `true` to show content.\r\n /\r\n @Prop({ reflect: true })\r\n open = false;\r\n\r\n /\r\n This event is emitted when the user activates the Annotation Button.\r\n */\r\n @Event({ bubbles: false })\r\n dsoClose!: EventEmitter<AnnotationOutputCloseEvent>;\r\n\r\n private toggleHandler = (e: MouseEvent) => {\r\n this.dsoClose.emit({ originalEvent: e });\r\n };\r\n\r\n render() {\r\n return (\r\n <dso-responsive-element>\r\n <dso-expandable id={this.identifier} open={this.open}>\r\n {this.annotationPrefix && <span class=\"dso-annotation-prefix\">{this.annotationPrefix}</span>}\r\n <div class=\"dso-annotation-header\">\r\n <slot name=\"title\" />\r\n <slot name=\"addons\" />\r\n <button type=\"button\" class=\"dso-tertiary dso-annotation-close-button\" onClick={this.toggleHandler}>\r\n <dso-icon icon=\"times\"></dso-icon>\r\n <span class=\"sr-only\">Toelichting sluiten</span>\r\n </button>\r\n </div>\r\n <div class=\"dso-annotation-content\">\r\n <slot />\r\n </div>\r\n </dso-expandable>\r\n </dso-responsive-element>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"annotation-output.js","mappings":";;;;;AAAA,MAAM,mBAAmB,GAAG,m6CAAm6C;;MCWl7C,gBAAgB;;;;;IAyBnB,kBAAa,GAAG,CAAC,CAAa;MACpC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,CAAC,CAAC;KAC1C,CAAC;;;gBAVK,KAAK;;EAYZ,MAAM;IACJ,QACE,kCACE,sBAAgB,EAAE,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IACjD,IAAI,CAAC,gBAAgB,IAAI,YAAM,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,gBAAgB,CAAQ,EAC5F,WAAK,KAAK,EAAC,uBAAuB,IAChC,YAAM,IAAI,EAAC,OAAO,GAAG,EACrB,YAAM,IAAI,EAAC,QAAQ,GAAG,EACtB,cAAQ,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,0CAA0C,EAAC,OAAO,EAAE,IAAI,CAAC,aAAa,IAChG,gBAAU,IAAI,EAAC,OAAO,GAAY,EAClC,YAAM,KAAK,EAAC,SAAS,0BAA2B,CACzC,CACL,EACN,WAAK,KAAK,EAAC,wBAAwB,IACjC,eAAQ,CACJ,CACS,CACM,EACzB;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/annotation-output/annotation-output.scss?tag=dso-annotation-output","src/components/annotation-output/annotation-output.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n\r\n@include utilities.box-sizing();\r\n\r\ndso-annotation-output {\r\n display: block;\r\n}\r\n\r\n.sr-only {\r\n @include utilities.sr-only();\r\n}\r\n\r\n.dso-annotation-header {\r\n align-items: center;\r\n background-color: colors.$grijs-5;\r\n clear: both;\r\n display: flex;\r\n margin-bottom: 2px;\r\n margin-top: units.$u1;\r\n padding-left: units.$u2;\r\n padding-right: units.$u1;\r\n padding-top: units.$u1;\r\n padding-bottom: units.$u1;\r\n\r\n > [slot=\"title\"] {\r\n color: colors.$zwart;\r\n font-size: 1.25rem;\r\n margin-bottom: 0;\r\n margin-top: 0;\r\n }\r\n\r\n > :nth-child(2) {\r\n margin-left: auto;\r\n }\r\n}\r\n\r\ndso-responsive-element[small],\r\ndso-responsive-element[medium] {\r\n .dso-annotation-header {\r\n display: grid;\r\n row-gap: units.$u1;\r\n\r\n [slot=\"title\"] {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n [slot=\"addons\"] {\r\n grid-row: 2;\r\n grid-column: 1;\r\n margin-left: initial;\r\n }\r\n\r\n .dso-annotation-close-button {\r\n grid-row: 1;\r\n grid-column: 2;\r\n margin-left: units.$u1;\r\n text-align: end;\r\n }\r\n }\r\n}\r\n\r\n.dso-annotation-content {\r\n background-color: colors.$grijs-5;\r\n padding-left: units.$u2;\r\n padding-right: units.$u1;\r\n padding-top: units.$u1;\r\n padding-bottom: units.$u1;\r\n}\r\n\r\n.dso-annotation-close-button {\r\n margin-left: units.$u4;\r\n}\r\n\r\n.dso-annotation-prefix {\r\n font-style: italic;\r\n}\r\n","import { h, Component, ComponentInterface, Event, EventEmitter, Prop } from \"@stencil/core\";\r\n\r\nexport interface AnnotationOutputCloseEvent {\r\n originalEvent: Event;\r\n}\r\n\r\n@Component({\r\n tag: \"dso-annotation-output\",\r\n styleUrl: \"annotation-output.scss\",\r\n // No shadowdom for a11y reasons (aria-controls being set inside another component)\r\n})\r\nexport class AnnotationOutput implements ComponentInterface {\r\n /*\r\n The annotation-button that toggles this component should have the same identifier.\r\n /\r\n @Prop({ reflect: true })\r\n identifier!: string;\r\n\r\n /\r\n This text will be displayed above the annotation-output when opened\r\n /\r\n @Prop({ reflect: true })\r\n annotationPrefix?: string;\r\n\r\n /\r\n Set to `true` to show content.\r\n /\r\n @Prop({ reflect: true })\r\n open = false;\r\n\r\n /\r\n This event is emitted when the user activates the Annotation Button.\r\n */\r\n @Event({ bubbles: false })\r\n dsoClose!: EventEmitter<AnnotationOutputCloseEvent>;\r\n\r\n private toggleHandler = (e: MouseEvent) => {\r\n this.dsoClose.emit({ originalEvent: e });\r\n };\r\n\r\n render() {\r\n return (\r\n <dso-responsive-element>\r\n <dso-expandable id={this.identifier} open={this.open}>\r\n {this.annotationPrefix && <span class=\"dso-annotation-prefix\">{this.annotationPrefix}</span>}\r\n <div class=\"dso-annotation-header\">\r\n <slot name=\"title\" />\r\n <slot name=\"addons\" />\r\n <button type=\"button\" class=\"dso-tertiary dso-annotation-close-button\" onClick={this.toggleHandler}>\r\n <dso-icon icon=\"times\"></dso-icon>\r\n <span class=\"sr-only\">Toelichting sluiten</span>\r\n </button>\r\n </div>\r\n <div class=\"dso-annotation-content\">\r\n <slot />\r\n </div>\r\n </dso-expandable>\r\n </dso-responsive-element>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/badge.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { c as clsx } from './clsx.m.js';
+import { c as clsx } from './clsx.js';
 const badgeCss = ":host{display:inline-block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-badge{background-color:#666;border:1px solid #666;border-radius:1em;color:#fff;display:inline-block;font-size:0.875em;line-height:1;min-width:1.5rem;padding:4px 8px;text-align:center}.dso-badge.badge-info{background-color:#6ca4d9;border-color:#6ca4d9;color:#000}.dso-badge.badge-primary{background-color:#275937;border-color:#275937;color:#fff}.dso-badge.badge-success{background-color:#39870c;border-color:#39870c;color:#fff}.dso-badge.badge-warning{background-color:#dcd400;border-color:#dcd400;color:#000}.dso-badge.badge-danger{background-color:#ce3f51;border-color:#ce3f51;color:#fff}.dso-badge.badge-error{background-color:#ce3f51;border-color:#ce3f51;color:#fff}.dso-badge.badge-outline{background-color:#fff;border-color:#191919;color:#191919}.dso-badge.badge-attention{background-color:#8b4a6a;border-color:#8b4a6a;color:#fff}";

package/dist/components/badge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"badge.js","mappings":";;;AAAA,MAAM,QAAQ,GAAG,qgCAAqgC;;MCQzgC,KAAK;;;;;;;EAOhB,MAAM;IACJ,QACE,YAAM,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC,SAAS,IAAI,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,IACvE,eAAa,CACR,EACP;GACH;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/badge/badge.scss?tag=dso-badge&encapsulation=shadow","./src/components/badge/badge.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/badge\";\r\n\r\n:host {\r\n display: inline-block;\r\n}\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.dso-badge {\r\n @include badge.root();\r\n}\r\n","import { Component, h, Prop } from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\n@Component({\r\n tag: \"dso-badge\",\r\n styleUrl: \"badge.scss\",\r\n shadow: true,\r\n})\r\nexport class Badge {\r\n /*\r\n The status of the Badge.\r\n */\r\n @Prop()\r\n status?: \"primary\" \| \"success\" \| \"info\" \| \"warning\" \| \"danger\" \| \"error\" \| \"outline\" \| \"attention\";\r\n\r\n render() {\r\n return (\r\n <span class={clsx(\"dso-badge\", { [`badge-${this.status}`]: this.status })}>\r\n <slot></slot>\r\n </span>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"badge.js","mappings":";;;AAAA,MAAM,QAAQ,GAAG,qgCAAqgC;;MCQzgC,KAAK;;;;;;;EAOhB,MAAM;IACJ,QACE,YAAM,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC,SAAS,IAAI,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,IACvE,eAAa,CACR,EACP;GACH;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/badge/badge.scss?tag=dso-badge&encapsulation=shadow","src/components/badge/badge.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/badge\";\r\n\r\n:host {\r\n display: inline-block;\r\n}\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.dso-badge {\r\n @include badge.root();\r\n}\r\n","import { Component, h, Prop } from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\n@Component({\r\n tag: \"dso-badge\",\r\n styleUrl: \"badge.scss\",\r\n shadow: true,\r\n})\r\nexport class Badge {\r\n /*\r\n The status of the Badge.\r\n */\r\n @Prop()\r\n status?: \"primary\" \| \"success\" \| \"info\" \| \"warning\" \| \"danger\" \| \"error\" \| \"outline\" \| \"attention\";\r\n\r\n render() {\r\n return (\r\n <span class={clsx(\"dso-badge\", { [`badge-${this.status}`]: this.status })}>\r\n <slot></slot>\r\n </span>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{clsx.m.js → clsx.js} RENAMED Viewed

@@ -2,4 +2,4 @@ function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else i
 export { clsx as c };
-//# sourceMappingURL=clsx.m.js.map
+//# sourceMappingURL=clsx.js.map

package/dist/components/clsx.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"clsx.js","mappings":"AAAA,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,QAAQ,EAAE,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,GAAG,QAAQ,EAAE,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAQ,SAAS,IAAI,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;;;;","names":[],"sources":["../../node_modules/clsx/dist/clsx.mjs"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f);else for(t in e)e[t]&&(n&&(n+=\" \"),n+=t);return n}export function clsx(){for(var e,t,f=0,n=\"\";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;"],"version":3}

package/dist/components/create-identifier.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"create-identifier.js","mappings":"AAAA;;;SAGgB,IAAI;EAClB,OAAO,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAC9C,CAAC;AAED;;;;SAIgB,gBAAgB,CAAC,MAAc;EAC7C,OAAO,GAAG,MAAM,IAAI,IAAI,EAAE,GAAG,IAAI,EAAE,IAAI,IAAI,EAAE,IAAI,IAAI,EAAE,IAAI,IAAI,EAAE,IAAI,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,CAAC;AAClG;;;;","names":[],"sources":["./src/utils/create-identifier.ts"],"sourcesContent":["/*\r\n Form random hash\r\n /\r\nexport function chr4() {\r\n return Math.random().toString(16).slice(-4);\r\n}\r\n\r\n/\r\n Create random identifier with a prefix\r\n * @param prefix\r\n */\r\nexport function createIdentifier(prefix: string): string {\r\n return `${prefix}-${chr4()}${chr4()}-${chr4()}-${chr4()}-${chr4()}-${chr4()}${chr4()}${chr4()}`;\r\n}\r\n"],"version":3}
1	+ {"file":"create-identifier.js","mappings":"AAAA;;;SAGgB,IAAI;EAClB,OAAO,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAC9C,CAAC;AAED;;;;SAIgB,gBAAgB,CAAC,MAAc;EAC7C,OAAO,GAAG,MAAM,IAAI,IAAI,EAAE,GAAG,IAAI,EAAE,IAAI,IAAI,EAAE,IAAI,IAAI,EAAE,IAAI,IAAI,EAAE,IAAI,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,CAAC;AAClG;;;;","names":[],"sources":["src/utils/create-identifier.ts"],"sourcesContent":["/*\r\n Form random hash\r\n /\r\nexport function chr4() {\r\n return Math.random().toString(16).slice(-4);\r\n}\r\n\r\n/\r\n Create random identifier with a prefix\r\n * @param prefix\r\n */\r\nexport function createIdentifier(prefix: string): string {\r\n return `${prefix}-${chr4()}${chr4()}-${chr4()}-${chr4()}-${chr4()}-${chr4()}${chr4()}${chr4()}`;\r\n}\r\n"],"version":3}

package/dist/components/document-component.js CHANGED Viewed

@@ -35,7 +35,7 @@ const Heading = (_a, children) => {
   }
 };
-const documentComponentCss = "ins{background-color:#e4f1d4;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25);color:#000;text-decoration:none}.not-applicable{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}:host{display:block}:host-context(dso-responsive-element:not([small])) .content{padding-left:24px}:host([type=LID]:where([wijzigactie=verwijder],[wijzigactie=voegtoe])){padding-left:8px;margin-right:8px}:host(:where([wijzigactie=verwijder],[wijzigactie=voegtoe])),:host(:where([wijzigactie=nieuweContainer],[wijzigactie=verwijderContainer])) .heading-container{padding-top:4px;padding-bottom:4px}:host([wijzigactie=verwijderContainer]) .heading-container,:host(:where([wijzigactie=verwijder])){background-color:#f5d8dc;color:#000;text-decoration:line-through}:host([wijzigactie=nieuweContainer]) .heading-container,:host([wijzigactie=voegtoe]){background-color:#e4f1d4;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25);color:#000}:host([filtered]){position:relative}:host([filtered])::before{content:\"\";position:absolute;display:block;width:3px;top:0;bottom:0;background-color:#6ca4d9}:host([open]) .heading-container{margin-bottom:8px}.toggle-button{border:0;padding:0;background:0;color:#275937;cursor:pointer}.heading-element{align-items:start;display:flex;font-size:1rem;color:#275937;margin:0}.heading-element>*{vertical-align:middle}:host([type=LID]) .heading-container{margin-bottom:0}:host([type=LID]) .wijzigactie-label{margin-left:0}:host([type=LID]) .heading-element{color:#000}:host([type=LID]) .content{padding-left:0 !important}:host(:not([type=LID])) .heading-element{cursor:pointer}:host(:not([type=LID])) .heading-element:hover,:host(:not([type=LID])) .heading-element:focus{color:#676cb0;text-decoration:underline}:host(:not([type=LID])) .heading-element:active{text-decoration:none}.addons{margin-inline-start:auto;display:flex;gap:8px}.heading{display:flex;gap:8px}:host([type=ARTIKEL]) .heading-element,:host([type=ARTIKEL]) .toggle-button{color:#000}.wijzigactie-label{font-style:italic;margin-left:24px}.heading-container{padding-right:8px}";
+const documentComponentCss = "ins{background-color:#e4f1d4;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25);color:#000;text-decoration:none}.not-applicable{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}:host{display:block}:host-context(dso-responsive-element:not([small])) .content{padding-left:24px}:host([type=LID]:where([wijzigactie=verwijder],[wijzigactie=voegtoe])){padding-left:8px;margin-right:8px}:host(:where([wijzigactie=verwijder],[wijzigactie=voegtoe])),:host(:where([wijzigactie=nieuweContainer],[wijzigactie=verwijderContainer])) .heading-container{padding-top:4px;padding-bottom:4px}:host([wijzigactie=verwijderContainer]) .heading-container,:host(:where([wijzigactie=verwijder])){background-color:#f5d8dc;color:#000;text-decoration:line-through}:host([wijzigactie=nieuweContainer]) .heading-container,:host([wijzigactie=voegtoe]){background-color:#e4f1d4;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25);color:#000}:host([filtered]){position:relative}:host([filtered])::before{content:\"\";position:absolute;display:block;width:3px;top:0;bottom:0;background-color:#6ca4d9}:host([open]) .heading-container{margin-bottom:8px}.toggle-button{border:0;padding:0;background:0;color:#275937;cursor:pointer}.heading-element{align-items:start;display:flex;font-size:1rem;color:#275937;margin:0}.heading-element>*{vertical-align:middle}:host([type=LID]) .heading-container{margin-bottom:0}:host([type=LID]) .wijzigactie-label{margin-left:0}:host([type=LID]) .heading-element{color:#000}:host([type=LID]) .content{padding-left:0 !important}:host(:not([type=LID])) .heading-element{cursor:pointer}:host(:not([type=LID])) .heading-element:hover,:host(:not([type=LID])) .heading-element:focus{color:var(--link-hover-color);text-decoration:underline}:host(:not([type=LID])) .heading-element:active{text-decoration:none}.addons{margin-inline-start:auto;display:flex;gap:8px}.heading{display:flex;gap:8px}:host([type=ARTIKEL]) .heading-element,:host([type=ARTIKEL]) .toggle-button{color:#000}.wijzigactie-label{font-style:italic;margin-left:24px}.heading-container{padding-right:8px}";
 const wijzigActieLabels = {
   nieuweContainer: "Toegevoegd",

package/dist/components/document-component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"document-component.js","mappings":";;;;;;;;;;;;;;;;;;;;AAOO,MAAM,OAAO,GAEhB,CAAC,EAAqB,EAAE,QAAQ;MAA/B,EAAE,OAAO,OAAY,EAAP,KAAK,cAAnB,WAAqB,CAAF;EACtB,QAAQ,OAAO;IACb,QAAQ;IACR,KAAK,IAAI;MACP,OAAO,0BAAQ,KAAK,GAAG,QAAQ,CAAM,CAAC;IACxC,KAAK,IAAI;MACP,OAAO,0BAAQ,KAAK,GAAG,QAAQ,CAAM,CAAC;IACxC,KAAK,IAAI;MACP,OAAO,0BAAQ,KAAK,GAAG,QAAQ,CAAM,CAAC;IACxC,KAAK,IAAI;MACP,OAAO,0BAAQ,KAAK,GAAG,QAAQ,CAAM,CAAC;IACxC,KAAK,IAAI;MACP,OAAO,0BAAQ,KAAK,GAAG,QAAQ,CAAM,CAAC;GACzC;AACH,CAAC;;ACvBD,MAAM,oBAAoB,GAAG,4iEAA4iE;;ACQzkE,MAAM,iBAAiB,GAA8D;EACnF,eAAe,EAAE,YAAY;EAC7B,SAAS,EAAE,YAAY;EACvB,kBAAkB,EAAE,YAAY;EAChC,OAAO,EAAE,YAAY;CACtB,CAAC;MAOW,iBAAiB;;;;;;;IAuHpB,uBAAkB,GAAG,CAAC,CAAa;MACzC,IAAI,IAAI,CAAC,IAAI,KAAK,KAAK,EAAE;QACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;OACjE;KACF,CAAC;mBAtH0C,IAAI;;;;;gBA8BzC,KAAK;oBAMD,KAAK;yBAMA,KAAK;oCAMM,KAAK;kCAMP,KAAK;qBAMlB,KAAK;wBAMF,KAAK;qBAMR,KAAK;0BAMA,KAAK;;;;;EAgCtB,IAAY,gBAAgB;IAC1B,OAAO,IAAI,CAAC,WAAW,IAAI,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;GAChE;EAQO,MAAM;IACZ,IAAI,IAAI,CAAC,SAAS,EAAE;MAClB,OAAO,WAAW,CAAC;KACpB;IAED,IAAI,IAAI,CAAC,YAAY,EAAE;MACrB,OAAO,cAAc,CAAC;KACvB;IAED,OAAO,SAAS,CAAC;GAClB;EAED,MAAM;IACJ,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;IAE7B,QACE,kBACE,WAAK,KAAK,EAAC,mBAAmB,IAC3B,IAAI,CAAC,WAAW,IAAI,YAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,gBAAgB,MAAS,EACpF,WAAK,KAAK,EAAC,SAAS,IAClB,EAAC,OAAO,IAAC,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,EAAC,iBAAiB,EAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,IACrF,IAAI,CAAC,IAAI,KAAK,KAAK,KAClB,cAAQ,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,eAAe,IACzC,gBAAU,IAAI,EAAE,IAAI,CAAC,IAAI,GAAG,cAAc,GAAG,eAAe,GAAa,CAClE,CACV,EACD,WAAK,KAAK,EAAC,OAAO,IACf,IAAI,CAAC,aAAa,IAAI,YAAM,KAAK,EAAC,gBAAgB,2BAA4B,EAC9E,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,SAAS,IAC1C,kBACG,IAAI,CAAC,KAAK,KACT,kBACG,GAAG,EACJ,wBAAkB,OAAO,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,SAAoB,CAChE,CACJ,EACA,IAAI,CAAC,MAAM,KACV,kBACG,GAAG,EACJ,wBAAkB,OAAO,EAAE,IAAI,CAAC,MAAM,EAAE,MAAM,SAAoB,CACjE,CACJ,EACA,IAAI,CAAC,SAAS,KACb,kBACG,GAAG,EACJ,wBAAkB,OAAO,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,SAAoB,CACpE,CACJ,CACA,KAEH,IAAI,CAAC,gBAAgB,CACtB,EACA,MAAM,IAAI,wBAAW,MAAM,MAAS,CACjC,CACE,EACT,IAAI,CAAC,wBAAwB,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,sBAAsB,KAC1E,kBACE,iBAAW,MAAM,EAAC,SAAS,sBAAkB,0BAA0B,QAE3D,EACZ,mBAAa,EAAE,EAAC,0BAA0B,qCAA6C,CACtF,CACJ,EACA,CAAC,IAAI,CAAC,sBAAsB,IAAI,IAAI,CAAC,SAAS,MAC7C,WAAK,KAAK,EAAC,QAAQ,IAChB,IAAI,CAAC,sBAAsB,KAC1B,iBAAW,MAAM,EAAC,SAAS,EAAC,OAAO,oBAEvB,CACb,EACA,IAAI,CAAC,SAAS,KACb,6BACE,UAAU,EAAC,YAAY,EACvB,IAAI,EAAE,IAAI,CAAC,cAAc,EACzB,UAAU,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,CAAC,GAC/C,CAC1B,CACG,CACP,CACG,CACF,EACN,YAAM,IAAI,EAAC,YAAY,GAAG,EACzB,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,YAAY,CAAC,KAC9C,WAAK,KAAK,EAAC,SAAS,IACjB,IAAI,CAAC,YAAY,KAChB,iBAAW,MAAM,EAAC,MAAM,iEAAuE,CAChG,EACD,wBAAkB,OAAO,EAAE,IAAI,CAAC,MAAM,GAAqB,CACvD,CACP,EACD,eAAQ,CACP,EACH;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/document-component/document-component-heading.tsx","./src/components/document-component/document-component.scss?tag=dso-document-component&encapsulation=shadow","./src/components/document-component/document-component.tsx"],"sourcesContent":["import { h, FunctionalComponent } from \"@stencil/core\";\r\nimport { JSXBase } from \"@stencil/core/internal\";\r\n\r\ninterface DocumentComponentHeadingProps {\r\n heading: \"h2\" \| \"h3\" \| \"h4\" \| \"h5\" \| \"h6\";\r\n}\r\n\r\nexport const Heading: FunctionalComponent<\r\n DocumentComponentHeadingProps & JSXBase.HTMLAttributes<HTMLHeadingElement>\r\n> = ({ heading, ...props }, children) => {\r\n switch (heading) {\r\n default:\r\n case \"h2\":\r\n return <h2 {...props}>{children}</h2>;\r\n case \"h3\":\r\n return <h3 {...props}>{children}</h3>;\r\n case \"h4\":\r\n return <h4 {...props}>{children}</h4>;\r\n case \"h5\":\r\n return <h5 {...props}>{children}</h5>;\r\n case \"h6\":\r\n return <h6 {...props}>{children}</h6>;\r\n }\r\n};\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/anchor\";\r\n@use \"~dso-toolkit/src/components/button\";\r\n@use \"~dso-toolkit/src/components/document-component\";\r\n@use \"~dso-toolkit/src/components/insert/insert\";\r\n\r\n.not-applicable {\r\n @include utilities.sr-only();\r\n}\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n:host-context(dso-responsive-element:not([small])) {\r\n .content {\r\n padding-left: document-component.$indent;\r\n }\r\n}\r\n\r\n:host([type=\"LID\"]:where([wijzigactie=\"verwijder\"], [wijzigactie=\"voegtoe\"])) {\r\n padding-left: units.$u1;\r\n margin-right: units.$u1;\r\n}\r\n\r\n:host(:where([wijzigactie=\"verwijder\"], [wijzigactie=\"voegtoe\"])),\r\n:host(:where([wijzigactie=\"nieuweContainer\"], [wijzigactie=\"verwijderContainer\"])) .heading-container {\r\n padding-top: units.$u1 * 0.5;\r\n padding-bottom: units.$u1 * 0.5;\r\n}\r\n\r\n:host([wijzigactie=\"verwijderContainer\"]) .heading-container,\r\n:host(:where([wijzigactie=\"verwijder\"])) {\r\n background-color: colors.$danger-bg-color;\r\n color: colors.$zwart;\r\n text-decoration: line-through;\r\n}\r\n\r\n:host([wijzigactie=\"nieuweContainer\"]) .heading-container,\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n background-color: colors.$success-bg-color;\r\n box-shadow: insert.$insert-box-shadow;\r\n color: colors.$zwart;\r\n}\r\n\r\n:host([filtered]) {\r\n position: relative;\r\n\r\n &::before {\r\n content: \"\";\r\n position: absolute;\r\n display: block;\r\n width: 3px;\r\n top: 0;\r\n bottom: 0;\r\n background-color: colors.$lichtblauw;\r\n }\r\n}\r\n\r\n:host([open]) {\r\n .heading-container {\r\n margin-bottom: units.$u1;\r\n }\r\n}\r\n\r\n.toggle-button {\r\n border: 0;\r\n padding: 0;\r\n background: 0;\r\n color: colors.$bosgroen;\r\n cursor: pointer;\r\n}\r\n\r\n.heading-element {\r\n align-items: start;\r\n display: flex;\r\n font-size: 1rem;\r\n color: colors.$bosgroen;\r\n margin: 0;\r\n\r\n > * {\r\n vertical-align: middle;\r\n }\r\n}\r\n\r\n:host([type=\"LID\"]) {\r\n .heading-container {\r\n margin-bottom: 0;\r\n }\r\n\r\n .wijzigactie-label {\r\n margin-left: 0;\r\n }\r\n\r\n .heading-element {\r\n color: colors.$zwart;\r\n }\r\n\r\n .content {\r\n padding-left: 0 !important;\r\n }\r\n}\r\n\r\n:host(:not([type=\"LID\"])) {\r\n .heading-element {\r\n cursor: pointer;\r\n\r\n @include anchor.pseudo();\r\n }\r\n}\r\n\r\n.addons {\r\n margin-inline-start: auto;\r\n display: flex;\r\n gap: units.$u1;\r\n}\r\n\r\n.heading {\r\n display: flex;\r\n gap: units.$u1;\r\n}\r\n\r\n:host([type=\"ARTIKEL\"]) {\r\n .heading-element,\r\n .toggle-button {\r\n color: colors.$zwart;\r\n }\r\n}\r\n\r\n.wijzigactie-label {\r\n font-style: italic;\r\n margin-left: document-component.$indent;\r\n}\r\n\r\n.heading-container {\r\n padding-right: units.$u1;\r\n}\r\n","import { h, Component, ComponentInterface, Event, EventEmitter, Fragment, Prop } from \"@stencil/core\";\r\nimport {\r\n DocumentComponentOpenToggleEvent,\r\n DocumentComponentToggleAnnotationEvent,\r\n DocumentComponentWijzigactie,\r\n} from \"./document-component.types\";\r\nimport { Heading } from \"./document-component-heading\";\r\n\r\nconst wijzigActieLabels: { [wijzigActie in DocumentComponentWijzigactie]: string } = {\r\n nieuweContainer: \"Toegevoegd\",\r\n verwijder: \"Verwijderd\",\r\n verwijderContainer: \"Verwijderd\",\r\n voegtoe: \"Toegevoegd\",\r\n};\r\n\r\n@Component({\r\n tag: \"dso-document-component\",\r\n styleUrl: \"document-component.scss\",\r\n shadow: true,\r\n})\r\nexport class DocumentComponent implements ComponentInterface {\r\n /*\r\n The heading element to use.\r\n /\r\n @Prop()\r\n heading: \"h2\" \| \"h3\" \| \"h4\" \| \"h5\" \| \"h6\" = \"h2\";\r\n\r\n /\r\n The Label XML.\r\n /\r\n @Prop()\r\n label?: string;\r\n\r\n /\r\n The Nummer XML.\r\n /\r\n @Prop()\r\n nummer?: string;\r\n\r\n /\r\n The Opschrift XML.\r\n /\r\n @Prop()\r\n opschrift?: string;\r\n\r\n /\r\n The Inhoud XML.\r\n /\r\n @Prop()\r\n inhoud?: string;\r\n\r\n /\r\n This boolean attribute indicates whether the children are visible.\r\n /\r\n @Prop({ reflect: true })\r\n open = false;\r\n\r\n /\r\n Marks this Document Component as belonging to an active filter.\r\n /\r\n @Prop({ reflect: true })\r\n filtered = false;\r\n\r\n /\r\n Marks this Document Component as not-applicable.\r\n /\r\n @Prop({ reflect: true })\r\n notApplicable = false;\r\n\r\n /\r\n When a child Document Component has a status \"Draft\".\r\n /\r\n @Prop({ reflect: true })\r\n genesteOntwerpInformatie = false;\r\n\r\n /\r\n Marks as draft.\r\n /\r\n @Prop({ reflect: true })\r\n bevatOntwerpInformatie = false;\r\n\r\n /\r\n Enables annotations.\r\n /\r\n @Prop({ reflect: true })\r\n annotated = false;\r\n\r\n /\r\n Marks Document Component as reserved.\r\n /\r\n @Prop()\r\n gereserveerd = false;\r\n\r\n /\r\n Marks the Document Component as expired.\r\n /\r\n @Prop()\r\n vervallen = false;\r\n\r\n /\r\n When the Annotation Output is opened, set this to true.\r\n /\r\n @Prop()\r\n openAnnotation = false;\r\n\r\n /\r\n An alternative title to show when there is nothing to create a title.\r\n /\r\n @Prop()\r\n alternativeTitle?: string;\r\n\r\n /\r\n Type of Document Component.\r\n /\r\n @Prop({ reflect: true })\r\n type?: string;\r\n\r\n /\r\n The wijzigactie as in STOP.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: DocumentComponentWijzigactie;\r\n\r\n /\r\n Emitted when the user activates the toggle.\r\n /\r\n @Event({ bubbles: false })\r\n dsoOpenToggle!: EventEmitter<DocumentComponentOpenToggleEvent>;\r\n\r\n /\r\n Emitted when the user activates the annotation button.\r\n */\r\n @Event({ bubbles: false })\r\n dsoAnnotationToggle!: EventEmitter<DocumentComponentToggleAnnotationEvent>;\r\n\r\n private get wijzigactieLabel(): string \| undefined {\r\n return this.wijzigactie && wijzigActieLabels[this.wijzigactie];\r\n }\r\n\r\n private handleHeadingClick = (e: MouseEvent) => {\r\n if (this.type !== \"LID\") {\r\n this.dsoOpenToggle.emit({ originalEvent: e, open: !this.open });\r\n }\r\n };\r\n\r\n private suffix(): string \| undefined {\r\n if (this.vervallen) {\r\n return \"vervallen\";\r\n }\r\n\r\n if (this.gereserveerd) {\r\n return \"gereserveerd\";\r\n }\r\n\r\n return undefined;\r\n }\r\n\r\n render() {\r\n const suffix = this.suffix();\r\n\r\n return (\r\n <>\r\n <div class=\"heading-container\">\r\n {this.wijzigactie && <span class=\"wijzigactie-label\">{this.wijzigactieLabel}:</span>}\r\n <div class=\"heading\">\r\n <Heading heading={this.heading} class=\"heading-element\" onClick={this.handleHeadingClick}>\r\n {this.type !== \"LID\" && (\r\n <button type=\"button\" class=\"toggle-button\">\r\n <dso-icon icon={this.open ? \"chevron-down\" : \"chevron-right\"}></dso-icon>\r\n </button>\r\n )}\r\n <div class=\"title\">\r\n {this.notApplicable && <span class=\"not-applicable\">Niet van toepassing:</span>}\r\n {this.label \|\| this.nummer \|\| this.opschrift ? (\r\n <>\r\n {this.label && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content content={this.label} inline></dso-ozon-content>\r\n </>\r\n )}\r\n {this.nummer && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content content={this.nummer} inline></dso-ozon-content>\r\n </>\r\n )}\r\n {this.opschrift && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content content={this.opschrift} inline></dso-ozon-content>\r\n </>\r\n )}\r\n </>\r\n ) : (\r\n this.alternativeTitle\r\n )}\r\n {suffix && <span> - [{suffix}]</span>}\r\n </div>\r\n </Heading>\r\n {this.genesteOntwerpInformatie && !this.open && !this.bevatOntwerpInformatie && (\r\n <>\r\n <dso-badge status=\"warning\" aria-describedby=\"nested-draft-description\">\r\n !\r\n </dso-badge>\r\n <dso-tooltip id=\"nested-draft-description\">Er is een ontwerp beschikbaar.</dso-tooltip>\r\n </>\r\n )}\r\n {(this.bevatOntwerpInformatie \|\| this.annotated) && (\r\n <div class=\"addons\">\r\n {this.bevatOntwerpInformatie && (\r\n <dso-label status=\"warning\" compact>\r\n Ontwerp\r\n </dso-label>\r\n )}\r\n {this.annotated && (\r\n <dso-annotation-button\r\n identifier=\"expandable\"\r\n open={this.openAnnotation}\r\n onDsoClick={(e) => this.dsoAnnotationToggle.emit({ originalEvent: e })}\r\n ></dso-annotation-button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n <slot name=\"annotation\" />\r\n {this.open && (this.inhoud \|\| this.gereserveerd) && (\r\n <div class=\"content\">\r\n {this.gereserveerd && (\r\n <dso-alert status=\"info\">Dit onderdeel is gereserveerd voor toekomstige toevoeging.</dso-alert>\r\n )}\r\n <dso-ozon-content content={this.inhoud}></dso-ozon-content>\r\n </div>\r\n )}\r\n <slot />\r\n </>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"document-component.js","mappings":"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","names":[],"sources":["src/components/document-component/document-component-heading.tsx","src/components/document-component/document-component.scss?tag=dso-document-component&encapsulation=shadow","src/components/document-component/document-component.tsx"],"sourcesContent":["import { h, FunctionalComponent } from \"@stencil/core\";\r\nimport { JSXBase } from \"@stencil/core/internal\";\r\n\r\ninterface DocumentComponentHeadingProps {\r\n heading: \"h2\" \| \"h3\" \| \"h4\" \| \"h5\" \| \"h6\";\r\n}\r\n\r\nexport const Heading: FunctionalComponent<\r\n DocumentComponentHeadingProps & JSXBase.HTMLAttributes<HTMLHeadingElement>\r\n> = ({ heading, ...props }, children) => {\r\n switch (heading) {\r\n default:\r\n case \"h2\":\r\n return <h2 {...props}>{children}</h2>;\r\n case \"h3\":\r\n return <h3 {...props}>{children}</h3>;\r\n case \"h4\":\r\n return <h4 {...props}>{children}</h4>;\r\n case \"h5\":\r\n return <h5 {...props}>{children}</h5>;\r\n case \"h6\":\r\n return <h6 {...props}>{children}</h6>;\r\n }\r\n};\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/anchor\";\r\n@use \"~dso-toolkit/src/components/button\";\r\n@use \"~dso-toolkit/src/components/document-component\";\r\n@use \"~dso-toolkit/src/components/insert/insert\";\r\n\r\n.not-applicable {\r\n @include utilities.sr-only();\r\n}\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n:host-context(dso-responsive-element:not([small])) {\r\n .content {\r\n padding-left: document-component.$indent;\r\n }\r\n}\r\n\r\n:host([type=\"LID\"]:where([wijzigactie=\"verwijder\"], [wijzigactie=\"voegtoe\"])) {\r\n padding-left: units.$u1;\r\n margin-right: units.$u1;\r\n}\r\n\r\n:host(:where([wijzigactie=\"verwijder\"], [wijzigactie=\"voegtoe\"])),\r\n:host(:where([wijzigactie=\"nieuweContainer\"], [wijzigactie=\"verwijderContainer\"])) .heading-container {\r\n padding-top: units.$u1 * 0.5;\r\n padding-bottom: units.$u1 * 0.5;\r\n}\r\n\r\n:host([wijzigactie=\"verwijderContainer\"]) .heading-container,\r\n:host(:where([wijzigactie=\"verwijder\"])) {\r\n background-color: colors.$danger-bg-color;\r\n color: colors.$zwart;\r\n text-decoration: line-through;\r\n}\r\n\r\n:host([wijzigactie=\"nieuweContainer\"]) .heading-container,\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n background-color: colors.$success-bg-color;\r\n box-shadow: insert.$insert-box-shadow;\r\n color: colors.$zwart;\r\n}\r\n\r\n:host([filtered]) {\r\n position: relative;\r\n\r\n &::before {\r\n content: \"\";\r\n position: absolute;\r\n display: block;\r\n width: 3px;\r\n top: 0;\r\n bottom: 0;\r\n background-color: colors.$lichtblauw;\r\n }\r\n}\r\n\r\n:host([open]) {\r\n .heading-container {\r\n margin-bottom: units.$u1;\r\n }\r\n}\r\n\r\n.toggle-button {\r\n border: 0;\r\n padding: 0;\r\n background: 0;\r\n color: colors.$bosgroen;\r\n cursor: pointer;\r\n}\r\n\r\n.heading-element {\r\n align-items: start;\r\n display: flex;\r\n font-size: 1rem;\r\n color: colors.$bosgroen;\r\n margin: 0;\r\n\r\n > * {\r\n vertical-align: middle;\r\n }\r\n}\r\n\r\n:host([type=\"LID\"]) {\r\n .heading-container {\r\n margin-bottom: 0;\r\n }\r\n\r\n .wijzigactie-label {\r\n margin-left: 0;\r\n }\r\n\r\n .heading-element {\r\n color: colors.$zwart;\r\n }\r\n\r\n .content {\r\n padding-left: 0 !important;\r\n }\r\n}\r\n\r\n:host(:not([type=\"LID\"])) {\r\n .heading-element {\r\n cursor: pointer;\r\n\r\n @include anchor.pseudo();\r\n }\r\n}\r\n\r\n.addons {\r\n margin-inline-start: auto;\r\n display: flex;\r\n gap: units.$u1;\r\n}\r\n\r\n.heading {\r\n display: flex;\r\n gap: units.$u1;\r\n}\r\n\r\n:host([type=\"ARTIKEL\"]) {\r\n .heading-element,\r\n .toggle-button {\r\n color: colors.$zwart;\r\n }\r\n}\r\n\r\n.wijzigactie-label {\r\n font-style: italic;\r\n margin-left: document-component.$indent;\r\n}\r\n\r\n.heading-container {\r\n padding-right: units.$u1;\r\n}\r\n","import { h, Component, ComponentInterface, Event, EventEmitter, Fragment, Prop } from \"@stencil/core\";\r\nimport {\r\n DocumentComponentOpenToggleEvent,\r\n DocumentComponentToggleAnnotationEvent,\r\n DocumentComponentWijzigactie,\r\n} from \"./document-component.types\";\r\nimport { Heading } from \"./document-component-heading\";\r\n\r\nconst wijzigActieLabels: { [wijzigActie in DocumentComponentWijzigactie]: string } = {\r\n nieuweContainer: \"Toegevoegd\",\r\n verwijder: \"Verwijderd\",\r\n verwijderContainer: \"Verwijderd\",\r\n voegtoe: \"Toegevoegd\",\r\n};\r\n\r\n@Component({\r\n tag: \"dso-document-component\",\r\n styleUrl: \"document-component.scss\",\r\n shadow: true,\r\n})\r\nexport class DocumentComponent implements ComponentInterface {\r\n /*\r\n The heading element to use.\r\n /\r\n @Prop()\r\n heading: \"h2\" \| \"h3\" \| \"h4\" \| \"h5\" \| \"h6\" = \"h2\";\r\n\r\n /\r\n The Label XML.\r\n /\r\n @Prop()\r\n label?: string;\r\n\r\n /\r\n The Nummer XML.\r\n /\r\n @Prop()\r\n nummer?: string;\r\n\r\n /\r\n The Opschrift XML.\r\n /\r\n @Prop()\r\n opschrift?: string;\r\n\r\n /\r\n The Inhoud XML.\r\n /\r\n @Prop()\r\n inhoud?: string;\r\n\r\n /\r\n This boolean attribute indicates whether the children are visible.\r\n /\r\n @Prop({ reflect: true })\r\n open = false;\r\n\r\n /\r\n Marks this Document Component as belonging to an active filter.\r\n /\r\n @Prop({ reflect: true })\r\n filtered = false;\r\n\r\n /\r\n Marks this Document Component as not-applicable.\r\n /\r\n @Prop({ reflect: true })\r\n notApplicable = false;\r\n\r\n /\r\n When a child Document Component has a status \"Draft\".\r\n /\r\n @Prop({ reflect: true })\r\n genesteOntwerpInformatie = false;\r\n\r\n /\r\n Marks as draft.\r\n /\r\n @Prop({ reflect: true })\r\n bevatOntwerpInformatie = false;\r\n\r\n /\r\n Enables annotations.\r\n /\r\n @Prop({ reflect: true })\r\n annotated = false;\r\n\r\n /\r\n Marks Document Component as reserved.\r\n /\r\n @Prop()\r\n gereserveerd = false;\r\n\r\n /\r\n Marks the Document Component as expired.\r\n /\r\n @Prop()\r\n vervallen = false;\r\n\r\n /\r\n When the Annotation Output is opened, set this to true.\r\n /\r\n @Prop()\r\n openAnnotation = false;\r\n\r\n /\r\n An alternative title to show when there is nothing to create a title.\r\n /\r\n @Prop()\r\n alternativeTitle?: string;\r\n\r\n /\r\n Type of Document Component.\r\n /\r\n @Prop({ reflect: true })\r\n type?: string;\r\n\r\n /\r\n The wijzigactie as in STOP.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: DocumentComponentWijzigactie;\r\n\r\n /\r\n Emitted when the user activates the toggle.\r\n /\r\n @Event({ bubbles: false })\r\n dsoOpenToggle!: EventEmitter<DocumentComponentOpenToggleEvent>;\r\n\r\n /\r\n Emitted when the user activates the annotation button.\r\n */\r\n @Event({ bubbles: false })\r\n dsoAnnotationToggle!: EventEmitter<DocumentComponentToggleAnnotationEvent>;\r\n\r\n private get wijzigactieLabel(): string \| undefined {\r\n return this.wijzigactie && wijzigActieLabels[this.wijzigactie];\r\n }\r\n\r\n private handleHeadingClick = (e: MouseEvent) => {\r\n if (this.type !== \"LID\") {\r\n this.dsoOpenToggle.emit({ originalEvent: e, open: !this.open });\r\n }\r\n };\r\n\r\n private suffix(): string \| undefined {\r\n if (this.vervallen) {\r\n return \"vervallen\";\r\n }\r\n\r\n if (this.gereserveerd) {\r\n return \"gereserveerd\";\r\n }\r\n\r\n return undefined;\r\n }\r\n\r\n render() {\r\n const suffix = this.suffix();\r\n\r\n return (\r\n <>\r\n <div class=\"heading-container\">\r\n {this.wijzigactie && <span class=\"wijzigactie-label\">{this.wijzigactieLabel}:</span>}\r\n <div class=\"heading\">\r\n <Heading heading={this.heading} class=\"heading-element\" onClick={this.handleHeadingClick}>\r\n {this.type !== \"LID\" && (\r\n <button type=\"button\" class=\"toggle-button\">\r\n <dso-icon icon={this.open ? \"chevron-down\" : \"chevron-right\"}></dso-icon>\r\n </button>\r\n )}\r\n <div class=\"title\">\r\n {this.notApplicable && <span class=\"not-applicable\">Niet van toepassing:</span>}\r\n {this.label \|\| this.nummer \|\| this.opschrift ? (\r\n <>\r\n {this.label && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content content={this.label} inline></dso-ozon-content>\r\n </>\r\n )}\r\n {this.nummer && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content content={this.nummer} inline></dso-ozon-content>\r\n </>\r\n )}\r\n {this.opschrift && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content content={this.opschrift} inline></dso-ozon-content>\r\n </>\r\n )}\r\n </>\r\n ) : (\r\n this.alternativeTitle\r\n )}\r\n {suffix && <span> - [{suffix}]</span>}\r\n </div>\r\n </Heading>\r\n {this.genesteOntwerpInformatie && !this.open && !this.bevatOntwerpInformatie && (\r\n <>\r\n <dso-badge status=\"warning\" aria-describedby=\"nested-draft-description\">\r\n !\r\n </dso-badge>\r\n <dso-tooltip id=\"nested-draft-description\">Er is een ontwerp beschikbaar.</dso-tooltip>\r\n </>\r\n )}\r\n {(this.bevatOntwerpInformatie \|\| this.annotated) && (\r\n <div class=\"addons\">\r\n {this.bevatOntwerpInformatie && (\r\n <dso-label status=\"warning\" compact>\r\n Ontwerp\r\n </dso-label>\r\n )}\r\n {this.annotated && (\r\n <dso-annotation-button\r\n identifier=\"expandable\"\r\n open={this.openAnnotation}\r\n onDsoClick={(e) => this.dsoAnnotationToggle.emit({ originalEvent: e })}\r\n ></dso-annotation-button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n <slot name=\"annotation\" />\r\n {this.open && (this.inhoud \|\| this.gereserveerd) && (\r\n <div class=\"content\">\r\n {this.gereserveerd && (\r\n <dso-alert status=\"info\">Dit onderdeel is gereserveerd voor toekomstige toevoeging.</dso-alert>\r\n )}\r\n <dso-ozon-content content={this.inhoud}></dso-ozon-content>\r\n </div>\r\n )}\r\n <slot />\r\n </>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/dropdown-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dropdown-menu.js","mappings":"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","names":["uuidv4"],"sources":["./src/components/dropdown-menu/dropdown-menu.scss?tag=dso-dropdown-menu&encapsulation=shadow","./src/components/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/components/dropdown-menu\";\r\n\r\n:host(:focus) {\r\n outline: none;\r\n}\r\n\r\n:host {\r\n @include dropdown-menu.root();\r\n}\r\n","import { createPopper, Instance as PopperInstance } from \"@popperjs/core\";\r\nimport { h, Component, Element, Host, Prop, Watch } from \"@stencil/core\";\r\nimport { FocusableElement, tabbable } from \"tabbable\";\r\nimport { v4 as uuidv4 } from \"uuid\";\r\n\r\nimport { hasOverflow } from \"../../utils/has-overflow\";\r\n\r\n@Component({\r\n tag: \"dso-dropdown-menu\",\r\n styleUrl: \"dropdown-menu.scss\",\r\n shadow: true,\r\n})\r\nexport class DropdownMenu {\r\n /*\r\n Whether the menu is open or closed.\r\n * This attribute is reflected and mutable.\r\n /\r\n @Prop({ reflect: true, mutable: true })\r\n open = false;\r\n\r\n /\r\n Alignment of the dropdown\r\n /\r\n @Prop()\r\n dropdownAlign: \"left\" \| \"right\" = \"left\";\r\n\r\n /\r\n Space between button and dropdown options\r\n /\r\n @Prop()\r\n dropdownOptionsOffset = 2;\r\n\r\n /\r\n Whether the menu is checkable.\r\n /\r\n @Prop()\r\n checkable = false;\r\n\r\n /\r\n Selector for the element the dropdown options should not be overflowing.\r\n /\r\n @Prop()\r\n boundary?: string;\r\n\r\n /\r\n Set position strategy of dropdown options\r\n */\r\n @Prop()\r\n strategy: \"auto\" \| \"absolute\" \| \"fixed\" = \"auto\";\r\n\r\n @Watch(\"dropdownAlign\")\r\n watchPosition() {\r\n if (!this.popper) {\r\n return;\r\n }\r\n\r\n this.popper.setOptions({\r\n placement: this.dropdownAlign === \"right\" ? \"bottom-end\" : \"bottom-start\",\r\n });\r\n }\r\n\r\n @Watch(\"dropdownOptionsOffset\")\r\n watchOptionsOffset() {\r\n this.popper?.setOptions({\r\n modifiers: [\r\n {\r\n name: \"offset\",\r\n options: {\r\n offset: [0, this.dropdownOptionsOffset],\r\n },\r\n },\r\n ],\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.host;\r\n\r\n const boundary = this.boundary \|\| document;\r\n\r\n while (element && element.parentNode !== boundary) {\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 @Element()\r\n host!: HTMLDsoDropdownMenuElement;\r\n\r\n private popper: PopperInstance \| undefined;\r\n\r\n get button(): HTMLButtonElement {\r\n const button = this.host.querySelector('button[slot=\"toggle\"]');\r\n\r\n if (!(button instanceof HTMLButtonElement)) {\r\n throw new ReferenceError(\"Mandatory toggle button not found\");\r\n }\r\n\r\n return button;\r\n }\r\n\r\n get tabbables(): FocusableElement[] {\r\n return tabbable(this.host).filter((e) => e !== this.button);\r\n }\r\n\r\n componentDidLoad() {\r\n this.button.setAttribute(\"aria-haspopup\", \"menu\");\r\n this.button.setAttribute(\"aria-expanded\", \"false\");\r\n if (!this.button.id) {\r\n this.button.id = uuidv4();\r\n }\r\n\r\n this.button.addEventListener(\"click\", () => {\r\n this.open = !this.open;\r\n });\r\n\r\n const options = this.host.querySelector(\".dso-dropdown-options\");\r\n if (!options) {\r\n throw new ReferenceError(\"Dropdown options not found\");\r\n }\r\n\r\n options.setAttribute(\"role\", \"menu\");\r\n options.setAttribute(\"aria-labelledby\", this.button.id);\r\n\r\n for (const ul of Array.from(this.host.getElementsByTagName(\"ul\"))) {\r\n ul.setAttribute(\"role\", \"group\");\r\n for (const li of Array.from(ul.getElementsByTagName(\"li\"))) {\r\n li.setAttribute(\"role\", \"none\");\r\n }\r\n }\r\n\r\n if (this.popper) {\r\n return;\r\n }\r\n\r\n const dropdownOptionsElement = this.host.querySelector(\".dso-dropdown-options\");\r\n\r\n if (!(dropdownOptionsElement instanceof HTMLElement)) {\r\n throw new Error(\"dropdown options element is not instanceof HTMLElement\");\r\n }\r\n\r\n this.popper = createPopper(this.button, dropdownOptionsElement, {\r\n placement: this.dropdownAlign === \"right\" ? \"bottom-end\" : \"bottom-start\",\r\n modifiers: [\r\n {\r\n name: \"offset\",\r\n options: {\r\n offset: [0, this.dropdownOptionsOffset],\r\n },\r\n },\r\n {\r\n name: \"preventOverflow\",\r\n options: {\r\n boundary: this.boundary ? document.querySelector(this.boundary) : null,\r\n },\r\n enabled: this.boundary !== undefined,\r\n },\r\n ],\r\n });\r\n }\r\n\r\n componentDidRender() {\r\n this.setStrategy();\r\n if (this.open) {\r\n this.popper?.update();\r\n }\r\n\r\n for (const li of Array.from(this.host.getElementsByTagName(\"li\"))) {\r\n for (const tab of tabbable(li)) {\r\n tab.setAttribute(\"role\", this.checkable ? \"menuitemradio\" : \"menuitem\");\r\n\r\n if (this.checkable) {\r\n tab.setAttribute(\"aria-checked\", li.classList.contains(\"dso-checked\").toString());\r\n }\r\n }\r\n }\r\n\r\n this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n this.button.setAttribute(\"aria-expanded\", this.open ? \"true\" : \"false\");\r\n if (this.open) {\r\n this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n }\r\n\r\n this.tabbables.forEach((focusableElement) => {\r\n focusableElement.removeEventListener(\"click\", this.escape);\r\n if (this.open) {\r\n focusableElement.addEventListener(\"click\", this.escape);\r\n }\r\n });\r\n }\r\n\r\n disconnectedCallback() {\r\n this.popper?.destroy();\r\n }\r\n\r\n private focusOutListener = (event: FocusEvent) => {\r\n if (!this.tabbables.includes(event.relatedTarget as FocusableElement)) {\r\n this.open = false;\r\n }\r\n };\r\n\r\n private keyDownListener = (event: KeyboardEvent) => {\r\n if (event.defaultPrevented) {\r\n return;\r\n }\r\n\r\n switch (event.key) {\r\n case \"ArrowDown\":\r\n this.tabInPopup(1);\r\n break;\r\n\r\n case \"ArrowUp\":\r\n this.tabInPopup(-1);\r\n break;\r\n\r\n case \"Escape\":\r\n this.escape();\r\n break;\r\n\r\n case \" \":\r\n if (event.target instanceof HTMLElement) {\r\n event.target.click();\r\n }\r\n\r\n break;\r\n\r\n default:\r\n return;\r\n }\r\n\r\n event.preventDefault();\r\n };\r\n\r\n private getActiveElement(root: Document \| ShadowRoot = document): Element \| null {\r\n const activeEl = root.activeElement;\r\n\r\n if (!activeEl) {\r\n return null;\r\n }\r\n\r\n if (activeEl.shadowRoot) {\r\n return this.getActiveElement(activeEl.shadowRoot);\r\n }\r\n\r\n return activeEl;\r\n }\r\n\r\n private tabInPopup(direction: number) {\r\n const tabs = this.tabbables;\r\n const currentIndex = tabs.findIndex((e) => e === this.getActiveElement());\r\n\r\n let nextIndex = currentIndex + direction;\r\n if (nextIndex >= tabs.length) {\r\n nextIndex = 0;\r\n } else if (nextIndex < 0) {\r\n nextIndex = tabs.length - 1;\r\n }\r\n\r\n tabs[nextIndex]?.focus();\r\n }\r\n\r\n private escape = () => {\r\n this.button.focus();\r\n this.open = false;\r\n };\r\n\r\n render() {\r\n return (\r\n <Host onFocusout={this.focusOutListener} tabindex={this.open ? \"-1\" : undefined}>\r\n <slot name=\"toggle\" />\r\n <div hidden={!this.open}>\r\n <slot />\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"dropdown-menu.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,wDAAwD;;MCYnE,YAAY;;;;;IAkNf,qBAAgB,GAAG,CAAC,KAAiB;MAC3C,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAiC,CAAC,EAAE;QACrE,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;OACnB;KACF,CAAC;IAEM,oBAAe,GAAG,CAAC,KAAoB;MAC7C,IAAI,KAAK,CAAC,gBAAgB,EAAE;QAC1B,OAAO;OACR;MAED,QAAQ,KAAK,CAAC,GAAG;QACf,KAAK,WAAW;UACd,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;UACnB,MAAM;QAER,KAAK,SAAS;UACZ,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;UACpB,MAAM;QAER,KAAK,QAAQ;UACX,IAAI,CAAC,MAAM,EAAE,CAAC;UACd,MAAM;QAER,KAAK,GAAG;UACN,IAAI,KAAK,CAAC,MAAM,YAAY,WAAW,EAAE;YACvC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;WACtB;UAED,MAAM;QAER;UACE,OAAO;OACV;MAED,KAAK,CAAC,cAAc,EAAE,CAAC;KACxB,CAAC;IA8BM,WAAM,GAAG;MACf,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;MACpB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;KACnB,CAAC;gBAjRK,KAAK;yBAMsB,MAAM;iCAMhB,CAAC;qBAMb,KAAK;;oBAYyB,MAAM;;EAGhD,aAAa;IACX,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;MAChB,OAAO;KACR;IAED,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC;MACrB,SAAS,EAAE,IAAI,CAAC,aAAa,KAAK,OAAO,GAAG,YAAY,GAAG,cAAc;KAC1E,CAAC,CAAC;GACJ;EAGD,kBAAkB;;IAChB,MAAA,IAAI,CAAC,MAAM,0CAAE,UAAU,CAAC;MACtB,SAAS,EAAE;QACT;UACE,IAAI,EAAE,QAAQ;UACd,OAAO,EAAE;YACP,MAAM,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC,qBAAqB,CAAC;WACxC;SACF;OACF;KACF,CAAC,CAAC;GACJ;EAGD,aAAa;IACX,IAAI,CAAC,WAAW,EAAE,CAAC;GACpB;EAEO,WAAW;IACjB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;MAChB,OAAO;KACR;IAED,IAAI,IAAI,CAAC,QAAQ,KAAK,UAAU,IAAI,IAAI,CAAC,QAAQ,KAAK,OAAO,EAAE;MAC7D,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC;QACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACxB,CAAC,CAAC;MAEH,OAAO;KACR;IAED,IAAI,OAAO,GAAmB,IAAI,CAAC,IAAI,CAAC;IAExC,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC;IAE3C,OAAO,OAAO,IAAI,OAAO,CAAC,UAAU,KAAK,QAAQ,EAAE;MACjD,OAAO,GAAG,OAAO,CAAC,UAAU,YAAY,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC,IAAI,GAAG,OAAO,CAAC,aAAa,CAAC;MACrG,IAAI,OAAO,KAAK,IAAI,IAAI,WAAW,CAAC,OAAO,CAAC,EAAE;QAC5C,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC;UACrB,QAAQ,EAAE,OAAO;SAClB,CAAC,CAAC;QAEH,OAAO;OACR;KACF;IAED,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC;MACrB,QAAQ,EAAE,UAAU;KACrB,CAAC,CAAC;GACJ;EAOD,IAAI,MAAM;IACR,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;IAEhE,IAAI,EAAE,MAAM,YAAY,iBAAiB,CAAC,EAAE;MAC1C,MAAM,IAAI,cAAc,CAAC,mCAAmC,CAAC,CAAC;KAC/D;IAED,OAAO,MAAM,CAAC;GACf;EAED,IAAI,SAAS;IACX,OAAO,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC,MAAM,CAAC,CAAC;GAC7D;EAED,gBAAgB;IACd,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;IAClD,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,eAAe,EAAE,OAAO,CAAC,CAAC;IACnD,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,EAAE;MACnB,IAAI,CAAC,MAAM,CAAC,EAAE,GAAGA,EAAM,EAAE,CAAC;KAC3B;IAED,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE;MACpC,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;KACxB,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;IACjE,IAAI,CAAC,OAAO,EAAE;MACZ,MAAM,IAAI,cAAc,CAAC,4BAA4B,CAAC,CAAC;KACxD;IAED,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACrC,OAAO,CAAC,YAAY,CAAC,iBAAiB,EAAE,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IAExD,KAAK,MAAM,EAAE,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC,EAAE;MACjE,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;MACjC,KAAK,MAAM,EAAE,IAAI,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC,EAAE;QAC1D,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;OACjC;KACF;IAED,IAAI,IAAI,CAAC,MAAM,EAAE;MACf,OAAO;KACR;IAED,MAAM,sBAAsB,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;IAEhF,IAAI,EAAE,sBAAsB,YAAY,WAAW,CAAC,EAAE;MACpD,MAAM,IAAI,KAAK,CAAC,wDAAwD,CAAC,CAAC;KAC3E;IAED,IAAI,CAAC,MAAM,GAAG,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,sBAAsB,EAAE;MAC9D,SAAS,EAAE,IAAI,CAAC,aAAa,KAAK,OAAO,GAAG,YAAY,GAAG,cAAc;MACzE,SAAS,EAAE;QACT;UACE,IAAI,EAAE,QAAQ;UACd,OAAO,EAAE;YACP,MAAM,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC,qBAAqB,CAAC;WACxC;SACF;QACD;UACE,IAAI,EAAE,iBAAiB;UACvB,OAAO,EAAE;YACP,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,IAAI;WACvE;UACD,OAAO,EAAE,IAAI,CAAC,QAAQ,KAAK,SAAS;SACrC;OACF;KACF,CAAC,CAAC;GACJ;EAED,kBAAkB;;IAChB,IAAI,CAAC,WAAW,EAAE,CAAC;IACnB,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,EAAE,CAAC;KACvB;IAED,KAAK,MAAM,EAAE,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC,EAAE;MACjE,KAAK,MAAM,GAAG,IAAI,QAAQ,CAAC,EAAE,CAAC,EAAE;QAC9B,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,SAAS,GAAG,eAAe,GAAG,UAAU,CAAC,CAAC;QAExE,IAAI,IAAI,CAAC,SAAS,EAAE;UAClB,GAAG,CAAC,YAAY,CAAC,cAAc,EAAE,EAAE,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;SACnF;OACF;KACF;IAED,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;IAC/D,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,eAAe,EAAE,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;IACxE,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;KAC7D;IAED,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,gBAAgB;MACtC,gBAAgB,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;MAC3D,IAAI,IAAI,CAAC,IAAI,EAAE;QACb,gBAAgB,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;OACzD;KACF,CAAC,CAAC;GACJ;EAED,oBAAoB;;IAClB,MAAA,IAAI,CAAC,MAAM,0CAAE,OAAO,EAAE,CAAC;GACxB;EAwCO,gBAAgB,CAAC,OAA8B,QAAQ;IAC7D,MAAM,QAAQ,GAAG,IAAI,CAAC,aAAa,CAAC;IAEpC,IAAI,CAAC,QAAQ,EAAE;MACb,OAAO,IAAI,CAAC;KACb;IAED,IAAI,QAAQ,CAAC,UAAU,EAAE;MACvB,OAAO,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;KACnD;IAED,OAAO,QAAQ,CAAC;GACjB;EAEO,UAAU,CAAC,SAAiB;;IAClC,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC;IAC5B,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC;IAE1E,IAAI,SAAS,GAAG,YAAY,GAAG,SAAS,CAAC;IACzC,IAAI,SAAS,IAAI,IAAI,CAAC,MAAM,EAAE;MAC5B,SAAS,GAAG,CAAC,CAAC;KACf;SAAM,IAAI,SAAS,GAAG,CAAC,EAAE;MACxB,SAAS,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;KAC7B;IAED,MAAA,IAAI,CAAC,SAAS,CAAC,0CAAE,KAAK,EAAE,CAAC;GAC1B;EAOD,MAAM;IACJ,QACE,EAAC,IAAI,IAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,SAAS,IAC7E,YAAM,IAAI,EAAC,QAAQ,GAAG,EACtB,WAAK,MAAM,EAAE,CAAC,IAAI,CAAC,IAAI,IACrB,eAAQ,CACJ,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["uuidv4"],"sources":["src/components/dropdown-menu/dropdown-menu.scss?tag=dso-dropdown-menu&encapsulation=shadow","src/components/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/components/dropdown-menu\";\r\n\r\n:host(:focus) {\r\n outline: none;\r\n}\r\n\r\n:host {\r\n @include dropdown-menu.root();\r\n}\r\n","import { createPopper, Instance as PopperInstance } from \"@popperjs/core\";\r\nimport { h, Component, Element, Host, Prop, Watch } from \"@stencil/core\";\r\nimport { FocusableElement, tabbable } from \"tabbable\";\r\nimport { v4 as uuidv4 } from \"uuid\";\r\n\r\nimport { hasOverflow } from \"../../utils/has-overflow\";\r\n\r\n@Component({\r\n tag: \"dso-dropdown-menu\",\r\n styleUrl: \"dropdown-menu.scss\",\r\n shadow: true,\r\n})\r\nexport class DropdownMenu {\r\n /*\r\n Whether the menu is open or closed.\r\n * This attribute is reflected and mutable.\r\n /\r\n @Prop({ reflect: true, mutable: true })\r\n open = false;\r\n\r\n /\r\n Alignment of the dropdown\r\n /\r\n @Prop()\r\n dropdownAlign: \"left\" \| \"right\" = \"left\";\r\n\r\n /\r\n Space between button and dropdown options\r\n /\r\n @Prop()\r\n dropdownOptionsOffset = 2;\r\n\r\n /\r\n Whether the menu is checkable.\r\n /\r\n @Prop()\r\n checkable = false;\r\n\r\n /\r\n Selector for the element the dropdown options should not be overflowing.\r\n /\r\n @Prop()\r\n boundary?: string;\r\n\r\n /\r\n Set position strategy of dropdown options\r\n */\r\n @Prop()\r\n strategy: \"auto\" \| \"absolute\" \| \"fixed\" = \"auto\";\r\n\r\n @Watch(\"dropdownAlign\")\r\n watchPosition() {\r\n if (!this.popper) {\r\n return;\r\n }\r\n\r\n this.popper.setOptions({\r\n placement: this.dropdownAlign === \"right\" ? \"bottom-end\" : \"bottom-start\",\r\n });\r\n }\r\n\r\n @Watch(\"dropdownOptionsOffset\")\r\n watchOptionsOffset() {\r\n this.popper?.setOptions({\r\n modifiers: [\r\n {\r\n name: \"offset\",\r\n options: {\r\n offset: [0, this.dropdownOptionsOffset],\r\n },\r\n },\r\n ],\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.host;\r\n\r\n const boundary = this.boundary \|\| document;\r\n\r\n while (element && element.parentNode !== boundary) {\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 @Element()\r\n host!: HTMLDsoDropdownMenuElement;\r\n\r\n private popper: PopperInstance \| undefined;\r\n\r\n get button(): HTMLButtonElement {\r\n const button = this.host.querySelector('button[slot=\"toggle\"]');\r\n\r\n if (!(button instanceof HTMLButtonElement)) {\r\n throw new ReferenceError(\"Mandatory toggle button not found\");\r\n }\r\n\r\n return button;\r\n }\r\n\r\n get tabbables(): FocusableElement[] {\r\n return tabbable(this.host).filter((e) => e !== this.button);\r\n }\r\n\r\n componentDidLoad() {\r\n this.button.setAttribute(\"aria-haspopup\", \"menu\");\r\n this.button.setAttribute(\"aria-expanded\", \"false\");\r\n if (!this.button.id) {\r\n this.button.id = uuidv4();\r\n }\r\n\r\n this.button.addEventListener(\"click\", () => {\r\n this.open = !this.open;\r\n });\r\n\r\n const options = this.host.querySelector(\".dso-dropdown-options\");\r\n if (!options) {\r\n throw new ReferenceError(\"Dropdown options not found\");\r\n }\r\n\r\n options.setAttribute(\"role\", \"menu\");\r\n options.setAttribute(\"aria-labelledby\", this.button.id);\r\n\r\n for (const ul of Array.from(this.host.getElementsByTagName(\"ul\"))) {\r\n ul.setAttribute(\"role\", \"group\");\r\n for (const li of Array.from(ul.getElementsByTagName(\"li\"))) {\r\n li.setAttribute(\"role\", \"none\");\r\n }\r\n }\r\n\r\n if (this.popper) {\r\n return;\r\n }\r\n\r\n const dropdownOptionsElement = this.host.querySelector(\".dso-dropdown-options\");\r\n\r\n if (!(dropdownOptionsElement instanceof HTMLElement)) {\r\n throw new Error(\"dropdown options element is not instanceof HTMLElement\");\r\n }\r\n\r\n this.popper = createPopper(this.button, dropdownOptionsElement, {\r\n placement: this.dropdownAlign === \"right\" ? \"bottom-end\" : \"bottom-start\",\r\n modifiers: [\r\n {\r\n name: \"offset\",\r\n options: {\r\n offset: [0, this.dropdownOptionsOffset],\r\n },\r\n },\r\n {\r\n name: \"preventOverflow\",\r\n options: {\r\n boundary: this.boundary ? document.querySelector(this.boundary) : null,\r\n },\r\n enabled: this.boundary !== undefined,\r\n },\r\n ],\r\n });\r\n }\r\n\r\n componentDidRender() {\r\n this.setStrategy();\r\n if (this.open) {\r\n this.popper?.update();\r\n }\r\n\r\n for (const li of Array.from(this.host.getElementsByTagName(\"li\"))) {\r\n for (const tab of tabbable(li)) {\r\n tab.setAttribute(\"role\", this.checkable ? \"menuitemradio\" : \"menuitem\");\r\n\r\n if (this.checkable) {\r\n tab.setAttribute(\"aria-checked\", li.classList.contains(\"dso-checked\").toString());\r\n }\r\n }\r\n }\r\n\r\n this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n this.button.setAttribute(\"aria-expanded\", this.open ? \"true\" : \"false\");\r\n if (this.open) {\r\n this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n }\r\n\r\n this.tabbables.forEach((focusableElement) => {\r\n focusableElement.removeEventListener(\"click\", this.escape);\r\n if (this.open) {\r\n focusableElement.addEventListener(\"click\", this.escape);\r\n }\r\n });\r\n }\r\n\r\n disconnectedCallback() {\r\n this.popper?.destroy();\r\n }\r\n\r\n private focusOutListener = (event: FocusEvent) => {\r\n if (!this.tabbables.includes(event.relatedTarget as FocusableElement)) {\r\n this.open = false;\r\n }\r\n };\r\n\r\n private keyDownListener = (event: KeyboardEvent) => {\r\n if (event.defaultPrevented) {\r\n return;\r\n }\r\n\r\n switch (event.key) {\r\n case \"ArrowDown\":\r\n this.tabInPopup(1);\r\n break;\r\n\r\n case \"ArrowUp\":\r\n this.tabInPopup(-1);\r\n break;\r\n\r\n case \"Escape\":\r\n this.escape();\r\n break;\r\n\r\n case \" \":\r\n if (event.target instanceof HTMLElement) {\r\n event.target.click();\r\n }\r\n\r\n break;\r\n\r\n default:\r\n return;\r\n }\r\n\r\n event.preventDefault();\r\n };\r\n\r\n private getActiveElement(root: Document \| ShadowRoot = document): Element \| null {\r\n const activeEl = root.activeElement;\r\n\r\n if (!activeEl) {\r\n return null;\r\n }\r\n\r\n if (activeEl.shadowRoot) {\r\n return this.getActiveElement(activeEl.shadowRoot);\r\n }\r\n\r\n return activeEl;\r\n }\r\n\r\n private tabInPopup(direction: number) {\r\n const tabs = this.tabbables;\r\n const currentIndex = tabs.findIndex((e) => e === this.getActiveElement());\r\n\r\n let nextIndex = currentIndex + direction;\r\n if (nextIndex >= tabs.length) {\r\n nextIndex = 0;\r\n } else if (nextIndex < 0) {\r\n nextIndex = tabs.length - 1;\r\n }\r\n\r\n tabs[nextIndex]?.focus();\r\n }\r\n\r\n private escape = () => {\r\n this.button.focus();\r\n this.open = false;\r\n };\r\n\r\n render() {\r\n return (\r\n <Host onFocusout={this.focusOutListener} tabindex={this.open ? \"-1\" : undefined}>\r\n <slot name=\"toggle\" />\r\n <div hidden={!this.open}>\r\n <slot />\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/dso-accordion-section.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dso-accordion-section.js","mappings":"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","names":[],"sources":["./src/components/accordion/components/accordion-section.interfaces.ts","./src/components/accordion/components/handles/element.handle.tsx","./src/components/accordion/components/handles/heading.handle.tsx","./src/components/accordion/components/handles/state-icon.handle.tsx","./src/components/accordion/components/handles/icon.handle.tsx","./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 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 AccordionSectionAnimationEndEvent {\r\n /\r\n Helper function to scroll the Accordion Section into view.\r\n /\r\n scrollIntoView(): 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","import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nexport const HandleElement: FunctionalComponent<{\r\n handleUrl: string \| undefined;\r\n open: boolean;\r\n onClick: (e: MouseEvent) => void;\r\n}> = ({ handleUrl, onClick, open }, children) => {\r\n if (handleUrl) {\r\n return (\r\n <a href={handleUrl} onClick={onClick} aria-expanded={open ? \"true\" : \"false\"}>\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\"}>\r\n {children}\r\n </button>\r\n );\r\n};\r\n","import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { AccordionHeading } from \"../accordion-section.interfaces\";\r\n\r\nexport const 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","import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { AccordionSectionState } from \"../accordion-section.interfaces\";\r\n\r\nexport const 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","import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { AccordionSectionState } from \"../accordion-section.interfaces\";\r\nimport { HandleStateIcon } from \"./state-icon.handle\";\r\n\r\nexport const 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","@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: center;\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: accordion.$vertical-padding accordion.$horizontal-padding accordion.$vertical-padding;\r\n text-align: start;\r\n width: 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-right: units.$u1;\r\n }\r\n\r\n > dso-icon:last-child {\r\n margin-left: auto;\r\n }\r\n\r\n > .dso-section-handle-addons:last-child {\r\n margin-left: auto;\r\n\r\n dso-attachments-counter,\r\n dso-icon {\r\n margin-left: 16px;\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-top: 0;\r\n margin-top: accordion.$border-radius -1;\r\n\r\n .dso-section-body-content {\r\n padding: units.$u2 + accordion.$border-radius units.$u2 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-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 h,\r\n Component,\r\n ComponentInterface,\r\n Element,\r\n Event,\r\n forceUpdate,\r\n Fragment,\r\n Host,\r\n Prop,\r\n State,\r\n EventEmitter,\r\n} from \"@stencil/core\";\r\n\r\nimport { AccordionInternalState } from \"../accordion.interfaces\";\r\nimport {\r\n AccordionHeading,\r\n AccordionSectionAnimationEndEvent,\r\n AccordionSectionState,\r\n AccordionSectionToggleClickEvent,\r\n stateMap,\r\n} from \"./accordion-section.interfaces\";\r\nimport { Handle, HandleElement, HandleIcon } from \"./handles\";\r\nimport { ExpandableAnimationEndEvent } from \"../../expandable/expandable\";\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?: string;\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 @State()\r\n hasNestedAccordion = false;\r\n\r\n @State()\r\n hover = false;\r\n\r\n componentWillLoad() {\r\n this.hasNestedAccordion = this.host.querySelector(\"dso-accordion\") !== null;\r\n\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): Promise<void> {\r\n const bodyClientRect = this.sectionBody?.getBoundingClientRect();\r\n const headingClientRect = this.sectionHeading?.getBoundingClientRect();\r\n\r\n if (!bodyClientRect \|\| !headingClientRect \|\| !this.accordionState) {\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 if (sectionBottomY > window.innerHeight) {\r\n const expandedAccordionHeight = sectionBottomY - headingClientRect.top;\r\n const shouldScrollToTopOfSection = expandedAccordionHeight > window.innerHeight;\r\n\r\n window.scrollTo({\r\n top: shouldScrollToTopOfSection\r\n ? this.host.offsetTop\r\n : this.host.offsetTop - (window.innerHeight - expandedAccordionHeight),\r\n behavior: \"smooth\",\r\n });\r\n } else if (headingClientRect.top < 0) {\r\n window.scrollTo({\r\n top: this.host.offsetTop,\r\n behavior: \"smooth\",\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 handleExpandableAnimationEnd = (e: CustomEvent<ExpandableAnimationEndEvent>) => {\r\n this.dsoAnimationEnd.emit({\r\n open: this.open,\r\n scrollIntoView: () => this.scrollIntoView(e.detail.bodyHeight),\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 completes its toggle animation.\r\n */\r\n @Event({ bubbles: false })\r\n dsoAnimationEnd!: EventEmitter<AccordionSectionAnimationEndEvent>;\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,\r\n \"dso-accordion-reverse-align\": reverseAlign ?? false,\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 handleUrl={this.handleUrl} onClick={this.handleClick} open={this.open}>\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\r\n <span>{this.handleTitle}</span>\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 {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 {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 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"],"version":3}
1	+ {"file":"dso-accordion-section.js","mappings":"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","names":[],"sources":["src/components/accordion/components/accordion-section.interfaces.ts","src/components/accordion/components/handles/element.handle.tsx","src/components/accordion/components/handles/heading.handle.tsx","src/components/accordion/components/handles/state-icon.handle.tsx","src/components/accordion/components/handles/icon.handle.tsx","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 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 AccordionSectionAnimationEndEvent {\r\n /\r\n Helper function to scroll the Accordion Section into view.\r\n /\r\n scrollIntoView(): 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","import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nexport const HandleElement: FunctionalComponent<{\r\n handleUrl: string \| undefined;\r\n open: boolean;\r\n onClick: (e: MouseEvent) => void;\r\n}> = ({ handleUrl, onClick, open }, children) => {\r\n if (handleUrl) {\r\n return (\r\n <a href={handleUrl} onClick={onClick} aria-expanded={open ? \"true\" : \"false\"}>\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\"}>\r\n {children}\r\n </button>\r\n );\r\n};\r\n","import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { AccordionHeading } from \"../accordion-section.interfaces\";\r\n\r\nexport const 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","import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { AccordionSectionState } from \"../accordion-section.interfaces\";\r\n\r\nexport const 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","import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { AccordionSectionState } from \"../accordion-section.interfaces\";\r\nimport { HandleStateIcon } from \"./state-icon.handle\";\r\n\r\nexport const 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","@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: center;\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: accordion.$vertical-padding accordion.$horizontal-padding accordion.$vertical-padding;\r\n text-align: start;\r\n width: 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-right: units.$u1;\r\n }\r\n\r\n > dso-icon:last-child {\r\n margin-left: auto;\r\n }\r\n\r\n > .dso-section-handle-addons:last-child {\r\n margin-left: auto;\r\n\r\n dso-attachments-counter,\r\n dso-icon {\r\n margin-left: 16px;\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-top: 0;\r\n margin-top: accordion.$border-radius -1;\r\n\r\n .dso-section-body-content {\r\n padding: units.$u2 + accordion.$border-radius units.$u2 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-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 h,\r\n Component,\r\n ComponentInterface,\r\n Element,\r\n Event,\r\n forceUpdate,\r\n Fragment,\r\n Host,\r\n Prop,\r\n State,\r\n EventEmitter,\r\n} from \"@stencil/core\";\r\n\r\nimport { AccordionInternalState } from \"../accordion.interfaces\";\r\nimport {\r\n AccordionHeading,\r\n AccordionSectionAnimationEndEvent,\r\n AccordionSectionState,\r\n AccordionSectionToggleClickEvent,\r\n stateMap,\r\n} from \"./accordion-section.interfaces\";\r\nimport { Handle, HandleElement, HandleIcon } from \"./handles\";\r\nimport { ExpandableAnimationEndEvent } from \"../../expandable/expandable\";\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?: string;\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 @State()\r\n hasNestedAccordion = false;\r\n\r\n @State()\r\n hover = false;\r\n\r\n componentWillLoad() {\r\n this.hasNestedAccordion = this.host.querySelector(\"dso-accordion\") !== null;\r\n\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): Promise<void> {\r\n const bodyClientRect = this.sectionBody?.getBoundingClientRect();\r\n const headingClientRect = this.sectionHeading?.getBoundingClientRect();\r\n\r\n if (!bodyClientRect \|\| !headingClientRect \|\| !this.accordionState) {\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 if (sectionBottomY > window.innerHeight) {\r\n const expandedAccordionHeight = sectionBottomY - headingClientRect.top;\r\n const shouldScrollToTopOfSection = expandedAccordionHeight > window.innerHeight;\r\n\r\n window.scrollTo({\r\n top: shouldScrollToTopOfSection\r\n ? this.host.offsetTop\r\n : this.host.offsetTop - (window.innerHeight - expandedAccordionHeight),\r\n behavior: \"smooth\",\r\n });\r\n } else if (headingClientRect.top < 0) {\r\n window.scrollTo({\r\n top: this.host.offsetTop,\r\n behavior: \"smooth\",\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 handleExpandableAnimationEnd = (e: CustomEvent<ExpandableAnimationEndEvent>) => {\r\n this.dsoAnimationEnd.emit({\r\n open: this.open,\r\n scrollIntoView: () => this.scrollIntoView(e.detail.bodyHeight),\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 completes its toggle animation.\r\n */\r\n @Event({ bubbles: false })\r\n dsoAnimationEnd!: EventEmitter<AccordionSectionAnimationEndEvent>;\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,\r\n \"dso-accordion-reverse-align\": reverseAlign ?? false,\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 handleUrl={this.handleUrl} onClick={this.handleClick} open={this.open}>\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\r\n <span>{this.handleTitle}</span>\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 {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 {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 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"],"version":3}

package/dist/components/dso-accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dso-accordion.js","mappings":";;AAEA,MAAM,WAAW,GAAG,CAAC,GAAG,EAAE,QAAQ,EAAE,KAAK,KAAK;AAC9C,IAAI,MAAM,KAAK,GAAG,GAAG,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;AACpC,IAAI,IAAI,CAAC,KAAK,EAAE;AAChB,QAAQ,GAAG,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;AACnC,KAAK;AACL,SAAS,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;AACrC,QAAQ,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;AAC1B,KAAK;AACL,CAAC,CAAC;AACF,MAAM,QAAQ,GAAG,CAAC,EAAE,EAAE,EAAE,KAAK;AAC7B,IAAI,IAAI,SAAS,CAAC;AAClB,IAAI,OAAO,CAAC,GAAG,IAAI,KAAK;AACxB,QAAQ,IAAI,SAAS,EAAE;AACvB,YAAY,YAAY,CAAC,SAAS,CAAC,CAAC;AACpC,SAAS;AACT,QAAQ,SAAS,GAAG,UAAU,CAAC,MAAM;AACrC,YAAY,SAAS,GAAG,CAAC,CAAC;AAC1B,YAAY,EAAE,CAAC,GAAG,IAAI,CAAC,CAAC;AACxB,SAAS,EAAE,EAAE,CAAC,CAAC;AACf,KAAK,CAAC;AACN,CAAC,CAAC;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,WAAW,GAAG,CAAC,YAAY,KAAK,EAAE,aAAa,IAAI,YAAY,CAAC,IAAI,YAAY,CAAC,WAAW,CAAC;AACnG,MAAM,eAAe,GAAG,QAAQ,CAAC,CAAC,GAAG,KAAK;AAC1C,IAAI,KAAK,IAAI,GAAG,IAAI,GAAG,CAAC,IAAI,EAAE,EAAE;AAChC,QAAQ,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC;AACvD,KAAK;AACL,CAAC,EAAE,IAAI,CAAC,CAAC;AACT,MAAM,mBAAmB,GAAG,MAAM;AAClC,IAAI,IAAI,OAAO,eAAe,KAAK,UAAU,EAAE;AAC/C;AACA;AACA,QAAQ,OAAO,EAAE,CAAC;AAClB,KAAK;AACL,IAAI,MAAM,YAAY,GAAG,IAAI,GAAG,EAAE,CAAC;AACnC,IAAI,OAAO;AACX,QAAQ,OAAO,EAAE,MAAM,YAAY,CAAC,KAAK,EAAE;AAC3C,QAAQ,GAAG,EAAE,CAAC,QAAQ,KAAK;AAC3B,YAAY,MAAM,GAAG,GAAG,eAAe,EAAE,CAAC;AAC1C,YAAY,IAAI,GAAG,EAAE;AACrB,gBAAgB,WAAW,CAAC,YAAY,EAAE,QAAQ,EAAE,GAAG,CAAC,CAAC;AACzD,aAAa;AACb,SAAS;AACT,QAAQ,GAAG,EAAE,CAAC,QAAQ,KAAK;AAC3B,YAAY,MAAM,QAAQ,GAAG,YAAY,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;AACxD,YAAY,IAAI,QAAQ,EAAE;AAC1B,gBAAgB,YAAY,CAAC,GAAG,CAAC,QAAQ,EAAE,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC;AACzE,aAAa;AACb,YAAY,eAAe,CAAC,YAAY,CAAC,CAAC;AAC1C,SAAS;AACT,QAAQ,KAAK,EAAE,MAAM;AACrB,YAAY,YAAY,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;AACtE,YAAY,eAAe,CAAC,YAAY,CAAC,CAAC;AAC1C,SAAS;AACT,KAAK,CAAC;AACN,CAAC,CAAC;AACF;AACA,MAAM,MAAM,GAAG,CAAC,GAAG,MAAM,OAAO,GAAG,KAAK,UAAU,GAAG,GAAG,EAAE,GAAG,GAAG,CAAC,CAAC;AAClE,MAAM,mBAAmB,GAAG,CAAC,YAAY,EAAE,YAAY,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK;AAChF,IAAI,MAAM,cAAc,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC;AAChD,IAAI,IAAI,MAAM,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,cAAc,KAAK,IAAI,IAAI,cAAc,KAAK,KAAK,CAAC,GAAG,cAAc,GAAG,EAAE,CAAC,CAAC,CAAC;AACrH,IAAI,MAAM,QAAQ,GAAG;AACrB,QAAQ,OAAO,EAAE,EAAE;AACnB,QAAQ,GAAG,EAAE,EAAE;AACf,QAAQ,GAAG,EAAE,EAAE;AACf,QAAQ,KAAK,EAAE,EAAE;AACjB,KAAK,CAAC;AACN,IAAI,MAAM,KAAK,GAAG,MAAM;AACxB,QAAQ,IAAI,EAAE,CAAC;AACf;AACA;AACA,QAAQ,MAAM,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,EAAE,GAAG,MAAM,CAAC,YAAY,CAAC,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;AAC1G,QAAQ,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;AAC7C,KAAK,CAAC;AACN,IAAI,MAAM,OAAO,GAAG,MAAM;AAC1B;AACA;AACA,QAAQ,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;AAC/C,QAAQ,KAAK,EAAE,CAAC;AAChB,KAAK,CAAC;AACN,IAAI,MAAM,GAAG,GAAG,CAAC,QAAQ,KAAK;AAC9B,QAAQ,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;AACnD,QAAQ,OAAO,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;AACpC,KAAK,CAAC;AACN,IAAI,MAAM,GAAG,GAAG,CAAC,QAAQ,EAAE,KAAK,KAAK;AACrC,QAAQ,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;AAC9C,QAAQ,IAAI,YAAY,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE;AACrD,YAAY,MAAM,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;AACxC,YAAY,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,QAAQ,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC;AACxE,SAAS;AACT,KAAK,CAAC;AACN,IAAI,MAAM,KAAK,IAAI,OAAO,KAAK,KAAK,WAAW;AAC/C,UAAU,EAAE;AACZ,UAAU,IAAI,KAAK,CAAC,cAAc,EAAE;AACpC,YAAY,GAAG,CAAC,CAAC,EAAE,QAAQ,EAAE;AAC7B,gBAAgB,OAAO,GAAG,CAAC,QAAQ,CAAC,CAAC;AACrC,aAAa;AACb,YAAY,OAAO,CAAC,CAAC,EAAE;AACvB,gBAAgB,OAAO,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC;AACjD,aAAa;AACb,YAAY,wBAAwB,GAAG;AACvC,gBAAgB,OAAO;AACvB,oBAAoB,UAAU,EAAE,IAAI;AACpC,oBAAoB,YAAY,EAAE,IAAI;AACtC,iBAAiB,CAAC;AAClB,aAAa;AACb,YAAY,GAAG,CAAC,CAAC,EAAE,QAAQ,EAAE;AAC7B,gBAAgB,OAAO,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;AAC5C,aAAa;AACb,YAAY,GAAG,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE;AACpC,gBAAgB,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;AACrC,gBAAgB,OAAO,IAAI,CAAC;AAC5B,aAAa;AACb,SAAS,CAAC,CAAC,CAAC;AACZ,IAAI,MAAM,EAAE,GAAG,CAAC,SAAS,EAAE,QAAQ,KAAK;AACxC,QAAQ,QAAQ,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AAC3C,QAAQ,OAAO,MAAM;AACrB,YAAY,eAAe,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,QAAQ,CAAC,CAAC;AAC3D,SAAS,CAAC;AACV,KAAK,CAAC;AACN,IAAI,MAAM,QAAQ,GAAG,CAAC,QAAQ,EAAE,EAAE,KAAK;AACvC,QAAQ,MAAM,KAAK,GAAG,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,EAAE,QAAQ,KAAK;AACnD,YAAY,IAAI,GAAG,KAAK,QAAQ,EAAE;AAClC,gBAAgB,EAAE,CAAC,QAAQ,CAAC,CAAC;AAC7B,aAAa;AACb,SAAS,CAAC,CAAC;AACX;AACA;AACA,QAAQ,MAAM,OAAO,GAAG,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;AAC9E,QAAQ,OAAO,MAAM;AACrB,YAAY,KAAK,EAAE,CAAC;AACpB,YAAY,OAAO,EAAE,CAAC;AACtB,SAAS,CAAC;AACV,KAAK,CAAC;AACN,IAAI,MAAM,GAAG,GAAG,CAAC,GAAG,aAAa,KAAK;AACtC,QAAQ,MAAM,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,YAAY,KAAK;AACtE,YAAY,IAAI,YAAY,CAAC,GAAG,EAAE;AAClC,gBAAgB,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC;AACzD,aAAa;AACb,YAAY,IAAI,YAAY,CAAC,GAAG,EAAE;AAClC,gBAAgB,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC;AACzD,aAAa;AACb,YAAY,IAAI,YAAY,CAAC,KAAK,EAAE;AACpC,gBAAgB,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC;AAC7D,aAAa;AACb,YAAY,IAAI,YAAY,CAAC,OAAO,EAAE;AACtC,gBAAgB,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,SAAS,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;AACjE,aAAa;AACb,YAAY,OAAO,MAAM,CAAC;AAC1B,SAAS,EAAE,EAAE,CAAC,CAAC;AACf,QAAQ,OAAO,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC,CAAC;AACxD,KAAK,CAAC;AACN,IAAI,MAAM,WAAW,GAAG,CAAC,GAAG,KAAK;AACjC,QAAQ,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AACzC,QAAQ,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;AAClE,KAAK,CAAC;AACN,IAAI,OAAO;AACX,QAAQ,KAAK;AACb,QAAQ,GAAG;AACX,QAAQ,GAAG;AACX,QAAQ,EAAE;AACV,QAAQ,QAAQ;AAChB,QAAQ,GAAG;AACX,QAAQ,OAAO;AACf,QAAQ,KAAK;AACb,QAAQ,WAAW;AACnB,KAAK,CAAC;AACN,CAAC,CAAC;AACF,MAAM,eAAe,GAAG,CAAC,KAAK,EAAE,IAAI,KAAK;AACzC,IAAI,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;AACtC,IAAI,IAAI,KAAK,IAAI,CAAC,EAAE;AACpB,QAAQ,KAAK,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;AAC/C,QAAQ,KAAK,CAAC,MAAM,EAAE,CAAC;AACvB,KAAK;AACL,CAAC,CAAC;AACF;AACA,MAAM,WAAW,GAAG,CAAC,YAAY,EAAE,YAAY,KAAK;AACpD,IAAI,MAAM,GAAG,GAAG,mBAAmB,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;AAChE,IAAI,GAAG,CAAC,GAAG,CAAC,mBAAmB,EAAE,CAAC,CAAC;AACnC,IAAI,OAAO,GAAG,CAAC;AACf,CAAC;;AC/LD,MAAM,YAAY,GAAG,iEAAiE;;MCWzE,SAAS;EAqBpB,aAAa,CAAC,UAA4B,SAAS;IACjD,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,OAAO,CAAC;GACvC;EAGD,kBAAkB,CAAC,YAAqB;IACtC,IAAI,CAAC,cAAc,CAAC,YAAY,GAAG,YAAY,CAAC;GACjD;;;;EAMD,MAAM,SAAS;IACb,OAAO,IAAI,CAAC,cAAc,CAAC;GAC5B;EAED,iBAAiB;IACf,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;IAC3C,IAAI,CAAC,cAAc,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC;GACtD;EAED;;;;mBAjC4B,SAAS;wBAQtB,KAAK;IA0BlB,MAAM,EAAE,KAAK,EAAE,GAAG,WAAW,CAAyB,EAAE,CAAC,CAAC;IAE1D,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;GAC7B;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IAAC,KAAK,EAAC,eAAe,IACzB,eAAa,CACR,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["../../node_modules/@stencil/store/dist/index.mjs","./src/components/accordion/accordion.scss?tag=dso-accordion&encapsulation=shadow","./src/components/accordion/accordion.tsx"],"sourcesContent":["import { getRenderingRef, forceUpdate } from '@stencil/core';\n\nconst appendToMap = (map, propName, value) => {\n const items = map.get(propName);\n if (!items) {\n map.set(propName, [value]);\n }\n else if (!items.includes(value)) {\n items.push(value);\n }\n};\nconst debounce = (fn, ms) => {\n let timeoutId;\n return (...args) => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n timeoutId = setTimeout(() => {\n timeoutId = 0;\n fn(...args);\n }, ms);\n };\n};\n\n/*\n Check if a possible element isConnected.\n * The property might not be there, so we check for it.\n \n We want it to return true if isConnected is not a property,\n * otherwise we would remove these elements and would not update.\n \n Better leak in Edge than to be useless.\n /\nconst isConnected = (maybeElement) => !('isConnected' in maybeElement) \|\| maybeElement.isConnected;\nconst cleanupElements = debounce((map) => {\n for (let key of map.keys()) {\n map.set(key, map.get(key).filter(isConnected));\n }\n}, 2000);\nconst stencilSubscription = () => {\n if (typeof getRenderingRef !== 'function') {\n // If we are not in a stencil project, we do nothing.\n // This function is not really exported by @stencil/core.\n return {};\n }\n const elmsToUpdate = new Map();\n return {\n dispose: () => elmsToUpdate.clear(),\n get: (propName) => {\n const elm = getRenderingRef();\n if (elm) {\n appendToMap(elmsToUpdate, propName, elm);\n }\n },\n set: (propName) => {\n const elements = elmsToUpdate.get(propName);\n if (elements) {\n elmsToUpdate.set(propName, elements.filter(forceUpdate));\n }\n cleanupElements(elmsToUpdate);\n },\n reset: () => {\n elmsToUpdate.forEach((elms) => elms.forEach(forceUpdate));\n cleanupElements(elmsToUpdate);\n },\n };\n};\n\nconst unwrap = (val) => (typeof val === 'function' ? val() : val);\nconst createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {\n const unwrappedState = unwrap(defaultState);\n let states = new Map(Object.entries(unwrappedState !== null && unwrappedState !== void 0 ? unwrappedState : {}));\n const handlers = {\n dispose: [],\n get: [],\n set: [],\n reset: [],\n };\n const reset = () => {\n var _a;\n // When resetting the state, the default state may be a function - unwrap it to invoke it.\n // otherwise, the state won't be properly reset\n states = new Map(Object.entries((_a = unwrap(defaultState)) !== null && _a !== void 0 ? _a : {}));\n handlers.reset.forEach((cb) => cb());\n };\n const dispose = () => {\n // Call first dispose as resetting the state would\n // cause less updates ;)\n handlers.dispose.forEach((cb) => cb());\n reset();\n };\n const get = (propName) => {\n handlers.get.forEach((cb) => cb(propName));\n return states.get(propName);\n };\n const set = (propName, value) => {\n const oldValue = states.get(propName);\n if (shouldUpdate(value, oldValue, propName)) {\n states.set(propName, value);\n handlers.set.forEach((cb) => cb(propName, value, oldValue));\n }\n };\n const state = (typeof Proxy === 'undefined'\n ? {}\n : new Proxy(unwrappedState, {\n get(_, propName) {\n return get(propName);\n },\n ownKeys(_) {\n return Array.from(states.keys());\n },\n getOwnPropertyDescriptor() {\n return {\n enumerable: true,\n configurable: true,\n };\n },\n has(_, propName) {\n return states.has(propName);\n },\n set(_, propName, value) {\n set(propName, value);\n return true;\n },\n }));\n const on = (eventName, callback) => {\n handlers[eventName].push(callback);\n return () => {\n removeFromArray(handlers[eventName], callback);\n };\n };\n const onChange = (propName, cb) => {\n const unSet = on('set', (key, newValue) => {\n if (key === propName) {\n cb(newValue);\n }\n });\n // We need to unwrap the defaultState because it might be a function.\n // Otherwise we might not be sending the right reset value.\n const unReset = on('reset', () => cb(unwrap(defaultState)[propName]));\n return () => {\n unSet();\n unReset();\n };\n };\n const use = (...subscriptions) => {\n const unsubs = subscriptions.reduce((unsubs, subscription) => {\n if (subscription.set) {\n unsubs.push(on('set', subscription.set));\n }\n if (subscription.get) {\n unsubs.push(on('get', subscription.get));\n }\n if (subscription.reset) {\n unsubs.push(on('reset', subscription.reset));\n }\n if (subscription.dispose) {\n unsubs.push(on('dispose', subscription.dispose));\n }\n return unsubs;\n }, []);\n return () => unsubs.forEach((unsub) => unsub());\n };\n const forceUpdate = (key) => {\n const oldValue = states.get(key);\n handlers.set.forEach((cb) => cb(key, oldValue, oldValue));\n };\n return {\n state,\n get,\n set,\n on,\n onChange,\n use,\n dispose,\n reset,\n forceUpdate,\n };\n};\nconst removeFromArray = (array, item) => {\n const index = array.indexOf(item);\n if (index >= 0) {\n array[index] = array[array.length - 1];\n array.length--;\n }\n};\n\nconst createStore = (defaultState, shouldUpdate) => {\n const map = createObservableMap(defaultState, shouldUpdate);\n map.use(stencilSubscription());\n return map;\n};\n\nexport { createObservableMap, createStore };\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n","import { h, Component, ComponentInterface, Prop, Host, Method, Watch, Element } from \"@stencil/core\";\r\n\r\nimport { AccordionInternalState, AccordionVariant } from \"./accordion.interfaces\";\r\n\r\nimport { createStore } from \"@stencil/store\";\r\n\r\n@Component({\r\n tag: \"dso-accordion\",\r\n styleUrl: \"accordion.scss\",\r\n shadow: true,\r\n})\r\nexport class Accordion implements ComponentInterface {\r\n private accordionState: AccordionInternalState;\r\n\r\n @Element()\r\n host!: HTMLDsoAccordionElement;\r\n\r\n /\r\n The variant of the Accordion.\r\n /\r\n @Prop({ reflect: true })\r\n variant: AccordionVariant = \"default\";\r\n\r\n /\r\n Places the chevron at the opposite side.\r\n \r\n Note: this mode does not display `state`, `attachmentCount` or `status` props on Accordion Sections\r\n /\r\n @Prop({ reflect: true })\r\n reverseAlign = false;\r\n\r\n @Watch(\"variant\")\r\n updateVariant(variant: AccordionVariant = \"default\") {\r\n this.accordionState.variant = variant;\r\n }\r\n\r\n @Watch(\"reverseAlign\")\r\n updateReverseAlign(reverseAlign: boolean) {\r\n this.accordionState.reverseAlign = reverseAlign;\r\n }\r\n\r\n /\r\n @internal\r\n */\r\n @Method()\r\n async _getState(): Promise<AccordionInternalState> {\r\n return this.accordionState;\r\n }\r\n\r\n componentWillLoad() {\r\n this.accordionState.variant = this.variant;\r\n this.accordionState.reverseAlign = this.reverseAlign;\r\n }\r\n\r\n constructor() {\r\n const { state } = createStore<AccordionInternalState>({});\r\n\r\n this.accordionState = state;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host class=\"dso-accordion\">\r\n <slot></slot>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"dso-accordion.js","mappings":"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","names":[],"sources":["../../node_modules/@stencil/store/dist/index.mjs","src/components/accordion/accordion.scss?tag=dso-accordion&encapsulation=shadow","src/components/accordion/accordion.tsx"],"sourcesContent":["import { getRenderingRef, forceUpdate } from '@stencil/core';\n\nconst appendToMap = (map, propName, value) => {\n const items = map.get(propName);\n if (!items) {\n map.set(propName, [value]);\n }\n else if (!items.includes(value)) {\n items.push(value);\n }\n};\nconst debounce = (fn, ms) => {\n let timeoutId;\n return (...args) => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n timeoutId = setTimeout(() => {\n timeoutId = 0;\n fn(...args);\n }, ms);\n };\n};\n\n/*\n Check if a possible element isConnected.\n * The property might not be there, so we check for it.\n \n We want it to return true if isConnected is not a property,\n * otherwise we would remove these elements and would not update.\n \n Better leak in Edge than to be useless.\n /\nconst isConnected = (maybeElement) => !('isConnected' in maybeElement) \|\| maybeElement.isConnected;\nconst cleanupElements = debounce((map) => {\n for (let key of map.keys()) {\n map.set(key, map.get(key).filter(isConnected));\n }\n}, 2000);\nconst stencilSubscription = () => {\n if (typeof getRenderingRef !== 'function') {\n // If we are not in a stencil project, we do nothing.\n // This function is not really exported by @stencil/core.\n return {};\n }\n const elmsToUpdate = new Map();\n return {\n dispose: () => elmsToUpdate.clear(),\n get: (propName) => {\n const elm = getRenderingRef();\n if (elm) {\n appendToMap(elmsToUpdate, propName, elm);\n }\n },\n set: (propName) => {\n const elements = elmsToUpdate.get(propName);\n if (elements) {\n elmsToUpdate.set(propName, elements.filter(forceUpdate));\n }\n cleanupElements(elmsToUpdate);\n },\n reset: () => {\n elmsToUpdate.forEach((elms) => elms.forEach(forceUpdate));\n cleanupElements(elmsToUpdate);\n },\n };\n};\n\nconst unwrap = (val) => (typeof val === 'function' ? val() : val);\nconst createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {\n const unwrappedState = unwrap(defaultState);\n let states = new Map(Object.entries(unwrappedState !== null && unwrappedState !== void 0 ? unwrappedState : {}));\n const handlers = {\n dispose: [],\n get: [],\n set: [],\n reset: [],\n };\n const reset = () => {\n var _a;\n // When resetting the state, the default state may be a function - unwrap it to invoke it.\n // otherwise, the state won't be properly reset\n states = new Map(Object.entries((_a = unwrap(defaultState)) !== null && _a !== void 0 ? _a : {}));\n handlers.reset.forEach((cb) => cb());\n };\n const dispose = () => {\n // Call first dispose as resetting the state would\n // cause less updates ;)\n handlers.dispose.forEach((cb) => cb());\n reset();\n };\n const get = (propName) => {\n handlers.get.forEach((cb) => cb(propName));\n return states.get(propName);\n };\n const set = (propName, value) => {\n const oldValue = states.get(propName);\n if (shouldUpdate(value, oldValue, propName)) {\n states.set(propName, value);\n handlers.set.forEach((cb) => cb(propName, value, oldValue));\n }\n };\n const state = (typeof Proxy === 'undefined'\n ? {}\n : new Proxy(unwrappedState, {\n get(_, propName) {\n return get(propName);\n },\n ownKeys(_) {\n return Array.from(states.keys());\n },\n getOwnPropertyDescriptor() {\n return {\n enumerable: true,\n configurable: true,\n };\n },\n has(_, propName) {\n return states.has(propName);\n },\n set(_, propName, value) {\n set(propName, value);\n return true;\n },\n }));\n const on = (eventName, callback) => {\n handlers[eventName].push(callback);\n return () => {\n removeFromArray(handlers[eventName], callback);\n };\n };\n const onChange = (propName, cb) => {\n const unSet = on('set', (key, newValue) => {\n if (key === propName) {\n cb(newValue);\n }\n });\n // We need to unwrap the defaultState because it might be a function.\n // Otherwise we might not be sending the right reset value.\n const unReset = on('reset', () => cb(unwrap(defaultState)[propName]));\n return () => {\n unSet();\n unReset();\n };\n };\n const use = (...subscriptions) => {\n const unsubs = subscriptions.reduce((unsubs, subscription) => {\n if (subscription.set) {\n unsubs.push(on('set', subscription.set));\n }\n if (subscription.get) {\n unsubs.push(on('get', subscription.get));\n }\n if (subscription.reset) {\n unsubs.push(on('reset', subscription.reset));\n }\n if (subscription.dispose) {\n unsubs.push(on('dispose', subscription.dispose));\n }\n return unsubs;\n }, []);\n return () => unsubs.forEach((unsub) => unsub());\n };\n const forceUpdate = (key) => {\n const oldValue = states.get(key);\n handlers.set.forEach((cb) => cb(key, oldValue, oldValue));\n };\n return {\n state,\n get,\n set,\n on,\n onChange,\n use,\n dispose,\n reset,\n forceUpdate,\n };\n};\nconst removeFromArray = (array, item) => {\n const index = array.indexOf(item);\n if (index >= 0) {\n array[index] = array[array.length - 1];\n array.length--;\n }\n};\n\nconst createStore = (defaultState, shouldUpdate) => {\n const map = createObservableMap(defaultState, shouldUpdate);\n map.use(stencilSubscription());\n return map;\n};\n\nexport { createObservableMap, createStore };\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n","import { h, Component, ComponentInterface, Prop, Host, Method, Watch, Element } from \"@stencil/core\";\r\n\r\nimport { AccordionInternalState, AccordionVariant } from \"./accordion.interfaces\";\r\n\r\nimport { createStore } from \"@stencil/store\";\r\n\r\n@Component({\r\n tag: \"dso-accordion\",\r\n styleUrl: \"accordion.scss\",\r\n shadow: true,\r\n})\r\nexport class Accordion implements ComponentInterface {\r\n private accordionState: AccordionInternalState;\r\n\r\n @Element()\r\n host!: HTMLDsoAccordionElement;\r\n\r\n /\r\n The variant of the Accordion.\r\n /\r\n @Prop({ reflect: true })\r\n variant: AccordionVariant = \"default\";\r\n\r\n /\r\n Places the chevron at the opposite side.\r\n \r\n Note: this mode does not display `state`, `attachmentCount` or `status` props on Accordion Sections\r\n /\r\n @Prop({ reflect: true })\r\n reverseAlign = false;\r\n\r\n @Watch(\"variant\")\r\n updateVariant(variant: AccordionVariant = \"default\") {\r\n this.accordionState.variant = variant;\r\n }\r\n\r\n @Watch(\"reverseAlign\")\r\n updateReverseAlign(reverseAlign: boolean) {\r\n this.accordionState.reverseAlign = reverseAlign;\r\n }\r\n\r\n /\r\n @internal\r\n */\r\n @Method()\r\n async _getState(): Promise<AccordionInternalState> {\r\n return this.accordionState;\r\n }\r\n\r\n componentWillLoad() {\r\n this.accordionState.variant = this.variant;\r\n this.accordionState.reverseAlign = this.reverseAlign;\r\n }\r\n\r\n constructor() {\r\n const { state } = createStore<AccordionInternalState>({});\r\n\r\n this.accordionState = state;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host class=\"dso-accordion\">\r\n <slot></slot>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}