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

package/dist/components/p-ea401595.js

@@ -0,0 +1,169 @@
+import { c as createStore } from './p-a9b1c410.js';
+
+class AddressOffersFilters {
+    onFilterSelect;
+    availableFilters = [];
+    allFilters = [
+        {
+            id: 'all',
+            titleTranslationKey: 'components-address-offers-tag-all',
+            active: true
+        },
+        {
+            id: 'promotions',
+            titleTranslationKey: 'components-address-offers-tag-promotions',
+            active: false
+        },
+        {
+            id: 'internet',
+            titleTranslationKey: 'components-address-offers-tag-internet',
+            active: false
+        },
+        {
+            id: 'tet-bundles',
+            titleTranslationKey: 'components-address-offers-tag-bundle',
+            active: false
+        },
+        {
+            id: 'tv',
+            titleTranslationKey: 'components-address-offers-tag-tv',
+            active: false
+        }
+    ];
+    /**
+     * The IDs of the filters that can only be selected on their own, without any other filters being selected at the same time.
+     */
+    singleSelectionFilters = ['all', 'promotions'];
+    constructor(onFilterSelect) {
+        this.onFilterSelect = onFilterSelect;
+    }
+    initialize = (serviceAvailabilityData) => {
+        if (serviceAvailabilityData.structure) {
+            this.availableFilters = this.resolveFilters(serviceAvailabilityData);
+        }
+    };
+    getAvailableFilters = () => {
+        return this.availableFilters;
+    };
+    /**
+     * Returns the filters that should be currently displayed for the given categories and products.
+     *
+     * @param serviceAvailabilityData
+     */
+    resolveFilters = (serviceAvailabilityData) => {
+        const filtersCount = this.calculateFilterCounts(serviceAvailabilityData);
+        return (this.allFilters
+            // Show filters that have some products and filters without product as disabled.
+            .filter(({ id }) => filtersCount[id])
+            .map((filter) => ({
+            id: filter.id,
+            title: filter.titleTranslationKey,
+            count: filtersCount[filter.id],
+            active: filter.active,
+            showIcon: filter.id === 'all' ? false : filter.active,
+            clickAction: this.filterClickAction.bind(this, filter)
+        })));
+    };
+    /**
+     * Calculates the number (count) of offers for each filter.
+     *
+     * @param serviceAvailabilityData
+     */
+    calculateFilterCounts = ({ structure: structures }) => {
+        const filtersCount = {};
+        filtersCount['all'] = 0;
+        filtersCount['promotions'] = 0;
+        structures?.forEach((category) => {
+            category.subgroups.forEach(({ tag, products }) => {
+                if (!filtersCount[tag]) {
+                    filtersCount[tag] = 0;
+                }
+                // Filter out Netflix premium products
+                const filteredProducts = products.filter((product) => {
+                    const isNetflixPremiumProduct = product.attributes?.some((attr) => attr.key === 'isNetflixPremiumProduct' && attr.value === true);
+                    return !isNetflixPremiumProduct; // Exclude Netflix premium products
+                });
+                filtersCount[tag] += filteredProducts.length;
+                filtersCount['all'] += filteredProducts.length;
+                const promotionCodeCount = filteredProducts.reduce((sum, product) => {
+                    if (product.contractTerms?.some(({ promotionCode }) => promotionCode)) {
+                        return sum + 1;
+                    }
+                    return sum;
+                }, 0);
+                filtersCount['promotions'] += promotionCodeCount;
+            });
+        });
+        return filtersCount;
+    };
+    /**
+     * The click action for the filter.
+     *
+     * @param {TagInterface} filter
+     */
+    filterClickAction = (filter) => {
+        const availableFilter = this.availableFilters.find(({ id }) => id === filter.id);
+        if (availableFilter === undefined) {
+            return;
+        }
+        if (this.singleSelectionFilters.includes(availableFilter.id)) {
+            this.deSelectAllFilers(availableFilter);
+        }
+        else {
+            this.deSelectSingleSelectionFilters();
+        }
+        availableFilter.active = !availableFilter.active;
+        availableFilter.showIcon = availableFilter.id === 'all' ? false : !availableFilter.showIcon;
+        // If all filters become de-selected, then automatically select all offers filter.
+        if (!this.availableFilters.some(({ active }) => active)) {
+            const allSelectedFilters = this.availableFilters.find(({ id }) => id === 'all');
+            allSelectedFilters.active = true;
+        }
+        this.onFilterSelect(this.availableFilters);
+    };
+    // De-select all filters if all filter tab or not active single selection tab clicked.
+    deSelectAllFilers = (availableFilter) => {
+        const { id, active } = availableFilter;
+        if (id === 'all' || !active) {
+            this.availableFilters
+                .forEach((forEachFilter) => { forEachFilter.active = false; forEachFilter.showIcon = false; });
+        }
+    };
+    //De-select those filters that cannot be included in multiple filter selection.
+    deSelectSingleSelectionFilters = () => {
+        this.availableFilters
+            .filter(({ id }) => this.singleSelectionFilters.includes(id))
+            .forEach((forEachFilter) => { forEachFilter.active = false; forEachFilter.showIcon = false; });
+    };
+}
+
+const { state, onChange } = createStore({
+    catalog: {
+        addressKey: '',
+        structure: [],
+        productTags: [],
+        meta: []
+    },
+    availableFilters: [],
+    activeFilters: ['all'],
+});
+onChange('catalog', (serviceAvailabilityData) => {
+    const filters = new AddressOffersFilters((availableFilters) => {
+        state.availableFilters = [...availableFilters];
+        state.activeFilters = getActiveFiltersIds(availableFilters);
+    });
+    filters.initialize(serviceAvailabilityData);
+    state.availableFilters = filters.getAvailableFilters();
+    state.activeFilters = ['all'];
+});
+const getActiveFiltersIds = (filters) => filters.filter(({ active }) => active).map(({ id }) => id);
+function clearFilters() {
+    state.activeFilters = ['all'];
+    state.availableFilters = state.availableFilters.map((availableFilter) => {
+        availableFilter.active = availableFilter.id === 'all';
+        availableFilter.showIcon = false;
+        return availableFilter;
+    });
+}
+
+export { clearFilters as c, onChange as o, state as s };

package/dist/components/{p-03177920.js → p-ecf59431.js}

@@ -1,16 +1,16 @@
-import { p as proxyCustomElement, H, d as createEvent, h, f as forceUpdate, c as Host } from './p-37ed3ebb.js';
-import { t as translate, p as processTranslations } from './p-aca28e71.js';
-import { a as searchAddress, s as searchAddressByKey } from './p-a81e545d.js';
-import './p-6830b44d.js';
+import { p as proxyCustomElement, H, d as createEvent, f as forceUpdate, h, c as Host } from './p-88af3744.js';
+import { p as processTranslations, t as translate } from './p-2627300f.js';
+import { s as searchAddressByKey, a as searchAddress } from './p-581edb37.js';
+import './p-c1f5b99f.js';
 import { d as debounceAsync } from './p-64ec8edd.js';
 import { n as normalize } from './p-58434b0c.js';
 import { a as a11yBtnClick } from './p-713fff27.js';
-import { d as defineCustomElement$6 } from './p-881093d4.js';
-import { d as defineCustomElement$5 } from './p-68f0e894.js';
-import { d as defineCustomElement$4 } from './p-b0d6ed2e.js';
-import { d as defineCustomElement$3 } from './p-df1fe72c.js';
-import { d as defineCustomElement$2 } from './p-00e689fb.js';
-import { d as defineCustomElement$1 } from './p-045bec85.js';
+import { d as defineCustomElement$6 } from './p-9372e619.js';
+import { d as defineCustomElement$5 } from './p-7e8270ec.js';
+import { d as defineCustomElement$4 } from './p-a9b1c410.js';
+import { d as defineCustomElement$3 } from './p-2426d691.js';
+import { d as defineCustomElement$2 } from './p-ba709868.js';
+import { d as defineCustomElement$1 } from './p-03f68fa0.js';
 
 const tetAddressSearchCss = "@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{display:block;--manual-input-option-background-color:var(--tc-background-secondary);--hover-option-background-color:var(--tc-layer-primary);--input-field-icon-color:var(--tc-icon-secondary);--redesigned-address-search-padding-vertical:1rem;--redesigned-address-search-padding-horizontal:0.5rem;--redesigned-address-search-radius:1rem}:host(.address-search--redesigned){--address-search-width:100%;--address-search-height:2.75rem;width:var(--address-search-width);height:var(--address-search-height)}:host(.address-search--redesigned) ::part(autocomplete-options-container){display:none;border:none;position:unset;z-index:auto;box-shadow:none}:host(.address-search--redesigned) .address-search--redesigned__autocomplete{border:0.0625rem solid transparent}:host(.address-search--redesigned:not(.keyboard-focus)) ::part(autocomplete-options-container){display:block}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__autocomplete{position:absolute;top:calc(-1 * var(--redesigned-address-search-padding-vertical));left:calc(-1 * var(--redesigned-address-search-padding-horizontal));border:0.0625rem solid var(--tc-border-quaternary);background-color:var(--tc-layer-primary);border-radius:var(--redesigned-address-search-radius);padding:var(--redesigned-address-search-padding-vertical) var(--redesigned-address-search-padding-horizontal);width:calc(var(--address-search-width) + 2 * var(--redesigned-address-search-padding-horizontal))}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__autocomplete.dark{border-color:var(--tc-border-quaternary-dark);background-color:var(--tc-layer-primary-dark)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__close-button{display:block}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__input-wrapper{border-bottom:0.0625rem solid var(--tc-border-secondary)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__input:not(.dark){--input-text-color:var(--tc-button-text-black-permanent)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__input:not(.dark) .icon-left{--input-focus-icon-color:var(--tc-button-icon-black-permanent)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__input:not(.dark) .icon-right{--input-focus-icon-color:var(--tc-button-icon-black-permanent)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__button-wrapper:not(.dark) .submit-address::part(button){--button-background:var(--tc-button-icon-black-permanent);--button-text-color:var(--tc-text-primary-dark)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__button-wrapper:not(.dark) .submit-address::part(button):hover{--button-background:var(--tc-button-primary-background-hover)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__button-wrapper:not(.dark) .submit-address::part(button):active{--button-background:var(--tc-button-primary-background-pressed)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__button-wrapper:not(.dark) .button-icon{--button-icon-color:var(--tc-button-icon-white-permanent)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__button-wrapper.dark .submit-address::part(button){--button-background:var(--tc-button-icon-white-permanent);--button-text-color:var(--tc-text-primary)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__button-wrapper.dark .submit-address::part(button):hover{--button-background:var(--tc-button-primary-background-hover-dark)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__button-wrapper.dark .submit-address::part(button):active{--button-background:var(--tc-button-primary-background-pressed-dark)}:host(.address-search--redesigned:not(.keyboard-focus).active:focus-within) .address-search--redesigned__button-wrapper.dark .button-icon{--button-icon-color:var(--tc-button-icon-black-permanent)}:host(.dark){--manual-input-option-background-color:var(--tc-background-secondary-dark);--hover-option-background-color:var(--tc-layer-primary-dark);--input-field-icon-color:var(--tc-icon-secondary-dark)}::part(address-not-found){display:flex;flex-direction:column;gap:0.5em}::part(manual-input-option){position:sticky;bottom:0;background-color:var(--manual-input-option-background-color);margin:0.125rem 0 0 0;border-radius:0;z-index:3}::part(manual-input-option):hover{--option-hover-background-color:var(--hover-option-background-color)}.address-search__input{--input-icon-color:var(--input-field-icon-color)}.address-search__input .icon-left{--input-icon-left-position:0.875rem}.address-search__input--rounded{--input-border-radius:1.375rem;--input-hover-background-color:none}.address-search__input--rounded~.icon-left,.address-search__input--rounded~.icon-right{--icon-size:1.5rem;--input-icon-top-position:0.625rem}.address-search__input--forms{--input-border-radius:0.75rem;--input-padding:0.75rem}.address-search__spinner{position:absolute;right:1rem}.address-search--redesigned__autocomplete-content{position:relative;display:flex;gap:0.75rem}.address-search--redesigned__input-wrapper{width:100%;border-bottom:0.0625rem solid var(--tc-grey-70);margin:0 0 0 0.5rem;display:flex;align-items:center;gap:0.5rem}.address-search--redesigned__button-wrapper{display:flex;align-items:center;margin-left:0.5rem}.address-search--redesigned__button-wrapper .js-button-mobile{width:fit-content;display:block;--button-padding:0.5rem}@media (min-width: 46rem){.address-search--redesigned__button-wrapper .js-button-mobile{display:none}}.address-search--redesigned__button-wrapper .js-button{display:none;--button-padding:0.5rem 0.875rem}@media (min-width: 46rem){.address-search--redesigned__button-wrapper .js-button{display:block}}.address-search--redesigned__button-wrapper .button-icon{--button-icon-color:var(--tc-button-icon-white-permanent)}.address-search--redesigned__button-wrapper .submit-address::part(button){--button-background:var(--tc-grey-80);--button-border-color:transparent}.address-search--redesigned__button-wrapper .submit-address::part(button):hover{--button-background:var(--tc-button-primary-background-hover)}.address-search--redesigned__button-wrapper .submit-address::part(button):focus{--button-box-shadow:none}.address-search--redesigned__button-wrapper .submit-address::part(button):focus-visible{outline:0.125rem solid var(--tc-blue-40);outline-offset:0.125rem;transition:outline 0s}.address-search--redesigned__button-wrapper .submit-address::part(button):active{--button-background:var(--tc-button-primary-background-pressed)}.address-search--redesigned__button-wrapper .submit-address::part(button).dark:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline:0.125rem solid var(--tc-blue-40-dark);outline-offset:0.125rem;transition:outline 0s}.address-search--redesigned__input{width:100%;--input-height:var(--address-search-height);--input-text-color:var(--tc-button-text-white-permanent);--input-background-color:transparent;--input-border-radius:0;--input-border-color:transparent;--input-focus-border-color:transparent;--input-focus-outline-color:transparent;--input-focus-background-color:transparent}.address-search--redesigned__input .icon-left{--input-icon-left-position:0.25rem;--input-focus-icon-color:var(--tc-button-icon-white-permanent)}.address-search--redesigned__input .icon-right{--input-focus-icon-color:var(--tc-button-icon-white-permanent)}.address-search--redesigned__input-field{--input-border-radius:0.0125rem}.address-search--redesigned__close-button{display:none;position:absolute;right:0;top:calc(-0.5rem - var(--redesigned-address-search-padding-vertical));transform:translateY(-100%);--button-icon-color:var(--tc-button-icon-primary);--button-text-decoration:underline}.address-search--redesigned__close-button:hover{--button-icon-color:var(--color-grey-30)}.address-search--redesigned__close-button ::part(button){backdrop-filter:none;text-decoration:underline;--button-padding:0.5rem 0}";
 const TetAddressSearchStyle0 = tetAddressSearchCss;
@@ -24,156 +24,6 @@ const TetAddressSearch = /*@__PURE__*/ proxyCustomElement(class TetAddressSearch
         this.clearInputField = createEvent(this, "clearInputField", 7);
         this.manualAddressInput = createEvent(this, "manualAddressInput", 7);
         this.searchSubmitted = createEvent(this, "searchSubmitted", 7);
-        this.handleClick = () => {
-            this.elementActive = true;
-            this.focusVisible = false;
-        };
-        this.handleInputTyping = (event) => {
-            this.elementActive = true;
-            if (event === null || event === void 0 ? void 0 : event.data) {
-                this.focusVisible = false;
-            }
-        };
-        this.handleActiveStateChange = (event) => {
-            this.elementActive = event.detail !== null;
-        };
-        /**
-         * Toggles the icon on the right side of the input based on the current input value.
-         *
-         * @param event
-         */
-        this.toggleInputClearIcon = ({ target }) => {
-            const value = normalize(target.value);
-            this.inputValueLength = value.length;
-            if (this.newStyle && this.inputValueLength >= this.minSearchKeywordLength) {
-                this.addLoadIcon();
-                this.removeIconRight();
-                return;
-            }
-            if (value && !this.inputIconRight) {
-                this.addClearIcon();
-            }
-            if (!value && this.inputIconRight) {
-                this.removeIconRight();
-            }
-        };
-        /**
-         * Functionality that is executed when a manual address input trigger element is clicked upon or selected.
-         */
-        this.manualAddressInputAction = () => {
-            this.manualAddressInput.emit();
-            this.clearInputAction();
-        };
-        /**
-         * Filters autocomplete options by the given keyword.
-         *
-         * @param keyword
-         */
-        this.addressFilterFunction = async (keyword) => {
-            var _a;
-            if (keyword.length < this.minSearchKeywordLength) {
-                return Promise.resolve([]);
-            }
-            const addresses = (_a = (await searchAddress(keyword))) !== null && _a !== void 0 ? _a : [];
-            const addressOptions = addresses.map(({ fullAddress, addressKey, postalCode }) => {
-                return {
-                    label: fullAddress,
-                    value: { addressKey, postalCode },
-                };
-            });
-            if (this.manualAddressTriggers && addressOptions.length > 0) {
-                addressOptions.push({
-                    label: translate('components-address-search-manual-address-input'),
-                    value: 'manual-input',
-                    clickCallback: this.manualAddressInputAction,
-                    ignoreHighlighting: true,
-                    cssPart: `manual-input-option`
-                });
-            }
-            return addressOptions;
-        };
-        this.debounceAddressFilter = debounceAsync(this.addressFilterFunction, 300);
-        /**
-         * Removes the icon on the right side of the input.
-         */
-        this.removeIconRight = () => {
-            this.inputIconRight = '';
-        };
-        /**
-         * Executes input "clear" functionality.
-         */
-        this.clearInputAction = () => {
-            var _a;
-            (_a = this.autocomplete) === null || _a === void 0 ? void 0 : _a.clear();
-        };
-        /**
-         * Functionality to execute after the autocomplete input field has been cleared.
-         */
-        this.autocompleteClearInputCallback = () => {
-            this.removeIconRight();
-            this.inputValueLength = 0;
-            this.clearInputField.emit();
-        };
-        /**
-         * Adds the `clear` icon in the input field.
-         */
-        this.addClearIcon = () => {
-            this.isLoading = false;
-            this.inputIconRight = 'close';
-        };
-        /**
-         * Removes the loader icon and adds the clear icon.
-         */
-        this.finishedLoading = () => {
-            if (this.newStyle) {
-                this.removeIconRight();
-                if (this.inputValueLength >= 1) {
-                    this.addClearIcon();
-                }
-            }
-        };
-        /**
-         * Adds the "load" icon to the input field.
-         */
-        this.addLoadIcon = () => {
-            this.isLoading = true;
-        };
-        /**
-         * The function that is executed when an autocomplete option is selected.
-         *
-         * @param event
-         */
-        this.handleAutocompleteOptionSelection = (event) => {
-            // Convert back to the original API address interface to keep the data structures in sync.
-            if (event.detail._originalEvent instanceof PointerEvent) {
-                this.addressSelected.emit({
-                    addressKey: event.detail.value.addressKey,
-                    fullAddress: event.detail.label,
-                    postalCode: event.detail.value.postalCode
-                });
-                this.searchSubmitted.emit(event.detail.label);
-            }
-            else {
-                this.addressSelected.emit({
-                    addressKey: event.detail.value.addressKey,
-                    fullAddress: event.detail.label,
-                    postalCode: event.detail.value.postalCode
-                });
-            }
-        };
-        /**
-         * Handles the search button click.
-         */
-        this.handleSearchSubmit = () => {
-            var _a;
-            this.searchSubmitted.emit((_a = this.nativeInput) === null || _a === void 0 ? void 0 : _a.value);
-        };
-        /**
-         * Renders the content that is shown when there are no matching addresses.
-         */
-        this.renderManualAddressInputNoOptionsMessage = () => {
-            return (h("div", { part: "address-not-found" }, h("p", null, translate('components-address-search-not-found-message')), h("p", { part: `manual-input ${this.theme}` }, h("a", { onClick: this.manualAddressInputAction, onKeyDown: a11yBtnClick, class: { 'tet-link': true, 'dark': this.theme === 'dark' }, tabindex: "0", role: "button" }, translate('components-address-search-manual-address-input')))));
-        };
         this.language = 'lv';
         this.minSearchKeywordLength = 4;
         this.placeholder = 'Piemēram, Nometņu iela 10 - 5, Salaspils';
@@ -196,6 +46,12 @@ const TetAddressSearch = /*@__PURE__*/ proxyCustomElement(class TetAddressSearch
         this.searchButtonText = 'Parbaudīt';
         this.closeButtonText = 'Aizvert';
     }
+    /** The reference to the autocomplete element. */
+    autocomplete;
+    /** The reference to the native input element inside tet-input. */
+    nativeInput;
+    /** The reference to the tet-input element. */
+    inputComponent;
     onLanguageChanged(language) {
         processTranslations('tet-components', language).then(() => forceUpdate(this));
     }
@@ -213,6 +69,14 @@ const TetAddressSearch = /*@__PURE__*/ proxyCustomElement(class TetAddressSearch
     onInputDisabledStateChange(inputDisabled) {
         inputDisabled ? this.removeIconRight() : this.addClearIcon();
     }
+    /** The event that is emitted when the user selects an address via autocomplete. */
+    addressSelected;
+    /** The event that is emitted when the input field is cleared automatically. */
+    clearInputField;
+    /** The event that is emitted when the user selects the manual address input option. */
+    manualAddressInput;
+    /** The event that is emitted when the user clicks the search button. */
+    searchSubmitted;
     /**
      * - Resets the native input value to an empty string
      * - Resets input value length state
@@ -227,12 +91,11 @@ const TetAddressSearch = /*@__PURE__*/ proxyCustomElement(class TetAddressSearch
         processTranslations('tet-components', this.language).then(() => forceUpdate(this));
     }
     async componentDidLoad() {
-        var _a, _b, _c, _d, _e;
-        this.nativeInput = await ((_a = this.inputComponent) === null || _a === void 0 ? void 0 : _a.getInputHtmlElement());
-        (_b = this.nativeInput) === null || _b === void 0 ? void 0 : _b.addEventListener('input', this.toggleInputClearIcon);
-        (_c = this.nativeInput) === null || _c === void 0 ? void 0 : _c.addEventListener('input', this.handleInputTyping);
-        (_d = this.nativeInput) === null || _d === void 0 ? void 0 : _d.addEventListener('click', this.handleClick);
-        (_e = this.autocomplete) === null || _e === void 0 ? void 0 : _e.addEventListener('activeComponentStateChanged', this.handleActiveStateChange);
+        this.nativeInput = await this.inputComponent?.getInputHtmlElement();
+        this.nativeInput?.addEventListener('input', this.toggleInputClearIcon);
+        this.nativeInput?.addEventListener('input', this.handleInputTyping);
+        this.nativeInput?.addEventListener('click', this.handleClick);
+        this.autocomplete?.addEventListener('activeComponentStateChanged', this.handleActiveStateChange);
         if (this.nativeInput) {
             this.nativeInput.style.whiteSpace = 'nowrap';
             this.nativeInput.style.overflow = 'hidden';
@@ -243,18 +106,29 @@ const TetAddressSearch = /*@__PURE__*/ proxyCustomElement(class TetAddressSearch
         }
     }
     disconnectedCallback() {
-        var _a, _b, _c, _d;
-        (_a = this.nativeInput) === null || _a === void 0 ? void 0 : _a.removeEventListener('input', this.toggleInputClearIcon);
-        (_b = this.nativeInput) === null || _b === void 0 ? void 0 : _b.removeEventListener('input', this.handleInputTyping);
-        (_c = this.nativeInput) === null || _c === void 0 ? void 0 : _c.removeEventListener('click', this.handleClick);
-        (_d = this.autocomplete) === null || _d === void 0 ? void 0 : _d.removeEventListener('activeComponentStateChanged', this.handleActiveStateChange);
+        this.nativeInput?.removeEventListener('input', this.toggleInputClearIcon);
+        this.nativeInput?.removeEventListener('input', this.handleInputTyping);
+        this.nativeInput?.removeEventListener('click', this.handleClick);
+        this.autocomplete?.removeEventListener('activeComponentStateChanged', this.handleActiveStateChange);
     }
+    handleClick = () => {
+        this.elementActive = true;
+        this.focusVisible = false;
+    };
+    handleInputTyping = (event) => {
+        this.elementActive = true;
+        if (event?.data) {
+            this.focusVisible = false;
+        }
+    };
+    handleActiveStateChange = (event) => {
+        this.elementActive = event.detail !== null;
+    };
     /**
      * Listen for Tab key event.
      */
     onKeyDown(event) {
-        var _a;
-        if (event.key === 'Tab' && !((_a = this.nativeInput) === null || _a === void 0 ? void 0 : _a.value)) {
+        if (event.key === 'Tab' && !this.nativeInput?.value) {
             this.focusVisible = true;
         }
     }
@@ -280,6 +154,140 @@ const TetAddressSearch = /*@__PURE__*/ proxyCustomElement(class TetAddressSearch
             this.inputDisabled = false;
         }
     }
+    /**
+     * Toggles the icon on the right side of the input based on the current input value.
+     *
+     * @param event
+     */
+    toggleInputClearIcon = ({ target }) => {
+        const value = normalize(target.value);
+        this.inputValueLength = value.length;
+        if (this.newStyle && this.inputValueLength >= this.minSearchKeywordLength) {
+            this.addLoadIcon();
+            this.removeIconRight();
+            return;
+        }
+        if (value && !this.inputIconRight) {
+            this.addClearIcon();
+        }
+        if (!value && this.inputIconRight) {
+            this.removeIconRight();
+        }
+    };
+    /**
+     * Functionality that is executed when a manual address input trigger element is clicked upon or selected.
+     */
+    manualAddressInputAction = () => {
+        this.manualAddressInput.emit();
+        this.clearInputAction();
+    };
+    /**
+     * Filters autocomplete options by the given keyword.
+     *
+     * @param keyword
+     */
+    addressFilterFunction = async (keyword) => {
+        if (keyword.length < this.minSearchKeywordLength) {
+            return Promise.resolve([]);
+        }
+        const addresses = (await searchAddress(keyword)) ?? [];
+        const addressOptions = addresses.map(({ fullAddress, addressKey, postalCode }) => {
+            return {
+                label: fullAddress,
+                value: { addressKey, postalCode },
+            };
+        });
+        if (this.manualAddressTriggers && addressOptions.length > 0) {
+            addressOptions.push({
+                label: translate('components-address-search-manual-address-input'),
+                value: 'manual-input',
+                clickCallback: this.manualAddressInputAction,
+                ignoreHighlighting: true,
+                cssPart: `manual-input-option`
+            });
+        }
+        return addressOptions;
+    };
+    debounceAddressFilter = debounceAsync(this.addressFilterFunction, 300);
+    /**
+     * Removes the icon on the right side of the input.
+     */
+    removeIconRight = () => {
+        this.inputIconRight = '';
+    };
+    /**
+     * Executes input "clear" functionality.
+     */
+    clearInputAction = () => {
+        this.autocomplete?.clear();
+    };
+    /**
+     * Functionality to execute after the autocomplete input field has been cleared.
+     */
+    autocompleteClearInputCallback = () => {
+        this.removeIconRight();
+        this.inputValueLength = 0;
+        this.clearInputField.emit();
+    };
+    /**
+     * Adds the `clear` icon in the input field.
+     */
+    addClearIcon = () => {
+        this.isLoading = false;
+        this.inputIconRight = 'close';
+    };
+    /**
+     * Removes the loader icon and adds the clear icon.
+     */
+    finishedLoading = () => {
+        if (this.newStyle) {
+            this.removeIconRight();
+            if (this.inputValueLength >= 1) {
+                this.addClearIcon();
+            }
+        }
+    };
+    /**
+     * Adds the "load" icon to the input field.
+     */
+    addLoadIcon = () => {
+        this.isLoading = true;
+    };
+    /**
+     * The function that is executed when an autocomplete option is selected.
+     *
+     * @param event
+     */
+    handleAutocompleteOptionSelection = (event) => {
+        // Convert back to the original API address interface to keep the data structures in sync.
+        if (event.detail._originalEvent instanceof PointerEvent) {
+            this.addressSelected.emit({
+                addressKey: event.detail.value.addressKey,
+                fullAddress: event.detail.label,
+                postalCode: event.detail.value.postalCode
+            });
+            this.searchSubmitted.emit(event.detail.label);
+        }
+        else {
+            this.addressSelected.emit({
+                addressKey: event.detail.value.addressKey,
+                fullAddress: event.detail.label,
+                postalCode: event.detail.value.postalCode
+            });
+        }
+    };
+    /**
+     * Handles the search button click.
+     */
+    handleSearchSubmit = () => {
+        this.searchSubmitted.emit(this.nativeInput?.value);
+    };
+    /**
+     * Renders the content that is shown when there are no matching addresses.
+     */
+    renderManualAddressInputNoOptionsMessage = () => {
+        return (h("div", { part: "address-not-found" }, h("p", null, translate('components-address-search-not-found-message')), h("p", { part: `manual-input ${this.theme}` }, h("a", { onClick: this.manualAddressInputAction, onKeyDown: a11yBtnClick, class: { 'tet-link': true, 'dark': this.theme === 'dark' }, tabindex: "0", role: "button" }, translate('components-address-search-manual-address-input')))));
+    };
     render() {
         const inputClasses = ['autocomplete-input'];
         if (this.redesignedStyle) {