@sledge-app/react-instant-search 2.0.24 → 2.0.26

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

@@ -1156,14 +1156,31 @@ const RadioGroup = ({ id, name, required, value, items, labelStyle = {}, onValue
   ) }) }) });
 };
 const ColorSwatch$1 = "";
-const ColorSwatch = ({ id, name, value, rgb, image, required, checked, onClick, labelType = "tooltip", label, labelStyle = {} }) => {
+const ColorSwatch = ({ id, name, value, rgb, additionalRgb: additionalRgbProp = [], image, required, checked, onClick, labelType = "tooltip", label, labelStyle = {} }) => {
+  var _a;
+  const additionalRgb = (_a = additionalRgbProp == null ? void 0 : additionalRgbProp.filter) == null ? void 0 : _a.call(additionalRgbProp, (item) => item);
+  let rgbStyle = {
+    backgroundColor: rgb
+  };
+  if (additionalRgb == null ? void 0 : additionalRgb.length) {
+    rgbStyle = {
+      background: `linear-gradient(to bottom right, ${rgb} 50%, ${additionalRgb[0]} 50%)`
+    };
+    if ((additionalRgb == null ? void 0 : additionalRgb.length) > 1) {
+      rgbStyle = {
+        background: `conic-gradient(
+                    ${rgb} 0deg 120deg,
+                    ${additionalRgb[0]} 120deg 240deg,
+                    ${additionalRgb[1]} 240deg 360deg
+                )`
+      };
+    }
+  }
   const styles = {
     ...(image == null ? void 0 : image.length) ? {
       backgroundImage: `url("${image}")`,
       backgroundSize: "contain"
-    } : {
-      backgroundColor: rgb
-    }
+    } : rgbStyle
   };
   const colorSwatchComponent = /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__color-swatch-wrapper", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx($e698a72e93240346$export$be92b6f5f03c0fe9, { className: "sledge__color-swatch-root", checked, id, name, value, required, onClick, style: styles }),
@@ -7820,6 +7837,7 @@ const Facet = (props) => {
         name: value,
         value: item == null ? void 0 : item.value,
         rgb: getColorSwatch == null ? void 0 : getColorSwatch.rgb,
+        additionalRgb: [(getColorSwatch == null ? void 0 : getColorSwatch.color_2) || null, (getColorSwatch == null ? void 0 : getColorSwatch.color_3) || null],
         image: getColorSwatch == null ? void 0 : getColorSwatch.image,
         onClick: (e) => handleFilterChange({
           parentId: value,
@@ -8698,7 +8716,7 @@ const DesktopLayout = (props) => {
   );
 };
 const FilterFlyoutLayout = (props) => {
-  var _a, _b, _c;
+  var _a, _b, _c, _d;
   const {
     displaySettings,
     languageSettings,
@@ -8756,17 +8774,17 @@ const FilterFlyoutLayout = (props) => {
         selectOptionSkeletonComponent
       ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(SummaryTextHorizontal, { children: summaryText }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }),
+        ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null,
         /* @__PURE__ */ jsxRuntimeExports.jsx(FilterHorizontalBlockMobile, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(ResultSearchFieldFlex, { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { type: "button", className: "sledge-instant-search__trigger-filter-flyout", onClick: () => setOpenFilterFlyout == null ? void 0 : setOpenFilterFlyout(true), children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: language_filter || "Filter" }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(FilterIcon, { width: 18, height: 18, color: "#393d4e" })
           ] }),
-          ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar) ? null : searchField
+          ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_search_bar) ? null : searchField
         ] }) }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-          ((_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_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: [
@@ -8777,7 +8795,7 @@ const FilterFlyoutLayout = (props) => {
   ] });
 };
 const FilterStandardLayout = (props) => {
-  var _a, _b, _c;
+  var _a, _b, _c, _d;
   const { displaySettings, languageSettings, allowedFilter, isFirstLoading, isLoading, isLoadingProduct, isLoadingSetting, searchResult = [], components, skeleton } = props;
   const {
     filterHorizontal = null,
@@ -8807,14 +8825,14 @@ const FilterStandardLayout = (props) => {
       selectOptionSkeletonComponent
     ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(SummaryTextHorizontal, { children: summaryText }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }),
+      ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null,
       /* @__PURE__ */ jsxRuntimeExports.jsxs(FilterHorizontalBlockMobile, { children: [
-        ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar) ? null : searchField,
+        ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_search_bar) ? null : searchField,
         filterHorizontal == null ? void 0 : filterHorizontal({ deviceType: "mobile" })
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-        ((_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_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: [
@@ -8824,7 +8842,7 @@ const FilterStandardLayout = (props) => {
   ] }) }) });
 };
 const StickyFilterButtonLayout = (props) => {
-  var _a, _b, _c;
+  var _a, _b, _c, _d;
   const {
     displaySettings,
     languageSettings,
@@ -8886,11 +8904,11 @@ const StickyFilterButtonLayout = (props) => {
         selectOptionSkeletonComponent
       ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(SummaryTextHorizontal, { children: summaryText }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }),
-        ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.hide_search_bar) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(FilterHorizontalBlockMobile, { children: searchField }),
+        ((_b = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _b.show_switch_view_option) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ColumnGridSelectorWrapper, { children: columnGridSelector }) : null,
+        ((_c = displaySettings == null ? void 0 : displaySettings.search) == null ? void 0 : _c.hide_search_bar) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(FilterHorizontalBlockMobile, { children: searchField }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectFieldWrapper, { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(SelectFieldItem, { children: sort }),
-          ((_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_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: [