@dso-toolkit/core 62.30.1 → 64.0.0

package/dist/collection/components/ozon-content/nodes/figuur.node.js.map

@@ -1 +1 @@
-{"version":3,"file":"figuur.node.js","sourceRoot":"","sources":["../../../../../src/components/ozon-content/nodes/figuur.node.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Fragment, h, JSX } from \"@stencil/core\";\r\n\r\nimport { getNodeName } from \"../get-node-name.function\";\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\ntype BijschriftProps = {\r\n  bijschrift?: IBijschrift;\r\n  bron?: ChildNode;\r\n  mapNodeToJsx: (node: Node | NodeList | Node[]) => JSX.Element;\r\n};\r\n\r\ninterface IBijschrift {\r\n  inhoud: NodeListOf<ChildNode>;\r\n  locatie: string;\r\n}\r\n\r\nconst Bijschrift = ({ bijschrift, bron, mapNodeToJsx }: BijschriftProps): HTMLSpanElement => {\r\n  return (\r\n    <span class=\"figuur-bijschrift\">\r\n      {bijschrift && bijschrift.inhoud && mapNodeToJsx(bijschrift.inhoud)}\r\n      {bron && (\r\n        <Fragment>\r\n          {`${bijschrift ? \" \" : \"\"}(bron: `}\r\n          {mapNodeToJsx(bron)})\r\n        </Fragment>\r\n      )}\r\n    </span>\r\n  );\r\n};\r\n\r\nexport class OzonContentFiguurNode implements OzonContentNode {\r\n  name = [\"Figuur\"];\r\n\r\n  setImageDimensions(imageElement: HTMLImageElement, schaal: number) {\r\n    const { naturalHeight, naturalWidth } = imageElement;\r\n\r\n    imageElement.height = naturalHeight * (schaal / 100);\r\n    imageElement.width = naturalWidth * (schaal / 100);\r\n  }\r\n\r\n  onImageLoad(event: Event, schaal?: number) {\r\n    if (event.target instanceof HTMLImageElement && schaal) {\r\n      this.setImageDimensions(event.target, schaal);\r\n    }\r\n  }\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    const childNodes = Array.from(node.childNodes);\r\n    const titel = childNodes.find((n) => getNodeName(n) === \"Titel\")?.textContent;\r\n    const bron = childNodes.find((n) => getNodeName(n) === \"Bron\");\r\n\r\n    const illustratieNode = childNodes.find((n) => getNodeName(n) === \"Illustratie\");\r\n    const bijschriftNode = childNodes.find((n) => getNodeName(n) === \"Bijschrift\");\r\n\r\n    const wijzigactie = node.getAttribute(\"wijzigactie\") || undefined;\r\n\r\n    if (illustratieNode instanceof Element) {\r\n      const illustratie = {\r\n        naam: illustratieNode.getAttribute(\"naam\"),\r\n        breedte: illustratieNode.getAttribute(\"breedte\"),\r\n        hoogte: illustratieNode.getAttribute(\"hoogte\"),\r\n        uitlijning: illustratieNode.getAttribute(\"uitlijning\"),\r\n        alt: illustratieNode.getAttribute(\"alt\"),\r\n        schaal: illustratieNode.getAttribute(\"schaal\"),\r\n      };\r\n\r\n      const bijschrift =\r\n        bijschriftNode instanceof Element\r\n          ? {\r\n              inhoud: bijschriftNode.childNodes,\r\n              locatie: bijschriftNode.getAttribute(\"locatie\") ?? \"onder\",\r\n            }\r\n          : undefined;\r\n\r\n      return (\r\n        <div class={`dso-ozon-figuur ${bijschrift ? `bijschrift-${bijschrift.locatie}` : \"onder\"}`}>\r\n          {titel && <span class=\"figuur-titel\">{titel}</span>}\r\n          {bijschrift?.locatie === \"boven\" && (\r\n            <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n          )}\r\n          <dso-image-overlay wijzigactie={wijzigactie}>\r\n            {titel && (\r\n              <div slot=\"titel\">\r\n                <span>{titel}</span>\r\n              </div>\r\n            )}\r\n            <img\r\n              src={illustratie.naam ?? undefined}\r\n              alt={illustratie.alt ?? titel ?? illustratie.naam ?? undefined}\r\n              onLoad={(event: Event) => this.onImageLoad(event, Number(illustratie.schaal))}\r\n            />\r\n            {(bijschrift || bron) && (\r\n              <div slot=\"bijschrift\">\r\n                <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n              </div>\r\n            )}\r\n          </dso-image-overlay>\r\n          {(bijschrift?.locatie === \"onder\" || (!bijschrift && bron)) && (\r\n            <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n          )}\r\n        </div>\r\n      );\r\n    }\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"figuur.node.js","sourceRoot":"","sources":["../../../../../src/components/ozon-content/nodes/figuur.node.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Fragment, h, JSX } from \"@stencil/core\";\r\n\r\nimport { getNodeName } from \"../get-node-name.function\";\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\ntype BijschriftProps = {\r\n  bijschrift?: IBijschrift;\r\n  bron?: ChildNode;\r\n  mapNodeToJsx: (node: Node | NodeList | Node[]) => JSX.Element;\r\n};\r\n\r\ninterface IBijschrift {\r\n  inhoud: NodeListOf<ChildNode>;\r\n  locatie: string;\r\n}\r\n\r\nconst Bijschrift = ({ bijschrift, bron, mapNodeToJsx }: BijschriftProps): HTMLSpanElement => {\r\n  return (\r\n    <span class=\"figuur-bijschrift\">\r\n      {bijschrift && bijschrift.inhoud && mapNodeToJsx(bijschrift.inhoud)}\r\n      {bron && (\r\n        <Fragment>\r\n          {`${bijschrift ? \" \" : \"\"}(bron: `}\r\n          {mapNodeToJsx(bron)})\r\n        </Fragment>\r\n      )}\r\n    </span>\r\n  );\r\n};\r\n\r\nexport class OzonContentFiguurNode implements OzonContentNode {\r\n  name = [\"Figuur\"];\r\n\r\n  getStyle(breedte: number, hoogte: number) {\r\n    if (breedte && hoogte) {\r\n      return {\r\n        \"--img-aspect-ratio\": (breedte / hoogte).toString(),\r\n      };\r\n    }\r\n    return;\r\n  }\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    const childNodes = Array.from(node.childNodes);\r\n    const titel = childNodes.find((n) => getNodeName(n) === \"Titel\")?.textContent;\r\n    const bron = childNodes.find((n) => getNodeName(n) === \"Bron\");\r\n\r\n    const illustratieNode = childNodes.find((n) => getNodeName(n) === \"Illustratie\");\r\n    const bijschriftNode = childNodes.find((n) => getNodeName(n) === \"Bijschrift\");\r\n\r\n    const wijzigactie = node.getAttribute(\"wijzigactie\") || undefined;\r\n\r\n    if (illustratieNode instanceof Element) {\r\n      const illustratie = {\r\n        naam: illustratieNode.getAttribute(\"naam\"),\r\n        breedte: illustratieNode.getAttribute(\"breedte\"),\r\n        hoogte: illustratieNode.getAttribute(\"hoogte\"),\r\n        uitlijning: illustratieNode.getAttribute(\"uitlijning\"),\r\n        alt: illustratieNode.getAttribute(\"alt\"),\r\n      };\r\n\r\n      const bijschrift =\r\n        bijschriftNode instanceof Element\r\n          ? {\r\n              inhoud: bijschriftNode.childNodes,\r\n              locatie: bijschriftNode.getAttribute(\"locatie\") ?? \"onder\",\r\n            }\r\n          : undefined;\r\n\r\n      const preventLayoutShift = !!Number(illustratie.breedte) && !!Number(illustratie.hoogte);\r\n\r\n      return (\r\n        <div class={`dso-ozon-figuur ${bijschrift ? `bijschrift-${bijschrift.locatie}` : \"onder\"}`}>\r\n          {titel && <span class=\"figuur-titel\">{titel}</span>}\r\n          {bijschrift?.locatie === \"boven\" && (\r\n            <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n          )}\r\n          <dso-image-overlay wijzigactie={wijzigactie}>\r\n            {titel && (\r\n              <div slot=\"titel\">\r\n                <span>{titel}</span>\r\n              </div>\r\n            )}\r\n            <img\r\n              src={illustratie.naam ?? undefined}\r\n              alt={illustratie.alt ?? titel ?? illustratie.naam ?? undefined}\r\n              class={{ \"dso-ozon-figuur-reserve-space\": preventLayoutShift }}\r\n              style={this.getStyle(Number(illustratie.breedte), Number(illustratie.hoogte))}\r\n            />\r\n            {(bijschrift || bron) && (\r\n              <div slot=\"bijschrift\">\r\n                <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n              </div>\r\n            )}\r\n          </dso-image-overlay>\r\n          {(bijschrift?.locatie === \"onder\" || (!bijschrift && bron)) && (\r\n            <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n          )}\r\n        </div>\r\n      );\r\n    }\r\n  }\r\n}\r\n"]}

package/dist/collection/components/ozon-content/ozon-content.css

@@ -1354,6 +1354,11 @@ a:visited {
   font-weight: 500;
   padding-block-end: 0.5rem;
 }
+.dso-ozon-figuur .dso-ozon-figuur-reserve-space {
+  inline-size: 100%;
+  block-size: auto;
+  aspect-ratio: var(--img-aspect-ratio);
+}
 
 .dso-ozon-lijst span.od-Lijstaanhef,
 .dso-ozon-lijst span.od-Lijstsluiting {

package/dist/collection/components/ozon-content/ozon-content.js

@@ -24,7 +24,7 @@ export class OzonContent {
             emitAnchorClick: this.dsoAnchorClick.emit,
         };
         const transformed = mapper.transform(this.content, context);
-        return h(Fragment, { key: '56c934de3771646d5583784675fbfcce735c8700' }, transformed);
+        return h(Fragment, { key: '4bbbcce8c6bb0813b789bb99b61165158aa5e713' }, transformed);
     }
     static get is() { return "dso-ozon-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/panel/panel.js

@@ -5,7 +5,7 @@ import { h } from "@stencil/core";
  */
 export class Panel {
     render() {
-        return (h("div", { key: '022f08b90fec917193c835d5464bba3c82dcb591', class: "dso-panel" }, h("div", { key: '729d9d77542cef2f42d8327d801db73ebc00093c', class: "panel-heading" }, h("slot", { key: '9afc64d9c40b150f2c06d108fc3e6c0c5b9ee9d9', name: "heading" }), h("button", { key: '23a5e3c7ca055069f735a112c305199d203a0554', type: "button", class: "panel-close", onClick: (e) => this.dsoCloseClick.emit({ originalEvent: e }) }, h("dso-icon", { key: '193d6bbf93e4b0d994c6eac62c50728ec905c472', icon: "times" }), h("span", { key: '319a762facf6abe17541cef1c3a63a4d5bba78cb', class: "sr-only" }, "Sluiten"))), h("div", { key: '4739d349f4df3b7ff8500c3da34adafa7246b2da', class: "panel-body" }, h("slot", { key: '49784b09addb82d7be1f102f2d2ee8ea499beed3' }))));
+        return (h("div", { key: '2aa1880aa5031f232950eb0372e5a96114c1b421', class: "dso-panel" }, h("div", { key: '0586b211ea50107d84d072e455bbc9f4ae6153e9', class: "panel-heading" }, h("slot", { key: '792dac97f4c1a5765c188755e859119cc5363bd0', name: "heading" }), h("button", { key: 'bb6d3f6858a3612c62a0830eedbb43e3def20097', type: "button", class: "panel-close", onClick: (e) => this.dsoCloseClick.emit({ originalEvent: e }) }, h("dso-icon", { key: '1534722f09889d9b4d24bac4c4648da0c36c0cb6', icon: "times" }), h("span", { key: '42175bab99b216f80cf93b8a58e8e1f7037e4fbe', class: "sr-only" }, "Sluiten"))), h("div", { key: '375d898962eefe7038f60a700a71eca6c6fddf39', class: "panel-body" }, h("slot", { key: '8ca367b60353c6f5193fca6e8923b1cf717efcbb' }))));
     }
     static get is() { return "dso-panel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/progress-bar/progress-bar.js

@@ -8,7 +8,7 @@ export class ProgressBar {
     render() {
         const progressNumber = Math.round(this.progress);
         const progressPercentage = `${progressNumber}%`;
-        return (h("div", { key: 'bdc673d9d6081248f02eb13bf4cc45e97ce9d754', class: "progress" }, h("span", { key: 'fc6057145d710db59a2cd6e4ac62fc98e3663211', class: "progress-bar", role: "progressbar", "aria-labelledby": "progress-bar-label", "aria-valuenow": progressNumber, "aria-valuemin": this.min, "aria-valuemax": this.max }, h("span", { key: 'c559fdf1e1777c56acf960c8cbf6154f53da393c', style: { width: `${progressPercentage}` } })), h("span", { key: '42182aff70df5a667494d0c0e294a72349c194db', id: "progress-bar-label" }, h("slot", { key: 'fdd9990227e7ef80254da1722573fc4447f9ae90' }))));
+        return (h("div", { key: 'd1b4e6eb8fc5a1ee9b96f0774474420c271f759b', class: "progress" }, h("span", { key: 'b7a00ad201b2c7001c6ec7286b4aed496b7d8d2a', class: "progress-bar", role: "progressbar", "aria-labelledby": "progress-bar-label", "aria-valuenow": progressNumber, "aria-valuemin": this.min, "aria-valuemax": this.max }, h("span", { key: '471b0487eeec277707610bc0b81bb2c860fe02ac', style: { width: `${progressPercentage}` } })), h("span", { key: '513aa7c0f9881c9d95d54264553b16ddf0121e42', id: "progress-bar-label" }, h("slot", { key: '6ad0ef5debf6fb5d67c3b38ab0ad148c855a4242' }))));
     }
     static get is() { return "dso-progress-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/progress-indicator/progress-indicator.js

@@ -6,7 +6,7 @@ export class Progressindicator {
         this.block = undefined;
     }
     render() {
-        return (h(Host, { key: '04ef421f4e4c9cf89ed34be36db74f15a6748420' }, h("span", { key: 'b87ebbc00e72620efb489705810a410ab48960ca', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, h("dso-icon", { key: 'be0db28fba99c69709391f20dc12b9d09b09543f', icon: "spinner" })), h("span", { key: '4aacf84583df42fa43882edd37ff5ae16c94c075', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label)));
+        return (h(Host, { key: '440766221ff19b173b505532d6b60be79b623317' }, h("span", { key: '781521a235e3b3c364366557640730aee91bccd7', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, h("dso-icon", { key: 'ceecb6ba70c42f432d59ae0fc12402c4e35034c2', icon: "spinner" })), h("span", { key: '0ef394a7b0d5923b4553d281a4f867b0e89fa441', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label)));
     }
     static get is() { return "dso-progress-indicator"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/responsive-element/responsive-element.js

@@ -40,7 +40,7 @@ export class ResponsiveElement {
         this.observer.unobserve(this.host);
     }
     render() {
-        return (h(Host, { key: '9f8ba3138337e6500b7dc1469f59b7f5c37286ab', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, h("slot", { key: '343a43ce9e959c71ab0ec49060d8896ab68e345d' })));
+        return (h(Host, { key: '4d5e917e2e7a46743621de2c38e124b9ddd6821f', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, h("slot", { key: 'ff4856f719b596eeb4caab380f22afd386c63ab7' })));
     }
     static get is() { return "dso-responsive-element"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/scrollable/scrollable.js

@@ -81,9 +81,9 @@ export class Scrollable {
         this.slottedElements.forEach((element) => resizeObserver.unobserve(element));
     }
     render() {
-        return (h("div", { key: '7ee4b091abcc01621390845a8293f16ff4044746', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, h("div", { key: '9cee13a5d094ba844f2069a253d37cfc2342fed7', ref: (el) => (this.scrollContainerDiv = el), class: clsx("dso-scroll-container", {
+        return (h("div", { key: 'd9c73f524fa17860c1cad8a0ca960d7db540dbab', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, h("div", { key: 'b2ce5ba340f7907fcb111c0395d7e22324e58237', ref: (el) => (this.scrollContainerDiv = el), class: clsx("dso-scroll-container", {
                 [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== "noScroll",
-            }), onScroll: () => this._setScrollState() }, h("slot", { key: '2473a4ed767a8d6e8c76c63f2054d852f051ac45' }))));
+            }), onScroll: () => this._setScrollState() }, h("slot", { key: '47cf6e7432017040b5e3c5815427f11d10f1b8e8' }))));
     }
     static get is() { return "dso-scrollable"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/selectable/selectable.js

@@ -63,7 +63,7 @@ export class Selectable {
     render() {
         var _a;
         const hasInfo = !!this.host.querySelector('[slot="info"]');
-        return (h(Fragment, { key: '0cbf9eb4ab6e2d8510f3ca3e3a1fe9f6be1c9f17' }, h("div", { key: 'bd82b5657d192f3d855183100794b257c0b8bff1', class: "dso-selectable-container" }, h("div", { key: 'c76c3c223acdf8e7954e7d04ed3fa79044e9d19b', class: clsx("dso-selectable-input-wrapper", { "dso-keyboard-focus": this.keyboardFocus }) }, h("input", { key: '7e881b0259bc9a34cf5dcff88af8be2b66ce9f80', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": hasInfo && this.infoFixed ? this.describedById : undefined, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, onBlur: () => (this.keyboardFocus = false), onKeyUp: () => (this.keyboardFocus = true), ref: (el) => (this.input = el) }), !this.labelledById ? (h("label", { htmlFor: this.getIdentifier() }, h("slot", null))) : (h("label", null, h("slot", null)))), hasInfo && !this.infoFixed && (h("dso-info-button", { key: '9c79309fc1e0c73a9ae55722ea0e58bfbca0a63c', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: 'c329819cc92b649483fc4de5f49d683c941ff81f', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: '0e0e3c4c78ab6ad828fe2201ec818cc1181bfbea' }, h("slot", { key: '83121c8ec4075d1e688b06c306b7ce142399f799', name: "info" })))), h("slot", { key: '53429644d8c03912156f6c3915f5f9b445bd92ce', name: "options" })));
+        return (h(Fragment, { key: '91453618df769cca5d2b8b11d0749d27b53f59b1' }, h("div", { key: '517f33fff46189d305568f6e68168831a94c0c57', class: "dso-selectable-container" }, h("div", { key: 'ef669b7497bd52b108d4c877493dbe772d8700a4', class: clsx("dso-selectable-input-wrapper", { "dso-keyboard-focus": this.keyboardFocus }) }, h("input", { key: 'c6f2aa35044581a2d5f7f43d870ba0ce22424c92', type: this.type, id: this.getIdentifier(), value: this.value, name: this.name, "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": hasInfo && this.infoFixed ? this.describedById : undefined, "aria-labelledBy": this.labelledById, disabled: this.disabled, required: this.required, checked: this.checked, onChange: this.handleOnChange, onBlur: () => (this.keyboardFocus = false), onKeyUp: () => (this.keyboardFocus = true), ref: (el) => (this.input = el) }), !this.labelledById ? (h("label", { htmlFor: this.getIdentifier() }, h("slot", null))) : (h("label", null, h("slot", null)))), hasInfo && !this.infoFixed && (h("dso-info-button", { key: 'b5482b39b6045fcdffb4cd2284f83bd9f554f267', active: this.infoActive, onDsoToggle: (e) => (this.infoActive = e.detail.active) }))), hasInfo && (h("dso-info", { key: 'e66998b45aa63933b73d0c54eeb3ccbae8246bee', id: hasInfo && this.infoFixed ? this.describedById : undefined, fixed: this.infoFixed, active: this.infoActive, onDsoClose: () => (this.infoActive = false) }, h("div", { key: '8b2033a0b23d356be3804632698e687310de6ed7' }, h("slot", { key: '411eafba867420af9d581d7af5f35cec59fff133', name: "info" })))), h("slot", { key: 'e1d3855d686c4bc6119f65a76d889f5c2d44dcb6', name: "options" })));
     }
     componentDidRender() {
         if (this.input && typeof this.checked === "boolean" && this.input.checked !== this.checked) {

package/dist/collection/components/slide-toggle/slide-toggle.js

@@ -19,7 +19,7 @@ export class SlideToggle {
         this.hasVisibleLabel = this.host.querySelector("*") !== null;
     }
     render() {
-        return (h(Fragment, null, h("button", Object.assign({ key: 'db116bc4038f16564db934d76c61a7736b55e99a', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e) }, (this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), (this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {})), h("svg", { key: '17aea2f95f7dd1f7f8bfcfb12d2c27347c2bf2a0', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, h("g", { key: 'bd837d6f3e5171c7f465cdbc28b0196b25d196ef', fill: "none", "fill-rule": "evenodd" }, h("rect", { key: 'b74ad3db6f44fc87860074efaa52acf34e76ff93', width: "40", height: "20", fill: "currentColor", rx: "10" }), h("circle", { key: 'e0f0b2e587dbd4ef71c072b6bb1b491cda527c79', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (h("label", { key: '343cbc919806fd61c79b5da19fb139b070ae71f2', htmlFor: this.identifier }, h("slot", { key: 'd1b665086fb74c9173b4f2ffaf01030dd1c44861' })))));
+        return (h(Fragment, null, h("button", Object.assign({ key: '7ce2d8bf2bb8ba405449eaefc5762cb67a4ac4dc', id: this.identifier, role: "switch", class: "dso-slider", "aria-checked": "" + this.checked, disabled: this.disabled, onClick: (e) => this.handleSwitch(e) }, (this.accessibleLabel ? { "aria-label": this.accessibleLabel } : {}), (this.labelledbyId ? { "aria-labelledby": this.labelledbyId } : {})), h("svg", { key: '12e21116b6fc68e0bf49c53496940bd580e6f10b', xmlns: "http://www.w3.org/2000/svg", width: "40", height: "20", viewBox: "0 0 40 20" }, h("g", { key: 'aca7818aa5260621fc58279481b312ada6dbddc7', fill: "none", "fill-rule": "evenodd" }, h("rect", { key: 'dfbc32a846cea43c346f10d70076a261db8d5d96', width: "40", height: "20", fill: "currentColor", rx: "10" }), h("circle", { key: '9497b94ec12c7629550c95228fc975c9fdd9520c', cy: "10", r: "8", fill: "currentColor" })))), this.hasVisibleLabel && (h("label", { key: 'b5859b19eb2aaddc36b39bb57874f0ae8bf637fc', htmlFor: this.identifier }, h("slot", { key: 'd98d76eb907c33f5a1bb0427a3fa5d9b2a99b32a' })))));
     }
     static get is() { return "dso-slide-toggle"; }
     static get originalStyleUrls() {

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

@@ -30,7 +30,7 @@ export class Table {
     render() {
         var _a, _b;
         const caption = (_b = (_a = this.host.querySelector(":scope > table > caption")) === null || _a === void 0 ? void 0 : _a.textContent) === null || _b === void 0 ? void 0 : _b.trim();
-        return (h(Host, { key: '6934c29baf1a2a52622121a47cbaa457a110bcaa' }, this.modalActive && this.placeholderHeight && (h("div", { key: '95bc90f0f6c26bcbed4877b3ffb008ed38a39033', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive && h("div", { key: 'f6b9c387003cfd31cbfd409a2c5e852f70f83c05', class: "dso-modal-overlay" }), h("div", { key: 'f5b6d711e7969d2f595afaa6b60c384fd9156e68', class: { "dso-modal": this.modalActive } }, h("div", Object.assign({ key: '7ed9575bf767603ec9542997fb79314e2ad3f62a', 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: '99ca7885db803ecacdd2c293e6027556af138ee9', class: "dso-table-utilities", style: this.modalActive ? { display: "none" } : undefined }, this.isResponsive && (h("div", { key: 'bad69741f0bafffa859ff245f7c3cca8012363ac', class: "dso-responsive-message" }, h("span", { key: 'fe3869eb853a024b2fc7d1fef1412ab7c6ed7783' }, "beweeg de tabel van links naar rechts"))), !this.noModal && (h("button", { key: '5f6e9850584490a0b33188869133d1d0043ecd0b', type: "button", class: "dso-tertiary open-modal-button", ref: (element) => (this.buttonElement = element), onClick: () => this.openModal() }, h("span", { key: 'f322b245c215ca3212b19fc1a7adcf18f176c16d', class: "sr-only" }, "tabel ", caption !== null && caption !== void 0 ? caption : "", " "), h("span", { key: '9fb2df6a3abe878b4cd84e4dcebd08c4ea2a83da' }, "vergroten"), h("dso-icon", { key: 'fa709f8ad9cefbb0a7384b2bb5feece07a9ae851', icon: "external-link" }))))), this.modalActive && (h("div", { key: '6c86b4a24fec9edbd8cab2eb226c9d1c77e117fd', class: "dso-header" }, h("h2", { key: '311cd0f1a29d23f1918f7554df67b5348af863a6', id: this.labelledbyId, class: { "sr-only": !caption } }, caption || "Uitvergrote tabel dialoog"), h("button", { key: '21e51c50991d349e53e2fe57eaf584c519243478', type: "button", class: "dso-close", onClick: () => this.closeModal() }, h("dso-icon", { key: 'ae2154d5bd3360b39835aaedc4a18e6da9e54ee0', icon: "times" }), h("span", { key: '5c78d4923438cb45f7172b00a19fe5474313ac88', class: "sr-only" }, "Sluiten")))), h("div", { key: 'f43b2140da2c87e015702bbdd219e08ed8962225', class: { "dso-body": this.modalActive, "dso-table-body": true } }, h("slot", { key: 'fce1f821c3cbe2460e5375895d03ce3a7033ad56' }))))));
+        return (h(Host, { key: '1c2e38c6f3217711cafe6542bd11c3d248fb48e9' }, this.modalActive && this.placeholderHeight && (h("div", { key: '4c020d2f6c087f4095c24a99767fe04110d8da86', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive && h("div", { key: 'b1c0d4c9eddb85ef3f6b63ec50b61f75fdeb67f0', class: "dso-modal-overlay" }), h("div", { key: 'c2a1ad13e86fd67850a1a774821f92fe7425e71c', class: { "dso-modal": this.modalActive } }, h("div", Object.assign({ key: '8451d846bbdda8cffe5a45e2608ba57725a7bfec', 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: '12941802e431b50d0397fc6e5718a93e49f5fdc9', class: "dso-table-utilities", style: this.modalActive ? { display: "none" } : undefined }, this.isResponsive && (h("div", { key: 'e60e7c1c42887eba56ce16fd3e4a177e5ae183a2', class: "dso-responsive-message" }, h("span", { key: 'd4909e420fd1f7016bd774d60b453dd81b9f90c9' }, "beweeg de tabel van links naar rechts"))), !this.noModal && (h("button", { key: '4fb9f254a724310cea532d8ea7522fde7f025880', type: "button", class: "dso-tertiary open-modal-button", ref: (element) => (this.buttonElement = element), onClick: () => this.openModal() }, h("span", { key: '93f19b8e5c73554247135c3a18b4e05f263d2b86', class: "sr-only" }, "tabel ", caption !== null && caption !== void 0 ? caption : "", " "), h("span", { key: '4dd3fb097d1e09d95e4e25c12e6a57f8bf27012e' }, "vergroten"), h("dso-icon", { key: '41ba653a6f30b4f5aa6fca791d4616688df95507', icon: "external-link" }))))), this.modalActive && (h("div", { key: 'c865dfdc842892326b83ad888921337ee77a5922', class: "dso-header" }, h("h2", { key: '8b1913d8abc5d8618ba9d94b8e0ce334f10087ee', id: this.labelledbyId, class: { "sr-only": !caption } }, caption || "Uitvergrote tabel dialoog"), h("button", { key: '05994fa6fd752851b92868f690eb4bb8d8197f9f', type: "button", class: "dso-close", onClick: () => this.closeModal() }, h("dso-icon", { key: '2ef2e866d58999eac9653d5ded98bd927a36b1fc', icon: "times" }), h("span", { key: '2b715ea3a09ce362b54d7f5ee6490e8b67cec86b', class: "sr-only" }, "Sluiten")))), h("div", { key: '51129e5af78fe0c0a0fa36b9865054f9b60d12f7', class: { "dso-body": this.modalActive, "dso-table-body": true } }, h("slot", { key: '8cb0bb0a56b801ae50d29eadc180f7729258f627' }))))));
     }
     openModal() {
         this.placeholderHeight = this.host.clientHeight;

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

@@ -2,7 +2,12 @@ import { h, Fragment } from "@stencil/core";
 export class Toggletip {
     constructor() {
         this.click = () => {
-            this.active ? this.close() : this.open();
+            if (this.active) {
+                this.close();
+            }
+            else {
+                this.open();
+            }
         };
         this.open = () => {
             this.active = true;
@@ -35,7 +40,7 @@ export class Toggletip {
         this.secondary = undefined;
     }
     render() {
-        return (h(Fragment, null, h("dso-info-button", { key: '1f3e942335361f2f99d9f63e8787835e6832cb7f', "aria-describedby": "toggle", onClick: this.click, label: this.label, active: this.active, secondary: this.secondary, ref: (element) => (this.infoButton = element) }), h("dso-tooltip", { key: '5c0b05d39e73012f270627ef11547761684074ea', stateless: true, descriptive: true, id: "toggle", strategy: "absolute", active: this.active, position: this.position, small: this.small }, h("slot", { key: '6946258b6128af9d14f5bd76635f8f7b8ff288de' }))));
+        return (h(Fragment, null, h("dso-info-button", { key: '3304cffaef15d2628de0d345889ba52dbf60514a', "aria-describedby": "toggle", onClick: this.click, label: this.label, active: this.active, secondary: this.secondary, ref: (element) => (this.infoButton = element) }), h("dso-tooltip", { key: '4d120364ab6288ded65ea048f7dd7ec18b4f16e0', stateless: true, descriptive: true, id: "toggle", strategy: "absolute", active: this.active, position: this.position, small: this.small }, h("slot", { key: 'ab233a002b03fa23345df374366d2ba8f08b2b63' }))));
     }
     static get is() { return "dso-toggletip"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1 +1 @@
-{"version":3,"file":"toggletip.js","sourceRoot":"","sources":["../../../../src/components/toggletip/toggletip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAQ7E,MAAM,OAAO,SAAS;;QAiCZ,UAAK,GAAG,GAAG,EAAE;YACnB,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;QAC3C,CAAC,CAAC;QAEM,SAAI,GAAG,GAAG,EAAE;YAClB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;YACnB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;YAC5D,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAChE,CAAC,CAAC;QAEM,UAAK,GAAG,GAAG,EAAE;YACnB,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACjE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;YAC/D,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACtB,CAAC,CAAC;QAEM,qBAAgB,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC/C,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAqB,CAAC,EAAE,CAAC;gBACrD,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,CAAC;QACH,CAAC,CAAC;QAEM,oBAAe,GAAG,CAAC,KAAoB,EAAE,EAAE;;YACjD,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;gBACtD,IAAI,CAAC,KAAK,EAAE,CAAC;gBACb,MAAA,IAAI,CAAC,UAAU,0CAAE,QAAQ,EAAE,CAAC;gBAC5B,KAAK,CAAC,cAAc,EAAE,CAAC;YACzB,CAAC;YAED,OAAO;QACT,CAAC,CAAC;sBA1DO,KAAK;qBAMN,aAAa;wBAMC,OAAO;;;;IAgD7B,MAAM;QACJ,OAAO,CACL;YACE,4FACmB,QAAQ,EACzB,OAAO,EAAE,IAAI,CAAC,KAAK,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,GAC7C;YACF,oEACE,SAAS,QACT,WAAW,QACX,EAAE,EAAC,QAAQ,EACX,QAAQ,EAAC,UAAU,EACnB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK;gBAEjB,8DAAQ,CACI,CACb,CACJ,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { h, Component, Fragment, Element, Prop, State } from \"@stencil/core\";\r\nimport { Placement } from \"@popperjs/core\";\r\n\r\n@Component({\r\n  tag: \"dso-toggletip\",\r\n  styleUrl: \"toggletip.scss\",\r\n  shadow: true,\r\n})\r\nexport class Toggletip {\r\n  @Element()\r\n  host!: HTMLDsoToggletipElement;\r\n\r\n  @State()\r\n  active = false;\r\n\r\n  /**\r\n   * Toggletip label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting\";\r\n\r\n  /**\r\n   * Toggletip position.\r\n   */\r\n  @Prop()\r\n  position: Placement = \"right\";\r\n\r\n  /**\r\n   * Set to true for small Toggletip.\r\n   */\r\n  @Prop()\r\n  small?: boolean;\r\n\r\n  /**\r\n   * Set to true for secondary Toggletip.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  private infoButton?: HTMLDsoInfoButtonElement;\r\n\r\n  private click = () => {\r\n    this.active ? this.close() : this.open();\r\n  };\r\n\r\n  private open = () => {\r\n    this.active = true;\r\n    this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n    this.host.addEventListener(\"focusout\", this.focusOutListener);\r\n  };\r\n\r\n  private close = () => {\r\n    this.host.removeEventListener(\"focusout\", this.focusOutListener);\r\n    this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n    this.active = false;\r\n  };\r\n\r\n  private focusOutListener = (event: FocusEvent) => {\r\n    if (!this.host.contains(event.relatedTarget as Node)) {\r\n      this.close();\r\n    }\r\n  };\r\n\r\n  private keyDownListener = (event: KeyboardEvent) => {\r\n    if (!event.defaultPrevented && event.key === \"Escape\") {\r\n      this.close();\r\n      this.infoButton?.setFocus();\r\n      event.preventDefault();\r\n    }\r\n\r\n    return;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <dso-info-button\r\n          aria-describedby=\"toggle\"\r\n          onClick={this.click}\r\n          label={this.label}\r\n          active={this.active}\r\n          secondary={this.secondary}\r\n          ref={(element) => (this.infoButton = element)}\r\n        />\r\n        <dso-tooltip\r\n          stateless\r\n          descriptive\r\n          id=\"toggle\"\r\n          strategy=\"absolute\"\r\n          active={this.active}\r\n          position={this.position}\r\n          small={this.small}\r\n        >\r\n          <slot />\r\n        </dso-tooltip>\r\n      </>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"toggletip.js","sourceRoot":"","sources":["../../../../src/components/toggletip/toggletip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAQ7E,MAAM,OAAO,SAAS;;QAiCZ,UAAK,GAAG,GAAG,EAAE;YACnB,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;gBAChB,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,CAAC;QACH,CAAC,CAAC;QAEM,SAAI,GAAG,GAAG,EAAE;YAClB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;YACnB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;YAC5D,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAChE,CAAC,CAAC;QAEM,UAAK,GAAG,GAAG,EAAE;YACnB,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACjE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;YAC/D,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACtB,CAAC,CAAC;QAEM,qBAAgB,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC/C,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAqB,CAAC,EAAE,CAAC;gBACrD,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,CAAC;QACH,CAAC,CAAC;QAEM,oBAAe,GAAG,CAAC,KAAoB,EAAE,EAAE;;YACjD,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;gBACtD,IAAI,CAAC,KAAK,EAAE,CAAC;gBACb,MAAA,IAAI,CAAC,UAAU,0CAAE,QAAQ,EAAE,CAAC;gBAC5B,KAAK,CAAC,cAAc,EAAE,CAAC;YACzB,CAAC;YAED,OAAO;QACT,CAAC,CAAC;sBA9DO,KAAK;qBAMN,aAAa;wBAMC,OAAO;;;;IAoD7B,MAAM;QACJ,OAAO,CACL;YACE,4FACmB,QAAQ,EACzB,OAAO,EAAE,IAAI,CAAC,KAAK,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,GAC7C;YACF,oEACE,SAAS,QACT,WAAW,QACX,EAAE,EAAC,QAAQ,EACX,QAAQ,EAAC,UAAU,EACnB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK;gBAEjB,8DAAQ,CACI,CACb,CACJ,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { h, Component, Fragment, Element, Prop, State } from \"@stencil/core\";\r\nimport { Placement } from \"@popperjs/core\";\r\n\r\n@Component({\r\n  tag: \"dso-toggletip\",\r\n  styleUrl: \"toggletip.scss\",\r\n  shadow: true,\r\n})\r\nexport class Toggletip {\r\n  @Element()\r\n  host!: HTMLDsoToggletipElement;\r\n\r\n  @State()\r\n  active = false;\r\n\r\n  /**\r\n   * Toggletip label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting\";\r\n\r\n  /**\r\n   * Toggletip position.\r\n   */\r\n  @Prop()\r\n  position: Placement = \"right\";\r\n\r\n  /**\r\n   * Set to true for small Toggletip.\r\n   */\r\n  @Prop()\r\n  small?: boolean;\r\n\r\n  /**\r\n   * Set to true for secondary Toggletip.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  private infoButton?: HTMLDsoInfoButtonElement;\r\n\r\n  private click = () => {\r\n    if (this.active) {\r\n      this.close();\r\n    } else {\r\n      this.open();\r\n    }\r\n  };\r\n\r\n  private open = () => {\r\n    this.active = true;\r\n    this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n    this.host.addEventListener(\"focusout\", this.focusOutListener);\r\n  };\r\n\r\n  private close = () => {\r\n    this.host.removeEventListener(\"focusout\", this.focusOutListener);\r\n    this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n    this.active = false;\r\n  };\r\n\r\n  private focusOutListener = (event: FocusEvent) => {\r\n    if (!this.host.contains(event.relatedTarget as Node)) {\r\n      this.close();\r\n    }\r\n  };\r\n\r\n  private keyDownListener = (event: KeyboardEvent) => {\r\n    if (!event.defaultPrevented && event.key === \"Escape\") {\r\n      this.close();\r\n      this.infoButton?.setFocus();\r\n      event.preventDefault();\r\n    }\r\n\r\n    return;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <dso-info-button\r\n          aria-describedby=\"toggle\"\r\n          onClick={this.click}\r\n          label={this.label}\r\n          active={this.active}\r\n          secondary={this.secondary}\r\n          ref={(element) => (this.infoButton = element)}\r\n        />\r\n        <dso-tooltip\r\n          stateless\r\n          descriptive\r\n          id=\"toggle\"\r\n          strategy=\"absolute\"\r\n          active={this.active}\r\n          position={this.position}\r\n          small={this.small}\r\n        >\r\n          <slot />\r\n        </dso-tooltip>\r\n      </>\r\n    );\r\n  }\r\n}\r\n"]}

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

@@ -168,7 +168,7 @@ export class Tooltip {
         }
     }
     render() {
-        return (h(Host, { key: 'cfad66ccb630fe271a2b2bd5485f158f7c509d90', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, h("div", { key: 'da25404fb6a06f3a4ceb841b3c51e221d9a6fb7b', class: clsx("tooltip", { in: this.active }) }, !this.noArrow && h("div", { key: '00ebab6f82ddfa1349a9df16bb7d36d37c87b942', "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { key: '2e69287dd8975def050c78d208fd823d42eaad0a', "aria-hidden": !this.descriptive || undefined, class: clsx("tooltip-inner", { "dso-small": this.small }) }, h("slot", { key: 'b59a912c960e685a005218d534affb1957f797c5' })))));
+        return (h(Host, { key: 'b8b24b9fcb5d6de63f40ac2c28aa3cae220935d1', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, h("div", { key: '837abccdba48399a6bda370059d7f59ecabf1d4d', class: clsx("tooltip", { in: this.active }) }, !this.noArrow && h("div", { key: '9c6c0250d521e51cfc635a82ddd57d49bb81dd53', "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { key: 'efd8935a506723d1a1b537896526249f7e89d559', "aria-hidden": !this.descriptive || undefined, class: clsx("tooltip-inner", { "dso-small": this.small }) }, h("slot", { key: '125db28c4ee8f322d6014013c001393267e52829' })))));
     }
     activatePopper() {
         var _a;

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

@@ -175,7 +175,7 @@ export class TreeView {
     }
     render() {
         var _a;
-        return (h("div", { key: 'fb5ce3d687bcd95be1603142bae51b6114db4810', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: '97b8778fd22d06e4db48976c320bd17b77d38455', 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: '2eff02be3c7fa1122bcceb02f49686fa313a03eb', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: 'bd81717040790bb9b97dfc7b06ae3eff1aa0e0f8', 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.js

@@ -154,7 +154,7 @@ export class ViewerGrid {
     }
     render() {
         const tabLabels = this.mode === "vdk" ? viewerGridVdkTabs : viewerGridVrkTabs;
-        return (h(Fragment, null, this.tabView && (h("nav", { key: '77ee5b5011e60a932e6d1c5c542081353ee8144b', class: "dso-navbar" }, h("ul", { key: '2c277a8eec7dc5df4645d17f7c3825e8c049df35', class: "dso-nav dso-nav-sub" }, tabLabels.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 === "main" || this.activeTab === "search"))) && (h(MainPanel, { key: '1f02ff7294d8fde5a89c722d9758ff4f140668fc', mode: this.mode, tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.mainPanelHidden, shrinkMain: this.emitShrinkMain, expandMain: this.emitExpandMain, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd })), h(Filterpanel, { key: 'e7a5491f71a60d2fc4c3474f8ca535452b50ce28', ref: (element) => (this.filterpanel = element), onApply: this.handleFilterpanelApply, onCancel: this.handleFilterpanelCancel }), (!this.tabView || (this.tabView && this.activeTab === "map")) && (h("div", { key: '770cdcfcdb2d29221d9a39ff439bb0ebf557cdb2', class: "map", ref: (element) => (this.mapElement = element) }, h("slot", { key: '0d95f2bfd756e5be66bbe22dcf659b65cac6fe09', name: "map" }))), ((!this.tabView && this.documentPanelOpen) || (this.tabView && this.activeTab === "document")) && (h(DocumentPanel, { key: '2960455c695f8bd13b5aaf38d473243d62bd7840', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), h(Overlay, { key: 'f38f2ba261f20bd679fd343641b92c5836d6f8d7', ref: (element) => (this.overlay = element), dsoCloseOverlay: (e) => this.dsoCloseOverlay.emit({ originalEvent: e }) })));
+        return (h(Fragment, null, this.tabView && (h("nav", { key: 'bcb65a8fa594201784f5fc536fa1dc51ae238a1f', class: "dso-navbar" }, h("ul", { key: 'e62921b7bf9f979d1bdac44bf3db0bd3c9d82f2b', class: "dso-nav dso-nav-sub" }, tabLabels.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 === "main" || this.activeTab === "search"))) && (h(MainPanel, { key: 'c2ba30c5affc612141c56c982f835cfb4fe039c3', mode: this.mode, tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.mainPanelHidden, shrinkMain: this.emitShrinkMain, expandMain: this.emitExpandMain, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd })), h(Filterpanel, { key: '3ad738a4713c918cba274d288ef11d729b2190b1', ref: (element) => (this.filterpanel = element), onApply: this.handleFilterpanelApply, onCancel: this.handleFilterpanelCancel }), (!this.tabView || (this.tabView && this.activeTab === "map")) && (h("div", { key: 'd9feb8fd090c4e097c9f388c628766c8a7a89386', class: "map", ref: (element) => (this.mapElement = element) }, h("slot", { key: 'df77620a663614e4417a022aa3ed5055583d6fc6', name: "map" }))), ((!this.tabView && this.documentPanelOpen) || (this.tabView && this.activeTab === "document")) && (h(DocumentPanel, { key: '9ae25c1ba5377b5c2fc098f482cca838d745f0c1', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), h(Overlay, { key: '8fb16e4308769043332bfd4d679950612a3d16bb', 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/components/alert.js

@@ -19,7 +19,7 @@ const Alert = /*@__PURE__*/ proxyCustomElement(class Alert extends HTMLElement {
         if (!status) {
             throw new Error(`Invalid status ${this.status}`);
         }
-        return (h("div", { key: 'cc815a0d71226a31d8777d7beef98641d5a0917d', class: clsx("alert", `alert-${this.status}`, { "dso-compact": this.compact }), role: this.roleAlert ? "alert" : undefined }, !this.compact && h("dso-icon", { key: 'bbf3ef40e0471b4dbf5539c06db8a671791167b1', icon: "status-" + this.status }), h("span", { key: '984e9f9bc25c68a13575fac2dc60966ab3bc0045', class: "sr-only" }, status, ":"), h("slot", { key: '70464b29837954e3fea18be9f6f8c2fc83bbd05b' })));
+        return (h("div", { key: '9e8d143425ebe44dec1c2eab77bb7b5714af707b', class: clsx("alert", `alert-${this.status}`, { "dso-compact": this.compact }), role: this.roleAlert ? "alert" : undefined }, !this.compact && h("dso-icon", { key: 'c7bf738af875c1601343084ea895e4ce17c29f53', icon: "status-" + this.status }), h("span", { key: '244a02419f54832ab7c735b8f011cc37ceb7bcba', class: "sr-only" }, status, ":"), h("slot", { key: '8c99a866fbba23398368da529567f8cf7c737e8a' })));
     }
     static get style() { return DsoAlertStyle0; }
 }, [1, "dso-alert", {

package/dist/{esm/dso-annotation-locatie.entry.js → components/annotation-locatie.js}

@@ -1,13 +1,20 @@
-import { r as registerInstance, c as createEvent, h, F as Fragment, a as getElement } from './index-c8e19f05.js';
-import { A as AnnotationBody } from './annotation-body-a8fadf3a.js';
-import { w as watcher, A as AnnotationSymbolSlot, a as AnnotationGewijzigdeLocatie } from './annotation-symbol-slot-28380b95.js';
+import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client';
+import { A as AnnotationBody } from './annotation-body.js';
+import { w as watcher, A as AnnotationSymbolSlot, a as AnnotationGewijzigdeLocatie } from './annotation-symbol-slot.js';
+import { d as defineCustomElement$5 } from './icon.js';
+import { d as defineCustomElement$4 } from './label.js';
+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}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}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:1.5em;background-position:bottom 0 right 0;background-image:url(\"./dso-icons.svg#img-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:url(\"./dso-icons.svg#img-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:1.5em;background-position:bottom 0 right 0;background-image:url(\"./dso-icons.svg#img-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:url(\"./dso-icons.svg#img-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:1.5em;background-position:bottom 0 left 0;background-image:url(\"./dso-icons.svg#img-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:url(\"./dso-icons.svg#img-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:1.5em;background-position:bottom 0 left 0;background-image:url(\"./dso-icons.svg#img-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:url(\"./dso-icons.svg#img-email-scampi\")}:host{display:block;padding:2px}:host([wijzigactie=voegtoe]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#e4f1d4;border-color:#e4f1d4;color:#191919;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25)}:host([wijzigactie=voegtoe]) a:is(.download,.download:hover,.download:focus-visible){background-image:url(\"./dso-icons.svg#img-download-zwart\")}:host([wijzigactie=voegtoe]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:url(\"./dso-icons.svg#img-external-link-zwart\")}:host([wijzigactie=voegtoe]) a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-call-zwart\")}:host([wijzigactie=voegtoe]) a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-email-zwart\")}:host([wijzigactie=verwijder]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#f5d8dc;border-color:#f5d8dc;color:#191919;text-decoration:line-through}:host([wijzigactie=verwijder]) a:is(.download,.download:hover,.download:focus-visible){background-image:url(\"./dso-icons.svg#img-download-zwart\")}:host([wijzigactie=verwijder]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:url(\"./dso-icons.svg#img-external-link-zwart\")}:host([wijzigactie=verwijder]) a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-call-zwart\")}:host([wijzigactie=verwijder]) a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-email-zwart\")}*,*::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}.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 DsoAnnotationLocatieStyle0 = annotationCss;
 
-const AnnotationLocatie = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
+const AnnotationLocatie = /*@__PURE__*/ proxyCustomElement(class AnnotationLocatie extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
         this.dsoActiveChange = createEvent(this, "dsoActiveChange", 7);
         this.watcher = watcher(this.host);
         this.wijzigactie = undefined;
@@ -23,12 +30,55 @@ const AnnotationLocatie = class {
     }
     render() {
         const hasSymbool = this.watcher.hasSymbool();
-        return (h(AnnotationBody, { key: '0190bf857c4bbbb4fba151b59701ddf9d6397f18', symbol: hasSymbool ? h(AnnotationSymbolSlot, null) : undefined, active: this.active, dsoActiveChange: this.dsoActiveChange, title: h(Fragment, null, h("span", { class: "content" }, h("dso-renvooi", { value: this.locatieNoemer })), this.gewijzigdeLocatie && h(AnnotationGewijzigdeLocatie, null)) }));
+        return (h(AnnotationBody, { key: '662684126533447bdee1394221937203261601be', symbol: hasSymbool ? h(AnnotationSymbolSlot, null) : undefined, active: this.active, dsoActiveChange: this.dsoActiveChange, title: h(Fragment, null, h("span", { class: "content" }, h("dso-renvooi", { value: this.locatieNoemer })), this.gewijzigdeLocatie && h(AnnotationGewijzigdeLocatie, null)) }));
     }
-    get host() { return getElement(this); }
-};
-AnnotationLocatie.style = DsoAnnotationLocatieStyle0;
+    get host() { return this; }
+    static get style() { return DsoAnnotationLocatieStyle0; }
+}, [1, "dso-annotation-locatie", {
+        "wijzigactie": [513],
+        "active": [516],
+        "gewijzigdeLocatie": [516, "gewijzigde-locatie"],
+        "locatieNoemer": [1, "locatie-noemer"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["dso-annotation-locatie", "dso-icon", "dso-label", "dso-renvooi", "dso-slide-toggle", "dso-tooltip"];
+    components.forEach(tagName => { switch (tagName) {
+        case "dso-annotation-locatie":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AnnotationLocatie);
+            }
+            break;
+        case "dso-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "dso-label":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "dso-renvooi":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "dso-slide-toggle":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "dso-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
 
-export { AnnotationLocatie as dso_annotation_locatie };
+export { AnnotationLocatie as A, defineCustomElement as d };
 
-//# sourceMappingURL=dso-annotation-locatie.entry.js.map
+//# sourceMappingURL=annotation-locatie.js.map

package/dist/{cjs/dso-annotation-locatie.cjs.entry.js.map → components/annotation-locatie.js.map}

@@ -1 +1 @@
-{"file":"dso-annotation-locatie.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,aAAa,GAAG,gpIAAgpI,CAAC;AACvqI,mCAAe,aAAa;;MCgBf,iBAAiB;;;;QAkCpB,YAAO,GAAGA,4BAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;;;;;;IAErC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;KACtB;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;KACxB;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,QACEC,QAACC,6BAAc,qDACb,MAAM,EAAE,UAAU,GAAGD,QAACE,yCAAoB,OAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACHF,8BACEA,kBAAM,KAAK,EAAC,SAAS,IACnBA,yBAAa,KAAK,EAAE,IAAI,CAAC,aAAa,GAAI,CACrC,EACN,IAAI,CAAC,iBAAiB,IAAIA,QAACG,gDAA2B,OAAG,CACzD,GAEL,EACF;KACH;;;;;;;","names":["watcher","h","AnnotationBody","AnnotationSymbolSlot","AnnotationGewijzigdeLocatie"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-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/anchor/anchor\";\r\n\r\n:host {\r\n  display: block;\r\n  padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n  @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n  flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n  font-weight: 500;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n  margin-block: 0;\r\n\r\n  .content:has(+ dso-label) {\r\n    margin-inline-end: units.$u1 * 0.5;\r\n  }\r\n}\r\n\r\n.annotation-data {\r\n  font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Prop, Event, h, EventEmitter, Fragment, Element } from \"@stencil/core\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\n\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\n\r\n/**\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-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,gpIAAgpI,CAAC;AACvqI,mCAAe,aAAa;;MCgBf,iBAAiB;;;;;;QAkCpB,YAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;;;;;;IAErC,iBAAiB;QACf,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;KACtB;IAED,oBAAoB;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;KACxB;IAED,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAE7C,QACE,EAAC,cAAc,qDACb,MAAM,EAAE,UAAU,GAAG,EAAC,oBAAoB,OAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACH,kBACE,YAAM,KAAK,EAAC,SAAS,IACnB,mBAAa,KAAK,EAAE,IAAI,CAAC,aAAa,GAAI,CACrC,EACN,IAAI,CAAC,iBAAiB,IAAI,EAAC,2BAA2B,OAAG,CACzD,GAEL,EACF;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"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/anchor/anchor\";\r\n\r\n:host {\r\n  display: block;\r\n  padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n  @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n  flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n  font-weight: 500;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n  margin-block: 0;\r\n\r\n  .content:has(+ dso-label) {\r\n    margin-inline-end: units.$u1 * 0.5;\r\n  }\r\n}\r\n\r\n.annotation-data {\r\n  font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Prop, Event, h, EventEmitter, Fragment, Element } from \"@stencil/core\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\n\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\n\r\n/**\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-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}

package/dist/components/attachments-counter.js

@@ -12,7 +12,7 @@ const AttachmentsCounter = /*@__PURE__*/ proxyCustomElement(class AttachmentsCou
         this.count = undefined;
     }
     render() {
-        return (h("span", { key: '02905e5d45afa01c0e427181af881ac17fa5e433', class: "dso-attachments" }, this.count, " ", h("span", { key: 'a6d8fc7f088f3d7b9512e27292d890cf5198ece6', class: "sr-only" }, "bijlage", this.count !== 1 ? "n" : ""), h("dso-icon", { key: 'bcf3895d516ec5ef28526d4da53c07f1f5bba66a', icon: "paperclip" })));
+        return (h("span", { key: 'cd8239d516bd4ea96cdb3d6273d092e1441aa5bb', class: "dso-attachments" }, this.count, " ", h("span", { key: 'b050b4ad32bbab6403b7cff89fe7f2f5c1aa5786', class: "sr-only" }, "bijlage", this.count !== 1 ? "n" : ""), h("dso-icon", { key: '2ad49e0eb4a1f41bee68b5348a25ab1a5fce7b0e', icon: "paperclip" })));
     }
     static get style() { return DsoAttachmentsCounterStyle0; }
 }, [1, "dso-attachments-counter", {

package/dist/components/badge.js

@@ -12,7 +12,7 @@ const Badge = /*@__PURE__*/ proxyCustomElement(class Badge extends HTMLElement {
         this.status = undefined;
     }
     render() {
-        return (h("span", { key: '86bf6774feeac5d0bb55a6bbf9657e573c71e448', class: clsx("dso-badge", { [`badge-${this.status}`]: this.status }) }, h("slot", { key: 'fd3ee9530520cd05144a6039c25567ecf890d270' })));
+        return (h("span", { key: 'bc09970a78c6dd95bb114d9fdb0a5b112ef4f64a', class: clsx("dso-badge", { [`badge-${this.status}`]: this.status }) }, h("slot", { key: 'ae55685d1706abc5a00556208a6f2173ea1c9fbc' })));
     }
     static get style() { return DsoBadgeStyle0; }
 }, [1, "dso-badge", {

package/dist/components/document-component.js

@@ -1,11 +1,11 @@
 import { h, proxyCustomElement, HTMLElement, createEvent, Host, Fragment } from '@stencil/core/internal/client';
 import { d as defineCustomElement$9 } from './alert.js';
-import { d as defineCustomElement$8 } from './annotation-button.js';
-import { d as defineCustomElement$7 } from './badge.js';
-import { d as defineCustomElement$6 } from './icon.js';
-import { d as defineCustomElement$5 } from './image-overlay.js';
-import { d as defineCustomElement$4 } from './label.js';
-import { d as defineCustomElement$3 } from './ozon-content.js';
+import { d as defineCustomElement$8 } from './badge.js';
+import { d as defineCustomElement$7 } from './icon.js';
+import { d as defineCustomElement$6 } from './image-overlay.js';
+import { d as defineCustomElement$5 } from './label.js';
+import { d as defineCustomElement$4 } from './ozon-content.js';
+import { d as defineCustomElement$3 } from './panel.js';
 import { d as defineCustomElement$2 } from './table.js';
 import { d as defineCustomElement$1 } from './tooltip.js';
 
@@ -115,7 +115,7 @@ const DocumentComponent = /*@__PURE__*/ proxyCustomElement(class DocumentCompone
             this.alternativeTitle ||
             this.bevatOntwerpInformatie ||
             this.annotated);
-        return (h(Host, { key: 'b58d5638cdc2baa27b29ab24b1d056c5b831edef', "not-collapsible": !collapsible }, showHeading && (h("div", { key: '4a03f1690f88b499e75f0aaa5e08e7e6b670bb04', class: "heading-container", part: "_heading-container" }, this.wijzigactie && h("span", { key: '42ad3650002d46638a15c86e2d73147db1f87329', class: "editaction-label" }, this.wijzigactieLabel, ":"), h("div", { key: '2c51b6455745fe9de599ac0981c995941cf82b7f', class: "heading" }, h(Heading, { key: '5c4dccc3126facc699918efec646b6830c520926', heading: this.heading, class: "heading-element", onClick: this.handleHeadingClick }, collapsible && (h("button", { key: '20137bc7f81bbbf106ca57ee18a195f187a404f1', type: "button", class: "toggle-button", "aria-describedby": "heading-title", "aria-expanded": this.open.toString() }, h("dso-icon", { key: '3fa4d8ea6284129167c6c8af758f8c4df814c4b4', icon: this.open ? "chevron-down" : "chevron-right" }), h("span", { key: '6b31c222a7b6ea0130b240f97db3a9a5e838ae9b', class: "sr-only" }, this.open ? "Invouwen" : "Uitvouwen"))), h("div", { key: 'c8b58b97973c9cfa4512e3f3ba8cffe3256631dc', id: "heading-title" }, this.notApplicable && h("span", { key: '1b7b144db61cb4de89ee6db908fb8c019fce35d1', class: "sr-only" }, "Niet van toepassing:"), this.label || this.nummer || this.opschrift ? (h(Fragment, null, this.label && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.label, onDsoAnchorClick: this.handleOzonContentAnchorClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "label"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "label" })), inline: true }))), this.nummer && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.nummer, onDsoAnchorClick: this.handleOzonContentAnchorClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "nummer"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "nummer" })), inline: true }))), this.opschrift && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.opschrift, onDsoAnchorClick: this.handleOzonContentAnchorClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "opschrift"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "opschrift" })), inline: true }))))) : (this.alternativeTitle), suffix && h("span", { key: '3145d4a9770106d5905c201843b761da01197704' }, " - [", suffix, "]"))), this.recursiveToggle !== undefined && this.open && (h("button", { key: '3da46a302becf7fc053a12ccf40f851da302ac35', type: "button", class: "recursive-toggle", title: this.recursiveToggle === true ? "Verberg alles" : "Toon alles", onClick: this.handleRecursiveToggleClick }, h("dso-icon", { key: '956fd191d436e9ca3db63cdd2a6758525ff53c40', icon: this.recursiveToggle === true ? "eye" : "eye-slash" }))), this.genesteOntwerpInformatie && !this.open && !this.bevatOntwerpInformatie && (h(Fragment, null, h("dso-badge", { key: 'ea3322cda942a520c762d9cf47b78ef2d0de93bc', status: "warning", "aria-describedby": "nested-draft-description" }, "!"), h("dso-tooltip", { key: '2b5a389fd8df54aebcffbe5d563804040bdf8303', id: "nested-draft-description" }, "Er is een ontwerp beschikbaar."))), (this.bevatOntwerpInformatie || this.annotated) && (h("div", { key: 'da9d4ab3c25909f5e520fba0d9cca12850cf2f11', class: "addons" }, this.bevatOntwerpInformatie && (h("dso-label", { key: '82463b4e03bf223d46724ee4a1b738c22069c1e3', status: "warning", compact: true }, "Ontwerp")), this.annotated && (h("dso-annotation-button", { key: '7d7dbb4b16e80e77665aa298e30a0f56c29905c1', identifier: "expandable", open: this.openAnnotation, onDsoClick: (e) => this.dsoAnnotationToggle.emit({ originalEvent: e }) }))))))), h("div", { key: '1c2b3eb723fd7a0f6a9d164b1f5a399d140ee734', class: "annotation-container", part: "_annotation-container" }, h("slot", { key: '5fa1feea2f662e9b5151373adbc500af9a9ea6c7', name: "annotation" })), this.open && (this.inhoud || this.gereserveerd || this.vervallen) && (h("div", { key: 'afa20ac5589ab1b7a00ede6289254da8c69c473a', class: "content", part: "_content" }, this.gereserveerd && (h("dso-alert", { key: '1d635014deadaae35ad913666091fccb4aef1f74', status: "info" }, "Dit onderdeel is gereserveerd voor toekomstige toevoeging.")), this.vervallen && h("dso-alert", { key: '8fbb2f351a6f224a43014585e3c4931483e5db17', status: "info" }, "Dit onderdeel is vervallen."), this.inhoud && (h("dso-ozon-content", { key: '5e02fe6a60b43b9c49d8f29e4cdd5a81a27120ee', content: this.inhoud, onDsoAnchorClick: this.handleOzonContentAnchorClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "inhoud"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "inhoud" })) })))), h("div", { key: '9dff5e697a06d8a03eaeb7abfdad6ea0c56d6932', class: "children-container", part: "_children-container" }, h("slot", { key: '6cd5072f0781c17b3376159b5358ffca2e153cbd' }))));
+        return (h(Host, { key: 'd9fbf327a2334fa789aca4e287edb2a72b7a143c', "not-collapsible": !collapsible }, showHeading && (h("div", { key: 'be06c84763a0ebeb4b737b35199143e3dfd2df69', class: "heading-container", part: "_heading-container" }, this.wijzigactie && h("span", { key: 'a49b41ed8dedf72c8e7c4d2ca6a7ad4b74896d2f', class: "editaction-label" }, this.wijzigactieLabel, ":"), h("div", { key: '6c527436ab28110f2a567f5324f645ccadd7b2af', class: "heading" }, h(Heading, { key: 'af14361336a0bec3938f6fdbef68486c0f665839', heading: this.heading, class: "heading-element", onClick: this.handleHeadingClick }, collapsible && (h("button", { key: 'ec14fa46b5523db43ecf2a0f5872f683b15c3044', type: "button", class: "toggle-button", "aria-describedby": "heading-title", "aria-expanded": this.open.toString() }, h("dso-icon", { key: '530c11c39efb69202d495013a16d08203dc2a47a', icon: this.open ? "chevron-down" : "chevron-right" }), h("span", { key: '526ab6032c2882649ff40b2a6a167b1bba5b0ce0', class: "sr-only" }, this.open ? "Invouwen" : "Uitvouwen"))), h("div", { key: '11d2b4d495a0fbdbf1aced54151382ac9e3aa72b', id: "heading-title" }, this.notApplicable && h("span", { key: '4e5cc5d128833bf15d58a2fb30072c586ff980c2', class: "sr-only" }, "Niet van toepassing:"), this.label || this.nummer || this.opschrift ? (h(Fragment, null, this.label && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.label, onDsoAnchorClick: this.handleOzonContentAnchorClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "label"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "label" })), inline: true }))), this.nummer && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.nummer, onDsoAnchorClick: this.handleOzonContentAnchorClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "nummer"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "nummer" })), inline: true }))), this.opschrift && (h(Fragment, null, " ", h("dso-ozon-content", { content: this.opschrift, onDsoAnchorClick: this.handleOzonContentAnchorClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "opschrift"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "opschrift" })), inline: true }))))) : (this.alternativeTitle), suffix && h("span", { key: 'e8849ad89494fbeb22dab9f94d7bb20ae8c620ab' }, " - [", suffix, "]"))), this.recursiveToggle !== undefined && this.open && (h("button", { key: 'a607765c7d38fd1f797aad54ddbb42ef0b67721a', type: "button", class: "recursive-toggle", title: this.recursiveToggle === true ? "Verberg alles" : "Toon alles", onClick: this.handleRecursiveToggleClick }, h("dso-icon", { key: 'c28e4caab77b5f6732dfd6cb0c9188655ff13545', icon: this.recursiveToggle === true ? "eye" : "eye-slash" }))), this.genesteOntwerpInformatie && !this.open && !this.bevatOntwerpInformatie && (h(Fragment, null, h("dso-badge", { key: 'c1ecb135adb76ebe9632326a33e0dfd236f78694', status: "warning", "aria-describedby": "nested-draft-description" }, "!"), h("dso-tooltip", { key: 'd054622128abb03799737d27efb3158eb9fbfbbe', id: "nested-draft-description" }, "Er is een ontwerp beschikbaar."))), (this.bevatOntwerpInformatie || this.annotated) && (h("div", { key: '4e861bf2b1e823cabb145dc2e2fd3d58278028c1', class: "addons" }, this.bevatOntwerpInformatie && (h("dso-label", { key: '27fb8767f9fbe08b6b06b6651db4250e30c6979f', status: "warning", compact: true }, "Ontwerp")), this.annotated && (h("button", { key: '32cabfce40e57be32a8e20fb252e15b08dbf1b69', type: "button", class: "dso-tertiary", "aria-controls": this.openAnnotation ? "annotations" : undefined, "aria-expanded": this.openAnnotation.toString(), onClick: (e) => this.dsoAnnotationToggle.emit({ originalEvent: e }) }, h("dso-icon", { key: '4352ff84f9a43767dc1bb87b668f06719bffebc8', icon: "label" }), h("span", { key: '4ec23888f3ed5586d47bd4f08c098c2c1a8db8c5', class: "sr-only" }, "Toelichting bekijken")))))))), h("div", { key: '486702c5974c32bcea89085de489aaeac40e6682', class: "annotation-container", part: "_annotation-container" }, this.openAnnotation && (h("dso-panel", { key: 'deab6e1cd15335e369d152d0ee79880bcac0f4e2', id: "annotations", onDsoCloseClick: (e) => this.dsoAnnotationToggle.emit({ originalEvent: e }) }, h("h2", { key: '5716abe7b4ca874aedd6cb17be11e14ece1dd572', slot: "heading" }, "Annotaties"), h("slot", { key: 'd8ca5b22b97500165ebf244944b707b968a4a8d5', name: "annotations" })))), this.open && (this.inhoud || this.gereserveerd || this.vervallen) && (h("div", { key: 'f8ad55a8c5ff0748b6756276ff36ad04774bfda1', class: "content", part: "_content" }, this.gereserveerd && (h("dso-alert", { key: 'dc235123841f087ffc693146fc922c069f7f4930', status: "info" }, "Dit onderdeel is gereserveerd voor toekomstige toevoeging.")), this.vervallen && h("dso-alert", { key: 'b497c9ddbe9ad2578ec8286297da451b226f6c03', status: "info" }, "Dit onderdeel is vervallen."), this.inhoud && (h("dso-ozon-content", { key: '8e0ba5e935c90119737f42f40387d87c7c457c65', content: this.inhoud, onDsoAnchorClick: this.handleOzonContentAnchorClick, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, "inhoud"); }), onDsoOzonContentMarkItemHighlight: (e) => this.dsoMarkItemHighlight.emit(Object.assign(Object.assign({}, e.detail), { source: "inhoud" })) })))), h("div", { key: 'fc37c9ad088d59a7b92343bafb1cc6ee6b1c1cf6', class: "children-container", part: "_children-container" }, h("slot", { key: '4e00ee07d33eb7d6524c3f766df28dbfdb198915' }))));
     }
     static get style() { return DsoDocumentComponentStyle0; }
 }, [1, "dso-document-component", {
@@ -143,7 +143,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["dso-document-component", "dso-alert", "dso-annotation-button", "dso-badge", "dso-icon", "dso-image-overlay", "dso-label", "dso-ozon-content", "dso-table", "dso-tooltip"];
+    const components = ["dso-document-component", "dso-alert", "dso-badge", "dso-icon", "dso-image-overlay", "dso-label", "dso-ozon-content", "dso-panel", "dso-table", "dso-tooltip"];
     components.forEach(tagName => { switch (tagName) {
         case "dso-document-component":
             if (!customElements.get(tagName)) {
@@ -155,32 +155,32 @@ function defineCustomElement() {
                 defineCustomElement$9();
             }
             break;
-        case "dso-annotation-button":
+        case "dso-badge":
             if (!customElements.get(tagName)) {
                 defineCustomElement$8();
             }
             break;
-        case "dso-badge":
+        case "dso-icon":
             if (!customElements.get(tagName)) {
                 defineCustomElement$7();
             }
             break;
-        case "dso-icon":
+        case "dso-image-overlay":
             if (!customElements.get(tagName)) {
                 defineCustomElement$6();
             }
             break;
-        case "dso-image-overlay":
+        case "dso-label":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }
             break;
-        case "dso-label":
+        case "dso-ozon-content":
             if (!customElements.get(tagName)) {
                 defineCustomElement$4();
             }
             break;
-        case "dso-ozon-content":
+        case "dso-panel":
             if (!customElements.get(tagName)) {
                 defineCustomElement$3();
             }