@sledge-app/react-instant-search 1.0.74 → 1.0.76
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Global/SearchViewMoreResult.d.ts +2 -1
- package/dist/components/Global/SearchViewMoreResult.d.ts.map +1 -1
- package/dist/components/Global/index.d.ts +2 -1
- package/dist/components/Global/index.d.ts.map +1 -1
- package/dist/components/SearchIconWidget/SearchIconWidgetPopup.d.ts.map +1 -1
- package/dist/components/SearchResultWidget/Atoms.d.ts +62 -0
- package/dist/components/SearchResultWidget/Atoms.d.ts.map +1 -1
- package/dist/components/SearchResultWidget/SearchResultWidget.d.ts.map +1 -1
- package/dist/components/SearchWidget/SearchWidget.d.ts.map +1 -1
- package/dist/sledge-react-instant-search.cjs +1 -1
- package/dist/sledge-react-instant-search.cjs.map +1 -1
- package/dist/sledge-react-instant-search.js +236 -127
- package/dist/sledge-react-instant-search.js.map +1 -1
- package/dist/style.css +1 -1
- package/dist/vendor-3fb6b338.cjs +2 -0
- package/dist/vendor-3fb6b338.cjs.map +1 -0
- package/dist/{vendor-4bab83cd.js → vendor-dc719d80.js} +942 -7190
- package/dist/vendor-dc719d80.js.map +1 -0
- package/package.json +1 -2
- package/dist/vendor-4bab83cd.js.map +0 -1
- package/dist/vendor-58cb2b49.cjs +0 -2
- package/dist/vendor-58cb2b49.cjs.map +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
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 $faa2e61a3361514f$export$be92b6f5f03c0fe9, l as $faa2e61a3361514f$export$13921ac0cc260818, m as $faa2e61a3361514f$export$9a58ef0d7ad3278c, n as $faa2e61a3361514f$export$6521433ed15a34db, o as $f99a8c78507165f7$export$be92b6f5f03c0fe9, p as $f99a8c78507165f7$export$6d08773d2e66f8f2, q as $f99a8c78507165f7$export$adb584737d712b70, r as $cc7e05a45900e73f$export$6d08773d2e66f8f2, s as $cc7e05a45900e73f$export$d6e5bf9c43ea9319, t as $cc7e05a45900e73f$export$c3468e2714d175fa, u as $cc7e05a45900e73f$export$be92b6f5f03c0fe9, v as $cc7e05a45900e73f$export$41fb9f06171c75f4, w as $cc7e05a45900e73f$export$4c8d1a57a761ef94, x as $cc7e05a45900e73f$export$f04a61298a47a40f, y as $cc7e05a45900e73f$export$602eac185826482c, z as $cc7e05a45900e73f$export$7c6e2c02157bb7d2, A as $cc7e05a45900e73f$export$2f60d3ec9ad468f2, B as $cc7e05a45900e73f$export$d5c6c08dc2d3ca7, C as $cc7e05a45900e73f$export$bf1aedc3039c8d63, D as motion, E as client, F as $a093c7e1ec25a057$export$2881499e37b75b9a, G as $a093c7e1ec25a057$export$be92b6f5f03c0fe9, H as $a093c7e1ec25a057$export$41fb9f06171c75f4, I as $a093c7e1ec25a057$export$602eac185826482c, J as $a093c7e1ec25a057$export$7c6e2c02157bb7d2, K as $a093c7e1ec25a057$export$21b07c8f274aebd5, L as $57acba87d6e25586$export$be92b6f5f03c0fe9, M as $57acba87d6e25586$export$d5c6c08dc2d3ca7, N as $57acba87d6e25586$export$9a4e88b92edfce6b, O as $57acba87d6e25586$export$6521433ed15a34db, P as MasonryResponsive, Q as Masonry, R as useEmblaCarousel,
|
|
2
|
-
import React__default, { createElement
|
|
1
|
+
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 $faa2e61a3361514f$export$be92b6f5f03c0fe9, l as $faa2e61a3361514f$export$13921ac0cc260818, m as $faa2e61a3361514f$export$9a58ef0d7ad3278c, n as $faa2e61a3361514f$export$6521433ed15a34db, o as $f99a8c78507165f7$export$be92b6f5f03c0fe9, p as $f99a8c78507165f7$export$6d08773d2e66f8f2, q as $f99a8c78507165f7$export$adb584737d712b70, r as $cc7e05a45900e73f$export$6d08773d2e66f8f2, s as $cc7e05a45900e73f$export$d6e5bf9c43ea9319, t as $cc7e05a45900e73f$export$c3468e2714d175fa, u as $cc7e05a45900e73f$export$be92b6f5f03c0fe9, v as $cc7e05a45900e73f$export$41fb9f06171c75f4, w as $cc7e05a45900e73f$export$4c8d1a57a761ef94, x as $cc7e05a45900e73f$export$f04a61298a47a40f, y as $cc7e05a45900e73f$export$602eac185826482c, z as $cc7e05a45900e73f$export$7c6e2c02157bb7d2, A as $cc7e05a45900e73f$export$2f60d3ec9ad468f2, B as $cc7e05a45900e73f$export$d5c6c08dc2d3ca7, C as $cc7e05a45900e73f$export$bf1aedc3039c8d63, D as motion, E as client, F as $a093c7e1ec25a057$export$2881499e37b75b9a, G as $a093c7e1ec25a057$export$be92b6f5f03c0fe9, H as $a093c7e1ec25a057$export$41fb9f06171c75f4, I as $a093c7e1ec25a057$export$602eac185826482c, J as $a093c7e1ec25a057$export$7c6e2c02157bb7d2, K as $a093c7e1ec25a057$export$21b07c8f274aebd5, L as $57acba87d6e25586$export$be92b6f5f03c0fe9, M as $57acba87d6e25586$export$d5c6c08dc2d3ca7, N as $57acba87d6e25586$export$9a4e88b92edfce6b, O as $57acba87d6e25586$export$6521433ed15a34db, P as MasonryResponsive, Q as Masonry, R as useEmblaCarousel, S as useVirtualizer, T as $5d3850c4d0b4e6c7$export$be92b6f5f03c0fe9, U as $5d3850c4d0b4e6c7$export$602eac185826482c, V as $5d3850c4d0b4e6c7$export$c6fdb837b070b4ff, W as $5d3850c4d0b4e6c7$export$7c6e2c02157bb7d2 } from "./vendor-dc719d80.js";
|
|
2
|
+
import React__default, { createElement } from "react";
|
|
3
3
|
import { SledgeContext } from "@sledge-app/core";
|
|
4
4
|
import "react-dom";
|
|
5
5
|
const ProductFilterWidget = (props) => {
|
|
@@ -724,16 +724,16 @@ const Pagination = (props) => {
|
|
|
724
724
|
] });
|
|
725
725
|
};
|
|
726
726
|
const RadioGroup$1 = "";
|
|
727
|
-
const rowRenderer = ({ virtualized, item, id, labelStyle
|
|
728
|
-
const { index, key = ""
|
|
727
|
+
const rowRenderer = ({ virtualized, item, id, labelStyle }) => {
|
|
728
|
+
const { index, key = "" } = virtualized || {};
|
|
729
729
|
const { label, value } = item;
|
|
730
730
|
const content = /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
|
|
731
731
|
/* @__PURE__ */ jsxRuntimeExports.jsx($f99a8c78507165f7$export$6d08773d2e66f8f2, { className: "sledge__radio-group-item", value, id: `${id}${index}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx($f99a8c78507165f7$export$adb584737d712b70, { className: "sledge__radio-group-indicator" }) }),
|
|
732
732
|
/* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "sledge__radio-group-label", htmlFor: `${id}${index}`, style: labelStyle, children: label })
|
|
733
733
|
] });
|
|
734
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__radio-group-item-flex",
|
|
734
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__radio-group-item-flex", children: content }, key || index);
|
|
735
735
|
};
|
|
736
|
-
const RadioGroup = ({ id, name, required, defaultValue, items, labelStyle = {}, onValueChange,
|
|
736
|
+
const RadioGroup = ({ id, name, required, defaultValue, items, labelStyle = {}, onValueChange, useVirtualized = false, scrollElement, selector }) => {
|
|
737
737
|
return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__radio-group-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx("form", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
738
738
|
$f99a8c78507165f7$export$be92b6f5f03c0fe9,
|
|
739
739
|
{
|
|
@@ -747,22 +747,18 @@ const RadioGroup = ({ id, name, required, defaultValue, items, labelStyle = {},
|
|
|
747
747
|
children: useVirtualized ? /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
748
748
|
VirtualizedList,
|
|
749
749
|
{
|
|
750
|
-
...scrollElement && {
|
|
751
|
-
scrollElement
|
|
752
|
-
},
|
|
753
750
|
rowCount: items == null ? void 0 : items.length,
|
|
754
|
-
|
|
755
|
-
rowRenderer: ({ index, key, style }) => rowRenderer({
|
|
751
|
+
rowRenderer: ({ index, key }) => rowRenderer({
|
|
756
752
|
virtualized: {
|
|
757
753
|
index,
|
|
758
|
-
key
|
|
759
|
-
style
|
|
754
|
+
key
|
|
760
755
|
},
|
|
761
756
|
item: items[index],
|
|
762
757
|
id,
|
|
763
|
-
labelStyle
|
|
764
|
-
|
|
765
|
-
|
|
758
|
+
labelStyle
|
|
759
|
+
}),
|
|
760
|
+
scrollElement,
|
|
761
|
+
selector
|
|
766
762
|
}
|
|
767
763
|
) : items.map(
|
|
768
764
|
(item, index) => rowRenderer({
|
|
@@ -771,8 +767,7 @@ const RadioGroup = ({ id, name, required, defaultValue, items, labelStyle = {},
|
|
|
771
767
|
},
|
|
772
768
|
item,
|
|
773
769
|
id,
|
|
774
|
-
labelStyle
|
|
775
|
-
useVirtualized
|
|
770
|
+
labelStyle
|
|
776
771
|
})
|
|
777
772
|
)
|
|
778
773
|
}
|
|
@@ -2815,10 +2810,14 @@ const ProductCard = (props) => {
|
|
|
2815
2810
|
} = (variants == null ? void 0 : variants.length) ? variants[0] : {};
|
|
2816
2811
|
const defaultSelectedVariantId = variant_admin_graphql_api_id ? variant_admin_graphql_api_id : "";
|
|
2817
2812
|
const defaultSelectedVariantStock = (variants == null ? void 0 : variants.length) && Object.hasOwn(variants[0], "inventory_quantity") ? variants[0].inventory_quantity : 0;
|
|
2813
|
+
const defaultSelectedVariantInventoryManagement = (variants == null ? void 0 : variants.length) && Object.hasOwn(variants[0], "inventory_management") ? variants[0].inventory_management : null;
|
|
2814
|
+
const defaultSelectedVariantInventoryPolicy = (variants == null ? void 0 : variants.length) && Object.hasOwn(variants[0], "inventory_policy") ? variants[0].inventory_policy : "";
|
|
2818
2815
|
const [selectedVariantId, setSelectedVariantId] = React__default.useState(defaultSelectedVariantId);
|
|
2819
2816
|
const [selectedVariantStock, setSelectedVariantStock] = React__default.useState(defaultSelectedVariantStock);
|
|
2817
|
+
const [selectedVariantInventoryManagement, setSelectedVariantInventoryManagement] = React__default.useState(defaultSelectedVariantInventoryManagement);
|
|
2818
|
+
const [selectedVariantInventoryPolicy, setSelectedVariantInventoryPolicy] = React__default.useState(defaultSelectedVariantInventoryPolicy);
|
|
2820
2819
|
let isLoadingAddToCart = clickedAddToCartId == selectedVariantId;
|
|
2821
|
-
let isOutOfStock = (
|
|
2820
|
+
let isOutOfStock = showOptionOutOfStock ? !Boolean(selectedVariantStock > 0 || selectedVariantInventoryManagement === null || selectedVariantInventoryPolicy === "continue") : false;
|
|
2822
2821
|
let isOnSale = parseFloat(String(compare_at_price)) ? parseFloat(String(compare_at_price)) > parseFloat(String(price)) : false;
|
|
2823
2822
|
const { money_format } = generalDataSettings || {};
|
|
2824
2823
|
let component = null;
|
|
@@ -2828,10 +2827,12 @@ const ProductCard = (props) => {
|
|
|
2828
2827
|
...product,
|
|
2829
2828
|
...{
|
|
2830
2829
|
variants: variants.map((variant, index) => {
|
|
2831
|
-
const
|
|
2830
|
+
const isInventoryQuantity = Object.hasOwn(variants[index], "inventory_quantity") ? variants[index].inventory_quantity > 0 : false;
|
|
2831
|
+
const isInventoryManagement = Object.hasOwn(variants[index], "inventory_management") ? variants[index].inventory_management === null : false;
|
|
2832
|
+
const isInventoryPolicy = Object.hasOwn(variants[index], "inventory_policy") ? variants[index].inventory_policy === "continue" : false;
|
|
2832
2833
|
return {
|
|
2833
2834
|
...variant,
|
|
2834
|
-
is_out_of_stock:
|
|
2835
|
+
is_out_of_stock: !Boolean(isInventoryQuantity || isInventoryManagement || isInventoryPolicy)
|
|
2835
2836
|
};
|
|
2836
2837
|
})
|
|
2837
2838
|
},
|
|
@@ -2859,6 +2860,8 @@ const ProductCard = (props) => {
|
|
|
2859
2860
|
}
|
|
2860
2861
|
defaultSelected["data-variant-id"] = variants[0].admin_graphql_api_id;
|
|
2861
2862
|
defaultSelected["data-inventory-quantity"] = variants[0].inventory_quantity;
|
|
2863
|
+
defaultSelected["data-inventory-management"] = variants[0].inventory_management;
|
|
2864
|
+
defaultSelected["data-inventory-policy"] = variants[0].inventory_policy;
|
|
2862
2865
|
}, setSelectedOption = function(element, optionName) {
|
|
2863
2866
|
const optionsButton = element.target.offsetParent.querySelector(`.options-button-${stringToSlug(optionName)}`).querySelectorAll(`button`);
|
|
2864
2867
|
const defaultSelectedClassChanger = () => {
|
|
@@ -2884,7 +2887,7 @@ const ProductCard = (props) => {
|
|
|
2884
2887
|
defaultSelectedClassChanger();
|
|
2885
2888
|
}
|
|
2886
2889
|
}, setSelectedVariant = function(element, value, optionIndex) {
|
|
2887
|
-
var _a2, _b2;
|
|
2890
|
+
var _a2, _b2, _c2, _d;
|
|
2888
2891
|
const parentCard = element.target.offsetParent;
|
|
2889
2892
|
const selectedInput = parentCard.querySelector(`.sledge__product-grid-card-selected-option[data-product-id='${id}']`);
|
|
2890
2893
|
const setOptionAttribute = () => {
|
|
@@ -2897,13 +2900,21 @@ const ProductCard = (props) => {
|
|
|
2897
2900
|
const variantId = selectOption.attributes["data-graphql-id"].value;
|
|
2898
2901
|
const imageId = (_a2 = selectOption.attributes["data-image-id"]) == null ? void 0 : _a2.value;
|
|
2899
2902
|
const inventoryQuantity = (_b2 = selectOption.attributes["data-inventory-quantity"]) == null ? void 0 : _b2.value;
|
|
2903
|
+
const inventoryManagement = (_c2 = selectOption.attributes["data-inventory-management"]) == null ? void 0 : _c2.value;
|
|
2904
|
+
const inventoryPolicy = (_d = selectOption.attributes["data-inventory-policy"]) == null ? void 0 : _d.value;
|
|
2900
2905
|
const setOther = () => {
|
|
2901
2906
|
selectedInput.attributes[`data-variant-id`].value = selectOption.attributes["data-graphql-id"].value;
|
|
2902
2907
|
selectedInput.attributes[`data-inventory-quantity`].value = inventoryQuantity;
|
|
2908
|
+
selectedInput.attributes[`data-inventory-management`].value = inventoryManagement;
|
|
2909
|
+
selectedInput.attributes[`data-inventory-policy`].value = inventoryPolicy;
|
|
2903
2910
|
if (variantId)
|
|
2904
2911
|
setSelectedVariantId(variantId);
|
|
2905
2912
|
if (inventoryQuantity)
|
|
2906
2913
|
setSelectedVariantStock(inventoryQuantity);
|
|
2914
|
+
if (inventoryManagement)
|
|
2915
|
+
setSelectedVariantInventoryManagement(inventoryManagement);
|
|
2916
|
+
if (inventoryPolicy)
|
|
2917
|
+
setSelectedVariantInventoryPolicy(inventoryPolicy);
|
|
2907
2918
|
if (imageId)
|
|
2908
2919
|
parentCard.querySelector(`img.sledge__product-grid-card-image-featured-image`).src = parentCard.querySelector(
|
|
2909
2920
|
`div.sledge__product-grid-card-variant-images img[id="${imageId}"]`
|
|
@@ -3046,11 +3057,13 @@ const ProductCard = (props) => {
|
|
|
3046
3057
|
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-card-variant-swatch", children: [
|
|
3047
3058
|
/* @__PURE__ */ jsxRuntimeExports.jsx("input", { type: "hidden", ...defaultSelected, className: "sledge__product-grid-card-selected-option" }),
|
|
3048
3059
|
/* @__PURE__ */ jsxRuntimeExports.jsx("select", { className: "variant-picker sledge__product-grid-card-variant-picker", children: variants == null ? void 0 : variants.map((variant) => {
|
|
3049
|
-
const { title: title2, option1, option2, position, id: id2, admin_graphql_api_id, image_id, inventory_quantity } = variant;
|
|
3060
|
+
const { title: title2, option1, option2, position, id: id2, admin_graphql_api_id, image_id, inventory_quantity, inventory_management, inventory_policy } = variant;
|
|
3050
3061
|
let optionAttributes = {
|
|
3051
3062
|
"data-option-1": option1,
|
|
3052
3063
|
"data-option-2": option2,
|
|
3053
3064
|
"data-inventory-quantity": inventory_quantity,
|
|
3065
|
+
"data-inventory-management": inventory_management,
|
|
3066
|
+
"data-inventory-policy": inventory_policy,
|
|
3054
3067
|
"data-position": position,
|
|
3055
3068
|
"data-id": id2,
|
|
3056
3069
|
"data-graphql-id": admin_graphql_api_id,
|
|
@@ -3732,32 +3745,42 @@ const getElement = ({ selector, setUsedScrollElement }) => {
|
|
|
3732
3745
|
if (!element)
|
|
3733
3746
|
setTimeout(() => {
|
|
3734
3747
|
getElement({ selector, setUsedScrollElement });
|
|
3735
|
-
},
|
|
3748
|
+
}, 10);
|
|
3736
3749
|
else
|
|
3737
3750
|
setUsedScrollElement(element);
|
|
3738
3751
|
};
|
|
3739
|
-
const VirtualizedList = ({
|
|
3740
|
-
|
|
3752
|
+
const VirtualizedList = ({ scrollElement, rowCount, rowRenderer: rowRenderer2, selector }) => {
|
|
3753
|
+
var _a;
|
|
3754
|
+
const [usedScrollElement, setUsedScrollElement] = React__default.useState(scrollElement);
|
|
3741
3755
|
if (!usedScrollElement && selector)
|
|
3742
3756
|
getElement({ selector, setUsedScrollElement });
|
|
3757
|
+
const virtualizer = useVirtualizer({
|
|
3758
|
+
count: rowCount,
|
|
3759
|
+
getScrollElement: () => usedScrollElement,
|
|
3760
|
+
estimateSize: () => 45
|
|
3761
|
+
});
|
|
3762
|
+
const items = virtualizer.getVirtualItems();
|
|
3743
3763
|
return /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
3744
|
-
|
|
3764
|
+
"div",
|
|
3745
3765
|
{
|
|
3746
|
-
|
|
3747
|
-
|
|
3766
|
+
style: {
|
|
3767
|
+
height: virtualizer.getTotalSize(),
|
|
3768
|
+
width: "100%",
|
|
3769
|
+
position: "relative"
|
|
3748
3770
|
},
|
|
3749
|
-
|
|
3750
|
-
|
|
3771
|
+
className: "sledge__virtualized-wrapper",
|
|
3772
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
3773
|
+
"div",
|
|
3751
3774
|
{
|
|
3752
|
-
|
|
3753
|
-
|
|
3754
|
-
|
|
3755
|
-
|
|
3756
|
-
|
|
3757
|
-
|
|
3758
|
-
|
|
3759
|
-
|
|
3760
|
-
|
|
3775
|
+
style: {
|
|
3776
|
+
position: "absolute",
|
|
3777
|
+
top: 0,
|
|
3778
|
+
left: 0,
|
|
3779
|
+
width: "100%",
|
|
3780
|
+
transform: `translateY(${((_a = items[0]) == null ? void 0 : _a.start) ?? 0}px)`
|
|
3781
|
+
},
|
|
3782
|
+
className: "sledge__virtualized-list",
|
|
3783
|
+
children: items.map((virtualRow) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { "data-index": virtualRow.index, ref: virtualizer.measureElement, className: "sledge__virtualized-measure-element", children: rowRenderer2(virtualRow) }, virtualRow.key))
|
|
3761
3784
|
}
|
|
3762
3785
|
)
|
|
3763
3786
|
}
|
|
@@ -3897,6 +3920,7 @@ const SearchViewMoreResult = ({
|
|
|
3897
3920
|
showPopupComponent,
|
|
3898
3921
|
setShowPopupComponent,
|
|
3899
3922
|
urlSearchResult = "",
|
|
3923
|
+
redirectObjectDirection = "",
|
|
3900
3924
|
query,
|
|
3901
3925
|
languageSettings
|
|
3902
3926
|
}) => {
|
|
@@ -3908,11 +3932,18 @@ const SearchViewMoreResult = ({
|
|
|
3908
3932
|
if (triggerRenderInstantSearchResult)
|
|
3909
3933
|
triggerRenderInstantSearchResult(value);
|
|
3910
3934
|
};
|
|
3911
|
-
const ComponentProps = { keyword, showPopupComponent, setShowPopupComponent, setRenderSearchResult };
|
|
3935
|
+
const ComponentProps = { keyword, showPopupComponent, setShowPopupComponent, setRenderSearchResult, redirectObjectDirection };
|
|
3912
3936
|
return /* @__PURE__ */ jsxRuntimeExports.jsx(React__default.Fragment, { children: isComponentJsVersion ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { dangerouslySetInnerHTML: { __html: Component({ ...ComponentProps }) } }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Component, { ...ComponentProps }) });
|
|
3913
3937
|
} else {
|
|
3914
3938
|
const queryKeyword = (query == null ? void 0 : query.keyword) ? query.keyword : DEFAULT_QUERY_PARAM.KEYWORD;
|
|
3915
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
3939
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
3940
|
+
"a",
|
|
3941
|
+
{
|
|
3942
|
+
href: redirectObjectDirection ? redirectObjectDirection : `${urlSearchResult || DEFAULT_SEARCH_RESULT_URL}?${queryKeyword}=${keyword}`,
|
|
3943
|
+
className: "sledge-instant-search__icon-widget-button-more",
|
|
3944
|
+
children: (languageSettings == null ? void 0 : languageSettings.view_more_result) || "View More Result"
|
|
3945
|
+
}
|
|
3946
|
+
);
|
|
3916
3947
|
}
|
|
3917
3948
|
};
|
|
3918
3949
|
const Global = {
|
|
@@ -3935,6 +3966,9 @@ const SearchIconWidgetPopup = () => {
|
|
|
3935
3966
|
const [suggestionIndex, setSuggestionIndex] = React__default.useState("");
|
|
3936
3967
|
const [urlSearchResult, setUrlSearchResult] = React__default.useState("");
|
|
3937
3968
|
const [languageSettings, setLanguageSettings] = React__default.useState({});
|
|
3969
|
+
const [redirectsSettings, setRedirectsSettings] = React__default.useState([]);
|
|
3970
|
+
const [redirectObject, setRedirectObject] = React__default.useState({});
|
|
3971
|
+
const [isRedirect, setIsRedirect] = React__default.useState(false);
|
|
3938
3972
|
const [handleFunctions, setHandleFunctions] = React__default.useState({
|
|
3939
3973
|
onAfterAddToCart: (state) => {
|
|
3940
3974
|
},
|
|
@@ -3953,12 +3987,20 @@ const SearchIconWidgetPopup = () => {
|
|
|
3953
3987
|
});
|
|
3954
3988
|
const searchFieldRef = React__default.useRef(null);
|
|
3955
3989
|
const previousState = usePrevious({ keyword });
|
|
3990
|
+
const { direction: redirectObjectDirection } = redirectObject || {};
|
|
3956
3991
|
const handleMultiSearch = async (params) => {
|
|
3957
|
-
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2;
|
|
3992
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2;
|
|
3958
3993
|
const { data, onSearch = false, withFetchReviewInfo = false } = params;
|
|
3994
|
+
const valueRedirectObject = redirectsSettings.find(({ keyword: redirectKeyword }) => {
|
|
3995
|
+
var _a3;
|
|
3996
|
+
return ((_a3 = String(redirectKeyword)) == null ? void 0 : _a3.toLowerCase()) === keyword;
|
|
3997
|
+
});
|
|
3998
|
+
const valueIsRedirect = Boolean((_a2 = valueRedirectObject == null ? void 0 : valueRedirectObject.direction) == null ? void 0 : _a2.length);
|
|
3999
|
+
setRedirectObject(valueRedirectObject);
|
|
4000
|
+
setIsRedirect(valueIsRedirect);
|
|
3959
4001
|
setIsLoading(true);
|
|
3960
4002
|
const { index_product, tabs, hidden_tags, display, show_out_of_stock } = data;
|
|
3961
|
-
const suggestion = ((
|
|
4003
|
+
const suggestion = ((_b2 = display == null ? void 0 : display.search) == null ? void 0 : _b2.suggestion) || {};
|
|
3962
4004
|
let response;
|
|
3963
4005
|
let body = {
|
|
3964
4006
|
queries: tabs.map((tab) => {
|
|
@@ -3985,10 +4027,10 @@ const SearchIconWidgetPopup = () => {
|
|
|
3985
4027
|
if (onSearch && (keyword == null ? void 0 : keyword.length)) {
|
|
3986
4028
|
searchTrigger({
|
|
3987
4029
|
keyword,
|
|
3988
|
-
resultCount: ((
|
|
4030
|
+
resultCount: ((_c2 = valueSearchResultProduct[0]) == null ? void 0 : _c2.totalHits) || 0
|
|
3989
4031
|
});
|
|
3990
4032
|
}
|
|
3991
|
-
let valueSearchResultOther = ((
|
|
4033
|
+
let valueSearchResultOther = ((_d2 = results == null ? void 0 : results.filter(({ indexUid }) => !(indexUid == null ? void 0 : indexUid.includes(index_product)))) == null ? void 0 : _d2.map((result) => {
|
|
3992
4034
|
const { indexUid } = result;
|
|
3993
4035
|
const { name, type } = tabs == null ? void 0 : tabs.find(({ index }) => index.includes(indexUid));
|
|
3994
4036
|
return {
|
|
@@ -3999,16 +4041,16 @@ const SearchIconWidgetPopup = () => {
|
|
|
3999
4041
|
}
|
|
4000
4042
|
};
|
|
4001
4043
|
})) || [];
|
|
4002
|
-
let getValueSearchResultProduct = (valueSearchResultProduct == null ? void 0 : valueSearchResultProduct.length) ? (
|
|
4044
|
+
let getValueSearchResultProduct = (valueSearchResultProduct == null ? void 0 : valueSearchResultProduct.length) ? (_e2 = valueSearchResultProduct[0]) == null ? void 0 : _e2.hits : [];
|
|
4003
4045
|
let valueSuggestionIndex = !keyword.length ? "zero_character" : !(getValueSearchResultProduct == null ? void 0 : getValueSearchResultProduct.length) ? "no_result" : "";
|
|
4004
4046
|
let isPriorityZeroCharacter = Boolean(
|
|
4005
|
-
!keyword.length && Object.keys(suggestion).length && ((
|
|
4047
|
+
!keyword.length && Object.keys(suggestion).length && ((_g2 = (_f2 = suggestion[valueSuggestionIndex]) == null ? void 0 : _f2.products) == null ? void 0 : _g2.active) && ((_j2 = (_i2 = (_h2 = suggestion[valueSuggestionIndex]) == null ? void 0 : _h2.products) == null ? void 0 : _i2.list) == null ? void 0 : _j2.length)
|
|
4006
4048
|
);
|
|
4007
|
-
let dataSearchResultProduct = isPriorityZeroCharacter ? (
|
|
4049
|
+
let dataSearchResultProduct = isPriorityZeroCharacter ? (_l2 = (_k2 = suggestion[valueSuggestionIndex]) == null ? void 0 : _k2.products) == null ? void 0 : _l2.list : getValueSearchResultProduct;
|
|
4008
4050
|
if (withFetchReviewInfo) {
|
|
4009
4051
|
let searchResultProductIds = dataSearchResultProduct.map(({ id }) => id);
|
|
4010
4052
|
let valueDataReviews = await getProductsReviewInfo(searchResultProductIds);
|
|
4011
|
-
if (((
|
|
4053
|
+
if (((_m2 = valueDataReviews == null ? void 0 : valueDataReviews.status) == null ? void 0 : _m2.code) === 200)
|
|
4012
4054
|
setDataReviews(valueDataReviews == null ? void 0 : valueDataReviews.data);
|
|
4013
4055
|
} else {
|
|
4014
4056
|
setDataReviews({});
|
|
@@ -4024,10 +4066,11 @@ const SearchIconWidgetPopup = () => {
|
|
|
4024
4066
|
response = JSON.parse(LOCAL_STORAGE_INSTANT_SEARCH_SETTING);
|
|
4025
4067
|
if (!response)
|
|
4026
4068
|
return;
|
|
4027
|
-
const { display, languages } = response;
|
|
4069
|
+
const { display, languages, redirects } = response;
|
|
4028
4070
|
setDisplaySettings(display);
|
|
4029
4071
|
setSuggestionSettings((_a2 = display == null ? void 0 : display.search) == null ? void 0 : _a2.suggestion);
|
|
4030
4072
|
setLanguageSettings(languages);
|
|
4073
|
+
setRedirectsSettings(redirects);
|
|
4031
4074
|
await handleMultiSearch({
|
|
4032
4075
|
data: response,
|
|
4033
4076
|
withFetchReviewInfo: true
|
|
@@ -4109,7 +4152,7 @@ const SearchIconWidgetPopup = () => {
|
|
|
4109
4152
|
if (event.key === "Enter") {
|
|
4110
4153
|
const query = handleFunctions.query;
|
|
4111
4154
|
const queryKeyword = (query == null ? void 0 : query.keyword) ? query.keyword : DEFAULT_QUERY_PARAM.KEYWORD;
|
|
4112
|
-
const urlToSearchResult = `${urlSearchResult || DEFAULT_SEARCH_RESULT_URL}?${queryKeyword}=${keyword}`;
|
|
4155
|
+
const urlToSearchResult = isRedirect ? redirectObjectDirection : `${urlSearchResult || DEFAULT_SEARCH_RESULT_URL}?${queryKeyword}=${keyword}`;
|
|
4113
4156
|
window.location.href = urlToSearchResult;
|
|
4114
4157
|
}
|
|
4115
4158
|
},
|
|
@@ -4270,6 +4313,7 @@ const SearchIconWidgetPopup = () => {
|
|
|
4270
4313
|
showPopupComponent: showInfo,
|
|
4271
4314
|
setShowPopupComponent: setShowInfo,
|
|
4272
4315
|
urlSearchResult,
|
|
4316
|
+
redirectObjectDirection,
|
|
4273
4317
|
query: handleFunctions.query,
|
|
4274
4318
|
languageSettings
|
|
4275
4319
|
}
|
|
@@ -4468,7 +4512,9 @@ const FacetComponent = (props) => {
|
|
|
4468
4512
|
separatedFilterItem,
|
|
4469
4513
|
setSeparatedFilterItem,
|
|
4470
4514
|
settings,
|
|
4471
|
-
scrollElementSelector
|
|
4515
|
+
scrollElementSelector,
|
|
4516
|
+
layoutType,
|
|
4517
|
+
collectionId
|
|
4472
4518
|
} = props;
|
|
4473
4519
|
let aliases = {};
|
|
4474
4520
|
if (filter.value === "hierarchicalProductType")
|
|
@@ -4565,7 +4611,7 @@ const FacetComponent = (props) => {
|
|
|
4565
4611
|
const handleFacetCheckbox = (props2) => {
|
|
4566
4612
|
var _a2, _b2;
|
|
4567
4613
|
const { facetValues, virtualized } = props2;
|
|
4568
|
-
const { index, key
|
|
4614
|
+
const { index, key } = virtualized || {};
|
|
4569
4615
|
return (_b2 = handleFacetValues(virtualized && ((_a2 = Object.keys(virtualized)) == null ? void 0 : _a2.length) ? [facetValues[index]] : facetValues)) == null ? void 0 : _b2.map((facetValue) => {
|
|
4570
4616
|
var _a3;
|
|
4571
4617
|
const { labelName, value: itemValue, counter, children, level } = facetValue;
|
|
@@ -4610,7 +4656,6 @@ const FacetComponent = (props) => {
|
|
|
4610
4656
|
"li",
|
|
4611
4657
|
{
|
|
4612
4658
|
className: `sledge-instant-search__result-filter-checkbox-item ${isFacetHierarchical ? `sledge-instant-search__result-filter-checkbox-item-level sledge-instant-search__result-filter-checkbox-item-level-${level}` : ""}`,
|
|
4613
|
-
style,
|
|
4614
4659
|
children: content
|
|
4615
4660
|
},
|
|
4616
4661
|
key
|
|
@@ -4624,7 +4669,9 @@ const FacetComponent = (props) => {
|
|
|
4624
4669
|
] });
|
|
4625
4670
|
});
|
|
4626
4671
|
};
|
|
4627
|
-
let scrollElement = document.querySelector(
|
|
4672
|
+
let scrollElement = document.querySelector(
|
|
4673
|
+
scrollElementSelector || `#filter-${layoutType}-${collectionId || "all"}-standard-${stringToSlug(value)} .sledge-instant-search__result-filter-item-list`
|
|
4674
|
+
);
|
|
4628
4675
|
if (isDisplaySlider) {
|
|
4629
4676
|
items = (defaultFacetStats == null ? void 0 : defaultFacetStats[value]) && Object.keys(defaultFacetStats[value]).length ? defaultFacetStats[value] : {};
|
|
4630
4677
|
let defaultValueMin = valueFilterPriceChange[0] || (items == null ? void 0 : items.min);
|
|
@@ -4660,7 +4707,6 @@ const FacetComponent = (props) => {
|
|
|
4660
4707
|
scrollElement
|
|
4661
4708
|
},
|
|
4662
4709
|
rowCount: currentItems == null ? void 0 : currentItems.length,
|
|
4663
|
-
rowHeight: 36,
|
|
4664
4710
|
rowRenderer: (props2) => handleFacetCheckbox({
|
|
4665
4711
|
facetValues: currentItems,
|
|
4666
4712
|
virtualized: props2
|
|
@@ -4689,10 +4735,11 @@ const FacetComponent = (props) => {
|
|
|
4689
4735
|
}),
|
|
4690
4736
|
defaultValue: clickedFacets && ((_d = clickedFacets[value]) == null ? void 0 : _d.length) ? clickedFacets[value][0] : "",
|
|
4691
4737
|
labelStyle: filter_option_style,
|
|
4738
|
+
useVirtualized: true,
|
|
4739
|
+
selector: scrollElementSelector,
|
|
4692
4740
|
...scrollElement && {
|
|
4693
4741
|
scrollElement
|
|
4694
|
-
}
|
|
4695
|
-
useVirtualized: true
|
|
4742
|
+
}
|
|
4696
4743
|
}
|
|
4697
4744
|
) });
|
|
4698
4745
|
} else if (display.toLowerCase() === "select" && (currentItems == null ? void 0 : currentItems.length)) {
|
|
@@ -4749,6 +4796,82 @@ const FacetComponent = (props) => {
|
|
|
4749
4796
|
}
|
|
4750
4797
|
return blockComponent;
|
|
4751
4798
|
};
|
|
4799
|
+
const FilterVerticalComponent = (props) => {
|
|
4800
|
+
const { filter, filterSettings, indexFilter, filterTitleStyle = {}, handleOpenFilterVertical, clickedOpenFilters, filterLayoutType, layoutType, collectionId } = props;
|
|
4801
|
+
const { value, label } = filter;
|
|
4802
|
+
const filterItemId = `filter-${layoutType}-${collectionId || "all"}-${filterLayoutType}-${stringToSlug(value)}`;
|
|
4803
|
+
const { isRender, classesUlElement, getFacetComponent } = filterSettings({
|
|
4804
|
+
filter,
|
|
4805
|
+
scrollElementSelector: `#${filterItemId} .sledge-instant-search__result-filter-item-list`
|
|
4806
|
+
});
|
|
4807
|
+
return isRender ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__result-filter-item", id: filterItemId, children: [
|
|
4808
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__result-filter-item-title", onClick: () => handleOpenFilterVertical(value), children: [
|
|
4809
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sledge-instant-search__result-filter-title", style: filterTitleStyle, children: label }),
|
|
4810
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(motion.div, { initial: false, animate: clickedOpenFilters.includes(value) ? "open" : "closed", variants: ROTATE_FILTER_ARROW_ANIMATION, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronArrowDownIcon, { width: 15, height: 15, color: "#000000" }) })
|
|
4811
|
+
] }),
|
|
4812
|
+
clickedOpenFilters.includes(value) && /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: classesUlElement.join(" "), children: getFacetComponent() })
|
|
4813
|
+
] }, indexFilter) : null;
|
|
4814
|
+
};
|
|
4815
|
+
const FilterHorizontalComponent = (props) => {
|
|
4816
|
+
const {
|
|
4817
|
+
filter,
|
|
4818
|
+
filterSettings,
|
|
4819
|
+
indexFilter,
|
|
4820
|
+
deviceType,
|
|
4821
|
+
clickedOpenFilterHorizontalId,
|
|
4822
|
+
setClickedOpenFilterHorizontalId,
|
|
4823
|
+
clickedOpenFilterHorizontalMobileId,
|
|
4824
|
+
setClickedOpenFilterHorizontalMobileId,
|
|
4825
|
+
allowedFilter = [],
|
|
4826
|
+
layoutType,
|
|
4827
|
+
collectionId
|
|
4828
|
+
} = props;
|
|
4829
|
+
const { value, label } = filter;
|
|
4830
|
+
const filterItemId = `filter-${layoutType}-${collectionId || "all"}-${deviceType}-${stringToSlug(value)}`;
|
|
4831
|
+
const getValueOpenFilterId = deviceType === "mobile" ? clickedOpenFilterHorizontalMobileId : clickedOpenFilterHorizontalId;
|
|
4832
|
+
const isOpenFilterHorizontal = getValueOpenFilterId === value;
|
|
4833
|
+
const { isRender, classesUlElement, getFacetComponent, isLastIndex } = filterSettings({
|
|
4834
|
+
filter,
|
|
4835
|
+
scrollElementSelector: `#${filterItemId} .sledge-instant-search__result-filter-item-list`
|
|
4836
|
+
});
|
|
4837
|
+
return isRender ? /* @__PURE__ */ jsxRuntimeExports.jsx(React__default.Fragment, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
4838
|
+
Popover,
|
|
4839
|
+
{
|
|
4840
|
+
trigger: /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
4841
|
+
Button,
|
|
4842
|
+
{
|
|
4843
|
+
type: "button",
|
|
4844
|
+
onClick: () => {
|
|
4845
|
+
if (deviceType === "mobile") {
|
|
4846
|
+
setClickedOpenFilterHorizontalMobileId == null ? void 0 : setClickedOpenFilterHorizontalMobileId(value);
|
|
4847
|
+
} else {
|
|
4848
|
+
setClickedOpenFilterHorizontalId == null ? void 0 : setClickedOpenFilterHorizontalId(value);
|
|
4849
|
+
}
|
|
4850
|
+
},
|
|
4851
|
+
className: `${isLastIndex ? (allowedFilter == null ? void 0 : allowedFilter.length) % 2 ? "sledge-instant-search__result-filter-trigger-odd" : "sledge-instant-search__result-filter-trigger-even" : ""}`,
|
|
4852
|
+
children: [
|
|
4853
|
+
label,
|
|
4854
|
+
/* @__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" }) })
|
|
4855
|
+
]
|
|
4856
|
+
}
|
|
4857
|
+
),
|
|
4858
|
+
content: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-filter-horizontal-facet", id: filterItemId, children: isOpenFilterHorizontal && /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: classesUlElement.join(" "), children: getFacetComponent() }) }),
|
|
4859
|
+
withOpenState: true,
|
|
4860
|
+
isOpen: isOpenFilterHorizontal,
|
|
4861
|
+
setIsOpen: (open) => {
|
|
4862
|
+
if (deviceType === "mobile") {
|
|
4863
|
+
setClickedOpenFilterHorizontalMobileId == null ? void 0 : setClickedOpenFilterHorizontalMobileId(!open ? "" : value);
|
|
4864
|
+
} else {
|
|
4865
|
+
setClickedOpenFilterHorizontalId == null ? void 0 : setClickedOpenFilterHorizontalId(!open ? "" : value);
|
|
4866
|
+
}
|
|
4867
|
+
},
|
|
4868
|
+
hideCloseIcon: true,
|
|
4869
|
+
align: "center",
|
|
4870
|
+
className: "sledge-instant-search__filter-horizontal-facet-content",
|
|
4871
|
+
customArrow: `<svg style="transform: rotate(180deg); margin-bottom: 3px; stroke-dasharray: 0,0,36;" width="44" height="12" viewBox="0 0 44 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M23.2222 1.99825e-06C23.2222 11.9998 4.88979 11.9999 0.000354767 12L23.2222 12L44 12C23.2222 12 23.2222 1.99825e-06 23.2222 1.99825e-06Z" fill="white" stroke="#393d4e" stroke-width="1px" /></svg>`
|
|
4872
|
+
}
|
|
4873
|
+
) }, indexFilter) : null;
|
|
4874
|
+
};
|
|
4752
4875
|
const ButtonLoadMore = ({ text, onClick, isInfiniteScroll, currentPage, totalPage, totalResult, pageInfo: pageInfoProp, isVisibleLoadMore, ...otherProps }) => {
|
|
4753
4876
|
const [ref, entry] = useIntersectionObserver({
|
|
4754
4877
|
threshold: 0,
|
|
@@ -5931,7 +6054,9 @@ const ResultProduct = (props) => {
|
|
|
5931
6054
|
setValueFilterPriceChange,
|
|
5932
6055
|
separatedFilterItem,
|
|
5933
6056
|
setSeparatedFilterItem,
|
|
5934
|
-
scrollElementSelector
|
|
6057
|
+
scrollElementSelector,
|
|
6058
|
+
layoutType,
|
|
6059
|
+
collectionId
|
|
5935
6060
|
}
|
|
5936
6061
|
);
|
|
5937
6062
|
if (display.toLowerCase() === "swatch" && (items == null ? void 0 : items.length))
|
|
@@ -5958,65 +6083,36 @@ const ResultProduct = (props) => {
|
|
|
5958
6083
|
});
|
|
5959
6084
|
}) })
|
|
5960
6085
|
] }) : null;
|
|
5961
|
-
const filterVerticalComponents = ({ filterLayoutType }) => allowedFilter == null ? void 0 : allowedFilter.map((filter, indexFilter) =>
|
|
5962
|
-
|
|
5963
|
-
|
|
5964
|
-
const { isRender, classesUlElement, getFacetComponent } = filterSettings({ filter, scrollElementSelector: `#${filterItemId} .sledge-instant-search__result-filter-item-list` });
|
|
5965
|
-
return isRender ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__result-filter-item", id: filterItemId, children: [
|
|
5966
|
-
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__result-filter-item-title", onClick: () => handleOpenFilterVertical(value), children: [
|
|
5967
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sledge-instant-search__result-filter-title", style: filter_title_style, children: label }),
|
|
5968
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(motion.div, { initial: false, animate: clickedOpenFilters.includes(value) ? "open" : "closed", variants: ROTATE_FILTER_ARROW_ANIMATION, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronArrowDownIcon, { width: 15, height: 15, color: "#000000" }) })
|
|
5969
|
-
] }),
|
|
5970
|
-
clickedOpenFilters.includes(value) && /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: classesUlElement.join(" "), children: getFacetComponent() })
|
|
5971
|
-
] }, indexFilter) : null;
|
|
5972
|
-
});
|
|
5973
|
-
const filterHorizontalComponents = ({ deviceType }) => allowedFilter == null ? void 0 : allowedFilter.map((filter, indexFilter) => {
|
|
5974
|
-
const { value, label } = filter;
|
|
5975
|
-
const filterItemId = `filter-component-${deviceType}-${stringToSlug(value)}`;
|
|
5976
|
-
const getValueOpenFilterId = deviceType === "mobile" ? clickedOpenFilterHorizontalMobileId : clickedOpenFilterHorizontalId;
|
|
5977
|
-
const isOpenFilterHorizontal = getValueOpenFilterId === value;
|
|
5978
|
-
const { isRender, classesUlElement, getFacetComponent, isLastIndex } = filterSettings({
|
|
6086
|
+
const filterVerticalComponents = ({ filterLayoutType }) => allowedFilter == null ? void 0 : allowedFilter.map((filter, indexFilter) => /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
6087
|
+
FilterVerticalComponent,
|
|
6088
|
+
{
|
|
5979
6089
|
filter,
|
|
5980
|
-
|
|
5981
|
-
|
|
5982
|
-
|
|
5983
|
-
|
|
5984
|
-
|
|
5985
|
-
|
|
5986
|
-
|
|
5987
|
-
|
|
5988
|
-
|
|
5989
|
-
|
|
5990
|
-
|
|
5991
|
-
|
|
5992
|
-
|
|
5993
|
-
|
|
5994
|
-
|
|
5995
|
-
|
|
5996
|
-
|
|
5997
|
-
|
|
5998
|
-
|
|
5999
|
-
|
|
6000
|
-
|
|
6001
|
-
|
|
6002
|
-
|
|
6003
|
-
|
|
6004
|
-
|
|
6005
|
-
|
|
6006
|
-
setIsOpen: (open) => {
|
|
6007
|
-
if (deviceType === "mobile") {
|
|
6008
|
-
setClickedOpenFilterHorizontalMobileId == null ? void 0 : setClickedOpenFilterHorizontalMobileId(!open ? "" : value);
|
|
6009
|
-
} else {
|
|
6010
|
-
setClickedOpenFilterHorizontalId == null ? void 0 : setClickedOpenFilterHorizontalId(!open ? "" : value);
|
|
6011
|
-
}
|
|
6012
|
-
},
|
|
6013
|
-
hideCloseIcon: true,
|
|
6014
|
-
align: "center",
|
|
6015
|
-
className: "sledge-instant-search__filter-horizontal-facet-content",
|
|
6016
|
-
customArrow: `<svg style="transform: rotate(180deg); margin-bottom: 3px; stroke-dasharray: 0,0,36;" width="44" height="12" viewBox="0 0 44 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M23.2222 1.99825e-06C23.2222 11.9998 4.88979 11.9999 0.000354767 12L23.2222 12L44 12C23.2222 12 23.2222 1.99825e-06 23.2222 1.99825e-06Z" fill="white" stroke="#393d4e" stroke-width="1px" /></svg>`
|
|
6017
|
-
}
|
|
6018
|
-
) }, indexFilter) : null;
|
|
6019
|
-
});
|
|
6090
|
+
filterSettings,
|
|
6091
|
+
indexFilter,
|
|
6092
|
+
filterTitleStyle: filter_title_style,
|
|
6093
|
+
handleOpenFilterVertical,
|
|
6094
|
+
clickedOpenFilters,
|
|
6095
|
+
filterLayoutType,
|
|
6096
|
+
layoutType,
|
|
6097
|
+
collectionId
|
|
6098
|
+
}
|
|
6099
|
+
));
|
|
6100
|
+
const filterHorizontalComponents = ({ deviceType }) => allowedFilter == null ? void 0 : allowedFilter.map((filter, indexFilter) => /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
6101
|
+
FilterHorizontalComponent,
|
|
6102
|
+
{
|
|
6103
|
+
filter,
|
|
6104
|
+
filterSettings,
|
|
6105
|
+
indexFilter,
|
|
6106
|
+
deviceType,
|
|
6107
|
+
clickedOpenFilterHorizontalId,
|
|
6108
|
+
setClickedOpenFilterHorizontalId,
|
|
6109
|
+
clickedOpenFilterHorizontalMobileId,
|
|
6110
|
+
setClickedOpenFilterHorizontalMobileId,
|
|
6111
|
+
allowedFilter,
|
|
6112
|
+
layoutType,
|
|
6113
|
+
collectionId
|
|
6114
|
+
}
|
|
6115
|
+
));
|
|
6020
6116
|
const paginationComponent = isLoadMore ? /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
6021
6117
|
ButtonLoadMore,
|
|
6022
6118
|
{
|
|
@@ -6426,15 +6522,26 @@ const SearchWidget = (props) => {
|
|
|
6426
6522
|
const [suggestionIndex, setSuggestionIndex] = React__default.useState("");
|
|
6427
6523
|
const [showSearchResult, setShowSearchResult] = React__default.useState(false);
|
|
6428
6524
|
const [languageSettings, setLanguageSettings] = React__default.useState({});
|
|
6525
|
+
const [redirectsSettings, setRedirectsSettings] = React__default.useState([]);
|
|
6526
|
+
const [redirectObject, setRedirectObject] = React__default.useState({});
|
|
6527
|
+
const [isRedirect, setIsRedirect] = React__default.useState(false);
|
|
6429
6528
|
const previousState = usePrevious({ keyword });
|
|
6430
6529
|
const searchFieldRef = React__default.useRef(null);
|
|
6530
|
+
const { direction: redirectObjectDirection } = redirectObject || {};
|
|
6431
6531
|
const handleMultiSearch = async (data, onSearch = false) => {
|
|
6432
|
-
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2;
|
|
6532
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2;
|
|
6433
6533
|
if (!keyword.length)
|
|
6434
6534
|
return;
|
|
6535
|
+
const valueRedirectObject = redirectsSettings.find(({ keyword: redirectKeyword }) => {
|
|
6536
|
+
var _a3;
|
|
6537
|
+
return ((_a3 = String(redirectKeyword)) == null ? void 0 : _a3.toLowerCase()) === keyword;
|
|
6538
|
+
});
|
|
6539
|
+
const valueIsRedirect = Boolean((_a2 = valueRedirectObject == null ? void 0 : valueRedirectObject.direction) == null ? void 0 : _a2.length);
|
|
6540
|
+
setRedirectObject(valueRedirectObject);
|
|
6541
|
+
setIsRedirect(valueIsRedirect);
|
|
6435
6542
|
setIsLoading(true);
|
|
6436
6543
|
const { index_product, tabs, hidden_tags, display, show_out_of_stock } = data;
|
|
6437
|
-
const suggestion = ((
|
|
6544
|
+
const suggestion = ((_b2 = display == null ? void 0 : display.search) == null ? void 0 : _b2.suggestion) || {};
|
|
6438
6545
|
let response;
|
|
6439
6546
|
let body = {
|
|
6440
6547
|
queries: tabs.map((tab) => {
|
|
@@ -6461,10 +6568,10 @@ const SearchWidget = (props) => {
|
|
|
6461
6568
|
if (onSearch && (keyword == null ? void 0 : keyword.length)) {
|
|
6462
6569
|
searchTrigger({
|
|
6463
6570
|
keyword,
|
|
6464
|
-
resultCount: ((
|
|
6571
|
+
resultCount: ((_c2 = valueSearchResultProduct[0]) == null ? void 0 : _c2.totalHits) || 0
|
|
6465
6572
|
});
|
|
6466
6573
|
}
|
|
6467
|
-
let valueSearchResultOther = ((
|
|
6574
|
+
let valueSearchResultOther = ((_d2 = results == null ? void 0 : results.filter(({ indexUid }) => !(indexUid == null ? void 0 : indexUid.includes(index_product)))) == null ? void 0 : _d2.map((result) => {
|
|
6468
6575
|
const { indexUid } = result;
|
|
6469
6576
|
const { name, type } = tabs == null ? void 0 : tabs.find(({ index }) => index.includes(indexUid));
|
|
6470
6577
|
return {
|
|
@@ -6475,12 +6582,12 @@ const SearchWidget = (props) => {
|
|
|
6475
6582
|
}
|
|
6476
6583
|
};
|
|
6477
6584
|
})) || [];
|
|
6478
|
-
let getValueSearchResultProduct = (valueSearchResultProduct == null ? void 0 : valueSearchResultProduct.length) ? (
|
|
6585
|
+
let getValueSearchResultProduct = (valueSearchResultProduct == null ? void 0 : valueSearchResultProduct.length) ? (_e2 = valueSearchResultProduct[0]) == null ? void 0 : _e2.hits : [];
|
|
6479
6586
|
let valueSuggestionIndex = !keyword.length ? "zero_character" : !(getValueSearchResultProduct == null ? void 0 : getValueSearchResultProduct.length) ? "no_result" : "";
|
|
6480
6587
|
let isPriorityZeroCharacter = Boolean(
|
|
6481
|
-
!keyword.length && Object.keys(suggestion).length && ((
|
|
6588
|
+
!keyword.length && Object.keys(suggestion).length && ((_g2 = (_f2 = suggestion[valueSuggestionIndex]) == null ? void 0 : _f2.products) == null ? void 0 : _g2.active) && ((_j2 = (_i2 = (_h2 = suggestion[valueSuggestionIndex]) == null ? void 0 : _h2.products) == null ? void 0 : _i2.list) == null ? void 0 : _j2.length)
|
|
6482
6589
|
);
|
|
6483
|
-
setSearchResultProduct(isPriorityZeroCharacter ? (
|
|
6590
|
+
setSearchResultProduct(isPriorityZeroCharacter ? (_l2 = (_k2 = suggestion[valueSuggestionIndex]) == null ? void 0 : _k2.products) == null ? void 0 : _l2.list : getValueSearchResultProduct);
|
|
6484
6591
|
setSearchResultOther(valueSearchResultOther);
|
|
6485
6592
|
setSuggestionIndex(valueSuggestionIndex);
|
|
6486
6593
|
setIsLoading(false);
|
|
@@ -6491,10 +6598,11 @@ const SearchWidget = (props) => {
|
|
|
6491
6598
|
response = JSON.parse(LOCAL_STORAGE_INSTANT_SEARCH_SETTING);
|
|
6492
6599
|
if (!response)
|
|
6493
6600
|
return;
|
|
6494
|
-
const { display, languages } = response;
|
|
6601
|
+
const { display, languages, redirects } = response;
|
|
6495
6602
|
setDisplaySettings(display);
|
|
6496
6603
|
setSuggestionSettings((_a2 = display == null ? void 0 : display.search) == null ? void 0 : _a2.suggestion);
|
|
6497
6604
|
setLanguageSettings(languages);
|
|
6605
|
+
setRedirectsSettings(redirects);
|
|
6498
6606
|
if (keyword.length)
|
|
6499
6607
|
await handleMultiSearch(response);
|
|
6500
6608
|
};
|
|
@@ -6537,7 +6645,7 @@ const SearchWidget = (props) => {
|
|
|
6537
6645
|
onKeyDown: (event) => {
|
|
6538
6646
|
if (event.key === "Enter") {
|
|
6539
6647
|
const queryKeyword = (query == null ? void 0 : query.keyword) ? query.keyword : DEFAULT_QUERY_PARAM.KEYWORD;
|
|
6540
|
-
const urlToSearchResult = `${urlSearchResult || DEFAULT_SEARCH_RESULT_URL}?${queryKeyword}=${keyword}`;
|
|
6648
|
+
const urlToSearchResult = isRedirect ? redirectObjectDirection : `${urlSearchResult || DEFAULT_SEARCH_RESULT_URL}?${queryKeyword}=${keyword}`;
|
|
6541
6649
|
window.location.href = urlToSearchResult;
|
|
6542
6650
|
}
|
|
6543
6651
|
},
|
|
@@ -6693,6 +6801,7 @@ const SearchWidget = (props) => {
|
|
|
6693
6801
|
keyword,
|
|
6694
6802
|
isComponentJsVersion: isJsVersion,
|
|
6695
6803
|
urlSearchResult,
|
|
6804
|
+
redirectObjectDirection,
|
|
6696
6805
|
query,
|
|
6697
6806
|
languageSettings
|
|
6698
6807
|
}
|