vviinn-widgets 2.219.0 → 2.220.0

package/dist/cjs/{index-DdCwxNyl.js → index-FE9nOqQo.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-D38ORu31.js');
-var search_store = require('./search.store-DiomZf0i.js');
+var search_store = require('./search.store-C6QU_D02.js');
 var store = require('./store-jPZ4ROqV.js');
 
 const PlusIcon = () => (index.h("svg", { width: "32", height: "32", viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "plus-icon", "aria-hidden": "true" },

package/dist/cjs/{search.store-DiomZf0i.js → search.store-C6QU_D02.js}

@@ -8593,7 +8593,7 @@ const encodeToBase64UTF8 = (str) => {
     return btoa(String.fromCharCode.apply(null, utf8Array));
 };
 
-const version = "2.219.0";
+const version = "2.220.0";
 
 const appStateGlobalDefaults = {
     excluded: null,
@@ -8623,7 +8623,6 @@ const receivedDataDefaults = {
     detectedObjects: [],
     stream: null,
     redirect: null,
-    autoSuggestCompletions: [],
 };
 const storeDefaults = Object.assign(Object.assign(Object.assign({}, appStateGlobalDefaults), appStateDefaults), receivedDataDefaults);
 const widgetStore = createStore(storeDefaults);
@@ -8867,7 +8866,7 @@ const useSearchStore = (showInWidget) => showInWidget
         onChange: onChangeComponentsState,
         storeName: "components",
     };
-const makeAutoSuggestRequest = async (store, query, token, apiPath) => {
+const makeAutoSuggestRequest = async (store, query, token, apiPath, onCompletions) => {
     const state = useStore(store);
     const body = {
         query,
@@ -8878,7 +8877,7 @@ const makeAutoSuggestRequest = async (store, query, token, apiPath) => {
             ((_a = state.textSearchQuery) === null || _a === void 0 ? void 0 : _a.trim().toLowerCase()))
             return response;
         const completions = (_b = response.data.completions) !== null && _b !== void 0 ? _b : [];
-        state.autoSuggestCompletions = completions;
+        onCompletions === null || onCompletions === void 0 ? void 0 : onCompletions(completions);
         const matchingCompletion = completions.find((completion) => completion.suggestion.trim().toLowerCase() ===
             query.trim().toLowerCase() && (completion === null || completion === void 0 ? void 0 : completion.url));
         if (matchingCompletion === null || matchingCompletion === void 0 ? void 0 : matchingCompletion.url) {
@@ -8890,17 +8889,12 @@ const makeAutoSuggestRequest = async (store, query, token, apiPath) => {
         return response;
     }), Rectangle.mapLeft((error) => error))();
 };
-const clearAutoSuggestCompletions = (store) => {
-    const state = useStore(store);
-    state.autoSuggestCompletions = [];
-};
 
 exports._ArrayExports = _ArrayExports;
 exports.addIfNotEmpty = addIfNotEmpty;
 exports.campaignTypeNames = campaignTypeNames;
 exports.checkDeviceType = checkDeviceType;
 exports.checkImageType = checkImageType;
-exports.clearAutoSuggestCompletions = clearAutoSuggestCompletions;
 exports.extractFilterValue = extractFilterValue;
 exports.fold = fold;
 exports.fromString = fromString;

package/dist/cjs/vviinn-button_6.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-D38ORu31.js');
 var store = require('./store-jPZ4ROqV.js');
-var search_store = require('./search.store-DiomZf0i.js');
+var search_store = require('./search.store-C6QU_D02.js');
 var index$1 = require('./index-CBteD3gC.js');
 var SecondaryActionIcon = require('./SecondaryActionIcon-Ng84u7-b.js');
 var index$2 = require('./index-CvMi8_tX.js');

package/dist/cjs/vviinn-camera_12.cjs.entry.js

@@ -2,9 +2,9 @@
 
 var index = require('./index-D38ORu31.js');
 var Rectangle = require('./Rectangle-7dF6_xf3.js');
-var search_store = require('./search.store-DiomZf0i.js');
+var search_store = require('./search.store-C6QU_D02.js');
 var index$2 = require('./index-CBteD3gC.js');
-var index$1 = require('./index-DdCwxNyl.js');
+var index$1 = require('./index-FE9nOqQo.js');
 var store = require('./store-jPZ4ROqV.js');
 var cropperUtils = require('./cropperUtils-DCDOLeBS.js');
 var cssUrlHelper = require('./cssUrlHelper-BX9kngtZ.js');
@@ -1758,7 +1758,7 @@ const VviinnVpsWidget = class {
         /** Show the text search */
         this.textSearchShow = false;
         /** Show auto-suggest dropdown with search completions */
-        this.autoSuggestShow = false;
+        this.autoSuggestShow = true;
         /** Show or hide Add to Basket buttons */
         this.addToBasketShow = false;
         /** Show or hide Favorite button */
@@ -2148,31 +2148,31 @@ const VviinnVpsWidget = class {
     }
     render() {
         var _a, _b, _c;
-        return (index.h(index.Host, { key: '0985a289b00fca5286466be2d4f33ef7d32c49cb', exportparts: `${index$3.modalParts}, ${index$3.productCardParts}, ${index$3.searchBarParts}, ${index$3.searchWidgetFilterParts}, ${index$3.searchWidgetButtonParts}, ${index$3.productCardsGridPart}, ${index$3.suggestionsParts}` }, cssUrlHelper.renderExternalCSS(this.cssUrl), !this.showingInButton && index$2.SlotSkeleton("search"), index.h("vviinn-overlayed-modal", { key: '42c48cf9f6414ccd23705ad4a1ca2dcccf6aa65f', class: { "first-screen": this.isOnboardingSlide() }, isFirstScreen: this.isOnboardingSlide(), active: this.active, resetState: this.resetState, onVviinnWidgetClose: ({ detail }) => {
+        return (index.h(index.Host, { key: '0ffc3a002f79fd6481c59a582561d00f5643c33a', exportparts: `${index$3.modalParts}, ${index$3.productCardParts}, ${index$3.searchBarParts}, ${index$3.searchWidgetFilterParts}, ${index$3.searchWidgetButtonParts}, ${index$3.productCardsGridPart}, ${index$3.suggestionsParts}` }, cssUrlHelper.renderExternalCSS(this.cssUrl), !this.showingInButton && index$2.SlotSkeleton("search"), index.h("vviinn-overlayed-modal", { key: 'af3589b5adc791a3d04c7fce56e6b9177af508da', class: { "first-screen": this.isOnboardingSlide() }, isFirstScreen: this.isOnboardingSlide(), active: this.active, resetState: this.resetState, onVviinnWidgetClose: ({ detail }) => {
                 if (detail.campaignTypeId !== "VPR")
                     this.handleModalClose();
             }, buttonElementId: (_a = this.buttonElementId) !== null && _a !== void 0 ? _a : this.widgetElementId, widgetVersion: search_store.version, hideBackButton: this.mode === "upload" ||
-                (!this.isCameraEnabled && this.isOnboardingSlide()) }, index.h("vviinn-slider", { key: '399dac9c2c005efad3c3506dd84f7bcf9c550eaf', position: this.slidePosition }, index.h("vviinn-slide", { key: '832f2287e46f4edaeade004325106fecbdb3e618', class: {
+                (!this.isCameraEnabled && this.isOnboardingSlide()) }, index.h("vviinn-slider", { key: '1b98b36bde65dedc539bd49468db86a7317a74d4', position: this.slidePosition }, index.h("vviinn-slide", { key: 'd1b48094f57f9f34a808ee79f78875793cbde05f', class: {
                 "start-page": true,
                 "camera-enabled": this.isCameraEnabled,
-            } }, index.h("vviinn-camera", { key: 'fee0491b5660c7f4c61796bfc647edf6c1121ed6', token: this.token, onVviinnImageUploadFinished: ({ detail }) => this.handleVviinnImageUploadFinished(detail), onVviinnImageUploadStarted: () => {
+            } }, index.h("vviinn-camera", { key: 'a8b4695f255d22f80a0980fa6f7e6ef62b9f6e33', token: this.token, onVviinnImageUploadFinished: ({ detail }) => this.handleVviinnImageUploadFinished(detail), onVviinnImageUploadStarted: () => {
                 this.handleVviinnImageUpload("startCamera");
-            }, apiPath: this.apiPath, basicEventData: this.getBasicEventData(), srcObject: this.stream, cameraButtonClicked: this.isCameraButtonClicked, exampleImageSource: this.exampleImageSource, showInWidget: this.showInWidget, storeName: this.storeName, state: this.state }), index.h("div", { key: 'f5e463f64ac999e3b7bded376a0f12406ad3869d', class: {
+            }, apiPath: this.apiPath, basicEventData: this.getBasicEventData(), srcObject: this.stream, cameraButtonClicked: this.isCameraButtonClicked, exampleImageSource: this.exampleImageSource, showInWidget: this.showInWidget, storeName: this.storeName, state: this.state }), index.h("div", { key: 'b38d1c05099d04c7a8c22587e7c02bd93fce532d', class: {
                 error: this.haveErrors(),
-            }, id: "start-page_block" }, index.h("div", { key: '155a80658288afe387d77f1140819fa72134a42e', class: "start-page_main-content" }, (this.wrongImageFormat ||
-            this.state.searchStatus === "error") && (index.h("div", { key: '3c948759b2b3b264008d814d8c711cba759f0042', class: "start-page_errors-block" }, this.getCurrentErrorType() && (index.h("vviinn-error", { key: '6ded7b63230680c53893a571100ad63787db36e8', errorType: this.getCurrentErrorType(), handler: this.resetState, hasBackground: true, searchType: this.state.searchType })))), !this.haveErrors() && (index.h(index.Fragment, { key: '14c56d10d2df3af3f32b37aa10bc687bc4a52617' }, index.h("vviinn-teaser", { key: '99092cc741e26cb2f1101fa4bb5ff219017c7be9' }), index.h("div", { key: '77cf9e9e82a38e9fc9de074c3d02dda473d604ac', class: "buttons-group" }, this.renderButtons()), this.textSearchShow && !this.isResultSlide() && (index.h("vviinn-text-search", { key: '9393d8afb3ae1bbc3ed1d6f4f6461356dd3be912', token: this.token, apiPath: this.apiPath, locale: this.locale, showInWidget: this.showInWidget, showOnFirstScreen: true, uiSessionId: this.uiSessionId, basicEventData: this.getBasicEventData(true), resultsPageUrl: this.resultsPageUrl, autoSuggestShow: this.autoSuggestShow, "save-image-mode": "never" }))))), index.h("vviinn-privacy-badge", { key: '4c381e57c33d18a5736af7ad54a3512ba1ace512', privacyBadgeText: store.instance.t("privacyBadgeText", {
+            }, id: "start-page_block" }, index.h("div", { key: 'c989f1cb41cced69828e4f24ea925922b92218ec', class: "start-page_main-content" }, (this.wrongImageFormat ||
+            this.state.searchStatus === "error") && (index.h("div", { key: 'ed3feb471a4bbd2989800c9ab698ee8c9c3f8845', class: "start-page_errors-block" }, this.getCurrentErrorType() && (index.h("vviinn-error", { key: 'f859d178f1804136273faef22e5188fd51d07d4c', errorType: this.getCurrentErrorType(), handler: this.resetState, hasBackground: true, searchType: this.state.searchType })))), !this.haveErrors() && (index.h(index.Fragment, { key: 'b137960307e69c1884da1258a4ccb7456da4be43' }, index.h("vviinn-teaser", { key: '9f13392722c88be790b4a2ceed67197a25c7ccdc' }), index.h("div", { key: '94640ebeec975c56bac6bf90197cd95f1cb99f95', class: "buttons-group" }, this.renderButtons()), this.textSearchShow && !this.isResultSlide() && (index.h("vviinn-text-search", { key: '3c556fa2769f9ae91d7647e834aae3033c1131e9', token: this.token, apiPath: this.apiPath, locale: this.locale, showInWidget: this.showInWidget, showOnFirstScreen: true, uiSessionId: this.uiSessionId, basicEventData: this.getBasicEventData(true), resultsPageUrl: this.resultsPageUrl, autoSuggestShow: this.autoSuggestShow, "save-image-mode": "never" }))))), index.h("vviinn-privacy-badge", { key: 'a4021fb73a348f19e2401852d36e16b50f93506a', privacyBadgeText: store.instance.t("privacyBadgeText", {
                 interpolation: { escapeValue: false },
-            }), class: { invisible: this.haveErrors() } }))), index.h("vviinn-slide", { key: 'c3f7ea7984ce33f702153878f378be802adb8258', class: {
+            }), class: { invisible: this.haveErrors() } }))), index.h("vviinn-slide", { key: 'e9fabc9d45efd4f621454b076f9508c3b79ce690', class: {
                 "results-page": true,
                 active: this.isResultSlide(),
-            } }, this.isResultSlide() && (index.h("div", { key: 'cd8ec6519b09395d2b4926301bfeec3dc91d2ac6', class: "source-wrapper" }, this.isTextSearch() && (index.h("vviinn-text-search", { key: '96e71f8fb6f1c682f872e76f2b9dd5616d767934', token: this.token, showInWidget: this.showInWidget, apiPath: this.apiPath, locale: this.locale, uiSessionId: this.uiSessionId, basicEventData: this.getBasicEventData(true), resultsPageUrl: this.resultsPageUrl, autoSuggestShow: this.autoSuggestShow, "save-image-mode": "never" })), !this.isTextSearch() && (index.h("vviinn-cropper", { key: '4aabf6d68425e50b277c15c881c40bea2e4d38b1', token: this.token, basicEventData: this.getBasicEventData(), showAspectRatioError: this.showAspectRatioError, apiPath: this.apiPath, showInWidget: this.showInWidget, "save-image-mode": "never" })), index.h("vviinn-suggestions", { key: 'ca8f970dbd2f3b1824f80feb7477b3d34b8b5ed1', showInWidget: this.showInWidget, token: this.token, apiPath: this.apiPath, locale: this.locale }), index.h("vviinn-selected-filters", { key: '44ff0a2c8dea93a3b5c2cd593b34dc20a4b115b4', locale: this.locale, currencySign: this.currencySign, showInWidget: this.showInWidget, exportparts: index$3.filtersParts }), ((_b = this.state.dynamicFilters) === null || _b === void 0 ? void 0 : _b.length) > 0 && (index.h("div", { key: 'dbf0b1c1a240f60931b1b75d8b76806e071f359f', class: {
+            } }, this.isResultSlide() && (index.h("div", { key: '5240101a650b79c94b9c1e7a835f7061a328b41c', class: "source-wrapper" }, this.isTextSearch() && (index.h("vviinn-text-search", { key: '91c201e63dc2f01a4d00fe6f5a08e6627cfb7873', token: this.token, showInWidget: this.showInWidget, apiPath: this.apiPath, locale: this.locale, uiSessionId: this.uiSessionId, basicEventData: this.getBasicEventData(true), resultsPageUrl: this.resultsPageUrl, autoSuggestShow: this.autoSuggestShow, "save-image-mode": "never" })), !this.isTextSearch() && (index.h("vviinn-cropper", { key: 'ba7917b428a626458ab0956c028ac6d7fc3310f0', token: this.token, basicEventData: this.getBasicEventData(), showAspectRatioError: this.showAspectRatioError, apiPath: this.apiPath, showInWidget: this.showInWidget, "save-image-mode": "never" })), index.h("vviinn-suggestions", { key: '7954cbf976caf22a47d1b59cd242aad2546e4da5', showInWidget: this.showInWidget, token: this.token, apiPath: this.apiPath, locale: this.locale }), index.h("vviinn-selected-filters", { key: 'ac42d53feaeb3af7bc3e916e5a4cee9a9ba4b395', locale: this.locale, currencySign: this.currencySign, showInWidget: this.showInWidget, exportparts: index$3.filtersParts }), ((_b = this.state.dynamicFilters) === null || _b === void 0 ? void 0 : _b.length) > 0 && (index.h("div", { key: 'f8869d18215c0d35196217efdad6501234cbbf97', class: {
                 "filters-wrapper": true,
                 hidden: this.showAspectRatioError,
-            } }, index.h("vviinn-filters", { key: '801f6aab643da44e564f062fddeb14811eca70bd', showInWidget: this.showInWidget, showIntervalInputs: this.showIntervalInputs }), index.h("vviinn-extended-filters", { key: '36a32875a0532cbf7148720df7a743bb0159e51e', mode: "preview", showHeader: false, showInWidget: this.showInWidget, locale: this.locale, currencySign: this.currencySign, showIntervalInputs: this.showIntervalInputs }), index.h("vviinn-extended-filters-button", { key: '148bf202a89af93e8cd88a612d585d0849a3d7de', class: {
+            } }, index.h("vviinn-filters", { key: '87c6a34f3600b5c27bc0a9dc4e68239a5179593d', showInWidget: this.showInWidget, showIntervalInputs: this.showIntervalInputs }), index.h("vviinn-extended-filters", { key: '2185ccdc5005da02c03562b290693390a6ecf2ff', mode: "preview", showHeader: false, showInWidget: this.showInWidget, locale: this.locale, currencySign: this.currencySign, showIntervalInputs: this.showIntervalInputs }), index.h("vviinn-extended-filters-button", { key: '3b65d1435f512939444dcef95a4902c0f70a25f1', class: {
                 "extended-filters-button": true,
                 "has-primary-filters": this.state.dynamicFilters.filter((f) => f.isPrimary)
                     .length > 0,
-            }, showInWidget: this.showInWidget }))))), this.isResultSlide() && (index.h(index.Fragment, { key: '263743fba6b324f47a1fae12648995bdef73aa25' }, index.h("vviinn-results", { key: '977140130b3b8dafaac6ae428c2b9f013de37d00', token: this.token, locale: this.locale, numberLocale: this.numberLocale, pricePrefix: this.pricePrefix, "currency-sign": this.currencySign, apiPath: this.apiPath, campaignIdTextSearch: this.campaignIdTextSearch, campaignIdVisualSearch: this.campaignIdVisualSearch, uiSessionId: this.uiSessionId, widgetElementId: (_c = this.buttonElementId) !== null && _c !== void 0 ? _c : this.widgetElementId, showInWidget: this.showInWidget, buttonElementId: this.buttonElementId, imageResolutionWidth: this.imageResolutionWidth, showMultipleImages: this.showMultipleImages, productDetailsNewTab: this.productDetailsNewTab, productDetailsRedirect: this.productDetailsRedirect, addToBasketShow: this.addToBasketShow, favoriteShow: this.favoriteShow, showAspectRatioError: this.showAspectRatioError, resetWidgetState: this.resetState, replaceSlotsContentInWidget: this.replaceSlotsContent.bind(this), replaceSlotsContentInButton: this.replaceSlotsContentInButton, addPriceContainer: this.addPriceContainer, oneClickDiscoveryMode: this.oneClickDiscoveryMode, oneClickDiscoveryCampaigns: this.oneClickDiscoveryCampaigns, parentSlots: [...this.parentSlots, ...this.slots], scrollableModalBody: this.modalBody }))))), index.h("vviinn-extended-filters", { key: '24d12faff2641fd61a4d13d7303734f1770120b2', class: "modal-extended-filters", mode: "modal", exportparts: index$3.extendedFiltersParts, showInWidget: this.showInWidget, locale: this.locale, currencySign: this.currencySign, showIntervalInputs: this.showIntervalInputs }))));
+            }, showInWidget: this.showInWidget }))))), this.isResultSlide() && (index.h(index.Fragment, { key: '20234d1d8db73b4a0e7e3160ece10ec961623970' }, index.h("vviinn-results", { key: 'b66732f0a86a9e296e4fd6dbb1c75e4e4debe657', token: this.token, locale: this.locale, numberLocale: this.numberLocale, pricePrefix: this.pricePrefix, "currency-sign": this.currencySign, apiPath: this.apiPath, campaignIdTextSearch: this.campaignIdTextSearch, campaignIdVisualSearch: this.campaignIdVisualSearch, uiSessionId: this.uiSessionId, widgetElementId: (_c = this.buttonElementId) !== null && _c !== void 0 ? _c : this.widgetElementId, showInWidget: this.showInWidget, buttonElementId: this.buttonElementId, imageResolutionWidth: this.imageResolutionWidth, showMultipleImages: this.showMultipleImages, productDetailsNewTab: this.productDetailsNewTab, productDetailsRedirect: this.productDetailsRedirect, addToBasketShow: this.addToBasketShow, favoriteShow: this.favoriteShow, showAspectRatioError: this.showAspectRatioError, resetWidgetState: this.resetState, replaceSlotsContentInWidget: this.replaceSlotsContent.bind(this), replaceSlotsContentInButton: this.replaceSlotsContentInButton, addPriceContainer: this.addPriceContainer, oneClickDiscoveryMode: this.oneClickDiscoveryMode, oneClickDiscoveryCampaigns: this.oneClickDiscoveryCampaigns, parentSlots: [...this.parentSlots, ...this.slots], scrollableModalBody: this.modalBody }))))), index.h("vviinn-extended-filters", { key: 'b08b5f73b3462169236f63aa2499940aa0898115', class: "modal-extended-filters", mode: "modal", exportparts: index$3.extendedFiltersParts, showInWidget: this.showInWidget, locale: this.locale, currencySign: this.currencySign, showIntervalInputs: this.showIntervalInputs }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/vviinn-carousel_10.cjs.entry.js

@@ -1,10 +1,10 @@
 'use strict';
 
 var index = require('./index-D38ORu31.js');
-var search_store = require('./search.store-DiomZf0i.js');
+var search_store = require('./search.store-C6QU_D02.js');
 var Rectangle = require('./Rectangle-7dF6_xf3.js');
 var store = require('./store-jPZ4ROqV.js');
-var index$1 = require('./index-DdCwxNyl.js');
+var index$1 = require('./index-FE9nOqQo.js');
 var constants = require('./constants-BlwqMvns.js');
 var index$2 = require('./index-CBteD3gC.js');
 var index$3 = require('./index-CvMi8_tX.js');

package/dist/cjs/vviinn-shop-the-look.cjs.entry.js

@@ -4,7 +4,7 @@ var index = require('./index-D38ORu31.js');
 var Rectangle = require('./Rectangle-7dF6_xf3.js');
 var cropperUtils = require('./cropperUtils-DCDOLeBS.js');
 var swiperElement = require('./swiper-element-DjtzojCR.js');
-var search_store = require('./search.store-DiomZf0i.js');
+var search_store = require('./search.store-C6QU_D02.js');
 var SecondaryActionIcon = require('./SecondaryActionIcon-Ng84u7-b.js');
 var index$1 = require('./index-CvMi8_tX.js');
 var store = require('./store-jPZ4ROqV.js');

package/dist/cjs/vviinn-text-search.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-D38ORu31.js');
 var Rectangle = require('./Rectangle-7dF6_xf3.js');
-var search_store = require('./search.store-DiomZf0i.js');
+var search_store = require('./search.store-C6QU_D02.js');
 var index$2 = require('./index-CBteD3gC.js');
 var store = require('./store-jPZ4ROqV.js');
 var index$1 = require('./index-CvMi8_tX.js');
@@ -16,17 +16,17 @@ const MicIcon = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", vie
     index.h("path", { d: "M12 14C11.1667 14 10.4583 13.7083 9.87501 13.125C9.29168 12.5417 9.00001 11.8333 9.00001 11V5C9.00001 4.16667 9.29168 3.45833 9.87501 2.875C10.4583 2.29167 11.1667 2 12 2C12.8333 2 13.5417 2.29167 14.125 2.875C14.7083 3.45833 15 4.16667 15 5V11C15 11.8333 14.7083 12.5417 14.125 13.125C13.5417 13.7083 12.8333 14 12 14ZM11 20V17.925C9.46668 17.7083 8.15418 17.0583 7.06251 15.975C5.97085 14.8917 5.30835 13.575 5.07501 12.025C5.04168 11.7417 5.11668 11.5 5.30001 11.3C5.48335 11.1 5.71668 11 6.00001 11C6.28335 11 6.52085 11.0958 6.71251 11.2875C6.90418 11.4792 7.03335 11.7167 7.10001 12C7.33335 13.1667 7.91251 14.125 8.83751 14.875C9.76251 15.625 10.8167 16 12 16C13.2 16 14.2583 15.6208 15.175 14.8625C16.0917 14.1042 16.6667 13.15 16.9 12C16.9667 11.7167 17.0958 11.4792 17.2875 11.2875C17.4792 11.0958 17.7167 11 18 11C18.2833 11 18.5167 11.1 18.7 11.3C18.8833 11.5 18.9583 11.7417 18.925 12.025C18.6917 13.5417 18.0333 14.85 16.95 15.95C15.8667 17.05 14.55 17.7083 13 17.925V20C13 20.2833 12.9042 20.5208 12.7125 20.7125C12.5208 20.9042 12.2833 21 12 21C11.7167 21 11.4792 20.9042 11.2875 20.7125C11.0958 20.5208 11 20.2833 11 20Z", fill: "#161616" })));
 
 const AUTO_SUGGEST_DEBOUNCE_MS = 300;
-const createAutoSuggestHandler = (storeName, token, apiPath) => {
+const createAutoSuggestHandler = (storeName, token, apiPath, onCompletions) => {
     let debounceTimer;
     const handleInputChange = (value) => {
         search_store.setTextSearchQuery(storeName, value);
         clearTimeout(debounceTimer);
         if (!value) {
-            search_store.clearAutoSuggestCompletions(storeName);
+            onCompletions([]);
             return;
         }
         debounceTimer = setTimeout(() => {
-            search_store.makeAutoSuggestRequest(storeName, value, token, apiPath);
+            search_store.makeAutoSuggestRequest(storeName, value, token, apiPath, onCompletions);
         }, AUTO_SUGGEST_DEBOUNCE_MS);
     };
     const cancelPending = () => clearTimeout(debounceTimer);
@@ -184,7 +184,7 @@ const VviinnTextSearch = class {
         /** Custom placeholder for the text search input */
         this.placeholder = "";
         /** Show auto-suggest dropdown with search completions */
-        this.autoSuggestShow = false;
+        this.autoSuggestShow = true;
         /** True, when used inside the widget */
         /** @internal */
         this.showInWidget = false;
@@ -197,6 +197,7 @@ const VviinnTextSearch = class {
         this.activeSuggestionIndex = -1;
         this.originalQuery = "";
         this.searchSubmitted = false;
+        this.isDisconnected = false;
         this.slots = [];
         this.isShowPreloader = () => this.state.searchStatus === "loading" && this.state.searchType === "text";
         this.isShowRecording = () => this.isRecording;
@@ -212,6 +213,14 @@ const VviinnTextSearch = class {
                 ? this.placeholder
                 : store.instance.t("textSearchPlaceholder");
         this.recognition = null;
+        this.setAutoSuggestCompletions = (completions) => {
+            if (this.isDisconnected)
+                return;
+            if (this.searchSubmitted && completions.length > 0)
+                return;
+            this.autoSuggestCompletions = completions;
+            this.activeSuggestionIndex = -1;
+        };
         this.trackTextSearch = () => this.vviinnFilterTriggered.emit({
             kind: this.state.textSearchQuery,
             action: "select",
@@ -246,7 +255,8 @@ const VviinnTextSearch = class {
             }
         };
         this.hideSuggestions = () => {
-            search_store.clearAutoSuggestCompletions(this.storeName);
+            this.autoSuggestCompletions = [];
+            this.activeSuggestionIndex = -1;
         };
         this.selectSuggestion = (completion) => {
             search_store.setTextSearchQuery(this.storeName, completion.suggestion);
@@ -304,7 +314,7 @@ const VviinnTextSearch = class {
             }
         };
         this.checkAutoSuggest = async (query) => {
-            Rectangle._functionExports.pipe(await search_store.makeAutoSuggestRequest(this.storeName, query, this.token, this.apiPath), Rectangle.fold(
+            Rectangle._functionExports.pipe(await search_store.makeAutoSuggestRequest(this.storeName, query, this.token, this.apiPath, this.setAutoSuggestCompletions), Rectangle.fold(
             // Intentionally ignore errors for auto-suggest
             () => { }, () => { }));
         };
@@ -335,24 +345,17 @@ const VviinnTextSearch = class {
         };
     }
     connectedCallback() {
-        const { state, storeName, onChange } = search_store.useSearchStore(this.showInWidget);
+        const { state, storeName } = search_store.useSearchStore(this.showInWidget);
         this.state = state;
         this.storeName = storeName;
-        if (this.autoSuggestShow) {
-            this.disposeOnChange = onChange("autoSuggestCompletions", (completions) => {
-                if (this.searchSubmitted && completions.length > 0)
-                    return;
-                this.autoSuggestCompletions = completions;
-                this.activeSuggestionIndex = -1;
-            });
-        }
+        this.isDisconnected = false;
     }
     disconnectedCallback() {
-        var _a, _b;
+        var _a;
+        this.isDisconnected = true;
         clearTimeout(this.triggerTooltipStart);
         clearTimeout(this.triggerTooltipEnd);
         (_a = this.autoSuggestHandler) === null || _a === void 0 ? void 0 : _a.cleanup();
-        (_b = this.disposeOnChange) === null || _b === void 0 ? void 0 : _b.call(this);
     }
     async componentWillLoad() {
         var _a, _b, _c;
@@ -360,7 +363,7 @@ const VviinnTextSearch = class {
         index$2.slotChangeListener(this, this.el);
         this.slots = index$2.findSlotElements(this.el);
         if (this.autoSuggestShow) {
-            this.autoSuggestHandler = createAutoSuggestHandler(this.storeName, this.token, this.apiPath);
+            this.autoSuggestHandler = createAutoSuggestHandler(this.storeName, this.token, this.apiPath, this.setAutoSuggestCompletions);
         }
         this.recognition = initializeRecognition((_a = this.locale) !== null && _a !== void 0 ? _a : store.defaultConfig.locale, () => {
             this.showRecording();
@@ -405,7 +408,7 @@ const VviinnTextSearch = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'a97f9685f46a30ca9ab12396ee1aa01482731370', exportparts: `${index$1.searchBarParts}, ${index$1.searchModalFirstScreenParts}` }, index.h("div", { key: '384e2cc006c0c66b2e50d56631beb538cbaa4f07', class: "text-search-container", part: "text-search-container" }, index.h("input", Object.assign({ key: '5e571ee58eab698531946a19c5e92fb970340d33', class: "text-search-input", part: "text-search-input", type: "text", placeholder: this.getPlaceholderText(), value: this.state.textSearchQuery || "", onInput: (event) => this.handleInputChange(event), onKeyDown: this.handleKeyDown, onBlur: this.autoSuggestShow ? this.hideSuggestions : undefined }, (this.autoSuggestShow && {
+        return (index.h(index.Host, { key: '0ac6e28c6631ea47c8e7c47b63fa2eb3af500087', exportparts: `${index$1.searchBarParts}, ${index$1.searchModalFirstScreenParts}` }, index.h("div", { key: '4b1d8edd675e91f4abd1a5933a1449b721a571c1', class: "text-search-container", part: "text-search-container" }, index.h("input", Object.assign({ key: '13e356c598ada0b70e9b5c99531563dae6c334b5', class: "text-search-input", part: "text-search-input", type: "text", placeholder: this.getPlaceholderText(), value: this.state.textSearchQuery || "", onInput: (event) => this.handleInputChange(event), onKeyDown: this.handleKeyDown, onBlur: this.autoSuggestShow ? this.hideSuggestions : undefined }, (this.autoSuggestShow && {
             role: "combobox",
             "aria-autocomplete": "list",
             "aria-expanded": this.autoSuggestCompletions.length > 0 &&
@@ -416,11 +419,11 @@ const VviinnTextSearch = class {
             "aria-activedescendant": this.activeSuggestionIndex >= 0
                 ? `suggestion-${this.activeSuggestionIndex}`
                 : undefined,
-        }))), this.mode === "extended" && (index.h("vviinn-vps-button", Object.assign({ key: 'a92908b647b3f07546bfa3e3a15f7306374cd59d', token: this.token, locale: this.locale, apiPath: this.apiPath, addStyle: false, showResultsInModal: false, resultsPageUrl: this.resultsPageUrl, resultsPageParams: this.resultsPageParams }, (this.exampleImageSource && {
+        }))), this.mode === "extended" && (index.h("vviinn-vps-button", Object.assign({ key: 'c3d89667ac1eaa2682a4e3c68481b06f9479e0d6', token: this.token, locale: this.locale, apiPath: this.apiPath, addStyle: false, showResultsInModal: false, resultsPageUrl: this.resultsPageUrl, resultsPageParams: this.resultsPageParams }, (this.exampleImageSource && {
             exampleImageSource: this.exampleImageSource,
-        }), (this.cssUrl != null && { cssUrl: this.cssUrl }), (this.visualSearchMode && { mode: this.visualSearchMode }), { parentSlots: this.slots }))), this.mode === "basic" && (index.h("slot", { key: '06e20a8744dea22ee8bd51d5a1e37b5e29b0b7f4', name: "vviinn-text-search-actions" })), (this.mode === "extended" || this.showInWidget) &&
-            this.recognition && (index.h("button", { key: '1ab2f0acb7137c36231a542234a717e34430474f', class: "speech-button", part: "speech-button", "aria-label": store.instance.t("a11y.speechButton"), onClick: this.handleSpeech, onKeyDown: (event) => this.handleButtonKeyDown(event, this.handleSpeech) }, index.h(MicIcon, { key: 'eb97b29086e9e5ad18b1ff6ac9637b760ae2c83a' }), this.isShowRecording() && (index.h("span", { key: 'dc8cecbb91eaa4a5195727b50919022898630a23', class: "recording-indicator" })))), index.h("button", { key: 'ebd39b8d86ab47cd4fadda6a5ad30c8001bd8c5a', class: "text-search-button", part: "text-search-button", onClick: () => this.handleTextSearch(), onKeyDown: (event) => this.handleButtonKeyDown(event, this.handleTextSearch), disabled: this.state.searchStatus === "loading", "aria-label": store.instance.t("a11y.textSearchButton") }, this.isShowPreloader() ? (index.h("vviinn-preloader", null)) : (index.h("slot", { name: "vviinn-text-search-icon" }, index.h(TextSearchIcon, null))))), this.autoSuggestShow &&
-            renderSuggestions(this.autoSuggestCompletions, this.state.textSearchQuery, this.activeSuggestionIndex, this.selectSuggestion), this.showTooltip && (index.h("p", { key: 'd59b3a49c6bda6b2992e3b0aa7bffb4ef674d3b6', class: "text-search-tooltip", part: "text-search-tooltip" }, store.instance.t(this.tooltipText)))));
+        }), (this.cssUrl != null && { cssUrl: this.cssUrl }), (this.visualSearchMode && { mode: this.visualSearchMode }), { parentSlots: this.slots }))), this.mode === "basic" && (index.h("slot", { key: 'c900b67d3dcffb64f3ca513c0475f64eb72ef495', name: "vviinn-text-search-actions" })), (this.mode === "extended" || this.showInWidget) &&
+            this.recognition && (index.h("button", { key: '99f75f77a43f618a45bd06124f283a5b97e422c3', class: "speech-button", part: "speech-button", "aria-label": store.instance.t("a11y.speechButton"), onClick: this.handleSpeech, onKeyDown: (event) => this.handleButtonKeyDown(event, this.handleSpeech) }, index.h(MicIcon, { key: 'ab0676502accecbb25377737a595550ae96b19cc' }), this.isShowRecording() && (index.h("span", { key: 'ece24c838cabc64e9b045c5eb97bc47d7bd932ba', class: "recording-indicator" })))), index.h("button", { key: 'e986f20a8e3d02f38e58c6a6e6946795d6d29875', class: "text-search-button", part: "text-search-button", onClick: () => this.handleTextSearch(), onKeyDown: (event) => this.handleButtonKeyDown(event, this.handleTextSearch), disabled: this.state.searchStatus === "loading", "aria-label": store.instance.t("a11y.textSearchButton") }, this.isShowPreloader() ? (index.h("vviinn-preloader", null)) : (index.h("slot", { name: "vviinn-text-search-icon" }, index.h(TextSearchIcon, null))))), this.autoSuggestShow &&
+            renderSuggestions(this.autoSuggestCompletions, this.state.textSearchQuery, this.activeSuggestionIndex, this.selectSuggestion), this.showTooltip && (index.h("p", { key: '470a0c67f9f310f775566a4e581be3dbb7a7cb95', class: "text-search-tooltip", part: "text-search-tooltip" }, store.instance.t(this.tooltipText)))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/vviinn-vps-button.cjs.entry.js

@@ -68,7 +68,7 @@ const VviinnVpsButton = class {
         /** Show the text search */
         this.textSearchShow = false;
         /** Show auto-suggest dropdown with search completions */
-        this.autoSuggestShow = false;
+        this.autoSuggestShow = true;
         /** Show or hide Add to Basket buttons */
         this.addToBasketShow = false;
         /** Show or hide Favorite button */
@@ -155,7 +155,7 @@ const VviinnVpsButton = class {
     }
     render() {
         const { ariaLabel, buttonIcon } = this.getButtonConfig();
-        return (index.h(index.Host, { key: '9d0e319edac342158caa501aae1756ade2b92242', role: this.buttonPressed ? undefined : "button", "aria-label": this.buttonPressed ? undefined : ariaLabel, exportparts: `vviinn-button, ${index$1.searchModalFirstScreenParts}` }, cssUrlHelper.renderExternalCSS(this.cssUrl), index.h("vviinn-button", { key: 'f30a55f9bbb705f5a17c925b655fa9210695b18d', addStyle: this.addStyle, part: "vviinn-button", tabindex: this.buttonPressed ? undefined : "0", onClick: this.buttonPressed ? undefined : this.handleActivation, onKeyDown: this.buttonPressed ? undefined : this.handleKeyDown }, index.h("slot", { key: 'e4fe7e8fe94fde3111836c7d0ae227a9a35fd1f4' }, buttonIcon)), index$2.SlotSkeleton("search"), index.h("vviinn-vps-widget", { key: '981a1866d06c8e35d7a9b211bf9f87ad06b85e42', mode: this.mode, "currency-sign": this.currencySign, token: this.token, locale: this.locale, numberLocale: this.numberLocale, apiPath: this.apiPath, pricePrefix: this.pricePrefix, campaignId: this.campaignId, campaignIdTextSearch: this.campaignIdTextSearch, campaignIdVisualSearch: this.campaignIdVisualSearch, showingInButton: true, buttonPressed: this.buttonPressed, resetVpsButton: this.resetButton, buttonElementId: this.el.id, active: this.buttonPressed &&
+        return (index.h(index.Host, { key: '2d9e0e9860039f521305b3f25da2a6aa5fee5e37', role: this.buttonPressed ? undefined : "button", "aria-label": this.buttonPressed ? undefined : ariaLabel, exportparts: `vviinn-button, ${index$1.searchModalFirstScreenParts}` }, cssUrlHelper.renderExternalCSS(this.cssUrl), index.h("vviinn-button", { key: '33bf0113ab55a6bf91cf25181fe8d863af84d264', addStyle: this.addStyle, part: "vviinn-button", tabindex: this.buttonPressed ? undefined : "0", onClick: this.buttonPressed ? undefined : this.handleActivation, onKeyDown: this.buttonPressed ? undefined : this.handleKeyDown }, index.h("slot", { key: '922d706ce5bf9418c3747fc69bf7920d2ad53c8b' }, buttonIcon)), index$2.SlotSkeleton("search"), index.h("vviinn-vps-widget", { key: 'd6735e7ff8e3ca9dca10f5546d7c4f9f97a8ffa7', mode: this.mode, "currency-sign": this.currencySign, token: this.token, locale: this.locale, numberLocale: this.numberLocale, apiPath: this.apiPath, pricePrefix: this.pricePrefix, campaignId: this.campaignId, campaignIdTextSearch: this.campaignIdTextSearch, campaignIdVisualSearch: this.campaignIdVisualSearch, showingInButton: true, buttonPressed: this.buttonPressed, resetVpsButton: this.resetButton, buttonElementId: this.el.id, active: this.buttonPressed &&
                 (this.mode === "modal" || this.mode === "camera"), excluded: this.excluded, productDetailsNewTab: this.productDetailsNewTab, productDetailsRedirect: this.productDetailsRedirect, imageResolutionWidth: this.imageResolutionWidth, showMultipleImages: this.showMultipleImages, exampleImageSource: this.exampleImageSource, textSearchShow: this.textSearchShow, autoSuggestShow: this.autoSuggestShow, addToBasketShow: this.addToBasketShow, addPriceContainer: this.addPriceContainer, showIntervalInputs: this.showIntervalInputs, replaceSlotsContentInButton: this.replaceSlotsContent.bind(this), oneClickDiscoveryMode: this.oneClickDiscoveryMode, oneClickDiscoveryCampaigns: this.oneClickDiscoveryCampaigns, favoriteShow: this.favoriteShow, showResultsInModal: this.showResultsInModal, resultsPageUrl: this.resultsPageUrl, resultsPageParams: this.resultsPageParams, parentSlots: [...this.parentSlots, ...this.slots], cssUrl: this.cssUrl })));
     }
     get el() { return index.getElement(this); }

package/dist/collection/components/vviinn-text-search/helpers/autoSuggestDebounce.js

@@ -1,16 +1,16 @@
-import { clearAutoSuggestCompletions, makeAutoSuggestRequest, setTextSearchQuery, } from "../../../store/search.store";
+import { makeAutoSuggestRequest, setTextSearchQuery, } from "../../../store/search.store";
 const AUTO_SUGGEST_DEBOUNCE_MS = 300;
-export const createAutoSuggestHandler = (storeName, token, apiPath) => {
+export const createAutoSuggestHandler = (storeName, token, apiPath, onCompletions) => {
     let debounceTimer;
     const handleInputChange = (value) => {
         setTextSearchQuery(storeName, value);
         clearTimeout(debounceTimer);
         if (!value) {
-            clearAutoSuggestCompletions(storeName);
+            onCompletions([]);
             return;
         }
         debounceTimer = setTimeout(() => {
-            makeAutoSuggestRequest(storeName, value, token, apiPath);
+            makeAutoSuggestRequest(storeName, value, token, apiPath, onCompletions);
         }, AUTO_SUGGEST_DEBOUNCE_MS);
     };
     const cancelPending = () => clearTimeout(debounceTimer);

package/dist/collection/components/vviinn-text-search/vviinn-text-search.js

@@ -2,7 +2,7 @@ import { Host, h, } from "@stencil/core";
 import * as E from "fp-ts/Either";
 import { pipe } from "fp-ts/lib/function";
 import { version } from "../../../package.json";
-import { clearAutoSuggestCompletions, makeAutoSuggestRequest, makeTextSearchRequest, setTextSearchQuery, useSearchStore, } from "../../store/search.store";
+import { makeAutoSuggestRequest, makeTextSearchRequest, setTextSearchQuery, useSearchStore, } from "../../store/search.store";
 import { TextSearchIcon } from "../vviinn-icons";
 import { slotChangeListener } from "../customized-slots";
 import i18next from "i18next";
@@ -46,7 +46,7 @@ export class VviinnTextSearch {
         /** Custom placeholder for the text search input */
         this.placeholder = "";
         /** Show auto-suggest dropdown with search completions */
-        this.autoSuggestShow = false;
+        this.autoSuggestShow = true;
         /** True, when used inside the widget */
         /** @internal */
         this.showInWidget = false;
@@ -59,6 +59,7 @@ export class VviinnTextSearch {
         this.activeSuggestionIndex = -1;
         this.originalQuery = "";
         this.searchSubmitted = false;
+        this.isDisconnected = false;
         this.slots = [];
         this.isShowPreloader = () => this.state.searchStatus === "loading" && this.state.searchType === "text";
         this.isShowRecording = () => this.isRecording;
@@ -74,6 +75,14 @@ export class VviinnTextSearch {
                 ? this.placeholder
                 : i18next.t("textSearchPlaceholder");
         this.recognition = null;
+        this.setAutoSuggestCompletions = (completions) => {
+            if (this.isDisconnected)
+                return;
+            if (this.searchSubmitted && completions.length > 0)
+                return;
+            this.autoSuggestCompletions = completions;
+            this.activeSuggestionIndex = -1;
+        };
         this.trackTextSearch = () => this.vviinnFilterTriggered.emit({
             kind: this.state.textSearchQuery,
             action: "select",
@@ -108,7 +117,8 @@ export class VviinnTextSearch {
             }
         };
         this.hideSuggestions = () => {
-            clearAutoSuggestCompletions(this.storeName);
+            this.autoSuggestCompletions = [];
+            this.activeSuggestionIndex = -1;
         };
         this.selectSuggestion = (completion) => {
             setTextSearchQuery(this.storeName, completion.suggestion);
@@ -166,7 +176,7 @@ export class VviinnTextSearch {
             }
         };
         this.checkAutoSuggest = async (query) => {
-            pipe(await makeAutoSuggestRequest(this.storeName, query, this.token, this.apiPath), E.fold(
+            pipe(await makeAutoSuggestRequest(this.storeName, query, this.token, this.apiPath, this.setAutoSuggestCompletions), E.fold(
             // Intentionally ignore errors for auto-suggest
             () => { }, () => { }));
         };
@@ -197,24 +207,17 @@ export class VviinnTextSearch {
         };
     }
     connectedCallback() {
-        const { state, storeName, onChange } = useSearchStore(this.showInWidget);
+        const { state, storeName } = useSearchStore(this.showInWidget);
         this.state = state;
         this.storeName = storeName;
-        if (this.autoSuggestShow) {
-            this.disposeOnChange = onChange("autoSuggestCompletions", (completions) => {
-                if (this.searchSubmitted && completions.length > 0)
-                    return;
-                this.autoSuggestCompletions = completions;
-                this.activeSuggestionIndex = -1;
-            });
-        }
+        this.isDisconnected = false;
     }
     disconnectedCallback() {
-        var _a, _b;
+        var _a;
+        this.isDisconnected = true;
         clearTimeout(this.triggerTooltipStart);
         clearTimeout(this.triggerTooltipEnd);
         (_a = this.autoSuggestHandler) === null || _a === void 0 ? void 0 : _a.cleanup();
-        (_b = this.disposeOnChange) === null || _b === void 0 ? void 0 : _b.call(this);
     }
     async componentWillLoad() {
         var _a, _b, _c;
@@ -222,7 +225,7 @@ export class VviinnTextSearch {
         slotChangeListener(this, this.el);
         this.slots = findSlotElements(this.el);
         if (this.autoSuggestShow) {
-            this.autoSuggestHandler = createAutoSuggestHandler(this.storeName, this.token, this.apiPath);
+            this.autoSuggestHandler = createAutoSuggestHandler(this.storeName, this.token, this.apiPath, this.setAutoSuggestCompletions);
         }
         this.recognition = initializeRecognition((_a = this.locale) !== null && _a !== void 0 ? _a : defaultConfig.locale, () => {
             this.showRecording();
@@ -267,7 +270,7 @@ export class VviinnTextSearch {
         }
     }
     render() {
-        return (h(Host, { key: 'a97f9685f46a30ca9ab12396ee1aa01482731370', exportparts: `${searchBarParts}, ${searchModalFirstScreenParts}` }, h("div", { key: '384e2cc006c0c66b2e50d56631beb538cbaa4f07', class: "text-search-container", part: "text-search-container" }, h("input", Object.assign({ key: '5e571ee58eab698531946a19c5e92fb970340d33', class: "text-search-input", part: "text-search-input", type: "text", placeholder: this.getPlaceholderText(), value: this.state.textSearchQuery || "", onInput: (event) => this.handleInputChange(event), onKeyDown: this.handleKeyDown, onBlur: this.autoSuggestShow ? this.hideSuggestions : undefined }, (this.autoSuggestShow && {
+        return (h(Host, { key: '0ac6e28c6631ea47c8e7c47b63fa2eb3af500087', exportparts: `${searchBarParts}, ${searchModalFirstScreenParts}` }, h("div", { key: '4b1d8edd675e91f4abd1a5933a1449b721a571c1', class: "text-search-container", part: "text-search-container" }, h("input", Object.assign({ key: '13e356c598ada0b70e9b5c99531563dae6c334b5', class: "text-search-input", part: "text-search-input", type: "text", placeholder: this.getPlaceholderText(), value: this.state.textSearchQuery || "", onInput: (event) => this.handleInputChange(event), onKeyDown: this.handleKeyDown, onBlur: this.autoSuggestShow ? this.hideSuggestions : undefined }, (this.autoSuggestShow && {
             role: "combobox",
             "aria-autocomplete": "list",
             "aria-expanded": this.autoSuggestCompletions.length > 0 &&
@@ -278,11 +281,11 @@ export class VviinnTextSearch {
             "aria-activedescendant": this.activeSuggestionIndex >= 0
                 ? `suggestion-${this.activeSuggestionIndex}`
                 : undefined,
-        }))), this.mode === "extended" && (h("vviinn-vps-button", Object.assign({ key: 'a92908b647b3f07546bfa3e3a15f7306374cd59d', token: this.token, locale: this.locale, apiPath: this.apiPath, addStyle: false, showResultsInModal: false, resultsPageUrl: this.resultsPageUrl, resultsPageParams: this.resultsPageParams }, (this.exampleImageSource && {
+        }))), this.mode === "extended" && (h("vviinn-vps-button", Object.assign({ key: 'c3d89667ac1eaa2682a4e3c68481b06f9479e0d6', token: this.token, locale: this.locale, apiPath: this.apiPath, addStyle: false, showResultsInModal: false, resultsPageUrl: this.resultsPageUrl, resultsPageParams: this.resultsPageParams }, (this.exampleImageSource && {
             exampleImageSource: this.exampleImageSource,
-        }), (this.cssUrl != null && { cssUrl: this.cssUrl }), (this.visualSearchMode && { mode: this.visualSearchMode }), { parentSlots: this.slots }))), this.mode === "basic" && (h("slot", { key: '06e20a8744dea22ee8bd51d5a1e37b5e29b0b7f4', name: "vviinn-text-search-actions" })), (this.mode === "extended" || this.showInWidget) &&
-            this.recognition && (h("button", { key: '1ab2f0acb7137c36231a542234a717e34430474f', class: "speech-button", part: "speech-button", "aria-label": i18next.t("a11y.speechButton"), onClick: this.handleSpeech, onKeyDown: (event) => this.handleButtonKeyDown(event, this.handleSpeech) }, h(MicIcon, { key: 'eb97b29086e9e5ad18b1ff6ac9637b760ae2c83a' }), this.isShowRecording() && (h("span", { key: 'dc8cecbb91eaa4a5195727b50919022898630a23', class: "recording-indicator" })))), h("button", { key: 'ebd39b8d86ab47cd4fadda6a5ad30c8001bd8c5a', class: "text-search-button", part: "text-search-button", onClick: () => this.handleTextSearch(), onKeyDown: (event) => this.handleButtonKeyDown(event, this.handleTextSearch), disabled: this.state.searchStatus === "loading", "aria-label": i18next.t("a11y.textSearchButton") }, this.isShowPreloader() ? (h("vviinn-preloader", null)) : (h("slot", { name: "vviinn-text-search-icon" }, h(TextSearchIcon, null))))), this.autoSuggestShow &&
-            renderSuggestions(this.autoSuggestCompletions, this.state.textSearchQuery, this.activeSuggestionIndex, this.selectSuggestion), this.showTooltip && (h("p", { key: 'd59b3a49c6bda6b2992e3b0aa7bffb4ef674d3b6', class: "text-search-tooltip", part: "text-search-tooltip" }, i18next.t(this.tooltipText)))));
+        }), (this.cssUrl != null && { cssUrl: this.cssUrl }), (this.visualSearchMode && { mode: this.visualSearchMode }), { parentSlots: this.slots }))), this.mode === "basic" && (h("slot", { key: 'c900b67d3dcffb64f3ca513c0475f64eb72ef495', name: "vviinn-text-search-actions" })), (this.mode === "extended" || this.showInWidget) &&
+            this.recognition && (h("button", { key: '99f75f77a43f618a45bd06124f283a5b97e422c3', class: "speech-button", part: "speech-button", "aria-label": i18next.t("a11y.speechButton"), onClick: this.handleSpeech, onKeyDown: (event) => this.handleButtonKeyDown(event, this.handleSpeech) }, h(MicIcon, { key: 'ab0676502accecbb25377737a595550ae96b19cc' }), this.isShowRecording() && (h("span", { key: 'ece24c838cabc64e9b045c5eb97bc47d7bd932ba', class: "recording-indicator" })))), h("button", { key: 'e986f20a8e3d02f38e58c6a6e6946795d6d29875', class: "text-search-button", part: "text-search-button", onClick: () => this.handleTextSearch(), onKeyDown: (event) => this.handleButtonKeyDown(event, this.handleTextSearch), disabled: this.state.searchStatus === "loading", "aria-label": i18next.t("a11y.textSearchButton") }, this.isShowPreloader() ? (h("vviinn-preloader", null)) : (h("slot", { name: "vviinn-text-search-icon" }, h(TextSearchIcon, null))))), this.autoSuggestShow &&
+            renderSuggestions(this.autoSuggestCompletions, this.state.textSearchQuery, this.activeSuggestionIndex, this.selectSuggestion), this.showTooltip && (h("p", { key: '470a0c67f9f310f775566a4e581be3dbb7a7cb95', class: "text-search-tooltip", part: "text-search-tooltip" }, i18next.t(this.tooltipText)))));
     }
     static get is() { return "vviinn-text-search"; }
     static get encapsulation() { return "shadow"; }
@@ -482,7 +485,7 @@ export class VviinnTextSearch {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "defaultValue": "false"
+                "defaultValue": "true"
             },
             "exampleImageSource": {
                 "type": "string",

package/dist/collection/components/vviinn-vps-button/vviinn-vps-button.js

@@ -118,7 +118,7 @@ export class VviinnVpsButton {
         /** Show the text search */
         this.textSearchShow = false;
         /** Show auto-suggest dropdown with search completions */
-        this.autoSuggestShow = false;
+        this.autoSuggestShow = true;
         /** Show or hide Add to Basket buttons */
         this.addToBasketShow = false;
         /** Show or hide Favorite button */
@@ -205,7 +205,7 @@ export class VviinnVpsButton {
     }
     render() {
         const { ariaLabel, buttonIcon } = this.getButtonConfig();
-        return (h(Host, { key: '9d0e319edac342158caa501aae1756ade2b92242', role: this.buttonPressed ? undefined : "button", "aria-label": this.buttonPressed ? undefined : ariaLabel, exportparts: `vviinn-button, ${searchModalFirstScreenParts}` }, renderExternalCSS(this.cssUrl), h("vviinn-button", { key: 'f30a55f9bbb705f5a17c925b655fa9210695b18d', addStyle: this.addStyle, part: "vviinn-button", tabindex: this.buttonPressed ? undefined : "0", onClick: this.buttonPressed ? undefined : this.handleActivation, onKeyDown: this.buttonPressed ? undefined : this.handleKeyDown }, h("slot", { key: 'e4fe7e8fe94fde3111836c7d0ae227a9a35fd1f4' }, buttonIcon)), SlotSkeleton("search"), h("vviinn-vps-widget", { key: '981a1866d06c8e35d7a9b211bf9f87ad06b85e42', mode: this.mode, "currency-sign": this.currencySign, token: this.token, locale: this.locale, numberLocale: this.numberLocale, apiPath: this.apiPath, pricePrefix: this.pricePrefix, campaignId: this.campaignId, campaignIdTextSearch: this.campaignIdTextSearch, campaignIdVisualSearch: this.campaignIdVisualSearch, showingInButton: true, buttonPressed: this.buttonPressed, resetVpsButton: this.resetButton, buttonElementId: this.el.id, active: this.buttonPressed &&
+        return (h(Host, { key: '2d9e0e9860039f521305b3f25da2a6aa5fee5e37', role: this.buttonPressed ? undefined : "button", "aria-label": this.buttonPressed ? undefined : ariaLabel, exportparts: `vviinn-button, ${searchModalFirstScreenParts}` }, renderExternalCSS(this.cssUrl), h("vviinn-button", { key: '33bf0113ab55a6bf91cf25181fe8d863af84d264', addStyle: this.addStyle, part: "vviinn-button", tabindex: this.buttonPressed ? undefined : "0", onClick: this.buttonPressed ? undefined : this.handleActivation, onKeyDown: this.buttonPressed ? undefined : this.handleKeyDown }, h("slot", { key: '922d706ce5bf9418c3747fc69bf7920d2ad53c8b' }, buttonIcon)), SlotSkeleton("search"), h("vviinn-vps-widget", { key: 'd6735e7ff8e3ca9dca10f5546d7c4f9f97a8ffa7', mode: this.mode, "currency-sign": this.currencySign, token: this.token, locale: this.locale, numberLocale: this.numberLocale, apiPath: this.apiPath, pricePrefix: this.pricePrefix, campaignId: this.campaignId, campaignIdTextSearch: this.campaignIdTextSearch, campaignIdVisualSearch: this.campaignIdVisualSearch, showingInButton: true, buttonPressed: this.buttonPressed, resetVpsButton: this.resetButton, buttonElementId: this.el.id, active: this.buttonPressed &&
                 (this.mode === "modal" || this.mode === "camera"), excluded: this.excluded, productDetailsNewTab: this.productDetailsNewTab, productDetailsRedirect: this.productDetailsRedirect, imageResolutionWidth: this.imageResolutionWidth, showMultipleImages: this.showMultipleImages, exampleImageSource: this.exampleImageSource, textSearchShow: this.textSearchShow, autoSuggestShow: this.autoSuggestShow, addToBasketShow: this.addToBasketShow, addPriceContainer: this.addPriceContainer, showIntervalInputs: this.showIntervalInputs, replaceSlotsContentInButton: this.replaceSlotsContent.bind(this), oneClickDiscoveryMode: this.oneClickDiscoveryMode, oneClickDiscoveryCampaigns: this.oneClickDiscoveryCampaigns, favoriteShow: this.favoriteShow, showResultsInModal: this.showResultsInModal, resultsPageUrl: this.resultsPageUrl, resultsPageParams: this.resultsPageParams, parentSlots: [...this.parentSlots, ...this.slots], cssUrl: this.cssUrl })));
     }
     static get is() { return "vviinn-vps-button"; }
@@ -587,7 +587,7 @@ export class VviinnVpsButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "defaultValue": "false"
+                "defaultValue": "true"
             },
             "addToBasketShow": {
                 "type": "boolean",