@sledge-app/react-instant-search 2.0.2 → 2.0.4

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

@@ -1094,7 +1094,7 @@ const Pagination = (props) => {
   };
   React__default.useEffect(() => {
     handlePageInfo();
-  }, []);
+  }, [pageInfoProp]);
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__pagination", "data-pagination-type": type, children: renderPaginationLayout() });
 };
 const RadioGroup$1 = "";
@@ -2519,7 +2519,7 @@ const WidgetRoot = (props) => {
     }
   };
   const handleSetWishlistData = async (isLoadMore = false, init = false) => {
-    var _a2, _b2, _c2, _d;
+    var _a2, _b2, _c2;
     const searchParams = new URLSearchParams(document.location.search);
     const getShareId = (params == null ? void 0 : params.shareId) ? params.shareId : (searchParams == null ? void 0 : searchParams.get(queryShareId)) || "";
     setIsLoading(isRefreshWidgetList ? true : !isLoadMore);
@@ -2530,7 +2530,6 @@ const WidgetRoot = (props) => {
     let response;
     let run = false;
     let valueWishlistData;
-    let valueWishlistSort;
     let valueTotalPage = 0;
     let queryParam = {
       page: isLoadMore ? currentPage : 1,
@@ -2549,11 +2548,9 @@ const WidgetRoot = (props) => {
       response = await getWishlist(queryParam);
     run = ((_a2 = response == null ? void 0 : response.status) == null ? void 0 : _a2.code) === 200 || false;
     valueWishlistData = !((_b2 = response.data) == null ? void 0 : _b2.length) ? [] : (prevState) => (wishlistData == null ? void 0 : wishlistData.length) && isLoadMore ? [...prevState, ...response.data] : response.data;
-    valueWishlistSort = !((_c2 = response.sorts) == null ? void 0 : _c2.length) ? [] : response.sorts;
-    valueTotalPage = ((_d = response == null ? void 0 : response.page) == null ? void 0 : _d.total_page) || 1;
+    valueTotalPage = ((_c2 = response == null ? void 0 : response.page) == null ? void 0 : _c2.total_page) || 1;
     if (run) {
       setWishlistData(valueWishlistData);
-      setWishlistSort(valueWishlistSort);
       setTotalPage(valueTotalPage);
       setIsLoading(false);
       setIsRefreshWidgetList(false);
@@ -2600,7 +2597,9 @@ const WidgetRoot = (props) => {
     responseGeneral = generalPreviewSettings || JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY.GENERAL_SETTING) || null);
     if (!response)
       return;
+    const { sorts } = response == null ? void 0 : response.display;
     setDataSettings(response);
+    setWishlistSort(sorts);
     if (responseGeneral)
       setGeneralDataSettings(responseGeneral);
   };
@@ -4218,8 +4217,8 @@ const VariantSelector = (props) => {
     /* @__PURE__ */ jsxRuntimeExports.jsx("select", { className: "variant-picker sledge__product-grid-card-variant-picker", children: variants == null ? void 0 : variants.map((variant) => {
       const { title, option1, option2, position, id: id2, admin_graphql_api_id, image_id, inventory_quantity, inventory_management, inventory_policy } = variant;
       let optionAttributes = {
-        "data-option-1": option1,
-        "data-option-2": option2,
+        "data-option-1": stringToSlug(option1),
+        "data-option-2": stringToSlug(option2),
         "data-inventory-quantity": inventory_quantity,
         "data-inventory-management": inventory_management,
         "data-inventory-policy": inventory_policy,
@@ -4266,7 +4265,7 @@ ${selectedOption === item ? "sledge__product-variant-size-swatch-active" : ""} s
   ] });
 };
 const ProductCard = React__default.memo((props) => {
-  var _a, _b, _c, _d, _e;
+  var _a, _b, _c, _d, _e, _f, _g;
   const {
     item,
     handleAddToCart,
@@ -4490,7 +4489,10 @@ const ProductCard = React__default.memo((props) => {
                     ...triggerPropAdditional,
                     onAfterAddWishlist,
                     onAfterRemoveWishlist,
-                    wishlistChecked: dataWishlists == null ? void 0 : dataWishlists[id]
+                    wishlistChecked: dataWishlists == null ? void 0 : dataWishlists[id],
+                    ...objectPresent(previewSettings) && ((_e = (_d = previewSettings == null ? void 0 : previewSettings.settings) == null ? void 0 : _d.general) == null ? void 0 : _e.use_dummy_data) ? {
+                      previewSettings
+                    } : {}
                   }
                 ),
                 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-card-featured-image-element", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -4514,7 +4516,7 @@ const ProductCard = React__default.memo((props) => {
                     }
                   }
                 ) }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-card-variant-images", children: (_e = (_d = product == null ? void 0 : product.images) == null ? void 0 : _d.map) == null ? void 0 : _e.call(_d, (image2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-card-variant-images", children: (_g = (_f = product == null ? void 0 : product.images) == null ? void 0 : _f.map) == null ? void 0 : _g.call(_f, (image2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
                   "img",
                   {
                     decoding: "async",
@@ -4639,7 +4641,7 @@ const ProductCard = React__default.memo((props) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(React__default.Fragment, { children: component }, id);
 });
 const ProductGrid = React__default.memo((props) => {
-  const { type, className = "", data, setting, sourceApp = null, useSlider = false, isFlyout = false, onAfterAddToCart, onAfterRenderProduct, currentColumnGrid } = props;
+  const { type, className = "", data, setting, sourceApp = null, useSlider = false, isFlyout = false, onAfterAddToCart, onAfterRenderProduct, currentColumnGrid, previewSettings } = props;
   const { redirect_add_to_cart = true } = setting || {};
   const [clickedAddToCartId, setClickedAddToCartId] = React__default.useState(null);
   const [generalDataSettings, setGeneralDataSettings] = React__default.useState({});
@@ -4647,6 +4649,17 @@ const ProductGrid = React__default.memo((props) => {
     var _a;
     const { id, quantity } = data2;
     setClickedAddToCartId(id);
+    if (objectPresent(previewSettings)) {
+      setClickedAddToCartId(null);
+      onAfterAddToCart && onAfterAddToCart("success");
+      window.sledgeToastNotification({
+        title: "Cart added",
+        message: "Successfully added to wishlist",
+        type: "success",
+        icon: /* @__PURE__ */ jsxRuntimeExports.jsx(BagIcon, { width: 40, height: 40, color: "black" })
+      });
+      return;
+    }
     let resShopifyAddToCart = await addToCart([
       {
         id,
@@ -7090,6 +7103,7 @@ const FilterItem = (props) => {
     filter,
     filterSettings,
     indexFilter,
+    filterTitleStyle,
     deviceType,
     clickedOpenFilterHorizontalId,
     setClickedOpenFilterHorizontalId,
@@ -7127,6 +7141,7 @@ const FilterItem = (props) => {
             }
           },
           className: isHorizontalGroup ? "sledge-instant-search__result-filter-trigger-horizontal-group" : `${isLastIndex ? (allowedFilter == null ? void 0 : allowedFilter.length) % 2 ? "sledge-instant-search__result-filter-trigger-odd" : "sledge-instant-search__result-filter-trigger-even" : ""}`,
+          style: filterTitleStyle,
           children: [
             label,
             /* @__PURE__ */ jsxRuntimeExports.jsx(motion.div, { initial: "closed", animate: isOpenFilterHorizontal ? "open" : "closed", variants: ROTATE_FILTER_ARROW_ANIMATION, className: "sort-trigger-icon", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronArrowDownIcon, { width: 20, height: 20, color: "#000000" }) })
@@ -7197,6 +7212,7 @@ const FilterHorizontal = (props) => {
   const {
     items = [],
     filterSettings = null,
+    filterTitleStyle = {},
     deviceType = "desktop",
     clickedOpenFilterHorizontalId,
     setClickedOpenFilterHorizontalId,
@@ -7236,6 +7252,7 @@ const FilterHorizontal = (props) => {
               filter,
               filterSettings,
               indexFilter,
+              filterTitleStyle,
               deviceType,
               clickedOpenFilterHorizontalId,
               setClickedOpenFilterHorizontalId,
@@ -10008,6 +10025,9 @@ const ResultProduct = React__default.memo((props) => {
       });
     }
   }, [isReplaceWidgetList, clickedTabIndexId]);
+  useEffectOnChange(() => {
+    setSummaryText(summaryTextGenerator(totalSearchResult));
+  }, [previewSettings]);
   let dataClickedFacets = handleDataClickedFacets();
   let keepCounterFacets = [];
   allowedFilter == null ? void 0 : allowedFilter.map((filter) => {
@@ -10143,6 +10163,7 @@ const ResultProduct = React__default.memo((props) => {
     const defaultProps = {
       items: allowedFilter,
       filterSettings,
+      filterTitleStyle: filter_title_style,
       clickedOpenFilterHorizontalId,
       setClickedOpenFilterHorizontalId,
       clickedOpenFilterHorizontalMobileId,