@dso-toolkit/core 101.0.0 → 101.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bundle/dso-document-component.js +1 -1
- package/dist/bundle/dso-ozon-content.js +1 -1
- package/dist/bundle/dsot-document-component-demo.js +3 -3
- package/dist/bundle/{p-Dv0849Rl.js → p-BF2e1Voi.js} +8 -6
- package/dist/bundle/{p-D3aWEfZN.js → p-CuUQy5lD.js} +11 -2
- package/dist/cjs/dso-alert_7.cjs.entry.js +11 -2
- package/dist/cjs/dso-annotation-locatie_2.cjs.entry.js +7 -5
- package/dist/cjs/dsot-document-component-demo.cjs.entry.js +1 -1
- package/dist/collection/components/document-component/document-component.js +8 -6
- package/dist/collection/components/document-component-demo/document-component.demo.js +2 -2
- package/dist/collection/components/ozon-content/nodes/ext-ref.node.js +12 -2
- package/dist/collection/components/ozon-content/ozon-content.js +1 -1
- package/dist/components/document-component.js +1 -1
- package/dist/components/dsot-document-component-demo.js +1 -1
- package/dist/components/ozon-content.js +1 -1
- package/dist/dso-toolkit/dso-toolkit.esm.js +1 -1
- package/dist/dso-toolkit/p-58c0e2ef.entry.js +1 -0
- package/dist/dso-toolkit/{p-37c83fa7.entry.js → p-83ab25e2.entry.js} +1 -1
- package/dist/dso-toolkit/p-bc3eb1dd.entry.js +1 -0
- package/dist/esm/dso-alert_7.entry.js +11 -2
- package/dist/esm/dso-annotation-locatie_2.entry.js +7 -5
- package/dist/esm/dsot-document-component-demo.entry.js +1 -1
- package/dist/types/components/document-component/document-component.d.ts +1 -1
- package/dist/types/components/document-component-demo/document-component.demo.d.ts +2 -1
- package/dist/types/components/ozon-content/nodes/ext-ref.node.d.ts +1 -1
- package/dist/types/components/ozon-content/ozon-content.interfaces.d.ts +9 -1
- package/dist/types/components.d.ts +2 -2
- package/package.json +3 -3
- package/dist/dso-toolkit/p-b27d50c9.entry.js +0 -1
- package/dist/dso-toolkit/p-de86de0a.entry.js +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { D as DocumentComponent, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { D as DocumentComponent, d as defineCustomElement$1 } from './p-BF2e1Voi.js';
|
|
2
2
|
|
|
3
3
|
const DsoDocumentComponent = DocumentComponent;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, t as transformTag } from './p-DtUeWj74.js';
|
|
2
|
-
import { g as getDefaultExportFromCjs, c as commonjsGlobal, d as defineCustomElement$a } from './p-
|
|
2
|
+
import { g as getDefaultExportFromCjs, c as commonjsGlobal, d as defineCustomElement$a } from './p-CuUQy5lD.js';
|
|
3
3
|
import { d as defineCustomElement$j } from './p-BHAfq_R9.js';
|
|
4
4
|
import { d as defineCustomElement$i } from './p-DdHRX4cC.js';
|
|
5
5
|
import { d as defineCustomElement$h } from './p-BoEv7D0u.js';
|
|
6
|
-
import { d as defineCustomElement$g } from './p-
|
|
6
|
+
import { d as defineCustomElement$g } from './p-BF2e1Voi.js';
|
|
7
7
|
import { d as defineCustomElement$f } from './p-DixhcduG.js';
|
|
8
8
|
import { d as defineCustomElement$e } from './p-B1sfJaTU.js';
|
|
9
9
|
import { d as defineCustomElement$d } from './p-D09qaSTl.js';
|
|
@@ -1872,7 +1872,7 @@ const DocumentComponentDemo = /*@__PURE__*/ proxyCustomElement(class DocumentCom
|
|
|
1872
1872
|
}
|
|
1873
1873
|
render() {
|
|
1874
1874
|
const { DocumentComponent, MenuButton } = this;
|
|
1875
|
-
return (h("dso-responsive-element", { key: '
|
|
1875
|
+
return (h("dso-responsive-element", { key: '325c3f0c6cae4feecaf9e01fe74fc602a653f137', class: "dso-document-components" }, h("div", { key: 'df6ff8a61e2fefc28b9dace9ea88fcc2b6f0009e', class: "dso-navbar" }, h("ul", { key: '6b44f5260a57c2a296068aa9d122c31e3d8d6502', class: "dso-nav dso-nav-sub" }, this.getEmbeddedDocumentComponents(this.response)?.documentComponents?.map((d) => (h("li", { class: this.document === d ? "dso-active" : undefined }, h(MenuButton, { documentComponent: d })))))), this.document && h(DocumentComponent, { key: 'fd300e2da9b2e29b46e29c3108e78f609e8b4e40', path: [this.document] })));
|
|
1876
1876
|
}
|
|
1877
1877
|
static get watchers() { return {
|
|
1878
1878
|
"jsonFile": [{
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { h, p as proxyCustomElement, H, d as createEvent, F as Fragment, c as Host, t as transformTag } from './p-DtUeWj74.js';
|
|
2
|
-
import { p as parseXml, a as parseWijzigactieFromNode, M as MarkText, d as defineCustomElement$6 } from './p-
|
|
2
|
+
import { p as parseXml, a as parseWijzigactieFromNode, M as MarkText, d as defineCustomElement$6 } from './p-CuUQy5lD.js';
|
|
3
3
|
import { i as isModifiedEvent } from './p-Hgv-pDpy.js';
|
|
4
4
|
import { d as defineCustomElement$d } from './p-BHAfq_R9.js';
|
|
5
5
|
import { d as defineCustomElement$c } from './p-BoEv7D0u.js';
|
|
@@ -146,7 +146,9 @@ const DocumentComponent = /*@__PURE__*/ proxyCustomElement(class DocumentCompone
|
|
|
146
146
|
});
|
|
147
147
|
break;
|
|
148
148
|
case "IntRef":
|
|
149
|
-
|
|
149
|
+
case "ExtRef":
|
|
150
|
+
case "ExtIoRef":
|
|
151
|
+
this.dsoOzonContentClick.emit({ originalEvent: event, ozonContentClick: detail });
|
|
150
152
|
break;
|
|
151
153
|
default:
|
|
152
154
|
return;
|
|
@@ -243,17 +245,17 @@ const DocumentComponent = /*@__PURE__*/ proxyCustomElement(class DocumentCompone
|
|
|
243
245
|
this.alternativeTitle ||
|
|
244
246
|
this.label ||
|
|
245
247
|
this.annotated);
|
|
246
|
-
return (h(Host, { key: '
|
|
247
|
-
(this.mark && this.alternativeTitle && (h(MarkText, { mark: this.mark && ((text) => this.mark?.(text, "alternativeTitle")), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), h(AantekenStatus, { key: '
|
|
248
|
+
return (h(Host, { key: '4be20ab7aee103b4fa74716e330d8f3bb303a7a2', "not-collapsible": !collapsible }, showHeading && (h("div", { key: 'ad0bb0c895f034617dcebb0b7a5e169e275933cd', class: "heading-container", part: "_heading-container" }, this.wijzigactie && h("span", { key: '019af6b3cd888664dcb3a61c56ef370aac23e6b9', class: "editaction-label" }, this.wijzigactieLabel, ":"), h("div", { key: '3332aa7cd5bc63f595efaf28f8e85c47223b9388', class: "heading" }, h(Heading, { key: '4a9eb6dcafff4f27dc54adb9e25f256d93807a19', headingLevel: this.headingLevel, class: "heading-element", onClick: this.alternativeTitle ? this.handleHeadingClick : undefined, mode: this.mode, href: this.href }, collapsible && this.mode === "document" && (h("dso-icon-button", { key: '99d66b2be1f939c7351ce161855476b2603d64c1', label: this.open ? "Invouwen" : "Uitvouwen", class: "toggle-button", expanded: this.open, icon: this.open ? "chevron-down" : "chevron-right", variant: "tertiary", onDsoClick: (e) => this.handleHeadingClick(e.detail.originalEvent) })), h("div", { key: 'ae0f71c453c4b355e019f26c887dac9c2bf28e21' }, this.notApplicable && h("span", { key: 'dc88588bf92a9a427aef1b0357e1cc5dd6b81fb6', class: "sr-only" }, "Niet van toepassing:"), this._kop ? (h("dso-ozon-content", { class: "kop", content: this._kop, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "kop")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "kop" }), inline: true, urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })) : (h("span", { class: "alternative-title" }, (!this.mark && this.alternativeTitle) ||
|
|
249
|
+
(this.mark && this.alternativeTitle && (h(MarkText, { mark: this.mark && ((text) => this.mark?.(text, "alternativeTitle")), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), h(AantekenStatus, { key: 'c8c11b3cb466776aa48f83c6fb7465cee27d0998', gereserveerd: this._gereserveerd, vervallen: this._vervallen }))), this.recursiveToggle !== undefined && this.open && this.mode === "document" && (h("dso-icon-button", { key: '64c3a71fad6bbbe6189201864b824266b5a1576b', label: this.recursiveToggle === true ? "Verberg onderliggende artikelen" : "Toon onderliggende artikelen", class: "recursive-toggle", expanded: this.recursiveToggle === true, icon: this.recursiveToggle === true ? "eye" : "eye-slash", variant: "tertiary", onDsoClick: (e) => this.handleRecursiveToggleClick(e.detail.originalEvent) })), this.showBadge() && (h(Fragment, { key: 'c9636820ae958525d71476f9de0419c000635535' }, h("dso-badge", { key: '3c700b6a68b9b658804ade20c189ed20f8356a54', status: this.badgeStatus, label: this.badgeTooltip ? "Toon toelichting" : undefined }, this.badge, this.badgeTooltip && h("div", { key: '7a1356ab6bbe892c09a194434d9b87090c275461', slot: "toggletip" }, this.badgeTooltip)))), (this.label || this.annotated) && (h("div", { key: '15039b5537c26a4821f8cfb193fce8c576e05687', class: "addons" }, this.label && (h("dso-label", { key: '1c04e2cb9d47a420a352f1d230440886360f8228', status: this.labelStatus, compact: true }, this.label)), this.annotated && this.mode === "document" && (h("dso-icon-button", { key: 'e91a3f5347d50a2fc1b5c9e16978dccb92188180', label: `Kenmerken en kaartgegevens ${this.openAnnotation ? "verbergen" : "tonen"}`, icon: "label", expanded: this.openAnnotation, variant: "tertiary", onDsoClick: (e) => this.dsoAnnotationToggle.emit({
|
|
248
250
|
current: this.openAnnotation,
|
|
249
251
|
next: !this.openAnnotation,
|
|
250
252
|
scrollRef: this.host,
|
|
251
253
|
originalEvent: e.detail.originalEvent,
|
|
252
|
-
}) }))))))), this.openAnnotation && (h("div", { key: '
|
|
254
|
+
}) }))))))), this.openAnnotation && (h("div", { key: '38471391f4abddc9ac61665449e58e32fb8a349d', class: "annotation-container", part: "_annotation-container", role: "dialog", "aria-labelledby": "annotations-heading" }, h("dso-panel", { key: 'fe3aa98ca07fe542470d00c97114ae049fc7505a', id: "annotations", onDsoCloseClick: (e) => this.dsoAnnotationToggle.emit({
|
|
253
255
|
current: true,
|
|
254
256
|
next: false,
|
|
255
257
|
originalEvent: e,
|
|
256
|
-
}), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, h("h2", { key: '
|
|
258
|
+
}), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, h("h2", { key: 'abd850d5dc9968e99eddd82dd83d910a6a5d9c4c', id: "annotations-heading", slot: "heading" }, "Kenmerken en kaart"), h("slot", { key: '1fa41e97bcf08136c9bf04d45ceb17bc4890e011', name: "annotations" })))), this.open && (this._inhoud || this._gereserveerd || this._vervallen) && this.mode === "document" && (h("div", { key: '0724d483c74eb4d9a5bf98df1334a43c226dcf55', class: "content", part: "_content" }, h(AantekenAlert, { key: 'a0aa3ed13249655d663eb00e8fe4251c6beaefd4', gereserveerd: this._gereserveerd, vervallen: this._vervallen }), this._inhoud && (h("dso-ozon-content", { key: '9c66a737d583952bcf446069e946eb80d5874e5e', content: this._inhoud, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "inhoud")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "inhoud" }), urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })))), h("div", { key: 'f35afe9004c21d7a273b981473ff2503b2d4c42d', class: "children-container", part: "_children-container" }, h("slot", { key: '701ae6f0277914e8580c0591a73812c46dbd2f33' }))));
|
|
257
259
|
}
|
|
258
260
|
get host() { return this; }
|
|
259
261
|
static get style() { return documentComponentCss(); }
|
|
@@ -604,7 +604,7 @@ class OzonContentExtRefNode {
|
|
|
604
604
|
constructor() {
|
|
605
605
|
this.name = ["ExtRef", "ExtIoRef"];
|
|
606
606
|
}
|
|
607
|
-
render(node, { mapNodeToJsx, urlResolver }) {
|
|
607
|
+
render(node, { mapNodeToJsx, emitClick, urlResolver }) {
|
|
608
608
|
const className = kebabCase(node.tagName);
|
|
609
609
|
const ref = node.getAttribute("ref");
|
|
610
610
|
const name = node.tagName === "ExtRef" ? "ExtRef" : "ExtIoRef";
|
|
@@ -612,7 +612,16 @@ class OzonContentExtRefNode {
|
|
|
612
612
|
return mapNodeToJsx(node.childNodes);
|
|
613
613
|
}
|
|
614
614
|
const href = urlResolver ? urlResolver(name, "ref", ref, node) : ref;
|
|
615
|
-
|
|
615
|
+
const handleExtRefClick = (event) => {
|
|
616
|
+
emitClick({
|
|
617
|
+
type: name,
|
|
618
|
+
node,
|
|
619
|
+
originalEvent: event,
|
|
620
|
+
isModifiedEvent: isModifiedEvent(event),
|
|
621
|
+
href: href ?? undefined,
|
|
622
|
+
});
|
|
623
|
+
};
|
|
624
|
+
return (h("a", { target: "_blank", rel: "noopener noreferrer", href: href ?? undefined, class: className, title: "Opent andere website in nieuw tabblad", onClick: handleExtRefClick }, h("span", null, mapNodeToJsx(node.childNodes)), h("dso-icon", { icon: "external-link" })));
|
|
616
625
|
}
|
|
617
626
|
}
|
|
618
627
|
|
|
@@ -813,7 +813,7 @@ class OzonContentExtRefNode {
|
|
|
813
813
|
constructor() {
|
|
814
814
|
this.name = ["ExtRef", "ExtIoRef"];
|
|
815
815
|
}
|
|
816
|
-
render(node, { mapNodeToJsx, urlResolver }) {
|
|
816
|
+
render(node, { mapNodeToJsx, emitClick, urlResolver }) {
|
|
817
817
|
const className = kebabCase(node.tagName);
|
|
818
818
|
const ref = node.getAttribute("ref");
|
|
819
819
|
const name = node.tagName === "ExtRef" ? "ExtRef" : "ExtIoRef";
|
|
@@ -821,7 +821,16 @@ class OzonContentExtRefNode {
|
|
|
821
821
|
return mapNodeToJsx(node.childNodes);
|
|
822
822
|
}
|
|
823
823
|
const href = urlResolver ? urlResolver(name, "ref", ref, node) : ref;
|
|
824
|
-
|
|
824
|
+
const handleExtRefClick = (event) => {
|
|
825
|
+
emitClick({
|
|
826
|
+
type: name,
|
|
827
|
+
node,
|
|
828
|
+
originalEvent: event,
|
|
829
|
+
isModifiedEvent: isModifiedEvent.isModifiedEvent(event),
|
|
830
|
+
href: href ?? undefined,
|
|
831
|
+
});
|
|
832
|
+
};
|
|
833
|
+
return (index.h("a", { target: "_blank", rel: "noopener noreferrer", href: href ?? undefined, class: className, title: "Opent andere website in nieuw tabblad", onClick: handleExtRefClick }, index.h("span", null, mapNodeToJsx(node.childNodes)), index.h("dso-icon", { icon: "external-link" })));
|
|
825
834
|
}
|
|
826
835
|
}
|
|
827
836
|
|
|
@@ -156,7 +156,9 @@ const DocumentComponent = class {
|
|
|
156
156
|
});
|
|
157
157
|
break;
|
|
158
158
|
case "IntRef":
|
|
159
|
-
|
|
159
|
+
case "ExtRef":
|
|
160
|
+
case "ExtIoRef":
|
|
161
|
+
this.dsoOzonContentClick.emit({ originalEvent: event, ozonContentClick: detail });
|
|
160
162
|
break;
|
|
161
163
|
default:
|
|
162
164
|
return;
|
|
@@ -253,17 +255,17 @@ const DocumentComponent = class {
|
|
|
253
255
|
this.alternativeTitle ||
|
|
254
256
|
this.label ||
|
|
255
257
|
this.annotated);
|
|
256
|
-
return (index.h(index.Host, { key: '
|
|
257
|
-
(this.mark && this.alternativeTitle && (index.h(parseWijzigactieFromNode_function.MarkText, { mark: this.mark && ((text) => this.mark?.(text, "alternativeTitle")), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), index.h(AantekenStatus, { key: '
|
|
258
|
+
return (index.h(index.Host, { key: '4be20ab7aee103b4fa74716e330d8f3bb303a7a2', "not-collapsible": !collapsible }, showHeading && (index.h("div", { key: 'ad0bb0c895f034617dcebb0b7a5e169e275933cd', class: "heading-container", part: "_heading-container" }, this.wijzigactie && index.h("span", { key: '019af6b3cd888664dcb3a61c56ef370aac23e6b9', class: "editaction-label" }, this.wijzigactieLabel, ":"), index.h("div", { key: '3332aa7cd5bc63f595efaf28f8e85c47223b9388', class: "heading" }, index.h(Heading, { key: '4a9eb6dcafff4f27dc54adb9e25f256d93807a19', headingLevel: this.headingLevel, class: "heading-element", onClick: this.alternativeTitle ? this.handleHeadingClick : undefined, mode: this.mode, href: this.href }, collapsible && this.mode === "document" && (index.h("dso-icon-button", { key: '99d66b2be1f939c7351ce161855476b2603d64c1', label: this.open ? "Invouwen" : "Uitvouwen", class: "toggle-button", expanded: this.open, icon: this.open ? "chevron-down" : "chevron-right", variant: "tertiary", onDsoClick: (e) => this.handleHeadingClick(e.detail.originalEvent) })), index.h("div", { key: 'ae0f71c453c4b355e019f26c887dac9c2bf28e21' }, this.notApplicable && index.h("span", { key: 'dc88588bf92a9a427aef1b0357e1cc5dd6b81fb6', class: "sr-only" }, "Niet van toepassing:"), this._kop ? (index.h("dso-ozon-content", { class: "kop", content: this._kop, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "kop")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "kop" }), inline: true, urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })) : (index.h("span", { class: "alternative-title" }, (!this.mark && this.alternativeTitle) ||
|
|
259
|
+
(this.mark && this.alternativeTitle && (index.h(parseWijzigactieFromNode_function.MarkText, { mark: this.mark && ((text) => this.mark?.(text, "alternativeTitle")), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), index.h(AantekenStatus, { key: 'c8c11b3cb466776aa48f83c6fb7465cee27d0998', gereserveerd: this._gereserveerd, vervallen: this._vervallen }))), this.recursiveToggle !== undefined && this.open && this.mode === "document" && (index.h("dso-icon-button", { key: '64c3a71fad6bbbe6189201864b824266b5a1576b', label: this.recursiveToggle === true ? "Verberg onderliggende artikelen" : "Toon onderliggende artikelen", class: "recursive-toggle", expanded: this.recursiveToggle === true, icon: this.recursiveToggle === true ? "eye" : "eye-slash", variant: "tertiary", onDsoClick: (e) => this.handleRecursiveToggleClick(e.detail.originalEvent) })), this.showBadge() && (index.h(index.Fragment, { key: 'c9636820ae958525d71476f9de0419c000635535' }, index.h("dso-badge", { key: '3c700b6a68b9b658804ade20c189ed20f8356a54', status: this.badgeStatus, label: this.badgeTooltip ? "Toon toelichting" : undefined }, this.badge, this.badgeTooltip && index.h("div", { key: '7a1356ab6bbe892c09a194434d9b87090c275461', slot: "toggletip" }, this.badgeTooltip)))), (this.label || this.annotated) && (index.h("div", { key: '15039b5537c26a4821f8cfb193fce8c576e05687', class: "addons" }, this.label && (index.h("dso-label", { key: '1c04e2cb9d47a420a352f1d230440886360f8228', status: this.labelStatus, compact: true }, this.label)), this.annotated && this.mode === "document" && (index.h("dso-icon-button", { key: 'e91a3f5347d50a2fc1b5c9e16978dccb92188180', label: `Kenmerken en kaartgegevens ${this.openAnnotation ? "verbergen" : "tonen"}`, icon: "label", expanded: this.openAnnotation, variant: "tertiary", onDsoClick: (e) => this.dsoAnnotationToggle.emit({
|
|
258
260
|
current: this.openAnnotation,
|
|
259
261
|
next: !this.openAnnotation,
|
|
260
262
|
scrollRef: this.host,
|
|
261
263
|
originalEvent: e.detail.originalEvent,
|
|
262
|
-
}) }))))))), this.openAnnotation && (index.h("div", { key: '
|
|
264
|
+
}) }))))))), this.openAnnotation && (index.h("div", { key: '38471391f4abddc9ac61665449e58e32fb8a349d', class: "annotation-container", part: "_annotation-container", role: "dialog", "aria-labelledby": "annotations-heading" }, index.h("dso-panel", { key: 'fe3aa98ca07fe542470d00c97114ae049fc7505a', id: "annotations", onDsoCloseClick: (e) => this.dsoAnnotationToggle.emit({
|
|
263
265
|
current: true,
|
|
264
266
|
next: false,
|
|
265
267
|
originalEvent: e,
|
|
266
|
-
}), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, index.h("h2", { key: '
|
|
268
|
+
}), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, index.h("h2", { key: 'abd850d5dc9968e99eddd82dd83d910a6a5d9c4c', id: "annotations-heading", slot: "heading" }, "Kenmerken en kaart"), index.h("slot", { key: '1fa41e97bcf08136c9bf04d45ceb17bc4890e011', name: "annotations" })))), this.open && (this._inhoud || this._gereserveerd || this._vervallen) && this.mode === "document" && (index.h("div", { key: '0724d483c74eb4d9a5bf98df1334a43c226dcf55', class: "content", part: "_content" }, index.h(AantekenAlert, { key: 'a0aa3ed13249655d663eb00e8fe4251c6beaefd4', gereserveerd: this._gereserveerd, vervallen: this._vervallen }), this._inhoud && (index.h("dso-ozon-content", { key: '9c66a737d583952bcf446069e946eb80d5874e5e', content: this._inhoud, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "inhoud")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "inhoud" }), urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })))), index.h("div", { key: 'f35afe9004c21d7a273b981473ff2503b2d4c42d', class: "children-container", part: "_children-container" }, index.h("slot", { key: '701ae6f0277914e8580c0591a73812c46dbd2f33' }))));
|
|
267
269
|
}
|
|
268
270
|
get host() { return index.getElement(this); }
|
|
269
271
|
};
|
|
@@ -1854,7 +1854,7 @@ const DocumentComponentDemo = class {
|
|
|
1854
1854
|
}
|
|
1855
1855
|
render() {
|
|
1856
1856
|
const { DocumentComponent, MenuButton } = this;
|
|
1857
|
-
return (index.h("dso-responsive-element", { key: '
|
|
1857
|
+
return (index.h("dso-responsive-element", { key: '325c3f0c6cae4feecaf9e01fe74fc602a653f137', class: "dso-document-components" }, index.h("div", { key: 'df6ff8a61e2fefc28b9dace9ea88fcc2b6f0009e', class: "dso-navbar" }, index.h("ul", { key: '6b44f5260a57c2a296068aa9d122c31e3d8d6502', class: "dso-nav dso-nav-sub" }, this.getEmbeddedDocumentComponents(this.response)?.documentComponents?.map((d) => (index.h("li", { class: this.document === d ? "dso-active" : undefined }, index.h(MenuButton, { documentComponent: d })))))), this.document && index.h(DocumentComponent, { key: 'fd300e2da9b2e29b46e29c3108e78f609e8b4e40', path: [this.document] })));
|
|
1858
1858
|
}
|
|
1859
1859
|
static get watchers() { return {
|
|
1860
1860
|
"jsonFile": [{
|
|
@@ -90,7 +90,9 @@ export class DocumentComponent {
|
|
|
90
90
|
});
|
|
91
91
|
break;
|
|
92
92
|
case "IntRef":
|
|
93
|
-
|
|
93
|
+
case "ExtRef":
|
|
94
|
+
case "ExtIoRef":
|
|
95
|
+
this.dsoOzonContentClick.emit({ originalEvent: event, ozonContentClick: detail });
|
|
94
96
|
break;
|
|
95
97
|
default:
|
|
96
98
|
return;
|
|
@@ -187,17 +189,17 @@ export class DocumentComponent {
|
|
|
187
189
|
this.alternativeTitle ||
|
|
188
190
|
this.label ||
|
|
189
191
|
this.annotated);
|
|
190
|
-
return (h(Host, { key: '
|
|
191
|
-
(this.mark && this.alternativeTitle && (h(MarkText, { mark: this.mark && ((text) => this.mark?.(text, "alternativeTitle")), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), h(AantekenStatus, { key: '
|
|
192
|
+
return (h(Host, { key: '4be20ab7aee103b4fa74716e330d8f3bb303a7a2', "not-collapsible": !collapsible }, showHeading && (h("div", { key: 'ad0bb0c895f034617dcebb0b7a5e169e275933cd', class: "heading-container", part: "_heading-container" }, this.wijzigactie && h("span", { key: '019af6b3cd888664dcb3a61c56ef370aac23e6b9', class: "editaction-label" }, this.wijzigactieLabel, ":"), h("div", { key: '3332aa7cd5bc63f595efaf28f8e85c47223b9388', class: "heading" }, h(Heading, { key: '4a9eb6dcafff4f27dc54adb9e25f256d93807a19', headingLevel: this.headingLevel, class: "heading-element", onClick: this.alternativeTitle ? this.handleHeadingClick : undefined, mode: this.mode, href: this.href }, collapsible && this.mode === "document" && (h("dso-icon-button", { key: '99d66b2be1f939c7351ce161855476b2603d64c1', label: this.open ? "Invouwen" : "Uitvouwen", class: "toggle-button", expanded: this.open, icon: this.open ? "chevron-down" : "chevron-right", variant: "tertiary", onDsoClick: (e) => this.handleHeadingClick(e.detail.originalEvent) })), h("div", { key: 'ae0f71c453c4b355e019f26c887dac9c2bf28e21' }, this.notApplicable && h("span", { key: 'dc88588bf92a9a427aef1b0357e1cc5dd6b81fb6', class: "sr-only" }, "Niet van toepassing:"), this._kop ? (h("dso-ozon-content", { class: "kop", content: this._kop, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "kop")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "kop" }), inline: true, urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })) : (h("span", { class: "alternative-title" }, (!this.mark && this.alternativeTitle) ||
|
|
193
|
+
(this.mark && this.alternativeTitle && (h(MarkText, { mark: this.mark && ((text) => this.mark?.(text, "alternativeTitle")), text: this.alternativeTitle, emitMarkItemHighlight: (text, elementRef) => this.dsoMarkItemHighlight.emit({ text, elementRef, source: "alternativeTitle" }) }))))), h(AantekenStatus, { key: 'c8c11b3cb466776aa48f83c6fb7465cee27d0998', gereserveerd: this._gereserveerd, vervallen: this._vervallen }))), this.recursiveToggle !== undefined && this.open && this.mode === "document" && (h("dso-icon-button", { key: '64c3a71fad6bbbe6189201864b824266b5a1576b', label: this.recursiveToggle === true ? "Verberg onderliggende artikelen" : "Toon onderliggende artikelen", class: "recursive-toggle", expanded: this.recursiveToggle === true, icon: this.recursiveToggle === true ? "eye" : "eye-slash", variant: "tertiary", onDsoClick: (e) => this.handleRecursiveToggleClick(e.detail.originalEvent) })), this.showBadge() && (h(Fragment, { key: 'c9636820ae958525d71476f9de0419c000635535' }, h("dso-badge", { key: '3c700b6a68b9b658804ade20c189ed20f8356a54', status: this.badgeStatus, label: this.badgeTooltip ? "Toon toelichting" : undefined }, this.badge, this.badgeTooltip && h("div", { key: '7a1356ab6bbe892c09a194434d9b87090c275461', slot: "toggletip" }, this.badgeTooltip)))), (this.label || this.annotated) && (h("div", { key: '15039b5537c26a4821f8cfb193fce8c576e05687', class: "addons" }, this.label && (h("dso-label", { key: '1c04e2cb9d47a420a352f1d230440886360f8228', status: this.labelStatus, compact: true }, this.label)), this.annotated && this.mode === "document" && (h("dso-icon-button", { key: 'e91a3f5347d50a2fc1b5c9e16978dccb92188180', label: `Kenmerken en kaartgegevens ${this.openAnnotation ? "verbergen" : "tonen"}`, icon: "label", expanded: this.openAnnotation, variant: "tertiary", onDsoClick: (e) => this.dsoAnnotationToggle.emit({
|
|
192
194
|
current: this.openAnnotation,
|
|
193
195
|
next: !this.openAnnotation,
|
|
194
196
|
scrollRef: this.host,
|
|
195
197
|
originalEvent: e.detail.originalEvent,
|
|
196
|
-
}) }))))))), this.openAnnotation && (h("div", { key: '
|
|
198
|
+
}) }))))))), this.openAnnotation && (h("div", { key: '38471391f4abddc9ac61665449e58e32fb8a349d', class: "annotation-container", part: "_annotation-container", role: "dialog", "aria-labelledby": "annotations-heading" }, h("dso-panel", { key: 'fe3aa98ca07fe542470d00c97114ae049fc7505a', id: "annotations", onDsoCloseClick: (e) => this.dsoAnnotationToggle.emit({
|
|
197
199
|
current: true,
|
|
198
200
|
next: false,
|
|
199
201
|
originalEvent: e,
|
|
200
|
-
}), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, h("h2", { key: '
|
|
202
|
+
}), closeButtonLabel: "Kenmerken en kaartgegevens verbergen" }, h("h2", { key: 'abd850d5dc9968e99eddd82dd83d910a6a5d9c4c', id: "annotations-heading", slot: "heading" }, "Kenmerken en kaart"), h("slot", { key: '1fa41e97bcf08136c9bf04d45ceb17bc4890e011', name: "annotations" })))), this.open && (this._inhoud || this._gereserveerd || this._vervallen) && this.mode === "document" && (h("div", { key: '0724d483c74eb4d9a5bf98df1334a43c226dcf55', class: "content", part: "_content" }, h(AantekenAlert, { key: 'a0aa3ed13249655d663eb00e8fe4251c6beaefd4', gereserveerd: this._gereserveerd, vervallen: this._vervallen }), this._inhoud && (h("dso-ozon-content", { key: '9c66a737d583952bcf446069e946eb80d5874e5e', content: this._inhoud, onDsoClick: this.handleOzonContentClick, mark: this.mark && ((text) => this.mark?.(text, "inhoud")), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit({ ...e.detail, source: "inhoud" }), urlResolver: this.ozonContentUrlResolver, begripResolver: this.ozonContentBegripResolver, annotated: this.annotated })))), h("div", { key: 'f35afe9004c21d7a273b981473ff2503b2d4c42d', class: "children-container", part: "_children-container" }, h("slot", { key: '701ae6f0277914e8580c0591a73812c46dbd2f33' }))));
|
|
201
203
|
}
|
|
202
204
|
static get is() { return "dso-document-component"; }
|
|
203
205
|
static get encapsulation() { return "shadow"; }
|
|
@@ -864,7 +866,7 @@ export class DocumentComponent {
|
|
|
864
866
|
"composed": true,
|
|
865
867
|
"docs": {
|
|
866
868
|
"tags": [],
|
|
867
|
-
"text": "Emitted when the user interacts with IntRef in Ozon Content"
|
|
869
|
+
"text": "Emitted when the user interacts with IntRef, ExtRef or ExtIoRef in Ozon Content"
|
|
868
870
|
},
|
|
869
871
|
"complexType": {
|
|
870
872
|
"original": "DocumentComponentOzonContentClickEvent",
|
|
@@ -207,7 +207,7 @@ export class DocumentComponentDemo {
|
|
|
207
207
|
}
|
|
208
208
|
render() {
|
|
209
209
|
const { DocumentComponent, MenuButton } = this;
|
|
210
|
-
return (h("dso-responsive-element", { key: '
|
|
210
|
+
return (h("dso-responsive-element", { key: '325c3f0c6cae4feecaf9e01fe74fc602a653f137', class: "dso-document-components" }, h("div", { key: 'df6ff8a61e2fefc28b9dace9ea88fcc2b6f0009e', class: "dso-navbar" }, h("ul", { key: '6b44f5260a57c2a296068aa9d122c31e3d8d6502', class: "dso-nav dso-nav-sub" }, this.getEmbeddedDocumentComponents(this.response)?.documentComponents?.map((d) => (h("li", { class: this.document === d ? "dso-active" : undefined }, h(MenuButton, { documentComponent: d })))))), this.document && h(DocumentComponent, { key: 'fd300e2da9b2e29b46e29c3108e78f609e8b4e40', path: [this.document] })));
|
|
211
211
|
}
|
|
212
212
|
static get is() { return "dsot-document-component-demo"; }
|
|
213
213
|
static get encapsulation() { return "scoped"; }
|
|
@@ -402,7 +402,7 @@ export class DocumentComponentDemo {
|
|
|
402
402
|
"composed": true,
|
|
403
403
|
"docs": {
|
|
404
404
|
"tags": [],
|
|
405
|
-
"text": "To demo the user interacting with Kop, IntRef or the Kenmerken en kaart button of IntIoRef in
|
|
405
|
+
"text": "To demo the user interacting with Kop, IntRef, ExtRef, ExtIoRef or the Kenmerken en kaart button of IntIoRef in\r\nOzon Content"
|
|
406
406
|
},
|
|
407
407
|
"complexType": {
|
|
408
408
|
"original": "DocumentComponentOzonContentClickEvent",
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { h } from "@stencil/core";
|
|
2
2
|
import kebabCase from "lodash.kebabcase";
|
|
3
|
+
import { isModifiedEvent } from "../../../utils/is-modified-event";
|
|
3
4
|
export class OzonContentExtRefNode {
|
|
4
5
|
constructor() {
|
|
5
6
|
this.name = ["ExtRef", "ExtIoRef"];
|
|
6
7
|
}
|
|
7
|
-
render(node, { mapNodeToJsx, urlResolver }) {
|
|
8
|
+
render(node, { mapNodeToJsx, emitClick, urlResolver }) {
|
|
8
9
|
const className = kebabCase(node.tagName);
|
|
9
10
|
const ref = node.getAttribute("ref");
|
|
10
11
|
const name = node.tagName === "ExtRef" ? "ExtRef" : "ExtIoRef";
|
|
@@ -12,6 +13,15 @@ export class OzonContentExtRefNode {
|
|
|
12
13
|
return mapNodeToJsx(node.childNodes);
|
|
13
14
|
}
|
|
14
15
|
const href = urlResolver ? urlResolver(name, "ref", ref, node) : ref;
|
|
15
|
-
|
|
16
|
+
const handleExtRefClick = (event) => {
|
|
17
|
+
emitClick({
|
|
18
|
+
type: name,
|
|
19
|
+
node,
|
|
20
|
+
originalEvent: event,
|
|
21
|
+
isModifiedEvent: isModifiedEvent(event),
|
|
22
|
+
href: href ?? undefined,
|
|
23
|
+
});
|
|
24
|
+
};
|
|
25
|
+
return (h("a", { target: "_blank", rel: "noopener noreferrer", href: href ?? undefined, class: className, title: "Opent andere website in nieuw tabblad", onClick: handleExtRefClick }, h("span", null, mapNodeToJsx(node.childNodes)), h("dso-icon", { icon: "external-link" })));
|
|
16
26
|
}
|
|
17
27
|
}
|
|
@@ -207,7 +207,7 @@ export class OzonContent {
|
|
|
207
207
|
},
|
|
208
208
|
"complexType": {
|
|
209
209
|
"original": "OzonContentClickEvent",
|
|
210
|
-
"resolved": "OzonContentClickBaseEvent<\"IntIoRef\"> | OzonContentClickBaseEvent<\"IntRef\"> & { isModifiedEvent: boolean; } | OzonContentClickBaseEvent<\"Kop\">",
|
|
210
|
+
"resolved": "OzonContentClickBaseEvent<\"ExtIoRef\"> & { isModifiedEvent: boolean; href: string | undefined; } | OzonContentClickBaseEvent<\"ExtRef\"> & { isModifiedEvent: boolean; href: string | undefined; } | OzonContentClickBaseEvent<\"IntIoRef\"> | OzonContentClickBaseEvent<\"IntRef\"> & { isModifiedEvent: boolean; } | OzonContentClickBaseEvent<\"Kop\">",
|
|
211
211
|
"references": {
|
|
212
212
|
"OzonContentClickEvent": {
|
|
213
213
|
"location": "import",
|