@tet/tet-components 1.3.90-testing → 1.3.91-staging

package/dist/collection/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.js

@@ -0,0 +1,654 @@
+import { Host, h } from "@stencil/core";
+/**
+ * Dynamic card component that displays content in a card format with optional image,
+ * price, tags, and action button.
+ *
+ * @part card - The main card container
+ * @part image - The image container
+ * @part content - The content container
+ * @part title - The title element
+ * @part subtitle - The subtitle element
+ * @part button - The action button container
+ * @part tags - The tags container
+ */
+export class TetDynamicCard {
+    constructor() {
+        this.priceViewRef = null;
+        this.buttonRef = null;
+        this.dateTagColorRef = null;
+        this.rootElementRef = null;
+        this.BREAKPOINTS = {
+            MOBILE: 768,
+            TABLET: 1440,
+            DESKTOP: 1920
+        };
+        this.CARD_SIZES = {
+            standard: {
+                'S': 'fit-content',
+                'M': 'calc(50% - 0.75rem)',
+                'XL': '100%',
+            },
+            responsive: {
+                mobile: '100%',
+                tablet: 'calc(100% - var(--card-width-tablet) - 1.5rem - 2px)',
+                desktop: 'calc(100% - var(--card-width-desktop) - 1.5rem - 2px)',
+            }
+        };
+        this.resizeCard = (width) => {
+            this.currentSize = this.getCardSize(width);
+            this.rootElementRef.style.minWidth = this.getMinWidth(width);
+            this.rootElementRef.style.width = this.getCardWidth(this.currentSize, width);
+        };
+        this.resizeObserver = new ResizeObserver(() => {
+            var _a, _b, _c, _d, _e, _f;
+            const width = window.innerWidth;
+            this.resizeCard(width);
+            if (width < 768) {
+                (_a = this.priceViewRef) === null || _a === void 0 ? void 0 : _a.setAttribute('size', 'S');
+                (_b = this.buttonRef) === null || _b === void 0 ? void 0 : _b.setAttribute('size', 'small');
+            }
+            else if (width < 1920) {
+                (_c = this.priceViewRef) === null || _c === void 0 ? void 0 : _c.setAttribute('size', 'M');
+                (_d = this.buttonRef) === null || _d === void 0 ? void 0 : _d.setAttribute('size', 'medium');
+            }
+            else {
+                (_e = this.priceViewRef) === null || _e === void 0 ? void 0 : _e.setAttribute('size', 'M');
+                (_f = this.buttonRef) === null || _f === void 0 ? void 0 : _f.setAttribute('size', 'large');
+            }
+        });
+        this.handleButtonClick = (event) => {
+            this.tetDynamicCardClickEvent.emit(event);
+        };
+        this.handleClick = (event) => {
+            var _a;
+            const path = event.composedPath();
+            const isButtonClick = path.some(el => { var _a; return el instanceof HTMLElement && ((_a = el.classList) === null || _a === void 0 ? void 0 : _a.contains('button')); });
+            if (!isButtonClick) {
+                if (this.buttonRef && this.linkHref) {
+                    const button = (_a = this.buttonRef.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('button');
+                    if (button) {
+                        button.click();
+                    }
+                }
+            }
+        };
+        this.theme = 'light';
+        this.size = 'S';
+        this.sizeChangeBreakpoint = 'None';
+        this.isInCarousel = false;
+        this.pictureLayoutShiftPosition = 'left';
+        this.cardTitle = undefined;
+        this.subtitle = undefined;
+        this.tags = undefined;
+        this.dateTag = undefined;
+        this.dateTagColorLight = 'black';
+        this.dateTagColorDark = 'white';
+        this.priceTagOptions = {
+            show: false,
+            backgroundLight: 'white',
+            backgroundDark: 'black'
+        };
+        this.linkType = undefined;
+        this.linkHref = undefined;
+        this.linkText = undefined;
+        this.linkNewTab = false;
+        this.modalId = undefined;
+        this.index = undefined;
+        this.isFocused = false;
+        this.originalSize = null;
+        this.currentSize = null;
+    }
+    onThemeChanged(theme) {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        if (theme === 'dark') {
+            (_a = this.priceViewRef) === null || _a === void 0 ? void 0 : _a.setAttribute('background', (_b = this.priceTagOptions) === null || _b === void 0 ? void 0 : _b.backgroundDark);
+            (_c = this.dateTagColorRef) === null || _c === void 0 ? void 0 : _c.classList.remove(`tag--${this.dateTagColorLight}`);
+            (_d = this.dateTagColorRef) === null || _d === void 0 ? void 0 : _d.classList.add(`tag--${this.dateTagColorDark}`);
+        }
+        else {
+            (_e = this.priceViewRef) === null || _e === void 0 ? void 0 : _e.setAttribute('background', (_f = this.priceTagOptions) === null || _f === void 0 ? void 0 : _f.backgroundLight);
+            (_g = this.dateTagColorRef) === null || _g === void 0 ? void 0 : _g.classList.remove(`tag--${this.dateTagColorDark}`);
+            (_h = this.dateTagColorRef) === null || _h === void 0 ? void 0 : _h.classList.add(`tag--${this.dateTagColorLight}`);
+        }
+    }
+    onSizeChange() {
+        this.originalSize = this.size;
+        this.resizeCard(window.innerWidth);
+    }
+    getCardSize(width) {
+        if (this.originalSize === 'L') {
+            if (width < this.BREAKPOINTS.MOBILE) {
+                return (this.sizeChangeBreakpoint === 'Mob' || this.sizeChangeBreakpoint === 'Tab') ? 'S' : 'XL';
+            }
+            else if (width < this.BREAKPOINTS.TABLET) {
+                return this.sizeChangeBreakpoint === 'Tab' ? 'S' : 'XL';
+            }
+            else {
+                return this.originalSize;
+            }
+        }
+        else if (this.originalSize === 'M') {
+            if (width < this.BREAKPOINTS.MOBILE) {
+                return (this.sizeChangeBreakpoint === 'Mob' || this.sizeChangeBreakpoint === 'Tab') ? 'S' : 'XL';
+            }
+            else if (width < this.BREAKPOINTS.TABLET) {
+                return this.sizeChangeBreakpoint === 'Tab' ? 'S' : this.originalSize;
+            }
+            else {
+                return this.originalSize;
+            }
+        }
+        return this.originalSize;
+    }
+    getMinWidth(width) {
+        if (width < this.BREAKPOINTS.MOBILE) {
+            return 'calc(var(--card-width-mobile)-2rem)';
+        }
+        else if (width < this.BREAKPOINTS.TABLET) {
+            return 'calc(var(--card-width-tablet)-2rem)';
+        }
+        else if (width < this.BREAKPOINTS.DESKTOP) {
+            return 'var(--card-width-tablet)';
+        }
+        else {
+            return 'var(--card-width-desktop)';
+        }
+    }
+    getCardWidth(size, width) {
+        if (this.isInCarousel) {
+            return 'fit-content';
+        }
+        const adaptiveSize = this.originalSize === 'L' || this.originalSize === 'M';
+        if (width < this.BREAKPOINTS.MOBILE) {
+            if (adaptiveSize && (this.sizeChangeBreakpoint === 'Mob' || this.sizeChangeBreakpoint === 'Tab')) {
+                return 'fit-content';
+            }
+            // Special handling
+            if (size === 'L' || size === 'M') {
+                return this.CARD_SIZES.responsive.mobile;
+            }
+        }
+        else if (width < this.BREAKPOINTS.TABLET) {
+            if (adaptiveSize && this.sizeChangeBreakpoint === 'Tab') {
+                return 'fit-content';
+            }
+            if (size === 'L') {
+                return this.CARD_SIZES.responsive.tablet;
+            }
+        }
+        else if (width < this.BREAKPOINTS.DESKTOP) {
+            if (size === 'L') {
+                return this.CARD_SIZES.responsive.tablet;
+            }
+        }
+        else {
+            if (size === 'L') {
+                return this.CARD_SIZES.responsive.desktop;
+            }
+        }
+        return this.CARD_SIZES.standard[size] || 'fit-content';
+    }
+    componentWillLoad() {
+        this.originalSize = this.size;
+        this.currentSize = this.size;
+    }
+    componentDidLoad() {
+        this.onThemeChanged(this.theme);
+        this.resizeObserver.observe(window.document.body);
+    }
+    renderTags() {
+        var _a;
+        const dateTagColor = this.theme === 'dark' ? this.dateTagColorDark : this.dateTagColorLight;
+        return (h("div", { class: "tags-container", part: "tags" }, ((_a = this.tags) === null || _a === void 0 ? void 0 : _a.length) > 0 && (h("div", { class: "tags" }, this.tags.map(tag => (h("span", { class: "tag" }, tag))))), this.dateTag && (h("div", { class: "tags" }, h("div", { class: `tag colored colored--${dateTagColor}`, ref: (elm) => { this.dateTagColorRef = elm; } }, h("span", { class: "date-tag-text" }, this.dateTag))))));
+    }
+    renderPrice() {
+        var _a, _b, _c;
+        if (!((_a = this.priceTagOptions) === null || _a === void 0 ? void 0 : _a.show))
+            return null;
+        const priceBackground = this.theme === 'dark' ? this.priceTagOptions.backgroundDark : this.priceTagOptions.backgroundLight;
+        return (h("div", { class: "price", part: "price" }, h("tet-price-view", { ref: elm => { this.priceViewRef = elm; }, font: this.priceTagOptions.font || "Gilroy, Arial, sans-serif", background: priceBackground, size: "S", "heading-text": this.priceTagOptions.headingText, "price-type": this.priceTagOptions.priceType, "euro-price": (_b = this.priceTagOptions.euroPrice) === null || _b === void 0 ? void 0 : _b.toString(), "cents-price": (_c = this.priceTagOptions.centsPrice) === null || _c === void 0 ? void 0 : _c.toString(), "footer-text": this.priceTagOptions.footerText, "footer-text-type": this.priceTagOptions.footerTextType })));
+    }
+    renderButton() {
+        if (!this.linkType || (!this.linkHref && !this.modalId))
+            return null;
+        const buttonProps = Object.assign({ type: 'primary', size: 'small', theme: this.theme }, (this.linkType === 'url' ? {
+            url: this.linkHref,
+            'url-target': this.linkNewTab ? '_blank' : '_self',
+            'accessibility-label': this.linkText
+        } : {
+            'data-modal-screen-key': this.modalId
+        }));
+        return (h("div", { class: "button", part: "button", onClick: this.handleButtonClick, onKeyUp: (event) => {
+                if (event.key === 'Enter')
+                    this.handleButtonClick(event);
+            } }, h("tet-button", Object.assign({}, buttonProps, { ref: elm => { this.buttonRef = elm; } }), this.linkText)));
+    }
+    render() {
+        return (h(Host, { key: 'ee4d48576d500ebfa9ae214f70e09cea2e7c0295', class: {
+                'dynamic-card': true,
+                'is-focused': this.isFocused
+            }, "data-index": this.index, ref: (elm) => { this.rootElementRef = elm; } }, h("div", { key: 'f1a997b6c257ebc6f0129dc613a8d2deeb9b3c8a', class: `card
+            theme-${this.theme}
+            size-${this.currentSize}
+            position-${this.pictureLayoutShiftPosition}
+            carousel-${this.isInCarousel}
+          `, onClick: this.handleClick, onKeyUp: (event) => {
+                if (event.key === 'Enter')
+                    this.handleClick(event);
+            }, tabindex: 0, part: "card", "aria-labelledby": this.cardTitle }, h("div", { key: '2eb747ef0192e5f003d62d14866367a100c412e8', class: "image", part: "image" }, h("slot", { key: 'f8dd1d2429e27da0983ea4625d6b65ae555e7afd', name: "image" }), this.renderPrice(), this.renderTags()), h("div", { key: 'ccaba0459f9bc7ea3ff7faa103ba0139ea9742b4', class: "content-container" }, h("div", { key: '1f6262627078cdc2413a1dabf78dbdc5d35cb4a5', class: "content", part: "content" }, this.cardTitle && (h("h3", { key: 'f5f26d6db81a0df0b101c617c80603aa2d0e3321', class: "title", part: "title" }, this.cardTitle)), this.subtitle && (h("p", { key: 'eb3e7aa190be7cca5e7576834d4982643f4eb8e7', class: "subtitle", part: "subtitle" }, this.subtitle))), this.renderButton()))));
+    }
+    static get is() { return "tet-dynamic-card"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["tet-dynamic-card.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["tet-dynamic-card.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "theme": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "ButtonTheme",
+                    "resolved": "\"dark\" | \"light\"",
+                    "references": {
+                        "ButtonTheme": {
+                            "location": "global",
+                            "id": "global::ButtonTheme"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The theme of the component"
+                },
+                "attribute": "theme",
+                "reflect": false,
+                "defaultValue": "'light'"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "CardSize",
+                    "resolved": "\"L\" | \"M\" | \"S\" | \"XL\"",
+                    "references": {
+                        "CardSize": {
+                            "location": "local",
+                            "path": "/__w/internal-tet-web-components-tet-components/internal-tet-web-components-tet-components/src/src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx",
+                            "id": "src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx::CardSize"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The size of the card"
+                },
+                "attribute": "size",
+                "reflect": false,
+                "defaultValue": "'S'"
+            },
+            "sizeChangeBreakpoint": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "SizeChangeBreakpointType",
+                    "resolved": "\"Mob\" | \"None\" | \"Tab\"",
+                    "references": {
+                        "SizeChangeBreakpointType": {
+                            "location": "local",
+                            "path": "/__w/internal-tet-web-components-tet-components/internal-tet-web-components-tet-components/src/src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx",
+                            "id": "src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx::SizeChangeBreakpointType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The size of the card"
+                },
+                "attribute": "size-change-breakpoint",
+                "reflect": false,
+                "defaultValue": "'None'"
+            },
+            "isInCarousel": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Is in carousel"
+                },
+                "attribute": "is-in-carousel",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "pictureLayoutShiftPosition": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "pictureLayoutShiftPositionType",
+                    "resolved": "\"left\" | \"right\"",
+                    "references": {
+                        "pictureLayoutShiftPositionType": {
+                            "location": "local",
+                            "path": "/__w/internal-tet-web-components-tet-components/internal-tet-web-components-tet-components/src/src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx",
+                            "id": "src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx::pictureLayoutShiftPositionType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The position of a picture during layout shift"
+                },
+                "attribute": "picture-layout-shift-position",
+                "reflect": false,
+                "defaultValue": "'left'"
+            },
+            "cardTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The title of the card"
+                },
+                "attribute": "card-title",
+                "reflect": false
+            },
+            "subtitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The subtitle of the card"
+                },
+                "attribute": "subtitle",
+                "reflect": false
+            },
+            "tags": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Array of tags to display"
+                }
+            },
+            "dateTag": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Secondary tag date"
+                },
+                "attribute": "date-tag",
+                "reflect": false
+            },
+            "dateTagColorLight": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "TagType",
+                    "resolved": "\"black\" | \"white\" | \"yellow\"",
+                    "references": {
+                        "TagType": {
+                            "location": "local",
+                            "path": "/__w/internal-tet-web-components-tet-components/internal-tet-web-components-tet-components/src/src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx",
+                            "id": "src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx::TagType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The color of the date tag in light theme."
+                },
+                "attribute": "date-tag-color-light",
+                "reflect": false,
+                "defaultValue": "'black'"
+            },
+            "dateTagColorDark": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "TagType",
+                    "resolved": "\"black\" | \"white\" | \"yellow\"",
+                    "references": {
+                        "TagType": {
+                            "location": "local",
+                            "path": "/__w/internal-tet-web-components-tet-components/internal-tet-web-components-tet-components/src/src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx",
+                            "id": "src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx::TagType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The color of the date tag in dark theme."
+                },
+                "attribute": "date-tag-color-dark",
+                "reflect": false,
+                "defaultValue": "'white'"
+            },
+            "priceTagOptions": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "PriceTagOptions",
+                    "resolved": "PriceTagOptions",
+                    "references": {
+                        "PriceTagOptions": {
+                            "location": "local",
+                            "path": "/__w/internal-tet-web-components-tet-components/internal-tet-web-components-tet-components/src/src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx",
+                            "id": "src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx::PriceTagOptions"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Price tag options"
+                },
+                "defaultValue": "{\n    show: false,\n    backgroundLight: 'white',\n    backgroundDark: 'black'\n  }"
+            },
+            "linkType": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "CardLinkType",
+                    "resolved": "\"modal\" | \"url\"",
+                    "references": {
+                        "CardLinkType": {
+                            "location": "local",
+                            "path": "/__w/internal-tet-web-components-tet-components/internal-tet-web-components-tet-components/src/src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx",
+                            "id": "src/components/advanced/cards/tet-dynamic-card/tet-dynamic-card.tsx::CardLinkType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Type of link"
+                },
+                "attribute": "link-type",
+                "reflect": false
+            },
+            "linkHref": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "URL for link type 'url'"
+                },
+                "attribute": "link-href",
+                "reflect": false
+            },
+            "linkText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Link text"
+                },
+                "attribute": "link-text",
+                "reflect": false
+            },
+            "linkNewTab": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Open link in new tab"
+                },
+                "attribute": "link-new-tab",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "modalId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Modal ID for link type 'modal'"
+                },
+                "attribute": "modal-id",
+                "reflect": false
+            },
+            "index": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Index of the card in a list/carousel"
+                },
+                "attribute": "index",
+                "reflect": false
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isFocused": {},
+            "originalSize": {},
+            "currentSize": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "tetDynamicCardClickEvent",
+                "name": "tetDynamicCardClickEvent",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event emitted when the card is clicked"
+                },
+                "complexType": {
+                    "original": "Event",
+                    "resolved": "Event",
+                    "references": {
+                        "Event": {
+                            "location": "import",
+                            "path": "@stencil/core",
+                            "id": ""
+                        }
+                    }
+                }
+            }];
+    }
+    static get watchers() {
+        return [{
+                "propName": "theme",
+                "methodName": "onThemeChanged"
+            }, {
+                "propName": "size",
+                "methodName": "onSizeChange"
+            }];
+    }
+}

package/dist/collection/components/advanced/customer/tet-asset-addresses/tet-asset-addresses.js

@@ -132,7 +132,7 @@ export class TetAssetAddresses {
         return this.loadAddresses();
     }
     render() {
-        return (h(Host, { key: 'b69c45714993063aeaf78d6706bcc69e3500abae', class: { 'asset-adddress-selection': true, [this.theme]: true } }, this.showLoader ? (h("tet-placeholder", { height: "12.5rem", darkTheme: this.theme === 'dark' })) : (this.renderAddressList()), this.isAddressSearchVisible && (h("tet-address-search", { key: '96758743324cc25d1fb43a07a9e0a030636d5dfd', inputDisabled: !!this.lastAddedKey, language: "lv", placeholder: this.addressSearchPlaceholder, newStyle: true, theme: this.theme }))));
+        return (h(Host, { key: '548a110c74ce7c7f4f3ba4142e87f20841a12143', class: { 'asset-adddress-selection': true, [this.theme]: true } }, this.showLoader ? (h("tet-placeholder", { height: "12.5rem", darkTheme: this.theme === 'dark' })) : (this.renderAddressList()), this.isAddressSearchVisible && (h("tet-address-search", { key: 'c566aa6fe62b44a267018fadf487290e76d95582', inputDisabled: !!this.lastAddedKey, language: "lv", placeholder: this.addressSearchPlaceholder, newStyle: true, theme: this.theme }))));
     }
     static get is() { return "tet-asset-addresses"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/advanced/customer/tet-asset-availability-addresses/tet-asset-availability-addresses.js

@@ -127,7 +127,7 @@ export class TetAssetAvailabilityAddresses {
     }
     ;
     render() {
-        return (h(Host, { key: '8b7f535828fdc055065729ec970adb083796950b', class: { 'asset-adddress-selection': true, [this.theme]: true } }, this.showLoader ? (h("tet-placeholder", { height: "12.5rem", darkTheme: this.theme === 'dark' })) : (this.renderAddressList())));
+        return (h(Host, { key: '2fbba15f83311348f57c3b367f4aa55bb5eb74a3', class: { 'asset-adddress-selection': true, [this.theme]: true } }, this.showLoader ? (h("tet-placeholder", { height: "12.5rem", darkTheme: this.theme === 'dark' })) : (this.renderAddressList())));
     }
     static get is() { return "tet-asset-availability-addresses"; }
     static get encapsulation() { return "shadow"; }