tabexseriescomponents 0.0.680 → 0.0.681

package/dist/index.cjs.js

@@ -15238,7 +15238,8 @@ var Select$1 = /*#__PURE__*/React__default["default"].lazy(function () {
   return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-select')); });
 });
 var Filter$1 = function Filter(props) {
-  var _css;
+  var _FetchVendorsQuery$da, _css;
+  var FetchVendorsQuery = props.actions.FetchVendorsQuery;
   var lang = props.actions.lang;
   var langdetect = props.actions.langdetect;
   props.actions.productfiltercontext;
@@ -15270,6 +15271,10 @@ var Filter$1 = function Filter(props) {
     _useState6 = _slicedToArray__default["default"](_useState5, 2),
     productfeatuesarr = _useState6[0],
     setproductfeatuesarr = _useState6[1];
+  var _useState7 = React.useState([FetchVendorsQuery === null || FetchVendorsQuery === void 0 || (_FetchVendorsQuery$da = FetchVendorsQuery.data) === null || _FetchVendorsQuery$da === void 0 || (_FetchVendorsQuery$da = _FetchVendorsQuery$da.data) === null || _FetchVendorsQuery$da === void 0 ? void 0 : _FetchVendorsQuery$da.vendors]),
+    _useState8 = _slicedToArray__default["default"](_useState7, 2),
+    vendorarr = _useState8[0],
+    setvendorsarr = _useState8[1];
   var fetchTabexCountriesQueryContext = props.actions.fetchTabexCountriesQueryContext;
   var FetchQueriesEngineContext = props.actions.FetchQueriesEngineContext;
   var setFetchQueriesEngineContext = props.actions.setFetchQueriesEngineContext;
@@ -15278,49 +15283,50 @@ var Filter$1 = function Filter(props) {
   var FetchTabexStatesPayloadobjContext = props.actions.FetchTabexStatesPayloadobjContext;
   var setFetchTabexStatesPayloadobjContext = props.actions.setFetchTabexStatesPayloadobjContext;
   var fetchProductFeaturesQueryContext = props.actions.fetchProductFeaturesQueryContext;
-  var _useState7 = React.useState(''),
-    _useState8 = _slicedToArray__default["default"](_useState7, 2),
-    sectionproperties = _useState8[0],
-    setsectionproperties = _useState8[1];
-  // const [instfilters, setinstfilters] = useState([...authdetailsContext.instinfo.instfilters]);
-  var _useState9 = React.useState([]),
+  var _useState9 = React.useState(''),
     _useState10 = _slicedToArray__default["default"](_useState9, 2),
-    instfilters = _useState10[0],
-    setinstfilters = _useState10[1];
+    sectionproperties = _useState10[0],
+    setsectionproperties = _useState10[1];
+  // const [instfilters, setinstfilters] = useState([...authdetailsContext.instinfo.instfilters]);
   var _useState11 = React.useState([]),
     _useState12 = _slicedToArray__default["default"](_useState11, 2),
-    collectionstobevisible = _useState12[0],
-    setcollectionstobevisible = _useState12[1];
+    instfilters = _useState12[0],
+    setinstfilters = _useState12[1];
   var _useState13 = React.useState([]),
     _useState14 = _slicedToArray__default["default"](_useState13, 2),
-    instcollections = _useState14[0],
-    setinstcollections = _useState14[1];
+    collectionstobevisible = _useState14[0],
+    setcollectionstobevisible = _useState14[1];
   var _useState15 = React.useState([]),
     _useState16 = _slicedToArray__default["default"](_useState15, 2),
-    instcategories = _useState16[0],
-    setinstcategories = _useState16[1];
+    instcollections = _useState16[0],
+    setinstcollections = _useState16[1];
+  var _useState17 = React.useState([]),
+    _useState18 = _slicedToArray__default["default"](_useState17, 2),
+    instcategories = _useState18[0],
+    setinstcategories = _useState18[1];
   // const [sortby, setSortby] = useState('Sort by');
-  var _useState17 = React.useState({
+  var _useState19 = React.useState({
       min: 0,
       max: 5
     }),
-    _useState18 = _slicedToArray__default["default"](_useState17, 2),
-    raterangevalue = _useState18[0],
-    setraterangevalue = _useState18[1];
+    _useState20 = _slicedToArray__default["default"](_useState19, 2),
+    raterangevalue = _useState20[0],
+    setraterangevalue = _useState20[1];
   var timeoutRef = React__default["default"].useRef(null);
-  var _useState19 = React.useState(''),
-    _useState20 = _slicedToArray__default["default"](_useState19, 2);
-    _useState20[0];
-    var setsortbycontext = _useState20[1];
   var _useState21 = React.useState(''),
-    _useState22 = _slicedToArray__default["default"](_useState21, 2),
-    pricefrom = _useState22[0];
-    _useState22[1];
+    _useState22 = _slicedToArray__default["default"](_useState21, 2);
+    _useState22[0];
+    var setsortbycontext = _useState22[1];
   var _useState23 = React.useState(''),
     _useState24 = _slicedToArray__default["default"](_useState23, 2),
-    priceto = _useState24[0];
+    pricefrom = _useState24[0];
     _useState24[1];
-  var _useState25 = React.useState([{
+  var _useState25 = React.useState(''),
+    _useState26 = _slicedToArray__default["default"](_useState25, 2),
+    priceto = _useState26[0];
+    _useState26[1];
+  props.actions.setfetchingtype;
+  var _useState27 = React.useState([{
       payloadvalue: 'sortprice',
       name: lang.price,
       filterarray: [{
@@ -15345,12 +15351,19 @@ var Filter$1 = function Filter(props) {
         isfilterselected: false
       }]
     }]),
-    _useState26 = _slicedToArray__default["default"](_useState25, 2),
-    otherfilters = _useState26[0];
-    _useState26[1];
+    _useState28 = _slicedToArray__default["default"](_useState27, 2),
+    otherfilters = _useState28[0];
+    _useState28[1];
   React.useEffect(function () {
     filterupdater();
   }, []);
+  React.useEffect(function () {
+    var temp = _toConsumableArray__default["default"](vendorarr);
+    temp === null || temp === void 0 || temp.forEach(function (instfilteritem, instfilterindex) {
+      instfilteritem.isfilterselected = false;
+    });
+    setvendorsarr(_toConsumableArray__default["default"](temp));
+  }, [FetchVendorsQuery.isSuccess]);
   React.useEffect(function () {
     if (fetchproductoptionsQueryContext.isSuccess) {
       var _fetchproductoptionsQ;
@@ -16539,10 +16552,10 @@ var Filter$1 = function Filter(props) {
       isSearchable: true
     })))));
   };
-  var _useState27 = React.useState(false),
-    _useState28 = _slicedToArray__default["default"](_useState27, 2),
-    checked = _useState28[0],
-    setChecked = _useState28[1];
+  var _useState29 = React.useState(false),
+    _useState30 = _slicedToArray__default["default"](_useState29, 2),
+    checked = _useState30[0],
+    setChecked = _useState30[1];
   // const queryParameters = new URLSearchParams(window.location.search);
   // useEffect(() => {
   //     // setsortbycontext('Sort By');
@@ -16899,7 +16912,41 @@ var Filter$1 = function Filter(props) {
     "class": "row m-0 w-100"
   }, CollectionsFilter()), sectionproperties.showdynamicfilter == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
     "class": "row m-0 w-100"
-  }, DynamicFilter()), sectionproperties.showvariantsfilter == 'Show' && InstFilters()))), /*#__PURE__*/React__default["default"].createElement("div", {
+  }, DynamicFilter()), sectionproperties.showvariantsfilter == 'Show' && InstFilters(), sectionproperties.showvendorfilter == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+    "class": "row m-0 w-100"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-lg-12 p-0"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "row m-0 w-100"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    "class": "col-lg-12 p-0 text-start mb-2"
+  }, /*#__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' ? 'Brands' : 'الماركات')), vendorarr.map(function (item, index) {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "".concat(filterstyles.border_left_line, " ").concat(filterstyles.timelineinnercont, " ").concat(filter_cssstyles.timelineinnercont, " ") + ' d-flex align-items-center pb-3 ',
+      onClick: function onClick() {
+        // setCollectionFilterFunc(item.collectionid);
+      }
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      "class": "mr-2"
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "  ".concat(filterstyles.btn_item, " ").concat(filter_cssstyles.btn_item) + ' 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 : '',
+      }
+    }, item.vendorname)))
+    // <div class="col-lg-12 p-0">
+    //     <p>{item.vendorname}</p>
+    // </div>
+    ;
+  }))))))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-lg-12"
   }, /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas, {
     show: props === null || props === void 0 ? void 0 : props.openFilterSlider,
@@ -69236,6 +69283,12 @@ var Card23 = function Card23(props) {
       marginBottom: sectionproperties.image_mb + 'px'
     }
   }, Image('normal')), /*#__PURE__*/React__default["default"].createElement("div", {
+    "class": cardsstyles2.imageContainer + ' d-none d-md-flex ',
+    style: {
+      height: sectionproperties.height_responsive + 'px',
+      marginBottom: sectionproperties.image_mb + 'px'
+    }
+  }, Image('responsive')), /*#__PURE__*/React__default["default"].createElement("div", {
     "class": sectionproperties.innersectionpaddinghorizontal == 0 ? 'row m-0 w-100' : 'row m-0 w-100 pl-sm-2 pr-sm-2',
     style: {
       paddingLeft: sectionproperties.innersectionpaddinghorizontal + 'px',

package/dist/index.esm.js

@@ -15189,7 +15189,8 @@ var Select$1 = /*#__PURE__*/React.lazy(function () {
   return import('react-select');
 });
 var Filter$1 = function Filter(props) {
-  var _css;
+  var _FetchVendorsQuery$da, _css;
+  var FetchVendorsQuery = props.actions.FetchVendorsQuery;
   var lang = props.actions.lang;
   var langdetect = props.actions.langdetect;
   props.actions.productfiltercontext;
@@ -15221,6 +15222,10 @@ var Filter$1 = function Filter(props) {
     _useState6 = _slicedToArray(_useState5, 2),
     productfeatuesarr = _useState6[0],
     setproductfeatuesarr = _useState6[1];
+  var _useState7 = useState([FetchVendorsQuery === null || FetchVendorsQuery === void 0 || (_FetchVendorsQuery$da = FetchVendorsQuery.data) === null || _FetchVendorsQuery$da === void 0 || (_FetchVendorsQuery$da = _FetchVendorsQuery$da.data) === null || _FetchVendorsQuery$da === void 0 ? void 0 : _FetchVendorsQuery$da.vendors]),
+    _useState8 = _slicedToArray(_useState7, 2),
+    vendorarr = _useState8[0],
+    setvendorsarr = _useState8[1];
   var fetchTabexCountriesQueryContext = props.actions.fetchTabexCountriesQueryContext;
   var FetchQueriesEngineContext = props.actions.FetchQueriesEngineContext;
   var setFetchQueriesEngineContext = props.actions.setFetchQueriesEngineContext;
@@ -15229,49 +15234,50 @@ var Filter$1 = function Filter(props) {
   var FetchTabexStatesPayloadobjContext = props.actions.FetchTabexStatesPayloadobjContext;
   var setFetchTabexStatesPayloadobjContext = props.actions.setFetchTabexStatesPayloadobjContext;
   var fetchProductFeaturesQueryContext = props.actions.fetchProductFeaturesQueryContext;
-  var _useState7 = useState(''),
-    _useState8 = _slicedToArray(_useState7, 2),
-    sectionproperties = _useState8[0],
-    setsectionproperties = _useState8[1];
-  // const [instfilters, setinstfilters] = useState([...authdetailsContext.instinfo.instfilters]);
-  var _useState9 = useState([]),
+  var _useState9 = useState(''),
     _useState10 = _slicedToArray(_useState9, 2),
-    instfilters = _useState10[0],
-    setinstfilters = _useState10[1];
+    sectionproperties = _useState10[0],
+    setsectionproperties = _useState10[1];
+  // const [instfilters, setinstfilters] = useState([...authdetailsContext.instinfo.instfilters]);
   var _useState11 = useState([]),
     _useState12 = _slicedToArray(_useState11, 2),
-    collectionstobevisible = _useState12[0],
-    setcollectionstobevisible = _useState12[1];
+    instfilters = _useState12[0],
+    setinstfilters = _useState12[1];
   var _useState13 = useState([]),
     _useState14 = _slicedToArray(_useState13, 2),
-    instcollections = _useState14[0],
-    setinstcollections = _useState14[1];
+    collectionstobevisible = _useState14[0],
+    setcollectionstobevisible = _useState14[1];
   var _useState15 = useState([]),
     _useState16 = _slicedToArray(_useState15, 2),
-    instcategories = _useState16[0],
-    setinstcategories = _useState16[1];
+    instcollections = _useState16[0],
+    setinstcollections = _useState16[1];
+  var _useState17 = useState([]),
+    _useState18 = _slicedToArray(_useState17, 2),
+    instcategories = _useState18[0],
+    setinstcategories = _useState18[1];
   // const [sortby, setSortby] = useState('Sort by');
-  var _useState17 = useState({
+  var _useState19 = useState({
       min: 0,
       max: 5
     }),
-    _useState18 = _slicedToArray(_useState17, 2),
-    raterangevalue = _useState18[0],
-    setraterangevalue = _useState18[1];
+    _useState20 = _slicedToArray(_useState19, 2),
+    raterangevalue = _useState20[0],
+    setraterangevalue = _useState20[1];
   var timeoutRef = React.useRef(null);
-  var _useState19 = useState(''),
-    _useState20 = _slicedToArray(_useState19, 2);
-    _useState20[0];
-    var setsortbycontext = _useState20[1];
   var _useState21 = useState(''),
-    _useState22 = _slicedToArray(_useState21, 2),
-    pricefrom = _useState22[0];
-    _useState22[1];
+    _useState22 = _slicedToArray(_useState21, 2);
+    _useState22[0];
+    var setsortbycontext = _useState22[1];
   var _useState23 = useState(''),
     _useState24 = _slicedToArray(_useState23, 2),
-    priceto = _useState24[0];
+    pricefrom = _useState24[0];
     _useState24[1];
-  var _useState25 = useState([{
+  var _useState25 = useState(''),
+    _useState26 = _slicedToArray(_useState25, 2),
+    priceto = _useState26[0];
+    _useState26[1];
+  props.actions.setfetchingtype;
+  var _useState27 = useState([{
       payloadvalue: 'sortprice',
       name: lang.price,
       filterarray: [{
@@ -15296,12 +15302,19 @@ var Filter$1 = function Filter(props) {
         isfilterselected: false
       }]
     }]),
-    _useState26 = _slicedToArray(_useState25, 2),
-    otherfilters = _useState26[0];
-    _useState26[1];
+    _useState28 = _slicedToArray(_useState27, 2),
+    otherfilters = _useState28[0];
+    _useState28[1];
   useEffect(function () {
     filterupdater();
   }, []);
+  useEffect(function () {
+    var temp = _toConsumableArray(vendorarr);
+    temp === null || temp === void 0 || temp.forEach(function (instfilteritem, instfilterindex) {
+      instfilteritem.isfilterselected = false;
+    });
+    setvendorsarr(_toConsumableArray(temp));
+  }, [FetchVendorsQuery.isSuccess]);
   useEffect(function () {
     if (fetchproductoptionsQueryContext.isSuccess) {
       var _fetchproductoptionsQ;
@@ -16490,10 +16503,10 @@ var Filter$1 = function Filter(props) {
       isSearchable: true
     })))));
   };
-  var _useState27 = useState(false),
-    _useState28 = _slicedToArray(_useState27, 2),
-    checked = _useState28[0],
-    setChecked = _useState28[1];
+  var _useState29 = useState(false),
+    _useState30 = _slicedToArray(_useState29, 2),
+    checked = _useState30[0],
+    setChecked = _useState30[1];
   // const queryParameters = new URLSearchParams(window.location.search);
   // useEffect(() => {
   //     // setsortbycontext('Sort By');
@@ -16850,7 +16863,41 @@ var Filter$1 = function Filter(props) {
     "class": "row m-0 w-100"
   }, CollectionsFilter()), sectionproperties.showdynamicfilter == 'Show' && /*#__PURE__*/React.createElement("div", {
     "class": "row m-0 w-100"
-  }, DynamicFilter()), sectionproperties.showvariantsfilter == 'Show' && InstFilters()))), /*#__PURE__*/React.createElement("div", {
+  }, DynamicFilter()), sectionproperties.showvariantsfilter == 'Show' && InstFilters(), sectionproperties.showvendorfilter == 'Show' && /*#__PURE__*/React.createElement("div", {
+    "class": "row m-0 w-100"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "col-lg-12 p-0"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "row m-0 w-100"
+  }, /*#__PURE__*/React.createElement("div", {
+    "class": "col-lg-12 p-0 text-start mb-2"
+  }, /*#__PURE__*/React.createElement("p", {
+    className: langdetect == 'en' ? filter_cssstyles.collapsetitle + ' m-0 p-0 ' : filter_cssstyles.collapsetitle + ' m-0 p-0 text-right'
+  }, langdetect == 'en' ? 'Brands' : 'الماركات')), vendorarr.map(function (item, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(filterstyles.border_left_line, " ").concat(filterstyles.timelineinnercont, " ").concat(filter_cssstyles.timelineinnercont, " ") + ' d-flex align-items-center pb-3 ',
+      onClick: function onClick() {
+        // setCollectionFilterFunc(item.collectionid);
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      "class": "mr-2"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "  ".concat(filterstyles.btn_item, " ").concat(filter_cssstyles.btn_item) + ' d-flex align-items-center '
+    }, /*#__PURE__*/React.createElement("i", {
+      className: "h-100 d-flex align-items-center"
+    }))), /*#__PURE__*/React.createElement("div", {
+      className: langdetect == 'en' ? 'ml-3' : 'mr-3 text-right'
+    }, /*#__PURE__*/React.createElement("p", {
+      className: "".concat(filterstyles.timeline_text, " ").concat(filter_cssstyles.timeline_text) + ' m-0 p-0 ',
+      style: {
+        // color: item.isfilterselected ? sectionproperties.activecat_color : '',
+      }
+    }, item.vendorname)))
+    // <div class="col-lg-12 p-0">
+    //     <p>{item.vendorname}</p>
+    // </div>
+    ;
+  }))))))), /*#__PURE__*/React.createElement("div", {
     className: "col-lg-12"
   }, /*#__PURE__*/React.createElement(Offcanvas, {
     show: props === null || props === void 0 ? void 0 : props.openFilterSlider,
@@ -69187,6 +69234,12 @@ var Card23 = function Card23(props) {
       marginBottom: sectionproperties.image_mb + 'px'
     }
   }, Image('normal')), /*#__PURE__*/React.createElement("div", {
+    "class": cardsstyles2.imageContainer + ' d-none d-md-flex ',
+    style: {
+      height: sectionproperties.height_responsive + 'px',
+      marginBottom: sectionproperties.image_mb + 'px'
+    }
+  }, Image('responsive')), /*#__PURE__*/React.createElement("div", {
     "class": sectionproperties.innersectionpaddinghorizontal == 0 ? 'row m-0 w-100' : 'row m-0 w-100 pl-sm-2 pr-sm-2',
     style: {
       paddingLeft: sectionproperties.innersectionpaddinghorizontal + 'px',

package/dist/index.umd.js

@@ -15062,7 +15062,8 @@
       return import('react-select');
     });
     var Filter$1 = function Filter(props) {
-      var _css;
+      var _FetchVendorsQuery$da, _css;
+      var FetchVendorsQuery = props.actions.FetchVendorsQuery;
       var lang = props.actions.lang;
       var langdetect = props.actions.langdetect;
       props.actions.productfiltercontext;
@@ -15094,6 +15095,10 @@
         _useState6 = _slicedToArray__default["default"](_useState5, 2),
         productfeatuesarr = _useState6[0],
         setproductfeatuesarr = _useState6[1];
+      var _useState7 = React.useState([FetchVendorsQuery === null || FetchVendorsQuery === void 0 || (_FetchVendorsQuery$da = FetchVendorsQuery.data) === null || _FetchVendorsQuery$da === void 0 || (_FetchVendorsQuery$da = _FetchVendorsQuery$da.data) === null || _FetchVendorsQuery$da === void 0 ? void 0 : _FetchVendorsQuery$da.vendors]),
+        _useState8 = _slicedToArray__default["default"](_useState7, 2),
+        vendorarr = _useState8[0],
+        setvendorsarr = _useState8[1];
       var fetchTabexCountriesQueryContext = props.actions.fetchTabexCountriesQueryContext;
       var FetchQueriesEngineContext = props.actions.FetchQueriesEngineContext;
       var setFetchQueriesEngineContext = props.actions.setFetchQueriesEngineContext;
@@ -15102,49 +15107,50 @@
       var FetchTabexStatesPayloadobjContext = props.actions.FetchTabexStatesPayloadobjContext;
       var setFetchTabexStatesPayloadobjContext = props.actions.setFetchTabexStatesPayloadobjContext;
       var fetchProductFeaturesQueryContext = props.actions.fetchProductFeaturesQueryContext;
-      var _useState7 = React.useState(''),
-        _useState8 = _slicedToArray__default["default"](_useState7, 2),
-        sectionproperties = _useState8[0],
-        setsectionproperties = _useState8[1];
-      // const [instfilters, setinstfilters] = useState([...authdetailsContext.instinfo.instfilters]);
-      var _useState9 = React.useState([]),
+      var _useState9 = React.useState(''),
         _useState10 = _slicedToArray__default["default"](_useState9, 2),
-        instfilters = _useState10[0],
-        setinstfilters = _useState10[1];
+        sectionproperties = _useState10[0],
+        setsectionproperties = _useState10[1];
+      // const [instfilters, setinstfilters] = useState([...authdetailsContext.instinfo.instfilters]);
       var _useState11 = React.useState([]),
         _useState12 = _slicedToArray__default["default"](_useState11, 2),
-        collectionstobevisible = _useState12[0],
-        setcollectionstobevisible = _useState12[1];
+        instfilters = _useState12[0],
+        setinstfilters = _useState12[1];
       var _useState13 = React.useState([]),
         _useState14 = _slicedToArray__default["default"](_useState13, 2),
-        instcollections = _useState14[0],
-        setinstcollections = _useState14[1];
+        collectionstobevisible = _useState14[0],
+        setcollectionstobevisible = _useState14[1];
       var _useState15 = React.useState([]),
         _useState16 = _slicedToArray__default["default"](_useState15, 2),
-        instcategories = _useState16[0],
-        setinstcategories = _useState16[1];
+        instcollections = _useState16[0],
+        setinstcollections = _useState16[1];
+      var _useState17 = React.useState([]),
+        _useState18 = _slicedToArray__default["default"](_useState17, 2),
+        instcategories = _useState18[0],
+        setinstcategories = _useState18[1];
       // const [sortby, setSortby] = useState('Sort by');
-      var _useState17 = React.useState({
+      var _useState19 = React.useState({
           min: 0,
           max: 5
         }),
-        _useState18 = _slicedToArray__default["default"](_useState17, 2),
-        raterangevalue = _useState18[0],
-        setraterangevalue = _useState18[1];
+        _useState20 = _slicedToArray__default["default"](_useState19, 2),
+        raterangevalue = _useState20[0],
+        setraterangevalue = _useState20[1];
       var timeoutRef = React__default["default"].useRef(null);
-      var _useState19 = React.useState(''),
-        _useState20 = _slicedToArray__default["default"](_useState19, 2);
-        _useState20[0];
-        var setsortbycontext = _useState20[1];
       var _useState21 = React.useState(''),
-        _useState22 = _slicedToArray__default["default"](_useState21, 2),
-        pricefrom = _useState22[0];
-        _useState22[1];
+        _useState22 = _slicedToArray__default["default"](_useState21, 2);
+        _useState22[0];
+        var setsortbycontext = _useState22[1];
       var _useState23 = React.useState(''),
         _useState24 = _slicedToArray__default["default"](_useState23, 2),
-        priceto = _useState24[0];
+        pricefrom = _useState24[0];
         _useState24[1];
-      var _useState25 = React.useState([{
+      var _useState25 = React.useState(''),
+        _useState26 = _slicedToArray__default["default"](_useState25, 2),
+        priceto = _useState26[0];
+        _useState26[1];
+      props.actions.setfetchingtype;
+      var _useState27 = React.useState([{
           payloadvalue: 'sortprice',
           name: lang.price,
           filterarray: [{
@@ -15169,12 +15175,19 @@
             isfilterselected: false
           }]
         }]),
-        _useState26 = _slicedToArray__default["default"](_useState25, 2),
-        otherfilters = _useState26[0];
-        _useState26[1];
+        _useState28 = _slicedToArray__default["default"](_useState27, 2),
+        otherfilters = _useState28[0];
+        _useState28[1];
       React.useEffect(function () {
         filterupdater();
       }, []);
+      React.useEffect(function () {
+        var temp = _toConsumableArray__default["default"](vendorarr);
+        temp === null || temp === void 0 || temp.forEach(function (instfilteritem, instfilterindex) {
+          instfilteritem.isfilterselected = false;
+        });
+        setvendorsarr(_toConsumableArray__default["default"](temp));
+      }, [FetchVendorsQuery.isSuccess]);
       React.useEffect(function () {
         if (fetchproductoptionsQueryContext.isSuccess) {
           var _fetchproductoptionsQ;
@@ -16363,10 +16376,10 @@
           isSearchable: true
         })))));
       };
-      var _useState27 = React.useState(false),
-        _useState28 = _slicedToArray__default["default"](_useState27, 2),
-        checked = _useState28[0],
-        setChecked = _useState28[1];
+      var _useState29 = React.useState(false),
+        _useState30 = _slicedToArray__default["default"](_useState29, 2),
+        checked = _useState30[0],
+        setChecked = _useState30[1];
       // const queryParameters = new URLSearchParams(window.location.search);
       // useEffect(() => {
       //     // setsortbycontext('Sort By');
@@ -16723,7 +16736,41 @@
         "class": "row m-0 w-100"
       }, CollectionsFilter()), sectionproperties.showdynamicfilter == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "row m-0 w-100"
-      }, DynamicFilter()), sectionproperties.showvariantsfilter == 'Show' && InstFilters()))), /*#__PURE__*/React__default["default"].createElement("div", {
+      }, DynamicFilter()), sectionproperties.showvariantsfilter == 'Show' && InstFilters(), sectionproperties.showvendorfilter == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "row m-0 w-100"
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "col-lg-12 p-0"
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "row m-0 w-100"
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "col-lg-12 p-0 text-start mb-2"
+      }, /*#__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' ? 'Brands' : 'الماركات')), vendorarr.map(function (item, index) {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "".concat(filterstyles.border_left_line, " ").concat(filterstyles.timelineinnercont, " ").concat(filter_cssstyles.timelineinnercont, " ") + ' d-flex align-items-center pb-3 ',
+          onClick: function onClick() {
+            // setCollectionFilterFunc(item.collectionid);
+          }
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "mr-2"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "  ".concat(filterstyles.btn_item, " ").concat(filter_cssstyles.btn_item) + ' 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 : '',
+          }
+        }, item.vendorname)))
+        // <div class="col-lg-12 p-0">
+        //     <p>{item.vendorname}</p>
+        // </div>
+        ;
+      }))))))), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "col-lg-12"
       }, /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas, {
         show: props === null || props === void 0 ? void 0 : props.openFilterSlider,
@@ -69060,6 +69107,12 @@
           marginBottom: sectionproperties.image_mb + 'px'
         }
       }, Image('normal')), /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": cardsstyles2.imageContainer + ' d-none d-md-flex ',
+        style: {
+          height: sectionproperties.height_responsive + 'px',
+          marginBottom: sectionproperties.image_mb + 'px'
+        }
+      }, Image('responsive')), /*#__PURE__*/React__default["default"].createElement("div", {
         "class": sectionproperties.innersectionpaddinghorizontal == 0 ? 'row m-0 w-100' : 'row m-0 w-100 pl-sm-2 pr-sm-2',
         style: {
           paddingLeft: sectionproperties.innersectionpaddinghorizontal + 'px',

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "tabexseriescomponents",
-    "version": "0.0.680",
+    "version": "0.0.681",
     "description": "your description",
     "main": "dist/index.cjs.js",
     "scripts": {