tabexseriescomponents 0.0.168 → 0.0.170

package/dist/index.cjs.js

@@ -8638,7 +8638,7 @@ var Filter$1 = function Filter(props) {
     })
   };
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "col-lg-12 p-0 w-100 filter mt-md-0",
+    className: "col-lg-12 p-0 w-100 filter mt-md-0 d-md-none",
     style: {
       marginTop: sectionproperties.filtersection_mt + 'px',
       zIndex: 1000000
@@ -8711,7 +8711,7 @@ var Filter$1 = function Filter(props) {
       }, langdetect == 'en' ? valueitem.valuename : valueitem.valuename_ar)));
     }))))));
   })), sectionproperties.filterdirection == 'Vertical' && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(filterstyles.filterslider_container),
+    className: "".concat(filterstyles.filterslider_container) + ' pb-md-5 ',
     id: "filterslider",
     style: {
       background: sectionproperties.filter_backgroundcolor,
@@ -8756,13 +8756,13 @@ var Filter$1 = function Filter(props) {
     }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItem, {
       uuid: index
     }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemHeading, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemButton, null, /*#__PURE__*/React__default["default"].createElement("div", {
-      className: filter_cssstyles.titlecontainer + ' row m-0 p-0 mb-2 '
+      className: filter_cssstyles.titlecontainer + ' row m-0 p-0 mb-2 pl-md-3 pr-md-3  '
     }, /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "col-lg-10 p-0"
+      className: "col-lg-10 col-md-10 col-sm-10 p-0"
     }, /*#__PURE__*/React__default["default"].createElement("p", {
       className: langdetect == 'en' ? filter_cssstyles.collapsetitle + ' m-0 p-0 ' : filter_cssstyles.collapsetitle + ' m-0 p-0 text-right'
     }, item.name)), /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "col-lg-2 p-0"
+      className: "col-lg-2 col-md-2 col-sm-2 p-0"
     }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemState, null, function (state) {
       if (state.expanded == true) {
         return /*#__PURE__*/React__default["default"].createElement("i", {
@@ -8857,13 +8857,13 @@ var Filter$1 = function Filter(props) {
   }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItem, {
     uuid: 0
   }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemHeading, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemButton, null, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: filter_cssstyles.titlecontainer + ' row m-0 p-0 mb-2 '
+    className: filter_cssstyles.titlecontainer + ' row m-0 p-0 mb-2 pl-md-3 pr-md-3 '
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "col-lg-10 p-0"
+    className: "col-lg-10 col-md-10 col-sm-10 p-0"
   }, /*#__PURE__*/React__default["default"].createElement("p", {
     className: langdetect == 'en' ? filter_cssstyles.collapsetitle + ' m-0 p-0 ' : filter_cssstyles.collapsetitle + ' m-0 p-0 text-right'
   }, langdetect == 'en' ? sectionproperties.filtercollectiontitle_en : sectionproperties.filtercollectiontitle_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "col-lg-2 p-0"
+    className: "col-lg-2 col-md-2 col-sm-2 p-0"
   }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemState, null, function (state) {
     if (state.expanded == true) {
       return /*#__PURE__*/React__default["default"].createElement("i", {
@@ -8910,13 +8910,13 @@ var Filter$1 = function Filter(props) {
     return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItem, {
       uuid: index
     }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemHeading, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemButton, null, /*#__PURE__*/React__default["default"].createElement("div", {
-      className: filter_cssstyles.titlecontainer + ' row m-0 p-0 mb-2 '
+      className: filter_cssstyles.titlecontainer + ' row m-0 p-0 mb-2 pl-md-3 pr-md-3 '
     }, /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "col-lg-10 p-0"
+      className: "col-lg-10 col-md-10 col-sm-10 p-0"
     }, /*#__PURE__*/React__default["default"].createElement("p", {
       className: langdetect == 'en' ? filter_cssstyles.collapsetitle + ' m-0 p-0 ' : filter_cssstyles.collapsetitle + ' m-0 p-0 text-right'
     }, langdetect == 'en' ? item.optionname : item.optionname_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "col-lg-2 p-0"
+      className: "col-lg-2 col-md-2 col-sm-2 p-0"
     }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemState, null, function (state) {
       if (state.expanded == true) {
         return /*#__PURE__*/React__default["default"].createElement("i", {
@@ -8956,7 +8956,252 @@ var Filter$1 = function Filter(props) {
     })))))), /*#__PURE__*/React__default["default"].createElement("hr", {
       className: "mt-3 mb-3"
     }));
-  }))))));
+  }))))), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-lg-12",
+    style: {
+      zIndex: 200000
+    }
+  }, /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas, {
+    show: props === null || props === void 0 ? void 0 : props.openFilterSlider,
+    onHide: function onHide() {
+      props.setopenFilterSlider(false);
+    },
+    placement: "end",
+    scroll: true,
+    style: {
+      minWidth: '200px',
+      background: sectionproperties.filter_backgroundcolor,
+      borderRadius: sectionproperties.filter_borderBottomLeftRadius + 'px'
+    },
+    backdrop: true
+  }, /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas.Header, null, /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas.Title, null, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "row m-0 w-100 mt-2"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-lg-9 col-md-9 col-sm-9 d-none align-items-center d-md-flex"
+  }, /*#__PURE__*/React__default["default"].createElement("p", {
+    className: "m-0 p-0  font-16 font-weight-600",
+    style: {
+      color: sectionproperties.filter_titlecolor,
+      fontSize: sectionproperties.filter_titlefontsize + 'px',
+      fontWeight: sectionproperties.filter_titlefontweight,
+      textTransform: sectionproperties.filter_titletextransform
+    }
+  }, langdetect == 'en' ? 'Filter' : 'فلترة')), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-lg-3 col-md-3 col-sm-3 d-none d-md-flex align-items-center justify-content-end p-0"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "".concat(filterstyles.close_menu_icon_cont, " ").concat(filter_cssstyles.close_menu_icon_cont) + ' d-none d-md-flex align-items-center justify-content-center ',
+    onClick: function onClick() {
+      props.setopenFilterSlider(false);
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("i", {
+    className: "h-100 d-flex align-items-center justify-content-center"
+  }, /*#__PURE__*/React__default["default"].createElement(IoMdClose.IoMdClose, {
+    size: sectionproperties.closeSlider_fontSize,
+    style: {
+      color: sectionproperties.closeSlider_color
+    }
+  })))), /*#__PURE__*/React__default["default"].createElement("div", {
+    "class": "col-lg-12"
+  }, /*#__PURE__*/React__default["default"].createElement("hr", {
+    "class": "mt-2 mb-2"
+  }))))), /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas.Body, null, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: ' pb-md-5 ',
+    style: {
+      background: sectionproperties.filter_backgroundcolor,
+      borderRadius: sectionproperties.filter_borderBottomLeftRadius + 'px',
+      zIndex: 100000
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: filter_cssstyles.filteraccordion + ' row m-0 w-100 pt-2 pb-3 filter-accordion '
+  }, sectionproperties.otherfilters == 'Show' && otherfilters.map(function (item, index) {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.Accordion, {
+      allowMultipleExpanded: true,
+      allowZeroExpanded: true,
+      preExpanded: [0, 1, 2, 3],
+      style: {
+        width: '100%'
+      }
+    }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItem, {
+      uuid: index
+    }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemHeading, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemButton, null, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: filter_cssstyles.titlecontainer + ' row m-0 p-0 mb-2 pl-md-3 pr-md-3  '
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "col-lg-10 col-md-10 col-sm-10 p-0"
+    }, /*#__PURE__*/React__default["default"].createElement("p", {
+      className: langdetect == 'en' ? filter_cssstyles.collapsetitle + ' m-0 p-0 ' : filter_cssstyles.collapsetitle + ' m-0 p-0 text-right'
+    }, item.name)), /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "col-lg-2 col-md-2 col-sm-2 p-0"
+    }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemState, null, function (state) {
+      if (state.expanded == true) {
+        return /*#__PURE__*/React__default["default"].createElement("i", {
+          className: filter_cssstyles.collapsetitleicon + ' h-100 d-flex align-items-center justify-content-end accordion__button '
+        }, /*#__PURE__*/React__default["default"].createElement(AiOutlineMinus.AiOutlineMinus, null));
+      } else {
+        return /*#__PURE__*/React__default["default"].createElement("i", {
+          className: filter_cssstyles.collapsetitleicon + ' h-100 d-flex align-items-center justify-content-end accordion__button '
+        }, /*#__PURE__*/React__default["default"].createElement(HiOutlinePlus.HiOutlinePlus, null));
+      }
+    }))))), /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemPanel, {
+      className: "p-0"
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "row mt-0 mb-2 ml-0 mr-0 d-lg-flex"
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: 'col-lg-12'
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: langdetect == 'en' ? "".concat(filterstyles.timeline) + ' p-sm-0 ' : "".concat(filterstyles.timeline, " ").concat(filterstyles.timelinetrans) + ' p-sm-0 '
+    }, item.filterarray.map(function (valueitem, valueindex) {
+      var ischecked = false;
+      if (item.payloadvalue == 'sortprice') {
+        if (valueitem.value == ProductFilterObjContext.sortprice) {
+          ischecked = true;
+        }
+      } else if (item.payloadvalue == 'sortdates') {
+        if (valueitem.value == ProductFilterObjContext.sortdates) {
+          ischecked = true;
+        }
+      }
+      return /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "".concat(filterstyles.border_left_line, " ").concat(filterstyles.timelineinnercont, " ").concat(filter_cssstyles.timelineinnercont, "\n                                                                ").concat(ischecked ? "".concat(filter_cssstyles.timelineinnercont_active, " ").concat(filterstyles.timelineinnercont_active) : '', "\n                                                                         \n                                                                            ") + ' d-flex align-items-start pb-3 ',
+        onClick: function onClick() {
+          // setfilterfunc(valueitem.valueid, valueindex, index, 'assign');
+          var tempfetchproductsfilerobjcontext = _objectSpread$1C({}, ProductFilterObjContext);
+          if (tempfetchproductsfilerobjcontext[item.payloadvalue] == valueitem.value) {
+            tempfetchproductsfilerobjcontext[item.payloadvalue] = '';
+          } else {
+            tempfetchproductsfilerobjcontext[item.payloadvalue] = valueitem.value;
+          }
+          setProductFilterObjContext(_objectSpread$1C({}, tempfetchproductsfilerobjcontext));
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", {
+        className: " ".concat(ischecked ? filter_cssstyles.btn_item_active : '', " ").concat(filterstyles.btn_item, " ").concat(filter_cssstyles.btn_item) + ' mb-2 d-flex align-items-center '
+      }, /*#__PURE__*/React__default["default"].createElement("i", {
+        className: "h-100 d-flex align-items-center"
+      }))), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: langdetect == 'en' ? 'ml-3' : 'mr-3 text-right'
+      }, /*#__PURE__*/React__default["default"].createElement("p", {
+        className: "".concat(filterstyles.timeline_text, " ").concat(filter_cssstyles.timeline_text) + ' m-0 p-0 ',
+        style: {
+          color: ischecked ? sectionproperties.activecat_color : ''
+        }
+      }, valueitem.name)));
+    }))))))), /*#__PURE__*/React__default["default"].createElement("hr", {
+      className: "mt-3 mb-3"
+    }));
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-lg-12"
+  }, /*#__PURE__*/React__default["default"].createElement("hr", {
+    className: "mt-2 mb-3"
+  })), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: filter_cssstyles.filteraccordion + ' col-lg-12 filter-accordion p-md-0 '
+  }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.Accordion, {
+    allowMultipleExpanded: true,
+    allowZeroExpanded: true,
+    preExpanded: [0, 1, 2, 3]
+  }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItem, {
+    uuid: 0
+  }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemHeading, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemButton, null, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: filter_cssstyles.titlecontainer + ' row m-0 p-0 mb-2 pl-md-3 pr-md-3 '
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-lg-10 col-md-10 col-sm-10 p-0"
+  }, /*#__PURE__*/React__default["default"].createElement("p", {
+    className: langdetect == 'en' ? filter_cssstyles.collapsetitle + ' m-0 p-0 ' : filter_cssstyles.collapsetitle + ' m-0 p-0 text-right'
+  }, langdetect == 'en' ? sectionproperties.filtercollectiontitle_en : sectionproperties.filtercollectiontitle_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-lg-2 col-md-2 col-sm-2 p-0"
+  }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemState, null, function (state) {
+    if (state.expanded == true) {
+      return /*#__PURE__*/React__default["default"].createElement("i", {
+        className: filter_cssstyles.collapsetitleicon + ' h-100 d-flex align-items-center justify-content-end accordion__button '
+      }, /*#__PURE__*/React__default["default"].createElement(AiOutlineMinus.AiOutlineMinus, null));
+    } else {
+      return /*#__PURE__*/React__default["default"].createElement("i", {
+        className: filter_cssstyles.collapsetitleicon + ' h-100 d-flex align-items-center justify-content-end accordion__button '
+      }, /*#__PURE__*/React__default["default"].createElement(HiOutlinePlus.HiOutlinePlus, null));
+    }
+  }))))), /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemPanel, {
+    className: "p-0"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "row mt-0 mb-2 ml-0 mr-0 d-lg-flex"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: 'col-lg-12'
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: langdetect == 'en' ? "".concat(filterstyles.timeline, "  ").concat(filterstyles.timelinetrans) + ' p-sm-0 ' : "".concat(filterstyles.timeline, " ").concat(filterstyles.timelinetrans) + ' p-sm-0 '
+  }, instcollections.map(function (item, index) {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "".concat(filterstyles.border_left_line, " ").concat(filterstyles.timelineinnercont, " ").concat(filter_cssstyles.timelineinnercont, "\n                                                                        ").concat(item.isfilterselected ? "".concat(filter_cssstyles.timelineinnercont_active, " ").concat(filterstyles.timelineinnercont_active) : '', "\n                                                                        ") + ' d-flex align-items-start pb-3 ',
+      onClick: function onClick() {
+        setCollectionFilterFunc(item.collectionid);
+      }
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: " ".concat(item.isfilterselected ? filter_cssstyles.btn_item_active : '', " ").concat(filterstyles.btn_item, " ").concat(filter_cssstyles.btn_item) + ' mb-2 d-flex align-items-center '
+    }, /*#__PURE__*/React__default["default"].createElement("i", {
+      className: "h-100 d-flex align-items-center"
+    })), /*#__PURE__*/React__default["default"].createElement("div", {
+      className: langdetect == 'en' ? 'ml-3' : 'mr-3 text-right'
+    }, /*#__PURE__*/React__default["default"].createElement("p", {
+      className: "".concat(filterstyles.timeline_text, " ").concat(filter_cssstyles.timeline_text) + ' m-0 p-0 ',
+      style: {
+        color: item.isfilterselected ? sectionproperties.activecat_color : ''
+      }
+    }, langdetect == 'en' ? item.title_en : item.title_ar)));
+  }))))))), /*#__PURE__*/React__default["default"].createElement("div", {
+    "class": "col-lg-12"
+  }, /*#__PURE__*/React__default["default"].createElement("hr", {
+    className: "mt-3 mb-3"
+  })), /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.Accordion, {
+    allowMultipleExpanded: true,
+    allowZeroExpanded: true,
+    preExpanded: [0, 1, 2, 3]
+  }, instfilters.map(function (item, index) {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItem, {
+      uuid: index
+    }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemHeading, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemButton, null, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: filter_cssstyles.titlecontainer + ' row m-0 p-0 mb-2 pl-md-3 pr-md-3 '
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "col-lg-10 col-md-10 col-sm-10 p-0"
+    }, /*#__PURE__*/React__default["default"].createElement("p", {
+      className: langdetect == 'en' ? filter_cssstyles.collapsetitle + ' m-0 p-0 ' : filter_cssstyles.collapsetitle + ' m-0 p-0 text-right'
+    }, langdetect == 'en' ? item.optionname : item.optionname_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "col-lg-2 col-md-2 col-sm-2 p-0"
+    }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemState, null, function (state) {
+      if (state.expanded == true) {
+        return /*#__PURE__*/React__default["default"].createElement("i", {
+          className: filter_cssstyles.collapsetitleicon + ' h-100 d-flex align-items-center justify-content-end accordion__button '
+        }, /*#__PURE__*/React__default["default"].createElement(AiOutlineMinus.AiOutlineMinus, null));
+      } else {
+        return /*#__PURE__*/React__default["default"].createElement("i", {
+          className: filter_cssstyles.collapsetitleicon + ' h-100 d-flex align-items-center justify-content-end accordion__button '
+        }, /*#__PURE__*/React__default["default"].createElement(HiOutlinePlus.HiOutlinePlus, null));
+      }
+    }))))), /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemPanel, {
+      className: "p-0"
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "row mt-0 mb-2 ml-0 mr-0 d-lg-flex"
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: 'col-lg-12'
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: langdetect == 'en' ? "".concat(filterstyles.timeline) + ' p-sm-0 ' : "".concat(filterstyles.timeline, " ").concat(filterstyles.timelinetrans) + ' p-sm-0 '
+    }, item.productvaluesfilter.map(function (valueitem, valueindex) {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "".concat(filterstyles.border_left_line, " ").concat(filterstyles.timelineinnercont, " ").concat(filter_cssstyles.timelineinnercont, "\n                                                                ").concat(valueitem.isfilterselected ? "".concat(filter_cssstyles.timelineinnercont_active, " ").concat(filterstyles.timelineinnercont_active) : '', "\n                                                                         \n                                                                            ") + ' d-flex align-items-start pb-3 ',
+        onClick: function onClick() {
+          setfilterfunc(valueitem.valueid, valueindex, index, 'assign');
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", {
+        className: " ".concat(valueitem.isfilterselected ? filter_cssstyles.btn_item_active : '', " ").concat(filterstyles.btn_item, " ").concat(filter_cssstyles.btn_item) + ' mb-2 d-flex align-items-center '
+      }, /*#__PURE__*/React__default["default"].createElement("i", {
+        className: "h-100 d-flex align-items-center"
+      }))), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: langdetect == 'en' ? 'ml-3' : 'mr-3 text-right'
+      }, /*#__PURE__*/React__default["default"].createElement("p", {
+        className: "".concat(filterstyles.timeline_text, " ").concat(filter_cssstyles.timeline_text) + ' m-0 p-0 ',
+        style: {
+          color: valueitem.isfilterselected ? sectionproperties.activecat_color : ''
+        }
+      }, langdetect == 'en' ? valueitem.valuename : valueitem.valuename_ar)));
+    })))))), /*#__PURE__*/React__default["default"].createElement("hr", {
+      className: "mt-3 mb-3"
+    }));
+  })))))))));
 };
 
 function ownKeys$1B(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -8985,31 +9230,35 @@ var CardsSection = function CardsSection(props) {
   var fetchingtype = props.actions.fetchingtype;
   props.actions.addtofavoritescontext;
   var fetchAuthorizationQueryContext = props.actions.fetchAuthorizationQueryContext;
-  var actions = props.actions;
-  var _useState = React.useState(''),
+  var _useState = React.useState(false),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
-    sectionproperties = _useState2[0],
-    setsectionproperties = _useState2[1];
-  var _useState3 = React.useState([]),
+    openFilterSlider = _useState2[0],
+    setopenFilterSlider = _useState2[1];
+  var actions = props.actions;
+  var _useState3 = React.useState(''),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    cardsarray = _useState4[0],
-    setcardsarray = _useState4[1];
-  var _useState5 = React.useState(''),
+    sectionproperties = _useState4[0],
+    setsectionproperties = _useState4[1];
+  var _useState5 = React.useState([]),
     _useState6 = _slicedToArray__default["default"](_useState5, 2),
-    sectionitem = _useState6[0],
-    setsectionitem = _useState6[1];
-  var _useState7 = React.useState({
+    cardsarray = _useState6[0],
+    setcardsarray = _useState6[1];
+  var _useState7 = React.useState(''),
+    _useState8 = _slicedToArray__default["default"](_useState7, 2),
+    sectionitem = _useState8[0],
+    setsectionitem = _useState8[1];
+  var _useState9 = React.useState({
       productfetchingtype: 'Random',
       collectionid: '',
       grouptype: ''
     }),
-    _useState8 = _slicedToArray__default["default"](_useState7, 2),
-    ProductsFetchingTypeSectionObj = _useState8[0],
-    setProductsFetchingTypeSectionObj = _useState8[1];
-  var _useState9 = React.useState([]),
     _useState10 = _slicedToArray__default["default"](_useState9, 2),
-    maincontainerarrayofobjs = _useState10[0],
-    setmaincontainerarrayofobjs = _useState10[1];
+    ProductsFetchingTypeSectionObj = _useState10[0],
+    setProductsFetchingTypeSectionObj = _useState10[1];
+  var _useState11 = React.useState([]),
+    _useState12 = _slicedToArray__default["default"](_useState11, 2),
+    maincontainerarrayofobjs = _useState12[0],
+    setmaincontainerarrayofobjs = _useState12[1];
   React__default["default"].useEffect(function () {
     if (inView) {
       fetchProductsQuery.fetchNextPage();
@@ -9498,8 +9747,9 @@ var CardsSection = function CardsSection(props) {
     }, langdetect == 'en' ? /*#__PURE__*/React__default["default"].createElement(FaArrowAltCircleRight.FaArrowAltCircleRight, null) : /*#__PURE__*/React__default["default"].createElement(FaArrowAltCircleLeft.FaArrowAltCircleLeft, null)))), sectionproperties.showFilter == 'show' && /*#__PURE__*/React__default["default"].createElement("button", {
       "class": ' col-lg-12 col-md-12 pl-0 pr-0 d-none d-md-flex justify-content-end ',
       onClick: function onClick() {
-        var element = document.getElementById('filterslider');
-        element.classList.add(filterstyles.filterslider_container_opened);
+        setopenFilterSlider(true);
+        // var element = document.getElementById('filterslider');
+        // element.classList.add(filterstyles.filterslider_container_opened);
       }
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       "class": "".concat(section_cssstyles.filterbtn)
@@ -9633,14 +9883,16 @@ var CardsSection = function CardsSection(props) {
       paddingLeft: sectionproperties.showFilter == 'show' ? langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : sectionproperties.paddingRight + 'px' : 0,
       paddingRight: sectionproperties.showFilter == 'show' ? langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px' : 0
     }
-  }, sectionproperties.showFilter == 'show' &&
-  /*#__PURE__*/
-  // d-md-none
-  React__default["default"].createElement("div", {
-    className: sectionproperties.filterdirection == 'Horizontal' ? 'col-lg-12 d-flex ' : 'col-lg-3 d-flex'
+  }, sectionproperties.showFilter == 'show' && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: sectionproperties.filterdirection == 'Horizontal' ? 'col-lg-12 d-flex ' : 'col-lg-3 d-flex',
+    style: {
+      zIndex: 1000
+    }
   }, /*#__PURE__*/React__default["default"].createElement(Filter$1, {
     sectionpropertiesprops: sectionproperties,
-    actions: actions
+    actions: actions,
+    openFilterSlider: openFilterSlider,
+    setopenFilterSlider: setopenFilterSlider
   })), fetchingtype == 'custom' && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, cardsrender()), fetchingtype != 'custom' && cardsrender()));
 };
 
@@ -11932,16 +12184,18 @@ var CategoryFeaturingHeader = function CategoryFeaturingHeader(props) {
     })
   };
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    "class": "row w-100 ml-0 mr-0 d-flex justify-content-center",
+    "class": "row w-100 ml-0 mr-0 d-flex justify-content-center ",
     style: {
       marginTop: sectionproperties.header_marginTop + 'px',
-      marginBottom: sectionproperties.header_marginBottom + 'px',
-      position: sectionproperties.headerstyles_position == 'absolute' ? 'absolute' : 'relative',
+      marginBottom: sectionproperties.header_marginBottom + 'px'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    "class": "".concat(header_cssstyles.header_outercontainer) + ' d-flex d-md-none row ml-0 mr-0 ',
+    style: {
       zIndex: 1000,
+      position: sectionproperties.headerstyles_position == 'absolute' ? 'absolute' : 'relative',
       top: 0
     }
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    "class": "".concat(header_cssstyles.header_outercontainer) + ' d-flex d-md-none row ml-0 mr-0 '
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     "class": "col-lg-12 d-flex align-items-center plr-1025-0",
     style: {
@@ -26478,10 +26732,7 @@ var Footer5 = function Footer5(props) {
       opacity: 0.6
     }
   })), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "col-lg-12 p-0",
-    style: {
-      zIndex: 10
-    }
+    className: "col-lg-12 p-0"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "row m-0 w-100"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -27251,10 +27502,7 @@ var Footer7 = function Footer7(props) {
       left: 0
     }
   })), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "row m-0 w-100 pb-lg-5 pt-lg-5 pt-md-4 pb-md-4 pl-md-3 pr-md-3 pt-sm-0 pb-sm-0",
-    style: {
-      zIndex: 10
-    }
+    className: "row m-0 w-100 pb-lg-5 pt-lg-5 pt-md-4 pb-md-4 pl-md-3 pr-md-3 pt-sm-0 pb-sm-0"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-xl-5 col-lg-6 col-md-12 col-sm-12 p-0 pl-lg-3 pr-lg-3 p-md-0"
   }, sectionproperties.showopeninghours == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
@@ -34078,7 +34326,7 @@ var Twobgimages = function Twobgimages(props) {
       display: 'flex',
       width: '100%',
       height: '100%',
-      zIndex: 1000
+      zIndex: 100
     }),
     bgimage: glamor.css({
       ':before': {
@@ -35090,8 +35338,8 @@ var Freetextsection = function Freetextsection(props) {
       paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : sectionproperties.paddingRight + 'px',
       paddingRight: langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px',
       paddingTop: sectionproperties.paddingTop + 'px',
-      paddingBottom: sectionproperties.paddingBottom + 'px',
-      zIndex: 100
+      paddingBottom: sectionproperties.paddingBottom + 'px'
+      // zIndex: 100,
     }
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     "class": "row m-0 w-100 mb-auto"