tabexseriescomponents 0.0.418 → 0.0.420

package/dist/index.cjs.js

@@ -2517,7 +2517,7 @@ var Product_itemtype = function Product_itemtype(props) {
   }, /*#__PURE__*/React__default["default"].createElement(ImageGallery__default["default"], {
     items: productimagesarray,
     thumbnailPosition: sectionproperties.thumbnailposition == 'Bottom' ? 'bottom' : 'left',
-    showNav: false,
+    showNav: true,
     showPlayButton: false,
     showFullscreenButton: sectionproperties.showgalleryfullscreenbtn == 'Yes' ? true : false,
     startIndex: currentshowingimageindex
@@ -8649,7 +8649,7 @@ var Select$3 = /*#__PURE__*/React__default["default"].lazy(function () {
   return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-select')); });
 });
 var Checkout = function Checkout(props) {
-  var _css, _checkoutstyles, _ref, _fetchcustomercartQue55, _fetchcustomercartQue56, _fetchcustomercartQue57, _fetchcustomercartQue62, _fetchcustomercartQue63, _fetchcustomercartQue64, _fetchcustomercartQue65, _fetchcustomercartQue67, _fetchcustomercartQue69, _fetchcustomercartQue71, _fetchcustomercartQue73, _fetchcustomercartQue75;
+  var _css, _checkoutstyles, _ref, _fetchcustomercartQue55, _fetchcustomercartQue56, _fetchcustomercartQue57, _fetchcustomercartQue62, _fetchcustomercartQue63, _fetchcustomercartQue64, _fetchcustomercartQue65, _fetchcustomercartQue67, _fetchcustomercartQue69, _fetchcustomercartQue71, _fetchcustomercartQue73, _authdetailsContext$i4, _fetchcustomercartQue75, _authdetailsContext$i5, _fetchcustomercartQue77, _fetchcustomercartQue79;
   var _useState = React.useState(null),
     _useState2 = _slicedToArray__default["default"](_useState, 2);
     _useState2[0];
@@ -9878,7 +9878,49 @@ var Checkout = function Checkout(props) {
     d: "M5,10.75 L8.5,14.25 L19.4,2.3 C18.8333333,1.43333333 18.0333333,1 17,1 L4,1 C2.35,1 1,2.35 1,4 L1,17 C1,18.65 2.35,20 4,20 L17,20 C18.65,20 20,18.65 20,17 L20,7.99769186"
   })), /*#__PURE__*/React__default["default"].createElement("p", {
     className: "".concat(formstyles.checkbox_label) + ' ml-2 mb-0 wordbreak cursor-pointer mr-2 '
-  }, langdetect == 'en' ? 'Mobile Wallet' : 'المحفظة الإلكترونية')))))), (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue75 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue75 === void 0 || (_fetchcustomercartQue75 = _fetchcustomercartQue75.data) === null || _fetchcustomercartQue75 === void 0 ? void 0 : _fetchcustomercartQue75.customercart.paymentmethod) == 'onlinepayment1' && /*#__PURE__*/React__default["default"].createElement("div", {
+  }, langdetect == 'en' ? 'Mobile Wallet' : 'المحفظة الإلكترونية'))), (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i4 = authdetailsContext.instinfo) === null || _authdetailsContext$i4 === void 0 ? void 0 : _authdetailsContext$i4.acceptForsaCard) == 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-xl-4 col-lg-4 col-md-12 mb-3"
+  }, /*#__PURE__*/React__default["default"].createElement("label", {
+    className: langdetect == 'en' ? "".concat(formstyles.checkbox, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 ' : "".concat(formstyles.checkbox, " ").concat(formstyles.checkboxtranslated, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 '
+  }, /*#__PURE__*/React__default["default"].createElement("input", {
+    type: "checkbox",
+    className: checkoutstyles.checkboxinputstyles + ' mt-auto mb-auto ',
+    checked: (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue75 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue75 === void 0 || (_fetchcustomercartQue75 = _fetchcustomercartQue75.data) === null || _fetchcustomercartQue75 === void 0 || (_fetchcustomercartQue75 = _fetchcustomercartQue75.customercart) === null || _fetchcustomercartQue75 === void 0 ? void 0 : _fetchcustomercartQue75.paymentmethod) == 'forsa' ? true : false,
+    onChange: function onChange() {
+      var _fetchcustomercartQue76;
+      if ((fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue76 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue76 === void 0 || (_fetchcustomercartQue76 = _fetchcustomercartQue76.data) === null || _fetchcustomercartQue76 === void 0 || (_fetchcustomercartQue76 = _fetchcustomercartQue76.customercart) === null || _fetchcustomercartQue76 === void 0 ? void 0 : _fetchcustomercartQue76.paymentmethod) != 'forsa') {
+        cartinfoupdater('paymentmethod', 'forsa');
+      }
+    }
+  }), /*#__PURE__*/React__default["default"].createElement("svg", {
+    viewBox: "0 0 21 21",
+    className: checkoutstyles.svgstyles + ' h-100 '
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
+    d: "M5,10.75 L8.5,14.25 L19.4,2.3 C18.8333333,1.43333333 18.0333333,1 17,1 L4,1 C2.35,1 1,2.35 1,4 L1,17 C1,18.65 2.35,20 4,20 L17,20 C18.65,20 20,18.65 20,17 L20,7.99769186"
+  })), /*#__PURE__*/React__default["default"].createElement("p", {
+    className: "".concat(formstyles.checkbox_label) + ' ml-2 mb-0 wordbreak cursor-pointer mr-2 '
+  }, langdetect == 'en' ? 'Forsa' : ' Forsa'))), (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i5 = authdetailsContext.instinfo) === null || _authdetailsContext$i5 === void 0 ? void 0 : _authdetailsContext$i5.acceptBankInstallementsCard) == 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-xl-4 col-lg-4 col-md-12 mb-3"
+  }, /*#__PURE__*/React__default["default"].createElement("label", {
+    className: langdetect == 'en' ? "".concat(formstyles.checkbox, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 ' : "".concat(formstyles.checkbox, " ").concat(formstyles.checkboxtranslated, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 '
+  }, /*#__PURE__*/React__default["default"].createElement("input", {
+    type: "checkbox",
+    className: checkoutstyles.checkboxinputstyles + ' mt-auto mb-auto ',
+    checked: (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue77 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue77 === void 0 || (_fetchcustomercartQue77 = _fetchcustomercartQue77.data) === null || _fetchcustomercartQue77 === void 0 || (_fetchcustomercartQue77 = _fetchcustomercartQue77.customercart) === null || _fetchcustomercartQue77 === void 0 ? void 0 : _fetchcustomercartQue77.paymentmethod) == 'bankinstallments' ? true : false,
+    onChange: function onChange() {
+      var _fetchcustomercartQue78;
+      if ((fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue78 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue78 === void 0 || (_fetchcustomercartQue78 = _fetchcustomercartQue78.data) === null || _fetchcustomercartQue78 === void 0 || (_fetchcustomercartQue78 = _fetchcustomercartQue78.customercart) === null || _fetchcustomercartQue78 === void 0 ? void 0 : _fetchcustomercartQue78.paymentmethod) != 'bankinstallments') {
+        cartinfoupdater('paymentmethod', 'bankinstallments');
+      }
+    }
+  }), /*#__PURE__*/React__default["default"].createElement("svg", {
+    viewBox: "0 0 21 21",
+    className: checkoutstyles.svgstyles + ' h-100 '
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
+    d: "M5,10.75 L8.5,14.25 L19.4,2.3 C18.8333333,1.43333333 18.0333333,1 17,1 L4,1 C2.35,1 1,2.35 1,4 L1,17 C1,18.65 2.35,20 4,20 L17,20 C18.65,20 20,18.65 20,17 L20,7.99769186"
+  })), /*#__PURE__*/React__default["default"].createElement("p", {
+    className: "".concat(formstyles.checkbox_label) + ' ml-2 mb-0 wordbreak cursor-pointer mr-2 '
+  }, langdetect == 'en' ? 'Bank Installments' : ' التقسيط عن طريق البنك')))))), (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue79 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue79 === void 0 || (_fetchcustomercartQue79 = _fetchcustomercartQue79.data) === null || _fetchcustomercartQue79 === void 0 ? void 0 : _fetchcustomercartQue79.customercart.paymentmethod) == 'onlinepayment1' && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-lg-12 p-0 w-100 mb-3"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     style: {
@@ -13783,7 +13825,12 @@ var Filter$1 = function Filter(props) {
     });
     if (!CollectionExists) {
       if (tempfetchproductsfilerobjcontext.collections != undefined && Array.isArray(tempfetchproductsfilerobjcontext.collections)) {
-        tempfetchproductsfilerobjcontext.collections.push(collectionid);
+        if (sectionproperties.filterType != 'Title & Sort By Only' && sectionproperties.filterdirection == 'Horizontal') {
+          tempfetchproductsfilerobjcontext.collections = [];
+          tempfetchproductsfilerobjcontext.collections.push(collectionid);
+        } else {
+          tempfetchproductsfilerobjcontext.collections.push(collectionid);
+        }
       } else {
         tempfetchproductsfilerobjcontext.collections = [collectionid];
       }
@@ -14603,7 +14650,7 @@ var Filter$1 = function Filter(props) {
     wrapperClassName: '',
     itemClassName: 'filtercard',
     scrollContainerClassName: 'scrollmenuclasssubscrollbar'
-  }, instcollections.map(function (item, index) {
+  }, collectionstobevisible.map(function (item, index) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: filter_cssstyles.timeline_text + ' col-xl-12 p-0 col-lg-12 col-md-12 col-sm-12 w-100 cursor-pointer ',
       onClick: function onClick() {
@@ -15700,6 +15747,12 @@ var CardsSection = function CardsSection(props) {
     }));
   }
   var section_cssstyles = {
+    sectioncontainerr: glamor.css({
+      marginTop: sectionproperties.marginTop + 'px',
+      '@media (max-width: 800px)': {
+        marginTop: sectionproperties.marginTopResp != undefined && sectionproperties.marginTopResp != undefined ? sectionproperties.marginTopResp + 'px' : sectionproperties.marginTop + 'px'
+      }
+    }),
     innercardssection: glamor.css({
       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,
@@ -16425,7 +16478,7 @@ var CardsSection = function CardsSection(props) {
   };
   return /*#__PURE__*/React__default["default"].createElement("div", {
     ref: refscr,
-    "class": ' row ml-0 mr-0 d-flex justify-content-center ml-auto mr-auto w-md-100 w-sm-100 ',
+    "class": section_cssstyles.sectioncontainerr + ' row ml-0 mr-0 d-flex justify-content-center ml-auto mr-auto w-md-100 w-sm-100 ',
     style: {
       zIndex: 2,
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -16437,7 +16490,6 @@ var CardsSection = function CardsSection(props) {
       borderBottomRightRadius: langdetect == 'en' ? sectionproperties.borderBottomRightRadius + 'px' : sectionproperties.borderBottomLeftRadius + 'px',
       borderTopLeftRadius: langdetect == 'en' ? sectionproperties.borderTopLeftRadius + 'px' : sectionproperties.borderTopRightRadius + 'px',
       borderTopRightRadius: langdetect == 'en' ? sectionproperties.borderTopRightRadius + 'px' : sectionproperties.borderTopLeftRadius + 'px',
-      marginTop: sectionproperties.marginTop + 'px',
       marginBottom: sectionproperties.marginBottom + 'px',
       minHeight: sectionproperties.height == null || sectionproperties.height == 0 ? 'auto' : sectionproperties.height + 'vh'
     }
@@ -17640,6 +17692,7 @@ var Subheader = function Subheader(props) {
     _useState10[0];
     _useState10[1];
   var authdetailsContext = props.actions.authdetailsContext;
+  var ikimagecredcontext = props.actions.ikimagecredcontext;
   React.useEffect(function () {
     var tempFetchQueriesEngineContext = FetchQueriesEngineContext;
     tempFetchQueriesEngineContext.categories = true;
@@ -18094,12 +18147,32 @@ var Subheader = function Subheader(props) {
         onClick: function onClick() {
           routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.collectionid);
         }
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "row m-0 w-100"
+      }, sectionproperties.showsubheadercollimage == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "col-lg-12 allcentered p-0"
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        style: {
+          width: '90%',
+          height: '90%'
+        }
+      }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
+        urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
+        publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
+        path: '/tr:w-500,h-500/' + item.collectionlogo,
+        style: {
+          width: '100%',
+          height: '100%',
+          objectFit: 'contain'
+        }
+      }))), /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "col-lg-12 allcentered p-0"
       }, /*#__PURE__*/React__default["default"].createElement("p", {
         "class": "".concat(header_cssstyles.subheader_collectiontitle) + ' wordbreak m-0 p-0 ',
         style: {
           textAlign: langdetect == 'en' ? 'left' : 'right'
         }
-      }, langdetect == 'en' ? item.title_en : item.title_ar)), index != pcollarray[Choosenindex].collections != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
+      }, langdetect == 'en' ? item.title_en : item.title_ar)))), index != pcollarray[Choosenindex].collections != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "col-lg-12 p-0 d-none d-sm-block"
       }, /*#__PURE__*/React__default["default"].createElement("hr", {
         "class": "mt-3 mb-0"
@@ -18560,22 +18633,7 @@ var Headerresponsive = function Headerresponsive(props) {
     className: langdetect == 'en' ? 'mr-2' : 'ml-2'
   }), /*#__PURE__*/React__default["default"].createElement("span", {
     className: "text-transform-none"
-  }, lang.signup)))), sectionproperties.cartBtnShow == 'Show' && /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"].Divider, {
-    style: {
-      marginBottom: 0,
-      marginTop: 0
-    }
-  }), sectionproperties.cartBtnShow == 'Show' && /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"].Item, {
-    onClick: function onClick() {
-      routingcountext(StaticPagesLinksContext.viewcart);
-    }
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(header_cssstyles.dropdownitemcontainer) + ' m-0 p-0 d-flex align-items-center '
-  }, /*#__PURE__*/React__default["default"].createElement("p", {
-    className: ' d-flex align-items-center m-0 p-0 '
-  }, sectionproperties.carticonstyle == 'Shopping bag 1' && /*#__PURE__*/React__default["default"].createElement(FiShoppingBag.FiShoppingBag, null), sectionproperties.carticonstyle == 'Shopping bag 2' && /*#__PURE__*/React__default["default"].createElement(CgShoppingBag.CgShoppingBag, null), sectionproperties.carticonstyle == 'Shopping bag 3' && /*#__PURE__*/React__default["default"].createElement(BsBag.BsBag, null), sectionproperties.carticonstyle == 'Shopping bag 4' && /*#__PURE__*/React__default["default"].createElement(HiOutlineShoppingBag.HiOutlineShoppingBag, null), sectionproperties.carticonstyle == 'Shopping cart 1' && /*#__PURE__*/React__default["default"].createElement(FiShoppingCart.FiShoppingCart, null), sectionproperties.carticonstyle == 'Shopping cart 2' && /*#__PURE__*/React__default["default"].createElement(MdAddShoppingCart.MdAddShoppingCart, null), sectionproperties.carticonstyle == 'Calendar 1' && /*#__PURE__*/React__default["default"].createElement(FiCalendar.FiCalendar, null), /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "ml-2 mr-2"
-  }, lang.viewcart))))), authdetailsContext.loggedin && /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"].Menu, {
+  }, lang.signup))))), authdetailsContext.loggedin && /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"].Menu, {
     style: {
       minWidth: '200px'
     }
@@ -18752,7 +18810,7 @@ var Headerresponsive = function Headerresponsive(props) {
       display: sectionproperties.searchbar_show == 'Hide' && sectionproperties.favBtnShow == 'Hide' && sectionproperties.cartBtnShow == 'Hide' && (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i2 = authdetailsContext.instinfo) === null || _authdetailsContext$i2 === void 0 || (_authdetailsContext$i2 = _authdetailsContext$i2.instcurrencies) === null || _authdetailsContext$i2 === void 0 ? void 0 : _authdetailsContext$i2.length) == 1 ? 'none' : 'flex'
     }
   }, sectionproperties.searchbar_show == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: authdetailsContext != undefined && (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i3 = authdetailsContext.instinfo) === null || _authdetailsContext$i3 === void 0 || (_authdetailsContext$i3 = _authdetailsContext$i3.instcurrencies) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.length) > 1 ? 'col-md-8 p-0' : 'col-md-10 p-0',
+    className: authdetailsContext != undefined && (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i3 = authdetailsContext.instinfo) === null || _authdetailsContext$i3 === void 0 || (_authdetailsContext$i3 = _authdetailsContext$i3.instcurrencies) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.length) > 1 ? 'col-md-8 p-0' : sectionproperties.showlanuagecontainer == 'Show' ? 'col-md-10 p-0' : 'col-md-12 p-0',
     style: {
       borderRight: langdetect == 'en' ? '1px solid ' + sectionproperties.searchbarcont_bordercolorresponsive : 0,
       borderLeft: langdetect == 'en' ? 0 : '1px solid ' + sectionproperties.searchbarcont_bordercolorresponsive
@@ -18833,7 +18891,7 @@ var Headerresponsive = function Headerresponsive(props) {
     }, /*#__PURE__*/React__default["default"].createElement("hr", {
       "class": "m-0"
     }))));
-  })))), /*#__PURE__*/React__default["default"].createElement("div", {
+  })))), sectionproperties.showlanuagecontainer == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
     className: sectionproperties.searchbar_show == 'Show' ? langdetect == 'en' ? 'col-md-2 allcentered pl-1 pr-1 pt-1 resposiveheader_languagedropdown' : 'col-md-2 allcentered pl-1 pr-1 pt-1' : 'allcentered pl-1 pr-1 pt-2 pb-2 resposiveheader_languagedropdown',
     style: {
       flex: sectionproperties.searchbar_show == 'Show' ? '' : 1
@@ -26531,17 +26589,17 @@ var Simpleheader = function Simpleheader(props) {
       marginTop: sectionproperties.header_marginTop + 'px',
       marginBottom: sectionproperties.header_marginBottom + 'px'
     }
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    "class": " ".concat(header_cssstyles.headercontainer) + ' d-flex d-md-none align-items-center m-0 '
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    "class": "row m-0 w-100 "
   }, templateproperties_context.showtextslider == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
     "class": "col-lg-12 p-0"
   }, /*#__PURE__*/React__default["default"].createElement(MarqueeHeader, {
     sectionpropertiesprops: sectionproperties,
     templateproperties_contextprops: templateproperties_context,
     actions: actions
-  })), /*#__PURE__*/React__default["default"].createElement("div", {
-    "class": " ".concat(header_cssstyles.headercontainer) + ' d-flex d-md-none align-items-center m-0 '
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    "class": "row m-0 w-100 "
-  }, sectionproperties.showdownloadapp == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+  })), sectionproperties.showdownloadapp == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
     "class": "w-100 d-flex d-md-none"
   }, /*#__PURE__*/React__default["default"].createElement(DownloadApp, {
     sectionpropertiesprops: sectionproperties,
@@ -26566,7 +26624,7 @@ var Simpleheader = function Simpleheader(props) {
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     "class": " ".concat(headerstyles$9.navbar) + ' row m-0  w-100 d-flex flex-row align-items-center h-100 '
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    "class": "col-lg-4 p-0"
+    "class": sectionproperties.showhidesubheader == 'Show' && sectionproperties.subheaderposition == 'Besides Top Navigation' ? 'col-lg-2 p-0' : 'col-lg-4 p-0'
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     "class": "".concat(header_cssstyles.header_logo) + ' d-flex align-items-center justify-content-center ',
     style: {
@@ -26584,7 +26642,7 @@ var Simpleheader = function Simpleheader(props) {
       maxHeight: '100%'
     }
   }))), /*#__PURE__*/React__default["default"].createElement("div", {
-    "class": "".concat(headerstyles$9.nav__item) + ' col-lg-4 p-0 d-flex flex-row align-items-center ',
+    "class": sectionproperties.showhidesubheader == 'Show' && sectionproperties.subheaderposition == 'Besides Top Navigation' ? "".concat(headerstyles$9.nav__item) + ' col-lg-8 p-0 d-flex flex-row align-items-center ' : "".concat(headerstyles$9.nav__item) + ' col-lg-2 p-0 d-flex flex-row align-items-center ',
     style: {
       justifyContent: sectionproperties.header_centered == 'Centered' ? 'center' : 'start'
     }
@@ -26616,7 +26674,7 @@ var Simpleheader = function Simpleheader(props) {
       subheadercontentpositionprops: sectionproperties.header_centered == 'Centered' ? 'center' : 'start'
     }
   })), /*#__PURE__*/React__default["default"].createElement("div", {
-    "class": "col-lg-4 p-0 d-flex align-items-center justify-content-end"
+    "class": sectionproperties.showhidesubheader == 'Show' && sectionproperties.subheaderposition == 'Besides Top Navigation' ? 'col-lg-2 p-0 d-flex align-items-center justify-content-end' : 'col-lg-4 p-0 d-flex align-items-center justify-content-end'
   }, sectionproperties.searchbar_show == 'Show' && /*#__PURE__*/React__default["default"].createElement("i", {
     className: header_cssstyles.searchicon + ' h-100 allcentered ',
     onClick: function onClick() {

package/dist/index.esm.js

@@ -2468,7 +2468,7 @@ var Product_itemtype = function Product_itemtype(props) {
   }, /*#__PURE__*/React.createElement(ImageGallery, {
     items: productimagesarray,
     thumbnailPosition: sectionproperties.thumbnailposition == 'Bottom' ? 'bottom' : 'left',
-    showNav: false,
+    showNav: true,
     showPlayButton: false,
     showFullscreenButton: sectionproperties.showgalleryfullscreenbtn == 'Yes' ? true : false,
     startIndex: currentshowingimageindex
@@ -8600,7 +8600,7 @@ var Select$3 = /*#__PURE__*/React.lazy(function () {
   return import('react-select');
 });
 var Checkout = function Checkout(props) {
-  var _css, _checkoutstyles, _ref, _fetchcustomercartQue55, _fetchcustomercartQue56, _fetchcustomercartQue57, _fetchcustomercartQue62, _fetchcustomercartQue63, _fetchcustomercartQue64, _fetchcustomercartQue65, _fetchcustomercartQue67, _fetchcustomercartQue69, _fetchcustomercartQue71, _fetchcustomercartQue73, _fetchcustomercartQue75;
+  var _css, _checkoutstyles, _ref, _fetchcustomercartQue55, _fetchcustomercartQue56, _fetchcustomercartQue57, _fetchcustomercartQue62, _fetchcustomercartQue63, _fetchcustomercartQue64, _fetchcustomercartQue65, _fetchcustomercartQue67, _fetchcustomercartQue69, _fetchcustomercartQue71, _fetchcustomercartQue73, _authdetailsContext$i4, _fetchcustomercartQue75, _authdetailsContext$i5, _fetchcustomercartQue77, _fetchcustomercartQue79;
   var _useState = useState(null),
     _useState2 = _slicedToArray(_useState, 2);
     _useState2[0];
@@ -9829,7 +9829,49 @@ var Checkout = function Checkout(props) {
     d: "M5,10.75 L8.5,14.25 L19.4,2.3 C18.8333333,1.43333333 18.0333333,1 17,1 L4,1 C2.35,1 1,2.35 1,4 L1,17 C1,18.65 2.35,20 4,20 L17,20 C18.65,20 20,18.65 20,17 L20,7.99769186"
   })), /*#__PURE__*/React.createElement("p", {
     className: "".concat(formstyles.checkbox_label) + ' ml-2 mb-0 wordbreak cursor-pointer mr-2 '
-  }, langdetect == 'en' ? 'Mobile Wallet' : 'المحفظة الإلكترونية')))))), (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue75 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue75 === void 0 || (_fetchcustomercartQue75 = _fetchcustomercartQue75.data) === null || _fetchcustomercartQue75 === void 0 ? void 0 : _fetchcustomercartQue75.customercart.paymentmethod) == 'onlinepayment1' && /*#__PURE__*/React.createElement("div", {
+  }, langdetect == 'en' ? 'Mobile Wallet' : 'المحفظة الإلكترونية'))), (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i4 = authdetailsContext.instinfo) === null || _authdetailsContext$i4 === void 0 ? void 0 : _authdetailsContext$i4.acceptForsaCard) == 1 && /*#__PURE__*/React.createElement("div", {
+    className: "col-xl-4 col-lg-4 col-md-12 mb-3"
+  }, /*#__PURE__*/React.createElement("label", {
+    className: langdetect == 'en' ? "".concat(formstyles.checkbox, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 ' : "".concat(formstyles.checkbox, " ").concat(formstyles.checkboxtranslated, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 '
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "checkbox",
+    className: checkoutstyles.checkboxinputstyles + ' mt-auto mb-auto ',
+    checked: (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue75 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue75 === void 0 || (_fetchcustomercartQue75 = _fetchcustomercartQue75.data) === null || _fetchcustomercartQue75 === void 0 || (_fetchcustomercartQue75 = _fetchcustomercartQue75.customercart) === null || _fetchcustomercartQue75 === void 0 ? void 0 : _fetchcustomercartQue75.paymentmethod) == 'forsa' ? true : false,
+    onChange: function onChange() {
+      var _fetchcustomercartQue76;
+      if ((fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue76 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue76 === void 0 || (_fetchcustomercartQue76 = _fetchcustomercartQue76.data) === null || _fetchcustomercartQue76 === void 0 || (_fetchcustomercartQue76 = _fetchcustomercartQue76.customercart) === null || _fetchcustomercartQue76 === void 0 ? void 0 : _fetchcustomercartQue76.paymentmethod) != 'forsa') {
+        cartinfoupdater('paymentmethod', 'forsa');
+      }
+    }
+  }), /*#__PURE__*/React.createElement("svg", {
+    viewBox: "0 0 21 21",
+    className: checkoutstyles.svgstyles + ' h-100 '
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M5,10.75 L8.5,14.25 L19.4,2.3 C18.8333333,1.43333333 18.0333333,1 17,1 L4,1 C2.35,1 1,2.35 1,4 L1,17 C1,18.65 2.35,20 4,20 L17,20 C18.65,20 20,18.65 20,17 L20,7.99769186"
+  })), /*#__PURE__*/React.createElement("p", {
+    className: "".concat(formstyles.checkbox_label) + ' ml-2 mb-0 wordbreak cursor-pointer mr-2 '
+  }, langdetect == 'en' ? 'Forsa' : ' Forsa'))), (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i5 = authdetailsContext.instinfo) === null || _authdetailsContext$i5 === void 0 ? void 0 : _authdetailsContext$i5.acceptBankInstallementsCard) == 1 && /*#__PURE__*/React.createElement("div", {
+    className: "col-xl-4 col-lg-4 col-md-12 mb-3"
+  }, /*#__PURE__*/React.createElement("label", {
+    className: langdetect == 'en' ? "".concat(formstyles.checkbox, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 ' : "".concat(formstyles.checkbox, " ").concat(formstyles.checkboxtranslated, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 '
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "checkbox",
+    className: checkoutstyles.checkboxinputstyles + ' mt-auto mb-auto ',
+    checked: (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue77 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue77 === void 0 || (_fetchcustomercartQue77 = _fetchcustomercartQue77.data) === null || _fetchcustomercartQue77 === void 0 || (_fetchcustomercartQue77 = _fetchcustomercartQue77.customercart) === null || _fetchcustomercartQue77 === void 0 ? void 0 : _fetchcustomercartQue77.paymentmethod) == 'bankinstallments' ? true : false,
+    onChange: function onChange() {
+      var _fetchcustomercartQue78;
+      if ((fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue78 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue78 === void 0 || (_fetchcustomercartQue78 = _fetchcustomercartQue78.data) === null || _fetchcustomercartQue78 === void 0 || (_fetchcustomercartQue78 = _fetchcustomercartQue78.customercart) === null || _fetchcustomercartQue78 === void 0 ? void 0 : _fetchcustomercartQue78.paymentmethod) != 'bankinstallments') {
+        cartinfoupdater('paymentmethod', 'bankinstallments');
+      }
+    }
+  }), /*#__PURE__*/React.createElement("svg", {
+    viewBox: "0 0 21 21",
+    className: checkoutstyles.svgstyles + ' h-100 '
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M5,10.75 L8.5,14.25 L19.4,2.3 C18.8333333,1.43333333 18.0333333,1 17,1 L4,1 C2.35,1 1,2.35 1,4 L1,17 C1,18.65 2.35,20 4,20 L17,20 C18.65,20 20,18.65 20,17 L20,7.99769186"
+  })), /*#__PURE__*/React.createElement("p", {
+    className: "".concat(formstyles.checkbox_label) + ' ml-2 mb-0 wordbreak cursor-pointer mr-2 '
+  }, langdetect == 'en' ? 'Bank Installments' : ' التقسيط عن طريق البنك')))))), (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue79 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue79 === void 0 || (_fetchcustomercartQue79 = _fetchcustomercartQue79.data) === null || _fetchcustomercartQue79 === void 0 ? void 0 : _fetchcustomercartQue79.customercart.paymentmethod) == 'onlinepayment1' && /*#__PURE__*/React.createElement("div", {
     className: "col-lg-12 p-0 w-100 mb-3"
   }, /*#__PURE__*/React.createElement("div", {
     style: {
@@ -13734,7 +13776,12 @@ var Filter$1 = function Filter(props) {
     });
     if (!CollectionExists) {
       if (tempfetchproductsfilerobjcontext.collections != undefined && Array.isArray(tempfetchproductsfilerobjcontext.collections)) {
-        tempfetchproductsfilerobjcontext.collections.push(collectionid);
+        if (sectionproperties.filterType != 'Title & Sort By Only' && sectionproperties.filterdirection == 'Horizontal') {
+          tempfetchproductsfilerobjcontext.collections = [];
+          tempfetchproductsfilerobjcontext.collections.push(collectionid);
+        } else {
+          tempfetchproductsfilerobjcontext.collections.push(collectionid);
+        }
       } else {
         tempfetchproductsfilerobjcontext.collections = [collectionid];
       }
@@ -14554,7 +14601,7 @@ var Filter$1 = function Filter(props) {
     wrapperClassName: '',
     itemClassName: 'filtercard',
     scrollContainerClassName: 'scrollmenuclasssubscrollbar'
-  }, instcollections.map(function (item, index) {
+  }, collectionstobevisible.map(function (item, index) {
     return /*#__PURE__*/React.createElement("div", {
       className: filter_cssstyles.timeline_text + ' col-xl-12 p-0 col-lg-12 col-md-12 col-sm-12 w-100 cursor-pointer ',
       onClick: function onClick() {
@@ -15651,6 +15698,12 @@ var CardsSection = function CardsSection(props) {
     }));
   }
   var section_cssstyles = {
+    sectioncontainerr: css({
+      marginTop: sectionproperties.marginTop + 'px',
+      '@media (max-width: 800px)': {
+        marginTop: sectionproperties.marginTopResp != undefined && sectionproperties.marginTopResp != undefined ? sectionproperties.marginTopResp + 'px' : sectionproperties.marginTop + 'px'
+      }
+    }),
     innercardssection: css({
       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,
@@ -16376,7 +16429,7 @@ var CardsSection = function CardsSection(props) {
   };
   return /*#__PURE__*/React.createElement("div", {
     ref: refscr,
-    "class": ' row ml-0 mr-0 d-flex justify-content-center ml-auto mr-auto w-md-100 w-sm-100 ',
+    "class": section_cssstyles.sectioncontainerr + ' row ml-0 mr-0 d-flex justify-content-center ml-auto mr-auto w-md-100 w-sm-100 ',
     style: {
       zIndex: 2,
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -16388,7 +16441,6 @@ var CardsSection = function CardsSection(props) {
       borderBottomRightRadius: langdetect == 'en' ? sectionproperties.borderBottomRightRadius + 'px' : sectionproperties.borderBottomLeftRadius + 'px',
       borderTopLeftRadius: langdetect == 'en' ? sectionproperties.borderTopLeftRadius + 'px' : sectionproperties.borderTopRightRadius + 'px',
       borderTopRightRadius: langdetect == 'en' ? sectionproperties.borderTopRightRadius + 'px' : sectionproperties.borderTopLeftRadius + 'px',
-      marginTop: sectionproperties.marginTop + 'px',
       marginBottom: sectionproperties.marginBottom + 'px',
       minHeight: sectionproperties.height == null || sectionproperties.height == 0 ? 'auto' : sectionproperties.height + 'vh'
     }
@@ -17591,6 +17643,7 @@ var Subheader = function Subheader(props) {
     _useState10[0];
     _useState10[1];
   var authdetailsContext = props.actions.authdetailsContext;
+  var ikimagecredcontext = props.actions.ikimagecredcontext;
   useEffect(function () {
     var tempFetchQueriesEngineContext = FetchQueriesEngineContext;
     tempFetchQueriesEngineContext.categories = true;
@@ -18045,12 +18098,32 @@ var Subheader = function Subheader(props) {
         onClick: function onClick() {
           routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.collectionid);
         }
+      }, /*#__PURE__*/React.createElement("div", {
+        "class": "row m-0 w-100"
+      }, sectionproperties.showsubheadercollimage == 'Show' && /*#__PURE__*/React.createElement("div", {
+        "class": "col-lg-12 allcentered p-0"
+      }, /*#__PURE__*/React.createElement("div", {
+        style: {
+          width: '90%',
+          height: '90%'
+        }
+      }, /*#__PURE__*/React.createElement(Imagekitimagecomp, {
+        urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
+        publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
+        path: '/tr:w-500,h-500/' + item.collectionlogo,
+        style: {
+          width: '100%',
+          height: '100%',
+          objectFit: 'contain'
+        }
+      }))), /*#__PURE__*/React.createElement("div", {
+        "class": "col-lg-12 allcentered p-0"
       }, /*#__PURE__*/React.createElement("p", {
         "class": "".concat(header_cssstyles.subheader_collectiontitle) + ' wordbreak m-0 p-0 ',
         style: {
           textAlign: langdetect == 'en' ? 'left' : 'right'
         }
-      }, langdetect == 'en' ? item.title_en : item.title_ar)), index != pcollarray[Choosenindex].collections != 0 && /*#__PURE__*/React.createElement("div", {
+      }, langdetect == 'en' ? item.title_en : item.title_ar)))), index != pcollarray[Choosenindex].collections != 0 && /*#__PURE__*/React.createElement("div", {
         "class": "col-lg-12 p-0 d-none d-sm-block"
       }, /*#__PURE__*/React.createElement("hr", {
         "class": "mt-3 mb-0"
@@ -18511,22 +18584,7 @@ var Headerresponsive = function Headerresponsive(props) {
     className: langdetect == 'en' ? 'mr-2' : 'ml-2'
   }), /*#__PURE__*/React.createElement("span", {
     className: "text-transform-none"
-  }, lang.signup)))), sectionproperties.cartBtnShow == 'Show' && /*#__PURE__*/React.createElement(Dropdown.Divider, {
-    style: {
-      marginBottom: 0,
-      marginTop: 0
-    }
-  }), sectionproperties.cartBtnShow == 'Show' && /*#__PURE__*/React.createElement(Dropdown.Item, {
-    onClick: function onClick() {
-      routingcountext(StaticPagesLinksContext.viewcart);
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(header_cssstyles.dropdownitemcontainer) + ' m-0 p-0 d-flex align-items-center '
-  }, /*#__PURE__*/React.createElement("p", {
-    className: ' d-flex align-items-center m-0 p-0 '
-  }, sectionproperties.carticonstyle == 'Shopping bag 1' && /*#__PURE__*/React.createElement(FiShoppingBag, null), sectionproperties.carticonstyle == 'Shopping bag 2' && /*#__PURE__*/React.createElement(CgShoppingBag, null), sectionproperties.carticonstyle == 'Shopping bag 3' && /*#__PURE__*/React.createElement(BsBag, null), sectionproperties.carticonstyle == 'Shopping bag 4' && /*#__PURE__*/React.createElement(HiOutlineShoppingBag, null), sectionproperties.carticonstyle == 'Shopping cart 1' && /*#__PURE__*/React.createElement(FiShoppingCart, null), sectionproperties.carticonstyle == 'Shopping cart 2' && /*#__PURE__*/React.createElement(MdAddShoppingCart, null), sectionproperties.carticonstyle == 'Calendar 1' && /*#__PURE__*/React.createElement(FiCalendar, null), /*#__PURE__*/React.createElement("span", {
-    className: "ml-2 mr-2"
-  }, lang.viewcart))))), authdetailsContext.loggedin && /*#__PURE__*/React.createElement(Dropdown.Menu, {
+  }, lang.signup))))), authdetailsContext.loggedin && /*#__PURE__*/React.createElement(Dropdown.Menu, {
     style: {
       minWidth: '200px'
     }
@@ -18703,7 +18761,7 @@ var Headerresponsive = function Headerresponsive(props) {
       display: sectionproperties.searchbar_show == 'Hide' && sectionproperties.favBtnShow == 'Hide' && sectionproperties.cartBtnShow == 'Hide' && (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i2 = authdetailsContext.instinfo) === null || _authdetailsContext$i2 === void 0 || (_authdetailsContext$i2 = _authdetailsContext$i2.instcurrencies) === null || _authdetailsContext$i2 === void 0 ? void 0 : _authdetailsContext$i2.length) == 1 ? 'none' : 'flex'
     }
   }, sectionproperties.searchbar_show == 'Show' && /*#__PURE__*/React.createElement("div", {
-    className: authdetailsContext != undefined && (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i3 = authdetailsContext.instinfo) === null || _authdetailsContext$i3 === void 0 || (_authdetailsContext$i3 = _authdetailsContext$i3.instcurrencies) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.length) > 1 ? 'col-md-8 p-0' : 'col-md-10 p-0',
+    className: authdetailsContext != undefined && (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i3 = authdetailsContext.instinfo) === null || _authdetailsContext$i3 === void 0 || (_authdetailsContext$i3 = _authdetailsContext$i3.instcurrencies) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.length) > 1 ? 'col-md-8 p-0' : sectionproperties.showlanuagecontainer == 'Show' ? 'col-md-10 p-0' : 'col-md-12 p-0',
     style: {
       borderRight: langdetect == 'en' ? '1px solid ' + sectionproperties.searchbarcont_bordercolorresponsive : 0,
       borderLeft: langdetect == 'en' ? 0 : '1px solid ' + sectionproperties.searchbarcont_bordercolorresponsive
@@ -18784,7 +18842,7 @@ var Headerresponsive = function Headerresponsive(props) {
     }, /*#__PURE__*/React.createElement("hr", {
       "class": "m-0"
     }))));
-  })))), /*#__PURE__*/React.createElement("div", {
+  })))), sectionproperties.showlanuagecontainer == 'Show' && /*#__PURE__*/React.createElement("div", {
     className: sectionproperties.searchbar_show == 'Show' ? langdetect == 'en' ? 'col-md-2 allcentered pl-1 pr-1 pt-1 resposiveheader_languagedropdown' : 'col-md-2 allcentered pl-1 pr-1 pt-1' : 'allcentered pl-1 pr-1 pt-2 pb-2 resposiveheader_languagedropdown',
     style: {
       flex: sectionproperties.searchbar_show == 'Show' ? '' : 1
@@ -26482,17 +26540,17 @@ var Simpleheader = function Simpleheader(props) {
       marginTop: sectionproperties.header_marginTop + 'px',
       marginBottom: sectionproperties.header_marginBottom + 'px'
     }
+  }, /*#__PURE__*/React.createElement("div", {
+    "class": " ".concat(header_cssstyles.headercontainer) + ' d-flex d-md-none align-items-center m-0 '
+  }, /*#__PURE__*/React.createElement("div", {
+    "class": "row m-0 w-100 "
   }, templateproperties_context.showtextslider == 'Show' && /*#__PURE__*/React.createElement("div", {
     "class": "col-lg-12 p-0"
   }, /*#__PURE__*/React.createElement(MarqueeHeader, {
     sectionpropertiesprops: sectionproperties,
     templateproperties_contextprops: templateproperties_context,
     actions: actions
-  })), /*#__PURE__*/React.createElement("div", {
-    "class": " ".concat(header_cssstyles.headercontainer) + ' d-flex d-md-none align-items-center m-0 '
-  }, /*#__PURE__*/React.createElement("div", {
-    "class": "row m-0 w-100 "
-  }, sectionproperties.showdownloadapp == 'Show' && /*#__PURE__*/React.createElement("div", {
+  })), sectionproperties.showdownloadapp == 'Show' && /*#__PURE__*/React.createElement("div", {
     "class": "w-100 d-flex d-md-none"
   }, /*#__PURE__*/React.createElement(DownloadApp, {
     sectionpropertiesprops: sectionproperties,
@@ -26517,7 +26575,7 @@ var Simpleheader = function Simpleheader(props) {
   }, /*#__PURE__*/React.createElement("div", {
     "class": " ".concat(headerstyles$9.navbar) + ' row m-0  w-100 d-flex flex-row align-items-center h-100 '
   }, /*#__PURE__*/React.createElement("div", {
-    "class": "col-lg-4 p-0"
+    "class": sectionproperties.showhidesubheader == 'Show' && sectionproperties.subheaderposition == 'Besides Top Navigation' ? 'col-lg-2 p-0' : 'col-lg-4 p-0'
   }, /*#__PURE__*/React.createElement("div", {
     "class": "".concat(header_cssstyles.header_logo) + ' d-flex align-items-center justify-content-center ',
     style: {
@@ -26535,7 +26593,7 @@ var Simpleheader = function Simpleheader(props) {
       maxHeight: '100%'
     }
   }))), /*#__PURE__*/React.createElement("div", {
-    "class": "".concat(headerstyles$9.nav__item) + ' col-lg-4 p-0 d-flex flex-row align-items-center ',
+    "class": sectionproperties.showhidesubheader == 'Show' && sectionproperties.subheaderposition == 'Besides Top Navigation' ? "".concat(headerstyles$9.nav__item) + ' col-lg-8 p-0 d-flex flex-row align-items-center ' : "".concat(headerstyles$9.nav__item) + ' col-lg-2 p-0 d-flex flex-row align-items-center ',
     style: {
       justifyContent: sectionproperties.header_centered == 'Centered' ? 'center' : 'start'
     }
@@ -26567,7 +26625,7 @@ var Simpleheader = function Simpleheader(props) {
       subheadercontentpositionprops: sectionproperties.header_centered == 'Centered' ? 'center' : 'start'
     }
   })), /*#__PURE__*/React.createElement("div", {
-    "class": "col-lg-4 p-0 d-flex align-items-center justify-content-end"
+    "class": sectionproperties.showhidesubheader == 'Show' && sectionproperties.subheaderposition == 'Besides Top Navigation' ? 'col-lg-2 p-0 d-flex align-items-center justify-content-end' : 'col-lg-4 p-0 d-flex align-items-center justify-content-end'
   }, sectionproperties.searchbar_show == 'Show' && /*#__PURE__*/React.createElement("i", {
     className: header_cssstyles.searchicon + ' h-100 allcentered ',
     onClick: function onClick() {

package/dist/index.umd.js

@@ -2349,7 +2349,7 @@
       }, /*#__PURE__*/React__default["default"].createElement(ImageGallery__default["default"], {
         items: productimagesarray,
         thumbnailPosition: sectionproperties.thumbnailposition == 'Bottom' ? 'bottom' : 'left',
-        showNav: false,
+        showNav: true,
         showPlayButton: false,
         showFullscreenButton: sectionproperties.showgalleryfullscreenbtn == 'Yes' ? true : false,
         startIndex: currentshowingimageindex
@@ -8481,7 +8481,7 @@
       return import('react-select');
     });
     var Checkout = function Checkout(props) {
-      var _css, _checkoutstyles, _ref, _fetchcustomercartQue55, _fetchcustomercartQue56, _fetchcustomercartQue57, _fetchcustomercartQue62, _fetchcustomercartQue63, _fetchcustomercartQue64, _fetchcustomercartQue65, _fetchcustomercartQue67, _fetchcustomercartQue69, _fetchcustomercartQue71, _fetchcustomercartQue73, _fetchcustomercartQue75;
+      var _css, _checkoutstyles, _ref, _fetchcustomercartQue55, _fetchcustomercartQue56, _fetchcustomercartQue57, _fetchcustomercartQue62, _fetchcustomercartQue63, _fetchcustomercartQue64, _fetchcustomercartQue65, _fetchcustomercartQue67, _fetchcustomercartQue69, _fetchcustomercartQue71, _fetchcustomercartQue73, _authdetailsContext$i4, _fetchcustomercartQue75, _authdetailsContext$i5, _fetchcustomercartQue77, _fetchcustomercartQue79;
       var _useState = React.useState(null),
         _useState2 = _slicedToArray__default["default"](_useState, 2);
         _useState2[0];
@@ -9710,7 +9710,49 @@
         d: "M5,10.75 L8.5,14.25 L19.4,2.3 C18.8333333,1.43333333 18.0333333,1 17,1 L4,1 C2.35,1 1,2.35 1,4 L1,17 C1,18.65 2.35,20 4,20 L17,20 C18.65,20 20,18.65 20,17 L20,7.99769186"
       })), /*#__PURE__*/React__default["default"].createElement("p", {
         className: "".concat(formstyles.checkbox_label) + ' ml-2 mb-0 wordbreak cursor-pointer mr-2 '
-      }, langdetect == 'en' ? 'Mobile Wallet' : 'المحفظة الإلكترونية')))))), (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue75 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue75 === void 0 || (_fetchcustomercartQue75 = _fetchcustomercartQue75.data) === null || _fetchcustomercartQue75 === void 0 ? void 0 : _fetchcustomercartQue75.customercart.paymentmethod) == 'onlinepayment1' && /*#__PURE__*/React__default["default"].createElement("div", {
+      }, langdetect == 'en' ? 'Mobile Wallet' : 'المحفظة الإلكترونية'))), (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i4 = authdetailsContext.instinfo) === null || _authdetailsContext$i4 === void 0 ? void 0 : _authdetailsContext$i4.acceptForsaCard) == 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "col-xl-4 col-lg-4 col-md-12 mb-3"
+      }, /*#__PURE__*/React__default["default"].createElement("label", {
+        className: langdetect == 'en' ? "".concat(formstyles.checkbox, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 ' : "".concat(formstyles.checkbox, " ").concat(formstyles.checkboxtranslated, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 '
+      }, /*#__PURE__*/React__default["default"].createElement("input", {
+        type: "checkbox",
+        className: checkoutstyles.checkboxinputstyles + ' mt-auto mb-auto ',
+        checked: (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue75 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue75 === void 0 || (_fetchcustomercartQue75 = _fetchcustomercartQue75.data) === null || _fetchcustomercartQue75 === void 0 || (_fetchcustomercartQue75 = _fetchcustomercartQue75.customercart) === null || _fetchcustomercartQue75 === void 0 ? void 0 : _fetchcustomercartQue75.paymentmethod) == 'forsa' ? true : false,
+        onChange: function onChange() {
+          var _fetchcustomercartQue76;
+          if ((fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue76 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue76 === void 0 || (_fetchcustomercartQue76 = _fetchcustomercartQue76.data) === null || _fetchcustomercartQue76 === void 0 || (_fetchcustomercartQue76 = _fetchcustomercartQue76.customercart) === null || _fetchcustomercartQue76 === void 0 ? void 0 : _fetchcustomercartQue76.paymentmethod) != 'forsa') {
+            cartinfoupdater('paymentmethod', 'forsa');
+          }
+        }
+      }), /*#__PURE__*/React__default["default"].createElement("svg", {
+        viewBox: "0 0 21 21",
+        className: checkoutstyles.svgstyles + ' h-100 '
+      }, /*#__PURE__*/React__default["default"].createElement("path", {
+        d: "M5,10.75 L8.5,14.25 L19.4,2.3 C18.8333333,1.43333333 18.0333333,1 17,1 L4,1 C2.35,1 1,2.35 1,4 L1,17 C1,18.65 2.35,20 4,20 L17,20 C18.65,20 20,18.65 20,17 L20,7.99769186"
+      })), /*#__PURE__*/React__default["default"].createElement("p", {
+        className: "".concat(formstyles.checkbox_label) + ' ml-2 mb-0 wordbreak cursor-pointer mr-2 '
+      }, langdetect == 'en' ? 'Forsa' : ' Forsa'))), (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i5 = authdetailsContext.instinfo) === null || _authdetailsContext$i5 === void 0 ? void 0 : _authdetailsContext$i5.acceptBankInstallementsCard) == 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "col-xl-4 col-lg-4 col-md-12 mb-3"
+      }, /*#__PURE__*/React__default["default"].createElement("label", {
+        className: langdetect == 'en' ? "".concat(formstyles.checkbox, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 ' : "".concat(formstyles.checkbox, " ").concat(formstyles.checkboxtranslated, " ").concat(checkoutstyles.checkbox, " ") + ' d-flex mb-0 '
+      }, /*#__PURE__*/React__default["default"].createElement("input", {
+        type: "checkbox",
+        className: checkoutstyles.checkboxinputstyles + ' mt-auto mb-auto ',
+        checked: (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue77 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue77 === void 0 || (_fetchcustomercartQue77 = _fetchcustomercartQue77.data) === null || _fetchcustomercartQue77 === void 0 || (_fetchcustomercartQue77 = _fetchcustomercartQue77.customercart) === null || _fetchcustomercartQue77 === void 0 ? void 0 : _fetchcustomercartQue77.paymentmethod) == 'bankinstallments' ? true : false,
+        onChange: function onChange() {
+          var _fetchcustomercartQue78;
+          if ((fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue78 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue78 === void 0 || (_fetchcustomercartQue78 = _fetchcustomercartQue78.data) === null || _fetchcustomercartQue78 === void 0 || (_fetchcustomercartQue78 = _fetchcustomercartQue78.customercart) === null || _fetchcustomercartQue78 === void 0 ? void 0 : _fetchcustomercartQue78.paymentmethod) != 'bankinstallments') {
+            cartinfoupdater('paymentmethod', 'bankinstallments');
+          }
+        }
+      }), /*#__PURE__*/React__default["default"].createElement("svg", {
+        viewBox: "0 0 21 21",
+        className: checkoutstyles.svgstyles + ' h-100 '
+      }, /*#__PURE__*/React__default["default"].createElement("path", {
+        d: "M5,10.75 L8.5,14.25 L19.4,2.3 C18.8333333,1.43333333 18.0333333,1 17,1 L4,1 C2.35,1 1,2.35 1,4 L1,17 C1,18.65 2.35,20 4,20 L17,20 C18.65,20 20,18.65 20,17 L20,7.99769186"
+      })), /*#__PURE__*/React__default["default"].createElement("p", {
+        className: "".concat(formstyles.checkbox_label) + ' ml-2 mb-0 wordbreak cursor-pointer mr-2 '
+      }, langdetect == 'en' ? 'Bank Installments' : ' التقسيط عن طريق البنك')))))), (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 || (_fetchcustomercartQue79 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue79 === void 0 || (_fetchcustomercartQue79 = _fetchcustomercartQue79.data) === null || _fetchcustomercartQue79 === void 0 ? void 0 : _fetchcustomercartQue79.customercart.paymentmethod) == 'onlinepayment1' && /*#__PURE__*/React__default["default"].createElement("div", {
         className: "col-lg-12 p-0 w-100 mb-3"
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         style: {
@@ -13615,7 +13657,12 @@
         });
         if (!CollectionExists) {
           if (tempfetchproductsfilerobjcontext.collections != undefined && Array.isArray(tempfetchproductsfilerobjcontext.collections)) {
-            tempfetchproductsfilerobjcontext.collections.push(collectionid);
+            if (sectionproperties.filterType != 'Title & Sort By Only' && sectionproperties.filterdirection == 'Horizontal') {
+              tempfetchproductsfilerobjcontext.collections = [];
+              tempfetchproductsfilerobjcontext.collections.push(collectionid);
+            } else {
+              tempfetchproductsfilerobjcontext.collections.push(collectionid);
+            }
           } else {
             tempfetchproductsfilerobjcontext.collections = [collectionid];
           }
@@ -14435,7 +14482,7 @@
         wrapperClassName: '',
         itemClassName: 'filtercard',
         scrollContainerClassName: 'scrollmenuclasssubscrollbar'
-      }, instcollections.map(function (item, index) {
+      }, collectionstobevisible.map(function (item, index) {
         return /*#__PURE__*/React__default["default"].createElement("div", {
           className: filter_cssstyles.timeline_text + ' col-xl-12 p-0 col-lg-12 col-md-12 col-sm-12 w-100 cursor-pointer ',
           onClick: function onClick() {
@@ -15532,6 +15579,12 @@
         }));
       }
       var section_cssstyles = {
+        sectioncontainerr: glamor.css({
+          marginTop: sectionproperties.marginTop + 'px',
+          '@media (max-width: 800px)': {
+            marginTop: sectionproperties.marginTopResp != undefined && sectionproperties.marginTopResp != undefined ? sectionproperties.marginTopResp + 'px' : sectionproperties.marginTop + 'px'
+          }
+        }),
         innercardssection: glamor.css({
           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,
@@ -16257,7 +16310,7 @@
       };
       return /*#__PURE__*/React__default["default"].createElement("div", {
         ref: refscr,
-        "class": ' row ml-0 mr-0 d-flex justify-content-center ml-auto mr-auto w-md-100 w-sm-100 ',
+        "class": section_cssstyles.sectioncontainerr + ' row ml-0 mr-0 d-flex justify-content-center ml-auto mr-auto w-md-100 w-sm-100 ',
         style: {
           zIndex: 2,
           background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -16269,7 +16322,6 @@
           borderBottomRightRadius: langdetect == 'en' ? sectionproperties.borderBottomRightRadius + 'px' : sectionproperties.borderBottomLeftRadius + 'px',
           borderTopLeftRadius: langdetect == 'en' ? sectionproperties.borderTopLeftRadius + 'px' : sectionproperties.borderTopRightRadius + 'px',
           borderTopRightRadius: langdetect == 'en' ? sectionproperties.borderTopRightRadius + 'px' : sectionproperties.borderTopLeftRadius + 'px',
-          marginTop: sectionproperties.marginTop + 'px',
           marginBottom: sectionproperties.marginBottom + 'px',
           minHeight: sectionproperties.height == null || sectionproperties.height == 0 ? 'auto' : sectionproperties.height + 'vh'
         }
@@ -17472,6 +17524,7 @@
         _useState10[0];
         _useState10[1];
       var authdetailsContext = props.actions.authdetailsContext;
+      var ikimagecredcontext = props.actions.ikimagecredcontext;
       React.useEffect(function () {
         var tempFetchQueriesEngineContext = FetchQueriesEngineContext;
         tempFetchQueriesEngineContext.categories = true;
@@ -17926,12 +17979,32 @@
             onClick: function onClick() {
               routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.collectionid);
             }
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "row m-0 w-100"
+          }, sectionproperties.showsubheadercollimage == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "col-lg-12 allcentered p-0"
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            style: {
+              width: '90%',
+              height: '90%'
+            }
+          }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
+            urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
+            publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
+            path: '/tr:w-500,h-500/' + item.collectionlogo,
+            style: {
+              width: '100%',
+              height: '100%',
+              objectFit: 'contain'
+            }
+          }))), /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "col-lg-12 allcentered p-0"
           }, /*#__PURE__*/React__default["default"].createElement("p", {
             "class": "".concat(header_cssstyles.subheader_collectiontitle) + ' wordbreak m-0 p-0 ',
             style: {
               textAlign: langdetect == 'en' ? 'left' : 'right'
             }
-          }, langdetect == 'en' ? item.title_en : item.title_ar)), index != pcollarray[Choosenindex].collections != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
+          }, langdetect == 'en' ? item.title_en : item.title_ar)))), index != pcollarray[Choosenindex].collections != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
             "class": "col-lg-12 p-0 d-none d-sm-block"
           }, /*#__PURE__*/React__default["default"].createElement("hr", {
             "class": "mt-3 mb-0"
@@ -18392,22 +18465,7 @@
         className: langdetect == 'en' ? 'mr-2' : 'ml-2'
       }), /*#__PURE__*/React__default["default"].createElement("span", {
         className: "text-transform-none"
-      }, lang.signup)))), sectionproperties.cartBtnShow == 'Show' && /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"].Divider, {
-        style: {
-          marginBottom: 0,
-          marginTop: 0
-        }
-      }), sectionproperties.cartBtnShow == 'Show' && /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"].Item, {
-        onClick: function onClick() {
-          routingcountext(StaticPagesLinksContext.viewcart);
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "".concat(header_cssstyles.dropdownitemcontainer) + ' m-0 p-0 d-flex align-items-center '
-      }, /*#__PURE__*/React__default["default"].createElement("p", {
-        className: ' d-flex align-items-center m-0 p-0 '
-      }, sectionproperties.carticonstyle == 'Shopping bag 1' && /*#__PURE__*/React__default["default"].createElement(FiShoppingBag.FiShoppingBag, null), sectionproperties.carticonstyle == 'Shopping bag 2' && /*#__PURE__*/React__default["default"].createElement(CgShoppingBag.CgShoppingBag, null), sectionproperties.carticonstyle == 'Shopping bag 3' && /*#__PURE__*/React__default["default"].createElement(BsBag.BsBag, null), sectionproperties.carticonstyle == 'Shopping bag 4' && /*#__PURE__*/React__default["default"].createElement(HiOutlineShoppingBag.HiOutlineShoppingBag, null), sectionproperties.carticonstyle == 'Shopping cart 1' && /*#__PURE__*/React__default["default"].createElement(FiShoppingCart.FiShoppingCart, null), sectionproperties.carticonstyle == 'Shopping cart 2' && /*#__PURE__*/React__default["default"].createElement(MdAddShoppingCart.MdAddShoppingCart, null), sectionproperties.carticonstyle == 'Calendar 1' && /*#__PURE__*/React__default["default"].createElement(FiCalendar.FiCalendar, null), /*#__PURE__*/React__default["default"].createElement("span", {
-        className: "ml-2 mr-2"
-      }, lang.viewcart))))), authdetailsContext.loggedin && /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"].Menu, {
+      }, lang.signup))))), authdetailsContext.loggedin && /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"].Menu, {
         style: {
           minWidth: '200px'
         }
@@ -18584,7 +18642,7 @@
           display: sectionproperties.searchbar_show == 'Hide' && sectionproperties.favBtnShow == 'Hide' && sectionproperties.cartBtnShow == 'Hide' && (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i2 = authdetailsContext.instinfo) === null || _authdetailsContext$i2 === void 0 || (_authdetailsContext$i2 = _authdetailsContext$i2.instcurrencies) === null || _authdetailsContext$i2 === void 0 ? void 0 : _authdetailsContext$i2.length) == 1 ? 'none' : 'flex'
         }
       }, sectionproperties.searchbar_show == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
-        className: authdetailsContext != undefined && (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i3 = authdetailsContext.instinfo) === null || _authdetailsContext$i3 === void 0 || (_authdetailsContext$i3 = _authdetailsContext$i3.instcurrencies) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.length) > 1 ? 'col-md-8 p-0' : 'col-md-10 p-0',
+        className: authdetailsContext != undefined && (authdetailsContext === null || authdetailsContext === void 0 || (_authdetailsContext$i3 = authdetailsContext.instinfo) === null || _authdetailsContext$i3 === void 0 || (_authdetailsContext$i3 = _authdetailsContext$i3.instcurrencies) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.length) > 1 ? 'col-md-8 p-0' : sectionproperties.showlanuagecontainer == 'Show' ? 'col-md-10 p-0' : 'col-md-12 p-0',
         style: {
           borderRight: langdetect == 'en' ? '1px solid ' + sectionproperties.searchbarcont_bordercolorresponsive : 0,
           borderLeft: langdetect == 'en' ? 0 : '1px solid ' + sectionproperties.searchbarcont_bordercolorresponsive
@@ -18665,7 +18723,7 @@
         }, /*#__PURE__*/React__default["default"].createElement("hr", {
           "class": "m-0"
         }))));
-      })))), /*#__PURE__*/React__default["default"].createElement("div", {
+      })))), sectionproperties.showlanuagecontainer == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
         className: sectionproperties.searchbar_show == 'Show' ? langdetect == 'en' ? 'col-md-2 allcentered pl-1 pr-1 pt-1 resposiveheader_languagedropdown' : 'col-md-2 allcentered pl-1 pr-1 pt-1' : 'allcentered pl-1 pr-1 pt-2 pb-2 resposiveheader_languagedropdown',
         style: {
           flex: sectionproperties.searchbar_show == 'Show' ? '' : 1
@@ -26363,17 +26421,17 @@
           marginTop: sectionproperties.header_marginTop + 'px',
           marginBottom: sectionproperties.header_marginBottom + 'px'
         }
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": " ".concat(header_cssstyles.headercontainer) + ' d-flex d-md-none align-items-center m-0 '
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "row m-0 w-100 "
       }, templateproperties_context.showtextslider == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "col-lg-12 p-0"
       }, /*#__PURE__*/React__default["default"].createElement(MarqueeHeader, {
         sectionpropertiesprops: sectionproperties,
         templateproperties_contextprops: templateproperties_context,
         actions: actions
-      })), /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": " ".concat(header_cssstyles.headercontainer) + ' d-flex d-md-none align-items-center m-0 '
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "row m-0 w-100 "
-      }, sectionproperties.showdownloadapp == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+      })), sectionproperties.showdownloadapp == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "w-100 d-flex d-md-none"
       }, /*#__PURE__*/React__default["default"].createElement(DownloadApp, {
         sectionpropertiesprops: sectionproperties,
@@ -26398,7 +26456,7 @@
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         "class": " ".concat(headerstyles$9.navbar) + ' row m-0  w-100 d-flex flex-row align-items-center h-100 '
       }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-4 p-0"
+        "class": sectionproperties.showhidesubheader == 'Show' && sectionproperties.subheaderposition == 'Besides Top Navigation' ? 'col-lg-2 p-0' : 'col-lg-4 p-0'
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "".concat(header_cssstyles.header_logo) + ' d-flex align-items-center justify-content-center ',
         style: {
@@ -26416,7 +26474,7 @@
           maxHeight: '100%'
         }
       }))), /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "".concat(headerstyles$9.nav__item) + ' col-lg-4 p-0 d-flex flex-row align-items-center ',
+        "class": sectionproperties.showhidesubheader == 'Show' && sectionproperties.subheaderposition == 'Besides Top Navigation' ? "".concat(headerstyles$9.nav__item) + ' col-lg-8 p-0 d-flex flex-row align-items-center ' : "".concat(headerstyles$9.nav__item) + ' col-lg-2 p-0 d-flex flex-row align-items-center ',
         style: {
           justifyContent: sectionproperties.header_centered == 'Centered' ? 'center' : 'start'
         }
@@ -26448,7 +26506,7 @@
           subheadercontentpositionprops: sectionproperties.header_centered == 'Centered' ? 'center' : 'start'
         }
       })), /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-4 p-0 d-flex align-items-center justify-content-end"
+        "class": sectionproperties.showhidesubheader == 'Show' && sectionproperties.subheaderposition == 'Besides Top Navigation' ? 'col-lg-2 p-0 d-flex align-items-center justify-content-end' : 'col-lg-4 p-0 d-flex align-items-center justify-content-end'
       }, sectionproperties.searchbar_show == 'Show' && /*#__PURE__*/React__default["default"].createElement("i", {
         className: header_cssstyles.searchicon + ' h-100 allcentered ',
         onClick: function onClick() {

package/package.json

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