@tet/tet-components 1.3.157-testing → 1.4.0-staging

package/dist/components/{p-7790eae2.js → p-99823afc.js}

@@ -1,10 +1,10 @@
-import { p as proxyCustomElement, H, d as createEvent, h } from './p-37ed3ebb.js';
+import { p as proxyCustomElement, H, d as createEvent, h } from './p-c9d79ad4.js';
 import { g as getConvertedPixels } from './p-165a8492.js';
-import { d as defineCustomElement$5 } from './p-68f0e894.js';
-import { d as defineCustomElement$4 } from './p-0088d040.js';
-import { d as defineCustomElement$3 } from './p-163de6e2.js';
-import { d as defineCustomElement$2 } from './p-b0d6ed2e.js';
-import { d as defineCustomElement$1 } from './p-4d33055f.js';
+import { d as defineCustomElement$5 } from './p-36c5e434.js';
+import { d as defineCustomElement$4 } from './p-d7d60ba4.js';
+import { d as defineCustomElement$3 } from './p-29df1df5.js';
+import { d as defineCustomElement$2 } from './p-9ee3e98b.js';
+import { d as defineCustomElement$1 } from './p-6bfd47c5.js';
 
 /**
  * Returns the closest parent element past the Shadow Dom with the specified selector.
@@ -380,119 +380,6 @@ const TetCompareCard = /*@__PURE__*/ proxyCustomElement(class TetCompareCard ext
         this.__registerHost();
         this.__attachShadow();
         this.selectEvent = createEvent(this, "selectEvent", 7);
-        /** The parent element containing the components siblings. */
-        this.parentElement = null;
-        /** The resize observer watching element resizes. */
-        this.resizeObserver = null;
-        /** An object containing the previous, watched, element sizes.
-         * index: element class name.
-         * number: the height sum of the element's children.
-         */
-        this.sizes = {};
-        /**
-         * Dispatches a custom 'tet-card-resize' event to the `parentElement` with class names of the elements that have changed size.
-         */
-        this.emitResize = () => {
-            /* Skip resize on wide cards */
-            if (this.currentCardType === 'wide60-40') {
-                return;
-            }
-            const resizedElements = [];
-            const resizeables = Array.from(querySelectorAllDeep("[class*='js-resize']", this.host));
-            for (const resizeable of resizeables) {
-                const resizeableHeight = this.getElementInnerHeight(resizeable);
-                const selector = Array.from(resizeable.classList).find((className) => className.includes('js-resize'));
-                if (this.sizes[selector] !== resizeableHeight) {
-                    resizedElements.push(selector);
-                }
-                this.sizes[selector] = resizeableHeight;
-            }
-            /** Only dispatch if there are changes. */
-            if (resizedElements.length) {
-                this.parentElement.dispatchEvent(new CustomEvent('tet-card-resize', { detail: resizedElements }));
-            }
-        };
-        /**
-         * Adds bottom padding to the observed elements if they are smaller than those of their sibling cards.
-         * @param event A custom event containing the selectors of the elements that have changed size.
-         */
-        this.resizeCard = (event) => {
-            const tabCardsContainer = closestPastShadow(this.parentElement, '.tet-compare-cards-tab__cards');
-            let parentContainer;
-            if (tabCardsContainer) {
-                parentContainer = querySelectorAllDeep('tet-compare-card', tabCardsContainer);
-            }
-            else {
-                parentContainer = this.parentElement.querySelectorAll('tet-compare-card');
-            }
-            const siblings = Array.from(parentContainer).filter((card) => card != this.host);
-            const hostShadowRoot = this.host.shadowRoot;
-            const elementSizes = {};
-            for (const sibling of siblings) {
-                const siblingShadowRoot = sibling.shadowRoot;
-                /** if a sibling is `best-choice` add extra padding to the top. */
-                if (!this.bestChoice && siblingShadowRoot.querySelector('.card').classList.contains('best-choice')) {
-                    const firstElement = hostShadowRoot.querySelector('.best-choice-title');
-                    firstElement.style.paddingBottom = '1rem';
-                }
-                const siblingElements = Array.from(querySelectorAllDeep("[class*='js-resize']", sibling));
-                for (const siblingElement of siblingElements) {
-                    const selector = Array.from(siblingElement.classList).find((className) => className.includes('js-resize'));
-                    if (!event.detail.includes(selector)) {
-                        continue;
-                    }
-                    if (elementSizes[selector] === undefined) {
-                        elementSizes[selector] = [];
-                    }
-                    const height = this.getElementInnerHeight(siblingElement);
-                    elementSizes[selector].push({ element: siblingElement, height });
-                }
-            }
-            for (const selector in elementSizes) {
-                const element = querySelectorDeep(`.${selector}`, this.host);
-                const elementHeight = this.getElementInnerHeight(element);
-                /** Get the largest of the elements out of all cards. */
-                const largestHeight = elementSizes[selector].reduce((siblingA, siblingB) => (siblingA.height >= siblingB.height ? siblingA : siblingB), { element, height: elementHeight });
-                this.resizeObserver.unobserve(element);
-                if (largestHeight.element === element) {
-                    /** If the current element is the largest, remove the extra padding. */
-                    element.style.paddingBottom = null;
-                }
-                else {
-                    /** Get the current padding from the largest sibling, as they will not have the manually added padding. */
-                    const paddingBottom = getConvertedPixels(getComputedStyle(largestHeight.element).paddingBottom);
-                    element.style.paddingBottom = `${largestHeight.height - elementHeight + paddingBottom}px`;
-                }
-                this.resizeObserver.observe(element);
-            }
-        };
-        /** Gets the height sum of all direct child elements.
-         * @param element The parent element.
-         * @returns a pixel value of the child element height sum.
-         */
-        this.getElementInnerHeight = (element) => {
-            return Array.from(element.children)
-                .map((child) => child.getBoundingClientRect().height)
-                .reduce((a, b) => a + b, 0);
-        };
-        /** Attaches the `resizeObserver` to all elements containing a class selector containing `js-resize` */
-        this.observeResize = () => {
-            for (const element of Array.from(this.host.shadowRoot.querySelectorAll("[class*='js-resize']"))) {
-                this.resizeObserver.observe(element);
-            }
-        };
-        /**
-         * Set the current card type based on window width, essentially simulating media query behavior.
-         */
-        this.setCardType = () => {
-            const windowWidth = window.innerWidth;
-            if (this.currentCardType === 'wide60-40' && windowWidth <= this.minWideWidth) {
-                this.currentCardType = 'regular';
-            }
-            else if (this.currentCardType === 'regular' && windowWidth > this.minWideWidth) {
-                this.currentCardType = 'wide60-40';
-            }
-        };
         this.clickCallback = () => null;
         this.index = undefined;
         this.cardType = 'regular';
@@ -525,6 +412,20 @@ const TetCompareCard = /*@__PURE__*/ proxyCustomElement(class TetCompareCard ext
         this.darkMode = false;
         this.currentCardType = this.cardType;
     }
+    get host() { return this; }
+    /**
+     * The selectEvent event emitter.
+     */
+    selectEvent;
+    /** The parent element containing the components siblings. */
+    parentElement = null;
+    /** The resize observer watching element resizes. */
+    resizeObserver = null;
+    /** An object containing the previous, watched, element sizes.
+     * index: element class name.
+     * number: the height sum of the element's children.
+     */
+    sizes = {};
     onClick() {
         this.selectEvent.emit({ index: this.index, target: this });
     }
@@ -561,6 +462,110 @@ const TetCompareCard = /*@__PURE__*/ proxyCustomElement(class TetCompareCard ext
         }
         return this.parentElement;
     }
+    /**
+     * Dispatches a custom 'tet-card-resize' event to the `parentElement` with class names of the elements that have changed size.
+     */
+    emitResize = () => {
+        /* Skip resize on wide cards */
+        if (this.currentCardType === 'wide60-40') {
+            return;
+        }
+        const resizedElements = [];
+        const resizeables = Array.from(querySelectorAllDeep("[class*='js-resize']", this.host));
+        for (const resizeable of resizeables) {
+            const resizeableHeight = this.getElementInnerHeight(resizeable);
+            const selector = Array.from(resizeable.classList).find((className) => className.includes('js-resize'));
+            if (this.sizes[selector] !== resizeableHeight) {
+                resizedElements.push(selector);
+            }
+            this.sizes[selector] = resizeableHeight;
+        }
+        /** Only dispatch if there are changes. */
+        if (resizedElements.length) {
+            this.parentElement.dispatchEvent(new CustomEvent('tet-card-resize', { detail: resizedElements }));
+        }
+    };
+    /**
+     * Adds bottom padding to the observed elements if they are smaller than those of their sibling cards.
+     * @param event A custom event containing the selectors of the elements that have changed size.
+     */
+    resizeCard = (event) => {
+        const tabCardsContainer = closestPastShadow(this.parentElement, '.tet-compare-cards-tab__cards');
+        let parentContainer;
+        if (tabCardsContainer) {
+            parentContainer = querySelectorAllDeep('tet-compare-card', tabCardsContainer);
+        }
+        else {
+            parentContainer = this.parentElement.querySelectorAll('tet-compare-card');
+        }
+        const siblings = Array.from(parentContainer).filter((card) => card != this.host);
+        const hostShadowRoot = this.host.shadowRoot;
+        const elementSizes = {};
+        for (const sibling of siblings) {
+            const siblingShadowRoot = sibling.shadowRoot;
+            /** if a sibling is `best-choice` add extra padding to the top. */
+            if (!this.bestChoice && siblingShadowRoot.querySelector('.card').classList.contains('best-choice')) {
+                const firstElement = hostShadowRoot.querySelector('.best-choice-title');
+                firstElement.style.paddingBottom = '1rem';
+            }
+            const siblingElements = Array.from(querySelectorAllDeep("[class*='js-resize']", sibling));
+            for (const siblingElement of siblingElements) {
+                const selector = Array.from(siblingElement.classList).find((className) => className.includes('js-resize'));
+                if (!event.detail.includes(selector)) {
+                    continue;
+                }
+                if (elementSizes[selector] === undefined) {
+                    elementSizes[selector] = [];
+                }
+                const height = this.getElementInnerHeight(siblingElement);
+                elementSizes[selector].push({ element: siblingElement, height });
+            }
+        }
+        for (const selector in elementSizes) {
+            const element = querySelectorDeep(`.${selector}`, this.host);
+            const elementHeight = this.getElementInnerHeight(element);
+            /** Get the largest of the elements out of all cards. */
+            const largestHeight = elementSizes[selector].reduce((siblingA, siblingB) => (siblingA.height >= siblingB.height ? siblingA : siblingB), { element, height: elementHeight });
+            this.resizeObserver.unobserve(element);
+            if (largestHeight.element === element) {
+                /** If the current element is the largest, remove the extra padding. */
+                element.style.paddingBottom = null;
+            }
+            else {
+                /** Get the current padding from the largest sibling, as they will not have the manually added padding. */
+                const paddingBottom = getConvertedPixels(getComputedStyle(largestHeight.element).paddingBottom);
+                element.style.paddingBottom = `${largestHeight.height - elementHeight + paddingBottom}px`;
+            }
+            this.resizeObserver.observe(element);
+        }
+    };
+    /** Gets the height sum of all direct child elements.
+     * @param element The parent element.
+     * @returns a pixel value of the child element height sum.
+     */
+    getElementInnerHeight = (element) => {
+        return Array.from(element.children)
+            .map((child) => child.getBoundingClientRect().height)
+            .reduce((a, b) => a + b, 0);
+    };
+    /** Attaches the `resizeObserver` to all elements containing a class selector containing `js-resize` */
+    observeResize = () => {
+        for (const element of Array.from(this.host.shadowRoot.querySelectorAll("[class*='js-resize']"))) {
+            this.resizeObserver.observe(element);
+        }
+    };
+    /**
+     * Set the current card type based on window width, essentially simulating media query behavior.
+     */
+    setCardType = () => {
+        const windowWidth = window.innerWidth;
+        if (this.currentCardType === 'wide60-40' && windowWidth <= this.minWideWidth) {
+            this.currentCardType = 'regular';
+        }
+        else if (this.currentCardType === 'regular' && windowWidth > this.minWideWidth) {
+            this.currentCardType = 'wide60-40';
+        }
+    };
     getTheme() {
         if (this.darkMode) {
             if (this.theme === 'classic' || this.theme === 'light' || this.theme === 'dark') {
@@ -578,7 +583,7 @@ const TetCompareCard = /*@__PURE__*/ proxyCustomElement(class TetCompareCard ext
             buttonContent = h("div", { class: "button", innerHTML: button });
         }
         else if (buttonArgs && buttonTitle) {
-            buttonContent = (h("div", { class: "button" }, h("tet-button", Object.assign({}, buttonArgs, { theme: this.darkMode || this.theme === 'dark' ? 'dark' : 'light', type: buttonType }), buttonTitle), buttonStyle && h("style", null, buttonStyle)));
+            buttonContent = (h("div", { class: "button" }, h("tet-button", { ...buttonArgs, theme: this.darkMode || this.theme === 'dark' ? 'dark' : 'light', type: buttonType }, buttonTitle), buttonStyle && h("style", null, buttonStyle)));
         }
         return (h("a", { target: target, href: link, "data-form-link": link, tabIndex: -1 }, buttonContent));
     }
@@ -607,7 +612,6 @@ const TetCompareCard = /*@__PURE__*/ proxyCustomElement(class TetCompareCard ext
      * @returns rendered card body.
      */
     renderCard() {
-        var _a, _b, _c, _d, _e, _f;
         return (h("div", { onClick: this.clickCallback, onKeyDown: () => { }, class: {
                 'card': true,
                 [`${this.currentCardType}`]: true,
@@ -632,7 +636,7 @@ const TetCompareCard = /*@__PURE__*/ proxyCustomElement(class TetCompareCard ext
                 'no-divider': this.priceShownVertically
             }, part: "compare-card-title-wrapper" }, h("div", { class: {
                 'title-wrapper-inner': true
-            } }, this.options.heroTitle ? h("h3", { class: "hero-title" }, this.options.heroTitle) : '', this.options.mainTitle ? h("h3", { class: "main-title" }, this.options.mainTitle) : '', this.showSubTitle && this.options.subTitle ? (h("div", { class: "sub-title" }, this.options.subTitle, this.renderTooltip('infoItem'))) : (''), this.options.infoTitle ? h("div", { class: "info-title" }, this.options.infoTitle) : ''))) : (''), h("div", { class: "content-wrapper js-resize-content" }, h("div", { class: "custom-content-wrapper" }, h("slot", { name: "custom-slot" })), this.showBulletPoints && !this.options.bulletPointPositionBottom ? (h("div", { class: "bullet-points-wrapper" }, (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.bulletPoints) === null || _b === void 0 ? void 0 : _b.map((bulletpoint) => (h("div", { class: "bullet-point" }, h("tet-icon", { class: "icon", name: "check-circle" }), h("div", { innerHTML: bulletpoint })))))) : (''), h("div", { class: "upsell-block" }, h("slot", { name: "upsell-block-slot" }))), this.options.netflixProductDescription ? (h("div", { class: "netflix-product-description" }, this.options.netflixProductDescription)) : (''), h("div", { class: "divided-information-wrapper js-resize-divide-slot" }, h("slot", { name: "divided-information-slot" }))), h("div", { class: "compare-card-half-40" }, h("div", { class: "price js-resize-price" }, this.options.price && !isNaN(parseFloat(this.options.price)) ? (h("div", { class: {
+            } }, this.options.heroTitle ? h("h3", { class: "hero-title" }, this.options.heroTitle) : '', this.options.mainTitle ? h("h3", { class: "main-title" }, this.options.mainTitle) : '', this.showSubTitle && this.options.subTitle ? (h("div", { class: "sub-title" }, this.options.subTitle, this.renderTooltip('infoItem'))) : (''), this.options.infoTitle ? h("div", { class: "info-title" }, this.options.infoTitle) : ''))) : (''), h("div", { class: "content-wrapper js-resize-content" }, h("div", { class: "custom-content-wrapper" }, h("slot", { name: "custom-slot" })), this.showBulletPoints && !this.options.bulletPointPositionBottom ? (h("div", { class: "bullet-points-wrapper" }, this.options?.bulletPoints?.map((bulletpoint) => (h("div", { class: "bullet-point" }, h("tet-icon", { class: "icon", name: "check-circle" }), h("div", { innerHTML: bulletpoint })))))) : (''), h("div", { class: "upsell-block" }, h("slot", { name: "upsell-block-slot" }))), this.options.netflixProductDescription ? (h("div", { class: "netflix-product-description" }, this.options.netflixProductDescription)) : (''), h("div", { class: "divided-information-wrapper js-resize-divide-slot" }, h("slot", { name: "divided-information-slot" }))), h("div", { class: "compare-card-half-40" }, h("div", { class: "price js-resize-price" }, this.options.price && !isNaN(parseFloat(this.options.price)) ? (h("div", { class: {
                 'price-wrapper': true,
                 'price-wrap': this.options.priceWrap,
                 'price-flex-column': this.priceShownVertically
@@ -640,21 +644,19 @@ const TetCompareCard = /*@__PURE__*/ proxyCustomElement(class TetCompareCard ext
                 'secondary-link': true,
                 'tet-link': true,
                 [`${this.secondaryLinkPosition}`]: true
-            } }, this.options.secondaryLinkOpenBlank ? (h("a", { target: "_blank", href: this.options.secondaryLink }, this.options.secondaryLinkText)) : (h("a", { href: this.options.secondaryLink }, this.options.secondaryLinkText))))), this.showBulletPoints && this.options.bulletPointPositionBottom ? (h("div", { class: "bullet-points-wrapper bottom" }, (_d = (_c = this.options) === null || _c === void 0 ? void 0 : _c.bulletPoints) === null || _d === void 0 ? void 0 : _d.map((bulletpoint) => (h("div", { class: "bullet-point" }, h("tet-icon", { class: "icon", name: "check-circle" }), h("div", { innerHTML: bulletpoint })))))) : ('')), this.cardScript ? h("link", { href: this.cardScript, rel: "stylesheet", type: "text/css" }) : '', h("div", { class: "data-hidden" }, h("div", { "data-attribute": "hero-title" }, this.options.heroTitle ? this.options.heroTitle : ''), h("div", { "data-attribute": "main-title" }, this.options.mainTitle ? this.options.mainTitle : ''), h("div", { "data-attribute": "sub-title" }, this.options.subTitle ? this.options.subTitle : ''), h("div", { "data-attribute": "price" }, this.options.price ? this.formatPrice(this.options.price) : ''), h("div", { "data-attribute": "old-price" }, this.options.oldPrice ? this.formatPrice(this.options.oldPrice) : ''), h("div", { "data-attribute": "term" }, this.options.term ? this.options.term : ''), h("div", { "data-attribute": "term-text" }, this.options.termText ? this.options.termText : ''), h("div", { "data-attribute": "helper" }, this.options.helper ? this.options.helper : ''), h("div", { "data-attribute": "description" }, h("slot", { name: "description-slot" })), h("div", { "data-attribute": "custom-slot" }, h("slot", { name: "custom-slot" })), this.showBulletPoints ? (h("div", { "data-attribute": "bullet-points" }, (_f = (_e = this.options) === null || _e === void 0 ? void 0 : _e.bulletPoints) === null || _f === void 0 ? void 0 : _f.map((bulletpoint) => (h("div", null, bulletpoint))))) : (''), h("div", { "data-attribute": "divided-information" }, h("slot", { name: "divided-information-slot" })), this.options.pricePrefix ?
+            } }, this.options.secondaryLinkOpenBlank ? (h("a", { target: "_blank", href: this.options.secondaryLink }, this.options.secondaryLinkText)) : (h("a", { href: this.options.secondaryLink }, this.options.secondaryLinkText))))), this.showBulletPoints && this.options.bulletPointPositionBottom ? (h("div", { class: "bullet-points-wrapper bottom" }, this.options?.bulletPoints?.map((bulletpoint) => (h("div", { class: "bullet-point" }, h("tet-icon", { class: "icon", name: "check-circle" }), h("div", { innerHTML: bulletpoint })))))) : ('')), this.cardScript ? h("link", { href: this.cardScript, rel: "stylesheet", type: "text/css" }) : '', h("div", { class: "data-hidden" }, h("div", { "data-attribute": "hero-title" }, this.options.heroTitle ? this.options.heroTitle : ''), h("div", { "data-attribute": "main-title" }, this.options.mainTitle ? this.options.mainTitle : ''), h("div", { "data-attribute": "sub-title" }, this.options.subTitle ? this.options.subTitle : ''), h("div", { "data-attribute": "price" }, this.options.price ? this.formatPrice(this.options.price) : ''), h("div", { "data-attribute": "old-price" }, this.options.oldPrice ? this.formatPrice(this.options.oldPrice) : ''), h("div", { "data-attribute": "term" }, this.options.term ? this.options.term : ''), h("div", { "data-attribute": "term-text" }, this.options.termText ? this.options.termText : ''), h("div", { "data-attribute": "helper" }, this.options.helper ? this.options.helper : ''), h("div", { "data-attribute": "description" }, h("slot", { name: "description-slot" })), h("div", { "data-attribute": "custom-slot" }, h("slot", { name: "custom-slot" })), this.showBulletPoints ? (h("div", { "data-attribute": "bullet-points" }, this.options?.bulletPoints?.map((bulletpoint) => (h("div", null, bulletpoint))))) : (''), h("div", { "data-attribute": "divided-information" }, h("slot", { name: "divided-information-slot" })), this.options.pricePrefix ?
             h("div", { "data-attribute": "price-prefix" }, this.options.pricePrefix)
             : '', this.options.priceInfo ?
             h("div", { "data-attribute": "price-info" }, this.options.priceInfo)
             : '')));
     }
     render() {
-        var _a;
         const card = this.renderCard();
         if (this.thumbnail) {
-            return (h("div", { class: "card-wrapper js-card-wrapper" }, h("img", { src: this.thumbnail, class: "card-thumbnail", alt: (_a = this.thumbnailAlt) !== null && _a !== void 0 ? _a : '' }), card));
+            return (h("div", { class: "card-wrapper js-card-wrapper" }, h("img", { src: this.thumbnail, class: "card-thumbnail", alt: this.thumbnailAlt ?? '' }), card));
         }
         return card;
     }
-    get host() { return this; }
     static get style() { return TetCompareCardStyle0; }
 }, [1, "tet-compare-card", {
         "clickCallback": [16],

package/dist/components/{p-b0d6ed2e.js → p-9ee3e98b.js}

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, g as getAssetPath, h } from './p-37ed3ebb.js';
-import { g as getRenderingRef, f as forceUpdate } from './p-a0d406ca.js';
+import { p as proxyCustomElement, H, g as getAssetPath, h } from './p-c9d79ad4.js';
+import { g as getRenderingRef, f as forceUpdate } from './p-549fe76f.js';
 
 const appendToMap = (map, propName, value) => {
     const items = map.get(propName);
@@ -218,24 +218,6 @@ const TetIcon = /*@__PURE__*/ proxyCustomElement(class TetIcon extends H {
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.getIconMap = () => {
-            if (!iconStore.iconMap) {
-                const iconMapUrl = getAssetPath('assets/icons/icon-map.json');
-                const parseResponse = (response) => response.json();
-                iconStore.iconMap = fetch(iconMapUrl).then(parseResponse);
-            }
-            return iconStore.iconMap;
-        };
-        this.getIcon = async (name) => {
-            const iconMap = await this.getIconMap();
-            if (!iconStore.icons[name] && iconMap[name]) {
-                const iconUrl = getAssetPath(iconMap[name]);
-                const parseResponse = (response) => response.status === 404 ? null : response.text();
-                iconStore.icons[name] = fetch(iconUrl).then(parseResponse);
-            }
-            return iconStore.icons[name];
-        };
-        this.shouldUseDefaultColor = () => (this.useDefaultColor || defaultColorIcons.includes(this.name));
         this.name = 'info-circle';
         this.theme = 'classic';
         this.type = 'primary';
@@ -243,6 +225,7 @@ const TetIcon = /*@__PURE__*/ proxyCustomElement(class TetIcon extends H {
         this.accessibilityLabel = '';
         this.focusable = false;
     }
+    iconContainer;
     /** Watcher that detects the name prop change and initiates the icon change. */
     onNameChange() {
         this.setIcon(this.name);
@@ -260,15 +243,33 @@ const TetIcon = /*@__PURE__*/ proxyCustomElement(class TetIcon extends H {
             !!svgHtml && (this.iconContainer.innerHTML = svgHtml);
         });
     }
+    getIconMap = () => {
+        if (!iconStore.iconMap) {
+            const iconMapUrl = getAssetPath('assets/icons/icon-map.json');
+            const parseResponse = (response) => response.json();
+            iconStore.iconMap = fetch(iconMapUrl).then(parseResponse);
+        }
+        return iconStore.iconMap;
+    };
+    getIcon = async (name) => {
+        const iconMap = await this.getIconMap();
+        if (!iconStore.icons[name] && iconMap[name]) {
+            const iconUrl = getAssetPath(iconMap[name]);
+            const parseResponse = (response) => response.status === 404 ? null : response.text();
+            iconStore.icons[name] = fetch(iconUrl).then(parseResponse);
+        }
+        return iconStore.icons[name];
+    };
+    shouldUseDefaultColor = () => (this.useDefaultColor || defaultColorIcons.includes(this.name));
     render() {
-        return (h("span", { key: 'a1755c0393939da8ace88f20c15414eac2b67e6e', class: "icon-wrapper", tabindex: (this.focusable || this.accessibilityLabel) ? 0 : -1 }, h("span", Object.assign({ key: 'a81e4f3560576a3015634f17e964ea18aa9ae9e7', class: {
+        return (h("span", { key: 'a1755c0393939da8ace88f20c15414eac2b67e6e', class: "icon-wrapper", tabindex: (this.focusable || this.accessibilityLabel) ? 0 : -1 }, h("span", { key: 'a81e4f3560576a3015634f17e964ea18aa9ae9e7', class: {
                 'icon-container': true,
                 'default-color': this.shouldUseDefaultColor(),
                 [this.theme]: true,
                 [this.type]: true,
-            }, ref: (element) => (this.iconContainer = element) }, (this.accessibilityLabel
-            ? { "aria-label": this.accessibilityLabel, "role": "img" }
-            : { "role": "presentation" })))));
+            }, ref: (element) => (this.iconContainer = element), ...(this.accessibilityLabel
+                ? { "aria-label": this.accessibilityLabel, "role": "img" }
+                : { "role": "presentation" }) })));
     }
     static get assetsDirs() { return ["assets/icons"]; }
     static get watchers() { return {

package/dist/components/{p-6847eb2d.js → p-a09504f7.js}

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-37ed3ebb.js';
+import { p as proxyCustomElement, H, h, c as Host } from './p-c9d79ad4.js';
 
 const tetStepperCss = "@font-face{font-family:Avenir Next;src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix);src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix) format(\"eot\"),url(assets/fonts/3c3e10968ffc97c2a52c5830f9886d1f.woff2) format(\"woff2\"),url(assets/fonts/660fbf858d30d7685fa4b166080f5980.woff) format(\"woff\"),url(assets/fonts/2b7748589092fd1a10b806abdfb562ff.ttf) format(\"truetype\");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix);src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix) format(\"eot\"),url(assets/fonts/aad36ecead30948bb30fe0ef818b749c.woff2) format(\"woff2\"),url(assets/fonts/c437d7752feaf3f056bbf8613e898d3a.woff) format(\"woff\"),url(assets/fonts/b8df4d02ef5de13a813917a85bc4a9c4.ttf) format(\"truetype\");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix);src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix) format(\"eot\"),url(assets/fonts/4d52f8276a74ea8efbad833ed790367c.woff2) format(\"woff2\"),url(assets/fonts/a067695dd1b87e927f4056c040d84669.woff) format(\"woff\"),url(assets/fonts/510a664af9771b72d4ce5e637109ca3c.ttf) format(\"truetype\");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix);src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix) format(\"eot\"),url(assets/fonts/63f5acc71d9852468683a4bfe824a28f.woff2) format(\"woff2\"),url(assets/fonts/ed94c737da267752ce0abd79bb003ff6.woff) format(\"woff\"),url(assets/fonts/6302f55a6dc6b12365177dc89b7d63cf.ttf) format(\"truetype\");font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix);src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix) format(\"eot\"),url(assets/fonts/1fe7da97fe9dbe1349aca9b54b5fdf69.woff2) format(\"woff2\"),url(assets/fonts/dacc6a84278e221422902af99579ada5.woff) format(\"woff\"),url(assets/fonts/e530c573663a3a07243d303fbf7db508.ttf) format(\"truetype\");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix);src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix) format(\"eot\"),url(assets/fonts/93ec0034623fc696601ab99aba652d4c.woff2) format(\"woff2\"),url(assets/fonts/d73c8eb1c13abe1237366aa3ee829a59.woff) format(\"woff\"),url(assets/fonts/7b6dcef99f3f4b23346e23925ec8678f.ttf) format(\"truetype\");font-weight:600;font-style:italic;font-display:swap}.tet-icon{font-family:Tet Icons;font-weight:400;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}@font-face{font-family:Tet Icons;src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot);src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot?#iefix) format(\"embedded-opentype\"),url(assets/fonts/25f10ef322a1220b2e9e11db38b73892.woff2) format(\"woff2\"),url(assets/fonts/fed75ac1edcf1c25cdd8612d2c365f9a.woff) format(\"woff\"),url(assets/fonts/df7fbe67cabb13cb837172a73c46378a.ttf) format(\"truetype\"),url(assets/fonts/5486d8c87e2abc6c13ed952a6cc96658.svg#tet-icons) format(\"svg\");font-weight:400;font-style:normal}.tet-icon:before{content:\"\\E84E\"}.tet-icon--sm{font-size:1.125rem}.tet-icon--md{font-size:1.5rem}.tet-icon--lg{font-size:2.25rem}.tet-icon--xl{font-size:3rem}.tet-icon--xxl{font-size:4rem}.tet-icon--0{font-size:0}.tet-icon--1{font-size:.0625rem}.tet-icon--2{font-size:.125rem}.tet-icon--3{font-size:.1875rem}.tet-icon--4{font-size:.25rem}.tet-icon--5{font-size:.3125rem}.tet-icon--6{font-size:.375rem}.tet-icon--7{font-size:.4375rem}.tet-icon--8{font-size:.5rem}.tet-icon--9{font-size:.5625rem}.tet-icon--10{font-size:.625rem}.tet-icon--11{font-size:.6875rem}.tet-icon--12{font-size:.75rem}.tet-icon--13{font-size:.8125rem}.tet-icon--14{font-size:.875rem}.tet-icon--15{font-size:.9375rem}.tet-icon--16{font-size:1rem}.tet-icon--17{font-size:1.0625rem}.tet-icon--18{font-size:1.125rem}.tet-icon--19{font-size:1.1875rem}.tet-icon--20{font-size:1.25rem}.tet-icon--21{font-size:1.3125rem}.tet-icon--22{font-size:1.375rem}.tet-icon--23{font-size:1.4375rem}.tet-icon--24{font-size:1.5rem}.tet-icon--25{font-size:1.5625rem}.tet-icon--26{font-size:1.625rem}.tet-icon--27{font-size:1.6875rem}.tet-icon--28{font-size:1.75rem}.tet-icon--29{font-size:1.8125rem}.tet-icon--30{font-size:1.875rem}.tet-icon--31{font-size:1.9375rem}.tet-icon--32{font-size:2rem}.tet-icon--33{font-size:2.0625rem}.tet-icon--34{font-size:2.125rem}.tet-icon--35{font-size:2.1875rem}.tet-icon--36{font-size:2.25rem}.tet-icon--37{font-size:2.3125rem}.tet-icon--38{font-size:2.375rem}.tet-icon--39{font-size:2.4375rem}.tet-icon--40{font-size:2.5rem}.tet-icon--41{font-size:2.5625rem}.tet-icon--42{font-size:2.625rem}.tet-icon--43{font-size:2.6875rem}.tet-icon--44{font-size:2.75rem}.tet-icon--45{font-size:2.8125rem}.tet-icon--46{font-size:2.875rem}.tet-icon--47{font-size:2.9375rem}.tet-icon--48{font-size:3rem}.tet-icon--49{font-size:3.0625rem}.tet-icon--50{font-size:3.125rem}.tet-icon--51{font-size:3.1875rem}.tet-icon--52{font-size:3.25rem}.tet-icon--53{font-size:3.3125rem}.tet-icon--54{font-size:3.375rem}.tet-icon--55{font-size:3.4375rem}.tet-icon--56{font-size:3.5rem}.tet-icon--57{font-size:3.5625rem}.tet-icon--58{font-size:3.625rem}.tet-icon--59{font-size:3.6875rem}.tet-icon--60{font-size:3.75rem}.tet-icon--61{font-size:3.8125rem}.tet-icon--62{font-size:3.875rem}.tet-icon--63{font-size:3.9375rem}.tet-icon--64{font-size:4rem}.tet-icon--65{font-size:4.0625rem}.tet-icon--66{font-size:4.125rem}.tet-icon--67{font-size:4.1875rem}.tet-icon--68{font-size:4.25rem}.tet-icon--69{font-size:4.3125rem}.tet-icon--70{font-size:4.375rem}.tet-icon--71{font-size:4.4375rem}.tet-icon--72{font-size:4.5rem}.tet-icon--73{font-size:4.5625rem}.tet-icon--74{font-size:4.625rem}.tet-icon--75{font-size:4.6875rem}.tet-icon--76{font-size:4.75rem}.tet-icon--77{font-size:4.8125rem}.tet-icon--78{font-size:4.875rem}.tet-icon--79{font-size:4.9375rem}.tet-icon--80{font-size:5rem}.tet-icon--81{font-size:5.0625rem}.tet-icon--82{font-size:5.125rem}.tet-icon--83{font-size:5.1875rem}.tet-icon--84{font-size:5.25rem}.tet-icon--85{font-size:5.3125rem}.tet-icon--86{font-size:5.375rem}.tet-icon--87{font-size:5.4375rem}.tet-icon--88{font-size:5.5rem}.tet-icon--89{font-size:5.5625rem}.tet-icon--90{font-size:5.625rem}.tet-icon--91{font-size:5.6875rem}.tet-icon--92{font-size:5.75rem}.tet-icon--93{font-size:5.8125rem}.tet-icon--94{font-size:5.875rem}.tet-icon--95{font-size:5.9375rem}.tet-icon--96{font-size:6rem}.tet-icon--97{font-size:6.0625rem}.tet-icon--98{font-size:6.125rem}.tet-icon--99{font-size:6.1875rem}.tet-icon--100{font-size:6.25rem}.tet-icon--101{font-size:6.3125rem}.tet-icon__add:before{content:\"\\E800\"}.tet-icon__alert-circled:before{content:\"\\E801\"}.tet-icon__alert:before{content:\"\\E802\"}.tet-icon__bank:before{content:\"\\E803\"}.tet-icon__box:before{content:\"\\E804\"}.tet-icon__download:before{content:\"\\E805\"}.tet-icon__burger:before{content:\"\\E806\"}.tet-icon__cancel:before{content:\"\\E807\"}.tet-icon__printer:before{content:\"\\E808\"}.tet-icon__cart-add:before{content:\"\\E809\"}.tet-icon__cart-remove:before{content:\"\\E80A\"}.tet-icon__cart:before{content:\"\\E80B\"}.tet-icon__chat:before{content:\"\\E80C\"}.tet-icon__arrow-up:before{content:\"\\E80D\"}.tet-icon__calendar:before{content:\"\\E80E\"}.tet-icon__help-circled:before{content:\"\\E80F\"}.tet-icon__edit:before{content:\"\\E810\"}.tet-icon__external-link:before{content:\"\\E811\"}.tet-icon__gift:before{content:\"\\E812\"}.tet-icon__person:before{content:\"\\E813\"}.tet-icon__heart:before{content:\"\\E814\"}.tet-icon__language:before{content:\"\\E815\"}.tet-icon__help:before{content:\"\\E816\"}.tet-icon__home-1:before{content:\"\\E817\"}.tet-icon__location:before{content:\"\\E818\"}.tet-icon__home-3:before{content:\"\\E819\"}.tet-icon__chart-even:before{content:\"\\E81A\"}.tet-icon__info-2:before{content:\"\\E81B\"}.tet-icon__key:before{content:\"\\E81C\"}.tet-icon__info:before{content:\"\\E81D\"}.tet-icon__lock-opened:before{content:\"\\E81E\"}.tet-icon__lock-outlined:before{content:\"\\E81F\"}.tet-icon__lock:before{content:\"\\E820\"}.tet-icon__laptop-filled:before{content:\"\\E821\"}.tet-icon__mail:before{content:\"\\E822\"}.tet-icon__options:before{content:\"\\E823\"}.tet-icon__chart-uneven:before{content:\"\\E824\"}.tet-icon__mail-2:before{content:\"\\E825\"}.tet-icon__remove:before{content:\"\\E826\"}.tet-icon__mobile-filled:before{content:\"\\E827\"}.tet-icon__ilu-calendar-check:before{content:\"\\E828\"}.tet-icon__settings-outlined:before{content:\"\\E829\"}.tet-icon__tablet:before{content:\"\\E82A\"}.tet-icon__thumb-up:before{content:\"\\E82B\"}.tet-icon__ilu-purchase:before{content:\"\\E82C\"}.tet-icon__chart-even-outlined:before{content:\"\\E82D\"}.tet-icon__movie:before{content:\"\\E82E\"}.tet-icon__percent:before{content:\"\\E82F\"}.tet-icon__ilu-change-whenever:before{content:\"\\E830\"}.tet-icon__truck:before{content:\"\\E831\"}.tet-icon__zero:before{content:\"\\E832\"}.tet-icon__attach:before{content:\"\\E833\"}.tet-icon__cloud-done:before{content:\"\\E834\"}.tet-icon__cloud-download:before{content:\"\\E835\"}.tet-icon__cloud-upload:before{content:\"\\E836\"}.tet-icon__cloud:before{content:\"\\E837\"}.tet-icon__folder:before{content:\"\\E838\"}.tet-icon__remote:before{content:\"\\E839\"}.tet-icon__router:before{content:\"\\E83A\"}.tet-icon__shield-filled:before{content:\"\\E83B\"}.tet-icon__shield:before{content:\"\\E83C\"}.tet-icon__ilu-devices:before{content:\"\\E83D\"}.tet-icon__ilu-get-points:before{content:\"\\E83E\"}.tet-icon__tv:before{content:\"\\E83F\"}.tet-icon__ilu-internet:before{content:\"\\E840\"}.tet-icon__wifi-outlined:before{content:\"\\E841\"}.tet-icon__wifi:before{content:\"\\E842\"}.tet-icon__description-outlined:before{content:\"\\E843\"}.tet-icon__laptop:before{content:\"\\E844\"}.tet-icon__chart-uneven-outlined:before{content:\"\\E845\"}.tet-icon__meter:before{content:\"\\E846\"}.tet-icon__mobile:before{content:\"\\E847\"}.tet-icon__phone:before{content:\"\\E848\"}.tet-icon__plug-filled:before{content:\"\\E849\"}.tet-icon__plug:before{content:\"\\E84A\"}.tet-icon__print:before{content:\"\\E84B\"}.tet-icon__camera:before{content:\"\\E84C\"}.tet-icon__clock:before{content:\"\\E84D\"}.tet-icon__placeholder:before{content:\"\\E84E\"}.tet-icon__tv-filled:before{content:\"\\E84F\"}.tet-icon__arrow-down:before{content:\"\\E850\"}.tet-icon__arrow-left:before{content:\"\\E851\"}.tet-icon__arrow-right:before{content:\"\\E852\"}.tet-icon__description:before{content:\"\\E853\"}.tet-icon__login:before{content:\"\\E854\"}.tet-icon__check:before{content:\"\\E855\"}.tet-icon__chevron-down:before{content:\"\\E856\"}.tet-icon__chevron-left:before{content:\"\\E857\"}.tet-icon__chevron-right:before{content:\"\\E858\"}.tet-icon__chevron-up:before{content:\"\\E859\"}.tet-icon__close-circled:before{content:\"\\E85A\"}.tet-icon__close:before{content:\"\\E85B\"}.tet-icon__more-horizontal:before{content:\"\\E85C\"}.tet-icon__more-vertical:before{content:\"\\E85D\"}.tet-icon__refresh:before{content:\"\\E85E\"}.tet-icon__facebook:before{content:\"\\E85F\"}.tet-icon__instagram:before{content:\"\\E860\"}.tet-icon__linkedin:before{content:\"\\E861\"}.tet-icon__people:before{content:\"\\E862\"}.tet-icon__logout:before{content:\"\\E863\"}.tet-icon__share:before{content:\"\\E864\"}.tet-icon__twitter:before{content:\"\\E865\"}.tet-icon__cancel-filled:before{content:\"\\E866\"}.tet-icon__done:before{content:\"\\E867\"}.tet-icon__star-filled:before{content:\"\\E868\"}.tet-icon__star:before{content:\"\\E869\"}.tet-icon__clipboard:before{content:\"\\E86A\"}.tet-icon__ilu-calendar:before{content:\"\\E86B\"}.tet-icon__check-circled:before{content:\"\\E86C\"}.tet-icon__ilu-choose-channels:before{content:\"\\E86D\"}.tet-icon__search:before{content:\"\\E86E\"}.tet-icon__warning:before{content:\"\\E86F\"}.tet-icon__ilu-clock-1:before{content:\"\\E870\"}.tet-icon__ilu-fold:before{content:\"\\E871\"}.tet-icon__ilu-letter:before{content:\"\\E872\"}.tet-icon__ilu-pay:before{content:\"\\E873\"}.tet-icon__ilu-meter:before{content:\"\\E874\"}.tet-icon__ilu-sign:before{content:\"\\E875\"}.tet-icon__smart-watch-filled:before{content:\"\\E876\"}.tet-icon__washing-machine-filled:before{content:\"\\E877\"}.tet-icon__bullet:before{content:\"\\E878\"}.tet-icon__sound:before{content:\"\\E879\"}.tet-icon__dropdown:before{content:\"\\E87A\"}.tet-icon__mask-pass:before{content:\"\\E87B\"}.tet-icon__select:before{content:\"\\E87C\"}.tet-icon__text-area-sizing:before{content:\"\\E87D\"}.tet-icon__unmask-pass:before{content:\"\\E87E\"}.tet-icon__bullet-small:before{content:\"\\E882\"}.tet-icon__electric-bolt:before{content:\"\\E880\"}.tet-icon__sun:before{content:\"\\E881\"}:host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:\"\\e86e\"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:\"\\e85a\"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:\"\\e85b\"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:\"\\e86c\"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:\"\\e855\"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:\"\\e859\"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:\"\\e856\"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:\"\\e86a\"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:\"\\e81d\"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:\"\\e867\"}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{--step-active-line-color:rgb(0, 96, 245);--step-active-line-size:0.1875rem;--step-active-line-style:solid;--step-data-bg-color:rgb(255, 255, 255);--step-data-border-radius:0.375rem;--step-data-border-size:0.125rem;--step-data-text-color:var(--color-ta500);--step-data-strong-text-color:var(--color-ta500);--step-data-text-size:0.875rem;--step-description-text-color:var(--color-ta500);--step-description-strong-text-color:var(--color-ta500);--step-description-text-size:0.875rem;--step-horizontal-line-width:3.125rem;--step-icon-size:1.25rem;--step-line-margin-x:1rem;--step-line-margin-y:1rem;--step-min-height:4.375rem;--step-non-active-line-color:var(--color-ta100);--step-non-active-line-size:0.1875rem;--step-non-active-line-style:dashed;--step-vertical-line-height:2rem;--step-width:10.625rem;display:flex;justify-content:center;align-items:center}.stepper{display:flex;padding:0;margin:0;font-family:var(--text-font)}@media screen and (max-width: 63.9375rem){.stepper{flex-direction:column;flex-wrap:wrap}}@media screen and (min-width: 64rem){.stepper{flex-direction:row;flex-wrap:nowrap;margin:calc(var(--step-min-height) / 2) 0 0}}.stepper-step{position:relative;display:flex;flex-direction:column}@media screen and (max-width: 35.9375rem){.stepper-step{max-width:12.4375rem}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-step{flex-direction:row}}@media screen and (min-width: 64rem){.stepper-step{width:var(--step-width)}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-step-content{min-width:12.75rem}}@media screen and (min-width: 64rem){.stepper-step-content{width:var(--step-width);height:var(--step-min-height)}}.stepper-step-content-icon{display:flex;justify-content:center;align-items:center}@media screen and (max-width: 35.9375rem){.stepper-step-content-icon{width:100%}}@media screen and (min-width: 36rem) and (max-width: 47.9375rem){.stepper-step-content-icon{width:12.75rem}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-step-content-icon{min-height:var(--step-min-height)}}@media screen and (min-width: 48rem) and (max-width: 63.9375rem){.stepper-step-content-icon{min-width:var(--step-width)}}@media screen and (min-width: 64rem){.stepper-step-content-icon{min-height:var(--step-min-height);transform:translateY(-35%)}}.stepper-step-content-icon .icon{font-size:var(--step-icon-size)}.stepper-step-content-icon .icon.tet-check-circled{color:var(--step-active-line-color)}.stepper-step-content-icon .icon.tet-close-circled{color:var(--step-non-active-line-color)}.stepper-step-content-data{display:flex;flex-shrink:0;justify-content:center;align-items:center;min-height:var(--step-min-height);padding:0.375rem;background:var(--step-data-bg-color);border:var(--step-data-border-size) solid var(--step-active-line-color);border-radius:var(--step-data-border-radius);color:var(--step-data-text-color);text-align:center;font-size:var(--step-data-text-size);line-height:1.25rem;letter-spacing:0.0125rem}@media screen and (max-width: 35.9375rem){.stepper-step-content-data{width:100%}}@media screen and (min-width: 36rem) and (max-width: 47.9375rem){.stepper-step-content-data{width:12.75rem}}@media screen and (min-width: 48rem) and (max-width: 63.9375rem){.stepper-step-content-data{min-width:var(--step-width)}}@media screen and (min-width: 64rem){.stepper-step-content-data{transform:translateY(-35%)}}.stepper-step-content-data strong{color:var(--step-data-strong-text-color)}.stepper-step-description{color:var(--step-description-text-color);text-align:center;font-size:var(--step-description-text-size);line-height:1.25rem;letter-spacing:0.0125rem}@media screen and (max-width: 35.9375rem){.stepper-step-description{margin-top:0.5rem}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-step-description{display:flex;flex:100%;justify-content:flex-start;align-items:center;max-width:calc(var(--step-width) * 1.45);margin-left:1rem;text-align:left}}.stepper-step-description strong{color:var(--step-description-strong-text-color)}@media screen and (min-width: 36rem) and (max-width: 47.9375rem){.stepper-line.post-icon.pre-data+.stepper-step.data{margin-top:calc(var(--step-line-margin-y) / 2)}}.stepper-line{display:block;border-color:var(--step-non-active-line-color);border-style:var(--step-non-active-line-style);border-width:0}@media screen and (max-width: 35.9375rem){.stepper-line{min-height:var(--step-vertical-line-height);margin-left:calc(50% - var(--step-non-active-line-size) / 2);border-left-width:var(--step-non-active-line-size)}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-line{min-height:calc(var(--step-vertical-line-height));margin-left:calc(6.375rem - var(--step-non-active-line-size) / 2);border-left-width:var(--step-non-active-line-size)}}@media screen and (min-width: 64rem){.stepper-line{margin-top:calc(var(--step-icon-size) / 2 - var(--step-active-line-size) / 2);border-top-width:var(--step-non-active-line-size)}}.stepper-line.active{border-color:var(--step-active-line-color);border-style:var(--step-active-line-style)}@media screen and (max-width: 63.9375rem){.stepper-line.active{border-left-width:var(--step-active-line-size)}}@media screen and (min-width: 64rem){.stepper-line.active{border-top-width:var(--step-active-line-size)}}@media screen and (max-width: 35.9375rem){.stepper-line.post-icon{margin-top:calc(var(--step-line-margin-y) / 2)}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-line.post-icon{margin-top:calc(var(--step-line-margin-y) * -0.7)}}@media screen and (min-width: 64rem){.stepper-line.post-icon{margin-left:calc((var(--step-width) / 2 - var(--step-icon-size) / 2 - var(--step-line-margin-x)) * -1)}}@media screen and (max-width: 35.9375rem){.stepper-line.post-data{margin-top:calc(var(--step-line-margin-y) / 2)}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-line.post-data{margin-top:var(--step-line-margin-y)}}@media screen and (min-width: 64rem){.stepper-line.post-data{min-width:calc(var(--step-horizontal-line-width) * 2);margin-left:var(--step-line-margin-x)}}@media screen and (max-width: 35.9375rem){.stepper-line.pre-icon{margin-bottom:calc(var(--step-line-margin-y) / 2)}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-line.pre-icon{margin-bottom:calc(var(--step-line-margin-y) * -0.7)}}@media screen and (min-width: 64rem){.stepper-line.pre-icon{margin-right:calc((var(--step-width) / 2 - var(--step-icon-size) / 2 - var(--step-line-margin-x)) * -1)}}@media screen and (max-width: 35.9375rem){.stepper-line.pre-data{margin-bottom:calc(var(--step-line-margin-y) / 2)}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-line.pre-data{margin-bottom:var(--step-line-margin-y)}}@media screen and (min-width: 64rem){.stepper-line.pre-data{margin-right:var(--step-line-margin-x)}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-line.post-icon.pre-icon{min-height:calc(var(--step-vertical-line-height))}}@media screen and (min-width: 64rem){.stepper-line.post-icon.pre-icon{min-width:calc(var(--step-horizontal-line-width) * 2)}}@media screen and (min-width: 36rem) and (max-width: 47.9375rem){.stepper-line.post-icon.pre-data{margin-bottom:calc(var(--step-line-margin-y) / 2)}}@media screen and (min-width: 36rem) and (max-width: 63.9375rem){.stepper-line.post-icon.pre-data{min-height:calc(var(--step-vertical-line-height))}}@media screen and (min-width: 64rem){.stepper-line.post-icon.pre-data{min-width:calc(var(--step-horizontal-line-width) * 2)}}";
 const TetStepperStyle0 = tetStepperCss;
@@ -8,71 +8,70 @@ const TetStepper = /*@__PURE__*/ proxyCustomElement(class TetStepper extends H {
         super();
         this.__registerHost();
         this.__attachShadow();
-        /**
-         * Renders a single stepper step.
-         *
-         * @param step
-         * @param index
-         */
-        this.renderStep = (step, index) => {
-            return [
-                this.renderStepData(step),
-                this.renderStepLine(step, index)
-            ];
+        this.stepperData = [];
+    }
+    /**
+     * Renders a single stepper step.
+     *
+     * @param step
+     * @param index
+     */
+    renderStep = (step, index) => {
+        return [
+            this.renderStepData(step),
+            this.renderStepLine(step, index)
+        ];
+    };
+    /**
+     * Renders step data.
+     *
+     * @param step
+     */
+    renderStepData = (step) => {
+        let content;
+        const descriptionBlockClasses = {
+            'stepper-step-description': true,
         };
-        /**
-         * Renders step data.
-         *
-         * @param step
-         */
-        this.renderStepData = (step) => {
-            let content;
-            const descriptionBlockClasses = {
-                'stepper-step-description': true,
-            };
-            const descriptionBlock = h("div", { class: descriptionBlockClasses }, h("div", { innerHTML: step === null || step === void 0 ? void 0 : step.description }));
-            switch (step === null || step === void 0 ? void 0 : step.type) {
-                case 'icon':
-                    const iconClasses = {
-                        'icon': true,
-                        [`tet-${step === null || step === void 0 ? void 0 : step.icon}-circled`]: true,
-                    };
-                    content = h("div", { class: "stepper-step-content-icon" }, h("em", { class: iconClasses }));
-                    break;
-                case 'data':
-                    const dataClasses = {
-                        'stepper-step-content-data': true,
-                    };
-                    content = h("div", { class: dataClasses }, h("div", { innerHTML: step === null || step === void 0 ? void 0 : step.data }));
-                    break;
-            }
-            const liClasses = {
-                'stepper-step': true,
-                'data': (step === null || step === void 0 ? void 0 : step.type) === 'data',
-                'icon': (step === null || step === void 0 ? void 0 : step.type) === 'icon',
-            };
-            return h("li", { class: liClasses }, h("div", { class: "stepper-step-content" }, content), step.description ? descriptionBlock : null);
+        const descriptionBlock = h("div", { class: descriptionBlockClasses }, h("div", { innerHTML: step?.description }));
+        switch (step?.type) {
+            case 'icon':
+                const iconClasses = {
+                    'icon': true,
+                    [`tet-${step?.icon}-circled`]: true,
+                };
+                content = h("div", { class: "stepper-step-content-icon" }, h("em", { class: iconClasses }));
+                break;
+            case 'data':
+                const dataClasses = {
+                    'stepper-step-content-data': true,
+                };
+                content = h("div", { class: dataClasses }, h("div", { innerHTML: step?.data }));
+                break;
+        }
+        const liClasses = {
+            'stepper-step': true,
+            'data': step?.type === 'data',
+            'icon': step?.type === 'icon',
         };
-        /**
-         * Renders a line between steps.
-         *
-         * @param step
-         * @param index
-         */
-        this.renderStepLine = (step, index) => {
-            var _a, _b;
-            const lineClasses = {
-                'stepper-line': true,
-                'active': step.active,
-                'post-icon': step.type === 'icon',
-                'post-data': step.type === 'data',
-                'pre-icon': ((_a = this.stepperData[index + 1]) === null || _a === void 0 ? void 0 : _a.type) === 'icon',
-                'pre-data': ((_b = this.stepperData[index + 1]) === null || _b === void 0 ? void 0 : _b.type) === 'data',
-            };
-            return this.stepperData.length - 1 > index ? h("li", { class: lineClasses }) : null;
+        return h("li", { class: liClasses }, h("div", { class: "stepper-step-content" }, content), step.description ? descriptionBlock : null);
+    };
+    /**
+     * Renders a line between steps.
+     *
+     * @param step
+     * @param index
+     */
+    renderStepLine = (step, index) => {
+        const lineClasses = {
+            'stepper-line': true,
+            'active': step.active,
+            'post-icon': step.type === 'icon',
+            'post-data': step.type === 'data',
+            'pre-icon': this.stepperData[index + 1]?.type === 'icon',
+            'pre-data': this.stepperData[index + 1]?.type === 'data',
         };
-        this.stepperData = [];
-    }
+        return this.stepperData.length - 1 > index ? h("li", { class: lineClasses }) : null;
+    };
     render() {
         return (h(Host, { key: 'ce4bfa7c45846d165e0a5c45f32122bb58a2db71' }, h("ol", { key: '64e1a8c9af5091f9f73359be37765cdf5dd33e27', class: "stepper" }, this.stepperData.map(this.renderStep))));
     }