@sledge-app/react-instant-search 0.0.77 → 0.0.78

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

@@ -2666,7 +2666,7 @@ const SearchIconWidgetPopup = () => {
   ] }) });
 };
 const SearchResultWidget = (props) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
   const { isRenderApp, isJsVersion } = React__default.useContext(SledgeContext);
   const { layoutType = "default", query, params, children, onAfterAddToCart, onAfterAddWishlist, onAfterRemoveWishlist, onAfterRenderProduct, data: propsData } = props;
   const { keyword: queryKeyword = "" } = query || {};
@@ -2679,10 +2679,11 @@ const SearchResultWidget = (props) => {
         productCardsComponent = productCard;
     }
   });
-  const [settings] = React__default.useState(typeof localStorage !== "undefined" ? (_a = JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY.INSTANT_SEARCH_SETTING) || "{}")) == null ? void 0 : _a.data : {});
+  const searchParams = typeof document !== "undefined" ? new URLSearchParams((_a = document == null ? void 0 : document.location) == null ? void 0 : _a.search) : null;
+  const [settings] = React__default.useState(typeof localStorage !== "undefined" ? (_b = JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY.INSTANT_SEARCH_SETTING) || "{}")) == null ? void 0 : _b.data : {});
   const [isFirstLoading, setIsFirstLoading] = React__default.useState(true);
   const [isLoading, setIsLoading] = React__default.useState(true);
-  const [keyword, setKeyword] = React__default.useState("");
+  const [keyword, setKeyword] = React__default.useState(searchParams == null ? void 0 : searchParams.get(queryKeyword));
   const [clickedTabIndexId, setClickedTabIndexId] = React__default.useState(null);
   const [clickedTabIndexName, setClickedTabIndexName] = React__default.useState();
   const [resultComponent, setResultComponent] = React__default.useState(/* @__PURE__ */ jsxRuntimeExports.jsx(ResultProduct, {}));
@@ -2749,7 +2750,6 @@ const SearchResultWidget = (props) => {
     if (propsData && initStatesFirstTime) {
       response = propsData.result;
       setInitStatesFirstTime(false);
-      response = await multiSearch(body);
     } else
       response = await multiSearch(body);
     if (!response)
@@ -2833,8 +2833,8 @@ const SearchResultWidget = (props) => {
   React__default.useEffect(() => {
     if (!(isRenderApp == null ? void 0 : isRenderApp.instantSearch))
       return;
-    const searchParams = new URLSearchParams(document.location.search);
-    setKeyword((searchParams == null ? void 0 : searchParams.get(queryKeyword)) || "");
+    const searchParams2 = new URLSearchParams(document.location.search);
+    setKeyword((searchParams2 == null ? void 0 : searchParams2.get(queryKeyword)) || "");
     handleSettings(localStorage.getItem(LOCAL_STORAGE_KEY.INSTANT_SEARCH_SETTING) || "");
   }, [isRenderApp]);
   React__default.useEffect(() => {
@@ -2848,8 +2848,8 @@ const SearchResultWidget = (props) => {
     }
   }, [keyword]);
   const tabSkeleton = layoutType === "default" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-tab-list sledge-instant-search__result-tab-list-skeleton", children: [1, 2, 3, 4, 5].map((index) => /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.Item, { width: "122px", height: "28px", rounded: "md", color: "grey-100", animationDuration: "15s" }, index)) }) : null;
-  const filterHorizontalSkeleton = ((_b = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _b.enable_on_search) && ((_c = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _c.layout) === "horizontal" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-filter-horizontal-skeleton", children: [1, 2, 3, 4, 5, 6, 7].map((index) => /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.Item, { width: "106px", height: "42px", rounded: "md", color: "grey-100", animationDuration: "13s" }, index)) }) : null;
-  const filterVerticalSkeleton = ((_d = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _d.enable_on_search) && ((_e = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _e.layout) === "vertical" ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+  const filterHorizontalSkeleton = ((_c = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _c.enable_on_search) && ((_d = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _d.layout) === "horizontal" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-filter-horizontal-skeleton", children: [1, 2, 3, 4, 5, 6, 7].map((index) => /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.Item, { width: "106px", height: "42px", rounded: "md", color: "grey-100", animationDuration: "13s" }, index)) }) : null;
+  const filterVerticalSkeleton = ((_e = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _e.enable_on_search) && ((_f = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _f.layout) === "vertical" ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "div",
       {
@@ -3065,7 +3065,7 @@ const SearchResultWidget = (props) => {
     )
   ] }) : null;
   const productGridSkeleton = /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-    ((_f = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _f.show_total_products) && ((_g = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _g.layout) === "vertical" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+    ((_g = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _g.show_total_products) && ((_h = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _h.layout) === "vertical" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
       SkeletonLoading.Item,
       {
         width: "117px",
@@ -3081,7 +3081,7 @@ const SearchResultWidget = (props) => {
     /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.ProductGrid, { count: 12, type: "large" })
   ] });
   const searchAndSelectOptionSkeleton = /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__result-data-keyword", children: [
-    ((_h = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _h.show_total_products) && ((_i = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _i.layout) === "horizontal" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-data-summary sledge-instant-search__result-data-summary-filter-horizontal", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.Item, { width: "117px", height: "28px", color: "grey-100", rounded: "md", animationDuration: "13s" }) }) : null,
+    ((_i = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _i.show_total_products) && ((_j = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _j.layout) === "horizontal" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-data-summary sledge-instant-search__result-data-summary-filter-horizontal", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.Item, { width: "117px", height: "28px", color: "grey-100", rounded: "md", animationDuration: "13s" }) }) : null,
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-data-keyword-form", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
       SkeletonLoading.Item,
       {
@@ -3112,7 +3112,7 @@ const SearchResultWidget = (props) => {
       tabSkeleton,
       filterHorizontalSkeleton,
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__result-wrapper sledge-instant-search__result-wrapper-skeleton", children: [
-        ((_j = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _j.enable_on_search) && ((_k = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _k.layout) === "vertical" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-filter", children: filterVerticalSkeleton }) : null,
+        ((_k = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _k.enable_on_search) && ((_l = displaySettings == null ? void 0 : displaySettings.filter) == null ? void 0 : _l.layout) === "vertical" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-filter", children: filterVerticalSkeleton }) : null,
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__result-data", children: [
           searchAndSelectOptionSkeleton,
           productGridSkeleton