@dso-toolkit/core 80.0.0 → 81.1.0

package/dist/collection/components/table/table.css

@@ -98,15 +98,12 @@ button.dso-primary.dso-small,
 label.dso-primary.dso-small {
   line-height: 1rem;
 }
-a.dso-primary.dso-small dso-icon,
-a.dso-primary.dso-small svg.di, a.dso-primary.dso-small.extern::after, a.dso-primary.dso-small.download::after, a.dso-primary.dso-small.dso-spinner::before,
+a.dso-primary.dso-small dso-icon, a.dso-primary.dso-small.extern::after, a.dso-primary.dso-small.download::after, a.dso-primary.dso-small.dso-spinner::before,
 button.dso-primary.dso-small dso-icon,
-button.dso-primary.dso-small svg.di,
 button.dso-primary.dso-small.extern::after,
 button.dso-primary.dso-small.download::after,
 button.dso-primary.dso-small.dso-spinner::before,
 label.dso-primary.dso-small dso-icon,
-label.dso-primary.dso-small svg.di,
 label.dso-primary.dso-small.extern::after,
 label.dso-primary.dso-small.download::after,
 label.dso-primary.dso-small.dso-spinner::before {
@@ -130,15 +127,12 @@ button.dso-primary.dso-extra-small,
 label.dso-primary.dso-extra-small {
   line-height: 1rem;
 }
-a.dso-primary.dso-extra-small dso-icon,
-a.dso-primary.dso-extra-small svg.di, a.dso-primary.dso-extra-small.extern::after, a.dso-primary.dso-extra-small.download::after, a.dso-primary.dso-extra-small.dso-spinner::before,
+a.dso-primary.dso-extra-small dso-icon, a.dso-primary.dso-extra-small.extern::after, a.dso-primary.dso-extra-small.download::after, a.dso-primary.dso-extra-small.dso-spinner::before,
 button.dso-primary.dso-extra-small dso-icon,
-button.dso-primary.dso-extra-small svg.di,
 button.dso-primary.dso-extra-small.extern::after,
 button.dso-primary.dso-extra-small.download::after,
 button.dso-primary.dso-extra-small.dso-spinner::before,
 label.dso-primary.dso-extra-small dso-icon,
-label.dso-primary.dso-extra-small svg.di,
 label.dso-primary.dso-extra-small.extern::after,
 label.dso-primary.dso-extra-small.download::after,
 label.dso-primary.dso-extra-small.dso-spinner::before {
@@ -163,28 +157,19 @@ label.dso-primary.dso-extra-small {
   padding-block: 9px;
 }
 a.dso-primary dso-icon:has(+ span:not(.sr-only)),
-a.dso-primary svg.di:has(+ span:not(.sr-only)),
 button.dso-primary dso-icon:has(+ span:not(.sr-only)),
-button.dso-primary svg.di:has(+ span:not(.sr-only)),
-label.dso-primary dso-icon:has(+ span:not(.sr-only)),
-label.dso-primary svg.di:has(+ span:not(.sr-only)) {
+label.dso-primary dso-icon:has(+ span:not(.sr-only)) {
   margin-inline-start: -8px;
 }
 a.dso-primary span:not(.sr-only) + dso-icon,
-a.dso-primary span:not(.sr-only) + svg.di,
 button.dso-primary span:not(.sr-only) + dso-icon,
-button.dso-primary span:not(.sr-only) + svg.di,
-label.dso-primary span:not(.sr-only) + dso-icon,
-label.dso-primary span:not(.sr-only) + svg.di {
+label.dso-primary span:not(.sr-only) + dso-icon {
   margin-inline-start: 8px;
   margin-inline-end: -8px;
 }
 a.dso-primary dso-icon + span:not(.sr-only),
-a.dso-primary svg.di + span:not(.sr-only),
 button.dso-primary dso-icon + span:not(.sr-only),
-button.dso-primary svg.di + span:not(.sr-only),
-label.dso-primary dso-icon + span:not(.sr-only),
-label.dso-primary svg.di + span:not(.sr-only) {
+label.dso-primary dso-icon + span:not(.sr-only) {
   margin-inline-start: 8px;
 }
 a.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled],
@@ -318,15 +303,12 @@ button.dso-secondary.dso-small,
 label.dso-secondary.dso-small {
   line-height: 1rem;
 }
-a.dso-secondary.dso-small dso-icon,
-a.dso-secondary.dso-small svg.di, a.dso-secondary.dso-small.extern::after, a.dso-secondary.dso-small.download::after, a.dso-secondary.dso-small.dso-spinner::before,
+a.dso-secondary.dso-small dso-icon, a.dso-secondary.dso-small.extern::after, a.dso-secondary.dso-small.download::after, a.dso-secondary.dso-small.dso-spinner::before,
 button.dso-secondary.dso-small dso-icon,
-button.dso-secondary.dso-small svg.di,
 button.dso-secondary.dso-small.extern::after,
 button.dso-secondary.dso-small.download::after,
 button.dso-secondary.dso-small.dso-spinner::before,
 label.dso-secondary.dso-small dso-icon,
-label.dso-secondary.dso-small svg.di,
 label.dso-secondary.dso-small.extern::after,
 label.dso-secondary.dso-small.download::after,
 label.dso-secondary.dso-small.dso-spinner::before {
@@ -350,15 +332,12 @@ button.dso-secondary.dso-extra-small,
 label.dso-secondary.dso-extra-small {
   line-height: 1rem;
 }
-a.dso-secondary.dso-extra-small dso-icon,
-a.dso-secondary.dso-extra-small svg.di, a.dso-secondary.dso-extra-small.extern::after, a.dso-secondary.dso-extra-small.download::after, a.dso-secondary.dso-extra-small.dso-spinner::before,
+a.dso-secondary.dso-extra-small dso-icon, a.dso-secondary.dso-extra-small.extern::after, a.dso-secondary.dso-extra-small.download::after, a.dso-secondary.dso-extra-small.dso-spinner::before,
 button.dso-secondary.dso-extra-small dso-icon,
-button.dso-secondary.dso-extra-small svg.di,
 button.dso-secondary.dso-extra-small.extern::after,
 button.dso-secondary.dso-extra-small.download::after,
 button.dso-secondary.dso-extra-small.dso-spinner::before,
 label.dso-secondary.dso-extra-small dso-icon,
-label.dso-secondary.dso-extra-small svg.di,
 label.dso-secondary.dso-extra-small.extern::after,
 label.dso-secondary.dso-extra-small.download::after,
 label.dso-secondary.dso-extra-small.dso-spinner::before {
@@ -383,28 +362,19 @@ label.dso-secondary.dso-extra-small {
   padding-block: 9px;
 }
 a.dso-secondary dso-icon:has(+ span:not(.sr-only)),
-a.dso-secondary svg.di:has(+ span:not(.sr-only)),
 button.dso-secondary dso-icon:has(+ span:not(.sr-only)),
-button.dso-secondary svg.di:has(+ span:not(.sr-only)),
-label.dso-secondary dso-icon:has(+ span:not(.sr-only)),
-label.dso-secondary svg.di:has(+ span:not(.sr-only)) {
+label.dso-secondary dso-icon:has(+ span:not(.sr-only)) {
   margin-inline-start: -8px;
 }
 a.dso-secondary span:not(.sr-only) + dso-icon,
-a.dso-secondary span:not(.sr-only) + svg.di,
 button.dso-secondary span:not(.sr-only) + dso-icon,
-button.dso-secondary span:not(.sr-only) + svg.di,
-label.dso-secondary span:not(.sr-only) + dso-icon,
-label.dso-secondary span:not(.sr-only) + svg.di {
+label.dso-secondary span:not(.sr-only) + dso-icon {
   margin-inline-start: 8px;
   margin-inline-end: -8px;
 }
 a.dso-secondary dso-icon + span:not(.sr-only),
-a.dso-secondary svg.di + span:not(.sr-only),
 button.dso-secondary dso-icon + span:not(.sr-only),
-button.dso-secondary svg.di + span:not(.sr-only),
-label.dso-secondary dso-icon + span:not(.sr-only),
-label.dso-secondary svg.di + span:not(.sr-only) {
+label.dso-secondary dso-icon + span:not(.sr-only) {
   margin-inline-start: 8px;
 }
 a.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled],
@@ -622,67 +592,32 @@ label.dso-tertiary.dso-spinner-right::after {
   margin-inline-start: 8px;
 }
 a.dso-tertiary dso-icon + span:not(.sr-only),
-a.dso-tertiary svg.di + span:not(.sr-only),
 a.dso-tertiary span:not(.sr-only) + dso-icon,
-a.dso-tertiary span:not(.sr-only) + svg.di,
 button.dso-tertiary dso-icon + span:not(.sr-only),
-button.dso-tertiary svg.di + span:not(.sr-only),
 button.dso-tertiary span:not(.sr-only) + dso-icon,
-button.dso-tertiary span:not(.sr-only) + svg.di,
 label.dso-tertiary dso-icon + span:not(.sr-only),
-label.dso-tertiary svg.di + span:not(.sr-only),
-label.dso-tertiary span:not(.sr-only) + dso-icon,
-label.dso-tertiary span:not(.sr-only) + svg.di {
+label.dso-tertiary span:not(.sr-only) + dso-icon {
   margin-inline-start: 8px;
 }
-a.dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),
-a.dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),
-a.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,
-a.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up,
-button.dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),
-button.dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),
-button.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,
-button.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up,
-label.dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),
-label.dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),
-label.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,
-label.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up {
-  margin-inline-start: 4px;
-}
 a.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),
 a.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),
-a.dso-tertiary svg.di.di-angle-down + span:not(.sr-only),
-a.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),
-a.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,
-a.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,
 a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],
 a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right],
 button.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),
 button.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),
-button.dso-tertiary svg.di.di-angle-down + span:not(.sr-only),
-button.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),
-button.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,
-button.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,
 button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],
 button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right],
 label.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),
 label.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),
-label.dso-tertiary svg.di.di-angle-down + span:not(.sr-only),
-label.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),
-label.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,
-label.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,
 label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],
 label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] {
   margin-inline-start: 0;
 }
 a.dso-tertiary dso-icon,
-a.dso-tertiary svg.di,
 a.dso-tertiary span,
 button.dso-tertiary dso-icon,
-button.dso-tertiary svg.di,
 button.dso-tertiary span,
 label.dso-tertiary dso-icon,
-label.dso-tertiary svg.di,
 label.dso-tertiary span {
   vertical-align: middle;
 }
@@ -807,15 +742,12 @@ button.dso-map.dso-small,
 label.dso-map.dso-small {
   line-height: 1rem;
 }
-a.dso-map.dso-small dso-icon,
-a.dso-map.dso-small svg.di, a.dso-map.dso-small.extern::after, a.dso-map.dso-small.download::after, a.dso-map.dso-small.dso-spinner::before,
+a.dso-map.dso-small dso-icon, a.dso-map.dso-small.extern::after, a.dso-map.dso-small.download::after, a.dso-map.dso-small.dso-spinner::before,
 button.dso-map.dso-small dso-icon,
-button.dso-map.dso-small svg.di,
 button.dso-map.dso-small.extern::after,
 button.dso-map.dso-small.download::after,
 button.dso-map.dso-small.dso-spinner::before,
 label.dso-map.dso-small dso-icon,
-label.dso-map.dso-small svg.di,
 label.dso-map.dso-small.extern::after,
 label.dso-map.dso-small.download::after,
 label.dso-map.dso-small.dso-spinner::before {
@@ -839,15 +771,12 @@ button.dso-map.dso-extra-small,
 label.dso-map.dso-extra-small {
   line-height: 1rem;
 }
-a.dso-map.dso-extra-small dso-icon,
-a.dso-map.dso-extra-small svg.di, a.dso-map.dso-extra-small.extern::after, a.dso-map.dso-extra-small.download::after, a.dso-map.dso-extra-small.dso-spinner::before,
+a.dso-map.dso-extra-small dso-icon, a.dso-map.dso-extra-small.extern::after, a.dso-map.dso-extra-small.download::after, a.dso-map.dso-extra-small.dso-spinner::before,
 button.dso-map.dso-extra-small dso-icon,
-button.dso-map.dso-extra-small svg.di,
 button.dso-map.dso-extra-small.extern::after,
 button.dso-map.dso-extra-small.download::after,
 button.dso-map.dso-extra-small.dso-spinner::before,
 label.dso-map.dso-extra-small dso-icon,
-label.dso-map.dso-extra-small svg.di,
 label.dso-map.dso-extra-small.extern::after,
 label.dso-map.dso-extra-small.download::after,
 label.dso-map.dso-extra-small.dso-spinner::before {
@@ -872,28 +801,19 @@ label.dso-map.dso-extra-small {
   padding-block: 9px;
 }
 a.dso-map dso-icon:has(+ span:not(.sr-only)),
-a.dso-map svg.di:has(+ span:not(.sr-only)),
 button.dso-map dso-icon:has(+ span:not(.sr-only)),
-button.dso-map svg.di:has(+ span:not(.sr-only)),
-label.dso-map dso-icon:has(+ span:not(.sr-only)),
-label.dso-map svg.di:has(+ span:not(.sr-only)) {
+label.dso-map dso-icon:has(+ span:not(.sr-only)) {
   margin-inline-start: -8px;
 }
 a.dso-map span:not(.sr-only) + dso-icon,
-a.dso-map span:not(.sr-only) + svg.di,
 button.dso-map span:not(.sr-only) + dso-icon,
-button.dso-map span:not(.sr-only) + svg.di,
-label.dso-map span:not(.sr-only) + dso-icon,
-label.dso-map span:not(.sr-only) + svg.di {
+label.dso-map span:not(.sr-only) + dso-icon {
   margin-inline-start: 8px;
   margin-inline-end: -8px;
 }
 a.dso-map dso-icon + span:not(.sr-only),
-a.dso-map svg.di + span:not(.sr-only),
 button.dso-map dso-icon + span:not(.sr-only),
-button.dso-map svg.di + span:not(.sr-only),
-label.dso-map dso-icon + span:not(.sr-only),
-label.dso-map svg.di + span:not(.sr-only) {
+label.dso-map dso-icon + span:not(.sr-only) {
   margin-inline-start: 8px;
 }
 a.dso-map.dso-spinner-left[disabled], a.dso-map.dso-spinner-right[disabled],
@@ -983,9 +903,9 @@ label.dso-map:focus,
 label.dso-map:focus-visible {
   outline-offset: -1px;
 }
-a.dso-map:has(span.sr-only):has(dso-icon, svg.di),
-button.dso-map:has(span.sr-only):has(dso-icon, svg.di),
-label.dso-map:has(span.sr-only):has(dso-icon, svg.di) {
+a.dso-map:has(span.sr-only):has(dso-icon),
+button.dso-map:has(span.sr-only):has(dso-icon),
+label.dso-map:has(span.sr-only):has(dso-icon) {
   padding: 8px;
   min-inline-size: auto;
   block-size: 40px;

package/dist/collection/components/table/table.js

@@ -31,7 +31,7 @@ export class Table {
     render() {
         var _a, _b, _c;
         const caption = (_b = (_a = this.host.querySelector(":scope > table > caption")) === null || _a === void 0 ? void 0 : _a.textContent) === null || _b === void 0 ? void 0 : _b.trim();
-        return (h(Host, { key: 'a777d203143bc69f71179bb7c674ca51bfae829e', "is-responsive": (_c = this.isResponsive) === null || _c === void 0 ? void 0 : _c.toString() }, this.modalActive && this.placeholderHeight && (h("div", { key: '9c86ab4f0d3cce970156f9cf2602668ed99098a5', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive && h("div", { key: 'b30b29d08ccfea68c73b2db94342af4ea387d8d6', class: "dso-modal-overlay" }), h("div", { key: 'eab3e465b368e29443dd8b24126a3d9529c9b9db', class: { "dso-modal": this.modalActive } }, h("div", Object.assign({ key: '863f47fe0b9e8a4d6113f45edb579c6ffb6bf7b4', class: { "dso-dialog": this.modalActive, "dso-table-dialog": true }, ref: (element) => (this.focusTrapElement = element) }, (this.modalActive ? { ["aria-labelledby"]: this.labelledbyId, role: "dialog" } : {})), (this.isResponsive || !this.noModal) && (h("div", { key: '87ad47b93c3020613235bb9036253a1591bc25b5', class: "dso-table-utilities", style: this.modalActive ? { display: "none" } : undefined }, this.isResponsive && (h("div", { key: '51d55c5c0090149a43b6cae1f585f505cbbf1b20', class: "dso-responsive-message" }, h("span", { key: '5bb11ddf365807da4749c7b1dcb2fa40cc97bbf4' }, "beweeg de tabel van links naar rechts"))), !this.noModal && (h("button", { key: '993af941db154f26321cbd97ddc6af4d7b0d6385', type: "button", class: "dso-tertiary open-modal-button", ref: (element) => (this.buttonElement = element), onClick: () => this.openModal() }, h("span", { key: '17c4355676824269d66a7304f0ff20d229051bbf', class: "sr-only" }, "tabel ", caption !== null && caption !== void 0 ? caption : "", " "), h("span", { key: '8a9c0a6cbc7ddea01af078b84658e06aace57440' }, "vergroten"), h("dso-icon", { key: 'ec5aecb9d5751ed1c792a1b5c657f004598bb7ce', icon: "external-link" }))))), this.modalActive && (h("div", { key: 'f951d70a1cad1c5e2039eb48479c33067fcb08d4', class: "dso-header" }, h("h2", { key: '83ec89730cd524abd75c10d27cc02b2bc9928754', id: this.labelledbyId, class: { "sr-only": !caption } }, caption || "Uitvergrote tabel dialoog"), h("button", { key: 'eb28eb81c50bcfd61aa570c7c61ca27196822900', type: "button", class: "dso-close", onClick: () => this.closeModal() }, h("dso-icon", { key: '93249a58a59bfefb3b0810121969a185d73f3b8a', icon: "times" }), h("span", { key: 'a2fc563e029a3b2e701e36ed5676292938504ebe', class: "sr-only" }, "Sluiten")))), h("div", { key: 'd18dbe3bad6b4998e0222bed5bc714fd4b9672f8', class: { "dso-body": this.modalActive, "dso-table-body": true } }, h("slot", { key: '1ba007ca5766a085874dacb6e8894d81036aafa8' }))))));
+        return (h(Host, { key: '64239579022b5947aa25ac6b6c9cecafd2e268d2', "is-responsive": (_c = this.isResponsive) === null || _c === void 0 ? void 0 : _c.toString() }, this.modalActive && this.placeholderHeight && (h("div", { key: '48a0a2e6b90ef03e70aaa1297dd22b28604f4c46', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive && h("div", { key: '4e21316f3bd8f30dea7ff9b7652891979a790416', class: "dso-modal-overlay" }), h("div", { key: '573e157db60cd3a87cbb786d863dcd4273b49327', class: { "dso-modal": this.modalActive } }, h("div", Object.assign({ key: 'e03ad1ef0743dbd501efc90c0862da409f4ab6e8', class: { "dso-dialog": this.modalActive, "dso-table-dialog": true }, ref: (element) => (this.focusTrapElement = element) }, (this.modalActive ? { ["aria-labelledby"]: this.labelledbyId, role: "dialog" } : {})), (this.isResponsive || !this.noModal) && (h("div", { key: '65309b7f04e2e4e2e039793517b6653400932a83', class: "dso-table-utilities", style: this.modalActive ? { display: "none" } : undefined }, this.isResponsive && (h("div", { key: 'ded0b2c1e4f18a1b7d1405226562b9f112e12857', class: "dso-responsive-message" }, h("span", { key: '51581a776085020af4b2a900c05c510722144155' }, "beweeg de tabel van links naar rechts"))), !this.noModal && (h("button", { key: 'f4d8e8be918370ee9f6629608f44ced04a7a69ea', type: "button", class: "dso-tertiary open-modal-button", ref: (element) => (this.buttonElement = element), onClick: () => this.openModal() }, h("span", { key: '8625baca95fc315bd82ee1a54d8c1d9b91fb9f4a', class: "sr-only" }, "tabel ", caption !== null && caption !== void 0 ? caption : "", " "), h("span", { key: '90c66b3259bcfe679067000527e8be296e2df02b' }, "vergroten"), h("dso-icon", { key: 'f9183bd3c9b5c1af66f477f782503ff0058ac21d', icon: "external-link" }))))), this.modalActive && (h("div", { key: 'fced7b34b5d5ce882ec8494c020622110f150721', class: "dso-header" }, h("h2", { key: '92b18af91fcbf119254442b2bf2812832adf9011', id: this.labelledbyId, class: { "sr-only": !caption } }, caption || "Uitvergrote tabel dialoog"), h("button", { key: 'd6f0d92721a99409d04cd779d110d6e94cb4655c', type: "button", class: "dso-close", onClick: () => this.closeModal() }, h("dso-icon", { key: 'f6ffae42f7a31d40f7aa3ceae51f96b83f40afa5', icon: "times" }), h("span", { key: '1a6bc1b5486e2285313ae9b028fef7cac6389b41', class: "sr-only" }, "Sluiten")))), h("div", { key: '73d7114ad881bba9366e3123156ea6169d87106c', class: { "dso-body": this.modalActive, "dso-table-body": true } }, h("slot", { key: '9d3e674d7c2578f82b0b9fa00ebc91fabbc9e269' }))))));
     }
     openModal() {
         this.placeholderHeight = this.host.clientHeight;

package/dist/collection/components/tabs/tabs.js

@@ -64,7 +64,7 @@ export class Tabs {
         (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     render() {
-        return (h(Host, { key: '349c801fdadbfd077ca6cc68f5d1f48dea0d4ff4' }, h("div", { key: '1413312c78b126135b10295690aa957d99304acf', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, h("slot", { key: '3b4cbf35c3d29ba1f6158853d755335dd8a05b5e' })), h("div", { key: '95e97aa712722fc019bbf1578dfb1c6224ecebb5', role: "tabpanel", tabindex: "0" }, h("slot", { key: '305195dcc64770963bb740d64c5cc0d08f0c16bc', name: "panel" }))));
+        return (h(Host, { key: '6cac5b5aadaee63469ae51fe3edca2127e37a4c6' }, h("div", { key: 'b176afce53f463b5b7c53fb5d14e415506c40194', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, h("slot", { key: '0db1ce93d3bb4b6ff38b90b5a0fd620573680aa9' })), h("div", { key: '33cd57a51cb22a03565b1a805c6839ed3eea6a5b', role: "tabpanel", tabindex: "0" }, h("slot", { key: '3c3ea0615970882bed8cbc785118fa01cf489ef7', name: "panel" }))));
     }
     static get is() { return "dso-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tijdreis-banner/tijdreis-banner.js

@@ -1,7 +1,7 @@
 import { Fragment, h } from "@stencil/core";
 export class TijdreisBanner {
     render() {
-        return (h(Fragment, { key: '18bdd5a23ce800c978c9bd615b2938bfb6d7433b' }, h("dso-icon", { key: '791cd7e6c740544226291395b26f6d34c4e31620', icon: "clock" }), h("slot", { key: '03d5c073b0051f3eb6ea15bc88731e45857c48f4' }), h("slot", { key: '54743bf06467f0dfdf1d896bf1f7a9e658467bf4', name: "button" })));
+        return (h(Fragment, { key: 'cb57567ddfb405ed5580f3056824df6f3125e57d' }, h("dso-icon", { key: 'e4a8892dabbd44bc9ca7f1548c065473537aaa45', icon: "clock" }), h("slot", { key: 'facdf989c45f44e10336ca5d3b7319e48929ca82' }), h("slot", { key: '0bc0625232374f0df07b23186e3f51a26632a76b', name: "button" })));
     }
     static get is() { return "dso-tijdreis-banner"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toggletip/toggletip.js

@@ -44,7 +44,7 @@ export class Toggletip {
         };
     }
     render() {
-        return (h(Fragment, { key: 'facdb6f15ee9411df97bf57a390001e6c5c538eb' }, h("dso-info-button", { key: '104bb7ff512fbd57eaaf7559adde8d8fb1966bf2', "aria-describedby": "toggle", onClick: this.click, label: this.label, active: this.active, secondary: this.secondary, ref: (element) => (this.infoButton = element) }), h("dso-tooltip", { key: '320c7a6d9e2199f1f3d91610f41773e163d17c64', stateless: true, descriptive: true, id: "toggle", strategy: "absolute", active: this.active, position: this.position, small: this.small }, h("slot", { key: '3f609c4261d1a8d04b55bf6ddf152a2649b6b20f' }))));
+        return (h(Fragment, { key: '5d0c70968e78501d56ee3d10cd72bf5d8cb72a7a' }, h("dso-info-button", { key: 'a420816c0fa911415ffced3f8e5ef07876710009', "aria-describedby": "toggle", onClick: this.click, label: this.label, active: this.active, secondary: this.secondary, ref: (element) => (this.infoButton = element) }), h("dso-tooltip", { key: '943c676aaa520c950f25c37fd85fff50fd1fa692', stateless: true, descriptive: true, id: "toggle", strategy: "absolute", active: this.active, position: this.position, small: this.small }, h("slot", { key: 'a08af99744cf49d69fa3b153afe71730a7bcbb00' }))));
     }
     static get is() { return "dso-toggletip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tooltip/tooltip.js

@@ -189,7 +189,7 @@ export class Tooltip {
         }
     }
     render() {
-        return (h(Host, { key: '3b7b072ac2cbf99d0cd274fdd803f87110148747', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, h("div", { key: '9a50dba09c72797fd9f13a3afd0ee6ee74b3fb22', class: clsx("tooltip", { in: this.active }) }, !this.noArrow && h("div", { key: '7fb9ad5c0ab6733625321374974398d52b98f196', "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { key: 'e3aeb925d1073a4e5728cdbe241726993ff79941', "aria-hidden": !this.descriptive || undefined, class: clsx("tooltip-inner", { "dso-small": this.small }) }, h("slot", { key: 'ae49f6af4b043da6c4e62dc54fc88d47f9cab94c' })))));
+        return (h(Host, { key: 'f1bb81edcda73696503dbe6c861df3dcea6c3f3a', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, h("div", { key: '31a072208b412595e1e019c2bb780dbd0f88c21f', class: clsx("tooltip", { in: this.active }) }, !this.noArrow && h("div", { key: 'f21726f6c49752e21cb93faa2671a97a32b6d7e8', "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { key: '900369b00247af6d83a12b22f02ac65baf12c12a', "aria-hidden": !this.descriptive || undefined, class: clsx("tooltip-inner", { "dso-small": this.small }) }, h("slot", { key: 'ff81e46d1c50684bc9e95ca238efa5772042b241' })))));
     }
     activatePopper() {
         var _a;

package/dist/collection/components/tree-view/tree-view.js

@@ -174,7 +174,7 @@ export class TreeView {
     }
     render() {
         var _a;
-        return (h("div", { key: '7db23c7d7736a1b2f4f18c6240db2dcb72d965a2', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: 'dc8acc481f22aaced2657634b24a0e054194a33f', role: "tree", "aria-label": "Objectenboom" }, (_a = this.collection) === null || _a === void 0 ? void 0 : _a.map((item, index) => (h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index, level: 1, setSize: this.collection.length }))))));
+        return (h("div", { key: 'c9d82896a208dea70197ce9927c5402a5763259a', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: '10a57e188cf106ca9ef9a0d7d6c4a7e8a3a1df6f', role: "tree", "aria-label": "Objectenboom" }, (_a = this.collection) === null || _a === void 0 ? void 0 : _a.map((item, index) => (h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index, level: 1, setSize: this.collection.length }))))));
     }
     static get is() { return "dso-tree-view"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/viewer-grid/viewer-grid.css

@@ -315,8 +315,7 @@ button::-moz-focus-inner {
     padding-block: 5px;
     padding-inline: 0;
   }
-  .dso-navbar .dso-navbar-toggle dso-icon,
-  .dso-navbar .dso-navbar-toggle svg.di {
+  .dso-navbar .dso-navbar-toggle dso-icon {
     margin-inline-start: 8px;
     margin-inline-end: 8px;
   }
@@ -478,29 +477,16 @@ button::-moz-focus-inner {
     margin-inline-start: 8px;
   }
   .dso-tertiary dso-icon + span:not(.sr-only),
-  .dso-tertiary svg.di + span:not(.sr-only),
-  .dso-tertiary span:not(.sr-only) + dso-icon,
-  .dso-tertiary span:not(.sr-only) + svg.di {
+  .dso-tertiary span:not(.sr-only) + dso-icon {
     margin-inline-start: 8px;
   }
-  .dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),
-  .dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),
-  .dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,
-  .dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up {
-    margin-inline-start: 4px;
-  }
   .dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),
   .dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),
-  .dso-tertiary svg.di.di-angle-down + span:not(.sr-only),
-  .dso-tertiary svg.di.di-angle-up + span:not(.sr-only),
-  .dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,
-  .dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,
   .dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],
   .dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] {
     margin-inline-start: 0;
   }
   .dso-tertiary dso-icon,
-  .dso-tertiary svg.di,
   .dso-tertiary span {
     vertical-align: middle;
   }

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

@@ -158,7 +158,7 @@ export class ViewerGrid {
         }
     }
     render() {
-        return (h(Fragment, { key: '187f6008a7a17f966cc95014b496836f939c99f0' }, h("slot", { key: 'ce5feb14b2bd1925a9e727ee865f0a9b3244151f', name: "top-bar" }), h("div", { key: '58758274f6029b7f288035d0bc6a981b36cd4da8', class: "viewer-grid-columns" }, this.tabView && (h("nav", { key: '2bbf3fe80654866b9afb4f05362d3e390144ed7f', class: "dso-navbar" }, h("ul", { key: 'ba808de2ac61506fbc5ed726e98de16d512546e4', class: "dso-nav dso-nav-sub" }, viewerGridTabs.map((tab) => (h("li", { key: tab, class: clsx({ "dso-active": this.activeTab === tab }) }, h("button", { type: "button", class: "dso-tertiary", onClick: () => this.switchActiveTab(tab) }, viewerGridTabLabelMap[tab]))))))), (!this.tabView || (this.tabView && this.activeTab === "search")) && (h(MainPanel, { key: '27171fa4924f1b3129f37c7ff1b0dfe86ec4b24d', tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.mainPanelHidden, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd })), (!this.tabView || (this.tabView && this.activeTab === "search")) && (h(FilterPanel, { key: 'eefefe016d913a68e4b777654690f635575dd061', open: this.filterPanelOpen, title: this.filterPanelTitle, ref: (element) => (this.filterPanel = element), dsoCloseFilterPanel: (e) => this.dsoCloseFilterPanel.emit({ originalEvent: e }) })), (!this.tabView || (this.tabView && this.activeTab === "map")) && (h("div", { key: '257e99001e125ebedb63f528d45f48e8ae4b8a25', class: "map", ref: (element) => (this.mapElement = element) }, h("slot", { key: 'ac6e42e98a57eaccb167e7510f7a749cc6282611', name: "map" }))), ((!this.tabView && this.documentPanelOpen) || (this.tabView && this.activeTab === "document")) && (h(DocumentPanel, { key: 'feb75b3bc7dce62272cfc1216c5a7c2acccb2268', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), h(Overlay, { key: 'f2cbdf0bba4190bc9df0ea9178ceacb25ed0ff38', ref: (element) => (this.overlay = element), dsoCloseOverlay: (e) => this.dsoCloseOverlay.emit({ originalEvent: e }) }))));
+        return (h(Fragment, { key: '1a4122fc962df5d43cd8f68ee78ca712ddd33bba' }, h("slot", { key: 'e1928ab063a06b93f2041fe71e76012070bdca31', name: "top-bar" }), h("div", { key: '18488465f8df22fb195eab8374d8701ccb5774c0', class: "viewer-grid-columns" }, this.tabView && (h("nav", { key: 'b975c12a1f6087e8be56fa61a5401bcf51c9549c', class: "dso-navbar" }, h("ul", { key: '9f45193f92f2e6893b9489029ba0051c878a33dd', class: "dso-nav dso-nav-sub" }, viewerGridTabs.map((tab) => (h("li", { key: tab, class: clsx({ "dso-active": this.activeTab === tab }) }, h("button", { type: "button", class: "dso-tertiary", onClick: () => this.switchActiveTab(tab) }, viewerGridTabLabelMap[tab]))))))), (!this.tabView || (this.tabView && this.activeTab === "search")) && (h(MainPanel, { key: '16175775a1fc2c1c6733859b79129589a72276bd', tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.mainPanelHidden, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd })), (!this.tabView || (this.tabView && this.activeTab === "search")) && (h(FilterPanel, { key: 'a77bde1daaea831831e6aef8c72d9b116d8cf57e', open: this.filterPanelOpen, title: this.filterPanelTitle, ref: (element) => (this.filterPanel = element), dsoCloseFilterPanel: (e) => this.dsoCloseFilterPanel.emit({ originalEvent: e }) })), (!this.tabView || (this.tabView && this.activeTab === "map")) && (h("div", { key: '94d2c4cf569223c72b575d562237dcb6bbf64abf', class: "map", ref: (element) => (this.mapElement = element) }, h("slot", { key: '30b93bee7bd78970448f80e5eb0cadbf7e3f3838', name: "map" }))), ((!this.tabView && this.documentPanelOpen) || (this.tabView && this.activeTab === "document")) && (h(DocumentPanel, { key: '27332cb7110ad6354d9512570ee0885bcff55f51', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), h(Overlay, { key: '3138b795a0ead5eb104b8195a9cfc0877a387f88', ref: (element) => (this.overlay = element), dsoCloseOverlay: (e) => this.dsoCloseOverlay.emit({ originalEvent: e }) }))));
     }
     static get is() { return "dso-viewer-grid"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/functional-components/mark-text/mark-text.functional-component.js

@@ -0,0 +1,11 @@
+import { Fragment, h } from "@stencil/core";
+export const MarkText = ({ mark, text, emitMarkItemHighlight }) => {
+    const result = mark(text);
+    return !result || result.length === 0 ? (h(Fragment, null, text)) : (h(Fragment, null, result.map((value) => {
+        if (typeof value === "string") {
+            return h(Fragment, null, value);
+        }
+        return (h("mark", { class: value.highlight ? "dso-highlight" : undefined, ref: (ref) => value.highlight && ref && emitMarkItemHighlight(value.text, ref) }, value.text));
+    })));
+};
+//# sourceMappingURL=mark-text.functional-component.js.map

package/dist/collection/functional-components/mark-text/mark-text.functional-component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mark-text.functional-component.js","sourceRoot":"","sources":["../../../../src/functional-components/mark-text/mark-text.functional-component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAuB,CAAC,EAAE,MAAM,eAAe,CAAC;AAUjE,MAAM,CAAC,MAAM,QAAQ,GAAuC,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,qBAAqB,EAAE,EAAE,EAAE;IACpG,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC;IAE1B,OAAO,CAAC,MAAM,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,CACtC,EAAC,QAAQ,QAAE,IAAI,CAAY,CAC5B,CAAC,CAAC,CAAC,CACF,EAAC,QAAQ,QACN,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;QACpB,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;YAC9B,OAAO,EAAC,QAAQ,QAAE,KAAK,CAAY,CAAC;QACtC,CAAC;QAED,OAAO,CACL,YACE,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,EACpD,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS,IAAI,GAAG,IAAI,qBAAqB,CAAC,KAAK,CAAC,IAAI,EAAE,GAAG,CAAC,IAE7E,KAAK,CAAC,IAAI,CACN,CACR,CAAC;IACJ,CAAC,CAAC,CACO,CACZ,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Fragment, FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { MarkTextMarkFunction } from \"./mark-text.interfaces\";\r\n\r\nexport interface MarkTextProps {\r\n  mark: MarkTextMarkFunction;\r\n  text: string;\r\n  emitMarkItemHighlight(text: string, elementRef: HTMLElement): void;\r\n}\r\n\r\nexport const MarkText: FunctionalComponent<MarkTextProps> = ({ mark, text, emitMarkItemHighlight }) => {\r\n  const result = mark(text);\r\n\r\n  return !result || result.length === 0 ? (\r\n    <Fragment>{text}</Fragment>\r\n  ) : (\r\n    <Fragment>\r\n      {result.map((value) => {\r\n        if (typeof value === \"string\") {\r\n          return <Fragment>{value}</Fragment>;\r\n        }\r\n\r\n        return (\r\n          <mark\r\n            class={value.highlight ? \"dso-highlight\" : undefined}\r\n            ref={(ref) => value.highlight && ref && emitMarkItemHighlight(value.text, ref)}\r\n          >\r\n            {value.text}\r\n          </mark>\r\n        );\r\n      })}\r\n    </Fragment>\r\n  );\r\n};\r\n"]}

package/dist/collection/functional-components/mark-text/mark-text.interfaces.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=mark-text.interfaces.js.map

package/dist/collection/functional-components/mark-text/mark-text.interfaces.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mark-text.interfaces.js","sourceRoot":"","sources":["../../../../src/functional-components/mark-text/mark-text.interfaces.ts"],"names":[],"mappings":"","sourcesContent":["export type MarkTextMarkFunction = (text: string) => MarkTextText[] | undefined;\r\n\r\nexport type MarkTextText = MarkTextMarkItem | string;\r\n\r\nexport interface MarkTextMarkItem {\r\n  text: string;\r\n  highlight?: boolean;\r\n}\r\n"]}

package/dist/collection/utils/parse-xml.js

@@ -0,0 +1,17 @@
+const parser = new DOMParser();
+export function parseXml(input) {
+    if (!input) {
+        return undefined;
+    }
+    const doc = parser.parseFromString(input, "application/xml");
+    if (doc.querySelector("parsererror")) {
+        console.error({
+            message: "Unable to parse XML",
+            input,
+            document: doc,
+        }, null, 2);
+        return undefined;
+    }
+    return doc;
+}
+//# sourceMappingURL=parse-xml.js.map

package/dist/collection/utils/parse-xml.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"parse-xml.js","sourceRoot":"","sources":["../../../src/utils/parse-xml.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,GAAG,IAAI,SAAS,EAAE,CAAC;AAE/B,MAAM,UAAU,QAAQ,CAAC,KAAa;IACpC,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,MAAM,GAAG,GAAG,MAAM,CAAC,eAAe,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC;IAE7D,IAAI,GAAG,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,CAAC;QACrC,OAAO,CAAC,KAAK,CACX;YACE,OAAO,EAAE,qBAAqB;YAC9B,KAAK;YACL,QAAQ,EAAE,GAAG;SACd,EACD,IAAI,EACJ,CAAC,CACF,CAAC;QAEF,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,OAAO,GAAG,CAAC;AACb,CAAC","sourcesContent":["const parser = new DOMParser();\r\n\r\nexport function parseXml(input: string): XMLDocument | undefined {\r\n  if (!input) {\r\n    return undefined;\r\n  }\r\n\r\n  const doc = parser.parseFromString(input, \"application/xml\");\r\n\r\n  if (doc.querySelector(\"parsererror\")) {\r\n    console.error(\r\n      {\r\n        message: \"Unable to parse XML\",\r\n        input,\r\n        document: doc,\r\n      },\r\n      null,\r\n      2,\r\n    );\r\n\r\n    return undefined;\r\n  }\r\n\r\n  return doc;\r\n}\r\n"]}

package/dist/components/annotation-locatie.js

@@ -8,7 +8,7 @@ import { d as defineCustomElement$3 } from './renvooi.js';
 import { d as defineCustomElement$2 } from './slide-toggle.js';
 import { d as defineCustomElement$1 } from './tooltip.js';
 
-const annotationCss = "a{background-color:transparent;color:var(--link-color);text-decoration:underline;text-underline-offset:15%}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a :is(dso-icon,svg.di)+span,a span+:is(dso-icon,svg.di){margin-inline-start:8px}a .sr-only+:is(dso-icon,svg.di){margin-inline-start:0}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-link-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:var(--_dso-di-background-image, url(\"./di.svg#download\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#download-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-link-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-link-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-image:var(--_dso-di-background-image, url(\"./di.svg#call-grasgroen\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#call-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-link-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-image:var(--_dso-di-background-image, url(\"./di.svg#email-grasgroen\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#email-scampi\"))}:host{display:block;padding:2px}:host([wijzigactie=voegtoe]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919}:host([wijzigactie=voegtoe]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}:host([wijzigactie=voegtoe]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}:host([wijzigactie=voegtoe]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}:host([wijzigactie=voegtoe]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}:host([wijzigactie=voegtoe]){box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5)}:host([wijzigactie=verwijder]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919}:host([wijzigactie=verwijder]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}:host([wijzigactie=verwijder]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}:host([wijzigactie=verwijder]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}:host([wijzigactie=verwijder]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}:host([wijzigactie=verwijder]){text-decoration:line-through}@media screen and (min--moz-device-pixel-ratio: 0){:host([wijzigactie=verwijder]){font-family:sans-serif}}*,*::after,*::before{box-sizing:border-box}.annotation-body{display:flex;gap:8px}.annotation-info{flex-grow:1}.annotation-symbol,.annotation-control{flex-shrink:0}.annotation-title{font-weight:500;overflow-wrap:anywhere}.annotation-title,.annotation-data{margin-block:0}.annotation-title .content:has(+dso-label),.annotation-data .content:has(+dso-label){margin-inline-end:4px}.annotation-data{font-size:0.875rem}";
+const annotationCss = "a{background-color:transparent;color:var(--link-color);text-decoration:underline;text-underline-offset:15%}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a dso-icon+span,a span+dso-icon{margin-inline-start:8px}a .sr-only+dso-icon{margin-inline-start:0}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-link-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:var(--_dso-di-background-image, url(\"./di.svg#download\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#download-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-link-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-link-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-image:var(--_dso-di-background-image, url(\"./di.svg#call-grasgroen\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#call-scampi\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-link-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-image:var(--_dso-di-background-image, url(\"./di.svg#email-grasgroen\"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:focus-visible{background-image:var(--_dso-di-background-image, url(\"./di.svg#email-scampi\"))}:host{display:block;padding:2px}:host([wijzigactie=voegtoe]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919}:host([wijzigactie=voegtoe]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}:host([wijzigactie=voegtoe]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}:host([wijzigactie=voegtoe]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}:host([wijzigactie=voegtoe]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}:host([wijzigactie=voegtoe]){box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:colors.$zwart}:host([wijzigactie=verwijder]){--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919}:host([wijzigactie=verwijder]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#download-zwart\"))}:host([wijzigactie=verwijder]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#external-link-zwart\"))}:host([wijzigactie=verwijder]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#call-zwart\"))}:host([wijzigactie=verwijder]) a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:var(--_dso-di-background-image, url(\"./di.svg#email-zwart\"))}:host([wijzigactie=verwijder]){--_dso-ozon-content-toggletip-color:colors.$zwart;text-decoration:line-through;--_dso-ozon-content-toggletip-text-decoration:underline line-through}@media screen and (min--moz-device-pixel-ratio: 0){:host([wijzigactie=verwijder]){font-family:sans-serif}}*,*::after,*::before{box-sizing:border-box}.annotation-body{display:flex;gap:8px}.annotation-info{flex-grow:1}.annotation-symbol,.annotation-control{flex-shrink:0}.annotation-title{font-weight:500;overflow-wrap:anywhere}.annotation-title,.annotation-data{margin-block:0}.annotation-title .content:has(+dso-label),.annotation-data .content:has(+dso-label){margin-inline-end:4px}.annotation-data{font-size:0.875rem}";
 
 const AnnotationLocatie = /*@__PURE__*/ proxyCustomElement(class AnnotationLocatie extends HTMLElement {
     constructor() {

package/dist/components/annotation-locatie.js.map

@@ -1 +1 @@
-{"file":"annotation-locatie.js","mappings":";;;;;;;;;;AAAA,MAAM,aAAa,GAAG,yxMAAyxM;;MCiBlyM,iBAAiB,iBAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAA,WAAA,CAAA;AAL9B,IAAA,WAAA,GAAA;;;;;QAuCU,IAAA,CAAA,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;AA6BrC;IA3BC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE;;IAGtB,oBAAoB,GAAA;AAClB,QAAA,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;;IAGxB,MAAM,GAAA;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE;AAE5C,QAAA,QACE,CAAA,CAAC,cAAc,EAAA,EAAA,GAAA,EAAA,0CAAA,EACb,MAAM,EAAE,UAAU,GAAG,CAAC,CAAA,oBAAoB,OAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACH,CAAA,CAAA,QAAA,EAAA,IAAA,EACE,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EACnB,CAAA,CAAA,aAAA,EAAA,EAAa,KAAK,EAAE,IAAI,CAAC,aAAa,GAAI,CACrC,EACN,IAAI,CAAC,iBAAiB,IAAI,CAAA,CAAC,2BAA2B,EAAG,IAAA,CAAA,CACzD,EAEL,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-locatie&encapsulation=shadow","src/components/annotation/annotation-locatie/annotation-locatie.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/link/link\";\r\n\r\n:host {\r\n  display: block;\r\n  padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n  @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n  flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n  font-weight: 500;\r\n  overflow-wrap: anywhere;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n  margin-block: 0;\r\n\r\n  .content:has(+ dso-label) {\r\n    margin-inline-end: units.$u1 * 0.5;\r\n  }\r\n}\r\n\r\n.annotation-data {\r\n  font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Element, Event, EventEmitter, Fragment, Prop, h } from \"@stencil/core\";\r\n\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\n\r\n/**\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-locatie\",\r\n  styleUrl: \"../annotation.scss\",\r\n  shadow: true,\r\n})\r\nexport class AnnotationLocatie implements ComponentInterface {\r\n  /**\r\n   * Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  wijzigactie?: AnnotationWijzigactie;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de annotatie actief is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  active?: boolean;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  gewijzigdeLocatie?: boolean;\r\n\r\n  /**\r\n   * Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n   */\r\n  @Event()\r\n  dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n  /**\r\n   * De noemer van de locatie.\r\n   */\r\n  @Prop()\r\n  locatieNoemer?: RenvooiValue | string;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoAnnotationLocatieElement;\r\n\r\n  private watcher = watcher(this.host);\r\n\r\n  connectedCallback(): void {\r\n    this.watcher.watch();\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.watcher.unwatch();\r\n  }\r\n\r\n  render() {\r\n    const hasSymbool = this.watcher.hasSymbool();\r\n\r\n    return (\r\n      <AnnotationBody\r\n        symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n        active={this.active}\r\n        dsoActiveChange={this.dsoActiveChange}\r\n        title={\r\n          <>\r\n            <span class=\"content\">\r\n              <dso-renvooi value={this.locatieNoemer} />\r\n            </span>\r\n            {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n          </>\r\n        }\r\n      />\r\n    );\r\n  }\r\n}\r\n"],"version":3}
+{"file":"annotation-locatie.js","mappings":";;;;;;;;;;AAAA,MAAM,aAAa,GAAG,85MAA85M;;MCiBv6M,iBAAiB,iBAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAA,WAAA,CAAA;AAL9B,IAAA,WAAA,GAAA;;;;;QAuCU,IAAA,CAAA,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;AA6BrC;IA3BC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE;;IAGtB,oBAAoB,GAAA;AAClB,QAAA,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;;IAGxB,MAAM,GAAA;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE;AAE5C,QAAA,QACE,CAAA,CAAC,cAAc,EAAA,EAAA,GAAA,EAAA,0CAAA,EACb,MAAM,EAAE,UAAU,GAAG,CAAC,CAAA,oBAAoB,OAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACH,CAAA,CAAA,QAAA,EAAA,IAAA,EACE,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EACnB,CAAA,CAAA,aAAA,EAAA,EAAa,KAAK,EAAE,IAAI,CAAC,aAAa,GAAI,CACrC,EACN,IAAI,CAAC,iBAAiB,IAAI,CAAA,CAAC,2BAA2B,EAAG,IAAA,CAAA,CACzD,EAEL,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-locatie&encapsulation=shadow","src/components/annotation/annotation-locatie/annotation-locatie.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/link/link\";\r\n\r\n:host {\r\n  display: block;\r\n  padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n  @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n  flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n  font-weight: 500;\r\n  overflow-wrap: anywhere;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n  margin-block: 0;\r\n\r\n  .content:has(+ dso-label) {\r\n    margin-inline-end: units.$u1 * 0.5;\r\n  }\r\n}\r\n\r\n.annotation-data {\r\n  font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Element, Event, EventEmitter, Fragment, Prop, h } from \"@stencil/core\";\r\n\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\n\r\n/**\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-locatie\",\r\n  styleUrl: \"../annotation.scss\",\r\n  shadow: true,\r\n})\r\nexport class AnnotationLocatie implements ComponentInterface {\r\n  /**\r\n   * Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  wijzigactie?: AnnotationWijzigactie;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de annotatie actief is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  active?: boolean;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  gewijzigdeLocatie?: boolean;\r\n\r\n  /**\r\n   * Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n   */\r\n  @Event()\r\n  dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n  /**\r\n   * De noemer van de locatie.\r\n   */\r\n  @Prop()\r\n  locatieNoemer?: RenvooiValue | string;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoAnnotationLocatieElement;\r\n\r\n  private watcher = watcher(this.host);\r\n\r\n  connectedCallback(): void {\r\n    this.watcher.watch();\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.watcher.unwatch();\r\n  }\r\n\r\n  render() {\r\n    const hasSymbool = this.watcher.hasSymbool();\r\n\r\n    return (\r\n      <AnnotationBody\r\n        symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n        active={this.active}\r\n        dsoActiveChange={this.dsoActiveChange}\r\n        title={\r\n          <>\r\n            <span class=\"content\">\r\n              <dso-renvooi value={this.locatieNoemer} />\r\n            </span>\r\n            {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n          </>\r\n        }\r\n      />\r\n    );\r\n  }\r\n}\r\n"],"version":3}