xv-webcomponents 0.1.39 → 0.1.41

package/dist/collection/components/xv-file-uploader/xv-file-uploader.js

@@ -0,0 +1,448 @@
+import { h, Host, Fragment } from "@stencil/core";
+import { SIZE_VAR } from "../../types/enum";
+import { XvFileUploaderVariants } from "./_vars";
+export class XvFileUploader {
+    constructor() {
+        this.variant = XvFileUploaderVariants.BUTTON;
+        this.size = SIZE_VAR.MD;
+        this.accept = [];
+        this.maxFileSizeMB = 5;
+        this.maxFiles = 20;
+        this.multiple = true;
+        this.files = [];
+        this.loadingStates = [];
+        this.errors = [];
+        this.dragActive = false;
+        this.errorMessages = [];
+        this.onFileSelect = (event) => {
+            const input = event.target;
+            const selectedFiles = Array.from(input.files || []);
+            this.handleFiles(selectedFiles);
+        };
+        this.onDrop = (event) => {
+            var _a;
+            event.preventDefault();
+            this.dragActive = false;
+            const droppedFiles = Array.from(((_a = event.dataTransfer) === null || _a === void 0 ? void 0 : _a.files) || []);
+            this.handleFiles(droppedFiles);
+        };
+        this.handleFiles = (files) => {
+            this.files = this.validation(this.multiple ? [...this.files, ...files] : files);
+            this.filesChange.emit(this.files);
+        };
+        this.onDragOver = (event) => {
+            event.preventDefault();
+            this.dragActive = true;
+        };
+        this.onDragLeave = () => {
+            this.dragActive = false;
+        };
+    }
+    validation(files) {
+        var _a;
+        const maxSize = this.maxFileSizeMB * 1024 * 1024;
+        const seenFileNames = new Set();
+        const errorMessages = [];
+        const uniqueFiles = [];
+        for (const file of files) {
+            let error = null;
+            if (!seenFileNames.has(file.name)) {
+                seenFileNames.add(file.name);
+                uniqueFiles.push(file);
+            }
+            const extension = (_a = file.name.split('.').pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase();
+            const isAccepted = this.accept.length === 0 ||
+                this.accept.some(type => {
+                    const normalized = type.toLowerCase().replace(/^\./, '');
+                    return normalized === extension;
+                });
+            if (!isAccepted) {
+                error = 'Unsupported file type.';
+            }
+            else if (file.size > maxSize) {
+                error = `File ${file.name} is too large.`;
+            }
+            errorMessages.push(error);
+        }
+        this.error = uniqueFiles.length > this.maxFiles
+            ? `Only ${this.maxFiles} file(s) allowed.`
+            : null;
+        this.errorMessages = errorMessages;
+        return uniqueFiles;
+    }
+    removeFile(index) {
+        this.files = this.validation([...this.files.slice(0, index), ...this.files.slice(index + 1)]);
+        this.filesChange.emit(this.files);
+        if (this.fileInput) {
+            this.fileInput.value = '';
+        }
+    }
+    render() {
+        var _a;
+        return (h(Host, { key: '92aef18b84c7ff27bffa4e08f277037b8c980269', class: { 'upload-wrapper': true, [`uploader-${this.size}`]: true, disabled: !!this.disabled } }, this.label && h("label", { key: 'a1249cbce402d895e28417f0ea3b7be0432939a5', class: "label" }, this.label), this.description && h("p", { key: '5c3000bcdeea9a0952f67e6f09b38f476eb5380d', class: "description" }, this.description), this.variant === 'button' ? (h("button", { disabled: this.disabled, class: "upload-btn", onClick: () => this.fileInput.click() }, this.addText || 'Dateien auswählen')) : (h("div", { class: { 'drop-zone': true, active: this.dragActive }, onDrop: this.onDrop, onDragOver: this.onDragOver, onDragLeave: this.onDragLeave, onClick: () => this.fileInput.click() }, this.addText || 'Dateien hierher ziehen oder darauf klicken, um eine Datei auszuwählen.', ((_a = this.accept) === null || _a === void 0 ? void 0 : _a.length) > 0 && h("span", null, " (", this.accept.join(', '), ")"))), h("input", { key: '0b0d4765dacd6dd3d0a9afb5b761976018728502', ref: el => (this.fileInput = el), type: "file", hidden: true, onChange: this.onFileSelect, multiple: this.multiple, accept: this.accept.map(type => `.${type}`).join(',') }), h("ul", { key: 'f6f1a14ab1d2a705018ffed46ff6b3439bcedd1b', class: "file-list" }, this.files.map((file, index) => {
+            var _a, _b;
+            return (h("li", { class: { file: true, withError: !!(((_a = this.errors) === null || _a === void 0 ? void 0 : _a[index]) || ((_b = this.errorMessages) === null || _b === void 0 ? void 0 : _b[index])) } }, h("div", { class: "file_container" }, h("span", { class: "file_container_name" }, file.name), this._renderLoaderState(index)), this._renderError(index)));
+        })), this.error && (h("div", { key: 'aa38b9ddbcebdd48c166dcc1a007549b6665b718', class: "error-container" }, h("p", { key: 'a421c517fe2681b089ac13d88a4bca1c6edde44c', class: "error-container_primary" }, this.error)))));
+    }
+    _renderLoaderState(index) {
+        var _a, _b, _c;
+        const state = ((_a = this.loadingStates) === null || _a === void 0 ? void 0 : _a[index]) || null;
+        const errorIcon = ((_b = this.errors) === null || _b === void 0 ? void 0 : _b[index]) || ((_c = this.errorMessages) === null || _c === void 0 ? void 0 : _c[index]) ? (h("svg", { class: "file_container_errorIcon", width: "16", height: "16", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" }, h("path", { fill: "currentColor", d: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24l0 112c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-112c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z" }))) : null;
+        switch (state) {
+            case 'loading':
+                return (h(Fragment, null, errorIcon, h("xv-loader-v2", { size: SIZE_VAR.XS })));
+            case 'success':
+                return (h(Fragment, null, errorIcon, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 18 16", fill: "none" }, h("path", { d: "M9 16C6.125 16 3.5 14.5 2.0625 12C0.625 9.53125 0.625 6.5 2.0625 4C3.5 1.53125 6.125 0 9 0C11.8438 0 14.4688 1.53125 15.9062 4C17.3438 6.5 17.3438 9.53125 15.9062 12C14.4688 14.5 11.8438 16 9 16ZM12.5312 6.53125H12.5C12.8125 6.25 12.8125 5.78125 12.5 5.46875C12.2188 5.1875 11.75 5.1875 11.4688 5.46875L8 8.96875L6.53125 7.5C6.21875 7.1875 5.75 7.1875 5.46875 7.5C5.15625 7.78125 5.15625 8.25 5.46875 8.53125L7.46875 10.5312C7.75 10.8438 8.21875 10.8438 8.53125 10.5312L12.5312 6.53125Z", fill: "#97BF0D" }))));
+            case 'uploaded':
+            default:
+                return (h(Fragment, null, errorIcon, h("xv-button-v2", { variant: "ghost", size: SIZE_VAR.XS, onClick: () => this.removeFile(index) }, h("span", { slot: "icon-left" }, "\u00D7"))));
+        }
+    }
+    _renderError(index) {
+        var _a, _b;
+        const error = ((_a = this.errors) === null || _a === void 0 ? void 0 : _a[index]) || ((_b = this.errorMessages) === null || _b === void 0 ? void 0 : _b[index]);
+        if (!error)
+            return;
+        if (typeof error === 'object') {
+            return (h("div", { class: "error-container" }, h("p", { class: "error-container_primary" }, error.primary), h("p", { class: "error-container_secondary" }, error.secondary)));
+        }
+        if (typeof error === 'string') {
+            return (h("div", { class: "error-container" }, h("p", { class: "error-container_primary" }, error)));
+        }
+        return null;
+    }
+    static get is() { return "xv-file-uploader"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["xv-file-uploader.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["xv-file-uploader.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "label": {
+                "type": "string",
+                "attribute": "label",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "description": {
+                "type": "string",
+                "attribute": "description",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "addText": {
+                "type": "string",
+                "attribute": "add-text",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "variant": {
+                "type": "string",
+                "attribute": "variant",
+                "mutable": false,
+                "complexType": {
+                    "original": "XvFileUploaderVariants",
+                    "resolved": "XvFileUploaderVariants.BUTTON | XvFileUploaderVariants.DRAG_DROP",
+                    "references": {
+                        "XvFileUploaderVariants": {
+                            "location": "import",
+                            "path": "./_vars",
+                            "id": "src/components/xv-file-uploader/_vars.ts::XvFileUploaderVariants"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "XvFileUploaderVariants.BUTTON"
+            },
+            "size": {
+                "type": "string",
+                "attribute": "size",
+                "mutable": false,
+                "complexType": {
+                    "original": "SIZE_VAR",
+                    "resolved": "SIZE_VAR.LG | SIZE_VAR.MD | SIZE_VAR.SM | SIZE_VAR.XL | SIZE_VAR.XS",
+                    "references": {
+                        "SIZE_VAR": {
+                            "location": "import",
+                            "path": "../../types/enum",
+                            "id": "src/types/enum.ts::SIZE_VAR"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "SIZE_VAR.MD"
+            },
+            "accept": {
+                "type": "unknown",
+                "attribute": "accept",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "maxFileSizeMB": {
+                "type": "number",
+                "attribute": "max-file-size-mb",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "5"
+            },
+            "maxFiles": {
+                "type": "number",
+                "attribute": "max-files",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "20"
+            },
+            "multiple": {
+                "type": "boolean",
+                "attribute": "multiple",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "disabled": {
+                "type": "boolean",
+                "attribute": "disabled",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true
+            },
+            "files": {
+                "type": "unknown",
+                "attribute": "files",
+                "mutable": true,
+                "complexType": {
+                    "original": "File[]",
+                    "resolved": "File[]",
+                    "references": {
+                        "File": {
+                            "location": "global",
+                            "id": "global::File"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "loadingStates": {
+                "type": "unknown",
+                "attribute": "loading-states",
+                "mutable": true,
+                "complexType": {
+                    "original": "('loading' | 'success' | 'uploaded')[]",
+                    "resolved": "(\"loading\" | \"success\" | \"uploaded\")[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "error": {
+                "type": "string",
+                "attribute": "error",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true
+            },
+            "errors": {
+                "type": "unknown",
+                "attribute": "errors",
+                "mutable": true,
+                "complexType": {
+                    "original": "string[] | { primary: string; secondary: string; }[]",
+                    "resolved": "string[] | { primary: string; secondary: string; }[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "dragActive": {},
+            "errorMessages": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "filesChange",
+                "name": "filesChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "File[]",
+                    "resolved": "File[]",
+                    "references": {
+                        "File": {
+                            "location": "global",
+                            "id": "global::File"
+                        }
+                    }
+                }
+            }];
+    }
+}
+//# sourceMappingURL=xv-file-uploader.js.map

package/dist/collection/components/xv-file-uploader/xv-file-uploader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xv-file-uploader.js","sourceRoot":"","sources":["../../../src/components/xv-file-uploader/xv-file-uploader.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, EventEmitter, Event, h, Host, Prop, State, Fragment } from '@stencil/core';\nimport { SIZE_VAR } from '../../types/enum';\nimport { XvFileUploaderVariants } from './_vars';\n\n@Component({\n  tag: 'xv-file-uploader',\n  styleUrl: 'xv-file-uploader.scss',\n  shadow: true,\n})\nexport class XvFileUploader {\n  @Prop() label?: string;\n  @Prop() description?: string;\n  @Prop({ attribute: 'add-text' }) addText?: string;\n  @Prop() variant: XvFileUploaderVariants = XvFileUploaderVariants.BUTTON;\n  @Prop() size: SIZE_VAR = SIZE_VAR.MD;\n  @Prop() accept: string[] = [];\n  @Prop({ attribute: 'max-file-size-mb' }) maxFileSizeMB: number = 5;\n  @Prop({ attribute: 'max-files' }) maxFiles: number = 20;\n  @Prop() multiple: boolean = true;\n  @Prop({ reflect: true }) disabled?: boolean;\n  @Prop({ reflect: true, mutable: true }) files: File[] = [];\n  @Prop({ reflect: true, mutable: true, attribute: 'loading-states' }) loadingStates: ('loading' | 'success' | 'uploaded')[] = [];\n  @Prop({ reflect: true, mutable: true }) error?: string;\n  @Prop({ reflect: true, mutable: true }) errors: string[] | { primary: string; secondary: string; }[] = [];\n\n  @State() dragActive = false;\n  @State() errorMessages: string[] = [];\n\n  @Event() filesChange: EventEmitter<File[]>;\n\n  private fileInput: HTMLInputElement;\n\n  private onFileSelect = (event: Event) => {\n    const input = event.target as HTMLInputElement;\n    const selectedFiles = Array.from(input.files || []);\n    this.handleFiles(selectedFiles);\n  };\n\n  private onDrop = (event: DragEvent) => {\n    event.preventDefault();\n    this.dragActive = false;\n    const droppedFiles = Array.from(event.dataTransfer?.files || []);\n    this.handleFiles(droppedFiles);\n  };\n\n  private handleFiles = (files: File[]) => {\n    this.files = this.validation(this.multiple ? [...this.files, ...files] : files);\n    this.filesChange.emit(this.files);\n  };\n\n  private validation(files: File[]): File[] {\n    const maxSize = this.maxFileSizeMB * 1024 * 1024;\n    const seenFileNames = new Set<string>();\n    const errorMessages: (string | null)[] = [];\n    const uniqueFiles: File[] = [];\n\n    for (const file of files) {\n      let error: string | undefined = null;\n\n      if (!seenFileNames.has(file.name)) {\n        seenFileNames.add(file.name);\n        uniqueFiles.push(file);\n      }\n\n      const extension = file.name.split('.').pop()?.toLowerCase();\n      const isAccepted =\n        this.accept.length === 0 ||\n        this.accept.some(type => {\n          const normalized = type.toLowerCase().replace(/^\\./, '');\n          return normalized === extension;\n        });\n\n      if (!isAccepted) {\n        error = 'Unsupported file type.';\n      } else if (file.size > maxSize) {\n        error = `File ${file.name} is too large.`;\n      }\n\n      errorMessages.push(error);\n    }\n\n    this.error = uniqueFiles.length > this.maxFiles\n      ? `Only ${this.maxFiles} file(s) allowed.`\n      : null;\n\n    this.errorMessages = errorMessages;\n\n    return uniqueFiles;\n  }\n\n  private removeFile(index: number) {\n    this.files = this.validation([...this.files.slice(0, index), ...this.files.slice(index + 1)]);\n    this.filesChange.emit(this.files);\n    if (this.fileInput) {\n      this.fileInput.value = '';\n    }\n  }\n\n  private onDragOver = (event: DragEvent) => {\n    event.preventDefault();\n    this.dragActive = true;\n  };\n\n  private onDragLeave = () => {\n    this.dragActive = false;\n  };\n\n  render() {\n    return (\n      <Host class={{ 'upload-wrapper': true, [`uploader-${this.size}`]: true, disabled: !!this.disabled }}>\n        {this.label && <label class=\"label\">{this.label}</label>}\n        {this.description && <p class=\"description\">{this.description}</p>}\n        {this.variant === 'button' ? (\n          <button disabled={this.disabled} class=\"upload-btn\" onClick={() => this.fileInput.click()}>\n            {this.addText || 'Dateien auswählen'}\n          </button>\n        ) : (\n          <div\n            class={{ 'drop-zone': true, active: this.dragActive }}\n            onDrop={this.onDrop}\n            onDragOver={this.onDragOver}\n            onDragLeave={this.onDragLeave}\n            onClick={() => this.fileInput.click()}\n          >\n            {this.addText || 'Dateien hierher ziehen oder darauf klicken, um eine Datei auszuwählen.'}\n            {this.accept?.length > 0 && <span> ({this.accept.join(', ')})</span>}\n          </div>\n        )}\n\n        <input\n          ref={el => (this.fileInput = el)}\n          type=\"file\"\n          hidden\n          onChange={this.onFileSelect}\n          multiple={this.multiple}\n          accept={this.accept.map(type => `.${type}`).join(',')}\n        />\n\n        <ul class=\"file-list\">\n          {this.files.map((file, index) => (\n            <li class={{ file: true, withError: !!(this.errors?.[index] || this.errorMessages?.[index]) }}>\n              <div class=\"file_container\">\n                <span class=\"file_container_name\">{file.name}</span>\n                {this._renderLoaderState(index)}\n              </div>\n              {this._renderError(index)}\n            </li>\n          ))}\n        </ul>\n        {this.error && (\n          <div class=\"error-container\">\n            <p class=\"error-container_primary\">{this.error}</p>\n          </div>\n        )}\n      </Host>\n    );\n  }\n\n  private _renderLoaderState(index: number) {\n    const state = this.loadingStates?.[index] || null;\n\n    const errorIcon = this.errors?.[index] || this.errorMessages?.[index] ? (\n      <svg class=\"file_container_errorIcon\" width=\"16\" height=\"16\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n        <path fill=\"currentColor\"\n              d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24l0 112c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-112c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z\" />\n      </svg>\n    ) : null;\n\n    switch (state) {\n      case 'loading':\n        return (\n          <Fragment>\n            {errorIcon}\n            <xv-loader-v2 size={SIZE_VAR.XS} />\n          </Fragment>\n        );\n      case 'success':\n        return (\n          <Fragment>\n            {errorIcon}\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 18 16\" fill=\"none\">\n              <path\n                d=\"M9 16C6.125 16 3.5 14.5 2.0625 12C0.625 9.53125 0.625 6.5 2.0625 4C3.5 1.53125 6.125 0 9 0C11.8438 0 14.4688 1.53125 15.9062 4C17.3438 6.5 17.3438 9.53125 15.9062 12C14.4688 14.5 11.8438 16 9 16ZM12.5312 6.53125H12.5C12.8125 6.25 12.8125 5.78125 12.5 5.46875C12.2188 5.1875 11.75 5.1875 11.4688 5.46875L8 8.96875L6.53125 7.5C6.21875 7.1875 5.75 7.1875 5.46875 7.5C5.15625 7.78125 5.15625 8.25 5.46875 8.53125L7.46875 10.5312C7.75 10.8438 8.21875 10.8438 8.53125 10.5312L12.5312 6.53125Z\"\n                fill=\"#97BF0D\" />\n            </svg>\n          </Fragment>\n        );\n      case 'uploaded':\n      default:\n        return (\n          <Fragment>\n            {errorIcon}\n            <xv-button-v2 variant=\"ghost\" size={SIZE_VAR.XS} onClick={() => this.removeFile(index)}>\n              <span slot=\"icon-left\">×</span>\n            </xv-button-v2>\n          </Fragment>\n        );\n    }\n  }\n\n  private _renderError(index: number) {\n    const error = this.errors?.[index] || this.errorMessages?.[index];\n\n    if (!error) return;\n\n    if (typeof error === 'object') {\n      return (\n        <div class=\"error-container\">\n          <p class=\"error-container_primary\">{error.primary}</p>\n          <p class=\"error-container_secondary\">{error.secondary}</p>\n        </div>\n      );\n    }\n\n    if (typeof error === 'string') {\n      return (\n        <div class=\"error-container\">\n          <p class=\"error-container_primary\">{error}</p>\n        </div>\n      );\n    }\n\n    return null;\n  }\n}\n"]}

package/dist/collection/components/xv-footer/xv-footer.js

@@ -14,7 +14,7 @@ export class Xvfooter {
         }
     }
     render() {
-        return (h("footer", { key: '0db6bc4ceab1da36181d8a106677ee2b4c871a5d' }, h("div", { key: '4ed868bc230e7dd45ebca9255827c1cfeb40e1f7', innerHTML: this.htmlContent })));
+        return (h("footer", { key: '25f7acefd3d83e3f85547e0c3165eba04cae14bc' }, h("div", { key: 'df924fadef964c0736fc9d88de8e27f034e0da16', innerHTML: this.htmlContent })));
     }
     static get is() { return "xv-footer"; }
     static get originalStyleUrls() {

package/dist/collection/components/xv-header/xv-header.js

@@ -30,7 +30,7 @@ export class XvHeader {
         }
     }
     render() {
-        return (h("div", { key: '092ff32dfdc3a8abd588b4614cffadaf18ef73eb', id: "nav-container", class: "xv-header" }, h("nav", { key: 'c4981592dc5d6760999a4680cbdeeed4917bc86d', class: "navbar navbar-default navbar-fixed-top backend-force-relative" }, h("div", { key: '63618147868e56c9ab0939468cddd0dc0808e242', class: "container" }, h("div", { key: '48621f92892e24388ee689f03a841feb68867cde', class: "row" }, h("div", { key: '05da27c68a7db429f80034e9d629aa3bd606d46e', class: "col-sm-3 col-xs-3 col-xxs-4 no-padding-right" }, h("div", { key: '1935f522fff8182eaaed782d9539e1f44e508229', class: "navbar-header" }, h("button", { key: 'f414e8f67289291087927ee5085f1420954ca576', class: "btn btn-default navbar-toggle pull-left navbar-btn", "data-toggle": "collapse", "data-target": "#main-menu" }, h("i", { key: 'cc9f95cb5ab19d72a529eda9075e9d365bd46f0b', class: "fa fa-bars fa-lg", "aria-hidden": "true" })), h("div", { key: 'a2a33abd90814d8625e329b87281bcad03c39bc3', class: "visible-xs-inline" }, h("a", { key: '2e39e2221e8258bfc4f44d6b6925b8d48586264c', href: "https://www.crossvertise.com/", class: "navbar-brand" }, h("img", { key: '226c442a5ff9f8b97188494ba19f4f0cbca48259', src: "https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo-small.svg", alt: "Crossvertise" }))), h("div", { key: '9004b25c4ce743423c3e906067620b75366ab72a', class: "hidden-xs" }, h("a", { key: 'ed1bddedf5cbfda77426059c937ec2a91e9e2ec9', href: "https://www.crossvertise.com/", class: "navbar-brand" }, h("img", { key: '77c9654a8f63113d22acdf9053ed82b37c68d05b', loading: "lazy", src: "https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo.svg", alt: "Crossvertise" }))))), h("div", { key: '3999ab34c55b0efc2239c8f6d1282d9c949980fb', class: "col-sm-9 col-xs-9 col-xxs-8 no-padding-left" }, h("ul", { key: '434ca6ae49f9dfc28f3f8ffce7b9191326ff4919', class: "nav nav-pills nav-meta pull-right" }, h("li", { key: 'e8ac4591296bfcc5c0c7e5f1a6487518402512b4' }, h("a", { key: '9856991d8faae8ead5cec36f4df6df447f98e1d9', class: "btn btn-link navbar-btn hidden-xs", href: "#" }, h("i", { key: 'a49f4de9297931b7f374d3fc19992b5654e7a9d0', class: "fa fa-user" }), h("i", { key: '58f91f80fcc882ab3273f838773b551a0701d21e', class: "fa fa-exchange-alt" }))), h("li", { key: 'a3bca2f78dd035dfbda754998f0bc907f114d08b' }, h("a", { key: 'f47d0d34a272956b5d1945519f78a9b6d53f27c8', class: "btn btn-link navbar-btn hidden-xs", href: "#" }, "Kontakt"), h("a", { key: '99a70355c8818a67c66d75515ae5b3dd2b87ee48', href: "https://www.crossvertise.com/contact", class: "btn btn-link navbar-btn hidden-xs", style: { display: 'none' } }, "Kontakt"), h("a", { key: '1c82c6dc86ca379098d552ed3c10bf23b51ec7e9', class: "btn btn-default btn-link navbar-btn visible-xs hidden-xxs", href: "#" }, h("i", { key: 'ba7fb605ff015986524d5b38e8916e7c8846ea46', class: "fa fa-phone" }))), h("li", { key: '207d1e2d39abe0ecfc57b1e4e3b080a1e259d88e', class: "dropdown", id: "my-xv-menu" }, h("a", { key: 'a97520d3e14bbd7a9e4d65856b752410f84514e6', href: "#", class: "dropdown-toggle btn btn-default navbar-btn btn-link", "data-toggle": "dropdown" }, h("i", { key: '07ed030e3a41d20f3d719d164595a3aec9e700ed', class: "fa fa-user fa-lg text-success", "aria-hidden": "true" }), "\u00A0", h("span", { key: 'b0f1ef955d12ddace3b277af8e735b1ca79bebf5', class: "hidden-xs" }, "Mein Bereich"), h("span", { key: 'f6df26451c6a379b8afbaf58dfeb1fbacabfac43', class: "caret" })), h("ul", { key: 'e696efc4e956d57d62c1bd681572a49cd4d6d783', class: "dropdown-menu-left dropdown-menu navbar-myxv" }, h("li", { key: '45dc4ddcb0b72d85e937476f5b99c20b142ed1c1' }, h("a", { key: 'cd46060a5b67074979cf2b03ded35cca959c4338', href: "#" }, h("i", { key: '967e059a1db803ba7394b2142ebf8220081dac3f', class: "fa fa-tachometer-alt fa-fw" }), "\u00A0Cockpitfunktionen\u00A0", h("i", { key: '83ab26e47b8f837bcfea1a4986384c07747f39c7', class: "fa fa-caret-down" }))), h("li", { key: '2be9da522fbe82772a448fd257ac9fd62614ab5b' }, h("a", { key: 'a45b735877d449df5147c9a21e1964dd352ea052', href: "#" }, h("i", { key: '4b7ffab0fde8dc7fea76264e1103538d72a22b93', class: "fa fa-cubes" }), "\u00A0Entit\u00E4ten\u00A0", h("i", { key: '06420beb12c2704067273fa011d95148c612604b', class: "fa fa-caret-down" }))), h("li", { key: '26c7b8be4bace85b9eda242f5927ddb9b4c7f3b7', role: "separator", class: "divider" }), h("li", { key: '4f31616186edfbbdad11246fed6779c84d9ae2e0' }, h("a", { key: '16edf08f7ba8acde9c94212573be770c76b1eed3', href: "#" }, h("i", { key: 'b2044b2cf5063653498883073a3ad5efde2db954', class: "fa fa-user" }), "\u00A0Mein Crossvertise\u00A0", h("span", { key: 'cee6cef1f81beeaa5d28463d56155d05cc7b5f87', class: "badge" }, "0"), h("i", { key: '5e578d9000ffb98011d0062cdf83043bc4b5169c', class: "fa fa-caret-down" }))), h("li", { key: 'f418159e0c6a8806635501c2d7baad966c851e6d' }, h("a", { key: 'cee19cd5bcbaf74b0c80a2223502dcd8bc5371a1', href: "https://www.crossvertise.com/de-de/mycrossvertise/account/logoff?returnUrl=https%3A%2F%2Fwww.crossvertise.com" }, h("i", { key: 'd00b0b21de34744023a54c7cf7e6a574f34821b1', class: "fa fa-sign-out-alt fa-fw", "aria-hidden": "true" }), "\u00A0Logout")))), h("li", { key: '333cc819625326849f52013181128039c31826cc', class: "visible-sm-block visible-xs-block hidden-xxs" }, h("a", { key: '0591a5a4a2f4e1ca5c5fd6d49552dbdc339d0abf', class: "btn btn-default navbar-btn btn-link", "data-toggle": "collapse", "data-target": "#search-collapse" }, h("i", { key: '5be0f7d16d126ce5231f715d72a433c88849473f', class: "fa fa-search", "aria-hidden": "true" }))), h("li", { key: 'd1116671d564f5ac49ab15699eb0fa8ffaadbe8d', class: "hidden-xs hidden-sm" }, h("a", { key: '2004ef3c2c263310eb9d48349656001008b9e87a', role: "button", onClick: this.openLoginModal, class: "btn btn-default navbar-btn btn-link" }, h("i", { key: 'faa40979c470610be84536c2de5ea9965e185c67', class: "fa fa-user fa-lg", "aria-hidden": "true" }), h("span", { key: 'de763e7c4931dfd2277c463f6a138e0ff832b6be' }, "Login"))), h("xv-login-modal", { key: '4c12a1af61cc8434d6c481a718c20b343db301bb', visible: this.showLoginModal, onClose: this.closeLoginModal }), h("li", { key: 'd65bbbe4ac0457f621e824bb6bd5447546bb5819', class: "hidden-xs" }, h("a", { key: '340e9428ddc74d380981f9c90056cb7cdac7c982', class: "btn btn-default navbar-btn btn-link", href: "https://market.crossvertise.com/de-de/mycrossvertise/account/register" }, h("span", { key: '8aafb94c374e0969fa96b7ea8cb22785369560f9' }, "Registrieren"))), h("li", { key: '0ed4c4aca90415ca106adf379d923909e82d49a2', class: "navbar-divider hidden-xs" }), h("li", { key: '852292a5ea933dd3e4bf9b34e6e3f853ca723eb6' }, h("a", { key: 'cf11c35ae760ef3909953289640ff955acd409aa', class: "btn btn-success navbar-btn", href: "https://market.crossvertise.com/de-de/mycrossvertise/shoppingcart/activecart" }, h("span", { key: '531ef0b6c4134b7b15bbbd2e6c148f7be9c4edf4', class: "xv-font-icon-warenkorb fa-lg fa-fw", "aria-hidden": "true" }), h("span", { key: 'b686810eae7cbb0c7c1ea9ee997ab31c68c678d1', class: "hidden-xs hidden-sm" }, "\u00A0Warenkorb\u00A0"), h("span", { key: '325c83891e42b1c62ba46c53d1c49aa7c7fb9552', class: "badge badge-success" }, "0"))))))), h("div", { key: '0acef5ade9aefc444c5a3c6da2e10e95bf3080b9', class: "collapse hidden-md hidden-lg", id: "search-collapse" }, h("div", { key: '4ab01a657a0f6ea3b685b727fe0c3702f7273b1a', class: "container" }, h("form", { key: '946e797352ab2673b234d8c5e9c238882b9efc4c', action: "https://market.crossvertise.com/de-de/media/search", class: "navbar-form", method: "get", role: "search" }, h("div", { key: '3920252d9e5855f014748d672fdc5b9080182b72', class: "input-group" }, h("input", { key: '96f8aa465ebbeb7fc1e7e718f475618b94a60753', class: "form-control", name: "Q", placeholder: "Suche", type: "text", autocomplete: "off" }), h("span", { key: '8aae5ca4431896964ef5019f7403f8bdbab313e5', class: "input-group-btn force-full-width" }, h("button", { key: '5b572fa6663314c19bb2fc7952be2845d7fbbb2a', class: "btn btn-default search-addon", type: "submit" }, h("i", { key: '4a6727d827692c657761c5d00b53dacc4308ee00', class: "fa fa-search", "aria-hidden": "true" })))))))), h("div", { key: '6201355010079566c7e3c20fb4ef1f1f77bd5a45', innerHTML: this.htmlContent })));
+        return (h("div", { key: 'f1fa7a66f5646c91c3bec60242259aa47b9916db', id: "nav-container", class: "xv-header" }, h("nav", { key: '93c1d68ba793edb98ff140ab2cb3be7a3a14b4aa', class: "navbar navbar-default navbar-fixed-top backend-force-relative" }, h("div", { key: 'b031c74cb7fa6803bc5d18c3dbff11adb4b51ef6', class: "container" }, h("div", { key: 'ab24ec15ae5109b66b93ac2c66cc85a0c5bc997d', class: "row" }, h("div", { key: '40e7c0208009bdb2011e4ec38a31dda850622dd3', class: "col-sm-3 col-xs-3 col-xxs-4 no-padding-right" }, h("div", { key: '3e73dead56efa1c7c0a2f8feff92321306a40755', class: "navbar-header" }, h("button", { key: 'edbd2b2b4270f600043ba51284ea871131e0f2d9', class: "btn btn-default navbar-toggle pull-left navbar-btn", "data-toggle": "collapse", "data-target": "#main-menu" }, h("i", { key: '2fb6c9fbc127eac495fff5c0f93d250c980b58b1', class: "fa fa-bars fa-lg", "aria-hidden": "true" })), h("div", { key: 'adfe681e34aa6c609557641e9af0df662e78ffd3', class: "visible-xs-inline" }, h("a", { key: '932c99d3e3ddba203ea97fd576fe9152d9f72a16', href: "https://www.crossvertise.com/", class: "navbar-brand" }, h("img", { key: 'e05d25ae3af59d77590e43a132ad9e97ff546fae', src: "https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo-small.svg", alt: "Crossvertise" }))), h("div", { key: '8484fe0e888857d086989e9f4cc7caef8bf58fe8', class: "hidden-xs" }, h("a", { key: '9b000a2b4efc8a60f3b0f18278cabd28e021b972', href: "https://www.crossvertise.com/", class: "navbar-brand" }, h("img", { key: 'a96d1afff0c35c21c51475205fa7094fdd803f13', loading: "lazy", src: "https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo.svg", alt: "Crossvertise" }))))), h("div", { key: '920f52e74137ae786c32b4f15d4da2d48824082e', class: "col-sm-9 col-xs-9 col-xxs-8 no-padding-left" }, h("ul", { key: '098d6fa397ce40a65e7d0e56beebf9b855683e74', class: "nav nav-pills nav-meta pull-right" }, h("li", { key: 'e69db80df8e0fdce4dbdfaf3460a6baa85b7455f' }, h("a", { key: '1bd1de4852603bcc7380cbb0b13943b7c46f3a18', class: "btn btn-link navbar-btn hidden-xs", href: "#" }, h("i", { key: '03059f6b70ddf78c0eab55fb57291a5dfdefdaab', class: "fa fa-user" }), h("i", { key: 'cf8e0d2f1533be362ae2d44379bf81ffeca94a62', class: "fa fa-exchange-alt" }))), h("li", { key: '5508f231657ec2ecb34d26f1fbdfe1bcd81c9bfc' }, h("a", { key: '81ac0da6631bc11aea5620dc949c856495cda486', class: "btn btn-link navbar-btn hidden-xs", href: "#" }, "Kontakt"), h("a", { key: 'af1b609f44b88f51dbaad88bb035171d491f30c7', href: "https://www.crossvertise.com/contact", class: "btn btn-link navbar-btn hidden-xs", style: { display: 'none' } }, "Kontakt"), h("a", { key: '25ab2f195433651bc6c46f0e04825b21c1e857fd', class: "btn btn-default btn-link navbar-btn visible-xs hidden-xxs", href: "#" }, h("i", { key: 'cb595bdb1fc64f93da1de0072b9cd2e9d22e7f54', class: "fa fa-phone" }))), h("li", { key: 'd817905dac3ad0ad06ff2222b5e6cf5cf1588850', class: "dropdown", id: "my-xv-menu" }, h("a", { key: '89d84fa4b57677b6da2f9760c596e726be3d7840', href: "#", class: "dropdown-toggle btn btn-default navbar-btn btn-link", "data-toggle": "dropdown" }, h("i", { key: '3cc519aa50ff205461f272880218eaa147ae3c2c', class: "fa fa-user fa-lg text-success", "aria-hidden": "true" }), "\u00A0", h("span", { key: '54e5571967500594d1d81b94d3344ebfc43d5e76', class: "hidden-xs" }, "Mein Bereich"), h("span", { key: 'd94f684d2e92cae8fbfa7801096fb9cf68a77a0d', class: "caret" })), h("ul", { key: '3fc48bc0efea55e776c3090ecfa11488b7b3b660', class: "dropdown-menu-left dropdown-menu navbar-myxv" }, h("li", { key: 'fdc28d4743e5ff08a7ad82aa832ce4b2b0cda2c9' }, h("a", { key: 'd6299037715fd7334908cf46aa1363c7c6b93628', href: "#" }, h("i", { key: 'bbef2ea537e2ac45ddb96b9a1c75385b74ab27bd', class: "fa fa-tachometer-alt fa-fw" }), "\u00A0Cockpitfunktionen\u00A0", h("i", { key: '3180f5eb463d952208c5dab92df10bf1d91188d4', class: "fa fa-caret-down" }))), h("li", { key: 'ab0801ac2ce1accdd4f3181bae621ceb5622085d' }, h("a", { key: 'c301aa9512a9e10a8e75714143cdc79b133f0f79', href: "#" }, h("i", { key: 'c66fc798ef7c26fd578bd4dfb52aad0fe0058079', class: "fa fa-cubes" }), "\u00A0Entit\u00E4ten\u00A0", h("i", { key: 'f4d020afc421e0da2825952c1734c2527ed768b3', class: "fa fa-caret-down" }))), h("li", { key: 'dad4a83d6d3b5a3fe2ae83f85c09c1482fd6c029', role: "separator", class: "divider" }), h("li", { key: '1227163cae5a535c37b314c10dddfe57d26def4d' }, h("a", { key: '4c1421bfd184e329f0502b8c63b0b40f54f6417b', href: "#" }, h("i", { key: 'acee487f4eca767f942a8ca77a1fe848c793f6af', class: "fa fa-user" }), "\u00A0Mein Crossvertise\u00A0", h("span", { key: '237f3d89333d7325043ea34c9bbb65eebe734768', class: "badge" }, "0"), h("i", { key: '6470c884f34df3018a14a61dd872d101fdc693f4', class: "fa fa-caret-down" }))), h("li", { key: '280fef33a19151ba180aeeba866cb006027515d0' }, h("a", { key: '00136d3e0a8742f546051400117f6a62cc4561d3', href: "https://www.crossvertise.com/de-de/mycrossvertise/account/logoff?returnUrl=https%3A%2F%2Fwww.crossvertise.com" }, h("i", { key: 'acda646a3b0e50dcc65002faf717effadc73b2eb', class: "fa fa-sign-out-alt fa-fw", "aria-hidden": "true" }), "\u00A0Logout")))), h("li", { key: '97f77e84bf17ef45a321590f4092a1e8efbce5d3', class: "visible-sm-block visible-xs-block hidden-xxs" }, h("a", { key: 'cbd99563d2a807763386d8d11dc9b5c8500e06f1', class: "btn btn-default navbar-btn btn-link", "data-toggle": "collapse", "data-target": "#search-collapse" }, h("i", { key: 'dcda6727eca7a6d323e5a8b222fe5d9cf1f51e3b', class: "fa fa-search", "aria-hidden": "true" }))), h("li", { key: 'f4f79c26e331795f069863e9d808c25ba826d909', class: "hidden-xs hidden-sm" }, h("a", { key: '8cc458cced48ab651861abc7cb3392e78a7f2d82', role: "button", onClick: this.openLoginModal, class: "btn btn-default navbar-btn btn-link" }, h("i", { key: 'fc4ad896ef0c0133e7cd5e004f4305232c2f8736', class: "fa fa-user fa-lg", "aria-hidden": "true" }), h("span", { key: '3a18b0ada04b3dc59c745bac9fbb9c913a1f285b' }, "Login"))), h("xv-login-modal", { key: 'eb76a226443b6ce861c90ebdc42b4dd18487a7ea', visible: this.showLoginModal, onClose: this.closeLoginModal }), h("li", { key: '3926d6711fadd3101a47fd5ad44dd34e1b4ea41f', class: "hidden-xs" }, h("a", { key: '54c7d9a8880732540ccaea643f08e55df857c80a', class: "btn btn-default navbar-btn btn-link", href: "https://market.crossvertise.com/de-de/mycrossvertise/account/register" }, h("span", { key: 'a886fd9515fd42a787a0bee5782739100ba2a874' }, "Registrieren"))), h("li", { key: 'bb728014870b1ee825ae44e05e435b4f249ae943', class: "navbar-divider hidden-xs" }), h("li", { key: '686a75dc0b4f4d544e2e4a58bceb9220bf584401' }, h("a", { key: '7a5501d91d1e80ecbf3e1cff254d9ed8404cb4a6', class: "btn btn-success navbar-btn", href: "https://market.crossvertise.com/de-de/mycrossvertise/shoppingcart/activecart" }, h("span", { key: '3907db53aca750a7af24a40f30078c8cb3f12f0a', class: "xv-font-icon-warenkorb fa-lg fa-fw", "aria-hidden": "true" }), h("span", { key: '0f9fbbe251f1f95dcfd7a55af4613b119291a1c5', class: "hidden-xs hidden-sm" }, "\u00A0Warenkorb\u00A0"), h("span", { key: '9a5a84b9ee050a8a2d9cd8a51a63a6bcecef6f72', class: "badge badge-success" }, "0"))))))), h("div", { key: 'd558a444b34b0c9b78eb2ffba68cfb4cad2783e7', class: "collapse hidden-md hidden-lg", id: "search-collapse" }, h("div", { key: 'cdfdc3c8481eed737bc36d0cc559ec0cfa60a431', class: "container" }, h("form", { key: 'fe2253d8cb3d211b59a7898d696631a9f74ec6f6', action: "https://market.crossvertise.com/de-de/media/search", class: "navbar-form", method: "get", role: "search" }, h("div", { key: '8d0722f3ba685197514c2c7f0d255c7dd59fb40e', class: "input-group" }, h("input", { key: '3827a888727f94f7e84920f544a50235a5c10bec', class: "form-control", name: "Q", placeholder: "Suche", type: "text", autocomplete: "off" }), h("span", { key: '93748c9301681f31497cbcedc0a989e794bbd2d7', class: "input-group-btn force-full-width" }, h("button", { key: 'cf00efc17ded1365ee4f5dfdbed70e2e309c8ccc', class: "btn btn-default search-addon", type: "submit" }, h("i", { key: '38f9d4c2cf46da5fbc8ff31f5ee4e1e7f93ee5eb', class: "fa fa-search", "aria-hidden": "true" })))))))), h("div", { key: '9885522bb7260b13e95036e79c181b5924f41bc9', innerHTML: this.htmlContent })));
     }
     static get is() { return "xv-header"; }
     static get originalStyleUrls() {

package/dist/collection/components/xv-link/xv-link.js

@@ -12,7 +12,7 @@ export class XvLink {
         e.stopPropagation();
     }
     render() {
-        return (h(Host, { key: 'e9c006db5f3b72c48b8a6c3597ee46e2451e156b', class: `xv-link_${this.variant}` }, h("a", { key: 'a534ebd8dce32cf261e8b5354d93d58064136ad8', href: this.href, onClick: this.preventLinkHandler.bind(this), class: `xv-link ${this.disabled ? 'xv-link_disabled' : ''} ${this.size}`, target: this.target }, h("slot", { key: '582553af67dd32e8c83d28a4488bb5fffbb2a064', name: "icon-left" }), h("slot", { key: 'ca4705fd7ead40197d019c451d6c3cf1cdacfde1' }), h("slot", { key: 'c9433d24cc3e6b5acdb8645d4816d93375df7a43', name: "icon-right" }))));
+        return (h(Host, { key: 'a1abb193eeb641ee9e3b8fea49799d1ea6a245bd', class: `xv-link_${this.variant}` }, h("a", { key: '64f2b949fd2069201c5b046b6d1ac5dfc645859f', href: this.href, onClick: this.preventLinkHandler.bind(this), class: `xv-link ${this.disabled ? 'xv-link_disabled' : ''} ${this.size}`, target: this.target }, h("slot", { key: '7fc045a8dceb6c8682b4e8b1711d5fc26a8acebf', name: "icon-left" }), h("slot", { key: '9034c94df501fcf307b3e5f56161ac3cf128862a' }), h("slot", { key: '67290ba58714e87e92f4a4b7a9f13050a0ee6ed4', name: "icon-right" }))));
     }
     static get is() { return "xv-link-v2"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/xv-modal/xv-modal.js

@@ -58,7 +58,7 @@ export class XvModal {
     }
     render() {
         var _a;
-        return (h(Host, { key: 'ef15c655a4e3e5020de233c8627dbefc62ed9e56', role: "dialog", size: this.size, id: this.el.id }, h("slot", { key: '55950e9d76cd33495f14eb159d998dc11277c0f9', name: "trigger", onSlotchange: this.setupTrigger }), h("div", { key: 'f3e941dec65ec9a7093dc88a82024b6d4db6324a', class: { backdrop: true }, onClick: this.onBackdropClick }, h("div", { key: '48142d79b4de6d1aa146c8c8033a0cfbe9e166da', class: "modal" }, h("button", { key: '6e9501a2b6f69755d93740ce334bfc4a5ea78f60', class: "modal_close", onClick: this.closeModal.bind(this) }, "\u00D7"), h("div", { key: '9aadbd409cace25b8e8e8bead47b0610d756e1c4', class: "modal_header" }, h("slot", { key: '32d0f7b10974856e3806e82ffc8d971b3b25e81b', name: "header" }, ((_a = this.el) === null || _a === void 0 ? void 0 : _a.title) && h("h5", { key: '8e5ede7c5f8488adcb42a61f972562c8214aebae', class: "modal_header__title" }, this.el.title))), h("div", { key: 'd00616f0a7865d301a0b090dd91363bde4128867', class: { 'modal_content': true, overflow: this.overflow } }, h("slot", { key: 'd263d339bedadd0557e386e22c4526b98e446027' })), h("div", { key: 'cf96d19157c63b68abc85e95042a9619accd26fd', class: "modal_footer" }, h("slot", { key: '0b41d59fecf287e452d10aa6a6f4ab1a6e07f77f', name: "footer" }))))));
+        return (h(Host, { key: '7d7317c22e0ad0318e3f2dd191bfb77c75cd714e', role: "dialog", size: this.size, id: this.el.id }, h("slot", { key: '33f447364a130b66b01d2c15e14dd8e9c5524abe', name: "trigger", onSlotchange: this.setupTrigger }), h("div", { key: '102daec2e60b1062b3e7e60c9885697ac809b3f2', class: { backdrop: true }, onClick: this.onBackdropClick }, h("div", { key: '37b9a20e62e333b7ed0b2acfdadeb328c78af618', class: "modal" }, h("button", { key: 'c670eb2fa28e16089f01b4c3760f83cf4fbcd3d9', class: "modal_close", onClick: this.closeModal.bind(this) }, "\u00D7"), h("div", { key: '9dda2d815674cc8c49247a65c1ec95dea29da54b', class: "modal_header" }, h("slot", { key: '1eab44b952ff237e74a4d6833db585e3b2ffdab2', name: "header" }, ((_a = this.el) === null || _a === void 0 ? void 0 : _a.title) && h("h5", { key: '2aba68d70d04b62cb6551e4f133a0d774df34064', class: "modal_header__title" }, this.el.title))), h("div", { key: 'a832e12c09482a9f4007a2381a23695ceea82759', class: { 'modal_content': true, overflow: this.overflow } }, h("slot", { key: '1da580e3d2116360d429bdea2e9697a66932c50e' })), h("div", { key: 'cd5fd0aa543ef9a5777b2b8553cdc0909bd22eb0', class: "modal_footer" }, h("slot", { key: '3b168cb8474a2aa407fbb8b35e6c49c115038fe5', name: "footer" }))))));
     }
     disconnectedCallback() {
         this.removeTriggerListener();

package/dist/collection/components/xv-notification/xv-notification.css

@@ -20,6 +20,7 @@
   display: flex;
   flex-direction: column;
   row-gap: var(--spacing-06, 24px);
+  word-break: break-all;
 }
 :host .content_title {
   text-align: left;

package/dist/collection/components/xv-notification/xv-notification.js

@@ -25,7 +25,7 @@ export class XvNotification {
         };
     }
     render() {
-        return (h(Host, { key: '4600f7f3594935680e104bad02663f288460b39b', class: "xv-notification", type: this.variant }, this.renderIcon(this.variant), h("div", { key: 'ffc9842337dcaba886a58fc80d96810c33a47f76', class: "content" }, h("div", { key: '1236432271bf6cb93c5bfbb0614d87c0d1fb183b', class: "content_wrapper" }, this.el.title && h("h5", { key: '10cbc18d55fe9842e31a65b814015eb66a4641af', class: "content_title" }, this.el.title), h("slot", { key: 'e127dfc35e3e6542c417ef27ab01515fd83af9f2' })), h("slot", { key: 'beb7103db214900e7833187cf6c9ee3dffc18b03', name: "footer" })), this.dismissible && h("button", { key: '791ef115a1739271ec9d87e145691ecaf18b2498', class: "close", onClick: this.closeHandle })));
+        return (h(Host, { key: '8e31924e48581db6ff89b5500fb8467aa9be2314', class: "xv-notification", type: this.variant }, this.renderIcon(this.variant), h("div", { key: '2c23995a9f4fb150969826871451bbb7a4310595', class: "content" }, h("div", { key: '78bdf254268d1860c628a960dcf9146fc231153a', class: "content_wrapper" }, this.el.title && h("h5", { key: '3004f153ee078aea0189101f0b98d3fa6a0970c1', class: "content_title" }, this.el.title), h("slot", { key: '1f3dafa38f5f87a35cf8b23433a853c318dd6df0' })), h("slot", { key: '04ccf160451a11797f5d927403c531bbd55d7cfe', name: "footer" })), this.dismissible && h("button", { key: '6ac59409e46187eacae93f728f695c8e1d28dc21', class: "close", onClick: this.closeHandle })));
     }
     static get is() { return "xv-notification-v2"; }
     static get encapsulation() { return "shadow"; }