var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
  if (kind === "m")
    throw new TypeError("Private method is not writable");
  if (kind === "a" && !f)
    throw new TypeError("Private accessor was defined without a setter");
  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
    throw new TypeError("Cannot write private member to an object whose class did not declare it");
  return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
};
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
  if (kind === "a" && !f)
    throw new TypeError("Private accessor was defined without a getter");
  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
    throw new TypeError("Cannot read private member from an object whose class did not declare it");
  return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var _KlevuQuicksearch_instances, _KlevuQuicksearch_searchField, _KlevuQuicksearch_resultObject, _KlevuQuicksearch_imagePickerPopupRef, _KlevuQuicksearch_searchTerm, _KlevuQuicksearch_noResultsOptions, _KlevuQuicksearch_emitChangedData, _KlevuQuicksearch_setNoResults, _KlevuQuicksearch_searchPageChange, _KlevuQuicksearch_handleUrlRedirects, _KlevuQuicksearch_onPopupOpen, _KlevuQuicksearch_startSearch, _KlevuQuicksearch_sizeChange, _KlevuQuicksearch_handleImageSelection, _KlevuQuicksearch_renderResultPage, _KlevuQuicksearch_renderNoResultsPage, _KlevuQuicksearch_renderBanners;
import { KlevuFetch, KlevuLastClickedProducts, trendingProducts, KlevuUploadImageForSearch, } from "@klevu/core";
import { Fragment, h, Host } from "@stencil/core";
import { KlevuInit } from "../klevu-init/klevu-init";
import { getTranslation } from "../../utils/getTranslation";
import { stringConcat } from "../../utils/stringConcat";
import { getKMCSettings } from "../../utils/getKMCSettings";
import { partsExports } from "../../utils/partsExports";
/**
 * Full app to create search bar that popups trending products and search results.
 *
 * @slot content - Popup content
 * @slot search-products - Slot to replace search results listings
 * @slot trending-products - Slot to replace trending products listings
 * @slot last-clicked-products - Slot to replace last clicked products
 * @slot noResults - Show message when no results found
 * @slot topbanners - Top banner content
 * @slot bottombanners - Bottom banner content
 *
 * @csspart quicksearch-content - The popup container
 * @csspart quicksearch-sidepanel - Sidepanel container sidepanel
 * @csspart quicksearch-main-area - Main content area container
 */
export class KlevuQuicksearch {
  constructor() {
    _KlevuQuicksearch_instances.add(this);
    _KlevuQuicksearch_searchField.set(this, void 0);
    _KlevuQuicksearch_resultObject.set(this, void 0);
    _KlevuQuicksearch_imagePickerPopupRef.set(this, void 0);
    _KlevuQuicksearch_searchTerm.set(this, "");
    _KlevuQuicksearch_noResultsOptions.set(this, void 0);
    this.fallbackTerm = undefined;
    this.term = undefined;
    this.popupAnchor = "bottom-end";
    this.searchCategories = undefined;
    this.searchCmsPages = undefined;
    this.placeholder = undefined;
    this.searchText = undefined;
    this.searchFieldVariant = "pill";
    this.resultVariant = "simple";
    this.simpleResultCount = 3;
    this.popularProductsCount = 10;
    this.fullResultCount = 9;
    this.tSearchResults = getTranslation("quicksearch.tSearchResults");
    this.tStartChat = getTranslation("quicksearch.tStartChat");
    this.tCategoriesCaption = getTranslation("quicksearch.tCategoriesCaption");
    this.tTrendingCaption = undefined;
    this.tPopularProductsTitle = undefined;
    this.tLastClickedProductsCaption = undefined;
    this.showRatings = undefined;
    this.showRatingsCount = undefined;
    this.hideTrendingProducts = undefined;
    this.hideRecentlyViewedProducts = undefined;
    this.hidePopularSearches = undefined;
    this.hideRecentSearches = undefined;
    this.usePersonalisation = undefined;
    this.useKlaviyo = undefined;
    this.hidePopularKeywordsOnNoResultsPage = undefined;
    this.tPopularProductsTitleOnNoResultsPage = undefined;
    this.hideTrendingProductsOnNoResultsPage = undefined;
    this.urlRedirects = undefined;
    this.enableImageSearch = false;
    this.showVariantsCount = false;
    this.products = [];
    this.trendingProducts = [];
    this.suggestions = [];
    this.cmsPages = undefined;
    this.categories = undefined;
    this.queryResult = undefined;
    this.searchSort = undefined;
    this.lastClickedProducts = undefined;
    this.activeTab = "trending";
    this.chat = false;
    this.noResultsMessage = "";
    this.noResultsBannerDetails = [];
    this.searchResultTopBanners = [];
    this.searchResultBottomBanners = [];
    this.isUploadingImage = false;
    this.currentViewPortSize = undefined;
  }
  async onTextChange(event) {
    if (event.detail.length === 0) {
      this.suggestions = [];
      this.products = [];
      __classPrivateFieldSet(this, _KlevuQuicksearch_searchTerm, "", "f");
    }
  }
  async onResults(event) {
    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
    __classPrivateFieldSet(this, _KlevuQuicksearch_searchTerm, ((_a = event.detail.search) === null || _a === void 0 ? void 0 : _a.query.meta.searchedTerm) || "", "f");
    // Reset the values before assigning new based on logic
    this.noResultsMessage = "";
    this.noResultsBannerDetails = [];
    this.products = [];
    if (((_b = event.detail.search) === null || _b === void 0 ? void 0 : _b.records.length) === 0) {
      if (((_c = event.detail.fallback) === null || _c === void 0 ? void 0 : _c.records) && ((_d = event.detail.fallback) === null || _d === void 0 ? void 0 : _d.records.length) > 0) {
        __classPrivateFieldSet(this, _KlevuQuicksearch_resultObject, event.detail.fallback, "f");
        this.products = (_e = event.detail.fallback) === null || _e === void 0 ? void 0 : _e.records;
      }
      else {
        __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_setNoResults).call(this);
      }
    }
    else {
      __classPrivateFieldSet(this, _KlevuQuicksearch_resultObject, event.detail.search, "f");
      this.products = (_f = event.detail.search) === null || _f === void 0 ? void 0 : _f.records;
    }
    this.cmsPages = (_g = event.detail.cms) === null || _g === void 0 ? void 0 : _g.records;
    this.categories = (_h = event.detail.category) === null || _h === void 0 ? void 0 : _h.records;
    this.queryResult = await ((_j = __classPrivateFieldGet(this, _KlevuQuicksearch_searchField, "f")) === null || _j === void 0 ? void 0 : _j.getQueryResult("search"));
    const allBanners = (_l = (await ((_k = event.detail.search) === null || _k === void 0 ? void 0 : _k.getBanners({ searchType: "quicksearch" })))) !== null && _l !== void 0 ? _l : [];
    this.searchResultTopBanners = allBanners.filter((b) => b.position === "top");
    this.searchResultBottomBanners = allBanners.filter((b) => b.position === "bottom");
    __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_emitChangedData).call(this);
  }
  async onSuggestions(event) {
    this.suggestions = event.detail;
  }
  onProductClick(event) {
    var _a, _b, _c;
    const { product } = event.detail;
    (_a = this.popup) === null || _a === void 0 ? void 0 : _a.closeModal();
    if (product.id) {
      (_c = (_b = __classPrivateFieldGet(this, _KlevuQuicksearch_resultObject, "f")) === null || _b === void 0 ? void 0 : _b.searchClickEvent) === null || _c === void 0 ? void 0 : _c.call(_b, {
        productId: product.id,
        variantId: product.variantId || product.id,
      });
    }
  }
  onChatLayoutClose() {
    this.chat = false;
  }
  onKlevuSearchclick(event) {
    setTimeout(() => __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_handleUrlRedirects).call(this, event.detail), 200);
  }
  async termChanged() {
    if (this.term !== undefined) {
      __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_startSearch).call(this, this.term);
    }
  }
  async connectedCallback() {
    var _a, _b, _c, _d, _e, _f;
    await KlevuInit.ready();
    const settings = getKMCSettings();
    if (settings) {
      __classPrivateFieldSet(this, _KlevuQuicksearch_noResultsOptions, (_a = settings.klevu_uc_userOptions) === null || _a === void 0 ? void 0 : _a.noResultsOptions, "f");
      if (this.showRatings === undefined) {
        this.showRatings = ((_b = settings.klevu_uc_userOptions) === null || _b === void 0 ? void 0 : _b.showRatingsOnQuickSearches) || false;
      }
      if (this.showRatingsCount === undefined) {
        this.showRatingsCount = ((_c = settings.klevu_uc_userOptions) === null || _c === void 0 ? void 0 : _c.showRatingsCountOnQuickSearches) || false;
      }
      if (this.usePersonalisation === undefined && (settings === null || settings === void 0 ? void 0 : settings.klevu_uc_userOptions.enablePersonalisationInSearch)) {
        this.usePersonalisation = true;
      }
      if (this.hideRecentlyViewedProducts === undefined) {
        this.hideRecentlyViewedProducts = !(settings === null || settings === void 0 ? void 0 : settings.klevu_uc_userOptions.showRecentlyViewedItems);
      }
      if (this.tLastClickedProductsCaption === undefined) {
        this.tLastClickedProductsCaption =
          (_d = settings === null || settings === void 0 ? void 0 : settings.klevu_uc_userOptions.showRecentlyViewedItemsCaption) !== null && _d !== void 0 ? _d : getTranslation("quicksearch.tLastClickedProductsCaption");
      }
      if (this.tTrendingCaption === undefined) {
        this.tTrendingCaption =
          (_e = settings === null || settings === void 0 ? void 0 : settings.klevu_uc_userOptions.showTrendingProductsCaption) !== null && _e !== void 0 ? _e : getTranslation("quicksearch.tTrendingCaption");
      }
      if (this.hideRecentSearches === undefined) {
        this.hideRecentSearches = !(settings === null || settings === void 0 ? void 0 : settings.klevu_showRecentSerches);
      }
      if (this.hidePopularSearches === undefined) {
        this.hidePopularSearches = !(settings === null || settings === void 0 ? void 0 : settings.klevu_showPopularSearches);
      }
      if (this.hideTrendingProducts === undefined) {
        this.hideTrendingProducts = !(settings === null || settings === void 0 ? void 0 : settings.klevu_uc_userOptions.showTrendingProducts);
      }
      // No results page settings
      if (this.tPopularProductsTitleOnNoResultsPage === undefined) {
        this.tPopularProductsTitleOnNoResultsPage =
          (_f = settings === null || settings === void 0 ? void 0 : settings.klevu_uc_userOptions.noResultsOptions.productsHeading) !== null && _f !== void 0 ? _f : getTranslation("quicksearch.tPopularProductsTitle");
      }
      if (this.hideTrendingProductsOnNoResultsPage === undefined) {
        this.hideTrendingProductsOnNoResultsPage = !(settings === null || settings === void 0 ? void 0 : settings.klevu_uc_userOptions.noResultsOptions.showPopularProducts);
      }
      if (this.hidePopularKeywordsOnNoResultsPage === undefined) {
        this.hidePopularKeywordsOnNoResultsPage = !(settings === null || settings === void 0 ? void 0 : settings.klevu_uc_userOptions.noResultsOptions.showPopularKeywords);
      }
    }
    if (this.hideTrendingProducts) {
      if (this.hideRecentSearches) {
        this.activeTab = "";
      }
      else {
        this.activeTab = "last";
      }
    }
    if (!this.hideTrendingProducts || !this.hideTrendingProductsOnNoResultsPage) {
      const trendingProductsQuery = await KlevuFetch(trendingProducts({
        limit: this.popularProductsCount,
      }));
      const resultObject = trendingProductsQuery.queriesById("trendingProducts");
      if (resultObject) {
        this.trendingProducts = resultObject.records;
        __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_emitChangedData).call(this);
      }
    }
  }
  render() {
    var _a;
    return (h(Host, null, h("klevu-util-viewport", { onKlevuSizeChanged: __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_sizeChange).bind(this), ref: (el) => (this.viewportUtil = el) }), h("klevu-popup", { anchor: this.popupAnchor, ref: (el) => (this.popup = el), onKlevuPopupOpen: __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_onPopupOpen).bind(this), elevation: 2, exportparts: partsExports("klevu-popup") }, h("klevu-search-field", { term: this.term, ref: (el) => (__classPrivateFieldSet(this, _KlevuQuicksearch_searchField, el, "f")), limit: this.resultVariant === "simple" ? this.simpleResultCount : this.fullResultCount, sort: this.searchSort, slot: "origin", searchProducts: true, searchSuggestions: true, tSearchText: this.searchText, tPlaceholder: this.placeholder, "fallback-term": this.fallbackTerm, searchCmsPages: this.searchCmsPages, searchCategories: this.searchCategories, variant: this.searchFieldVariant, usePersonalisation: this.usePersonalisation, useKlaviyo: this.useKlaviyo }, this.enableImageSearch && (h("div", { slot: "end-of-input" }, h("klevu-popup", { class: "imagesearch", exportparts: partsExports("klevu-popup"), anchor: "bottom-end", ref: (el) => (__classPrivateFieldSet(this, _KlevuQuicksearch_imagePickerPopupRef, el, "f")) }, h("div", { class: "image-picker", slot: "content" }, h("klevu-image-picker", { isLoading: this.isUploadingImage, onKlevuImageSelected: __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_handleImageSelection).bind(this) })), h("klevu-icon", { slot: "origin", name: "photo_camera", class: "photo-camera" }))))), h("div", { class: "content", slot: "content", part: "quicksearch-content" }, ((_a = this.products) !== null && _a !== void 0 ? _a : []).length > 0 ? __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_renderResultPage).call(this) : __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_renderNoResultsPage).call(this))), this.chat && h("klevu-moi", null)));
  }
  static get is() { return "klevu-quicksearch"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["klevu-quicksearch.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["klevu-quicksearch.css"]
    };
  }
  static get properties() {
    return {
      "fallbackTerm": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "What term should be used if there isn't enough results"
        },
        "attribute": "fallback-term",
        "reflect": false
      },
      "term": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Load with default term"
        },
        "attribute": "term",
        "reflect": false
      },
      "popupAnchor": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "Placement",
          "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\" | undefined",
          "references": {
            "Placement": {
              "location": "import",
              "path": "@floating-ui/dom",
              "id": ""
            }
          }
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Anchor popup to witch side"
        },
        "attribute": "popup-anchor",
        "reflect": false,
        "defaultValue": "\"bottom-end\""
      },
      "searchCategories": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Should component search for categories too"
        },
        "attribute": "search-categories",
        "reflect": false
      },
      "searchCmsPages": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Should component search for CMS pages too"
        },
        "attribute": "search-cms-pages",
        "reflect": false
      },
      "placeholder": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Placeholder for input text"
        },
        "attribute": "placeholder",
        "reflect": false
      },
      "searchText": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Text of search button"
        },
        "attribute": "search-text",
        "reflect": false
      },
      "searchFieldVariant": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "SearchFieldVariant",
          "resolved": "\"default\" | \"pill\"",
          "references": {
            "SearchFieldVariant": {
              "location": "import",
              "path": "../klevu-search-field/klevu-search-field",
              "id": "src/components/klevu-search-field/klevu-search-field.tsx::SearchFieldVariant"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Change variant of the search field"
        },
        "attribute": "search-field-variant",
        "reflect": false,
        "defaultValue": "\"pill\""
      },
      "resultVariant": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "KlevuQuicksearchResultVarint",
          "resolved": "\"full\" | \"simple\"",
          "references": {
            "KlevuQuicksearchResultVarint": {
              "location": "local",
              "path": "/home/runner/work/frontend-sdk/frontend-sdk/packages/klevu-ui/src/components/klevu-quicksearch/klevu-quicksearch.tsx",
              "id": "src/components/klevu-quicksearch/klevu-quicksearch.tsx::KlevuQuicksearchResultVarint"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Change variant of the search results"
        },
        "attribute": "result-variant",
        "reflect": false,
        "defaultValue": "\"simple\""
      },
      "simpleResultCount": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "How many products to show in simple variant"
        },
        "attribute": "simple-result-count",
        "reflect": false,
        "defaultValue": "3"
      },
      "popularProductsCount": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "How many products to show in Popular products section"
        },
        "attribute": "popular-products-count",
        "reflect": false,
        "defaultValue": "10"
      },
      "fullResultCount": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "How many products to show in full variant"
        },
        "attribute": "full-result-count",
        "reflect": false,
        "defaultValue": "9"
      },
      "tSearchResults": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Title of search results"
        },
        "attribute": "t-search-results",
        "reflect": false,
        "defaultValue": "getTranslation(\"quicksearch.tSearchResults\")"
      },
      "tStartChat": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Title of button to start Moi session"
        },
        "attribute": "t-start-chat",
        "reflect": false,
        "defaultValue": "getTranslation(\"quicksearch.tStartChat\")"
      },
      "tCategoriesCaption": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Title of categories section"
        },
        "attribute": "t-categories-caption",
        "reflect": false,
        "defaultValue": "getTranslation(\"quicksearch.tCategoriesCaption\")"
      },
      "tTrendingCaption": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Trending tab caption\nSupports showing the count in place of %s in the value\neg: `Trending (%s)` with count of 2 will lead to `Trending (2)`."
        },
        "attribute": "t-trending-caption",
        "reflect": false
      },
      "tPopularProductsTitle": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Popular products section heading"
        },
        "attribute": "t-popular-products-title",
        "reflect": false
      },
      "tLastClickedProductsCaption": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Recently clicked tab caption\nSupports showing the count in place of %s in the value\neg: `Recently Searched (%s)` with count of 2 will lead to `Recently Searched (2)`."
        },
        "attribute": "t-last-clicked-products-caption",
        "reflect": false
      },
      "showRatings": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Show ratings"
        },
        "attribute": "show-ratings",
        "reflect": false
      },
      "showRatingsCount": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Show ratings count"
        },
        "attribute": "show-ratings-count",
        "reflect": false
      },
      "hideTrendingProducts": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Hide trending products"
        },
        "attribute": "hide-trending-products",
        "reflect": false
      },
      "hideRecentlyViewedProducts": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Hide recently viewed products"
        },
        "attribute": "hide-recently-viewed-products",
        "reflect": false
      },
      "hidePopularSearches": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Hide popular keywords"
        },
        "attribute": "hide-popular-searches",
        "reflect": false
      },
      "hideRecentSearches": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Hide recent searches"
        },
        "attribute": "hide-recent-searches",
        "reflect": false
      },
      "usePersonalisation": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Enable personalisation"
        },
        "attribute": "use-personalisation",
        "reflect": false
      },
      "useKlaviyo": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Enables Klaviyo click tracking"
        },
        "attribute": "use-klaviyo",
        "reflect": false
      },
      "hidePopularKeywordsOnNoResultsPage": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Hide popular keywords on no results page"
        },
        "attribute": "hide-popular-keywords-on-no-results-page",
        "reflect": false
      },
      "tPopularProductsTitleOnNoResultsPage": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Popular products section heading shown on no results page"
        },
        "attribute": "t-popular-products-title-on-no-results-page",
        "reflect": false
      },
      "hideTrendingProductsOnNoResultsPage": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "HHide trending products on no results page"
        },
        "attribute": "hide-trending-products-on-no-results-page",
        "reflect": false
      },
      "urlRedirects": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "KMCMapsRootObject[\"klevu_keywordUrlMap\"]",
          "resolved": "KlevuKeywordUrlMap[] | undefined",
          "references": {
            "KMCMapsRootObject": {
              "location": "import",
              "path": "@klevu/core",
              "id": "../klevu-core/dist/cjs/index.d.ts::KMCMapsRootObject"
            }
          }
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Pass your own redirect urls for a keyword"
        }
      },
      "enableImageSearch": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Enable image search feature"
        },
        "attribute": "enable-image-search",
        "reflect": false,
        "defaultValue": "false"
      },
      "showVariantsCount": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Show variants count"
        },
        "attribute": "show-variants-count",
        "reflect": false,
        "defaultValue": "false"
      }
    };
  }
  static get states() {
    return {
      "products": {},
      "trendingProducts": {},
      "suggestions": {},
      "cmsPages": {},
      "categories": {},
      "queryResult": {},
      "searchSort": {},
      "lastClickedProducts": {},
      "activeTab": {},
      "chat": {},
      "noResultsMessage": {},
      "noResultsBannerDetails": {},
      "searchResultTopBanners": {},
      "searchResultBottomBanners": {},
      "isUploadingImage": {},
      "currentViewPortSize": {}
    };
  }
  static get events() {
    return [{
        "method": "klevuData",
        "name": "klevuData",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "When the data in the component changes. This event can be used to replace\nwhole rendering of products when used with slots properly."
        },
        "complexType": {
          "original": "KlevuQuicksearchDataEvent",
          "resolved": "{ trendingProducts?: KlevuRecord[] | undefined; lastClickedProducts?: KlevuRecord[] | undefined; searchResult?: KlevuQueryResult | undefined; }",
          "references": {
            "KlevuQuicksearchDataEvent": {
              "location": "local",
              "path": "/home/runner/work/frontend-sdk/frontend-sdk/packages/klevu-ui/src/components/klevu-quicksearch/klevu-quicksearch.tsx",
              "id": "src/components/klevu-quicksearch/klevu-quicksearch.tsx::KlevuQuicksearchDataEvent"
            }
          }
        }
      }, {
        "method": "klevuSearch",
        "name": "klevuSearch",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "When user clicks search button. Returns the search term.\nThis event is emitted when there is no url matched for redirects"
        },
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        }
      }, {
        "method": "klevuImageSearch",
        "name": "klevuImageSearch",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "This event is emitted once the image to be used for search is\nuploaded. The event contains the url to be passed to search api."
        },
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        }
      }, {
        "method": "klevuRedirect",
        "name": "klevuRedirect",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "Will be emitted when there is a url match for redirects.\nYou can override the default behaviour of redirects by\npreventing default of this event"
        },
        "complexType": {
          "original": "KMCMapsRootObject[\"klevu_keywordUrlMap\"][0]",
          "resolved": "KlevuKeywordUrlMap",
          "references": {
            "KMCMapsRootObject": {
              "location": "import",
              "path": "@klevu/core",
              "id": "../klevu-core/dist/cjs/index.d.ts::KMCMapsRootObject"
            }
          }
        }
      }];
  }
  static get watchers() {
    return [{
        "propName": "term",
        "methodName": "termChanged"
      }];
  }
  static get listeners() {
    return [{
        "name": "klevuTextChanged",
        "method": "onTextChange",
        "target": undefined,
        "capture": false,
        "passive": false
      }, {
        "name": "klevuSearchResults",
        "method": "onResults",
        "target": undefined,
        "capture": false,
        "passive": false
      }, {
        "name": "klevuSearchSuggestions",
        "method": "onSuggestions",
        "target": undefined,
        "capture": false,
        "passive": false
      }, {
        "name": "klevuProductClick",
        "method": "onProductClick",
        "target": undefined,
        "capture": false,
        "passive": false
      }, {
        "name": "klevuChatLayoutClose",
        "method": "onChatLayoutClose",
        "target": undefined,
        "capture": false,
        "passive": false
      }, {
        "name": "klevuSearchClick",
        "method": "onKlevuSearchclick",
        "target": undefined,
        "capture": false,
        "passive": false
      }];
  }
}
_KlevuQuicksearch_searchField = new WeakMap(), _KlevuQuicksearch_resultObject = new WeakMap(), _KlevuQuicksearch_imagePickerPopupRef = new WeakMap(), _KlevuQuicksearch_searchTerm = new WeakMap(), _KlevuQuicksearch_noResultsOptions = new WeakMap(), _KlevuQuicksearch_instances = new WeakSet(), _KlevuQuicksearch_emitChangedData = function _KlevuQuicksearch_emitChangedData() {
  this.klevuData.emit({
    lastClickedProducts: this.lastClickedProducts,
    trendingProducts: this.trendingProducts,
    searchResult: this.queryResult,
  });
}, _KlevuQuicksearch_setNoResults = function _KlevuQuicksearch_setNoResults() {
  var _a, _b, _c, _d, _e;
  this.noResultsMessage = ((_b = (_a = __classPrivateFieldGet(this, _KlevuQuicksearch_noResultsOptions, "f")) === null || _a === void 0 ? void 0 : _a.messages.find((m) => m.showForTerms === null)) === null || _b === void 0 ? void 0 : _b.message) || "";
  this.noResultsBannerDetails =
    ((_c = __classPrivateFieldGet(this, _KlevuQuicksearch_noResultsOptions, "f")) === null || _c === void 0 ? void 0 : _c.banners.filter((m) => m.showOnQuickSearch && m.showForTerms === null)) || [];
  if (__classPrivateFieldGet(this, _KlevuQuicksearch_searchTerm, "f")) {
    const searchTermSpecificMessage = (_d = __classPrivateFieldGet(this, _KlevuQuicksearch_noResultsOptions, "f")) === null || _d === void 0 ? void 0 : _d.messages.find((m) => m.showForTerms && m.showForTerms.includes(__classPrivateFieldGet(this, _KlevuQuicksearch_searchTerm, "f")));
    if (searchTermSpecificMessage)
      this.noResultsMessage = (searchTermSpecificMessage === null || searchTermSpecificMessage === void 0 ? void 0 : searchTermSpecificMessage.message) || "";
    const searchTermSpecificBanner = ((_e = __classPrivateFieldGet(this, _KlevuQuicksearch_noResultsOptions, "f")) === null || _e === void 0 ? void 0 : _e.banners.filter((m) => m.showOnQuickSearch && m.showForTerms && m.showForTerms.includes(__classPrivateFieldGet(this, _KlevuQuicksearch_searchTerm, "f")))) || [];
    if (searchTermSpecificBanner.length > 0)
      this.noResultsBannerDetails.unshift(...searchTermSpecificBanner);
  }
}, _KlevuQuicksearch_searchPageChange = async function _KlevuQuicksearch_searchPageChange(event) {
  var _a;
  if (!__classPrivateFieldGet(this, _KlevuQuicksearch_searchField, "f")) {
    return;
  }
  __classPrivateFieldGet(this, _KlevuQuicksearch_searchField, "f").getPage("search", event.detail - 1);
  this.queryResult = await ((_a = __classPrivateFieldGet(this, _KlevuQuicksearch_searchField, "f")) === null || _a === void 0 ? void 0 : _a.getQueryResult("search"));
  __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_emitChangedData).call(this);
}, _KlevuQuicksearch_handleUrlRedirects = async function _KlevuQuicksearch_handleUrlRedirects(term) {
  var _a, _b, _c, _d;
  let redirect;
  if (this.urlRedirects === undefined && ((_a = __classPrivateFieldGet(this, _KlevuQuicksearch_resultObject, "f")) === null || _a === void 0 ? void 0 : _a.getRedirects)) {
    const redirects = await __classPrivateFieldGet(this, _KlevuQuicksearch_resultObject, "f").getRedirects();
    if (redirects && redirects.length > 0) {
      redirect = redirects[0];
    }
  }
  else {
    redirect = (_b = this.urlRedirects) === null || _b === void 0 ? void 0 : _b.find((redirects) => redirects.keywords.includes(term));
  }
  if (redirect) {
    const emittedEvent = this.klevuRedirect.emit(redirect);
    if (!emittedEvent.defaultPrevented) {
      window.location.href = redirect.url;
    }
  }
  else {
    this.klevuSearch.emit(term);
  }
  (_c = this.popup) === null || _c === void 0 ? void 0 : _c.closeModal();
  (_d = __classPrivateFieldGet(this, _KlevuQuicksearch_searchField, "f")) === null || _d === void 0 ? void 0 : _d.blur();
}, _KlevuQuicksearch_onPopupOpen = function _KlevuQuicksearch_onPopupOpen() {
  var _a, _b, _c, _d, _e;
  this.lastClickedProducts = KlevuLastClickedProducts.getProducts(3);
  __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_emitChangedData).call(this);
  (_e = (_d = (_c = (_b = (_a = __classPrivateFieldGet(this, _KlevuQuicksearch_searchField, "f")) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector("klevu-textfield")) === null || _c === void 0 ? void 0 : _c.shadowRoot) === null || _d === void 0 ? void 0 : _d.querySelector("input")) === null || _e === void 0 ? void 0 : _e.focus();
}, _KlevuQuicksearch_startSearch = function _KlevuQuicksearch_startSearch(term) {
  var _a;
  this.products = [undefined, undefined, undefined];
  (_a = __classPrivateFieldGet(this, _KlevuQuicksearch_searchField, "f")) === null || _a === void 0 ? void 0 : _a.makeSearch(term);
}, _KlevuQuicksearch_sizeChange = function _KlevuQuicksearch_sizeChange(event) {
  this.currentViewPortSize = event.detail;
}, _KlevuQuicksearch_handleImageSelection = async function _KlevuQuicksearch_handleImageSelection(event) {
  var _a;
  this.isUploadingImage = true;
  const imageUrl = await KlevuUploadImageForSearch(event.detail.image);
  this.klevuImageSearch.emit(imageUrl);
  this.isUploadingImage = false;
  (_a = __classPrivateFieldGet(this, _KlevuQuicksearch_imagePickerPopupRef, "f")) === null || _a === void 0 ? void 0 : _a.closeModal();
}, _KlevuQuicksearch_renderResultPage = function _KlevuQuicksearch_renderResultPage() {
  var _a, _b, _c, _d;
  const isMobile = ((_a = this.currentViewPortSize) === null || _a === void 0 ? void 0 : _a.name) === "xs" || ((_b = this.currentViewPortSize) === null || _b === void 0 ? void 0 : _b.name) === "sm";
  return (h(Fragment, null, h("aside", { part: "quicksearch-sidepanel" }, h("klevu-suggestions-list", { exportparts: partsExports("klevu-suggestions-list"), suggestions: this.suggestions, onKlevuSuggestionClicked: (event) => __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_startSearch).call(this, event.detail) }), this.cmsPages && this.cmsPages.length > 0 && h("klevu-cms-list", { pages: this.cmsPages, link: true }), this.categories && this.categories.length > 0 && (h("klevu-cms-list", { exportparts: partsExports("klevu-cms-list"), pages: this.categories, tCaption: this.tCategoriesCaption, link: true }))), h("section", { part: "quicksearch-main-area" }, this.resultVariant === "full" && (h(Fragment, null, h("div", { class: "resultheader" }, h("klevu-typography", { variant: "h3" }, "Search results"), h("klevu-sort", { variant: "inline", onKlevuSortChanged: (event) => (this.searchSort = event.detail) })), h("slot", { name: "topbanners" }, h("div", { class: "topbanners" }, this.searchResultTopBanners.map((b) => (h("klevu-banner", { imageUrl: b.bannerImg, linkUrl: b.redirectUrl, altText: b.bannerAltTag }))))), h("klevu-product-grid", { itemsPerRow: isMobile ? undefined : 3 }, h("slot", { name: "search-products" }, (_c = this.products) === null || _c === void 0 ? void 0 : _c.map((p) => (h("klevu-product", { product: p, showVariantsCount: this.showVariantsCount, fixedWidth: true, variant: isMobile ? "line" : "small", exportparts: partsExports("klevu-product"), showRatings: this.showRatings, showRatingsCount: this.showRatingsCount }))))), h("klevu-pagination", { exportparts: partsExports("klevu-pagination"), queryResult: this.queryResult, onKlevuPaginationChange: __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_searchPageChange).bind(this) }), h("slot", { name: "bottombanners" }, h("div", { class: "bottombanners" }, this.searchResultBottomBanners.map((b) => (h("klevu-banner", { imageUrl: b.bannerImg, linkUrl: b.redirectUrl, altText: b.bannerAltTag }))))))), this.resultVariant === "simple" && (h(Fragment, null, h("div", { class: "resultheader" }, h("klevu-typography", { variant: "h3" }, this.tSearchResults)), h("slot", { name: "topbanners" }, h("div", { class: "topbanners" }, this.searchResultTopBanners.map((b) => (h("klevu-banner", { imageUrl: b.bannerImg, linkUrl: b.redirectUrl, altText: b.bannerAltTag }))))), h("div", { class: "lineproducts" }, h("slot", { name: "search-products" }, (_d = this.products) === null || _d === void 0 ? void 0 : _d.map((p) => (h("klevu-product", { product: p, showVariantsCount: this.showVariantsCount, variant: "line", exportparts: partsExports("klevu-product"), showRatings: this.showRatings, showRatingsCount: this.showRatingsCount }))))), h("slot", { name: "bottombanners" }, h("div", { class: "bottombanners" }, this.searchResultBottomBanners.map((b) => (h("klevu-banner", { imageUrl: b.bannerImg, linkUrl: b.redirectUrl, altText: b.bannerAltTag }))))))))));
}, _KlevuQuicksearch_renderNoResultsPage = function _KlevuQuicksearch_renderNoResultsPage() {
  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
  const isNoResultsPage = !!__classPrivateFieldGet(this, _KlevuQuicksearch_searchTerm, "f");
  return (h(Fragment, null, h("aside", { part: "quicksearch-sidepanel" }, ((!this.hidePopularSearches && !isNoResultsPage) ||
    (!this.hidePopularKeywordsOnNoResultsPage && isNoResultsPage)) && (h("klevu-popular-searches", { exportparts: partsExports("klevu-popular-searches"), onKlevuPopularSearchClicked: (event) => __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_startSearch).call(this, event.detail) })), !this.hideRecentSearches && !isNoResultsPage && (h("klevu-latest-searches", { exportparts: partsExports("klevu-latest-searches"), onKlevuLastSearchClicked: (event) => __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_startSearch).call(this, event.detail) }))), h("section", { part: "quicksearch-main-area" }, h("slot", { name: "noResults" }, isNoResultsPage && this.noResultsMessage ? (h("p", { class: "noResultsMessage" }, h("klevu-typography", { variant: "body-s" }, this.noResultsMessage))) : null, h("div", { class: "tabrow" }, ((!this.hideTrendingProducts && !isNoResultsPage) ||
    (!this.hideTrendingProductsOnNoResultsPage && isNoResultsPage)) && (h("klevu-tab", { exportparts: partsExports("klevu-tab"), caption: stringConcat((_a = this.tTrendingCaption) !== null && _a !== void 0 ? _a : getTranslation("quicksearch.tTrendingCaption"), [
      `${(_c = (_b = this.trendingProducts) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0}`,
    ]), active: this.activeTab === "trending", onClick: () => (this.activeTab = "trending") })), !this.hideRecentlyViewedProducts &&
    !isNoResultsPage &&
    this.lastClickedProducts &&
    this.lastClickedProducts.length > 0 && (h("klevu-tab", { exportparts: partsExports("klevu-tab"), caption: stringConcat((_d = this.tLastClickedProductsCaption) !== null && _d !== void 0 ? _d : getTranslation("quicksearch.tLastClickedProductsCaption"), [`${(_f = (_e = this.lastClickedProducts) === null || _e === void 0 ? void 0 : _e.length) !== null && _f !== void 0 ? _f : 0}`]), active: this.activeTab === "last", onClick: () => {
      var _a;
      if (((_a = this.lastClickedProducts) === null || _a === void 0 ? void 0 : _a.length) === 0) {
        return;
      }
      this.activeTab = "last";
    }, disabled: ((_g = this.lastClickedProducts) === null || _g === void 0 ? void 0 : _g.length) === 0 }))), !this.hideTrendingProducts && this.activeTab === "trending" && (h(Fragment, null, isNoResultsPage && (h("klevu-typography", { variant: "body-s" }, this.tPopularProductsTitleOnNoResultsPage)), h("slot", { name: "trending-products" }, (_h = this.trendingProducts) === null || _h === void 0 ? void 0 : _h.map((p) => (h("klevu-product", { product: p, variant: "line", exportparts: partsExports("klevu-product") })))))), !this.hideRecentlyViewedProducts &&
    this.activeTab === "last" &&
    this.lastClickedProducts &&
    this.lastClickedProducts.length > 0 && (h(Fragment, null, h("slot", { name: "last-clicked-products" }, (_j = this.lastClickedProducts) === null || _j === void 0 ? void 0 : _j.map((p) => (h("klevu-product", { product: p, variant: "line", exportparts: partsExports("klevu-product") })))))), __classPrivateFieldGet(this, _KlevuQuicksearch_instances, "m", _KlevuQuicksearch_renderBanners).call(this)))));
}, _KlevuQuicksearch_renderBanners = function _KlevuQuicksearch_renderBanners() {
  return this.noResultsBannerDetails.map((banner) => (h("a", { href: banner.redirectUrl }, h("img", { class: "noResultsBannerImage", src: banner.bannerImageUrl, alt: banner.bannerAltTag, title: banner.bannerAltTag }))));
};
//# sourceMappingURL=klevu-quicksearch.js.map
