@dso-toolkit/core 62.18.0 → 62.19.0

package/dist/components/dsot-document-component-demo.js

@@ -1633,277 +1633,278 @@ function random(lower, upper, floating) {
 var lodash_random = random;
 
 const documentComponentDemoCss = ".sc-dsot-document-component-demo-h{display:block;margin:0 8px;border-left:1px dashed transparent;border-right:1px dashed transparent}[show-canvas].sc-dsot-document-component-demo-h{border-left:1px dashed pink;border-right:1px dashed pink}";
+const DsotDocumentComponentDemoStyle0 = documentComponentDemoCss;
 
 const DocumentComponentDemo = /*@__PURE__*/ proxyCustomElement(class DocumentComponentDemo extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.dsotOzonContentAnchorClick = createEvent(this, "dsotOzonContentAnchorClick", 7);
-    this.handleRecursiveToggle = (documentComponent, detail) => {
-      const embeddedDocuments = this.getEmbeddedDocumentComponents(documentComponent);
-      if (!embeddedDocuments) {
-        return;
-      }
-      for (const d of embeddedDocuments.documentComponents) {
-        this.handleOpenToggle(d, detail.next);
-      }
-    };
-    this.DocumentComponent = ({ path }) => {
-      const documentComponent = path.at(-1);
-      if (!documentComponent) {
-        return h(Fragment, null);
-      }
-      const { DocumentComponent } = this;
-      const embeddedDocuments = this.getEmbeddedDocumentComponents(documentComponent);
-      return (h("dso-document-component", { annotated: documentComponent.volgordeNummer % 4 === 2, bevatOntwerpInformatie: !!documentComponent.bevatOntwerpInformatie, filtered: this.isOpen(documentComponent)
-          ? this.isFiltered(documentComponent)
-          : this.hasFilteredChildren(documentComponent), genesteOntwerpInformatie: this.hasNestedDraft(documentComponent), gereserveerd: documentComponent.gereserveerd, heading: "h2", inhoud: documentComponent.inhoud, label: documentComponent.labelXml, openAnnotation: this.isOpenedAnnotation(documentComponent), notApplicable: this.isNotApplicable(documentComponent) || path.some((p) => this.isNotApplicable(p)), nummer: documentComponent.nummerXml, onDsoAnnotationToggle: () => this.handleAnnotationToggle(documentComponent), onDsoOpenToggle: () => this.handleOpenToggle(documentComponent), onDsoOzonContentAnchorClick: (e) => this.handleOzonContentAnchorClick(e), open: this.isOpen(documentComponent), opschrift: documentComponent.opschrift, type: documentComponent.type, vervallen: documentComponent.vervallen, wijzigactie: documentComponent.wijzigactie, recursiveToggle: this.recursiveToggleState(documentComponent), onDsoRecursiveToggle: (e) => this.handleRecursiveToggle(documentComponent, e.detail) }, this.isOpenedAnnotation(documentComponent) && (h("dso-annotation-output", { slot: "annotation", open: true, identifier: "test", onDsoClose: () => this.handleAnnotationToggle(documentComponent) }, h("span", { slot: "title" }, "Annotaties"), h("dso-slide-toggle", { checked: this.isCheckedSlideToggle(documentComponent), onDsoActiveChange: () => this.handleSelectableChange(documentComponent) }, "Delfzijl"))), this.showContent(documentComponent) && (embeddedDocuments === null || embeddedDocuments === void 0 ? void 0 : embeddedDocuments.documentComponents.length) && (h("ul", null, embeddedDocuments.documentComponents.map((d) => (h("li", { key: d.documentTechnischId }, h(DocumentComponent, { path: [...path, d] }))))))));
-    };
-    this.MenuButton = ({ documentComponent }) => {
-      const { labelXml, nummerXml, type } = documentComponent;
-      return (h("button", { type: "button", onClick: () => (this.document = documentComponent) }, !labelXml && !nummerXml ? (h("span", null, h("i", null, type))) : (h(Fragment, null, labelXml && (h(Fragment, null, h("dso-ozon-content", { content: labelXml, inline: true }))), nummerXml && (h(Fragment, null, " ", h("dso-ozon-content", { content: nummerXml, inline: true })))))));
-    };
-    this.showCanvas = false;
-    this.jsonFile = undefined;
-    this.openDefault = false;
-    this.response = undefined;
-    this.document = undefined;
-    this.openOrClosed = [];
-    this.openedAnnotation = [];
-    this.filtered = [];
-    this.notApplicable = [];
-    this.activeAnnotationSelectables = [];
-  }
-  async jsonFileWatcher() {
-    this.openOrClosed = [];
-    await this.loadData();
-  }
-  async openDefaultWatcher() {
-    this.openOrClosed = [];
-    await this.loadData();
-  }
-  async componentDidLoad() {
-    await this.loadData();
-  }
-  getEmbeddedDocumentComponents(documentEmbedded) {
-    var _a, _b;
-    if ((_a = documentEmbedded === null || documentEmbedded === void 0 ? void 0 : documentEmbedded._embedded) === null || _a === void 0 ? void 0 : _a.ontwerpTekststructuurDocumentComponenten) {
-      return {
-        documentComponents: documentEmbedded._embedded.ontwerpTekststructuurDocumentComponenten,
-        ontwerp: true,
-      };
+    constructor() {
+        super();
+        this.__registerHost();
+        this.dsotOzonContentAnchorClick = createEvent(this, "dsotOzonContentAnchorClick", 7);
+        this.handleRecursiveToggle = (documentComponent, detail) => {
+            const embeddedDocuments = this.getEmbeddedDocumentComponents(documentComponent);
+            if (!embeddedDocuments) {
+                return;
+            }
+            for (const d of embeddedDocuments.documentComponents) {
+                this.handleOpenToggle(d, detail.next);
+            }
+        };
+        this.DocumentComponent = ({ path }) => {
+            const documentComponent = path.at(-1);
+            if (!documentComponent) {
+                return h(Fragment, null);
+            }
+            const { DocumentComponent } = this;
+            const embeddedDocuments = this.getEmbeddedDocumentComponents(documentComponent);
+            return (h("dso-document-component", { annotated: documentComponent.volgordeNummer % 4 === 2, bevatOntwerpInformatie: !!documentComponent.bevatOntwerpInformatie, filtered: this.isOpen(documentComponent)
+                    ? this.isFiltered(documentComponent)
+                    : this.hasFilteredChildren(documentComponent), genesteOntwerpInformatie: this.hasNestedDraft(documentComponent), gereserveerd: documentComponent.gereserveerd, heading: "h2", inhoud: documentComponent.inhoud, label: documentComponent.labelXml, openAnnotation: this.isOpenedAnnotation(documentComponent), notApplicable: this.isNotApplicable(documentComponent) || path.some((p) => this.isNotApplicable(p)), nummer: documentComponent.nummerXml, onDsoAnnotationToggle: () => this.handleAnnotationToggle(documentComponent), onDsoOpenToggle: () => this.handleOpenToggle(documentComponent), onDsoOzonContentAnchorClick: (e) => this.handleOzonContentAnchorClick(e), open: this.isOpen(documentComponent), opschrift: documentComponent.opschrift, type: documentComponent.type, vervallen: documentComponent.vervallen, wijzigactie: documentComponent.wijzigactie, recursiveToggle: this.recursiveToggleState(documentComponent), onDsoRecursiveToggle: (e) => this.handleRecursiveToggle(documentComponent, e.detail) }, this.isOpenedAnnotation(documentComponent) && (h("dso-annotation-output", { slot: "annotation", open: true, identifier: "test", onDsoClose: () => this.handleAnnotationToggle(documentComponent) }, h("span", { slot: "title" }, "Annotaties"), h("dso-slide-toggle", { checked: this.isCheckedSlideToggle(documentComponent), onDsoActiveChange: () => this.handleSelectableChange(documentComponent) }, "Delfzijl"))), this.showContent(documentComponent) && (embeddedDocuments === null || embeddedDocuments === void 0 ? void 0 : embeddedDocuments.documentComponents.length) && (h("ul", { class: "dso-document-component-list" }, embeddedDocuments.documentComponents.map((d) => (h("li", { key: d.documentTechnischId }, h(DocumentComponent, { path: [...path, d] }))))))));
+        };
+        this.MenuButton = ({ documentComponent }) => {
+            const { labelXml, nummerXml, type } = documentComponent;
+            return (h("button", { type: "button", onClick: () => (this.document = documentComponent) }, !labelXml && !nummerXml ? (h("span", null, h("i", null, type))) : (h(Fragment, null, labelXml && (h(Fragment, null, h("dso-ozon-content", { content: labelXml, inline: true }))), nummerXml && (h(Fragment, null, " ", h("dso-ozon-content", { content: nummerXml, inline: true })))))));
+        };
+        this.showCanvas = false;
+        this.jsonFile = undefined;
+        this.openDefault = false;
+        this.response = undefined;
+        this.document = undefined;
+        this.openOrClosed = [];
+        this.openedAnnotation = [];
+        this.filtered = [];
+        this.notApplicable = [];
+        this.activeAnnotationSelectables = [];
     }
-    if ((_b = documentEmbedded === null || documentEmbedded === void 0 ? void 0 : documentEmbedded._embedded) === null || _b === void 0 ? void 0 : _b.tekststructuurDocumentComponenten) {
-      return {
-        documentComponents: documentEmbedded._embedded.tekststructuurDocumentComponenten,
-        ontwerp: false,
-      };
+    async jsonFileWatcher() {
+        this.openOrClosed = [];
+        await this.loadData();
     }
-    return undefined;
-  }
-  concatEmbeddedDocumentComponents(documentComponent) {
-    var _a, _b;
-    const embeddedDocuments = [...((_b = (_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.documentComponents) !== null && _b !== void 0 ? _b : [])];
-    for (const d of embeddedDocuments) {
-      embeddedDocuments.push(...this.concatEmbeddedDocumentComponents(d));
+    async openDefaultWatcher() {
+        this.openOrClosed = [];
+        await this.loadData();
     }
-    return embeddedDocuments;
-  }
-  selectRandomDocumentComponents(documentComponent, exclude = []) {
-    const documentComponents = this.concatEmbeddedDocumentComponents(documentComponent).filter((d) => !exclude.includes(d));
-    const size = lodash_random(0, Math.floor(documentComponents.length / 10));
-    return lodash_samplesize(documentComponents, size);
-  }
-  async loadData() {
-    var _a, _b;
-    if (!this.jsonFile) {
-      this.response = undefined;
-      this.document = undefined;
-      return;
+    async componentDidLoad() {
+        await this.loadData();
     }
-    this.response = await fetch(this.jsonFile).then((r) => r.json());
-    this.document = (_a = this.getEmbeddedDocumentComponents(this.response)) === null || _a === void 0 ? void 0 : _a.documentComponents[0];
-    if (((_b = this.document) === null || _b === void 0 ? void 0 : _b.type) === "LICHAAM") {
-      this.notApplicable = this.selectRandomDocumentComponents(this.document);
-      this.filtered = this.selectRandomDocumentComponents(this.document, this.notApplicable);
+    getEmbeddedDocumentComponents(documentEmbedded) {
+        var _a, _b;
+        if ((_a = documentEmbedded === null || documentEmbedded === void 0 ? void 0 : documentEmbedded._embedded) === null || _a === void 0 ? void 0 : _a.ontwerpTekststructuurDocumentComponenten) {
+            return {
+                documentComponents: documentEmbedded._embedded.ontwerpTekststructuurDocumentComponenten,
+                ontwerp: true,
+            };
+        }
+        if ((_b = documentEmbedded === null || documentEmbedded === void 0 ? void 0 : documentEmbedded._embedded) === null || _b === void 0 ? void 0 : _b.tekststructuurDocumentComponenten) {
+            return {
+                documentComponents: documentEmbedded._embedded.tekststructuurDocumentComponenten,
+                ontwerp: false,
+            };
+        }
+        return undefined;
     }
-    else {
-      this.notApplicable = [];
-      this.filtered = [];
+    concatEmbeddedDocumentComponents(documentComponent) {
+        var _a, _b;
+        const embeddedDocuments = [...((_b = (_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.documentComponents) !== null && _b !== void 0 ? _b : [])];
+        for (const d of embeddedDocuments) {
+            embeddedDocuments.push(...this.concatEmbeddedDocumentComponents(d));
+        }
+        return embeddedDocuments;
     }
-  }
-  handleOpenToggle(documentComponent, force) {
-    const isOpenOrClosed = typeof force === "boolean" ? force : this.openOrClosed.includes(documentComponent);
-    if (isOpenOrClosed && this.openOrClosed.includes(documentComponent)) {
-      this.openOrClosed = this.openOrClosed.filter((d) => d !== documentComponent);
+    selectRandomDocumentComponents(documentComponent, exclude = []) {
+        const documentComponents = this.concatEmbeddedDocumentComponents(documentComponent).filter((d) => !exclude.includes(d));
+        const size = lodash_random(0, Math.floor(documentComponents.length / 10));
+        return lodash_samplesize(documentComponents, size);
     }
-    else if (!isOpenOrClosed && !this.openOrClosed.includes(documentComponent)) {
-      this.openOrClosed = [...this.openOrClosed, documentComponent];
+    async loadData() {
+        var _a, _b;
+        if (!this.jsonFile) {
+            this.response = undefined;
+            this.document = undefined;
+            return;
+        }
+        this.response = await fetch(this.jsonFile).then((r) => r.json());
+        this.document = (_a = this.getEmbeddedDocumentComponents(this.response)) === null || _a === void 0 ? void 0 : _a.documentComponents[0];
+        if (((_b = this.document) === null || _b === void 0 ? void 0 : _b.type) === "LICHAAM") {
+            this.notApplicable = this.selectRandomDocumentComponents(this.document);
+            this.filtered = this.selectRandomDocumentComponents(this.document, this.notApplicable);
+        }
+        else {
+            this.notApplicable = [];
+            this.filtered = [];
+        }
     }
-  }
-  handleAnnotationToggle(documentComponent) {
-    this.openedAnnotation = this.isOpenedAnnotation(documentComponent)
-      ? this.openedAnnotation.filter((d) => d !== documentComponent)
-      : [...this.openedAnnotation, documentComponent];
-    if (!this.isOpen(documentComponent)) {
-      this.openOrClosed = [...this.openOrClosed, documentComponent];
+    handleOpenToggle(documentComponent, force) {
+        const isOpenOrClosed = typeof force === "boolean" ? force : this.openOrClosed.includes(documentComponent);
+        if (isOpenOrClosed && this.openOrClosed.includes(documentComponent)) {
+            this.openOrClosed = this.openOrClosed.filter((d) => d !== documentComponent);
+        }
+        else if (!isOpenOrClosed && !this.openOrClosed.includes(documentComponent)) {
+            this.openOrClosed = [...this.openOrClosed, documentComponent];
+        }
     }
-  }
-  handleSelectableChange(documentComponent) {
-    this.activeAnnotationSelectables = this.isCheckedSlideToggle(documentComponent)
-      ? this.activeAnnotationSelectables.filter((d) => d !== documentComponent)
-      : [...this.activeAnnotationSelectables, documentComponent];
-  }
-  handleOzonContentAnchorClick(e) {
-    this.dsotOzonContentAnchorClick.emit(e.detail);
-  }
-  isCheckedSlideToggle(documentComponent) {
-    return this.activeAnnotationSelectables.includes(documentComponent);
-  }
-  hasFilteredChildren(documentComponent) {
-    var _a, _b;
-    return (this.filtered.includes(documentComponent) ||
-      ((_b = (_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.documentComponents.some((d) => this.hasFilteredChildren(d))) !== null && _b !== void 0 ? _b : false));
-  }
-  isOpen(documentComponent) {
-    return documentComponent.type === "LID" || this.openDefault
-      ? !this.openOrClosed.includes(documentComponent)
-      : this.openOrClosed.includes(documentComponent);
-  }
-  isOpenedAnnotation(documentComponent) {
-    return this.openedAnnotation.includes(documentComponent);
-  }
-  isFiltered(documentComponent) {
-    return this.filtered.includes(documentComponent);
-  }
-  isNotApplicable(documentComponent) {
-    return this.notApplicable.includes(documentComponent);
-  }
-  hasNestedDraft(documentComponent) {
-    var _a, _b;
-    return ((_b = (_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.documentComponents.some((d) => !!d.bevatOntwerpInformatie || this.hasNestedDraft(d))) !== null && _b !== void 0 ? _b : false);
-  }
-  showContent(documentComponent) {
-    var _a;
-    return (this.isOpen(documentComponent) &&
-      !!(((_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.documentComponents.length) || documentComponent.inhoud));
-  }
-  recursiveToggleState(documentComponent) {
-    const embeddedDocuments = this.getEmbeddedDocumentComponents(documentComponent);
-    if (!embeddedDocuments ||
-      embeddedDocuments.documentComponents.length <= 1 ||
-      !embeddedDocuments.documentComponents.some((d) => d.type === "ARTIKEL")) {
-      return undefined;
+    handleAnnotationToggle(documentComponent) {
+        this.openedAnnotation = this.isOpenedAnnotation(documentComponent)
+            ? this.openedAnnotation.filter((d) => d !== documentComponent)
+            : [...this.openedAnnotation, documentComponent];
+        if (!this.isOpen(documentComponent)) {
+            this.openOrClosed = [...this.openOrClosed, documentComponent];
+        }
     }
-    return embeddedDocuments.documentComponents.every((d) => this.isOpen(d));
-  }
-  render() {
-    var _a, _b;
-    const { DocumentComponent, MenuButton } = this;
-    return (h("dso-responsive-element", { class: "dso-document-components" }, h("div", { class: "dso-navbar" }, h("ul", { class: "dso-nav dso-nav-sub" }, (_b = (_a = this.getEmbeddedDocumentComponents(this.response)) === null || _a === void 0 ? void 0 : _a.documentComponents) === null || _b === void 0 ? void 0 : _b.map((d) => (h("li", { class: this.document === d ? "dso-active" : undefined }, h(MenuButton, { documentComponent: d })))))), this.document && h(DocumentComponent, { path: [this.document] })));
-  }
-  static get watchers() { return {
-    "jsonFile": ["jsonFileWatcher"],
-    "openDefault": ["openDefaultWatcher"]
-  }; }
-  static get style() { return documentComponentDemoCss; }
+    handleSelectableChange(documentComponent) {
+        this.activeAnnotationSelectables = this.isCheckedSlideToggle(documentComponent)
+            ? this.activeAnnotationSelectables.filter((d) => d !== documentComponent)
+            : [...this.activeAnnotationSelectables, documentComponent];
+    }
+    handleOzonContentAnchorClick(e) {
+        this.dsotOzonContentAnchorClick.emit(e.detail);
+    }
+    isCheckedSlideToggle(documentComponent) {
+        return this.activeAnnotationSelectables.includes(documentComponent);
+    }
+    hasFilteredChildren(documentComponent) {
+        var _a, _b;
+        return (this.filtered.includes(documentComponent) ||
+            ((_b = (_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.documentComponents.some((d) => this.hasFilteredChildren(d))) !== null && _b !== void 0 ? _b : false));
+    }
+    isOpen(documentComponent) {
+        return documentComponent.type === "LID" || this.openDefault
+            ? !this.openOrClosed.includes(documentComponent)
+            : this.openOrClosed.includes(documentComponent);
+    }
+    isOpenedAnnotation(documentComponent) {
+        return this.openedAnnotation.includes(documentComponent);
+    }
+    isFiltered(documentComponent) {
+        return this.filtered.includes(documentComponent);
+    }
+    isNotApplicable(documentComponent) {
+        return this.notApplicable.includes(documentComponent);
+    }
+    hasNestedDraft(documentComponent) {
+        var _a, _b;
+        return ((_b = (_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.documentComponents.some((d) => !!d.bevatOntwerpInformatie || this.hasNestedDraft(d))) !== null && _b !== void 0 ? _b : false);
+    }
+    showContent(documentComponent) {
+        var _a;
+        return (this.isOpen(documentComponent) &&
+            !!(((_a = this.getEmbeddedDocumentComponents(documentComponent)) === null || _a === void 0 ? void 0 : _a.documentComponents.length) || documentComponent.inhoud));
+    }
+    recursiveToggleState(documentComponent) {
+        const embeddedDocuments = this.getEmbeddedDocumentComponents(documentComponent);
+        if (!embeddedDocuments ||
+            embeddedDocuments.documentComponents.length <= 1 ||
+            !embeddedDocuments.documentComponents.some((d) => d.type === "ARTIKEL")) {
+            return undefined;
+        }
+        return embeddedDocuments.documentComponents.every((d) => this.isOpen(d));
+    }
+    render() {
+        var _a, _b;
+        const { DocumentComponent, MenuButton } = this;
+        return (h("dso-responsive-element", { key: '5864432bae2c7c4f3dec69eacb51a88f8b7b32a6', class: "dso-document-components" }, h("div", { key: 'b09ea19e283694c265bd22eb4646eec2847cde57', class: "dso-navbar" }, h("ul", { key: '3e50a6475e4447191c0ffabcd54759607e84148d', class: "dso-nav dso-nav-sub" }, (_b = (_a = this.getEmbeddedDocumentComponents(this.response)) === null || _a === void 0 ? void 0 : _a.documentComponents) === null || _b === void 0 ? void 0 : _b.map((d) => (h("li", { class: this.document === d ? "dso-active" : undefined }, h(MenuButton, { documentComponent: d })))))), this.document && h(DocumentComponent, { path: [this.document] })));
+    }
+    static get watchers() { return {
+        "jsonFile": ["jsonFileWatcher"],
+        "openDefault": ["openDefaultWatcher"]
+    }; }
+    static get style() { return DsotDocumentComponentDemoStyle0; }
 }, [2, "dsot-document-component-demo", {
-    "showCanvas": [516, "show-canvas"],
-    "jsonFile": [1, "json-file"],
-    "openDefault": [4, "open-default"],
-    "response": [32],
-    "document": [32],
-    "openOrClosed": [32],
-    "openedAnnotation": [32],
-    "filtered": [32],
-    "notApplicable": [32],
-    "activeAnnotationSelectables": [32]
-  }, undefined, {
-    "jsonFile": ["jsonFileWatcher"],
-    "openDefault": ["openDefaultWatcher"]
-  }]);
+        "showCanvas": [516, "show-canvas"],
+        "jsonFile": [1, "json-file"],
+        "openDefault": [4, "open-default"],
+        "response": [32],
+        "document": [32],
+        "openOrClosed": [32],
+        "openedAnnotation": [32],
+        "filtered": [32],
+        "notApplicable": [32],
+        "activeAnnotationSelectables": [32]
+    }, undefined, {
+        "jsonFile": ["jsonFileWatcher"],
+        "openDefault": ["openDefaultWatcher"]
+    }]);
 function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["dsot-document-component-demo", "dso-alert", "dso-annotation-button", "dso-annotation-output", "dso-badge", "dso-document-component", "dso-expandable", "dso-icon", "dso-image-overlay", "dso-label", "dso-ozon-content", "dso-responsive-element", "dso-slide-toggle", "dso-table", "dso-tooltip"];
-  components.forEach(tagName => { switch (tagName) {
-    case "dsot-document-component-demo":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DocumentComponentDemo);
-      }
-      break;
-    case "dso-alert":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$f();
-      }
-      break;
-    case "dso-annotation-button":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$e();
-      }
-      break;
-    case "dso-annotation-output":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$d();
-      }
-      break;
-    case "dso-badge":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$c();
-      }
-      break;
-    case "dso-document-component":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$b();
-      }
-      break;
-    case "dso-expandable":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$a();
-      }
-      break;
-    case "dso-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$9();
-      }
-      break;
-    case "dso-image-overlay":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$8();
-      }
-      break;
-    case "dso-label":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$7();
-      }
-      break;
-    case "dso-ozon-content":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$6();
-      }
-      break;
-    case "dso-responsive-element":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$5();
-      }
-      break;
-    case "dso-slide-toggle":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$4();
-      }
-      break;
-    case "dso-table":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "dso-tooltip":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["dsot-document-component-demo", "dso-alert", "dso-annotation-button", "dso-annotation-output", "dso-badge", "dso-document-component", "dso-expandable", "dso-icon", "dso-image-overlay", "dso-label", "dso-ozon-content", "dso-responsive-element", "dso-slide-toggle", "dso-table", "dso-tooltip"];
+    components.forEach(tagName => { switch (tagName) {
+        case "dsot-document-component-demo":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, DocumentComponentDemo);
+            }
+            break;
+        case "dso-alert":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$f();
+            }
+            break;
+        case "dso-annotation-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$e();
+            }
+            break;
+        case "dso-annotation-output":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$d();
+            }
+            break;
+        case "dso-badge":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$c();
+            }
+            break;
+        case "dso-document-component":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$b();
+            }
+            break;
+        case "dso-expandable":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$a();
+            }
+            break;
+        case "dso-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "dso-image-overlay":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "dso-label":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "dso-ozon-content":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "dso-responsive-element":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "dso-slide-toggle":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "dso-table":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "dso-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
 }
 
 const DsotDocumentComponentDemo = DocumentComponentDemo;