npm - @dso-toolkit/core - Versions diffs - 58.3.1 → 59.0.0 - Mend

@dso-toolkit/core 58.3.1 → 59.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 (121) hide show

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

@@ -13,6 +13,9 @@ export class DocumentComponent {
         this.dsoOpenToggle.emit({ originalEvent: e, open: !this.open });
       }
     };
+    this.handleOzonContentAnchorClick = (e) => {
+      this.dsoOzonContentAnchorClick.emit({ originalEvent: e, ozonContentAnchorClick: e.detail });
+    };
     this.heading = "h2";
     this.label = undefined;
     this.nummer = undefined;
@@ -45,7 +48,7 @@ export class DocumentComponent {
   }
   render() {
     const suffix = this.suffix();
-    return (h(Fragment, null, h("div", { class: "heading-container" }, this.wijzigactie && h("span", { class: "wijzigactie-label" }, this.wijzigactieLabel, ":"), h("div", { class: "heading" }, h(Heading, { heading: this.heading, class: "heading-element", onClick: this.handleHeadingClick }, this.type !== "LID" && (h("button", { type: "button", class: "toggle-button" }, h("dso-icon", { icon: this.open ? "chevron-down" : "chevron-right" }))), h("div", { class: "title" }, this.notApplicable && h("span", { class: "not-applicable" }, "Niet van toepassing:"), this.label || this.nummer || this.opschrift ? (h(Fragment, null, this.label && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.label, inline: true }))), this.nummer && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.nummer, inline: true }))), this.opschrift && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.opschrift, inline: true }))))) : (this.alternativeTitle), suffix && h("span", null, " - [", suffix, "]"))), this.genesteOntwerpInformatie && !this.open && !this.bevatOntwerpInformatie && (h(Fragment, null, h("dso-badge", { status: "warning", "aria-describedby": "nested-draft-description" }, "!"), h("dso-tooltip", { id: "nested-draft-description" }, "Er is een ontwerp beschikbaar."))), (this.bevatOntwerpInformatie || this.annotated) && (h("div", { class: "addons" }, this.bevatOntwerpInformatie && (h("dso-label", { status: "warning", compact: true }, "Ontwerp")), this.annotated && (h("dso-annotation-button", { identifier: "expandable", open: this.openAnnotation, onDsoClick: (e) => this.dsoAnnotationToggle.emit({ originalEvent: e }) })))))), h("slot", { name: "annotation" }), this.open && (this.inhoud || this.gereserveerd) && (h("div", { class: "content" }, this.gereserveerd && (h("dso-alert", { status: "info" }, "Dit onderdeel is gereserveerd voor toekomstige toevoeging.")), h("dso-ozon-content", { content: this.inhoud }))), h("slot", null)));
+    return (h(Fragment, null, h("div", { class: "heading-container" }, this.wijzigactie && h("span", { class: "wijzigactie-label" }, this.wijzigactieLabel, ":"), h("div", { class: "heading" }, h(Heading, { heading: this.heading, class: "heading-element", onClick: this.handleHeadingClick }, this.type !== "LID" && (h("button", { type: "button", class: "toggle-button" }, h("dso-icon", { icon: this.open ? "chevron-down" : "chevron-right" }))), h("div", { class: "title" }, this.notApplicable && h("span", { class: "not-applicable" }, "Niet van toepassing:"), this.label || this.nummer || this.opschrift ? (h(Fragment, null, this.label && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.label, onDsoAnchorClick: this.handleOzonContentAnchorClick, inline: true }))), this.nummer && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.nummer, onDsoAnchorClick: this.handleOzonContentAnchorClick, inline: true }))), this.opschrift && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.opschrift, onDsoAnchorClick: this.handleOzonContentAnchorClick, inline: true }))))) : (this.alternativeTitle), suffix && h("span", null, " - [", suffix, "]"))), this.genesteOntwerpInformatie && !this.open && !this.bevatOntwerpInformatie && (h(Fragment, null, h("dso-badge", { status: "warning", "aria-describedby": "nested-draft-description" }, "!"), h("dso-tooltip", { id: "nested-draft-description" }, "Er is een ontwerp beschikbaar."))), (this.bevatOntwerpInformatie || this.annotated) && (h("div", { class: "addons" }, this.bevatOntwerpInformatie && (h("dso-label", { status: "warning", compact: true }, "Ontwerp")), this.annotated && (h("dso-annotation-button", { identifier: "expandable", open: this.openAnnotation, onDsoClick: (e) => this.dsoAnnotationToggle.emit({ originalEvent: e }) })))))), h("slot", { name: "annotation" }), this.open && (this.inhoud || this.gereserveerd || this.vervallen) && (h("div", { class: "content" }, this.gereserveerd && (h("dso-alert", { status: "info" }, "Dit onderdeel is gereserveerd voor toekomstige toevoeging.")), this.vervallen && h("dso-alert", { status: "info" }, "Dit onderdeel is vervallen."), this.inhoud && (h("dso-ozon-content", { content: this.inhoud, onDsoAnchorClick: this.handleOzonContentAnchorClick })))), h("slot", null)));
   }
   static get is() { return "dso-document-component"; }
   static get encapsulation() { return "shadow"; }
@@ -352,8 +355,8 @@ export class DocumentComponent {
           "references": {
             "DocumentComponentWijzigactie": {
               "location": "import",
-              "path": "./document-component.types",
-              "id": "src/components/document-component/document-component.types.ts::DocumentComponentWijzigactie"
+              "path": "./document-component.models",
+              "id": "src/components/document-component/document-component.models.ts::DocumentComponentWijzigactie"
             }
           }
         },
@@ -385,8 +388,29 @@ export class DocumentComponent {
           "references": {
             "DocumentComponentOpenToggleEvent": {
               "location": "import",
-              "path": "./document-component.types",
-              "id": "src/components/document-component/document-component.types.ts::DocumentComponentOpenToggleEvent"
+              "path": "./document-component.models",
+              "id": "src/components/document-component/document-component.models.ts::DocumentComponentOpenToggleEvent"
+            }
+          }
+        }
+      }, {
+        "method": "dsoOzonContentAnchorClick",
+        "name": "dsoOzonContentAnchorClick",
+        "bubbles": false,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitted when the user actives intRef or intIoRef anchors in Ozon Content"
+        },
+        "complexType": {
+          "original": "DocumentComponentOzonContentAnchorClickEvent",
+          "resolved": "DocumentComponentOzonContentAnchorClickEvent",
+          "references": {
+            "DocumentComponentOzonContentAnchorClickEvent": {
+              "location": "import",
+              "path": "./document-component.models",
+              "id": "src/components/document-component/document-component.models.ts::DocumentComponentOzonContentAnchorClickEvent"
             }
           }
         }
@@ -406,8 +430,8 @@ export class DocumentComponent {
           "references": {
             "DocumentComponentToggleAnnotationEvent": {
               "location": "import",
-              "path": "./document-component.types",
-              "id": "src/components/document-component/document-component.types.ts::DocumentComponentToggleAnnotationEvent"
+              "path": "./document-component.models",
+              "id": "src/components/document-component/document-component.models.ts::DocumentComponentToggleAnnotationEvent"
             }
           }
         }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"document-component.js","sourceRoot":"","sources":["../../../src/components/document-component/document-component.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, Component, ComponentInterface, Event, EventEmitter, Fragment, Prop } from \"@stencil/core\";\r\nimport {\r\n DocumentComponentOpenToggleEvent,\r\n DocumentComponentToggleAnnotationEvent,\r\n DocumentComponentWijzigactie,\r\n} from \"./document-component.types\";\r\nimport { Heading } from \"./document-component-heading\";\r\n\r\nconst wijzigActieLabels: { [wijzigActie in DocumentComponentWijzigactie]: string } = {\r\n nieuweContainer: \"Toegevoegd\",\r\n verwijder: \"Verwijderd\",\r\n verwijderContainer: \"Verwijderd\",\r\n voegtoe: \"Toegevoegd\",\r\n};\r\n\r\n@Component({\r\n tag: \"dso-document-component\",\r\n styleUrl: \"document-component.scss\",\r\n shadow: true,\r\n})\r\nexport class DocumentComponent implements ComponentInterface {\r\n /*\r\n The heading element to use.\r\n /\r\n @Prop()\r\n heading: \"h2\" \| \"h3\" \| \"h4\" \| \"h5\" \| \"h6\" = \"h2\";\r\n\r\n /\r\n The Label XML.\r\n /\r\n @Prop()\r\n label?: string;\r\n\r\n /\r\n The Nummer XML.\r\n /\r\n @Prop()\r\n nummer?: string;\r\n\r\n /\r\n The Opschrift XML.\r\n /\r\n @Prop()\r\n opschrift?: string;\r\n\r\n /\r\n The Inhoud XML.\r\n /\r\n @Prop()\r\n inhoud?: string;\r\n\r\n /\r\n This boolean attribute indicates whether the children are visible.\r\n /\r\n @Prop({ reflect: true })\r\n open = false;\r\n\r\n /\r\n Marks this Document Component as belonging to an active filter.\r\n /\r\n @Prop({ reflect: true })\r\n filtered = false;\r\n\r\n /\r\n Marks this Document Component as not-applicable.\r\n /\r\n @Prop({ reflect: true })\r\n notApplicable = false;\r\n\r\n /\r\n When a child Document Component has a status \"Draft\".\r\n /\r\n @Prop({ reflect: true })\r\n genesteOntwerpInformatie = false;\r\n\r\n /\r\n Marks as draft.\r\n /\r\n @Prop({ reflect: true })\r\n bevatOntwerpInformatie = false;\r\n\r\n /\r\n Enables annotations.\r\n /\r\n @Prop({ reflect: true })\r\n annotated = false;\r\n\r\n /\r\n Marks Document Component as reserved.\r\n /\r\n @Prop()\r\n gereserveerd = false;\r\n\r\n /\r\n Marks the Document Component as expired.\r\n /\r\n @Prop()\r\n vervallen = false;\r\n\r\n /\r\n When the Annotation Output is opened, set this to true.\r\n /\r\n @Prop()\r\n openAnnotation = false;\r\n\r\n /\r\n An alternative title to show when there is nothing to create a title.\r\n /\r\n @Prop()\r\n alternativeTitle?: string;\r\n\r\n /\r\n Type of Document Component.\r\n /\r\n @Prop({ reflect: true })\r\n type?: string;\r\n\r\n /\r\n The wijzigactie as in STOP.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: DocumentComponentWijzigactie;\r\n\r\n /\r\n Emitted when the user activates the toggle.\r\n /\r\n @Event({ bubbles: false })\r\n dsoOpenToggle!: EventEmitter<DocumentComponentOpenToggleEvent>;\r\n\r\n /\r\n Emitted when the user activates the annotation button.\r\n */\r\n @Event({ bubbles: false })\r\n dsoAnnotationToggle!: EventEmitter<DocumentComponentToggleAnnotationEvent>;\r\n\r\n private get wijzigactieLabel(): string \| undefined {\r\n return this.wijzigactie && wijzigActieLabels[this.wijzigactie];\r\n }\r\n\r\n private handleHeadingClick = (e: MouseEvent) => {\r\n if (this.type !== \"LID\") {\r\n this.dsoOpenToggle.emit({ originalEvent: e, open: !this.open });\r\n }\r\n };\r\n\r\n private suffix(): string \| undefined {\r\n if (this.vervallen) {\r\n return \"vervallen\";\r\n }\r\n\r\n if (this.gereserveerd) {\r\n return \"gereserveerd\";\r\n }\r\n\r\n return undefined;\r\n }\r\n\r\n render() {\r\n const suffix = this.suffix();\r\n\r\n return (\r\n <>\r\n <div class=\"heading-container\">\r\n {this.wijzigactie && <span class=\"wijzigactie-label\">{this.wijzigactieLabel}:</span>}\r\n <div class=\"heading\">\r\n <Heading heading={this.heading} class=\"heading-element\" onClick={this.handleHeadingClick}>\r\n {this.type !== \"LID\" && (\r\n <button type=\"button\" class=\"toggle-button\">\r\n <dso-icon icon={this.open ? \"chevron-down\" : \"chevron-right\"}></dso-icon>\r\n </button>\r\n )}\r\n <div class=\"title\">\r\n {this.notApplicable && <span class=\"not-applicable\">Niet van toepassing:</span>}\r\n {this.label \|\| this.nummer \|\| this.opschrift ? (\r\n <>\r\n {this.label && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content content={this.label} inline></dso-ozon-content>\r\n </>\r\n )}\r\n {this.nummer && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content content={this.nummer} inline></dso-ozon-content>\r\n </>\r\n )}\r\n {this.opschrift && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content content={this.opschrift} inline></dso-ozon-content>\r\n </>\r\n )}\r\n </>\r\n ) : (\r\n this.alternativeTitle\r\n )}\r\n {suffix && <span> - [{suffix}]</span>}\r\n </div>\r\n </Heading>\r\n {this.genesteOntwerpInformatie && !this.open && !this.bevatOntwerpInformatie && (\r\n <>\r\n <dso-badge status=\"warning\" aria-describedby=\"nested-draft-description\">\r\n !\r\n </dso-badge>\r\n <dso-tooltip id=\"nested-draft-description\">Er is een ontwerp beschikbaar.</dso-tooltip>\r\n </>\r\n )}\r\n {(this.bevatOntwerpInformatie \|\| this.annotated) && (\r\n <div class=\"addons\">\r\n {this.bevatOntwerpInformatie && (\r\n <dso-label status=\"warning\" compact>\r\n Ontwerp\r\n </dso-label>\r\n )}\r\n {this.annotated && (\r\n <dso-annotation-button\r\n identifier=\"expandable\"\r\n open={this.openAnnotation}\r\n onDsoClick={(e) => this.dsoAnnotationToggle.emit({ originalEvent: e })}\r\n ></dso-annotation-button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n <slot name=\"annotation\" />\r\n {this.open && (this.inhoud \|\| this.gereserveerd) && (\r\n <div class=\"content\">\r\n {this.gereserveerd && (\r\n <dso-alert status=\"info\">Dit onderdeel is gereserveerd voor toekomstige toevoeging.</dso-alert>\r\n )}\r\n <dso-ozon-content content={this.inhoud}></dso-ozon-content>\r\n </div>\r\n )}\r\n <slot />\r\n </>\r\n );\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"document-component.js","sourceRoot":"","sources":["../../../src/components/document-component/document-component.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, Component, ComponentInterface, Event, EventEmitter, Fragment, Prop } from \"@stencil/core\";\r\nimport {\r\n DocumentComponentOpenToggleEvent,\r\n DocumentComponentToggleAnnotationEvent,\r\n DocumentComponentOzonContentAnchorClickEvent,\r\n DocumentComponentWijzigactie,\r\n} from \"./document-component.models\";\r\nimport { OzonContentAnchorClickEvent } from \"../ozon-content/ozon-content.interfaces\";\r\nimport { Heading } from \"./document-component-heading\";\r\n\r\nimport { DsoOzonContentCustomEvent } from \"../../components\";\r\n\r\nconst wijzigActieLabels: { [wijzigActie in DocumentComponentWijzigactie]: string } = {\r\n nieuweContainer: \"Toegevoegd\",\r\n verwijder: \"Verwijderd\",\r\n verwijderContainer: \"Verwijderd\",\r\n voegtoe: \"Toegevoegd\",\r\n};\r\n\r\n@Component({\r\n tag: \"dso-document-component\",\r\n styleUrl: \"document-component.scss\",\r\n shadow: true,\r\n})\r\nexport class DocumentComponent implements ComponentInterface {\r\n /*\r\n The heading element to use.\r\n /\r\n @Prop()\r\n heading: \"h2\" \| \"h3\" \| \"h4\" \| \"h5\" \| \"h6\" = \"h2\";\r\n\r\n /\r\n The Label XML.\r\n /\r\n @Prop()\r\n label?: string;\r\n\r\n /\r\n The Nummer XML.\r\n /\r\n @Prop()\r\n nummer?: string;\r\n\r\n /\r\n The Opschrift XML.\r\n /\r\n @Prop()\r\n opschrift?: string;\r\n\r\n /\r\n The Inhoud XML.\r\n /\r\n @Prop()\r\n inhoud?: string;\r\n\r\n /\r\n This boolean attribute indicates whether the children are visible.\r\n /\r\n @Prop({ reflect: true })\r\n open = false;\r\n\r\n /\r\n Marks this Document Component as belonging to an active filter.\r\n /\r\n @Prop({ reflect: true })\r\n filtered = false;\r\n\r\n /\r\n Marks this Document Component as not-applicable.\r\n /\r\n @Prop({ reflect: true })\r\n notApplicable = false;\r\n\r\n /\r\n When a child Document Component has a status \"Draft\".\r\n /\r\n @Prop({ reflect: true })\r\n genesteOntwerpInformatie = false;\r\n\r\n /\r\n Marks as draft.\r\n /\r\n @Prop({ reflect: true })\r\n bevatOntwerpInformatie = false;\r\n\r\n /\r\n Enables annotations.\r\n /\r\n @Prop({ reflect: true })\r\n annotated = false;\r\n\r\n /\r\n Marks Document Component as reserved.\r\n /\r\n @Prop()\r\n gereserveerd = false;\r\n\r\n /\r\n Marks the Document Component as expired.\r\n /\r\n @Prop()\r\n vervallen = false;\r\n\r\n /\r\n When the Annotation Output is opened, set this to true.\r\n /\r\n @Prop()\r\n openAnnotation = false;\r\n\r\n /\r\n An alternative title to show when there is nothing to create a title.\r\n /\r\n @Prop()\r\n alternativeTitle?: string;\r\n\r\n /\r\n Type of Document Component.\r\n /\r\n @Prop({ reflect: true })\r\n type?: string;\r\n\r\n /\r\n The wijzigactie as in STOP.\r\n /\r\n @Prop({ reflect: true })\r\n wijzigactie?: DocumentComponentWijzigactie;\r\n\r\n /\r\n Emitted when the user activates the toggle.\r\n /\r\n @Event({ bubbles: false })\r\n dsoOpenToggle!: EventEmitter<DocumentComponentOpenToggleEvent>;\r\n\r\n /\r\n Emitted when the user actives intRef or intIoRef anchors in Ozon Content\r\n /\r\n @Event({ bubbles: false })\r\n dsoOzonContentAnchorClick!: EventEmitter<DocumentComponentOzonContentAnchorClickEvent>;\r\n\r\n /\r\n Emitted when the user activates the annotation button.\r\n */\r\n @Event({ bubbles: false })\r\n dsoAnnotationToggle!: EventEmitter<DocumentComponentToggleAnnotationEvent>;\r\n\r\n private get wijzigactieLabel(): string \| undefined {\r\n return this.wijzigactie && wijzigActieLabels[this.wijzigactie];\r\n }\r\n\r\n private handleHeadingClick = (e: MouseEvent) => {\r\n if (this.type !== \"LID\") {\r\n this.dsoOpenToggle.emit({ originalEvent: e, open: !this.open });\r\n }\r\n };\r\n\r\n private suffix(): string \| undefined {\r\n if (this.vervallen) {\r\n return \"vervallen\";\r\n }\r\n\r\n if (this.gereserveerd) {\r\n return \"gereserveerd\";\r\n }\r\n\r\n return undefined;\r\n }\r\n\r\n private handleOzonContentAnchorClick = (e: DsoOzonContentCustomEvent<OzonContentAnchorClickEvent>) => {\r\n this.dsoOzonContentAnchorClick.emit({ originalEvent: e, ozonContentAnchorClick: e.detail });\r\n };\r\n\r\n render() {\r\n const suffix = this.suffix();\r\n\r\n return (\r\n <>\r\n <div class=\"heading-container\">\r\n {this.wijzigactie && <span class=\"wijzigactie-label\">{this.wijzigactieLabel}:</span>}\r\n <div class=\"heading\">\r\n <Heading heading={this.heading} class=\"heading-element\" onClick={this.handleHeadingClick}>\r\n {this.type !== \"LID\" && (\r\n <button type=\"button\" class=\"toggle-button\">\r\n <dso-icon icon={this.open ? \"chevron-down\" : \"chevron-right\"}></dso-icon>\r\n </button>\r\n )}\r\n <div class=\"title\">\r\n {this.notApplicable && <span class=\"not-applicable\">Niet van toepassing:</span>}\r\n {this.label \|\| this.nummer \|\| this.opschrift ? (\r\n <>\r\n {this.label && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content\r\n content={this.label}\r\n onDsoAnchorClick={this.handleOzonContentAnchorClick}\r\n inline\r\n ></dso-ozon-content>\r\n </>\r\n )}\r\n {this.nummer && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content\r\n content={this.nummer}\r\n onDsoAnchorClick={this.handleOzonContentAnchorClick}\r\n inline\r\n ></dso-ozon-content>\r\n </>\r\n )}\r\n {this.opschrift && (\r\n <>\r\n {\" \"}\r\n <dso-ozon-content\r\n content={this.opschrift}\r\n onDsoAnchorClick={this.handleOzonContentAnchorClick}\r\n inline\r\n ></dso-ozon-content>\r\n </>\r\n )}\r\n </>\r\n ) : (\r\n this.alternativeTitle\r\n )}\r\n {suffix && <span> - [{suffix}]</span>}\r\n </div>\r\n </Heading>\r\n {this.genesteOntwerpInformatie && !this.open && !this.bevatOntwerpInformatie && (\r\n <>\r\n <dso-badge status=\"warning\" aria-describedby=\"nested-draft-description\">\r\n !\r\n </dso-badge>\r\n <dso-tooltip id=\"nested-draft-description\">Er is een ontwerp beschikbaar.</dso-tooltip>\r\n </>\r\n )}\r\n {(this.bevatOntwerpInformatie \|\| this.annotated) && (\r\n <div class=\"addons\">\r\n {this.bevatOntwerpInformatie && (\r\n <dso-label status=\"warning\" compact>\r\n Ontwerp\r\n </dso-label>\r\n )}\r\n {this.annotated && (\r\n <dso-annotation-button\r\n identifier=\"expandable\"\r\n open={this.openAnnotation}\r\n onDsoClick={(e) => this.dsoAnnotationToggle.emit({ originalEvent: e })}\r\n ></dso-annotation-button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n <slot name=\"annotation\" />\r\n {this.open && (this.inhoud \|\| this.gereserveerd \|\| this.vervallen) && (\r\n <div class=\"content\">\r\n {this.gereserveerd && (\r\n <dso-alert status=\"info\">Dit onderdeel is gereserveerd voor toekomstige toevoeging.</dso-alert>\r\n )}\r\n {this.vervallen && <dso-alert status=\"info\">Dit onderdeel is vervallen.</dso-alert>}\r\n {this.inhoud && (\r\n <dso-ozon-content\r\n content={this.inhoud}\r\n onDsoAnchorClick={this.handleOzonContentAnchorClick}\r\n ></dso-ozon-content>\r\n )}\r\n </div>\r\n )}\r\n <slot />\r\n </>\r\n );\r\n }\r\n}\r\n"]}

package/dist/collection/components/document-component/document-component.models.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export {};
2	+ //# sourceMappingURL=document-component.models.js.map

package/dist/collection/components/document-component/document-component.models.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"document-component.models.js","sourceRoot":"","sources":["../../../src/components/document-component/document-component.models.ts"],"names":[],"mappings":"","sourcesContent":["import { DsoOzonContentCustomEvent } from \"../../components\";\r\nimport { OzonContentAnchorClickEvent } from \"../ozon-content/ozon-content.interfaces\";\r\n\r\nexport interface DocumentComponentOpenToggleEvent {\r\n originalEvent: Event;\r\n open: boolean;\r\n}\r\n\r\nexport interface DocumentComponentToggleAnnotationEvent {\r\n originalEvent: Event;\r\n}\r\n\r\nexport type DocumentComponentWijzigactie = \"voegtoe\" | \"verwijder\" | \"nieuweContainer\" | \"verwijderContainer\";\r\n\r\nexport interface DocumentComponentOzonContentAnchorClickEvent {\r\n originalEvent: DsoOzonContentCustomEvent<OzonContentAnchorClickEvent>;\r\n ozonContentAnchorClick: OzonContentAnchorClickEvent;\r\n}\r\n"]}

package/dist/collection/components/document-component-demo/document-component.demo.css ADDED Viewed

@@ -0,0 +1,11 @@
+:host {
+  display: block;
+  margin: 0 8px;
+  border-left: 1px dashed transparent;
+  border-right: 1px dashed transparent;
+}
+:host([show-canvas]) {
+  border-left: 1px dashed pink;
+  border-right: 1px dashed pink;
+}

package/dist/collection/components/document-component-demo/document-component.demo.js ADDED Viewed

@@ -0,0 +1,235 @@
+import { h } from "@stencil/core";
+import sampleSize from "lodash.samplesize";
+import random from "lodash.random";
+export class DocumentComponentDemo {
+  constructor() {
+    this.DocumentComponent = ({ path }) => {
+      var _a;
+      const documentComponent = path.at(-1);
+      const { DocumentComponent } = this;
+      return (h("ul", null, documentComponent &&
+        ((_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.map((d, i) => (h("li", { key: d.documentTechnischId }, h("dso-document-component", { annotated: i % 3 === 2, bevatOntwerpInformatie: !!d.bevatOntwerpInformatie, filtered: this.isOpen(d) ? this.isFiltered(d) : this.hasFilteredChildren(d), genesteOntwerpInformatie: this.hasNestedDraft(d), gereserveerd: d.gereserveerd, heading: "h2", inhoud: d.inhoud, label: d.labelXml, openAnnotation: this.isOpenedAnnotation(d), notApplicable: this.isNotApplicable(d) || path.some((p) => this.isNotApplicable(p)), nummer: d.nummerXml, onDsoAnnotationToggle: () => this.handleAnnotationToggle(d), onDsoOpenToggle: (e) => this.handleOpenToggle(e, d), onDsoOzonContentAnchorClick: (e) => this.handleOzonContentAnchorClick(e), open: this.isOpen(d), opschrift: d.opschrift, type: d.type, vervallen: d.vervallen, wijzigactie: d.wijzigactie }, this.isOpenedAnnotation(d) && (h("dso-annotation-output", { slot: "annotation", open: true, identifier: "test", onDsoClose: () => this.handleAnnotationToggle(d) }, h("span", { slot: "title" }, "Annotaties"), h("dso-slide-toggle", { checked: this.isCheckedSlideToggle(d), onDsoActiveChange: () => this.handleSelectableChange(d) }, "Delfzijl"))), this.showContent(d) && h(DocumentComponent, { path: [...path, d] }))))))));
+    };
+    this.showCanvas = false;
+    this.jsonFile = undefined;
+    this.openDefault = false;
+    this.response = undefined;
+    this.openOrClosed = [];
+    this.openedAnnotation = [];
+    this.filtered = [];
+    this.notApplicable = [];
+    this.activeAnnotationSelectables = [];
+  }
+  async jsonFileWatcher() {
+    this.openOrClosed = [];
+    await this.loadData();
+  }
+  async openDefaultWatcher() {
+    this.openOrClosed = [];
+    await this.loadData();
+  }
+  async componentDidLoad() {
+    await this.loadData();
+  }
+  getEmbeddedDocumentComponents(documentComponent) {
+    var _a, _b, _c;
+    return ((_b = (_a = documentComponent === null || documentComponent === void 0 ? void 0 : documentComponent._embedded) === null || _a === void 0 ? void 0 : _a.ontwerpTekststructuurDocumentComponenten) !== null && _b !== void 0 ? _b : (_c = documentComponent === null || documentComponent === void 0 ? void 0 : documentComponent._embedded) === null || _c === void 0 ? void 0 : _c.tekststructuurDocumentComponenten);
+  }
+  concatEmbeddedDocumentComponents(documentComponent) {
+    var _a;
+    const embeddedDocuments = [...((_a = this.getEmbeddedDocumentComponents(documentComponent)) !== null && _a !== void 0 ? _a : [])];
+    for (const d of embeddedDocuments) {
+      embeddedDocuments.push(...this.concatEmbeddedDocumentComponents(d));
+    }
+    return embeddedDocuments;
+  }
+  selectRandomDocumentComponents(documentComponent, exclude = []) {
+    const documentComponents = this.concatEmbeddedDocumentComponents(documentComponent).filter((d) => !exclude.includes(d));
+    const size = random(0, Math.floor(documentComponents.length / 10));
+    return sampleSize(documentComponents, size);
+  }
+  async loadData() {
+    var _a;
+    if (!this.jsonFile) {
+      this.response = undefined;
+      return;
+    }
+    const data = await fetch(this.jsonFile).then((r) => r.json());
+    const lichaam = (_a = this.getEmbeddedDocumentComponents(data)) === null || _a === void 0 ? void 0 : _a.find((documentComponent) => documentComponent.type === "LICHAAM");
+    if (lichaam) {
+      this.response = lichaam;
+      this.notApplicable = this.selectRandomDocumentComponents(lichaam);
+      this.filtered = this.selectRandomDocumentComponents(lichaam, this.notApplicable);
+    }
+  }
+  handleOpenToggle(_e, documentComponent) {
+    const isOpenOrClosed = this.openOrClosed.includes(documentComponent);
+    this.openOrClosed = !isOpenOrClosed
+      ? [...this.openOrClosed, documentComponent]
+      : this.openOrClosed.filter((d) => d !== documentComponent);
+  }
+  handleAnnotationToggle(documentComponent) {
+    this.openedAnnotation = this.isOpenedAnnotation(documentComponent)
+      ? this.openedAnnotation.filter((d) => d !== documentComponent)
+      : [...this.openedAnnotation, documentComponent];
+    if (!this.isOpen(documentComponent)) {
+      this.openOrClosed = [...this.openOrClosed, documentComponent];
+    }
+  }
+  handleSelectableChange(documentComponent) {
+    this.activeAnnotationSelectables = this.isCheckedSlideToggle(documentComponent)
+      ? this.activeAnnotationSelectables.filter((d) => d !== documentComponent)
+      : [...this.activeAnnotationSelectables, documentComponent];
+  }
+  handleOzonContentAnchorClick(e) {
+    this.dsotOzonContentAnchorClick.emit(e.detail);
+  }
+  isCheckedSlideToggle(documentComponent) {
+    return this.activeAnnotationSelectables.includes(documentComponent);
+  }
+  hasFilteredChildren(documentComponent) {
+    var _a, _b;
+    return (this.filtered.includes(documentComponent) ||
+      ((_b = (_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.some((d) => this.hasFilteredChildren(d))) !== null && _b !== void 0 ? _b : false));
+  }
+  isOpen(documentComponent) {
+    return documentComponent.type === "LID" || this.openDefault
+      ? !this.openOrClosed.includes(documentComponent)
+      : this.openOrClosed.includes(documentComponent);
+  }
+  isOpenedAnnotation(documentComponent) {
+    return this.openedAnnotation.includes(documentComponent);
+  }
+  isFiltered(documentComponent) {
+    return this.filtered.includes(documentComponent);
+  }
+  isNotApplicable(documentComponent) {
+    return this.notApplicable.includes(documentComponent);
+  }
+  hasNestedDraft(documentComponent) {
+    var _a, _b;
+    return ((_b = (_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.some((d) => !!d.bevatOntwerpInformatie || this.hasNestedDraft(d))) !== null && _b !== void 0 ? _b : false);
+  }
+  showContent(documentComponent) {
+    var _a;
+    return (this.isOpen(documentComponent) &&
+      !!(((_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.length) || documentComponent.inhoud));
+  }
+  render() {
+    const { DocumentComponent } = this;
+    return (h("dso-responsive-element", { class: "dso-document-components" }, this.response && h(DocumentComponent, { path: [this.response] })));
+  }
+  static get is() { return "dsot-document-component-demo"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["document-component.demo.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["document-component.demo.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "showCanvas": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Show canvas to where Document Component extends."
+        },
+        "attribute": "show-canvas",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "jsonFile": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Name of the file to load."
+        },
+        "attribute": "json-file",
+        "reflect": false
+      },
+      "openDefault": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The default state for all Document Components."
+        },
+        "attribute": "open-default",
+        "reflect": false,
+        "defaultValue": "false"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "response": {},
+      "openOrClosed": {},
+      "openedAnnotation": {},
+      "filtered": {},
+      "notApplicable": {},
+      "activeAnnotationSelectables": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "dsotOzonContentAnchorClick",
+        "name": "dsotOzonContentAnchorClick",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "To demo user interacting with IntRef or IntIoRef elements."
+        },
+        "complexType": {
+          "original": "DocumentComponentOzonContentAnchorClickEvent",
+          "resolved": "DocumentComponentOzonContentAnchorClickEvent",
+          "references": {
+            "DocumentComponentOzonContentAnchorClickEvent": {
+              "location": "import",
+              "path": "../document-component/document-component.models",
+              "id": "src/components/document-component/document-component.models.ts::DocumentComponentOzonContentAnchorClickEvent"
+            }
+          }
+        }
+      }];
+  }
+  static get watchers() {
+    return [{
+        "propName": "jsonFile",
+        "methodName": "jsonFileWatcher"
+      }, {
+        "propName": "openDefault",
+        "methodName": "openDefaultWatcher"
+      }];
+  }
+}
+//# sourceMappingURL=document-component.demo.js.map

package/dist/collection/components/document-component-demo/document-component.demo.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"document-component.demo.js","sourceRoot":"","sources":["../../../src/components/document-component-demo/document-component.demo.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, Component, ComponentInterface, State, Prop, Watch, Event, EventEmitter } from \"@stencil/core\";\r\nimport sampleSize from \"lodash.samplesize\";\r\nimport random from \"lodash.random\";\r\n\r\nimport {\r\n DocumentComponentOzonContentAnchorClickEvent,\r\n DocumentComponentOpenToggleEvent,\r\n} from \"../document-component/document-component.models\";\r\nimport { DsoDocumentComponentCustomEvent } from \"../../components\";\r\n\r\ninterface DocumentComponent {\r\n documentTechnischId: string;\r\n type?: string;\r\n labelXml?: string;\r\n nummerXml?: string;\r\n opschrift?: string;\r\n inhoud?: string;\r\n gereserveerd?: boolean;\r\n vervallen?: boolean;\r\n bevatOntwerpInformatie?: boolean;\r\n wijzigactie?: \"voegtoe\" | \"verwijder\" | \"nieuweContainer\" | \"verwijderContainer\";\r\n _embedded?: {\r\n ontwerpTekststructuurDocumentComponenten?: DocumentComponent[];\r\n tekststructuurDocumentComponenten?: DocumentComponent[];\r\n };\r\n}\r\n\r\n@Component({\r\n tag: \"dsot-document-component-demo\",\r\n scoped: true,\r\n styleUrl: \"document-component.demo.scss\",\r\n})\r\nexport class DocumentComponentDemo implements ComponentInterface {\r\n /**\r\n * Show canvas to where Document Component extends.\r\n */\r\n @Prop({ reflect: true })\r\n showCanvas = false;\r\n\r\n /**\r\n * Name of the file to load.\r\n */\r\n @Prop()\r\n jsonFile?: string;\r\n\r\n /**\r\n * The default state for all Document Components.\r\n */\r\n @Prop()\r\n openDefault = false;\r\n\r\n /**\r\n * To demo user interacting with IntRef or IntIoRef elements.\r\n */\r\n @Event()\r\n dsotOzonContentAnchorClick!: EventEmitter<DocumentComponentOzonContentAnchorClickEvent>;\r\n\r\n @State()\r\n response?: DocumentComponent;\r\n\r\n @State()\r\n openOrClosed: DocumentComponent[] = [];\r\n\r\n @State()\r\n openedAnnotation: DocumentComponent[] = [];\r\n\r\n @State()\r\n filtered: DocumentComponent[] = [];\r\n\r\n @State()\r\n notApplicable: DocumentComponent[] = [];\r\n\r\n @State()\r\n activeAnnotationSelectables: DocumentComponent[] = [];\r\n\r\n @Watch(\"jsonFile\")\r\n async jsonFileWatcher() {\r\n this.openOrClosed = [];\r\n\r\n await this.loadData();\r\n }\r\n\r\n @Watch(\"openDefault\")\r\n async openDefaultWatcher() {\r\n this.openOrClosed = [];\r\n\r\n await this.loadData();\r\n }\r\n\r\n async componentDidLoad(): Promise<void> {\r\n await this.loadData();\r\n }\r\n\r\n private getEmbeddedDocumentComponents(documentComponent: DocumentComponent | undefined) {\r\n return (\r\n documentComponent?._embedded?.ontwerpTekststructuurDocumentComponenten ??\r\n documentComponent?._embedded?.tekststructuurDocumentComponenten\r\n );\r\n }\r\n\r\n private concatEmbeddedDocumentComponents(documentComponent: DocumentComponent): DocumentComponent[] {\r\n const embeddedDocuments = [...(this.getEmbeddedDocumentComponents(documentComponent) ?? [])];\r\n\r\n for (const d of embeddedDocuments) {\r\n embeddedDocuments.push(...this.concatEmbeddedDocumentComponents(d));\r\n }\r\n\r\n return embeddedDocuments;\r\n }\r\n\r\n private selectRandomDocumentComponents(\r\n documentComponent: DocumentComponent,\r\n exclude: DocumentComponent[] = []\r\n ): DocumentComponent[] {\r\n const documentComponents = this.concatEmbeddedDocumentComponents(documentComponent).filter(\r\n (d) => !exclude.includes(d)\r\n );\r\n const size = random(0, Math.floor(documentComponents.length / 10));\r\n\r\n return sampleSize(documentComponents, size);\r\n }\r\n\r\n private async loadData() {\r\n if (!this.jsonFile) {\r\n this.response = undefined;\r\n\r\n return;\r\n }\r\n\r\n const data = await fetch(this.jsonFile).then((r) => r.json());\r\n const lichaam = this.getEmbeddedDocumentComponents(data)?.find(\r\n (documentComponent) => documentComponent.type === \"LICHAAM\"\r\n );\r\n\r\n if (lichaam) {\r\n this.response = lichaam;\r\n\r\n this.notApplicable = this.selectRandomDocumentComponents(lichaam);\r\n this.filtered = this.selectRandomDocumentComponents(lichaam, this.notApplicable);\r\n }\r\n }\r\n\r\n private handleOpenToggle(\r\n _e: DsoDocumentComponentCustomEvent<DocumentComponentOpenToggleEvent>,\r\n documentComponent: DocumentComponent\r\n ) {\r\n const isOpenOrClosed = this.openOrClosed.includes(documentComponent);\r\n\r\n this.openOrClosed = !isOpenOrClosed\r\n ? [...this.openOrClosed, documentComponent]\r\n : this.openOrClosed.filter((d) => d !== documentComponent);\r\n }\r\n\r\n private handleAnnotationToggle(documentComponent: DocumentComponent) {\r\n this.openedAnnotation = this.isOpenedAnnotation(documentComponent)\r\n ? this.openedAnnotation.filter((d) => d !== documentComponent)\r\n : [...this.openedAnnotation, documentComponent];\r\n\r\n if (!this.isOpen(documentComponent)) {\r\n this.openOrClosed = [...this.openOrClosed, documentComponent];\r\n }\r\n }\r\n\r\n private handleSelectableChange(documentComponent: DocumentComponent) {\r\n this.activeAnnotationSelectables = this.isCheckedSlideToggle(documentComponent)\r\n ? this.activeAnnotationSelectables.filter((d) => d !== documentComponent)\r\n : [...this.activeAnnotationSelectables, documentComponent];\r\n }\r\n\r\n private handleOzonContentAnchorClick(\r\n e: DsoDocumentComponentCustomEvent<DocumentComponentOzonContentAnchorClickEvent>\r\n ) {\r\n this.dsotOzonContentAnchorClick.emit(e.detail);\r\n }\r\n\r\n private isCheckedSlideToggle(documentComponent: DocumentComponent) {\r\n return this.activeAnnotationSelectables.includes(documentComponent);\r\n }\r\n\r\n private hasFilteredChildren(documentComponent: DocumentComponent): boolean {\r\n return (\r\n this.filtered.includes(documentComponent) ||\r\n (this.getEmbeddedDocumentComponents(documentComponent)?.some((d) => this.hasFilteredChildren(d)) ?? false)\r\n );\r\n }\r\n\r\n private isOpen(documentComponent: DocumentComponent): boolean {\r\n return documentComponent.type === \"LID\" || this.openDefault\r\n ? !this.openOrClosed.includes(documentComponent)\r\n : this.openOrClosed.includes(documentComponent);\r\n }\r\n\r\n private isOpenedAnnotation(documentComponent: DocumentComponent): boolean {\r\n return this.openedAnnotation.includes(documentComponent);\r\n }\r\n\r\n private isFiltered(documentComponent: DocumentComponent): boolean {\r\n return this.filtered.includes(documentComponent);\r\n }\r\n\r\n private isNotApplicable(documentComponent: DocumentComponent): boolean {\r\n return this.notApplicable.includes(documentComponent);\r\n }\r\n\r\n private hasNestedDraft(documentComponent: DocumentComponent): boolean {\r\n return (\r\n this.getEmbeddedDocumentComponents(documentComponent)?.some(\r\n (d) => !!d.bevatOntwerpInformatie || this.hasNestedDraft(d)\r\n ) ?? false\r\n );\r\n }\r\n\r\n private showContent(documentComponent: DocumentComponent): boolean {\r\n return (\r\n this.isOpen(documentComponent) &&\r\n !!(this.getEmbeddedDocumentComponents(documentComponent)?.length || documentComponent.inhoud)\r\n );\r\n }\r\n\r\n private DocumentComponent = ({ path }: DocumentComponentProps) => {\r\n const documentComponent = path.at(-1);\r\n\r\n const { DocumentComponent } = this;\r\n\r\n return (\r\n <ul>\r\n {documentComponent &&\r\n this.getEmbeddedDocumentComponents(documentComponent)?.map((d, i) => (\r\n <li key={d.documentTechnischId}>\r\n <dso-document-component\r\n annotated={i % 3 === 2}\r\n bevatOntwerpInformatie={!!d.bevatOntwerpInformatie}\r\n filtered={this.isOpen(d) ? this.isFiltered(d) : this.hasFilteredChildren(d)}\r\n genesteOntwerpInformatie={this.hasNestedDraft(d)}\r\n gereserveerd={d.gereserveerd}\r\n heading=\"h2\"\r\n inhoud={d.inhoud}\r\n label={d.labelXml}\r\n openAnnotation={this.isOpenedAnnotation(d)}\r\n notApplicable={this.isNotApplicable(d) || path.some((p) => this.isNotApplicable(p))}\r\n nummer={d.nummerXml}\r\n onDsoAnnotationToggle={() => this.handleAnnotationToggle(d)}\r\n onDsoOpenToggle={(e) => this.handleOpenToggle(e, d)}\r\n onDsoOzonContentAnchorClick={(e) => this.handleOzonContentAnchorClick(e)}\r\n open={this.isOpen(d)}\r\n opschrift={d.opschrift}\r\n type={d.type}\r\n vervallen={d.vervallen}\r\n wijzigactie={d.wijzigactie}\r\n >\r\n {this.isOpenedAnnotation(d) && (\r\n <dso-annotation-output\r\n slot=\"annotation\"\r\n open\r\n identifier=\"test\"\r\n onDsoClose={() => this.handleAnnotationToggle(d)}\r\n >\r\n <span slot=\"title\">Annotaties</span>\r\n <dso-slide-toggle\r\n checked={this.isCheckedSlideToggle(d)}\r\n onDsoActiveChange={() => this.handleSelectableChange(d)}\r\n >\r\n Delfzijl\r\n </dso-slide-toggle>\r\n </dso-annotation-output>\r\n )}\r\n {this.showContent(d) && <DocumentComponent path={[...path, d]} />}\r\n </dso-document-component>\r\n </li>\r\n ))}\r\n </ul>\r\n );\r\n };\r\n\r\n render() {\r\n const { DocumentComponent } = this;\r\n\r\n return (\r\n <dso-responsive-element class=\"dso-document-components\">\r\n {this.response && <DocumentComponent path={[this.response]} />}\r\n </dso-responsive-element>\r\n );\r\n }\r\n}\r\n\r\ninterface DocumentComponentProps {\r\n path: DocumentComponent[];\r\n}\r\n"]}

package/dist/collection/components/modal/modal.css CHANGED Viewed

@@ -23,7 +23,7 @@
 :host([fullscreen]) dialog .dso-dialog {
   display: flex;
   flex-direction: column;
-  max-inline-size: 100%;
+  inline-size: 100%;
   block-size: 100%;
 }
 :host([fullscreen]) dialog .dso-dialog > dso-scrollable {
@@ -42,7 +42,7 @@
   :host dialog .dso-dialog {
     display: flex;
     flex-direction: column;
-    max-inline-size: 100%;
+    inline-size: 100%;
     block-size: 100%;
   }
   :host dialog .dso-dialog > dso-scrollable {
@@ -93,7 +93,7 @@ button::-moz-focus-inner {
   background-color: rgba(255, 255, 255, 0.8);
 }
 .dso-modal .dso-dialog {
-  max-inline-size: 640px;
+  inline-size: 640px;
   background-color: #fff;
   opacity: 1;
   box-shadow: 0 8px 24px 0 rgba(25, 25, 25, 0.4);

package/dist/collection/components/ozon-content/nodes/al.node.js CHANGED Viewed

@@ -1,16 +1,33 @@
 import { h } from "@stencil/core";
 import { getNodeName } from "../get-node-name.function";
+import clsx from "clsx";
+function isNestedAl(path) {
+  return path.some((n) => {
+    const nodeName = getNodeName(n);
+    return nodeName === "Al" || nodeName === "Opschrift";
+  });
+}
 export class OzonContentAlNode {
   constructor() {
     this.name = "Al";
   }
-  render(node, { mapNodeToJsx, path }) {
-    const nestedAl = path.some((n) => {
-      const nodeName = getNodeName(n);
-      return nodeName === "Al" || nodeName === "Opschrift";
-    });
-    const content = mapNodeToJsx(node.childNodes);
-    return nestedAl ? h("span", { role: "paragraph" }, content) : h("p", null, content);
+  render(node, { mapNodeToJsx, path, inline }) {
+    let content = mapNodeToJsx(node.childNodes);
+    const wijzigactie = node.getAttribute("wijzigactie");
+    const className = clsx({ [`wijzigactie-${wijzigactie}`]: !!wijzigactie }) || undefined;
+    if (inline || isNestedAl(path)) {
+      content = (h("span", { role: "paragraph", class: className }, content));
+    }
+    else {
+      content = h("p", { class: className }, content);
+    }
+    if (wijzigactie === "voegtoe") {
+      content = h("ins", null, content);
+    }
+    else if (wijzigactie === "verwijder") {
+      content = h("del", null, content);
+    }
+    return content;
   }
 }
 //# sourceMappingURL=al.node.js.map

package/dist/collection/components/ozon-content/nodes/al.node.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"al.node.js","sourceRoot":"","sources":["../../../../src/components/ozon-content/nodes/al.node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAElC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;~~AAIxD~~,MAAM,OAAO,iBAAiB;EAA9B;IACE,SAAI,GAAG,IAAI,CAAC;~~EAad~~,CAAC;~~EAXC~~,MAAM,CAAC,IAAa,EAAE,EAAE,YAAY,EAAE,IAAI,EAA0B;~~IAClE~~,~~MAAM~~,~~QAAQ~~,GAAG,~~IAAI~~,CAAC,IAAI,CAAC,CAAC,CAAC~~,EAAE,EAAE~~;~~MAC/B~~,MAAM,~~QAAQ~~,GAAG,~~WAAW~~,CAAC,CAAC,CAAC,CAAC;~~MAEhC~~,~~OAAO~~,~~QAAQ~~,~~KAAK~~,IAAI,~~IAAI~~,~~QAAQ~~,~~KAAK~~,WAAW,~~CAAC;IACvD~~,CAAC,CAAC,CAAC~~;IAEH~~,~~MAAM~~,~~OAAO~~,~~GAAG~~,~~YAAY~~,CAAC,IAAI,~~CAAC~~,UAAU,CAAC,CAAC;~~IAE9C~~,OAAO,~~QAAQ~~,~~CAAC~~,~~CAAC,CAAC,~~YAAM,IAAI,EAAC,WAAW,~~IAAE~~,OAAO,~~CAAQ~~,CAAC,CAAC,CAAC,~~aAAI~~,OAAO,~~CAAK~~,CAAC;~~EAC/E~~,CAAC;CACF","sourcesContent":["import { h } from \"@stencil/core\";\r\n\r\nimport { getNodeName } from \"../get-node-name.function\";\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentAlNode implements OzonContentNode {\r\n name = \"Al\";\r\n\r\n render(node: Element, { mapNodeToJsx, path }: OzonContentNodeContext) {\r\n ~~const~~ ~~nestedAl~~ = ~~path~~.~~some((~~n) => {\r\n const ~~nodeName~~ = ~~getNodeName~~(n);\r\n\r\n ~~return~~ ~~nodeName~~ ~~===~~ \~~"Al~~\" \|\| ~~nodeName~~ ~~=== \~~"~~Opschrift~~\";\r\n });\r\n\r\n ~~const~~ content = ~~mapNodeToJsx(node.childNodes);\~~r\n\r\n ~~return~~ ~~nestedAl~~ ? ~~<span role=\~~"~~paragraph~~\">{content}</~~span>~~ : <p>{content}</p>;\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"al.node.js","sourceRoot":"","sources":["../../../../src/components/ozon-content/nodes/al.node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAElC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAGxD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,SAAS,UAAU,CAAC,IAAY;EAC9B,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE;IACrB,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC;IAEhC,OAAO,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,WAAW,CAAC;EACvD,CAAC,CAAC,CAAC;AACL,CAAC;AAED,MAAM,OAAO,iBAAiB;EAA9B;IACE,SAAI,GAAG,IAAI,CAAC;EA0Bd,CAAC;EAxBC,MAAM,CAAC,IAAa,EAAE,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAA0B;IAC1E,IAAI,OAAO,GAAG,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IAC5C,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;IAErD,MAAM,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,eAAe,WAAW,EAAE,CAAC,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC,IAAI,SAAS,CAAC;IAEvF,IAAI,MAAM,IAAI,UAAU,CAAC,IAAI,CAAC,EAAE;MAC9B,OAAO,GAAG,CACR,YAAM,IAAI,EAAC,WAAW,EAAC,KAAK,EAAE,SAAS,IACpC,OAAO,CACH,CACR,CAAC;KACH;SAAM;MACL,OAAO,GAAG,SAAG,KAAK,EAAE,SAAS,IAAG,OAAO,CAAK,CAAC;KAC9C;IAED,IAAI,WAAW,KAAK,SAAS,EAAE;MAC7B,OAAO,GAAG,eAAM,OAAO,CAAO,CAAC;KAChC;SAAM,IAAI,WAAW,KAAK,WAAW,EAAE;MACtC,OAAO,GAAG,eAAM,OAAO,CAAO,CAAC;KAChC;IAED,OAAO,OAAO,CAAC;EACjB,CAAC;CACF","sourcesContent":["import { h } from \"@stencil/core\";\r\n\r\nimport { getNodeName } from \"../get-node-name.function\";\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\nimport clsx from \"clsx\";\r\n\r\nfunction isNestedAl(path: Node[]) {\r\n return path.some((n) => {\r\n const nodeName = getNodeName(n);\r\n\r\n return nodeName === \"Al\" \|\| nodeName === \"Opschrift\";\r\n });\r\n}\r\n\r\nexport class OzonContentAlNode implements OzonContentNode {\r\n name = \"Al\";\r\n\r\n render(node: Element, { mapNodeToJsx, path, inline }: OzonContentNodeContext) {\r\n let content = mapNodeToJsx(node.childNodes);\r\n const wijzigactie = node.getAttribute(\"wijzigactie\");\r\n\r\n const className = clsx({ [`wijzigactie-${wijzigactie}`]: !!wijzigactie }) \|\| undefined;\r\n\r\n if (inline \|\| isNestedAl(path)) {\r\n content = (\r\n <span role=\"paragraph\" class={className}>\r\n {content}\r\n </span>\r\n );\r\n } else {\r\n content = <p class={className}>{content}</p>;\r\n }\r\n\r\n if (wijzigactie === \"voegtoe\") {\r\n content = <ins>{content}</ins>;\r\n } else if (wijzigactie === \"verwijder\") {\r\n content = <del>{content}</del>;\r\n }\r\n\r\n return content;\r\n }\r\n}\r\n"]}

package/dist/collection/components/ozon-content/nodes/ext-ref.node.js CHANGED Viewed

@@ -1,11 +1,13 @@
 import { h } from "@stencil/core";
+import kebabCase from "lodash.kebabcase";
 export class OzonContentExtRefNode {
   constructor() {
     this.name = ["ExtRef", "ExtIoRef"];
   }
   render(node, { mapNodeToJsx }) {
     const href = node.tagName === "ExtIoRef" ? node.getAttribute("href") : node.getAttribute("ref");
-    return (h("a", { target: "_blank", rel: "noopener noreferrer", href: href !== null && href !== void 0 ? href : undefined }, h("span", { class: "sr-only" }, "opent in nieuw venster "), mapNodeToJsx(node.childNodes)));
+    const className = kebabCase(node.tagName);
+    return (h("a", { target: "_blank", rel: "noopener noreferrer", href: href !== null && href !== void 0 ? href : undefined, class: className }, h("span", { class: "sr-only" }, "opent in nieuw venster "), mapNodeToJsx(node.childNodes), h("dso-icon", { icon: "external-link" })));
   }
 }
 //# sourceMappingURL=ext-ref.node.js.map

package/dist/collection/components/ozon-content/nodes/ext-ref.node.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ext-ref.node.js","sourceRoot":"","sources":["../../../../src/components/ozon-content/nodes/ext-ref.node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;~~AAKlC~~,MAAM,OAAO,qBAAqB;EAAlC;IACE,SAAI,GAAG,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;~~EAYhC~~,CAAC;~~EAVC~~,MAAM,CAAC,IAAa,EAAE,EAAE,YAAY,EAA0B;IAC5D,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;~~IAEhG~~,OAAO,CACL,SAAG,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,IAAI,EAAE,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,SAAS;~~MAClE~~,YAAM,KAAK,EAAC,SAAS,8BAA+B;MACnD,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,~~CAC5B~~,CACL,CAAC;EACJ,CAAC;CACF","sourcesContent":["import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentExtRefNode implements OzonContentNode {\r\n name = [\"ExtRef\", \"ExtIoRef\"];\r\n\r\n render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n const href = node.tagName === \"ExtIoRef\" ? node.getAttribute(\"href\") : node.getAttribute(\"ref\");\r\n\r\n return (\r\n <a target=\"_blank\" rel=\"noopener noreferrer\" href={href ?? undefined}>\r\n <span class=\"sr-only\">opent in nieuw venster </span>\r\n {mapNodeToJsx(node.childNodes)}\r\n </a>\r\n );\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"ext-ref.node.js","sourceRoot":"","sources":["../../../../src/components/ozon-content/nodes/ext-ref.node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,SAAS,MAAM,kBAAkB,CAAC;AAKzC,MAAM,OAAO,qBAAqB;EAAlC;IACE,SAAI,GAAG,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;EAchC,CAAC;EAZC,MAAM,CAAC,IAAa,EAAE,EAAE,YAAY,EAA0B;IAC5D,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IAChG,MAAM,SAAS,GAAG,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAE1C,OAAO,CACL,SAAG,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,IAAI,EAAE,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,SAAS,EAAE,KAAK,EAAE,SAAS;MACpF,YAAM,KAAK,EAAC,SAAS,8BAA+B;MACnD,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;MAC9B,gBAAU,IAAI,EAAC,eAAe,GAAY,CACxC,CACL,CAAC;EACJ,CAAC;CACF","sourcesContent":["import { h } from \"@stencil/core\";\r\nimport kebabCase from \"lodash.kebabcase\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentExtRefNode implements OzonContentNode {\r\n name = [\"ExtRef\", \"ExtIoRef\"];\r\n\r\n render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n const href = node.tagName === \"ExtIoRef\" ? node.getAttribute(\"href\") : node.getAttribute(\"ref\");\r\n const className = kebabCase(node.tagName);\r\n\r\n return (\r\n <a target=\"_blank\" rel=\"noopener noreferrer\" href={href ?? undefined} class={className}>\r\n <span class=\"sr-only\">opent in nieuw venster </span>\r\n {mapNodeToJsx(node.childNodes)}\r\n <dso-icon icon=\"external-link\"></dso-icon>\r\n </a>\r\n );\r\n }\r\n}\r\n"]}

package/dist/collection/components/ozon-content/nodes/nieuwe-tekst.node.js CHANGED Viewed

@@ -4,7 +4,7 @@ export class OzonContentNieuweTekstNode {
     this.name = "NieuweTekst";
   }
   render(node, { mapNodeToJsx }) {
-    return h("ins", null, mapNodeToJsx(node.childNodes));
+    return h("ins", { class: "nieuwe-tekst" }, mapNodeToJsx(node.childNodes));
   }
 }
 //# sourceMappingURL=nieuwe-tekst.node.js.map

package/dist/collection/components/ozon-content/nodes/nieuwe-tekst.node.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nieuwe-tekst.node.js","sourceRoot":"","sources":["../../../../src/components/ozon-content/nodes/nieuwe-tekst.node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAKlC,MAAM,OAAO,0BAA0B;EAAvC;IACE,SAAI,GAAG,aAAa,CAAC;EAKvB,CAAC;EAHC,MAAM,CAAC,IAAa,EAAE,EAAE,YAAY,EAA0B;IAC5D,OAAO,~~eAAM~~,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAO,CAAC;~~EACpD~~,CAAC;CACF","sourcesContent":["import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentNieuweTekstNode implements OzonContentNode {\r\n name = \"NieuweTekst\";\r\n\r\n render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n return <ins>{mapNodeToJsx(node.childNodes)}</ins>;\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"nieuwe-tekst.node.js","sourceRoot":"","sources":["../../../../src/components/ozon-content/nodes/nieuwe-tekst.node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAKlC,MAAM,OAAO,0BAA0B;EAAvC;IACE,SAAI,GAAG,aAAa,CAAC;EAKvB,CAAC;EAHC,MAAM,CAAC,IAAa,EAAE,EAAE,YAAY,EAA0B;IAC5D,OAAO,WAAK,KAAK,EAAC,cAAc,IAAE,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAO,CAAC;EACzE,CAAC;CACF","sourcesContent":["import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentNieuweTekstNode implements OzonContentNode {\r\n name = \"NieuweTekst\";\r\n\r\n render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n return <ins class=\"nieuwe-tekst\">{mapNodeToJsx(node.childNodes)}</ins>;\r\n }\r\n}\r\n"]}

package/dist/collection/components/ozon-content/nodes/opschrift.node.js CHANGED Viewed

@@ -4,7 +4,15 @@ export class OzonContentOpschriftNode {
     this.name = "Opschrift";
   }
   render(node, { mapNodeToJsx }) {
-    return h(Fragment, null, mapNodeToJsx(node.childNodes));
+    let content = mapNodeToJsx(node.childNodes);
+    const wijzigactie = node.getAttribute("wijzigactie");
+    if (wijzigactie === "voegtoe") {
+      content = h("ins", { class: "nieuwe-tekst" }, content);
+    }
+    else if (wijzigactie === "verwijder") {
+      content = h("del", { class: "verwijderde-tekst" }, content);
+    }
+    return h(Fragment, null, content);
   }
 }
 //# sourceMappingURL=opschrift.node.js.map

package/dist/collection/components/ozon-content/nodes/opschrift.node.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"opschrift.node.js","sourceRoot":"","sources":["../../../../src/components/ozon-content/nodes/opschrift.node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAK5C,MAAM,OAAO,wBAAwB;EAArC;IACE,SAAI,GAAG,WAAW,CAAC;~~EAKrB~~,CAAC;~~EAHC~~,MAAM,CAAC,IAAa,EAAE,EAAE,YAAY,EAA0B;IAC5D,OAAO,~~EAAC~~,~~QAAQ~~,~~QAAE~~,YAAY,CAAC,IAAI,CAAC,~~UAAU~~,CAAC,~~CAAY~~,CAAC;~~EAC9D~~,CAAC;CACF","sourcesContent":["import { h, Fragment } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentOpschriftNode implements OzonContentNode {\r\n name = \"Opschrift\";\r\n\r\n render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n ~~return~~ ~~<Fragment>{~~mapNodeToJsx(node.childNodes)}</~~Fragment~~>;\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"opschrift.node.js","sourceRoot":"","sources":["../../../../src/components/ozon-content/nodes/opschrift.node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAK5C,MAAM,OAAO,wBAAwB;EAArC;IACE,SAAI,GAAG,WAAW,CAAC;EAcrB,CAAC;EAZC,MAAM,CAAC,IAAa,EAAE,EAAE,YAAY,EAA0B;IAC5D,IAAI,OAAO,GAAG,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IAC5C,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;IAErD,IAAI,WAAW,KAAK,SAAS,EAAE;MAC7B,OAAO,GAAG,WAAK,KAAK,EAAC,cAAc,IAAE,OAAO,CAAO,CAAC;KACrD;SAAM,IAAI,WAAW,KAAK,WAAW,EAAE;MACtC,OAAO,GAAG,WAAK,KAAK,EAAC,mBAAmB,IAAE,OAAO,CAAO,CAAC;KAC1D;IAED,OAAO,kBAAG,OAAO,CAAI,CAAC;EACxB,CAAC;CACF","sourcesContent":["import { h, Fragment } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentOpschriftNode implements OzonContentNode {\r\n name = \"Opschrift\";\r\n\r\n render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n let content = mapNodeToJsx(node.childNodes);\r\n const wijzigactie = node.getAttribute(\"wijzigactie\");\r\n\r\n if (wijzigactie === \"voegtoe\") {\r\n content = <ins class=\"nieuwe-tekst\">{content}</ins>;\r\n } else if (wijzigactie === \"verwijder\") {\r\n content = <del class=\"verwijderde-tekst\">{content}</del>;\r\n }\r\n\r\n return <>{content}</>;\r\n }\r\n}\r\n"]}

package/dist/collection/components/ozon-content/nodes/table.node/table.node.js CHANGED Viewed

@@ -28,8 +28,7 @@ export class OzonContentTableNode {
     const { caption, colspecs, headRows, bodyRows, editAction } = mapData(node);
     const bron = Array.from(node.childNodes).find((n) => getNodeName(n) === "Bron");
     return (h("dso-table", null, h("table", Object.assign({ class: clsx("table dso-table-vertical-lines", {
-        "dso-del": editAction === "verwijder",
-        "dso-ins": editAction === "voegtoe",
+        [`wijzigactie-${editAction}`]: editAction,
       }) }, (bron ? { "aria-describedby": this.id } : {})), caption && h("caption", null, caption), colspecs && h(Colgroup, { colspecs: colspecs }), headRows.length > 0 && (h("thead", null, h(Rows, { rows: headRows, colspecs: colspecs, context: context }))), bodyRows.length > 0 && (h("tbody", null, h(Rows, { rows: bodyRows, colspecs: colspecs, context: context })))), bron && h("div", { id: this.id }, context.mapNodeToJsx(bron))));
   }
 }