npm - @dso-toolkit/core - Versions diffs - 68.5.0 → 69.0.0 - Mend

@dso-toolkit/core 68.5.0 → 69.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (119) hide show

package/dist/cjs/annotation-list-renvooi-values-9836dd5d.js ADDED Viewed

@@ -0,0 +1,13 @@
+'use strict';
+const index = require('./index-57504611.js');
+const AnnotationListRenvooiValues = ({ values }) => {
+    return (index.h(index.Fragment, null, values === null || values === void 0 ? void 0 : values.map((v, i) => (index.h(index.Fragment, null,
+        i > 0 && ", ",
+        index.h("dso-renvooi", { value: v }))))));
+};
+exports.AnnotationListRenvooiValues = AnnotationListRenvooiValues;
+//# sourceMappingURL=annotation-list-renvooi-values-9836dd5d.js.map

package/dist/cjs/annotation-list-renvooi-values-9836dd5d.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"annotation-list-renvooi-values-9836dd5d.js","mappings":";;;;MAOa,2BAA2B,GAAqD,CAAC,EAAE,MAAM,EAAE;IACtG,QACEA,8BACG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,MAChBA;QACG,CAAC,GAAG,CAAC,IAAI,IAAI;QACdA,yBAAa,KAAK,EAAE,CAAC,GAAI,CACxB,CACJ,CAAC,CACD,EACH;AACJ;;;;","names":["h"],"sources":["src/components/annotation/annotation-list-renvooi-values.tsx"],"sourcesContent":["import { FunctionalComponent, Fragment, h } from \"@stencil/core\";\r\nimport { RenvooiValue } from \"../renvooi/renvooi.interfaces\";\r\n\r\ninterface AnnotationListRenvooiValues {\r\n values: RenvooiValue[] | undefined;\r\n}\r\n\r\nexport const AnnotationListRenvooiValues: FunctionalComponent<AnnotationListRenvooiValues> = ({ values }) => {\r\n return (\r\n <>\r\n {values?.map((v, i) => (\r\n <>\r\n {i > 0 && \", \"}\r\n <dso-renvooi value={v} />\r\n </>\r\n ))}\r\n </>\r\n );\r\n};\r\n"],"version":3}

package/dist/cjs/dso-alert_6.cjs.entry.js CHANGED Viewed

@@ -1321,7 +1321,7 @@ const Table = class {
     render() {
         var _a, _b;
         const caption = (_b = (_a = this.host.querySelector(":scope > table > caption")) === null || _a === void 0 ? void 0 : _a.textContent) === null || _b === void 0 ? void 0 : _b.trim();
-        return (index.h(index.Host, { key: '4a3e31c590ead4a74f0550073b1bbc148ae70f78' }, this.modalActive && this.placeholderHeight && (index.h("div", { key: '7620ca23d4f808ef8bec14678eedd55f97c3ae29', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive && index.h("div", { key: '4eb447ab8afc2630f0e30be8311bd1105a85b83c', class: "dso-modal-overlay" }), index.h("div", { key: 'c1b585dde75ddc92c8922b049628dbcd8a100d34', class: { "dso-modal": this.modalActive } }, index.h("div", Object.assign({ key: '88ad8719f80c3c4f65ab7e6879e4abad690298cb', class: { "dso-dialog": this.modalActive, "dso-table-dialog": true }, ref: (element) => (this.focusTrapElement = element) }, (this.modalActive ? { ["aria-labelledby"]: this.labelledbyId, role: "dialog" } : {})), (this.isResponsive || !this.noModal) && (index.h("div", { key: '9613603a64d41db5ee116369202d4ba515b73d8f', class: "dso-table-utilities", style: this.modalActive ? { display: "none" } : undefined }, this.isResponsive && (index.h("div", { key: '46257884cb6e02250b1afd4b26a3a0578cd48877', class: "dso-responsive-message" }, index.h("span", { key: '7a3c406ad5ec4f94f4d073ff9a53edb18c02f542' }, "beweeg de tabel van links naar rechts"))), !this.noModal && (index.h("button", { key: 'c336fe4775b023a440177806fa54e5625f529908', type: "button", class: "dso-tertiary open-modal-button", ref: (element) => (this.buttonElement = element), onClick: () => this.openModal() }, index.h("span", { key: 'c8bf55ed14ce3118a6a241b5720d6f0324b7cedd', class: "sr-only" }, "tabel ", caption !== null && caption !== void 0 ? caption : "", " "), index.h("span", { key: 'f4e0d52eb32d641dd3f90c29d6d0f67249e1c1bc' }, "vergroten"), index.h("dso-icon", { key: '22f45a465920a501450cb3f379fc01172bbf75f7', icon: "external-link" }))))), this.modalActive && (index.h("div", { key: '4fc87b95fe133e9719f9b79e0c8da9dd90ca5107', class: "dso-header" }, index.h("h2", { key: '005ce442e38893e10598314a207df249e65c98c2', id: this.labelledbyId, class: { "sr-only": !caption } }, caption || "Uitvergrote tabel dialoog"), index.h("button", { key: 'd85326b032ac6a859f94b35ad05281c6b0dbdd2e', type: "button", class: "dso-close", onClick: () => this.closeModal() }, index.h("dso-icon", { key: 'e31275c0fb68c4ba60cada741193ed992b31b8e4', icon: "times" }), index.h("span", { key: '96ba7a49baaa9d88963c92e7265bc3d4f2d5236f', class: "sr-only" }, "Sluiten")))), index.h("div", { key: '2c6aac7907786c603247f02b71df2ef85e63d2c6', class: { "dso-body": this.modalActive, "dso-table-body": true } }, index.h("slot", { key: '11c944f3e16fc5481f0e29c68d0316df41bcd038' }))))));
+        return (index.h(index.Host, { key: '799047946f16a8725591dddd4ff0604dd2387835' }, this.modalActive && this.placeholderHeight && (index.h("div", { key: 'b8c6bca3012e27a56f312c759116362f83a73a05', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive && index.h("div", { key: '95191abbb4021a485aa2d85dc16528f77be6b389', class: "dso-modal-overlay" }), index.h("div", { key: '1a1bd5f370343044660676562b68a7e001838b0a', class: { "dso-modal": this.modalActive } }, index.h("div", Object.assign({ key: '895ecea73b81b7734a5740a38393986e05bf0336', class: { "dso-dialog": this.modalActive, "dso-table-dialog": true }, ref: (element) => (this.focusTrapElement = element) }, (this.modalActive ? { ["aria-labelledby"]: this.labelledbyId, role: "dialog" } : {})), (this.isResponsive || !this.noModal) && (index.h("div", { key: 'cef13e59f5639ddce0643af4549489f46e68aaed', class: "dso-table-utilities", style: this.modalActive ? { display: "none" } : undefined }, this.isResponsive && (index.h("div", { key: '53f31dec4a2b517d7c1cc3d70267367c4776b5dd', class: "dso-responsive-message" }, index.h("span", { key: 'aff559990bc306381e35d0f10e8af5058fe346ff' }, "beweeg de tabel van links naar rechts"))), !this.noModal && (index.h("button", { key: 'b3dcee1e998d70efcf0849b742d18e0e40fabc4e', type: "button", class: "dso-tertiary open-modal-button", ref: (element) => (this.buttonElement = element), onClick: () => this.openModal() }, index.h("span", { key: '3e72a4e6605a874eb4487cc18c628d5bc771562b', class: "sr-only" }, "tabel ", caption !== null && caption !== void 0 ? caption : "", " "), index.h("span", { key: '17536f51ff5f561d94adf2f366ae5bef6f4a2192' }, "vergroten"), index.h("dso-icon", { key: '80742bbcdfd1ea381f5e88557f9f2515dd105f4d', icon: "external-link" }))))), this.modalActive && (index.h("div", { key: 'd9c6b4ff790c2cd781056ae88605d98635d13c1d', class: "dso-header" }, index.h("h2", { key: '66fe55917fe1e6b76a2e9239b12cf445cf38909d', id: this.labelledbyId, class: { "sr-only": !caption } }, caption || "Uitvergrote tabel dialoog"), index.h("button", { key: '236ff7cae30219425ec410795f7b5bd5f07409ae', type: "button", class: "dso-close", onClick: () => this.closeModal() }, index.h("dso-icon", { key: '93a325c4368207a453e9bb07c1fd24fb98f0e8dd', icon: "times" }), index.h("span", { key: 'a58215c1e577ee5e987d9227d986bf7e1edd568e', class: "sr-only" }, "Sluiten")))), index.h("div", { key: '6964623cc9365f8349e6b5ba7802b379d625097c', class: { "dso-body": this.modalActive, "dso-table-body": true } }, index.h("slot", { key: '86c401b073e39aa151799b9791bceac8e1335fb1' }))))));
     }
     openModal() {
         this.placeholderHeight = this.host.clientHeight;

package/dist/cjs/dso-annotation-activiteit.cjs.entry.js CHANGED Viewed

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-57504611.js');
 const annotationBody = require('./annotation-body-f6a7ba3d.js');
 const annotationSymbolSlot = require('./annotation-symbol-slot-f6c46cfe.js');
+const annotationListRenvooiValues = require('./annotation-list-renvooi-values-9836dd5d.js');
 const annotationCss = "a{background-color:transparent;color:var(--link-color);text-decoration:underline}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a :is(dso-icon,svg.di)+span,a span+:is(dso-icon,svg.di){margin-inline-start:8px}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-anchor-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:var(--_dso-di-background-image, url(\"./di.svg#download\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#download-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-anchor-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-anchor-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-image:var(--_dso-di-background-image, url(\"./di.svg#call-grasgroen\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#call-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-anchor-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-image:var(--_dso-di-background-image, url(\"./di.svg#email-grasgroen\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#email-scampi\"))}:host{display:block;padding:2px}:host([wijzigactie=voegtoe]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#e4f1d4;border-color:#e4f1d4;color:#191919}:host([wijzigactie=voegtoe]) a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}:host([wijzigactie=voegtoe]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}:host([wijzigactie=voegtoe]) a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}:host([wijzigactie=voegtoe]) a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}:host([wijzigactie=voegtoe]){box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25)}:host([wijzigactie=verwijder]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#f5d8dc;border-color:#f5d8dc;color:#191919}:host([wijzigactie=verwijder]) a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}:host([wijzigactie=verwijder]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}:host([wijzigactie=verwijder]) a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}:host([wijzigactie=verwijder]) a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}:host([wijzigactie=verwijder]){text-decoration:line-through}@media screen and (min--moz-device-pixel-ratio: 0){:host([wijzigactie=verwijder]){font-family:sans-serif}}*,*::after,*::before{box-sizing:border-box}.annotation-body{display:flex;gap:8px}.annotation-info{flex-grow:1}.annotation-symbol,.annotation-control{flex-shrink:0}.annotation-title{font-weight:500;word-break:break-word}.annotation-title,.annotation-data{margin-block:0}.annotation-title .content:has(+dso-label),.annotation-data .content:has(+dso-label){margin-inline-end:4px}.annotation-data{font-size:0.875rem}";
 const DsoAnnotationActiviteitStyle0 = annotationCss;
@@ -23,7 +24,7 @@ const AnnotationActiviteit = class {
     }
     render() {
         const hasSymbool = this.watcher.hasSymbool();
-        return (index.h(annotationBody.AnnotationBody, { key: 'afe2613ad46948be1043902330c9b18530aeecfc', symbol: hasSymbool ? index.h(annotationSymbolSlot.AnnotationSymbolSlot, null) : undefined, active: this.active, dsoActiveChange: this.dsoActiveChange, title: index.h("dso-renvooi", { value: this.naam }), data: index.h(index.Fragment, null, index.h("span", { class: "content" }, this.regelKwalificatie && (index.h(index.Fragment, null, index.h("dso-renvooi", { value: this.regelKwalificatie }), " ")), this.regelKwalificatieVoorzetsel && `${this.regelKwalificatieVoorzetsel}: `, index.h("dso-renvooi", { value: this.locatieNoemers })), this.gewijzigdeLocatie && index.h(annotationSymbolSlot.AnnotationGewijzigdeLocatie, null)) }));
+        return (index.h(annotationBody.AnnotationBody, { key: '004c59bc3cf2700fecabc0df774b820de13d9e06', symbol: hasSymbool ? index.h(annotationSymbolSlot.AnnotationSymbolSlot, null) : undefined, active: this.active, dsoActiveChange: this.dsoActiveChange, title: index.h("dso-renvooi", { value: this.naam }), data: index.h(index.Fragment, null, index.h("span", { class: "content" }, this.regelKwalificatie && (index.h(index.Fragment, null, index.h("dso-renvooi", { value: this.regelKwalificatie }), " ")), this.regelKwalificatieVoorzetsel && `${this.regelKwalificatieVoorzetsel}: `, index.h(annotationListRenvooiValues.AnnotationListRenvooiValues, { values: this.locatieNoemers })), this.gewijzigdeLocatie && index.h(annotationSymbolSlot.AnnotationGewijzigdeLocatie, null)) }));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-annotation-activiteit.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dso-annotation-activiteit.entry.cjs.js","mappings":"~~;;;;;;;;~~AAAA,MAAM,aAAa,GAAG,usKAAusK,CAAC;AAC9tK,sCAAe,aAAa;;~~MCef~~,oBAAoB;IALjC;;;QAyDU,YAAO,GAAGA,4BAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAoCtC;IAlCC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;KACtB;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;KACxB;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,QACEC,QAACC,6BAAc,qDACb,MAAM,EAAE,UAAU,GAAGD,QAACE,yCAAoB,OAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EAAEF,yBAAa,KAAK,EAAE,IAAI,CAAC,IAAI,GAAI,EACxC,IAAI,EACFA,8BACEA,kBAAM,KAAK,EAAC,SAAS,IAClB,IAAI,CAAC,iBAAiB,KACrBA,8BACEA,yBAAa,KAAK,EAAE,IAAI,CAAC,iBAAiB,GAAI,EAAC,GAAG,CACjD,CACJ,EACA,IAAI,CAAC,2BAA2B,IAAI,GAAG,IAAI,CAAC,2BAA2B,IAAI,EAC5EA,~~yBAAa~~,~~KAAK~~,EAAE,IAAI,CAAC,cAAc,GAAI,~~CACtC~~,EACN,IAAI,CAAC,iBAAiB,~~IAAIA~~,~~QAACG~~,gDAA2B,OAAG,CACzD,GAEL,EACF;KACH;;;;;;;","names":["watcher","h","AnnotationBody","AnnotationSymbolSlot","AnnotationGewijzigdeLocatie"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-activiteit&encapsulation=shadow","src/components/annotation/annotation-activiteit/annotation-activiteit.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/anchor/anchor\";\r\n\r\n:host {\r\n display: block;\r\n padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n display: flex;\r\n gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n font-weight: 500;\r\n word-break: break-word;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n margin-block: 0;\r\n\r\n .content:has(+ dso-label) {\r\n margin-inline-end: units.$u1 * 0.5;\r\n }\r\n}\r\n\r\n.annotation-data {\r\n font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Prop, Event, h, Fragment, EventEmitter, Element } from \"@stencil/core\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\n\r\n/*\r\n @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n /\r\n@Component({\r\n tag: \"dso-annotation-activiteit\",\r\n styleUrl: \"../annotation.scss\",\r\n shadow: true,\r\n})\r\nexport class AnnotationActiviteit implements ComponentInterface {\r\n /\r\n Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: AnnotationWijzigactie;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de annotatie actief is.\r\n /\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n /\r\n @Prop({ reflect: true })\r\n gewijzigdeLocatie?: boolean;\r\n\r\n /\r\n Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n /\r\n @Event()\r\n dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n /\r\n De naam van de activiteit.\r\n /\r\n @Prop()\r\n naam?: RenvooiValue \| string;\r\n\r\n /\r\n De activiteit regel kwalificatie.\r\n /\r\n @Prop()\r\n regelKwalificatie?: RenvooiValue \| string;\r\n\r\n /\r\n De noemer van de locatie.\r\n /\r\n @Prop()\r\n locatieNoemers?: Array<RenvooiValue \| string>;\r\n\r\n /\r\n Voorzetsel van de regelKwalificatie. Exclusief dubbele punt.\r\n */\r\n @Prop()\r\n regelKwalificatieVoorzetsel?: string;\r\n\r\n @Element()\r\n private host!: HTMLDsoAnnotationActiviteitElement;\r\n\r\n private watcher = watcher(this.host);\r\n\r\n connectedCallback(): void {\r\n this.watcher.watch();\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.watcher.unwatch();\r\n }\r\n\r\n render() {\r\n const hasSymbool = this.watcher.hasSymbool();\r\n\r\n return (\r\n <AnnotationBody\r\n symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n active={this.active}\r\n dsoActiveChange={this.dsoActiveChange}\r\n title={<dso-renvooi value={this.naam} />}\r\n data={\r\n <>\r\n <span class=\"content\">\r\n {this.regelKwalificatie && (\r\n <>\r\n <dso-renvooi value={this.regelKwalificatie} />{\" \"}\r\n </>\r\n )}\r\n {this.regelKwalificatieVoorzetsel && `${this.regelKwalificatieVoorzetsel}: `}\r\n <~~dso-renvooi~~ ~~value~~={this.locatieNoemers} />\r\n </span>\r\n {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n </>\r\n }\r\n />\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"dso-annotation-activiteit.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,aAAa,GAAG,usKAAusK,CAAC;AAC9tK,sCAAe,aAAa;;MCgBf,oBAAoB;IALjC;;;QAyDU,YAAO,GAAGA,4BAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAoCtC;IAlCC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;KACtB;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;KACxB;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,QACEC,QAACC,6BAAc,qDACb,MAAM,EAAE,UAAU,GAAGD,QAACE,yCAAoB,OAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EAAEF,yBAAa,KAAK,EAAE,IAAI,CAAC,IAAI,GAAI,EACxC,IAAI,EACFA,8BACEA,kBAAM,KAAK,EAAC,SAAS,IAClB,IAAI,CAAC,iBAAiB,KACrBA,8BACEA,yBAAa,KAAK,EAAE,IAAI,CAAC,iBAAiB,GAAI,EAAC,GAAG,CACjD,CACJ,EACA,IAAI,CAAC,2BAA2B,IAAI,GAAG,IAAI,CAAC,2BAA2B,IAAI,EAC5EA,QAACG,uDAA2B,IAAC,MAAM,EAAE,IAAI,CAAC,cAAc,GAAI,CACvD,EACN,IAAI,CAAC,iBAAiB,IAAIH,QAACI,gDAA2B,OAAG,CACzD,GAEL,EACF;KACH;;;;;;;","names":["watcher","h","AnnotationBody","AnnotationSymbolSlot","AnnotationListRenvooiValues","AnnotationGewijzigdeLocatie"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-activiteit&encapsulation=shadow","src/components/annotation/annotation-activiteit/annotation-activiteit.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/anchor/anchor\";\r\n\r\n:host {\r\n display: block;\r\n padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n display: flex;\r\n gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n font-weight: 500;\r\n word-break: break-word;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n margin-block: 0;\r\n\r\n .content:has(+ dso-label) {\r\n margin-inline-end: units.$u1 * 0.5;\r\n }\r\n}\r\n\r\n.annotation-data {\r\n font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Prop, Event, h, Fragment, EventEmitter, Element } from \"@stencil/core\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\nimport { AnnotationListRenvooiValues } from \"../annotation-list-renvooi-values\";\r\n\r\n/*\r\n @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n /\r\n@Component({\r\n tag: \"dso-annotation-activiteit\",\r\n styleUrl: \"../annotation.scss\",\r\n shadow: true,\r\n})\r\nexport class AnnotationActiviteit implements ComponentInterface {\r\n /\r\n Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: AnnotationWijzigactie;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de annotatie actief is.\r\n /\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n /\r\n @Prop({ reflect: true })\r\n gewijzigdeLocatie?: boolean;\r\n\r\n /\r\n Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n /\r\n @Event()\r\n dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n /\r\n De naam van de activiteit.\r\n /\r\n @Prop()\r\n naam?: RenvooiValue \| string;\r\n\r\n /\r\n De activiteit regel kwalificatie.\r\n /\r\n @Prop()\r\n regelKwalificatie?: RenvooiValue \| string;\r\n\r\n /\r\n De noemer van de locatie.\r\n /\r\n @Prop()\r\n locatieNoemers?: Array<RenvooiValue \| string>;\r\n\r\n /\r\n Voorzetsel van de regelKwalificatie. Exclusief dubbele punt.\r\n */\r\n @Prop()\r\n regelKwalificatieVoorzetsel?: string;\r\n\r\n @Element()\r\n private host!: HTMLDsoAnnotationActiviteitElement;\r\n\r\n private watcher = watcher(this.host);\r\n\r\n connectedCallback(): void {\r\n this.watcher.watch();\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.watcher.unwatch();\r\n }\r\n\r\n render() {\r\n const hasSymbool = this.watcher.hasSymbool();\r\n\r\n return (\r\n <AnnotationBody\r\n symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n active={this.active}\r\n dsoActiveChange={this.dsoActiveChange}\r\n title={<dso-renvooi value={this.naam} />}\r\n data={\r\n <>\r\n <span class=\"content\">\r\n {this.regelKwalificatie && (\r\n <>\r\n <dso-renvooi value={this.regelKwalificatie} />{\" \"}\r\n </>\r\n )}\r\n {this.regelKwalificatieVoorzetsel && `${this.regelKwalificatieVoorzetsel}: `}\r\n <AnnotationListRenvooiValues values={this.locatieNoemers} />\r\n </span>\r\n {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n </>\r\n }\r\n />\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/cjs/dso-annotation-omgevingsnormwaarde.cjs.entry.js CHANGED Viewed

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-57504611.js');
 const annotationBody = require('./annotation-body-f6a7ba3d.js');
 const annotationSymbolSlot = require('./annotation-symbol-slot-f6c46cfe.js');
+const annotationListRenvooiValues = require('./annotation-list-renvooi-values-9836dd5d.js');
 const annotationCss = "a{background-color:transparent;color:var(--link-color);text-decoration:underline}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a :is(dso-icon,svg.di)+span,a span+:is(dso-icon,svg.di){margin-inline-start:8px}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-anchor-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:var(--_dso-di-background-image, url(\"./di.svg#download\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#download-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-anchor-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-anchor-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-image:var(--_dso-di-background-image, url(\"./di.svg#call-grasgroen\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#call-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-anchor-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-image:var(--_dso-di-background-image, url(\"./di.svg#email-grasgroen\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#email-scampi\"))}:host{display:block;padding:2px}:host([wijzigactie=voegtoe]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#e4f1d4;border-color:#e4f1d4;color:#191919}:host([wijzigactie=voegtoe]) a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}:host([wijzigactie=voegtoe]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}:host([wijzigactie=voegtoe]) a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}:host([wijzigactie=voegtoe]) a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}:host([wijzigactie=voegtoe]){box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25)}:host([wijzigactie=verwijder]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#f5d8dc;border-color:#f5d8dc;color:#191919}:host([wijzigactie=verwijder]) a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}:host([wijzigactie=verwijder]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}:host([wijzigactie=verwijder]) a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}:host([wijzigactie=verwijder]) a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}:host([wijzigactie=verwijder]){text-decoration:line-through}@media screen and (min--moz-device-pixel-ratio: 0){:host([wijzigactie=verwijder]){font-family:sans-serif}}*,*::after,*::before{box-sizing:border-box}.annotation-body{display:flex;gap:8px}.annotation-info{flex-grow:1}.annotation-symbol,.annotation-control{flex-shrink:0}.annotation-title{font-weight:500;word-break:break-word}.annotation-title,.annotation-data{margin-block:0}.annotation-title .content:has(+dso-label),.annotation-data .content:has(+dso-label){margin-inline-end:4px}.annotation-data{font-size:0.875rem}";
 const DsoAnnotationOmgevingsnormwaardeStyle0 = annotationCss;
@@ -23,7 +24,7 @@ const AnnotationOmgevingsnormwaarde = class {
     }
     render() {
         const hasSymbool = this.watcher.hasSymbool();
-        return (index.h(annotationBody.AnnotationBody, { key: '5e2947e6f85b9c02cdf87099f59a304224e96b81', symbol: hasSymbool ? index.h(annotationSymbolSlot.AnnotationSymbolSlot, null) : undefined, active: this.active || false, dsoActiveChange: this.dsoActiveChange, title: index.h(index.Fragment, null, index.h("dso-renvooi", { value: this.naam }), this.eenheid && (index.h(index.Fragment, null, " ", "(in ", index.h("dso-renvooi", { value: this.eenheid }), ")"))), data: index.h(index.Fragment, null, index.h("span", { class: "content" }, this.toelichting && index.h(index.Fragment, null, this.toelichting), this.waardes && this.waardes.length > 0 && (index.h(index.Fragment, null, ": ", index.h("dso-renvooi", { value: this.waardes })))), this.gewijzigdeLocatie && index.h(annotationSymbolSlot.AnnotationGewijzigdeLocatie, null)) }));
+        return (index.h(annotationBody.AnnotationBody, { key: '7b118d1c32131742b38869b59683942e1d6f78e9', symbol: hasSymbool ? index.h(annotationSymbolSlot.AnnotationSymbolSlot, null) : undefined, active: this.active || false, dsoActiveChange: this.dsoActiveChange, title: index.h(index.Fragment, null, index.h("dso-renvooi", { value: this.naam }), this.eenheid && (index.h(index.Fragment, null, " ", "(in ", index.h("dso-renvooi", { value: this.eenheid }), ")"))), data: index.h(index.Fragment, null, index.h("span", { class: "content" }, this.toelichting && index.h(index.Fragment, null, this.toelichting), this.waardes && this.waardes.length > 0 && (index.h(index.Fragment, null, ": ", index.h(annotationListRenvooiValues.AnnotationListRenvooiValues, { values: this.waardes })))), this.gewijzigdeLocatie && index.h(annotationSymbolSlot.AnnotationGewijzigdeLocatie, null)) }));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-annotation-omgevingsnormwaarde.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dso-annotation-omgevingsnormwaarde.entry.cjs.js","mappings":"~~;;;;;;;;~~AAAA,MAAM,aAAa,GAAG,usKAAusK,CAAC;AAC9tK,+CAAe,aAAa;;~~MCkBf~~,6BAA6B;IAL1C;;;QAyDU,YAAO,GAAGA,4BAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KA6CtC;IA3CC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;KACtB;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;KACxB;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,QACEC,QAACC,6BAAc,qDACb,MAAM,EAAE,UAAU,GAAGD,QAACE,yCAAoB,OAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,KAAK,EAC5B,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACHF,8BACEA,yBAAa,KAAK,EAAE,IAAI,CAAC,IAAI,GAAI,EAChC,IAAI,CAAC,OAAO,KACXA,8BACG,GAAG,UACAA,yBAAa,KAAK,EAAE,IAAI,CAAC,OAAO,GAAI,MACvC,CACJ,CACA,EAEL,IAAI,EACFA,8BACEA,kBAAM,KAAK,EAAC,SAAS,IAClB,IAAI,CAAC,WAAW,IAAIA,8BAAG,IAAI,CAAC,WAAW,CAAI,EAC3C,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,KACtCA,oCACIA,~~yBAAa~~,~~KAAK~~,EAAE,IAAI,CAAC,OAAO,GAAI,~~CACrC~~,CACJ,CACI,EACN,IAAI,CAAC,iBAAiB,~~IAAIA~~,~~QAACG~~,gDAA2B,OAAG,CACzD,GAEL,EACF;KACH;;;;;;;","names":["watcher","h","AnnotationBody","AnnotationSymbolSlot","AnnotationGewijzigdeLocatie"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-omgevingsnormwaarde&encapsulation=shadow","src/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/anchor/anchor\";\r\n\r\n:host {\r\n display: block;\r\n padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n display: flex;\r\n gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n font-weight: 500;\r\n word-break: break-word;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n margin-block: 0;\r\n\r\n .content:has(+ dso-label) {\r\n margin-inline-end: units.$u1 * 0.5;\r\n }\r\n}\r\n\r\n.annotation-data {\r\n font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Prop, Event, h, EventEmitter, Fragment, Element } from \"@stencil/core\";\r\n\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\n\r\n/*\r\n Dit component wordt voor een Omgevingsnorm en Omgevingswaarde gebruikt.\r\n \r\n @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n /\r\n@Component({\r\n tag: \"dso-annotation-omgevingsnormwaarde\",\r\n styleUrl: \"../annotation.scss\",\r\n shadow: true,\r\n})\r\nexport class AnnotationOmgevingsnormwaarde implements ComponentInterface {\r\n /\r\n Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: AnnotationWijzigactie;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de annotatie actief is.\r\n /\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n /\r\n @Prop({ reflect: true })\r\n gewijzigdeLocatie?: boolean;\r\n\r\n /\r\n Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n /\r\n @Event()\r\n dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n /\r\n De naam van de omgevingsnorm of omgevingswaarde.\r\n /\r\n @Prop()\r\n naam?: RenvooiValue \| string;\r\n\r\n /\r\n De toelichting van de waardes.\r\n /\r\n @Prop()\r\n toelichting?: string;\r\n\r\n /\r\n De waardes van de omgevingsnorm of omgevingswaarde.\r\n /\r\n @Prop()\r\n waardes?: Array<RenvooiValue \| string>;\r\n\r\n /\r\n De eenheid van de omgevingsnorm of omgevingswaarde.\r\n */\r\n @Prop()\r\n eenheid?: RenvooiValue \| string;\r\n\r\n @Element()\r\n private host!: HTMLDsoAnnotationOmgevingsnormwaardeElement;\r\n\r\n private watcher = watcher(this.host);\r\n\r\n connectedCallback(): void {\r\n this.watcher.watch();\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.watcher.unwatch();\r\n }\r\n\r\n render() {\r\n const hasSymbool = this.watcher.hasSymbool();\r\n\r\n return (\r\n <AnnotationBody\r\n symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n active={this.active \|\| false}\r\n dsoActiveChange={this.dsoActiveChange}\r\n title={\r\n <>\r\n <dso-renvooi value={this.naam} />\r\n {this.eenheid && (\r\n <>\r\n {\" \"}\r\n (in <dso-renvooi value={this.eenheid} />)\r\n </>\r\n )}\r\n </>\r\n }\r\n data={\r\n <>\r\n <span class=\"content\">\r\n {this.toelichting && <>{this.toelichting}</>}\r\n {this.waardes && this.waardes.length > 0 && (\r\n <>\r\n : <~~dso-renvooi~~ ~~value~~={this.waardes} />\r\n </>\r\n )}\r\n </span>\r\n {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n </>\r\n }\r\n />\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"dso-annotation-omgevingsnormwaarde.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,aAAa,GAAG,usKAAusK,CAAC;AAC9tK,+CAAe,aAAa;;MCmBf,6BAA6B;IAL1C;;;QAyDU,YAAO,GAAGA,4BAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KA6CtC;IA3CC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;KACtB;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;KACxB;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,QACEC,QAACC,6BAAc,qDACb,MAAM,EAAE,UAAU,GAAGD,QAACE,yCAAoB,OAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,KAAK,EAC5B,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACHF,8BACEA,yBAAa,KAAK,EAAE,IAAI,CAAC,IAAI,GAAI,EAChC,IAAI,CAAC,OAAO,KACXA,8BACG,GAAG,UACAA,yBAAa,KAAK,EAAE,IAAI,CAAC,OAAO,GAAI,MACvC,CACJ,CACA,EAEL,IAAI,EACFA,8BACEA,kBAAM,KAAK,EAAC,SAAS,IAClB,IAAI,CAAC,WAAW,IAAIA,8BAAG,IAAI,CAAC,WAAW,CAAI,EAC3C,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,KACtCA,oCACIA,QAACG,uDAA2B,IAAC,MAAM,EAAE,IAAI,CAAC,OAAO,GAAI,CACtD,CACJ,CACI,EACN,IAAI,CAAC,iBAAiB,IAAIH,QAACI,gDAA2B,OAAG,CACzD,GAEL,EACF;KACH;;;;;;;","names":["watcher","h","AnnotationBody","AnnotationSymbolSlot","AnnotationListRenvooiValues","AnnotationGewijzigdeLocatie"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-omgevingsnormwaarde&encapsulation=shadow","src/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/anchor/anchor\";\r\n\r\n:host {\r\n display: block;\r\n padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n display: flex;\r\n gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n font-weight: 500;\r\n word-break: break-word;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n margin-block: 0;\r\n\r\n .content:has(+ dso-label) {\r\n margin-inline-end: units.$u1 * 0.5;\r\n }\r\n}\r\n\r\n.annotation-data {\r\n font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Prop, Event, h, EventEmitter, Fragment, Element } from \"@stencil/core\";\r\n\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\nimport { AnnotationListRenvooiValues } from \"../annotation-list-renvooi-values\";\r\n\r\n/*\r\n Dit component wordt voor een Omgevingsnorm en Omgevingswaarde gebruikt.\r\n \r\n @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n /\r\n@Component({\r\n tag: \"dso-annotation-omgevingsnormwaarde\",\r\n styleUrl: \"../annotation.scss\",\r\n shadow: true,\r\n})\r\nexport class AnnotationOmgevingsnormwaarde implements ComponentInterface {\r\n /\r\n Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: AnnotationWijzigactie;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de annotatie actief is.\r\n /\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n /\r\n @Prop({ reflect: true })\r\n gewijzigdeLocatie?: boolean;\r\n\r\n /\r\n Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n /\r\n @Event()\r\n dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n /\r\n De naam van de omgevingsnorm of omgevingswaarde.\r\n /\r\n @Prop()\r\n naam?: RenvooiValue \| string;\r\n\r\n /\r\n De toelichting van de waardes.\r\n /\r\n @Prop()\r\n toelichting?: string;\r\n\r\n /\r\n De waardes van de omgevingsnorm of omgevingswaarde.\r\n /\r\n @Prop()\r\n waardes?: Array<RenvooiValue \| string>;\r\n\r\n /\r\n De eenheid van de omgevingsnorm of omgevingswaarde.\r\n */\r\n @Prop()\r\n eenheid?: RenvooiValue \| string;\r\n\r\n @Element()\r\n private host!: HTMLDsoAnnotationOmgevingsnormwaardeElement;\r\n\r\n private watcher = watcher(this.host);\r\n\r\n connectedCallback(): void {\r\n this.watcher.watch();\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.watcher.unwatch();\r\n }\r\n\r\n render() {\r\n const hasSymbool = this.watcher.hasSymbool();\r\n\r\n return (\r\n <AnnotationBody\r\n symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n active={this.active \|\| false}\r\n dsoActiveChange={this.dsoActiveChange}\r\n title={\r\n <>\r\n <dso-renvooi value={this.naam} />\r\n {this.eenheid && (\r\n <>\r\n {\" \"}\r\n (in <dso-renvooi value={this.eenheid} />)\r\n </>\r\n )}\r\n </>\r\n }\r\n data={\r\n <>\r\n <span class=\"content\">\r\n {this.toelichting && <>{this.toelichting}</>}\r\n {this.waardes && this.waardes.length > 0 && (\r\n <>\r\n : <AnnotationListRenvooiValues values={this.waardes} />\r\n </>\r\n )}\r\n </span>\r\n {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n </>\r\n }\r\n />\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/cjs/dso-info_2.cjs.entry.js CHANGED Viewed

@@ -70,7 +70,7 @@ const Selectable = class {
     render() {
         var _a;
         const hasInfo = !!this.host.querySelector('[slot="info"]');
-        return (index.h(index.Fragment, { key: 'a222ec7ad8d066da17bb7464e527d12c2a76e590' }, index.h("div", { key: '9f2ca503f4b3d3ec2018c25d38c689a249a660b0', class: "dso-selectable-container" }, index.h("div", { key: 'd2e134932e6a3e44edf369429ecbe005749d9457', class: clsx.clsx("dso-selectable-input-wrapper", { "dso-keyboard-focus": this.keyboardFocus }) }, index.h("input", { key: '52c07cf54ff5fe937b8bb07c602ce3814d6d7cb0', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": hasInfo && this.infoFixed ? this.describedById : undefined, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, onBlur: () => (this.keyboardFocus = false), onKeyUp: () => (this.keyboardFocus = true), ref: (el) => (this.input = el) }), !this.labelledById ? (index.h("label", { htmlFor: this.getIdentifier() }, index.h("slot", null))) : (index.h("label", null, index.h("slot", null)))), hasInfo && !this.infoFixed && (index.h("dso-info-button", { key: '9d99bb8b25689d51f9ec6662eb422f617c8e639d', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (index.h("dso-info", { key: '85ccbf3e8e8fe3138cdfaf292d542f82eeaf04aa', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, index.h("div", { key: 'ebe2a93e03ccb00fca6a788e6119a8c2557993f1' }, index.h("slot", { key: '745d4fd460fdd9d4efe63a14fe13d3b84a5cdc0c', name: "info" })))), index.h("slot", { key: '0dfdb5ca0d5b5569f16e1cc1ee84b416ccbc118e', name: "options" })));
+        return (index.h(index.Fragment, { key: '8eaf459e1b418a9c5eb61c12939aa137b1e9a9b7' }, index.h("div", { key: 'ecbf02645dd338d6071fb06426662d78649bd8c8', class: "dso-selectable-container" }, index.h("div", { key: 'c244e0254c468e30c22ec958c6be91e532d77392', class: clsx.clsx("dso-selectable-input-wrapper", { "dso-keyboard-focus": this.keyboardFocus }) }, index.h("input", { key: 'df920ead7e69f3e136a058cd5ab7953ecad8c707', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": hasInfo && this.infoFixed ? this.describedById : undefined, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, onBlur: () => (this.keyboardFocus = false), onKeyUp: () => (this.keyboardFocus = true), ref: (el) => (this.input = el) }), !this.labelledById ? (index.h("label", { htmlFor: this.getIdentifier() }, index.h("slot", null))) : (index.h("label", null, index.h("slot", null)))), hasInfo && !this.infoFixed && (index.h("dso-info-button", { key: 'f539a4ea7af6bb4c1412895c2af316b9014d8420', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (index.h("dso-info", { key: '69bde115eba8f18261c79886654defb9f0f703f6', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, index.h("div", { key: '9d92cccb1adfd77adc579f57281dddc56a2225ba' }, index.h("slot", { key: '4fee8b038cb69e5321c23502eb6a5dad31c3c9ee', name: "info" })))), index.h("slot", { key: 'fd69188bb07390259d9ac58f328d3a7c8b42fe12', name: "options" })));
     }
     componentDidRender() {
         if (this.input && typeof this.checked === "boolean" && this.input.checked !== this.checked) {

package/dist/cjs/dso-label_3.cjs.entry.js CHANGED Viewed

@@ -129,23 +129,26 @@ const RenvooiRender = ({ value }) => {
         // This element is used for --_dso-renvooi-text-decoration
         return index$1.h("span", { class: "text" }, value);
     }
-    if (Array.isArray(value)) {
-        return (index$1.h(index$1.Fragment, null, value.map((v, i, { length }) => (index$1.h(index$1.Fragment, null, index$1.h(RenvooiRender, { value: v }), i < length - 1 ? ", " : "")))));
-    }
     if ("toegevoegd" in value) {
         return index$1.h("ins", null, value.toegevoegd);
     }
     if ("verwijderd" in value) {
         return index$1.h("del", null, value.verwijderd);
     }
-    return (index$1.h(index$1.Fragment, null, index$1.h("del", null, value.was), " ", index$1.h("ins", null, value.wordt)));
+    return (index$1.h(index$1.Fragment, null, index$1.h("del", null, value.was), index$1.h("ins", null, value.wordt)));
 };
 const Renvooi = class {
     constructor(hostRef) {
         index$1.registerInstance(this, hostRef);
     }
+    get values() {
+        if (!this.value) {
+            return [];
+        }
+        return Array.isArray(this.value) ? this.value : [this.value];
+    }
     render() {
-        return index$1.h(RenvooiRender, { key: 'a7722eabd37746790caa7c3e960d4dd1ca420875', value: this.value });
+        return (index$1.h(index$1.Fragment, null, this.values.map((v) => (index$1.h(RenvooiRender, { value: v })))));
     }
 };
 Renvooi.style = DsoRenvooiStyle0;
@@ -180,7 +183,7 @@ const SlideToggle = class {
         this.hasVisibleLabel = this.host.querySelector("*") !== null;
     }
     render() {
-        return (index$1.h(index$1.Fragment, null, index$1.h("button", Object.assign({ key: '47ab037e365eb57922b02241e841b8eb848836a3', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e) }, (this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), (this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {})), index$1.h("svg", { key: '8e985e4789f4b6194dfc8f2e1f8e2b4a996c0c65', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: '6d185794241cd22e19b884a0ca8e64b2078d1679', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: '1b4d88a1b241c8f380bd5aaa0fd185937387597f', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: '9f559b1daed390bb7b623ca8a7954fe1d724578b', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: '14e3fae9ea95616076688c7a43b212e5bc84a33f', htmlFor: this.identifier }, index$1.h("slot", { key: '9e0c9eaad8deeaa0956ab5314d28363a39c3fbf4' })))));
+        return (index$1.h(index$1.Fragment, null, index$1.h("button", Object.assign({ key: '5aee4d9968329a8df970a172e481d00aa89f6cfc', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e) }, (this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), (this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {})), index$1.h("svg", { key: '470f2fef216e0b5fc3d450af8285c007a376d1f6', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, index$1.h("g", { key: 'd013d54c54240c42ab7a2fe35cfaf8ff82fbe36d', fill: "none", "fill-rule": "evenodd" }, index$1.h("rect", { key: 'abb51b7d6bf57c19945644d93d7f7651c728ec74', width: "40", height: "20", fill: "currentColor", rx: "10" }), index$1.h("circle", { key: 'b4b6842b0a7acb77de82d79b9932dfaa3e0ae7c4', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (index$1.h("label", { key: '718c01776b005c142c58c3f5a96f956c8cecab5a', htmlFor: this.identifier }, index$1.h("slot", { key: '398f532a0442e039704f9fcd130eafb33a19b55f' })))));
     }
     get host() { return index$1.getElement(this); }
 };

package/dist/cjs/dso-label_3.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dso-label.dso-renvooi.dso-slide-toggle.entry.cjs.js","mappings":"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","names":["debounce","h","Fragment","clsx","v4"],"sources":["src/components/label/label.scss?tag=dso-label&encapsulation=shadow","src/components/label/label.tsx","src/components/renvooi/renvooi.scss?tag=dso-renvooi&encapsulation=shadow","src/components/renvooi/renvooi.tsx","src/components/slide-toggle/slide-toggle.scss?tag=dso-slide-toggle&encapsulation=scoped","src/components/slide-toggle/slide-toggle.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/label\";\r\n\r\n:host {\r\n display: inline-block;\r\n max-inline-size: 100%;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n// Todo: Replace .sr-only selector with web component specific selector, no need for .sr-only if we can generate the SCSS\r\n.sr-only {\r\n @include utilities.sr-only();\r\n}\r\n\r\n.dso-label {\r\n @include label.root();\r\n\r\n &.dso-hover {\r\n .dso-label-content {\r\n text-decoration: line-through;\r\n }\r\n }\r\n}\r\n\r\n.dso-truncate.dso-label-content {\r\n display: inline-block;\r\n max-inline-size: 100%;\r\n overflow: hidden;\r\n text-overflow: ellipsis; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n vertical-align: bottom;\r\n white-space: nowrap; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n}\r\n\r\n:host([removable]) {\r\n .dso-truncate.dso-label-content {\r\n max-inline-size: calc(100% - (units.$u3 + 4px));\r\n }\r\n}\r\n","import {\r\n h,\r\n Component,\r\n ComponentInterface,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n Fragment,\r\n Method,\r\n Prop,\r\n State,\r\n Watch,\r\n Listen,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\nimport debounce from \"debounce\";\r\nimport { LabelStatus } from \"./label.interfaces\";\r\n\r\nconst resizeObserver = new ResizeObserver(\r\n debounce((entries: ResizeObserverEntry[]) => {\r\n entries.forEach(({ target }) => {\r\n if (isDsoLabelComponent(target)) {\r\n target._truncateLabel();\r\n }\r\n });\r\n }, 150),\r\n);\r\n\r\nfunction isDsoLabelComponent(element: Element): element is HTMLDsoLabelElement {\r\n return element.tagName === \"DSO-LABEL\";\r\n}\r\n\r\nfunction hasEllipses(el: HTMLElement): boolean {\r\n return el.scrollWidth > el.clientWidth;\r\n}\r\n\r\n@Component({\r\n tag: \"dso-label\",\r\n styleUrl: \"label.scss\",\r\n shadow: true,\r\n})\r\nexport class Label implements ComponentInterface {\r\n private labelContent: HTMLSpanElement \| undefined;\r\n\r\n private mutationObserver?: MutationObserver;\r\n\r\n @Element()\r\n private host!: HTMLDsoLabelElement;\r\n\r\n /*\r\n For compact Label\r\n /\r\n @Prop()\r\n compact?: boolean;\r\n\r\n /\r\n Shows a button that can be used to remove the Label.\r\n /\r\n @Prop({ reflect: true })\r\n removable?: boolean;\r\n\r\n /\r\n The status of this Label.\r\n /\r\n @Prop()\r\n status?: LabelStatus;\r\n\r\n /\r\n Emitted when the user activates the remove button.\r\n /\r\n @Event()\r\n dsoRemoveClick!: EventEmitter<MouseEvent>;\r\n\r\n @State()\r\n removeHover?: boolean;\r\n\r\n @State()\r\n removeFocus?: boolean;\r\n\r\n /\r\n Whether the Label is allowed to truncate the contents if it does not fit the container element.\r\n /\r\n @Prop()\r\n truncate?: boolean;\r\n\r\n @State()\r\n textHover?: boolean;\r\n\r\n @State()\r\n textFocus?: boolean;\r\n\r\n @State()\r\n isTruncated = false;\r\n\r\n @State()\r\n labelText = \"\";\r\n\r\n @Watch(\"removable\")\r\n watchRemovable(removable: boolean) {\r\n if (removable) {\r\n this.startMutationObserver();\r\n } else {\r\n this.stopMutationObserver();\r\n }\r\n }\r\n\r\n @Watch(\"truncate\")\r\n watchTruncate(truncate: boolean) {\r\n if (truncate) {\r\n this.startTruncate();\r\n } else {\r\n this.stopTruncate();\r\n }\r\n }\r\n\r\n @Listen(\"keydown\", { target: \"document\" })\r\n keyDownListener(event: KeyboardEvent) {\r\n if (event.key === \"Escape\") {\r\n this.textHover = false;\r\n this.textFocus = false;\r\n }\r\n }\r\n\r\n /\r\n @internal\r\n /\r\n @Method()\r\n async _truncateLabel() {\r\n setTimeout(() => {\r\n this.isTruncated = !!this.labelContent && hasEllipses(this.labelContent);\r\n });\r\n }\r\n\r\n private syncLabelText() {\r\n this.labelText = this.host.textContent?.trim() ?? \"\";\r\n }\r\n\r\n componentDidLoad() {\r\n if (this.truncate) {\r\n this.startTruncate();\r\n }\r\n\r\n if (this.removable) {\r\n this.startMutationObserver();\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n this.stopTruncate();\r\n\r\n this.stopMutationObserver(true);\r\n }\r\n\r\n /* The mutationObserver fetches the text placed inside the label, this is then used for the remove button and tooltip. /\r\n private startMutationObserver(): void {\r\n this.mutationObserver = new MutationObserver(() => this.syncLabelText());\r\n\r\n this.mutationObserver.observe(this.host, {\r\n characterData: true,\r\n childList: true,\r\n subtree: true,\r\n attributes: true,\r\n });\r\n\r\n this.syncLabelText();\r\n }\r\n\r\n private stopMutationObserver(force = false): void {\r\n if (force \|\| !(this.truncate && this.removable)) {\r\n this.mutationObserver?.disconnect();\r\n\r\n delete this.mutationObserver;\r\n }\r\n }\r\n\r\n private startTruncate(): void {\r\n resizeObserver.observe(this.host);\r\n this.startMutationObserver();\r\n this._truncateLabel();\r\n }\r\n\r\n private stopTruncate(): void {\r\n resizeObserver.unobserve(this.host);\r\n this.stopMutationObserver();\r\n this.isTruncated = false;\r\n }\r\n\r\n render() {\r\n return (\r\n <Fragment>\r\n <span\r\n aria-describedby=\"toggle-anchor\"\r\n class={clsx(\"dso-label\", {\r\n [`dso-label-${this.status}`]: this.status,\r\n \"dso-compact\": this.compact && !this.removable,\r\n \"dso-hover\": this.removeHover \|\| this.removeFocus,\r\n })}\r\n >\r\n <slot name=\"symbol\"></slot>\r\n <span\r\n class={clsx(\"dso-label-content\", {\r\n \"dso-truncate\": !!this.truncate,\r\n })}\r\n ref={(element) => (this.labelContent = element)}\r\n tabindex={this.truncate && this.isTruncated ? 0 : undefined}\r\n onMouseEnter={() => (this.textHover = true)}\r\n onMouseLeave={() => (this.textHover = false)}\r\n onFocus={() => (this.textFocus = true)}\r\n onBlur={() => (this.textFocus = false)}\r\n >\r\n <slot></slot>\r\n </span>\r\n {this.removable && (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => this.dsoRemoveClick.emit(e)}\r\n onMouseEnter={() => (this.removeHover = true)}\r\n onMouseLeave={() => (this.removeHover = false)}\r\n onFocus={() => (this.removeFocus = true)}\r\n onBlur={() => (this.removeFocus = false)}\r\n >\r\n <span class=\"sr-only\">Verwijder: {this.labelText}</span>\r\n <dso-icon icon=\"times\"></dso-icon>\r\n </button>\r\n )}\r\n </span>\r\n {this.isTruncated && (\r\n <dso-tooltip\r\n stateless\r\n id=\"toggle-anchor\"\r\n active={this.textHover \|\| this.textFocus}\r\n position=\"top\"\r\n strategy=\"absolute\"\r\n >\r\n {this.labelText}\r\n </dso-tooltip>\r\n )}\r\n </Fragment>\r\n );\r\n }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n@use \"~dso-toolkit/src/components/insert/insert\";\r\n@use \"~dso-toolkit/src/components/delete/delete\";\r\n\r\n:host {\r\n display: inline;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.text {\r\n text-decoration: var(--_dso-renvooi-text-decoration);\r\n}\r\n","import { Component, ComponentInterface, Fragment, FunctionalComponent, Prop, h } from \"@stencil/core\";\r\n\r\nimport { RenvooiValue } from \"./renvooi.interfaces\";\r\n\r\ninterface RenvooiRenderProps {\r\n value: RenvooiValue \| RenvooiValue[] \| undefined;\r\n}\r\n\r\nconst RenvooiRender: FunctionalComponent<RenvooiRenderProps> = ({ value }) => {\r\n if (typeof value === \"string\" \|\| !value) {\r\n // This element is used for --_dso-renvooi-text-decoration\r\n return <span class=\"text\">{value}</span>;\r\n }\r\n\r\n if (Array.isArray(value)) {\r\n return (\r\n <>\r\n {value.map((v, i, { length }) => (\r\n <>\r\n <RenvooiRender value={v} />\r\n {i < length - 1 ? \", \" : \"\"}\r\n </>\r\n ))}\r\n </>\r\n );\r\n }\r\n\r\n if (\"toegevoegd\" in value) {\r\n return <ins>{value.toegevoegd}</ins>;\r\n }\r\n\r\n if (\"verwijderd\" in value) {\r\n return <del>{value.verwijderd}</del>;\r\n }\r\n\r\n return (\r\n <>\r\n <del>{value.was}</del> <ins>{value.wordt}</ins>\r\n </>\r\n );\r\n};\r\n\r\n/\r\n Met dit component kan een `RenvooiValue` worden gepresenteerd.\r\n /\r\n@Component({\r\n tag: \"dso-renvooi\",\r\n styleUrl: \"renvooi.scss\",\r\n shadow: true,\r\n})\r\nexport class Renvooi implements ComponentInterface {\r\n /\r\n The renvooi value to render.\r\n /\r\n @Prop()\r\n value?: RenvooiValue \| RenvooiValue[];\r\n\r\n render() {\r\n return <RenvooiRender value={this.value} />;\r\n }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n\r\n$slide-toggle-height: 20px;\r\n\r\n:host {\r\n display: inline-block;\r\n padding-block-start: (typography.$line-height-base typography.$font-size-base - $slide-toggle-height) * 0.5;\r\n}\r\n\r\nbutton.dso-slider {\r\n border: 0;\r\n padding: 0;\r\n\r\n &:focus-visible {\r\n outline: 2px solid colors.$grijs-80;\r\n outline-offset: 1px;\r\n }\r\n\r\n svg {\r\n rect {\r\n fill: colors.$grijs-40;\r\n transition: fill 0.25s;\r\n }\r\n\r\n circle {\r\n @include utilities.transition(transform);\r\n\r\n transform: translateX(10px);\r\n fill: colors.$wit;\r\n }\r\n }\r\n\r\n &[aria-checked=\"true\"] svg {\r\n rect {\r\n fill: colors.$bosgroen;\r\n }\r\n\r\n circle {\r\n transform: translateX(30px);\r\n fill: colors.$wit;\r\n }\r\n }\r\n\r\n &[disabled] svg {\r\n rect {\r\n fill: colors.$grijs-20;\r\n }\r\n\r\n circle {\r\n fill: colors.$grijs-10;\r\n }\r\n }\r\n\r\n &[disabled][aria-checked=\"true\"] svg {\r\n rect {\r\n fill: colors.$bosgroen-40;\r\n }\r\n\r\n circle {\r\n fill: colors.$grijs-10;\r\n }\r\n }\r\n}\r\n\r\n.dso-slider {\r\n border-radius: units.$u3;\r\n display: inline-flex;\r\n\r\n &:hover {\r\n cursor: pointer;\r\n }\r\n}\r\n","import { h, Component, ComponentInterface, Event, Prop, EventEmitter, Element, State, Fragment } from \"@stencil/core\";\r\nimport { v4 } from \"uuid\";\r\nimport { SlideToggleActiveEvent } from \"./slide-toggle.interfaces\";\r\n\r\n@Component({\r\n tag: \"dso-slide-toggle\",\r\n styleUrl: \"slide-toggle.scss\",\r\n scoped: true,\r\n shadow: false,\r\n})\r\nexport class SlideToggle implements ComponentInterface {\r\n @Element()\r\n private host!: HTMLDsoSlideToggleElement;\r\n\r\n /*\r\n Set to true if Slide Toggle is checked.\r\n /\r\n @Prop()\r\n checked = false;\r\n\r\n /\r\n Disables the Slide Toggle, preventing it from checking/unchecking and therefor not emitting any events.\r\n /\r\n @Prop()\r\n disabled = false;\r\n\r\n /\r\n When provided the `<button>` will be labelled with `aria-label`. For a visible label provide a `<span>` inside the component.\r\n /\r\n @Prop()\r\n accessibleLabel?: string;\r\n\r\n /\r\n Provide the `id` of the element that labels this element. this property sets the `aria-labelledby` on the switch button.\r\n /\r\n @Prop()\r\n labelledbyId?: string;\r\n\r\n @State()\r\n hasVisibleLabel?: boolean;\r\n\r\n /\r\n Provide an `id` for the `<button>`. Useful for placing your to place your own `<label for=\"id\">`.\r\n /\r\n @Prop()\r\n identifier = v4();\r\n\r\n /\r\n Emitted when user checks or unchecks the Slide Toggle.\r\n /\r\n @Event({ composed: false })\r\n dsoActiveChange!: EventEmitter<SlideToggleActiveEvent>;\r\n\r\n private handleSwitch(e: Event): void {\r\n this.dsoActiveChange.emit({\r\n originalEvent: e,\r\n checked: !this.checked,\r\n });\r\n }\r\n\r\n componentWillLoad(): void {\r\n this.hasVisibleLabel = this.host.querySelector(\"\") !== null;\r\n }\r\n\r\n render() {\r\n return (\r\n <>\r\n <button\r\n id={this.identifier}\r\n role=\"switch\"\r\n class=\"dso-slider\"\r\n aria-checked={\"\" + this.checked}\r\n disabled={this.disabled}\r\n onClick={(e) => this.handleSwitch(e)}\r\n {...(this.accessibleLabel ? { \"aria-label\": this.accessibleLabel } : {})}\r\n {...(this.labelledbyId ? { \"aria-labelledby\": this.labelledbyId } : {})}\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"20\" viewBox=\"0 0 40 20\">\r\n <g fill=\"none\" fill-rule=\"evenodd\">\r\n <rect width=\"40\" height=\"20\" fill=\"currentColor\" rx=\"10\" />\r\n <circle cy=\"10\" r=\"8\" fill=\"currentColor\" />\r\n </g>\r\n </svg>\r\n </button>\r\n {this.hasVisibleLabel && (\r\n <label htmlFor={this.identifier}>\r\n <slot />\r\n </label>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"dso-label.dso-renvooi.dso-slide-toggle.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,QAAQ,GAAG,44DAA44D,CAAC;AAC95D,uBAAe,QAAQ;;ACiBvB,MAAM,cAAc,GAAG,IAAI,cAAc,CACvCA,cAAQ,CAAC,CAAC,OAA8B;IACtC,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,MAAM,EAAE;QACzB,IAAI,mBAAmB,CAAC,MAAM,CAAC,EAAE;YAC/B,MAAM,CAAC,cAAc,EAAE,CAAC;SACzB;KACF,CAAC,CAAC;AACL,CAAC,EAAE,GAAG,CAAC,CACR,CAAC;AAEF,SAAS,mBAAmB,CAAC,OAAgB;IAC3C,OAAO,OAAO,CAAC,OAAO,KAAK,WAAW,CAAC;AACzC,CAAC;AAED,SAAS,WAAW,CAAC,EAAe;IAClC,OAAO,EAAE,CAAC,WAAW,GAAG,EAAE,CAAC,WAAW,CAAC;AACzC,CAAC;MAOY,KAAK;IALlB;;;QAwDE,gBAAW,GAAG,KAAK,CAAC;QAGpB,cAAS,GAAG,EAAE,CAAC;KAiJhB;IA9IC,cAAc,CAAC,SAAkB;QAC/B,IAAI,SAAS,EAAE;YACb,IAAI,CAAC,qBAAqB,EAAE,CAAC;SAC9B;aAAM;YACL,IAAI,CAAC,oBAAoB,EAAE,CAAC;SAC7B;KACF;IAGD,aAAa,CAAC,QAAiB;QAC7B,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,aAAa,EAAE,CAAC;SACtB;aAAM;YACL,IAAI,CAAC,YAAY,EAAE,CAAC;SACrB;KACF;IAGD,eAAe,CAAC,KAAoB;QAClC,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;YAC1B,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;SACxB;KACF;;;;IAMD,MAAM,cAAc;QAClB,UAAU,CAAC;YACT,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,IAAI,CAAC,YAAY,IAAI,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;SAC1E,CAAC,CAAC;KACJ;IAEO,aAAa;;QACnB,IAAI,CAAC,SAAS,GAAG,MAAA,MAAA,IAAI,CAAC,IAAI,CAAC,WAAW,0CAAE,IAAI,EAAE,mCAAI,EAAE,CAAC;KACtD;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,aAAa,EAAE,CAAC;SACtB;QAED,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,CAAC,qBAAqB,EAAE,CAAC;SAC9B;KACF;IAED,oBAAoB;QAClB,IAAI,CAAC,YAAY,EAAE,CAAC;QAEpB,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC;KACjC;;IAGO,qBAAqB;QAC3B,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,MAAM,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;QAEzE,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE;YACvC,aAAa,EAAE,IAAI;YACnB,SAAS,EAAE,IAAI;YACf,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CAAC;QAEH,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAEO,oBAAoB,CAAC,KAAK,GAAG,KAAK;;QACxC,IAAI,KAAK,IAAI,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,SAAS,CAAC,EAAE;YAC/C,MAAA,IAAI,CAAC,gBAAgB,0CAAE,UAAU,EAAE,CAAC;YAEpC,OAAO,IAAI,CAAC,gBAAgB,CAAC;SAC9B;KACF;IAEO,aAAa;QACnB,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAClC,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC7B,IAAI,CAAC,cAAc,EAAE,CAAC;KACvB;IAEO,YAAY;QAClB,cAAc,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACpC,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;KAC1B;IAED,MAAM;QACJ,QACEC,UAACC,gBAAQ,uDACPD,yFACmB,eAAe,EAChC,KAAK,EAAEE,SAAI,CAAC,WAAW,EAAE;gBACvB,CAAC,aAAa,IAAI,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM;gBACzC,aAAa,EAAE,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS;gBAC9C,WAAW,EAAE,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW;aAClD,CAAC,IAEFF,qEAAM,IAAI,EAAC,QAAQ,GAAQ,EAC3BA,qEACE,KAAK,EAAEE,SAAI,CAAC,mBAAmB,EAAE;gBAC/B,cAAc,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ;aAChC,CAAC,EACF,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,EAC/C,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,SAAS,EAC3D,YAAY,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EAC3C,YAAY,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,EAC5C,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EACtC,MAAM,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,IAEtCF,sEAAa,CACR,EACN,IAAI,CAAC,SAAS,KACbA,uEACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,EAC3C,YAAY,EAAE,OAAO,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,EAC7C,YAAY,EAAE,OAAO,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,EAC9C,OAAO,EAAE,OAAO,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,EACxC,MAAM,EAAE,OAAO,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,IAExCA,qEAAM,KAAK,EAAC,SAAS,mBAAa,IAAI,CAAC,SAAS,CAAQ,EACxDA,yEAAU,IAAI,EAAC,OAAO,GAAY,CAC3B,CACV,CACI,EACN,IAAI,CAAC,WAAW,KACfA,4EACE,SAAS,QACT,EAAE,EAAC,eAAe,EAClB,MAAM,EAAE,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,EACxC,QAAQ,EAAC,KAAK,EACd,QAAQ,EAAC,UAAU,IAElB,IAAI,CAAC,SAAS,CACH,CACf,CACQ,EACX;KACH;;;;;;;;;AC/OH,MAAM,UAAU,GAAG,4zDAA4zD,CAAC;AACh1D,yBAAe,UAAU;;ACOzB,MAAM,aAAa,GAA4C,CAAC,EAAE,KAAK,EAAE;IACvE,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,KAAK,EAAE;;QAEvC,OAAOA,oBAAM,KAAK,EAAC,MAAM,IAAE,KAAK,CAAQ,CAAC;KAC1C;IAED,IAAI,YAAY,IAAI,KAAK,EAAE;QACzB,OAAOA,uBAAM,KAAK,CAAC,UAAU,CAAO,CAAC;KACtC;IAED,IAAI,YAAY,IAAI,KAAK,EAAE;QACzB,OAAOA,uBAAM,KAAK,CAAC,UAAU,CAAO,CAAC;KACtC;IAED,QACEA,kCACEA,uBAAM,KAAK,CAAC,GAAG,CAAO,EACtBA,uBAAM,KAAK,CAAC,KAAK,CAAO,CACvB,EACH;AACJ,CAAC,CAAC;MAUW,OAAO;;;;IAOlB,IAAI,MAAM;QACR,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,OAAO,EAAE,CAAC;SACX;QAED,OAAO,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KAC9D;IAED,MAAM;QACJ,QACEA,kCACG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,MACjBA,UAAC,aAAa,IAAC,KAAK,EAAE,CAAC,GAAI,CAC5B,CAAC,CACD,EACH;KACH;;;;AC7DH,MAAM,cAAc,GAAG,g3CAAg3C,CAAC;AACx4C,6BAAe,cAAc;;MCShB,WAAW;IANxB;;;;;;QAcE,YAAO,GAAG,KAAK,CAAC;;;;QAMhB,aAAQ,GAAG,KAAK,CAAC;;;;QAqBjB,eAAU,GAAGG,KAAE,EAAE,CAAC;KA+CnB;IAvCS,YAAY,CAAC,CAAQ;QAC3B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;YACxB,aAAa,EAAE,CAAC;YAChB,OAAO,EAAE,CAAC,IAAI,CAAC,OAAO;SACvB,CAAC,CAAC;KACJ;IAED,iBAAiB;QACf,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC;KAC9D;IAED,MAAM;QACJ,QACEH,kCACEA,qFACE,EAAE,EAAE,IAAI,CAAC,UAAU,EACnB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,YAAY,kBACJ,EAAE,GAAG,IAAI,CAAC,OAAO,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,KAC/B,IAAI,CAAC,eAAe,GAAG,EAAE,YAAY,EAAE,IAAI,CAAC,eAAe,EAAE,GAAG,EAAE,IAClE,IAAI,CAAC,YAAY,GAAG,EAAE,iBAAiB,EAAE,IAAI,CAAC,YAAY,EAAE,GAAG,EAAE,IAEtEA,oEAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,IAChFA,kEAAG,IAAI,EAAC,MAAM,eAAW,SAAS,IAChCA,qEAAM,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,cAAc,EAAC,EAAE,EAAC,IAAI,GAAG,EAC3DA,uEAAQ,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,GAAG,EAAC,IAAI,EAAC,cAAc,GAAG,CAC1C,CACA,CACC,EACR,IAAI,CAAC,eAAe,KACnBA,sEAAO,OAAO,EAAE,IAAI,CAAC,UAAU,IAC7BA,sEAAQ,CACF,CACT,CACA,EACH;KACH;;;;;;;;;","names":["debounce","h","Fragment","clsx","v4"],"sources":["src/components/label/label.scss?tag=dso-label&encapsulation=shadow","src/components/label/label.tsx","src/components/renvooi/renvooi.scss?tag=dso-renvooi&encapsulation=shadow","src/components/renvooi/renvooi.tsx","src/components/slide-toggle/slide-toggle.scss?tag=dso-slide-toggle&encapsulation=scoped","src/components/slide-toggle/slide-toggle.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/label\";\r\n\r\n:host {\r\n display: inline-block;\r\n max-inline-size: 100%;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n// Todo: Replace .sr-only selector with web component specific selector, no need for .sr-only if we can generate the SCSS\r\n.sr-only {\r\n @include utilities.sr-only();\r\n}\r\n\r\n.dso-label {\r\n @include label.root();\r\n\r\n &.dso-hover {\r\n .dso-label-content {\r\n text-decoration: line-through;\r\n }\r\n }\r\n}\r\n\r\n.dso-truncate.dso-label-content {\r\n display: inline-block;\r\n max-inline-size: 100%;\r\n overflow: hidden;\r\n text-overflow: ellipsis; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n vertical-align: bottom;\r\n white-space: nowrap; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n}\r\n\r\n:host([removable]) {\r\n .dso-truncate.dso-label-content {\r\n max-inline-size: calc(100% - (units.$u3 + 4px));\r\n }\r\n}\r\n","import {\r\n h,\r\n Component,\r\n ComponentInterface,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n Fragment,\r\n Method,\r\n Prop,\r\n State,\r\n Watch,\r\n Listen,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\nimport debounce from \"debounce\";\r\nimport { LabelStatus } from \"./label.interfaces\";\r\n\r\nconst resizeObserver = new ResizeObserver(\r\n debounce((entries: ResizeObserverEntry[]) => {\r\n entries.forEach(({ target }) => {\r\n if (isDsoLabelComponent(target)) {\r\n target._truncateLabel();\r\n }\r\n });\r\n }, 150),\r\n);\r\n\r\nfunction isDsoLabelComponent(element: Element): element is HTMLDsoLabelElement {\r\n return element.tagName === \"DSO-LABEL\";\r\n}\r\n\r\nfunction hasEllipses(el: HTMLElement): boolean {\r\n return el.scrollWidth > el.clientWidth;\r\n}\r\n\r\n@Component({\r\n tag: \"dso-label\",\r\n styleUrl: \"label.scss\",\r\n shadow: true,\r\n})\r\nexport class Label implements ComponentInterface {\r\n private labelContent: HTMLSpanElement \| undefined;\r\n\r\n private mutationObserver?: MutationObserver;\r\n\r\n @Element()\r\n private host!: HTMLDsoLabelElement;\r\n\r\n /*\r\n For compact Label\r\n /\r\n @Prop()\r\n compact?: boolean;\r\n\r\n /\r\n Shows a button that can be used to remove the Label.\r\n /\r\n @Prop({ reflect: true })\r\n removable?: boolean;\r\n\r\n /\r\n The status of this Label.\r\n /\r\n @Prop()\r\n status?: LabelStatus;\r\n\r\n /\r\n Emitted when the user activates the remove button.\r\n /\r\n @Event()\r\n dsoRemoveClick!: EventEmitter<MouseEvent>;\r\n\r\n @State()\r\n removeHover?: boolean;\r\n\r\n @State()\r\n removeFocus?: boolean;\r\n\r\n /\r\n Whether the Label is allowed to truncate the contents if it does not fit the container element.\r\n /\r\n @Prop()\r\n truncate?: boolean;\r\n\r\n @State()\r\n textHover?: boolean;\r\n\r\n @State()\r\n textFocus?: boolean;\r\n\r\n @State()\r\n isTruncated = false;\r\n\r\n @State()\r\n labelText = \"\";\r\n\r\n @Watch(\"removable\")\r\n watchRemovable(removable: boolean) {\r\n if (removable) {\r\n this.startMutationObserver();\r\n } else {\r\n this.stopMutationObserver();\r\n }\r\n }\r\n\r\n @Watch(\"truncate\")\r\n watchTruncate(truncate: boolean) {\r\n if (truncate) {\r\n this.startTruncate();\r\n } else {\r\n this.stopTruncate();\r\n }\r\n }\r\n\r\n @Listen(\"keydown\", { target: \"document\" })\r\n keyDownListener(event: KeyboardEvent) {\r\n if (event.key === \"Escape\") {\r\n this.textHover = false;\r\n this.textFocus = false;\r\n }\r\n }\r\n\r\n /\r\n @internal\r\n /\r\n @Method()\r\n async _truncateLabel() {\r\n setTimeout(() => {\r\n this.isTruncated = !!this.labelContent && hasEllipses(this.labelContent);\r\n });\r\n }\r\n\r\n private syncLabelText() {\r\n this.labelText = this.host.textContent?.trim() ?? \"\";\r\n }\r\n\r\n componentDidLoad() {\r\n if (this.truncate) {\r\n this.startTruncate();\r\n }\r\n\r\n if (this.removable) {\r\n this.startMutationObserver();\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n this.stopTruncate();\r\n\r\n this.stopMutationObserver(true);\r\n }\r\n\r\n /* The mutationObserver fetches the text placed inside the label, this is then used for the remove button and tooltip. /\r\n private startMutationObserver(): void {\r\n this.mutationObserver = new MutationObserver(() => this.syncLabelText());\r\n\r\n this.mutationObserver.observe(this.host, {\r\n characterData: true,\r\n childList: true,\r\n subtree: true,\r\n attributes: true,\r\n });\r\n\r\n this.syncLabelText();\r\n }\r\n\r\n private stopMutationObserver(force = false): void {\r\n if (force \|\| !(this.truncate && this.removable)) {\r\n this.mutationObserver?.disconnect();\r\n\r\n delete this.mutationObserver;\r\n }\r\n }\r\n\r\n private startTruncate(): void {\r\n resizeObserver.observe(this.host);\r\n this.startMutationObserver();\r\n this._truncateLabel();\r\n }\r\n\r\n private stopTruncate(): void {\r\n resizeObserver.unobserve(this.host);\r\n this.stopMutationObserver();\r\n this.isTruncated = false;\r\n }\r\n\r\n render() {\r\n return (\r\n <Fragment>\r\n <span\r\n aria-describedby=\"toggle-anchor\"\r\n class={clsx(\"dso-label\", {\r\n [`dso-label-${this.status}`]: this.status,\r\n \"dso-compact\": this.compact && !this.removable,\r\n \"dso-hover\": this.removeHover \|\| this.removeFocus,\r\n })}\r\n >\r\n <slot name=\"symbol\"></slot>\r\n <span\r\n class={clsx(\"dso-label-content\", {\r\n \"dso-truncate\": !!this.truncate,\r\n })}\r\n ref={(element) => (this.labelContent = element)}\r\n tabindex={this.truncate && this.isTruncated ? 0 : undefined}\r\n onMouseEnter={() => (this.textHover = true)}\r\n onMouseLeave={() => (this.textHover = false)}\r\n onFocus={() => (this.textFocus = true)}\r\n onBlur={() => (this.textFocus = false)}\r\n >\r\n <slot></slot>\r\n </span>\r\n {this.removable && (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => this.dsoRemoveClick.emit(e)}\r\n onMouseEnter={() => (this.removeHover = true)}\r\n onMouseLeave={() => (this.removeHover = false)}\r\n onFocus={() => (this.removeFocus = true)}\r\n onBlur={() => (this.removeFocus = false)}\r\n >\r\n <span class=\"sr-only\">Verwijder: {this.labelText}</span>\r\n <dso-icon icon=\"times\"></dso-icon>\r\n </button>\r\n )}\r\n </span>\r\n {this.isTruncated && (\r\n <dso-tooltip\r\n stateless\r\n id=\"toggle-anchor\"\r\n active={this.textHover \|\| this.textFocus}\r\n position=\"top\"\r\n strategy=\"absolute\"\r\n >\r\n {this.labelText}\r\n </dso-tooltip>\r\n )}\r\n </Fragment>\r\n );\r\n }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n@use \"~dso-toolkit/src/components/insert/insert\";\r\n@use \"~dso-toolkit/src/components/delete/delete\";\r\n\r\n:host {\r\n display: inline;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.text {\r\n text-decoration: var(--_dso-renvooi-text-decoration);\r\n}\r\n","import { Component, ComponentInterface, Fragment, FunctionalComponent, Prop, h } from \"@stencil/core\";\r\n\r\nimport { RenvooiValue } from \"./renvooi.interfaces\";\r\n\r\ninterface RenvooiRenderProps {\r\n value: RenvooiValue;\r\n}\r\n\r\nconst RenvooiRender: FunctionalComponent<RenvooiRenderProps> = ({ value }) => {\r\n if (typeof value === \"string\" \|\| !value) {\r\n // This element is used for --_dso-renvooi-text-decoration\r\n return <span class=\"text\">{value}</span>;\r\n }\r\n\r\n if (\"toegevoegd\" in value) {\r\n return <ins>{value.toegevoegd}</ins>;\r\n }\r\n\r\n if (\"verwijderd\" in value) {\r\n return <del>{value.verwijderd}</del>;\r\n }\r\n\r\n return (\r\n <>\r\n <del>{value.was}</del>\r\n <ins>{value.wordt}</ins>\r\n </>\r\n );\r\n};\r\n\r\n/\r\n Met dit component kan een `RenvooiValue` worden gepresenteerd.\r\n /\r\n@Component({\r\n tag: \"dso-renvooi\",\r\n styleUrl: \"renvooi.scss\",\r\n shadow: true,\r\n})\r\nexport class Renvooi implements ComponentInterface {\r\n /\r\n The renvooi value to render.\r\n /\r\n @Prop()\r\n value?: RenvooiValue \| RenvooiValue[];\r\n\r\n get values(): RenvooiValue[] {\r\n if (!this.value) {\r\n return [];\r\n }\r\n\r\n return Array.isArray(this.value) ? this.value : [this.value];\r\n }\r\n\r\n render() {\r\n return (\r\n <>\r\n {this.values.map((v) => (\r\n <RenvooiRender value={v} />\r\n ))}\r\n </>\r\n );\r\n }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n\r\n$slide-toggle-height: 20px;\r\n\r\n:host {\r\n display: inline-block;\r\n padding-block-start: (typography.$line-height-base typography.$font-size-base - $slide-toggle-height) * 0.5;\r\n}\r\n\r\nbutton.dso-slider {\r\n border: 0;\r\n padding: 0;\r\n\r\n &:focus-visible {\r\n outline: 2px solid colors.$grijs-80;\r\n outline-offset: 1px;\r\n }\r\n\r\n svg {\r\n rect {\r\n fill: colors.$grijs-40;\r\n transition: fill 0.25s;\r\n }\r\n\r\n circle {\r\n @include utilities.transition(transform);\r\n\r\n transform: translateX(10px);\r\n fill: colors.$wit;\r\n }\r\n }\r\n\r\n &[aria-checked=\"true\"] svg {\r\n rect {\r\n fill: colors.$bosgroen;\r\n }\r\n\r\n circle {\r\n transform: translateX(30px);\r\n fill: colors.$wit;\r\n }\r\n }\r\n\r\n &[disabled] svg {\r\n rect {\r\n fill: colors.$grijs-20;\r\n }\r\n\r\n circle {\r\n fill: colors.$grijs-10;\r\n }\r\n }\r\n\r\n &[disabled][aria-checked=\"true\"] svg {\r\n rect {\r\n fill: colors.$bosgroen-40;\r\n }\r\n\r\n circle {\r\n fill: colors.$grijs-10;\r\n }\r\n }\r\n}\r\n\r\n.dso-slider {\r\n border-radius: units.$u3;\r\n display: inline-flex;\r\n\r\n &:hover {\r\n cursor: pointer;\r\n }\r\n}\r\n","import { h, Component, ComponentInterface, Event, Prop, EventEmitter, Element, State, Fragment } from \"@stencil/core\";\r\nimport { v4 } from \"uuid\";\r\nimport { SlideToggleActiveEvent } from \"./slide-toggle.interfaces\";\r\n\r\n@Component({\r\n tag: \"dso-slide-toggle\",\r\n styleUrl: \"slide-toggle.scss\",\r\n scoped: true,\r\n shadow: false,\r\n})\r\nexport class SlideToggle implements ComponentInterface {\r\n @Element()\r\n private host!: HTMLDsoSlideToggleElement;\r\n\r\n /*\r\n Set to true if Slide Toggle is checked.\r\n /\r\n @Prop()\r\n checked = false;\r\n\r\n /\r\n Disables the Slide Toggle, preventing it from checking/unchecking and therefor not emitting any events.\r\n /\r\n @Prop()\r\n disabled = false;\r\n\r\n /\r\n When provided the `<button>` will be labelled with `aria-label`. For a visible label provide a `<span>` inside the component.\r\n /\r\n @Prop()\r\n accessibleLabel?: string;\r\n\r\n /\r\n Provide the `id` of the element that labels this element. this property sets the `aria-labelledby` on the switch button.\r\n /\r\n @Prop()\r\n labelledbyId?: string;\r\n\r\n @State()\r\n hasVisibleLabel?: boolean;\r\n\r\n /\r\n Provide an `id` for the `<button>`. Useful for placing your to place your own `<label for=\"id\">`.\r\n /\r\n @Prop()\r\n identifier = v4();\r\n\r\n /\r\n Emitted when user checks or unchecks the Slide Toggle.\r\n /\r\n @Event({ composed: false })\r\n dsoActiveChange!: EventEmitter<SlideToggleActiveEvent>;\r\n\r\n private handleSwitch(e: Event): void {\r\n this.dsoActiveChange.emit({\r\n originalEvent: e,\r\n checked: !this.checked,\r\n });\r\n }\r\n\r\n componentWillLoad(): void {\r\n this.hasVisibleLabel = this.host.querySelector(\"\") !== null;\r\n }\r\n\r\n render() {\r\n return (\r\n <>\r\n <button\r\n id={this.identifier}\r\n role=\"switch\"\r\n class=\"dso-slider\"\r\n aria-checked={\"\" + this.checked}\r\n disabled={this.disabled}\r\n onClick={(e) => this.handleSwitch(e)}\r\n {...(this.accessibleLabel ? { \"aria-label\": this.accessibleLabel } : {})}\r\n {...(this.labelledbyId ? { \"aria-labelledby\": this.labelledbyId } : {})}\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"20\" viewBox=\"0 0 40 20\">\r\n <g fill=\"none\" fill-rule=\"evenodd\">\r\n <rect width=\"40\" height=\"20\" fill=\"currentColor\" rx=\"10\" />\r\n <circle cy=\"10\" r=\"8\" fill=\"currentColor\" />\r\n </g>\r\n </svg>\r\n </button>\r\n {this.hasVisibleLabel && (\r\n <label htmlFor={this.identifier}>\r\n <slot />\r\n </label>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/cjs/dso-responsive-element.cjs.entry.js CHANGED Viewed

@@ -50,7 +50,7 @@ const ResponsiveElement = class {
         this.observer.unobserve(this.host);
     }
     render() {
-        return (index.h(index.Host, { key: 'd32256cbdc6e91c45a8954bd96ccad52fa8ba60f', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, index.h("slot", { key: 'ffd1712484de38388bdcc3574d9d622f2da1551f' })));
+        return (index.h(index.Host, { key: '7df8a0107dec10534a1ee68c12b0718675ca37d0', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, index.h("slot", { key: '376cdb5c8b4b349877b7289b9bb5b0ae597620b6' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-scrollable.cjs.entry.js CHANGED Viewed

@@ -91,9 +91,9 @@ const Scrollable = class {
         this.slottedElements.forEach((element) => resizeObserver.unobserve(element));
     }
     render() {
-        return (index$1.h("div", { key: '19729bf5d07605399a88e70ad5f2884dfdf62bcc', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, index$1.h("div", { key: '7e88b52be9640ae17bc70d9f4707019f1b8015ad', ref: (el) => (this.scrollContainerDiv = el), class: clsx.clsx("dso-scroll-container", {
+        return (index$1.h("div", { key: 'ff6794620912d49f124f4bac4222fd278dbd6b29', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, index$1.h("div", { key: '532d8178bd3755a10e3d3adbe582c8dfa894347a', ref: (el) => (this.scrollContainerDiv = el), class: clsx.clsx("dso-scroll-container", {
                 [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== "noScroll",
-            }), onScroll: () => this._setScrollState() }, index$1.h("slot", { key: 'e1726cb368fc7d316ccac1913baaceff1e8ee50f' }))));
+            }), onScroll: () => this._setScrollState() }, index$1.h("slot", { key: 'ae425415162ffd8d13adae1e42c9e4728106d5d5' }))));
     }
     get host() { return index$1.getElement(this); }
 };

package/dist/cjs/dso-skiplink.cjs.entry.js CHANGED Viewed

@@ -20,7 +20,7 @@ const Skiplink = class {
         return this.dsoSkiplinkClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent.isModifiedEvent(e) });
     }
     render() {
-        return (index.h("a", { key: 'c4f0355b8a63e27a60e10694ace01f2f14b25768', href: `#${this.to}`, onClick: (e) => this.clickEventHandler(e) }, this.label, index.h("dso-icon", { key: '5e4772a2100670675a21a00dd9b1db09209c051e', icon: "chevron-right" })));
+        return (index.h("a", { key: '40c3c6d5b541f6c69b3dd1e13ab6120a13e89f08', href: `#${this.to}`, onClick: (e) => this.clickEventHandler(e) }, this.label, index.h("dso-icon", { key: 'fceb144a8534dfd1f53f3c63a50e723800086c9d', icon: "chevron-right" })));
     }
 };
 Skiplink.style = DsoSkiplinkStyle0;

package/dist/cjs/dso-survey-rating.cjs.entry.js CHANGED Viewed

@@ -31,10 +31,10 @@ const SurveyRating = class {
             "Makkelijk",
             "Heel makkelijk",
         ];
-        return (index.h("dso-panel", { key: 'ee2d66c3664442953dfa287dbb234f1c2b24973d', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }) }, index.h("h2", { key: '1762bf6ae0ce6c7603bdcf6986e233f71e7a48f1', slot: "heading" }, "Help ons met een onderzoek"), index.h("strong", { key: 'b0a318ab699be1e36b6044b115becc6682bd0bb3' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren"), index.h("form", { key: '3d66888af1d2d535f4723346029f9edbc03102a3', onSubmit: (e) => this.handleForm(e) }, index.h("div", { key: '66ed1a08b68aaa791ba1772bf2cf81f305745829', class: "visual-rating-labels", "aria-hidden": "true" }, index.h("span", { key: 'a0edb09da125715b09186138db492a516ecbe6ea' }, "Heel moeilijk"), index.h("span", { key: 'e0d3b6c28a88a4edeca0689cb5b8c62bf074ac48' }, "Heel makkelijk")), index.h("div", { key: '2730d1b4941f078c506bbda76af4843157abc22c', role: "radiogroup" }, ratings.map((rating, index$1) => {
+        return (index.h("dso-panel", { key: '0cf488d4cae02ff7c37d6f6953ad32d6c19c7011', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }) }, index.h("h2", { key: '8b36e4dbf8c9017cfec97283b0c4bb11dc2ba60a', slot: "heading" }, "Help ons met een onderzoek"), index.h("strong", { key: '3f819218453cd2e500c7e03856754c5afbf16001' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren"), index.h("form", { key: 'a9b6ccfbccddcb07b94c3889cee0447f1d09118e', onSubmit: (e) => this.handleForm(e) }, index.h("div", { key: 'a321b5ff7c0e021ed8e3264ae7aa2f78781b674d', class: "visual-rating-labels", "aria-hidden": "true" }, index.h("span", { key: 'dc908a71b2fc40d017e55f7995924731caf9d1c8' }, "Heel moeilijk"), index.h("span", { key: '8affdcc507818d6f6a8792285aa1f59d75e8b16a' }, "Heel makkelijk")), index.h("div", { key: '616c3feb3eabdb93c949f1a5166d08300b8c370b', role: "radiogroup" }, ratings.map((rating, index$1) => {
             const ratingNumber = index$1 + 1;
             return (index.h(index.Fragment, null, index.h("label", { class: `survey-rating-${ratingNumber}` }, ratingNumber, index.h("span", { class: "sr-only" }, rating), index.h("input", { type: "radio", name: "rating", value: ratingNumber, checked: ratingNumber === this.rating, onChange: (e) => this.handleChange(e) }))));
-        })), index.h("button", { key: '4b5a9454231d24e64cc4e09385b2161262982de7', type: "submit", class: "dso-secondary" }, index.h("span", { key: '6d6e9f53abec5e1522e5a8b04eea8793c354f101' }, "Antwoord verzenden")))));
+        })), index.h("button", { key: '733c311a66455f627ec1921bb61e7bab92b53c23', type: "submit", class: "dso-secondary" }, index.h("span", { key: '461c2e464c7bd2d005d2511a62bafa1099412e6d' }, "Antwoord verzenden")))));
     }
 };
 SurveyRating.style = DsoSurveyRatingStyle0;

package/dist/cjs/dso-tabs.cjs.entry.js CHANGED Viewed

@@ -69,7 +69,7 @@ const Tabs = class {
         (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     render() {
-        return (index.h(index.Host, { key: 'eda4f3cabd4f4a373ebf5e5b2fce9c5a336f4680' }, index.h("div", { key: '445a0b6a745a1f45eca44ca59def6f4557904748', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, index.h("slot", { key: 'd344d2c68cc0bd6d0abbea591a7ffa22b17dbdf7' })), index.h("div", { key: 'c17a1774b3cf81c30e07c0c8446f05d8a6e86b95', role: "tabpanel", tabindex: "0" }, index.h("slot", { key: 'c32d940c2e5fe01b67919d7253bb5d2666146f6f', name: "panel" }))));
+        return (index.h(index.Host, { key: '349c801fdadbfd077ca6cc68f5d1f48dea0d4ff4' }, index.h("div", { key: '1413312c78b126135b10295690aa957d99304acf', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, index.h("slot", { key: '3b4cbf35c3d29ba1f6158853d755335dd8a05b5e' })), index.h("div", { key: '95e97aa712722fc019bbf1578dfb1c6224ecebb5', role: "tabpanel", tabindex: "0" }, index.h("slot", { key: '305195dcc64770963bb740d64c5cc0d08f0c16bc', name: "panel" }))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-toggletip.cjs.entry.js CHANGED Viewed

@@ -53,7 +53,7 @@ const Toggletip = class {
         };
     }
     render() {
-        return (index.h(index.Fragment, null, index.h("dso-info-button", { key: 'c6b7ee824a9ad3417f394467177fa3b07a59a710', "aria-describedby": "toggle", onClick: this.click, label: this.label, active: this.active, secondary: this.secondary, ref: (element) => (this.infoButton = element) }), index.h("dso-tooltip", { key: 'a82167f713fc51dbafcad6758527ce7c36e28552', stateless: true, descriptive: true, id: "toggle", strategy: "absolute", active: this.active, position: this.position, small: this.small }, index.h("slot", { key: '5f4548c244f97b6278b7642bb927d3133dab872c' }))));
+        return (index.h(index.Fragment, null, index.h("dso-info-button", { key: '5ade4ddc0b1b9dd981b064491444585f78ff6341', "aria-describedby": "toggle", onClick: this.click, label: this.label, active: this.active, secondary: this.secondary, ref: (element) => (this.infoButton = element) }), index.h("dso-tooltip", { key: 'cce7b117c2cb73355311768297789ec2e6bdd08a', stateless: true, descriptive: true, id: "toggle", strategy: "absolute", active: this.active, position: this.position, small: this.small }, index.h("slot", { key: 'b1ea6bb7d7e7fd862fb3d628649f79cf18b79a9d' }))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/dso-tooltip.cjs.entry.js CHANGED Viewed

@@ -230,7 +230,7 @@ const Tooltip = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '0dae667b622fac9d6e45eead0e5ffd0b3c4fc64a', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, index.h("div", { key: '8b80667d0734bfd9ea91f698ddf31493f7c27e49', class: clsx.clsx("tooltip", { in: this.active }) }, !this.noArrow && index.h("div", { key: '7124f75b7ba640b0a5e63a15917eddf0ade65853', "data-popper-arrow": true, class: "tooltip-arrow" }), index.h("div", { key: '962322da0404132b4b4ef4046ca70b1b25d11f1f', "aria-hidden": !this.descriptive || undefined, class: clsx.clsx("tooltip-inner", { "dso-small": this.small }) }, index.h("slot", { key: '1fec252ad2f238dc8b8969bc4aa2d237b5aae943' })))));
+        return (index.h(index.Host, { key: '937cf3e393747c90908dd40d9f1cd4004972ee14', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, index.h("div", { key: 'ec8d45dfe98721323a129f885c17458c2fce1755', class: clsx.clsx("tooltip", { in: this.active }) }, !this.noArrow && index.h("div", { key: 'f41fcdefbcbfbfa6898ae0ac380f40bac2d20fef', "data-popper-arrow": true, class: "tooltip-arrow" }), index.h("div", { key: '9dc5919c76eb4bae36267cb884a8e07ea9b795b8', "aria-hidden": !this.descriptive || undefined, class: clsx.clsx("tooltip-inner", { "dso-small": this.small }) }, index.h("slot", { key: '3c999ec1a312662dbd287486eb54114638499db9' })))));
     }
     activatePopper() {
         var _a;

package/dist/cjs/dso-tree-view.cjs.entry.js CHANGED Viewed

@@ -198,7 +198,7 @@ const TreeView = class {
     }
     render() {
         var _a;
-        return (index.h("div", { key: 'f6f6832d0613dcb1eb30f1170cc848e5dd5a47f3', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, index.h("ul", { key: 'aaea2cfc733ff714e907758e41ea31fa2f460b68', role: "tree", "aria-label": "Objectenboom" }, (_a = this.collection) === null || _a === void 0 ? void 0 : _a.map((item, index$1) => (index.h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index$1, level: 1, setSize: this.collection.length }))))));
+        return (index.h("div", { key: 'fda90d8a03ae58672b99f314ec5f97c1ac9dab19', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, index.h("ul", { key: '02c4d4665e8d3fdb2618e6e730ad899776149501', role: "tree", "aria-label": "Objectenboom" }, (_a = this.collection) === null || _a === void 0 ? void 0 : _a.map((item, index$1) => (index.h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index$1, level: 1, setSize: this.collection.length }))))));
     }
 };
 TreeView.style = DsoTreeViewStyle0;

package/dist/cjs/dso-viewer-grid.cjs.entry.js CHANGED Viewed

@@ -303,8 +303,8 @@ const ViewerGrid = class {
     }
     render() {
         const tabLabels = this.mode === "vdk" ? viewerGridVdkTabs : viewerGridVrkTabs;
-        return (index.h(index.Fragment, null, this.tabView && (index.h("nav", { key: 'd8a89e6fd85a9ec4adea0b52670c1cba714350ef', class: "dso-navbar" }, index.h("ul", { key: '34b3436df21fd14c6403b33b0b728415c7ee2c3f', class: "dso-nav dso-nav-sub" }, tabLabels.map((tab) => (index.h("li", { key: tab, class: clsx.clsx({ "dso-active": this.activeTab === tab }) }, index.h("button", { type: "button", class: "dso-tertiary", onClick: () => this.switchActiveTab(tab) }, viewerGridTabLabelMap[tab]))))))), (!this.tabView || (this.tabView && (this.activeTab === "main" || this.activeTab === "search"))) && (index.h(MainPanel, { key: 'a5166e11ec537da288535ef1f78027b6942288bc', mode: this.mode, tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.mainPanelHidden, shrinkMain: this.emitShrinkMain, expandMain: this.emitExpandMain, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd })), (!this.tabView ||
-            (this.tabView && ((this.activeTab === "main" && this.mode === "vrk") || this.activeTab === "search"))) && (index.h(Filterpanel, { key: '994efb6648cd215a4ff8e0fe7fffe16b65a40775', title: this.filterpanelTitle, mode: this.mode, ref: (element) => (this.filterpanel = element), onApply: this.handleFilterpanelApply, onCancel: this.handleFilterpanelCancel, dsoCloseFilterpanel: (e) => this.dsoCloseFilterpanel.emit({ originalEvent: e }) })), (!this.tabView || (this.tabView && this.activeTab === "map")) && (index.h("div", { key: 'b021cfb6be8c3a16453eb9927f6dac93736b0d2b', class: "map", ref: (element) => (this.mapElement = element) }, index.h("slot", { key: '85a6dbcd00d82a8c6eb78e55755bae26aed76076', name: "map" }))), ((!this.tabView && this.documentPanelOpen) || (this.tabView && this.activeTab === "document")) && (index.h(DocumentPanel, { key: '163277775c959cf0f83ed6bf8bd79ff2a81d3806', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), index.h(Overlay, { key: '2577736644258d037e41fef06ec19be4d9db92fa', ref: (element) => (this.overlay = element), dsoCloseOverlay: (e) => this.dsoCloseOverlay.emit({ originalEvent: e }) })));
+        return (index.h(index.Fragment, null, this.tabView && (index.h("nav", { key: '67c2e60734775ecdbf3139555fb6915013b1961e', class: "dso-navbar" }, index.h("ul", { key: '4e50ab7896a2ffdeb8fa9a279e1a2d0182a81499', class: "dso-nav dso-nav-sub" }, tabLabels.map((tab) => (index.h("li", { key: tab, class: clsx.clsx({ "dso-active": this.activeTab === tab }) }, index.h("button", { type: "button", class: "dso-tertiary", onClick: () => this.switchActiveTab(tab) }, viewerGridTabLabelMap[tab]))))))), (!this.tabView || (this.tabView && (this.activeTab === "main" || this.activeTab === "search"))) && (index.h(MainPanel, { key: '2ed0b4973958f49af4878f8b47837204645b6648', mode: this.mode, tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.mainPanelHidden, shrinkMain: this.emitShrinkMain, expandMain: this.emitExpandMain, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd })), (!this.tabView ||
+            (this.tabView && ((this.activeTab === "main" && this.mode === "vrk") || this.activeTab === "search"))) && (index.h(Filterpanel, { key: '24f3be6f1165b6d88b0978c05091636e2fbcedaf', title: this.filterpanelTitle, mode: this.mode, ref: (element) => (this.filterpanel = element), onApply: this.handleFilterpanelApply, onCancel: this.handleFilterpanelCancel, dsoCloseFilterpanel: (e) => this.dsoCloseFilterpanel.emit({ originalEvent: e }) })), (!this.tabView || (this.tabView && this.activeTab === "map")) && (index.h("div", { key: 'b846fb472829718e3e092817f485a9186e4f0c30', class: "map", ref: (element) => (this.mapElement = element) }, index.h("slot", { key: '158e2d376aeb183114e90965ebff21ed71b95184', name: "map" }))), ((!this.tabView && this.documentPanelOpen) || (this.tabView && this.activeTab === "document")) && (index.h(DocumentPanel, { key: '58f4e9ab3208a6d1144877505965ea40ebfe8a75', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), index.h(Overlay, { key: '1d22628a694b5dfc081ccf865eb93f4bab3325b7', ref: (element) => (this.overlay = element), dsoCloseOverlay: (e) => this.dsoCloseOverlay.emit({ originalEvent: e }) })));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/collection/components/annotation/annotation-activiteit/annotation-activiteit.js CHANGED Viewed

@@ -3,6 +3,7 @@ import { AnnotationBody } from "../annotation-body";
 import { AnnotationGewijzigdeLocatie } from "../annotation-gewijzigde-locatie";
 import { watcher } from "../annotation-watcher";
 import { AnnotationSymbolSlot } from "../annotation-symbol-slot";
+import { AnnotationListRenvooiValues } from "../annotation-list-renvooi-values";
 /**
  * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.
  */
@@ -18,7 +19,7 @@ export class AnnotationActiviteit {
     }
     render() {
         const hasSymbool = this.watcher.hasSymbool();
-        return (h(AnnotationBody, { key: 'afe2613ad46948be1043902330c9b18530aeecfc', symbol: hasSymbool ? h(AnnotationSymbolSlot, null) : undefined, active: this.active, dsoActiveChange: this.dsoActiveChange, title: h("dso-renvooi", { value: this.naam }), data: h(Fragment, null, h("span", { class: "content" }, this.regelKwalificatie && (h(Fragment, null, h("dso-renvooi", { value: this.regelKwalificatie }), " ")), this.regelKwalificatieVoorzetsel && `${this.regelKwalificatieVoorzetsel}: `, h("dso-renvooi", { value: this.locatieNoemers })), this.gewijzigdeLocatie && h(AnnotationGewijzigdeLocatie, null)) }));
+        return (h(AnnotationBody, { key: '004c59bc3cf2700fecabc0df774b820de13d9e06', symbol: hasSymbool ? h(AnnotationSymbolSlot, null) : undefined, active: this.active, dsoActiveChange: this.dsoActiveChange, title: h("dso-renvooi", { value: this.naam }), data: h(Fragment, null, h("span", { class: "content" }, this.regelKwalificatie && (h(Fragment, null, h("dso-renvooi", { value: this.regelKwalificatie }), " ")), this.regelKwalificatieVoorzetsel && `${this.regelKwalificatieVoorzetsel}: `, h(AnnotationListRenvooiValues, { values: this.locatieNoemers })), this.gewijzigdeLocatie && h(AnnotationGewijzigdeLocatie, null)) }));
     }
     static get is() { return "dso-annotation-activiteit"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/annotation/annotation-activiteit/annotation-activiteit.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"annotation-activiteit.js","sourceRoot":"","sources":["../../../../../src/components/annotation/annotation-activiteit/annotation-activiteit.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAsB,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAgB,OAAO,EAAE,MAAM,eAAe,CAAC;AAE/G,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;~~AAGjE~~;;GAEG;AAMH,MAAM,OAAO,oBAAoB;IALjC;QAyDU,YAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAoCtC;IAlCC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;IACzB,CAAC;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,OAAO,CACL,EAAC,cAAc,qDACb,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,EAAC,oBAAoB,OAAG,CAAC,CAAC,CAAC,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EAAE,mBAAa,KAAK,EAAE,IAAI,CAAC,IAAI,GAAI,EACxC,IAAI,EACF;gBACE,YAAM,KAAK,EAAC,SAAS;oBAClB,IAAI,CAAC,iBAAiB,IAAI,CACzB;wBACE,mBAAa,KAAK,EAAE,IAAI,CAAC,iBAAiB,GAAI;wBAAC,GAAG,CACjD,CACJ;oBACA,IAAI,CAAC,2BAA2B,IAAI,GAAG,IAAI,CAAC,2BAA2B,IAAI;oBAC5E,~~mBAAa~~,~~KAAK~~,EAAE,IAAI,CAAC,cAAc,GAAI,~~CACtC~~;gBACN,IAAI,CAAC,iBAAiB,IAAI,EAAC,2BAA2B,OAAG,CACzD,GAEL,CACH,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, ComponentInterface, Prop, Event, h, Fragment, EventEmitter, Element } from \"@stencil/core\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\n\r\n/*\r\n @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n /\r\n@Component({\r\n tag: \"dso-annotation-activiteit\",\r\n styleUrl: \"../annotation.scss\",\r\n shadow: true,\r\n})\r\nexport class AnnotationActiviteit implements ComponentInterface {\r\n /\r\n Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: AnnotationWijzigactie;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de annotatie actief is.\r\n /\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n /\r\n @Prop({ reflect: true })\r\n gewijzigdeLocatie?: boolean;\r\n\r\n /\r\n Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n /\r\n @Event()\r\n dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n /\r\n De naam van de activiteit.\r\n /\r\n @Prop()\r\n naam?: RenvooiValue \| string;\r\n\r\n /\r\n De activiteit regel kwalificatie.\r\n /\r\n @Prop()\r\n regelKwalificatie?: RenvooiValue \| string;\r\n\r\n /\r\n De noemer van de locatie.\r\n /\r\n @Prop()\r\n locatieNoemers?: Array<RenvooiValue \| string>;\r\n\r\n /\r\n Voorzetsel van de regelKwalificatie. Exclusief dubbele punt.\r\n */\r\n @Prop()\r\n regelKwalificatieVoorzetsel?: string;\r\n\r\n @Element()\r\n private host!: HTMLDsoAnnotationActiviteitElement;\r\n\r\n private watcher = watcher(this.host);\r\n\r\n connectedCallback(): void {\r\n this.watcher.watch();\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.watcher.unwatch();\r\n }\r\n\r\n render() {\r\n const hasSymbool = this.watcher.hasSymbool();\r\n\r\n return (\r\n <AnnotationBody\r\n symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n active={this.active}\r\n dsoActiveChange={this.dsoActiveChange}\r\n title={<dso-renvooi value={this.naam} />}\r\n data={\r\n <>\r\n <span class=\"content\">\r\n {this.regelKwalificatie && (\r\n <>\r\n <dso-renvooi value={this.regelKwalificatie} />{\" \"}\r\n </>\r\n )}\r\n {this.regelKwalificatieVoorzetsel && `${this.regelKwalificatieVoorzetsel}: `}\r\n <~~dso-renvooi~~ ~~value~~={this.locatieNoemers} />\r\n </span>\r\n {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n </>\r\n }\r\n />\r\n );\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"annotation-activiteit.js","sourceRoot":"","sources":["../../../../../src/components/annotation/annotation-activiteit/annotation-activiteit.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAsB,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAgB,OAAO,EAAE,MAAM,eAAe,CAAC;AAE/G,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AAEjE,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAEhF;;GAEG;AAMH,MAAM,OAAO,oBAAoB;IALjC;QAyDU,YAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAoCtC;IAlCC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;IACzB,CAAC;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,OAAO,CACL,EAAC,cAAc,qDACb,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,EAAC,oBAAoB,OAAG,CAAC,CAAC,CAAC,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EAAE,mBAAa,KAAK,EAAE,IAAI,CAAC,IAAI,GAAI,EACxC,IAAI,EACF;gBACE,YAAM,KAAK,EAAC,SAAS;oBAClB,IAAI,CAAC,iBAAiB,IAAI,CACzB;wBACE,mBAAa,KAAK,EAAE,IAAI,CAAC,iBAAiB,GAAI;wBAAC,GAAG,CACjD,CACJ;oBACA,IAAI,CAAC,2BAA2B,IAAI,GAAG,IAAI,CAAC,2BAA2B,IAAI;oBAC5E,EAAC,2BAA2B,IAAC,MAAM,EAAE,IAAI,CAAC,cAAc,GAAI,CACvD;gBACN,IAAI,CAAC,iBAAiB,IAAI,EAAC,2BAA2B,OAAG,CACzD,GAEL,CACH,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, ComponentInterface, Prop, Event, h, Fragment, EventEmitter, Element } from \"@stencil/core\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\nimport { AnnotationListRenvooiValues } from \"../annotation-list-renvooi-values\";\r\n\r\n/*\r\n @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n /\r\n@Component({\r\n tag: \"dso-annotation-activiteit\",\r\n styleUrl: \"../annotation.scss\",\r\n shadow: true,\r\n})\r\nexport class AnnotationActiviteit implements ComponentInterface {\r\n /\r\n Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: AnnotationWijzigactie;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de annotatie actief is.\r\n /\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n /\r\n @Prop({ reflect: true })\r\n gewijzigdeLocatie?: boolean;\r\n\r\n /\r\n Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n /\r\n @Event()\r\n dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n /\r\n De naam van de activiteit.\r\n /\r\n @Prop()\r\n naam?: RenvooiValue \| string;\r\n\r\n /\r\n De activiteit regel kwalificatie.\r\n /\r\n @Prop()\r\n regelKwalificatie?: RenvooiValue \| string;\r\n\r\n /\r\n De noemer van de locatie.\r\n /\r\n @Prop()\r\n locatieNoemers?: Array<RenvooiValue \| string>;\r\n\r\n /\r\n Voorzetsel van de regelKwalificatie. Exclusief dubbele punt.\r\n */\r\n @Prop()\r\n regelKwalificatieVoorzetsel?: string;\r\n\r\n @Element()\r\n private host!: HTMLDsoAnnotationActiviteitElement;\r\n\r\n private watcher = watcher(this.host);\r\n\r\n connectedCallback(): void {\r\n this.watcher.watch();\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.watcher.unwatch();\r\n }\r\n\r\n render() {\r\n const hasSymbool = this.watcher.hasSymbool();\r\n\r\n return (\r\n <AnnotationBody\r\n symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n active={this.active}\r\n dsoActiveChange={this.dsoActiveChange}\r\n title={<dso-renvooi value={this.naam} />}\r\n data={\r\n <>\r\n <span class=\"content\">\r\n {this.regelKwalificatie && (\r\n <>\r\n <dso-renvooi value={this.regelKwalificatie} />{\" \"}\r\n </>\r\n )}\r\n {this.regelKwalificatieVoorzetsel && `${this.regelKwalificatieVoorzetsel}: `}\r\n <AnnotationListRenvooiValues values={this.locatieNoemers} />\r\n </span>\r\n {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n </>\r\n }\r\n />\r\n );\r\n }\r\n}\r\n"]}

package/dist/collection/components/annotation/annotation-list-renvooi-values.js ADDED Viewed

@@ -0,0 +1,5 @@
+import { Fragment, h } from "@stencil/core";
+export const AnnotationListRenvooiValues = ({ values }) => {
+    return (h(Fragment, null, values === null || values === void 0 ? void 0 : values.map((v, i) => (h(Fragment, null, i > 0 && ", ", h("dso-renvooi", { value: v }))))));
+};
+//# sourceMappingURL=annotation-list-renvooi-values.js.map

package/dist/collection/components/annotation/annotation-list-renvooi-values.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"annotation-list-renvooi-values.js","sourceRoot":"","sources":["../../../../src/components/annotation/annotation-list-renvooi-values.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,QAAQ,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOjE,MAAM,CAAC,MAAM,2BAA2B,GAAqD,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;IAC1G,OAAO,CACL,kBACG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACrB;QACG,CAAC,GAAG,CAAC,IAAI,IAAI;QACd,mBAAa,KAAK,EAAE,CAAC,GAAI,CACxB,CACJ,CAAC,CACD,CACJ,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FunctionalComponent, Fragment, h } from \"@stencil/core\";\r\nimport { RenvooiValue } from \"../renvooi/renvooi.interfaces\";\r\n\r\ninterface AnnotationListRenvooiValues {\r\n values: RenvooiValue[] | undefined;\r\n}\r\n\r\nexport const AnnotationListRenvooiValues: FunctionalComponent<AnnotationListRenvooiValues> = ({ values }) => {\r\n return (\r\n <>\r\n {values?.map((v, i) => (\r\n <>\r\n {i > 0 && \", \"}\r\n <dso-renvooi value={v} />\r\n </>\r\n ))}\r\n </>\r\n );\r\n};\r\n"]}

package/dist/collection/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.js CHANGED Viewed

@@ -3,6 +3,7 @@ import { AnnotationBody } from "../annotation-body";
 import { AnnotationGewijzigdeLocatie } from "../annotation-gewijzigde-locatie";
 import { watcher } from "../annotation-watcher";
 import { AnnotationSymbolSlot } from "../annotation-symbol-slot";
+import { AnnotationListRenvooiValues } from "../annotation-list-renvooi-values";
 /**
  * Dit component wordt voor een Omgevingsnorm en Omgevingswaarde gebruikt.
  *
@@ -20,7 +21,7 @@ export class AnnotationOmgevingsnormwaarde {
     }
     render() {
         const hasSymbool = this.watcher.hasSymbool();
-        return (h(AnnotationBody, { key: '5e2947e6f85b9c02cdf87099f59a304224e96b81', symbol: hasSymbool ? h(AnnotationSymbolSlot, null) : undefined, active: this.active || false, dsoActiveChange: this.dsoActiveChange, title: h(Fragment, null, h("dso-renvooi", { value: this.naam }), this.eenheid && (h(Fragment, null, " ", "(in ", h("dso-renvooi", { value: this.eenheid }), ")"))), data: h(Fragment, null, h("span", { class: "content" }, this.toelichting && h(Fragment, null, this.toelichting), this.waardes && this.waardes.length > 0 && (h(Fragment, null, ": ", h("dso-renvooi", { value: this.waardes })))), this.gewijzigdeLocatie && h(AnnotationGewijzigdeLocatie, null)) }));
+        return (h(AnnotationBody, { key: '7b118d1c32131742b38869b59683942e1d6f78e9', symbol: hasSymbool ? h(AnnotationSymbolSlot, null) : undefined, active: this.active || false, dsoActiveChange: this.dsoActiveChange, title: h(Fragment, null, h("dso-renvooi", { value: this.naam }), this.eenheid && (h(Fragment, null, " ", "(in ", h("dso-renvooi", { value: this.eenheid }), ")"))), data: h(Fragment, null, h("span", { class: "content" }, this.toelichting && h(Fragment, null, this.toelichting), this.waardes && this.waardes.length > 0 && (h(Fragment, null, ": ", h(AnnotationListRenvooiValues, { values: this.waardes })))), this.gewijzigdeLocatie && h(AnnotationGewijzigdeLocatie, null)) }));
     }
     static get is() { return "dso-annotation-omgevingsnormwaarde"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"annotation-omgevingsnormwaarde.js","sourceRoot":"","sources":["../../../../../src/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAsB,IAAI,EAAE,KAAK,EAAE,CAAC,EAAgB,QAAQ,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAG/G,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;~~AAGjE~~;;;;GAIG;AAMH,MAAM,OAAO,6BAA6B;IAL1C;QAyDU,YAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KA6CtC;IA3CC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;IACzB,CAAC;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,OAAO,CACL,EAAC,cAAc,qDACb,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,EAAC,oBAAoB,OAAG,CAAC,CAAC,CAAC,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,KAAK,EAC5B,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACH;gBACE,mBAAa,KAAK,EAAE,IAAI,CAAC,IAAI,GAAI;gBAChC,IAAI,CAAC,OAAO,IAAI,CACf;oBACG,GAAG;;oBACA,mBAAa,KAAK,EAAE,IAAI,CAAC,OAAO,GAAI;wBACvC,CACJ,CACA,EAEL,IAAI,EACF;gBACE,YAAM,KAAK,EAAC,SAAS;oBAClB,IAAI,CAAC,WAAW,IAAI,kBAAG,IAAI,CAAC,WAAW,CAAI;oBAC3C,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,CAC1C;;wBACI,~~mBAAa~~,~~KAAK~~,EAAE,IAAI,CAAC,OAAO,GAAI,~~CACrC~~,CACJ,CACI;gBACN,IAAI,CAAC,iBAAiB,IAAI,EAAC,2BAA2B,OAAG,CACzD,GAEL,CACH,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, ComponentInterface, Prop, Event, h, EventEmitter, Fragment, Element } from \"@stencil/core\";\r\n\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\n\r\n/*\r\n Dit component wordt voor een Omgevingsnorm en Omgevingswaarde gebruikt.\r\n \r\n @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n /\r\n@Component({\r\n tag: \"dso-annotation-omgevingsnormwaarde\",\r\n styleUrl: \"../annotation.scss\",\r\n shadow: true,\r\n})\r\nexport class AnnotationOmgevingsnormwaarde implements ComponentInterface {\r\n /\r\n Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: AnnotationWijzigactie;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de annotatie actief is.\r\n /\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n /\r\n @Prop({ reflect: true })\r\n gewijzigdeLocatie?: boolean;\r\n\r\n /\r\n Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n /\r\n @Event()\r\n dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n /\r\n De naam van de omgevingsnorm of omgevingswaarde.\r\n /\r\n @Prop()\r\n naam?: RenvooiValue \| string;\r\n\r\n /\r\n De toelichting van de waardes.\r\n /\r\n @Prop()\r\n toelichting?: string;\r\n\r\n /\r\n De waardes van de omgevingsnorm of omgevingswaarde.\r\n /\r\n @Prop()\r\n waardes?: Array<RenvooiValue \| string>;\r\n\r\n /\r\n De eenheid van de omgevingsnorm of omgevingswaarde.\r\n */\r\n @Prop()\r\n eenheid?: RenvooiValue \| string;\r\n\r\n @Element()\r\n private host!: HTMLDsoAnnotationOmgevingsnormwaardeElement;\r\n\r\n private watcher = watcher(this.host);\r\n\r\n connectedCallback(): void {\r\n this.watcher.watch();\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.watcher.unwatch();\r\n }\r\n\r\n render() {\r\n const hasSymbool = this.watcher.hasSymbool();\r\n\r\n return (\r\n <AnnotationBody\r\n symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n active={this.active \|\| false}\r\n dsoActiveChange={this.dsoActiveChange}\r\n title={\r\n <>\r\n <dso-renvooi value={this.naam} />\r\n {this.eenheid && (\r\n <>\r\n {\" \"}\r\n (in <dso-renvooi value={this.eenheid} />)\r\n </>\r\n )}\r\n </>\r\n }\r\n data={\r\n <>\r\n <span class=\"content\">\r\n {this.toelichting && <>{this.toelichting}</>}\r\n {this.waardes && this.waardes.length > 0 && (\r\n <>\r\n : <~~dso-renvooi~~ ~~value~~={this.waardes} />\r\n </>\r\n )}\r\n </span>\r\n {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n </>\r\n }\r\n />\r\n );\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"annotation-omgevingsnormwaarde.js","sourceRoot":"","sources":["../../../../../src/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAsB,IAAI,EAAE,KAAK,EAAE,CAAC,EAAgB,QAAQ,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAG/G,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AAEjE,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAEhF;;;;GAIG;AAMH,MAAM,OAAO,6BAA6B;IAL1C;QAyDU,YAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KA6CtC;IA3CC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;IACzB,CAAC;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,OAAO,CACL,EAAC,cAAc,qDACb,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,EAAC,oBAAoB,OAAG,CAAC,CAAC,CAAC,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,KAAK,EAC5B,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACH;gBACE,mBAAa,KAAK,EAAE,IAAI,CAAC,IAAI,GAAI;gBAChC,IAAI,CAAC,OAAO,IAAI,CACf;oBACG,GAAG;;oBACA,mBAAa,KAAK,EAAE,IAAI,CAAC,OAAO,GAAI;wBACvC,CACJ,CACA,EAEL,IAAI,EACF;gBACE,YAAM,KAAK,EAAC,SAAS;oBAClB,IAAI,CAAC,WAAW,IAAI,kBAAG,IAAI,CAAC,WAAW,CAAI;oBAC3C,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,CAC1C;;wBACI,EAAC,2BAA2B,IAAC,MAAM,EAAE,IAAI,CAAC,OAAO,GAAI,CACtD,CACJ,CACI;gBACN,IAAI,CAAC,iBAAiB,IAAI,EAAC,2BAA2B,OAAG,CACzD,GAEL,CACH,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, ComponentInterface, Prop, Event, h, EventEmitter, Fragment, Element } from \"@stencil/core\";\r\n\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\nimport { AnnotationListRenvooiValues } from \"../annotation-list-renvooi-values\";\r\n\r\n/*\r\n Dit component wordt voor een Omgevingsnorm en Omgevingswaarde gebruikt.\r\n \r\n @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n /\r\n@Component({\r\n tag: \"dso-annotation-omgevingsnormwaarde\",\r\n styleUrl: \"../annotation.scss\",\r\n shadow: true,\r\n})\r\nexport class AnnotationOmgevingsnormwaarde implements ComponentInterface {\r\n /\r\n Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: AnnotationWijzigactie;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de annotatie actief is.\r\n /\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /\r\n Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n /\r\n @Prop({ reflect: true })\r\n gewijzigdeLocatie?: boolean;\r\n\r\n /\r\n Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n /\r\n @Event()\r\n dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n /\r\n De naam van de omgevingsnorm of omgevingswaarde.\r\n /\r\n @Prop()\r\n naam?: RenvooiValue \| string;\r\n\r\n /\r\n De toelichting van de waardes.\r\n /\r\n @Prop()\r\n toelichting?: string;\r\n\r\n /\r\n De waardes van de omgevingsnorm of omgevingswaarde.\r\n /\r\n @Prop()\r\n waardes?: Array<RenvooiValue \| string>;\r\n\r\n /\r\n De eenheid van de omgevingsnorm of omgevingswaarde.\r\n */\r\n @Prop()\r\n eenheid?: RenvooiValue \| string;\r\n\r\n @Element()\r\n private host!: HTMLDsoAnnotationOmgevingsnormwaardeElement;\r\n\r\n private watcher = watcher(this.host);\r\n\r\n connectedCallback(): void {\r\n this.watcher.watch();\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.watcher.unwatch();\r\n }\r\n\r\n render() {\r\n const hasSymbool = this.watcher.hasSymbool();\r\n\r\n return (\r\n <AnnotationBody\r\n symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n active={this.active \|\| false}\r\n dsoActiveChange={this.dsoActiveChange}\r\n title={\r\n <>\r\n <dso-renvooi value={this.naam} />\r\n {this.eenheid && (\r\n <>\r\n {\" \"}\r\n (in <dso-renvooi value={this.eenheid} />)\r\n </>\r\n )}\r\n </>\r\n }\r\n data={\r\n <>\r\n <span class=\"content\">\r\n {this.toelichting && <>{this.toelichting}</>}\r\n {this.waardes && this.waardes.length > 0 && (\r\n <>\r\n : <AnnotationListRenvooiValues values={this.waardes} />\r\n </>\r\n )}\r\n </span>\r\n {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n </>\r\n }\r\n />\r\n );\r\n }\r\n}\r\n"]}