vviinn-widgets 2.44.2 → 2.46.0

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

@@ -17,7 +17,7 @@ import { isEmpty } from "fp-ts/string";
 import { v4 as uuidv4 } from "uuid";
 import i18next from "i18next";
 import { version } from "../../../package.json";
-import { imageSearchState } from "../../store/imageSearch.store";
+import { searchState } from "../../store/search.store";
 import { state } from "../../store/store";
 import { slotChangeListener } from "../customized-slots";
 import { createTrackingApi } from "../../openApi";
@@ -64,6 +64,7 @@ const checkDeviceType = () => {
  * @part price-sale - Block for sale price. Rendered only if the sale price is presented.
  * @part price-prefix - Block rendered before each price element (for ex. "from").
  * @part title - Title inside Product Card.
+ * @part text-search-input - Text search input.
 
  * @slot vviinn-onboarding-title - Title of onboarding section.
  * @slot onboarding-card-1-icon - Icon (or other graphics) on the first onboarding slide.
@@ -81,6 +82,7 @@ const checkDeviceType = () => {
  * @slot vviinn-camera-icon - Icon of Camera Button.
  * @slot vviinn-privacy-badge-text - Text content of privacy notification block.
  * @slot vviinn-image-search-modal-title - Image search modal title.
+ * @slot vviinn-text-search-icon - Icon of text search block.
  *
  */
 export class VviinnVpsWidget {
@@ -188,6 +190,7 @@ export class VviinnVpsWidget {
     this.productDetailNewTab = true;
     this.imageResolutionWidth = 250;
     this.exampleImageSource = DEFAULT_EXAMPLE_IMAGE;
+    this.textSearchShow = false;
     this.apiPath = "https://api.vviinn.com";
     this.showingInButton = false;
     this.buttonElementId = undefined;
@@ -203,6 +206,8 @@ export class VviinnVpsWidget {
     this.cameraButtonClicked = false;
     this.uploadSource = undefined;
     this.showAspectRatioError = false;
+    this.products = [];
+    this.initialSearchQuery = "";
   }
   initResultEvents() {
     this.resultLoaded = false;
@@ -220,6 +225,9 @@ export class VviinnVpsWidget {
   isResultSlide() {
     return this.slidePosition === 1;
   }
+  findProductById(id) {
+    return searchState.results.find((r) => r.productId === id);
+  }
   handleOpenLink(deeplink, event) {
     if (this.productDetailNewTab || event.ctrlKey || event.metaKey) {
       let newTab = window.open();
@@ -284,7 +292,7 @@ export class VviinnVpsWidget {
   async trackProductClick({ detail }) {
     const { productId, clickEvent } = detail;
     const productClickEvent = this.getProductTrackEvent(detail, "click");
-    const product = imageSearchState.results.find((r) => r.productId === productId);
+    const product = this.findProductById(productId);
     if (!product || !product.deeplink)
       return;
     if (!this.trackingDeactivated) {
@@ -302,7 +310,7 @@ export class VviinnVpsWidget {
   async trackAuxClick({ detail }) {
     const { productId } = detail;
     const productClickEvent = this.getProductTrackEvent(detail, "click");
-    const product = imageSearchState.results.find((r) => r.productId === productId);
+    const product = this.findProductById(productId);
     if (!product || !product.deeplink)
       return;
     if (!this.trackingDeactivated) {
@@ -335,6 +343,10 @@ export class VviinnVpsWidget {
     const searchEvent = createFilterEvent(Object.assign({ session_id: this.uiSessionId, source: this.imageSource, kind: detail.kind, action: detail.action }, rest));
     this.trackingApi.trackEvent(searchEvent).then(this.setTrackingDeactivated);
   }
+  async trackTextSearchFinished({ detail }) {
+    this.initialSearchQuery = detail;
+    this.slidePosition = 1;
+  }
   connectedCallback() {
     this.isDesktop = checkDeviceType() === "desktop";
     state.apiPath = this.apiPath;
@@ -342,12 +354,13 @@ export class VviinnVpsWidget {
     state.locale = this.locale;
     this.cameraAvailable =
       !!navigator.mediaDevices && !!navigator.mediaDevices.getUserMedia;
-    imageSearchState.token = this.token;
-    imageSearchState.campaignId = pipe(this.campaignId, O.fromNullable, O.chain(O.fromPredicate(notEmptyString)), O.map(filterInt), O.chain(O.fromPredicate(notNan)), O.map((s) => `${s}`));
+    const campaignId = pipe(this.campaignId, O.fromNullable, O.chain(O.fromPredicate(notEmptyString)), O.map(filterInt), O.chain(O.fromPredicate(notNan)), O.map((s) => `${s}`));
     if (this.excluded) {
       this.excluded = parseExcluded(this.excluded);
     }
-    imageSearchState.excluded = this.excluded;
+    searchState.token = this.token;
+    searchState.campaignId = campaignId;
+    searchState.excluded = this.excluded;
     this.uiSessionId = uuidv4();
     this.trackingApi = createTrackingApi(this.apiPath, this.token);
     this.id = this.el.id;
@@ -407,22 +420,26 @@ export class VviinnVpsWidget {
       this.cameraAvailable && (h("button", { class: "action-button", part: "start-camera_button", onClick: () => {
           this.handleStartCameraClick();
           this.uploadSource = "startCamera";
-        } }, imageSearchState.loading && this.uploadSource === "startCamera" ? (h("vviinn-preloader", null)) : (h("span", { class: "action-button-content" }, h("slot", { name: "vviinn-camera-icon" }, h(CameraActionIcon, null)), this.cameraEnabled ? (h("slot", { name: "vviinn-camera-button-text-stop" }, h("span", null, i18next.t("cameraButtonTextStop")))) : (h("slot", { name: "vviinn-camera-button-text-start" }, h("span", null, i18next.t("cameraButtonTextStart")))))))),
+        } }, searchState.loading &&
+        searchState.searchType === "image" &&
+        this.uploadSource === "startCamera" ? (h("vviinn-preloader", null)) : (h("span", { class: "action-button-content" }, h("slot", { name: "vviinn-camera-icon" }, h(CameraActionIcon, null)), this.cameraEnabled ? (h("slot", { name: "vviinn-camera-button-text-stop" }, h("span", null, i18next.t("cameraButtonTextStop")))) : (h("slot", { name: "vviinn-camera-button-text-start" }, h("span", null, i18next.t("cameraButtonTextStart")))))))),
       h("vviinn-image-selector", { class: "action-button", onClick: () => (this.uploadSource = "uploadPhoto"), onVviinnImageUploadFinished: this.handleVviinnImageUploadFinished, onVviinnImageUpload: () => {
           this.handleVviinnImageUpload("uploadPhoto");
-        }, onVviinnNoResult: ({ detail }) => this.handleVviinnNoResult(detail), resetVpsButton: this.resetVpsButton, basicEventData: this.getBasicEventData(), part: "upload-photo_button", startUpload: this.buttonPressed && this.showingInButton && this.mode === "upload", loading: imageSearchState.loading && this.uploadSource === "uploadPhoto" }, h("span", { slot: "upload-button-text", class: "action-button-content" }, h("slot", { name: "vviinn-image-upload-icon" }, h(UploadActionIcon, null)), h("slot", { name: "vviinn-image-upload-button-text" }, h("span", null, i18next.t("imageUploadButtonText"))))),
+        }, onVviinnNoResult: ({ detail }) => this.handleVviinnNoResult(detail), resetVpsButton: this.resetVpsButton, basicEventData: this.getBasicEventData(), part: "upload-photo_button", startUpload: this.buttonPressed && this.showingInButton && this.mode === "upload", loading: searchState.loading &&
+          searchState.searchType === "image" &&
+          this.uploadSource === "uploadPhoto" }, h("span", { slot: "upload-button-text", class: "action-button-content" }, h("slot", { name: "vviinn-image-upload-icon" }, h(UploadActionIcon, null)), h("slot", { name: "vviinn-image-upload-button-text" }, h("span", null, i18next.t("imageUploadButtonText"))))),
     ];
     return this.isDesktop ? buttons.reverse() : buttons;
   }
   renderResults() {
-    if (imageSearchState.results.length === 0)
+    if (searchState.results.length === 0)
       return null;
     if (!this.resultLoaded) {
       this.vviinnResultLoad.emit(this.getBasicEventData());
       this.trackResultEvent("load");
       this.resultLoaded = true;
     }
-    return imageSearchState.results.map((p, i) => {
+    return searchState.results.map((p, i) => {
       var _a;
       return (h("vviinn-product-card", { key: p.productId, hidden: true, productTitle: p.title, productId: p.productId, productType: p.productType, brand: p.brand, deeplink: p.deeplink, price: p.price.actual, salePrice: p.price.sale, responsive: true, imageWidth: this.imageResolutionWidth, image: (_a = p.image.thumbnail) !== null && _a !== void 0 ? _a : p.image.original, part: "product-card", campaignTypeId: "VPS", index: i, widgetElementId: this.id, buttonElementId: this.buttonElementId, widgetVersion: version }));
     });
@@ -430,18 +447,19 @@ export class VviinnVpsWidget {
   resetState() {
     this.resetScroll("start-page_block");
     this.slidePosition = 0;
-    imageSearchState.resetCategoryLink = undefined;
-    imageSearchState.activeIonLink = undefined;
-    imageSearchState.image = O.none;
-    imageSearchState.imageUrl = O.none;
-    imageSearchState.imageBounds = O.none;
-    imageSearchState.searchArea = O.none;
-    imageSearchState.results = [];
-    imageSearchState.filters = [];
-    imageSearchState.detectedObjects = [];
-    imageSearchState.rectangleSearchForm = undefined;
-    imageSearchState.loading = false;
-    imageSearchState.serverError = false;
+    searchState.resetCategoryLink = undefined;
+    searchState.activeIonLink = undefined;
+    searchState.image = O.none;
+    searchState.imageUrl = O.none;
+    searchState.imageBounds = O.none;
+    searchState.searchArea = O.none;
+    searchState.results = [];
+    searchState.filters = [];
+    searchState.detectedObjects = [];
+    searchState.rectangleSearchForm = undefined;
+    searchState.loading = false;
+    searchState.serverError = false;
+    searchState.searchType = undefined;
     this.wrongImageFormat = false;
     this.resetScroll("results-block");
     this.stopStreamTracks();
@@ -452,7 +470,7 @@ export class VviinnVpsWidget {
     this.setShowAspectRatioError(false);
   }
   haveErrors() {
-    return this.wrongImageFormat || imageSearchState.serverError;
+    return this.wrongImageFormat || searchState.serverError;
   }
   resetScroll(elementId, behavior = "auto") {
     const element = this.el.shadowRoot.getElementById(elementId);
@@ -467,7 +485,7 @@ export class VviinnVpsWidget {
   }
   render() {
     var _a;
-    return (h(Host, null, !this.showingInButton && h(SlotSkeleton, null), h("vviinn-overlayed-modal", { class: { "first-screen": this.isOnboardingSlide() }, isFirstScreen: this.isOnboardingSlide(), active: this.active, resetState: this.resetState.bind(this), onVviinnWidgetClose: () => this.handleModalClose(), buttonElementId: (_a = this.buttonElementId) !== null && _a !== void 0 ? _a : this.id, widgetVersion: version, hideBackButton: (this.mode === "upload" && this.showingInButton) ||
+    return (h(Host, { exportparts: "text-search-input" }, !this.showingInButton && h(SlotSkeleton, null), h("vviinn-overlayed-modal", { class: { "first-screen": this.isOnboardingSlide() }, isFirstScreen: this.isOnboardingSlide(), active: this.active, resetState: this.resetState.bind(this), onVviinnWidgetClose: () => this.handleModalClose(), buttonElementId: (_a = this.buttonElementId) !== null && _a !== void 0 ? _a : this.id, widgetVersion: version, hideBackButton: (this.mode === "upload" && this.showingInButton) ||
         (!this.cameraEnabled && this.isOnboardingSlide()), exportparts: "secondary-action, title, close-button" }, h("vviinn-slider", { showBullets: false, position: this.slidePosition }, h("vviinn-slide", { class: {
         "start-page": true,
         "camera-enabled": this.cameraEnabled,
@@ -477,21 +495,23 @@ export class VviinnVpsWidget {
         error: this.haveErrors(),
       }, id: "start-page_block" }, h("div", { class: "start-page_main-content" }, h("div", { class: {
         "start-page_errors-block": true,
-        hidden: !this.wrongImageFormat && !imageSearchState.serverError,
-      } }, h("vviinn-wrong-format", { class: { hidden: !this.wrongImageFormat }, handler: () => this.resetState() }), h("vviinn-server-error", { class: { hidden: !imageSearchState.serverError }, handler: () => this.resetState() })), !this.haveErrors() && h("vviinn-teaser", null), !this.haveErrors() && (h("div", { class: "buttons-group" }, this.renderButtons()))), h("vviinn-privacy-badge", { privacyBadgeText: i18next.t("privacyBadgeText"), class: { invisible: this.haveErrors() } }))), h("vviinn-slide", { class: {
+        hidden: !this.wrongImageFormat && !searchState.serverError,
+      } }, h("vviinn-wrong-format", { class: { hidden: !this.wrongImageFormat }, handler: () => this.resetState() }), h("vviinn-server-error", { class: { hidden: !searchState.serverError }, handler: () => this.resetState() })), !this.haveErrors() && h("vviinn-teaser", null), !this.haveErrors() && (h("div", { class: "buttons-group" }, this.renderButtons())), this.textSearchShow && !this.haveErrors() && (h("vviinn-text-search", { clearSearchQuery: true }))), h("vviinn-privacy-badge", { privacyBadgeText: i18next.t("privacyBadgeText"), class: { invisible: this.haveErrors() } }))), h("vviinn-slide", { class: {
         "results-page": true,
         active: this.isResultSlide(),
-      } }, h("div", { class: "image-wrapper" }, this.isResultSlide() && (h("vviinn-image-view", { basicEventData: this.getBasicEventData(), setShowAspectRatioError: this.setShowAspectRatioError, showAspectRatioError: this.showAspectRatioError })), h("div", { class: {
+      } }, this.isResultSlide() && searchState.searchType === "image" && (h("div", { class: "image-wrapper" }, h("vviinn-image-view", { basicEventData: this.getBasicEventData(), setShowAspectRatioError: this.setShowAspectRatioError, showAspectRatioError: this.showAspectRatioError }), h("div", { class: {
         "filters-wrapper": true,
         hidden: this.showAspectRatioError,
-      } }, h("div", { class: "filters" }, imageSearchState.filters.map((filter) => (h("search-filters", { filter: filter, basicEventData: this.getBasicEventData() })))))), h("div", { id: "results-block", class: "products-wrapper" }, h("div", { class: {
+      } }, h("div", { class: "filters" }, searchState.filters.map((filter) => (h("search-filters", { filter: filter, basicEventData: this.getBasicEventData() }))))))), this.textSearchShow &&
+      this.isResultSlide() &&
+      searchState.searchType === "text" && (h("div", { class: "text-search-wrapper" }, h("vviinn-text-search", { initialSearchQuery: this.initialSearchQuery }))), h("div", { id: "results-block", class: "products-wrapper" }, h("div", { class: {
         "nothing-found": true,
-        hidden: imageSearchState.results.length > 0,
+        hidden: searchState.results.length > 0,
       } }, h("vviinn-empty-results", { handler: () => this.resetState() })), h("div", { class: {
         "nothing-found": true,
         hidden: !this.showAspectRatioError,
       } }, h("vviinn-wrong-aspect-ratio", { handler: () => this.resetState() })), h("div", { class: {
-        hidden: imageSearchState.results.length <= 0 ||
+        hidden: searchState.results.length <= 0 ||
           this.showAspectRatioError,
         products: true,
       } }, this.active && this.renderResults())))))));
@@ -676,6 +696,24 @@ export class VviinnVpsWidget {
         "reflect": false,
         "defaultValue": "DEFAULT_EXAMPLE_IMAGE"
       },
+      "textSearchShow": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Show the text search"
+        },
+        "attribute": "text-search-show",
+        "reflect": false,
+        "defaultValue": "false"
+      },
       "apiPath": {
         "type": "string",
         "mutable": false,
@@ -809,7 +847,9 @@ export class VviinnVpsWidget {
       "cameraEnabled": {},
       "cameraButtonClicked": {},
       "uploadSource": {},
-      "showAspectRatioError": {}
+      "showAspectRatioError": {},
+      "products": {},
+      "initialSearchQuery": {}
     };
   }
   static get events() {
@@ -1152,6 +1192,12 @@ export class VviinnVpsWidget {
         "target": undefined,
         "capture": false,
         "passive": false
+      }, {
+        "name": "vviinnTextSearchFinished",
+        "method": "trackTextSearchFinished",
+        "target": undefined,
+        "capture": false,
+        "passive": false
       }];
   }
 }

package/dist/collection/locale/resources-vps.js

@@ -8,6 +8,7 @@ export const resources = {
       privacyBadgeText: "Durch das Hochladen eines Bildes willigst Du in die Verarbeitung durch unseren Partner Vviinn ein. Das Bild wird nach einer Stunde Inaktivität gelöscht.",
       teaserText: "Finde Produkte auf \n einem Foto",
       imageSearchModalTitle: "Bildsuche",
+      textSearchPlaceholder: "mit Text suchen",
       emptyResultsBlock: {
         title: "Leider nichts gefunden",
         button: "Neues Bild hochladen",
@@ -36,6 +37,7 @@ export const resources = {
       privacyBadgeText: "By uploading a picture you agree to the processing by our partner Vviinn. The image will be deleted after one hour of inactivity.",
       teaserText: "Find Product by Photo",
       imageSearchModalTitle: "Visual Search",
+      textSearchPlaceholder: "Search by text",
       emptyResultsBlock: {
         title: "Sorry, nothing found",
         button: "Upload another image",

package/dist/collection/network/request.js

@@ -12,7 +12,7 @@ function getJson(x) {
 }
 export const request = (url, request = {}) => pipe(safeRequest(url, request), TE.chain(processResponce), TE.chain((x) => getJson(x)));
 const initRequestSemigroup = mergeInitRequests;
-export const makeRequest = (path, init) => ([apiPath, options,]) => {
+export const makeRequest = (path, init) => ([apiPath, options]) => {
   const url = new URL(path, apiPath);
   const fullOptions = initRequestSemigroup.concat(options, init);
   return pipe(request(url.toString(), fullOptions), TE.mapLeft(basicErrorFromResponse));

package/dist/collection/searchSession/searchSession.js

@@ -1,12 +1,9 @@
 import { pipe } from "fp-ts/lib/function";
 import { makeRequest } from "../network/request";
 import { createInitPostRequest, getApiPath } from "../network/utils";
-import * as E from "fp-ts/Either";
 import * as TE from "fp-ts/TaskEither";
 import * as O from "fp-ts/Option";
-import { processBearerToken } from "../utils/token/tokenUtils";
 import { sequenceToEither } from "../utils/either";
-import { imageFormFromFile } from "../Image/form";
 import { arrayToQueryString } from "../utils/collections/collectionsUtils";
 export const readFilters = (filters) => Object.entries(filters).map(([name, filters]) => {
   return { name, filters };
@@ -19,7 +16,7 @@ export const detectedObjectEq = {
     x.rectangle.height === y.rectangle.height &&
     x.rectangle.width === y.rectangle.width,
 };
-export const searchSessionClient = (initialData, campaignId = O.none, excludedFilters) => {
+export const imageSearchSessionClient = (initialData, campaignId = O.none, excludedFilters) => {
   const searchUrl = "search/session";
   const requestUrl = pipe(campaignId, O.fold(() => {
     const params = [];
@@ -38,9 +35,7 @@ export const searchSessionClient = (initialData, campaignId = O.none, excludedFi
   }));
   return pipe(sequenceToEither(getApiPath(), createInitPostRequest), TE.fromEither, TE.chainW(makeRequest(requestUrl, initialData)));
 };
-export const makeRequestFromFile = (token, file) => pipe(sequenceToEither(processBearerToken(token), E.right(imageFormFromFile(file))), E.map(([headers, body]) => {
-  return {
-    headers,
-    body,
-  };
-}));
+export const textSearchSessionClient = (initialData) => {
+  const requestUrl = "multi-search";
+  return pipe(sequenceToEither(getApiPath(), createInitPostRequest), TE.fromEither, TE.chainW(makeRequest(requestUrl, initialData)));
+};

package/dist/collection/store/{imageSearch.store.js → search.store.js}

@@ -3,7 +3,7 @@ import * as O from "fp-ts/lib/Option";
 import * as E from "fp-ts/Either";
 import * as TE from "fp-ts/TaskEither";
 import { pipe } from "fp-ts/function";
-import { readFilters, searchSessionClient, } from "../searchSession/searchSession";
+import { readFilters, imageSearchSessionClient, textSearchSessionClient, } from "../searchSession/searchSession";
 import { foldValueObject } from "../network/ion/ValueObject";
 import { linkRequest, getLink } from "../network/ion/Link";
 import { divideOnSized } from "../geometry/Rectangle";
@@ -39,6 +39,7 @@ const { state, onChange } = createStore({
   serverError: false,
   loading: false,
 });
+export const searchState = state;
 const updateState = async (response) => {
   var _a;
   state.results = response.value;
@@ -81,6 +82,7 @@ export const makeRectangularSearchRequest = async () => {
   }));
 };
 export const uploadFile = (file) => {
+  state.searchType = "image";
   state.loading = true;
   const fileForm = imageFormFromFile(file);
   const tokenWithFile = sequenceToEither(processBearerToken(state.token), E.right(fileForm));
@@ -89,7 +91,7 @@ export const uploadFile = (file) => {
       headers,
       body,
     };
-  }), TE.fromEither, TE.chain((request) => searchSessionClient(request, state.campaignId, state.excluded)), TE.map((sessionResponse) => {
+  }), TE.fromEither, TE.chain((request) => imageSearchSessionClient(request, state.campaignId, state.excluded)), TE.map((sessionResponse) => {
     updateState(sessionResponse);
     detectObjects(sessionResponse);
     state.loading = false;
@@ -100,7 +102,34 @@ export const uploadFile = (file) => {
     return error;
   }));
 };
-export const imageSearchState = state;
+const uploadText = (query) => {
+  state.searchType = "text";
+  state.loading = true;
+  const body = JSON.stringify({
+    query,
+    campaign: O.getOrElse(() => "")(state.campaignId),
+  });
+  const tokenWithBody = sequenceToEither(processBearerToken(state.token), E.right(body));
+  return pipe(tokenWithBody, E.map(([headers, body]) => {
+    headers.set("Content-Type", "application/json");
+    return {
+      headers,
+      body,
+    };
+  }), TE.fromEither, TE.chain((request) => textSearchSessionClient(request)), TE.map((sessionResponse) => {
+    var _a, _b;
+    state.results = (_b = (_a = sessionResponse.data) === null || _a === void 0 ? void 0 : _a.products) !== null && _b !== void 0 ? _b : [];
+    state.loading = false;
+    return sessionResponse;
+  }), TE.mapLeft((error) => {
+    state.serverError = true;
+    state.loading = false;
+    return error;
+  }));
+};
+export const processSelectedText = async (query) => {
+  return await uploadText(query)();
+};
 onChange("activeIonLink", async (newLink) => {
   const link = newLink ? newLink : state.resetCategoryLink;
   if (!link)
@@ -122,8 +151,8 @@ onChange("serverError", () => {
   state.loading = false;
 });
 const setSelectedImage = (image) => {
-  imageSearchState.image = O.some(image);
-  imageSearchState.imageUrl = O.some(image.src);
+  searchState.image = O.some(image);
+  searchState.imageUrl = O.some(image.src);
 };
 export const processSelectedFile = async (file) => {
   const originFile = checkFileWithExtention(file);

package/dist/esm/VisualSearchIcon-13f7da6a.js

@@ -0,0 +1,6 @@
+import { h } from './index-1f3eaf12.js';
+
+const VisualSearchIcon = () => (h("svg", { width: "20", height: "20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+  h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M5 2C3.35 2 2 3.35 2 5v2H0V5c0-2.76 2.24-5 5-5h2v2H5Zm5 3c1.28 0 2.56.48 3.54 1.46h-.01a4.994 4.994 0 0 1 .64 6.29l3.05 3.05-1.41 1.41-3.05-3.05c-.84.55-1.8.83-2.76.83a4.98 4.98 0 0 1-3.54-1.46 5.003 5.003 0 0 1 0-7.07C7.44 5.49 8.72 5 10 5Zm-2.77 5c0 .74.29 1.44.81 1.96s1.22.81 1.96.81 1.44-.29 1.96-.81.81-1.22.81-1.96-.29-1.44-.81-1.96-1.22-.81-1.96-.81-1.44.29-1.96.81-.81 1.22-.81 1.96ZM2 15v-2H0v2c0 2.76 2.24 5 5 5h2v-2H5c-1.65 0-3-1.35-3-3ZM13 0h2c2.76 0 5 2.24 5 5v2h-2V5c0-1.65-1.35-3-3-3h-2V0Z", fill: "#161616" })));
+
+export { VisualSearchIcon as V };

package/dist/esm/{customized-slots-9a9f8c20.js → customized-slots-3bea41d2.js}

@@ -25,6 +25,7 @@ const defaultSlotsNames = [
   "vviinn-privacy-badge-text",
   "vviinn-image-search-modal-title",
   "vviinn-basket-button-text",
+  "vviinn-text-search-icon",
 ];
 const renderNamedSlot = (name) => h("slot", { name: name });
 const SlotSkeleton = () => defaultSlotsNames.map(renderNamedSlot);

package/dist/esm/{index-53105ad4.js → index-9c15b8f1.js}

@@ -1,4 +1,4 @@
-import { n as commonjsGlobal, o as createCommonjsModule } from './imageSearch.store-c0f2a178.js';
+import { n as commonjsGlobal, o as createCommonjsModule } from './search.store-5eebcfbe.js';
 
 // Unique ID creation requires a high quality random # generator. In the browser we therefore
 // require the crypto API and do not support built-in fallback to lower quality random number

package/dist/esm/loader.js

@@ -11,7 +11,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return bootstrapLazy([["vviinn-button",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-preloader",[[1,"vviinn-preloader"]]],["vviinn-error",[[1,"vviinn-error"]]],["vviinn-carousel_4",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"closed":[4],"opened":[4],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32],"updatingAllCards":[32]},[[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnAddToBasket","trackAddToBasket"],[0,"vviinnUpdatingAllCardsFinished","updatingAllCardsFinishedListener"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[16],"widgetVersion":[1,"widget-version"],"addToBasketShow":[4,"add-to-basket-show"],"updatingAllCards":[4,"updating-all-cards"],"updateButtonLocation":[1,"update-button-location"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32],"crossSellingRecommendations":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"mode":[1],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"updatingAllCards":[4,"updating-all-cards"],"defaultAnimationInterval":[2,"default-animation-interval"],"imageLoaded":[32],"isTransitioning":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-skeleton",{"height":[2],"halfWidth":[4,"half-width"]}]]],["search-filters_16",[[1,"vviinn-image-view",{"basicEventData":[16],"setShowAspectRatioError":[16],"showAspectRatioError":[4,"show-aspect-ratio-error"],"cropper":[32],"hidePreloader":[32]},[[0,"vviinnSelectObject","selectDetectedObject"]]],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"],"isFirstScreen":[4,"is-first-screen"]}],[1,"vviinn-empty-results",{"handler":[16]}],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"loading":[4],"accept":[1],"resetVpsButton":[16],"capture":[1]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-wrong-aspect-ratio",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-example-image",{"exampleImageSource":[1,"example-image-source"],"width":[2],"height":[2],"basicEventData":[16],"srcObject":[16],"cameraButtonClicked":[4,"camera-button-clicked"],"selected":[32],"videoInitialized":[32],"zoomCapabilities":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}],[1,"vviinn-teaser"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"isFirstScreen":[4,"is-first-screen"],"slider":[32]}],[1,"vviinn-overlay"]]],["vviinn-vps-widget",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32],"stream":[32],"cameraEnabled":[32],"cameraButtonClicked":[32],"uploadSource":[32],"showAspectRatioError":[32]},[[0,"vviinnCameraEnabled","trackCameraEnabled"],[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"]]]]],["vviinn-vps-button",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"locale":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"buttonChildren":[16],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"locale":[1],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"apiPath":[1,"api-path"]}]]]], options);
+  return bootstrapLazy([["vviinn-button",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-preloader",[[1,"vviinn-preloader"]]],["vviinn-error",[[1,"vviinn-error"]]],["vviinn-carousel_4",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"closed":[4],"opened":[4],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32],"updatingAllCards":[32]},[[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnAddToBasket","trackAddToBasket"],[0,"vviinnUpdatingAllCardsFinished","updatingAllCardsFinishedListener"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[16],"widgetVersion":[1,"widget-version"],"addToBasketShow":[4,"add-to-basket-show"],"updatingAllCards":[4,"updating-all-cards"],"updateButtonLocation":[1,"update-button-location"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32],"crossSellingRecommendations":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"mode":[1],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"updatingAllCards":[4,"updating-all-cards"],"defaultAnimationInterval":[2,"default-animation-interval"],"imageLoaded":[32],"isTransitioning":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-skeleton",{"height":[2],"halfWidth":[4,"half-width"]}]]],["search-filters_17",[[1,"vviinn-image-view",{"basicEventData":[16],"setShowAspectRatioError":[16],"showAspectRatioError":[4,"show-aspect-ratio-error"],"cropper":[32],"hidePreloader":[32]},[[0,"vviinnSelectObject","selectDetectedObject"]]],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"],"isFirstScreen":[4,"is-first-screen"]}],[1,"vviinn-empty-results",{"handler":[16]}],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"loading":[4],"accept":[1],"resetVpsButton":[16],"capture":[1]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-text-search",{"clearSearchQuery":[4,"clear-search-query"],"initialSearchQuery":[1,"initial-search-query"],"searchQuery":[32]}],[1,"vviinn-wrong-aspect-ratio",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-example-image",{"exampleImageSource":[1,"example-image-source"],"width":[2],"height":[2],"basicEventData":[16],"srcObject":[16],"cameraButtonClicked":[4,"camera-button-clicked"],"selected":[32],"videoInitialized":[32],"zoomCapabilities":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}],[1,"vviinn-teaser"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"isFirstScreen":[4,"is-first-screen"],"slider":[32]}],[1,"vviinn-overlay"]]],["vviinn-vps-widget",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32],"stream":[32],"cameraEnabled":[32],"cameraButtonClicked":[32],"uploadSource":[32],"showAspectRatioError":[32],"products":[32],"initialSearchQuery":[32]},[[0,"vviinnCameraEnabled","trackCameraEnabled"],[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"],[0,"vviinnTextSearchFinished","trackTextSearchFinished"]]]]],["vviinn-vps-button",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"locale":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"buttonChildren":[16],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"locale":[1],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"apiPath":[1,"api-path"]}]]]], options);
   });
 };
 

package/dist/esm/{package-b2424850.js → package-cae9f186.js}

@@ -1,3 +1,3 @@
-const version = "2.44.2";
+const version = "2.46.0";
 
 export { version as v };