@sledge-app/react-instant-search 2.0.8 → 2.0.10

package/dist/sledge-react-instant-search.js

@@ -1,7 +1,7 @@
 import { j as jsxRuntimeExports, $ as $cb5cc270b50c6fcd$export$be92b6f5f03c0fe9, a as $cb5cc270b50c6fcd$export$41fb9f06171c75f4, b as $cb5cc270b50c6fcd$export$602eac185826482c, c as $cb5cc270b50c6fcd$export$7c6e2c02157bb7d2, d as $cb5cc270b50c6fcd$export$f39c2d165cd861fe, e as $cb5cc270b50c6fcd$export$21b07c8f274aebd5, f as $67824d98245208a0$export$be92b6f5f03c0fe9, g as $67824d98245208a0$export$adb584737d712b70, h as $e698a72e93240346$export$be92b6f5f03c0fe9, i as $e698a72e93240346$export$adb584737d712b70, k as $d94698215c4408a7$export$be92b6f5f03c0fe9, l as $faa2e61a3361514f$export$be92b6f5f03c0fe9, m as $faa2e61a3361514f$export$13921ac0cc260818, n as $faa2e61a3361514f$export$9a58ef0d7ad3278c, o as $faa2e61a3361514f$export$6521433ed15a34db, p as $f99a8c78507165f7$export$be92b6f5f03c0fe9, q as $f99a8c78507165f7$export$6d08773d2e66f8f2, r as $f99a8c78507165f7$export$adb584737d712b70, s as $cc7e05a45900e73f$export$6d08773d2e66f8f2, t as $cc7e05a45900e73f$export$d6e5bf9c43ea9319, u as $cc7e05a45900e73f$export$c3468e2714d175fa, v as $cc7e05a45900e73f$export$be92b6f5f03c0fe9, w as $cc7e05a45900e73f$export$41fb9f06171c75f4, x as $cc7e05a45900e73f$export$4c8d1a57a761ef94, y as $cc7e05a45900e73f$export$f04a61298a47a40f, z as $cc7e05a45900e73f$export$602eac185826482c, A as $cc7e05a45900e73f$export$7c6e2c02157bb7d2, B as $cc7e05a45900e73f$export$2f60d3ec9ad468f2, C as $cc7e05a45900e73f$export$d5c6c08dc2d3ca7, D as $cc7e05a45900e73f$export$bf1aedc3039c8d63, E as motion, F as client, G as $d94698215c4408a7$export$a455218a85c89869, H as $d94698215c4408a7$export$7a7fa4424cb20976, I as $d94698215c4408a7$export$f69c19e57285b83a, J as $a093c7e1ec25a057$export$2881499e37b75b9a, K as $a093c7e1ec25a057$export$be92b6f5f03c0fe9, L as $a093c7e1ec25a057$export$41fb9f06171c75f4, M as $a093c7e1ec25a057$export$602eac185826482c, N as $a093c7e1ec25a057$export$7c6e2c02157bb7d2, O as $a093c7e1ec25a057$export$21b07c8f274aebd5, P as $57acba87d6e25586$export$be92b6f5f03c0fe9, Q as $57acba87d6e25586$export$d5c6c08dc2d3ca7, R as $57acba87d6e25586$export$9a4e88b92edfce6b, S as $57acba87d6e25586$export$6521433ed15a34db, T as MasonryResponsive, U as Masonry, V as useEmblaCarousel, W as useVirtualizer, X as $5d3850c4d0b4e6c7$export$be92b6f5f03c0fe9, Y as $5d3850c4d0b4e6c7$export$602eac185826482c, Z as $5d3850c4d0b4e6c7$export$c6fdb837b070b4ff, _ as $5d3850c4d0b4e6c7$export$7c6e2c02157bb7d2 } from "./vendor-5ae8da85.js";
 import React__default, { useState, useEffect, createElement } from "react";
 import { SledgeContext, CustomComponents } from "@sledge-app/core";
-import "react-dom";
+import { createPortal } from "react-dom";
 const ProductFilterWidget = (props) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(SearchResultWidget, { layoutType: "product-filter", ...props });
 };
@@ -692,14 +692,18 @@ const Popover = ({
   alignOffset = 0
 }) => {
   const [open, setOpen] = React__default.useState(withOpenState ? isOpen : false);
-  React__default.useEffect(() => {
-    var _a;
-    let arrowElement = (_a = document == null ? void 0 : document.querySelector(".PopoverArrow")) == null ? void 0 : _a.parentElement;
+  const popoverContentRef = React__default.useRef(null);
+  const handleCustomArrow = () => {
+    var _a, _b;
+    const popoverContentRefCurrent = popoverContentRef == null ? void 0 : popoverContentRef.current;
+    if (!popoverContentRefCurrent)
+      return;
+    let arrowElement = (_b = (_a = popoverContentRefCurrent == null ? void 0 : popoverContentRefCurrent.querySelector) == null ? void 0 : _a.call(popoverContentRefCurrent, ".PopoverArrow")) == null ? void 0 : _b.parentElement;
     if (arrowElement && (customArrow == null ? void 0 : customArrow.length)) {
       arrowElement.style.display = "inline-flex";
       arrowElement.innerHTML = customArrow;
     }
-  }, [open]);
+  };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(
     $cb5cc270b50c6fcd$export$be92b6f5f03c0fe9,
     {
@@ -721,8 +725,12 @@ const Popover = ({
             sideOffset,
             alignOffset,
             align,
+            ref: popoverContentRef,
             ...setIsOpen && {
-              onOpenAutoFocus: () => setIsOpen(true),
+              onOpenAutoFocus: () => {
+                setIsOpen(true);
+                handleCustomArrow();
+              },
               onCloseAutoFocus: () => setIsOpen(false)
             },
             children: [
@@ -5348,17 +5356,20 @@ const FlyoutSidebar = ({ title, content, footer = null, open, setOpen, position
     }, 0);
   }, [open]);
   const showBlurEffect = withBlurEffect && !isScrollAtBottom;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `sledge__flyout-mobile ${className}`, "data-open": open, "data-position": position, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__flyout-overlay", onClick: () => setOpen(false) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__flyout-mobile-wrapper", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__flyout-header", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__flyout-mobile-title", children: title }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__flyout-close-field-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "sledge__flyout-close-field", type: "button", onClick: () => setOpen(false), children: /* @__PURE__ */ jsxRuntimeExports.jsx(CloseIcon, { width: 14, height: 14, color: "#393d4e" }) }) })
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: contentContainerRef, className: `sledge__flyout-mobile-content ${showBlurEffect ? "sledge__flyout-mobile-content-blur-effect" : ""}`, children: isLoading ? null : content }),
-      footer ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__flyout-mobile-footer", children: isLoading ? null : footer }) : null
-    ] })
-  ] });
+  return createPortal(
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `sledge__flyout-mobile ${className}`, "data-open": open, "data-position": position, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__flyout-overlay", onClick: () => setOpen(false) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__flyout-mobile-wrapper", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__flyout-header", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__flyout-mobile-title", children: title }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__flyout-close-field-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "sledge__flyout-close-field", type: "button", onClick: () => setOpen(false), children: /* @__PURE__ */ jsxRuntimeExports.jsx(CloseIcon, { width: 14, height: 14, color: "#393d4e" }) }) })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: contentContainerRef, className: `sledge__flyout-mobile-content ${showBlurEffect ? "sledge__flyout-mobile-content-blur-effect" : ""}`, children: isLoading ? null : content }),
+        footer ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__flyout-mobile-footer", children: isLoading ? null : footer }) : null
+      ] })
+    ] }),
+    document.body
+  );
 };
 const getElement = ({ selector, setUsedScrollElement }) => {
   const element = document.querySelector(selector);
@@ -7246,7 +7257,7 @@ const FilterHorizontal = (props) => {
     isHorizontalGroup = false,
     allowedFilterSlider
   } = props;
-  const { sort = null } = components;
+  const { sort = null, limit = null } = components;
   const wrapperAdditionalProps = {
     ...isHorizontalGroup && { "horizontal-group": "" }
   };
@@ -7274,7 +7285,8 @@ const FilterHorizontal = (props) => {
               isHorizontalGroup
             }
           )),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-filter-horizontal-sort", children: sort })
+          sort ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-filter-horizontal-sort", children: sort }) : null,
+          limit ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-filter-horizontal-limit", children: limit }) : null
         ]
       }
     ),
@@ -7991,7 +8003,7 @@ const ProductGridPaginationWrapper = (props) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-product-grid-pagination-wrapper", children });
 };
 const FilterVerticalLayout = (props) => {
-  var _a, _b, _c;
+  var _a, _b, _c, _d;
   const {
     displaySettings,
     allowedFilter,
@@ -8036,13 +8048,13 @@ const FilterVerticalLayout = (props) => {
         ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SearchFieldDesktop, { children: searchField }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
+          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
         ] })
       ] }),
       isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: productGridSkeleton }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SummaryTextVertical, { className: "sledge-instant-search__result-summary-text-with-column-grid-selector-wrapper", children: [
           summaryText,
-          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null
+          ((_d = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _d.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null
         ] }),
         (searchResult == null ? void 0 : searchResult.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
           productGrid,
@@ -8053,7 +8065,7 @@ const FilterVerticalLayout = (props) => {
   ] }) });
 };
 const FilterHorizontalLayout = (props) => {
-  var _a, _b, _c;
+  var _a, _b, _c, _d;
   const {
     displaySettings,
     allowedFilter,
@@ -8099,8 +8111,8 @@ const FilterHorizontalLayout = (props) => {
         ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SearchFieldDesktop, { children: searchField }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit }),
-          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null
+          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit }),
+          ((_d = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _d.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null
         ] })
       ] }),
       isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: productGridSkeleton }) : /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (searchResult == null ? void 0 : searchResult.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
@@ -8111,7 +8123,7 @@ const FilterHorizontalLayout = (props) => {
   ] });
 };
 const FilterFlyoutLayout$1 = (props) => {
-  var _a, _b, _c;
+  var _a, _b, _c, _d;
   const {
     displaySettings,
     languageSettings,
@@ -8174,13 +8186,13 @@ const FilterFlyoutLayout$1 = (props) => {
         ] }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
+          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
         ] })
       ] }),
       isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: productGridSkeleton }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SummaryTextVertical, { className: "sledge-instant-search__result-summary-text-with-column-grid-selector-wrapper", children: [
           summaryText,
-          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null
+          ((_d = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _d.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null
         ] }),
         (searchResult == null ? void 0 : searchResult.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
           productGrid,
@@ -8191,7 +8203,7 @@ const FilterFlyoutLayout$1 = (props) => {
   ] });
 };
 const EnterpriseLayout = (props) => {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e;
   const {
     displaySettings,
     allowedFilter,
@@ -8237,8 +8249,9 @@ const EnterpriseLayout = (props) => {
         /* @__PURE__ */ jsxRuntimeExports.jsx(FilterIcon, { width: 18, height: 18, color: "#393d4e" })
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-      ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_search_bar) ? null : searchField,
-      ((_d = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _d.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldWrapper, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) }) : null
+      ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit }),
+      ((_d = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _d.hide_search_bar) ? null : searchField,
+      ((_e = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _e.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldWrapper, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) }) : null
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs(ResultData, { children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `sledge-instant-search__result-filter-toggle-panel ${"animated"}`, "data-filter-toggle": openFilterToggle ? "open" : "closed", children: filterVertical == null ? void 0 : filterVertical({
@@ -8253,7 +8266,7 @@ const EnterpriseLayout = (props) => {
   ] }) });
 };
 const YuvaLayout = (props) => {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e;
   const {
     displaySettings,
     allowedFilter,
@@ -8303,7 +8316,8 @@ const YuvaLayout = (props) => {
       /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
         handleSearchResultFirstTime ? summaryTextSkeleton : summaryText,
         ((_d = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _d.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null,
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort })
+        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
+        ((_e = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _e.hide_limit_options) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs(ResultData, { children: [
@@ -8319,7 +8333,7 @@ const YuvaLayout = (props) => {
   ] }) });
 };
 const ToyoLayout = (props) => {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e;
   const {
     displaySettings,
     allowedFilter,
@@ -8366,10 +8380,11 @@ const ToyoLayout = (props) => {
           isHorizontalGroup: true,
           showOnlyItems: true,
           components: {
-            sort
+            sort,
+            limit: ((_d = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _d.hide_limit_options) ? null : limit
           }
         }) : null,
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldWrapper, { children: ((_d = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _d.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null })
+        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldWrapper, { children: ((_e = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _e.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null })
       ] })
     ] }),
     isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: productGridSkeleton }) : /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (searchResult == null ? void 0 : searchResult.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
@@ -8380,7 +8395,7 @@ const ToyoLayout = (props) => {
   ] }) }) });
 };
 const FilterHorizontalGroupLayout = (props) => {
-  var _a, _b, _c;
+  var _a, _b, _c, _d;
   const {
     displaySettings,
     allowedFilter,
@@ -8427,8 +8442,8 @@ const FilterHorizontalGroupLayout = (props) => {
         ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SearchFieldDesktop, { children: searchField }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit }),
-          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null
+          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit }),
+          ((_d = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _d.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null
         ] })
       ] }),
       isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: productGridSkeleton }) : /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (searchResult == null ? void 0 : searchResult.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
@@ -8439,7 +8454,7 @@ const FilterHorizontalGroupLayout = (props) => {
   ] });
 };
 const DesktopLayout = (props) => {
-  var _a, _b;
+  var _a, _b, _c;
   const { displaySettings } = props;
   const renderLayout = () => {
     var _a2;
@@ -8468,14 +8483,15 @@ const DesktopLayout = (props) => {
       device: "desktop",
       layout: (_a = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _a.layout,
       additionalProps: {
-        "data-hide-search-bar": (_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar
+        "data-hide-search-bar": (_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar,
+        "data-hide-limit-options": (_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options
       },
       children: renderLayout()
     }
   );
 };
 const FilterFlyoutLayout = (props) => {
-  var _a;
+  var _a, _b, _c;
   const {
     displaySettings,
     languageSettings,
@@ -8539,11 +8555,11 @@ const FilterFlyoutLayout = (props) => {
             /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: language_filter || "Filter" }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(FilterIcon, { width: 18, height: 18, color: "#393d4e" })
           ] }),
-          searchField
+          ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar) ? null : searchField
         ] }) }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
+          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
         ] })
       ] }) }),
       isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: productGridSkeleton }) : /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (searchResult == null ? void 0 : searchResult.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
@@ -8554,7 +8570,7 @@ const FilterFlyoutLayout = (props) => {
   ] });
 };
 const FilterStandardLayout = (props) => {
-  var _a;
+  var _a, _b, _c;
   const { displaySettings, languageSettings, allowedFilter, isFirstLoading, isLoading, isLoadingProduct, isLoadingSetting, searchResult = [], components, skeleton } = props;
   const {
     filterHorizontal = null,
@@ -8586,12 +8602,12 @@ const FilterStandardLayout = (props) => {
       /* @__PURE__ */ jsxRuntimeExports.jsx(SummaryTextHorizontal, { children: summaryText }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs(FilterHorizontalBlockMobile, { children: [
-        searchField,
+        ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar) ? null : searchField,
         filterHorizontal == null ? void 0 : filterHorizontal({ deviceType: "mobile" })
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
+        ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
       ] })
     ] }) }),
     isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: productGridSkeleton }) : /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (searchResult == null ? void 0 : searchResult.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
@@ -8601,7 +8617,7 @@ const FilterStandardLayout = (props) => {
   ] }) }) });
 };
 const StickyFilterButtonLayout = (props) => {
-  var _a;
+  var _a, _b, _c;
   const {
     displaySettings,
     languageSettings,
@@ -8664,10 +8680,10 @@ const StickyFilterButtonLayout = (props) => {
       ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(SummaryTextHorizontal, { children: summaryText }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(FilterHorizontalBlockMobile, { children: searchField }),
+        ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(FilterHorizontalBlockMobile, { children: searchField }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
+          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: limit })
         ] })
       ] }) }),
       isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: productGridSkeleton }) : /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (searchResult == null ? void 0 : searchResult.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
@@ -8678,7 +8694,7 @@ const StickyFilterButtonLayout = (props) => {
   ] });
 };
 const MobileLayout = (props) => {
-  var _a;
+  var _a, _b, _c;
   const { displaySettings } = props;
   const renderLayout = () => {
     var _a2;
@@ -8693,7 +8709,18 @@ const MobileLayout = (props) => {
         return null;
     }
   };
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(RenderLayout, { device: "mobile", layout: (_a = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _a.mobile_layout, children: renderLayout() });
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    RenderLayout,
+    {
+      device: "mobile",
+      layout: (_a = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _a.mobile_layout,
+      additionalProps: {
+        "data-hide-search-bar": (_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar,
+        "data-hide-limit-options": (_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_limit_options
+      },
+      children: renderLayout()
+    }
+  );
 };
 const SearchResultWidget = (props) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A;