tabexseriescomponents 0.0.213 → 0.0.215

package/dist/index.umd.js

@@ -1148,7 +1148,8 @@
             borderRadius: 100,
             position: 'absolute',
             top: 7,
-            left: -4
+            left: langdetect == 'en' ? -4 : '',
+            right: langdetect == 'ar' ? -4 : ''
           }
         }), /*#__PURE__*/React__default["default"].createElement("div", {
           className: "row m-0 w-100 d-flex align-items-start pb-3",
@@ -1171,7 +1172,9 @@
               backgroundColor: sectionproperties.variantcontainer_bgcolortransparent == 'Transparent' ? 'transparent' : sectionproperties.variantcontainer_bgcolor,
               minWidth: sectionproperties.variantcontainer_bgcolortransparent == 'Transparent' ? 'auto' : sectionproperties.variantcontainer_minwidth + 'px',
               height: sectionproperties.variantcontainer_bgcolortransparent == 'Transparent' ? 'auto' : sectionproperties.variantcontainer_height + 'px',
-              borderRadius: sectionproperties.variantcontainer_borderBottomLeftRadius + 'px'
+              borderRadius: sectionproperties.variantcontainer_borderBottomLeftRadius + 'px',
+              transform: 'none',
+              cursor: 'default'
             }
           }, /*#__PURE__*/React__default["default"].createElement("p", {
             className: 'm-0 p-0 allcentered font-weight-500',
@@ -1681,9 +1684,9 @@
         TabIndicatorProps: {
           style: {
             background: sectionproperties.activetabbordercolor,
-            width: sectionproperties.productInformationType == 'Product/Service Information' ? sectionproperties.showfirstpolicy == 'Hide' ? '50%' : sectionproperties.showsecondpolicy == 'Hide' ? '50%' : '33.3%' : '33.3%',
-            right: sectionproperties.productInformationType == 'Product/Service Information' ? sectionproperties.showfirstpolicy == 'Hide' ? 0 : sectionproperties.showsecondpolicy == 'Hide' ? 0 : '' : '',
-            margin: sectionproperties.productInformationType == 'Product/Service Information' ? sectionproperties.showfirstpolicy == 'Hide' ? 'auto' : sectionproperties.showsecondpolicy == 'Hide' ? 'auto' : '' : ''
+            width: '50%',
+            right: sectionproperties.showfirstpolicy == 'Hide' ? 0 : sectionproperties.showsecondpolicy == 'Hide' ? 0 : '',
+            margin: sectionproperties.showfirstpolicy == 'Hide' ? 'auto' : sectionproperties.showsecondpolicy == 'Hide' ? 'auto' : ''
           }
         },
         sx: {
@@ -15916,6 +15919,7 @@
           borderRadius: sectionproperties.fav_btn_borderBottomLeftRadius + 'px',
           color: sectionproperties.favBtniconcolor,
           border: sectionproperties.favbtnborderwidth + 'px solid ' + sectionproperties.favbtnbordercolor,
+          fontSize: sectionproperties.favBtnIconfontsize + 'px',
           transition: '.3s',
           ':hover': {
             background: sectionproperties.favbtn_transparentbgcoloronhover == 'Transparent' ? 'transparent' : sectionproperties.favBtnbgColoronhover,
@@ -16358,19 +16362,19 @@
         onClick: function onClick() {
           routingcountext(StaticPagesLinksContext.Wishlist);
         }
+      }, /*#__PURE__*/React__default["default"].createElement("span", {
+        "class": "".concat(header_cssstyles.wishlist_btn)
+      }, /*#__PURE__*/React__default["default"].createElement("i", {
+        "class": "h-100 allcentered"
       }, sectionproperties.faviconshape == 'Heart Shape' && /*#__PURE__*/React__default["default"].createElement(FaRegHeart.FaRegHeart, {
-        "class": "".concat(header_cssstyles.wishlist_btn),
-        size: sectionproperties.favBtnIconfontsize,
         style: {
           position: 'relative'
         }
       }), sectionproperties.faviconshape == 'Star Shape' && /*#__PURE__*/React__default["default"].createElement(AiFillStar.AiFillStar, {
-        "class": "".concat(header_cssstyles.wishlist_btn),
-        size: sectionproperties.favBtnIconfontsize,
         style: {
           position: 'relative'
         }
-      }), /*#__PURE__*/React__default["default"].createElement("div", {
+      }))), /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "".concat(header_cssstyles.badge_counter_header_notifications, " ").concat(header_cssstyles.wishlistbadge)
       }, /*#__PURE__*/React__default["default"].createElement("span", null, " ", favoriteprojectscountContext.length >= 10 ? '+9' : favoriteprojectscountContext.length)))), /*#__PURE__*/React__default["default"].createElement("div", {
         "class": " d-flex flex-row justify-content-end align-items-center"
@@ -16389,7 +16393,9 @@
         "class": "".concat(header_cssstyles.cart_btn) + ' cursor-pointer d-flex align-items-center justify-content-center '
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "".concat(header_cssstyles.badge_counter_header_notifications, " ").concat(header_cssstyles.cartbadge)
-      }, (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 ? void 0 : (_fetchcustomercartQue5 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue5 === void 0 ? void 0 : (_fetchcustomercartQue6 = _fetchcustomercartQue5.data) === null || _fetchcustomercartQue6 === void 0 ? void 0 : _fetchcustomercartQue6.customercart) != null ? fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 ? void 0 : (_fetchcustomercartQue7 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue7 === void 0 ? void 0 : (_fetchcustomercartQue8 = _fetchcustomercartQue7.data) === null || _fetchcustomercartQue8 === void 0 ? void 0 : (_fetchcustomercartQue9 = _fetchcustomercartQue8.customercart) === null || _fetchcustomercartQue9 === void 0 ? void 0 : (_fetchcustomercartQue10 = _fetchcustomercartQue9.cartitems) === null || _fetchcustomercartQue10 === void 0 ? void 0 : _fetchcustomercartQue10.length : 0), sectionproperties.carticonstyle == 'Shopping bag 1' && /*#__PURE__*/React__default["default"].createElement(FiShoppingBag.FiShoppingBag, {
+      }, (fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 ? void 0 : (_fetchcustomercartQue5 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue5 === void 0 ? void 0 : (_fetchcustomercartQue6 = _fetchcustomercartQue5.data) === null || _fetchcustomercartQue6 === void 0 ? void 0 : _fetchcustomercartQue6.customercart) != null ? fetchcustomercartQueryContext === null || fetchcustomercartQueryContext === void 0 ? void 0 : (_fetchcustomercartQue7 = fetchcustomercartQueryContext.data) === null || _fetchcustomercartQue7 === void 0 ? void 0 : (_fetchcustomercartQue8 = _fetchcustomercartQue7.data) === null || _fetchcustomercartQue8 === void 0 ? void 0 : (_fetchcustomercartQue9 = _fetchcustomercartQue8.customercart) === null || _fetchcustomercartQue9 === void 0 ? void 0 : (_fetchcustomercartQue10 = _fetchcustomercartQue9.cartitems) === null || _fetchcustomercartQue10 === void 0 ? void 0 : _fetchcustomercartQue10.length : 0), /*#__PURE__*/React__default["default"].createElement("i", {
+        "class": "h-100 allcentered"
+      }, sectionproperties.carticonstyle == 'Shopping bag 1' && /*#__PURE__*/React__default["default"].createElement(FiShoppingBag.FiShoppingBag, {
         size: sectionproperties.cartBtn_iconFontSize
       }), sectionproperties.carticonstyle == 'Shopping bag 2' && /*#__PURE__*/React__default["default"].createElement(CgShoppingBag.CgShoppingBag, {
         size: sectionproperties.cartBtn_iconFontSize
@@ -16401,7 +16407,7 @@
         size: sectionproperties.cartBtn_iconFontSize
       }), sectionproperties.carticonstyle == 'Shopping cart 2' && /*#__PURE__*/React__default["default"].createElement(MdAddShoppingCart.MdAddShoppingCart, {
         size: sectionproperties.cartBtn_iconFontSize
-      })), /*#__PURE__*/React__default["default"].createElement("div", {
+      }))), /*#__PURE__*/React__default["default"].createElement("div", {
         "class": langdetect == 'en' ? 'ml-2' : 'mr-2'
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "row m-0 w-100 d-flex align-items-center flex-column justify-content-start"
@@ -25872,23 +25878,15 @@
       var templateproperties_context = props.actions.templateproperties_context;
       var templatepropcontext = props.actions.templatepropcontext;
       React.useEffect(function () {
-        if (props.srcfrom == 'addsectionform') {
-          var secpropobj = {};
-          props.defaultproperties.forEach(function (defaultpropobj, defaultpropindex) {
-            secpropobj[defaultpropobj.property_css_name] = defaultpropobj.property_value;
-          });
-          setsectionproperties(_objectSpread$1l({}, secpropobj));
-        } else {
-          var secpropobj = {};
-          StatePagePropertiesContext.pageobj.sections.forEach(function (sectionitem, sectionindex) {
-            if (sectionitem.sectionid == props.sectionidprops) {
-              sectionitem.sectionproperties.forEach(function (sectionpropertiesobj, sectionpropertiesindex) {
-                secpropobj[sectionpropertiesobj.property_css_name] = sectionpropertiesobj.property_value;
-              });
-            }
-          });
-          setsectionproperties(_objectSpread$1l({}, secpropobj));
-        }
+        var secpropobj = {};
+        StatePagePropertiesContext.pageobj.sections.forEach(function (sectionitem, sectionindex) {
+          if (sectionitem.sectionid == props.sectionidprops) {
+            sectionitem.sectionproperties.forEach(function (sectionpropertiesobj, sectionpropertiesindex) {
+              secpropobj[sectionpropertiesobj.property_css_name] = sectionpropertiesobj.property_value;
+            });
+          }
+        });
+        setsectionproperties(_objectSpread$1l({}, secpropobj));
       }, [StatePagePropertiesContext]);
       React.useEffect(function () {
         if (templateproperties_context.length != 0 && templateproperties_context.logoarrayofobjects != undefined) {
@@ -32163,13 +32161,11 @@
     function ownKeys$15(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
     function _objectSpread$15(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$15(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$15(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
     var BacgroundThreeImageWithCategories = function BacgroundThreeImageWithCategories(props) {
-      var _imagesarray$, _imagesarray$2, _imagesarray$3, _imagesarray$4, _imagesarray$5, _imagesarray$6;
       props.actions.lang;
       var langdetect = props.actions.langdetect;
       var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
-      props.actions.routingcountext;
-      props.actions.StaticPagesLinksContext;
-      props.sectionindexcontext;
+      var routingcountext = props.actions.routingcountext;
+      var StaticPagesLinksContext = props.actions.StaticPagesLinksContext;
       var _useState = React.useState(''),
         _useState2 = _slicedToArray__default["default"](_useState, 2),
         sectionproperties = _useState2[0],
@@ -32178,6 +32174,15 @@
         _useState4 = _slicedToArray__default["default"](_useState3, 2),
         imagesarray = _useState4[0],
         setimagesarray = _useState4[1];
+      var authdetailsContext = props.actions.authdetailsContext;
+      var _useState5 = React.useState(false),
+        _useState6 = _slicedToArray__default["default"](_useState5, 2);
+        _useState6[0];
+        var setshowdownheadermenu = _useState6[1];
+      var _useState7 = React.useState(''),
+        _useState8 = _slicedToArray__default["default"](_useState7, 2),
+        Choosenindex = _useState8[0],
+        setChoosenindex = _useState8[1];
       React.useEffect(function () {
         if (props.srcfrom == 'addsectionform') {
           var secpropobj = {};
@@ -32207,6 +32212,21 @@
           }
         }
       }, [sectionproperties]);
+      var _useState9 = React.useState([]),
+        _useState10 = _slicedToArray__default["default"](_useState9, 2),
+        pcollarray = _useState10[0],
+        setpcollarray = _useState10[1];
+      React.useEffect(function () {
+        var _authdetailsContext$i, _authdetailsContext$i2;
+        var temppcollarray = _toConsumableArray__default["default"](pcollarray);
+        authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i = authdetailsContext.instinfo) === null || _authdetailsContext$i === void 0 ? void 0 : (_authdetailsContext$i2 = _authdetailsContext$i.instcategories) === null || _authdetailsContext$i2 === void 0 ? void 0 : _authdetailsContext$i2.forEach(function (arrayItem) {
+          var _arrayItem$parentcoll;
+          arrayItem === null || arrayItem === void 0 ? void 0 : (_arrayItem$parentcoll = arrayItem.parentcolletions) === null || _arrayItem$parentcoll === void 0 ? void 0 : _arrayItem$parentcoll.forEach(function (item) {
+            temppcollarray.push(item);
+          });
+        });
+        setpcollarray(_toConsumableArray__default["default"](temppcollarray));
+      }, []);
       var sectionstyles = {
         imageBackground: glamor.css({
           ':before': {
@@ -32221,8 +32241,284 @@
             borderBottomLeftRadius: sectionproperties.image_borderBottomLeftRadius + 'px',
             borderBottomRightRadius: sectionproperties.image_borderBottomRightRadius + 'px'
           }
+        }),
+        categoryname: glamor.css({
+          color: sectionproperties.subheader_categorytitle_fontColor,
+          fontSize: sectionproperties.subheader_categorytitle_fontSize + 'px',
+          textTransform: sectionproperties.subheader_categorytitle_textTransform,
+          fontWeight: sectionproperties.subheader_categorytitle_textfontweight,
+          transition: '.3s',
+          ':hover': {
+            color: sectionproperties.subheader_categorytitle_coloronhover
+          }
+        }),
+        parentcollection: glamor.css({
+          color: sectionproperties.subheader_collectiontitle_fontColor,
+          fontSize: sectionproperties.subheader_collectiontitle_fontSize + 'px',
+          textTransform: sectionproperties.subheader_collectiontitle_textTransform,
+          fontWeight: sectionproperties.subheader_collectiontitle_textfontweight,
+          transition: '.3s',
+          ':hover': {
+            color: sectionproperties.subheader_collectiontitle_coloronhover
+          }
+        }),
+        collectionName: glamor.css({
+          color: sectionproperties.collectionsectiontextcolor,
+          fontSize: sectionproperties.collectionsectiontextfontsize + 'px',
+          textTransform: sectionproperties.collectionsectiontexttransform,
+          fontWeight: sectionproperties.collectionsectiontextfontweight,
+          transition: '.3s',
+          ':hover': {
+            color: sectionproperties.collectionsectiontextcoloronhover
+          }
+        }),
+        dropdowntitle: glamor.css({
+          color: sectionproperties.collectionssectiontitlecolor,
+          fontSize: sectionproperties.collectionssectiontitlefontsize + 'px',
+          fontWeight: sectionproperties.collectionssectiontitlefonteweight,
+          backgroundColor: sectionproperties.collectionssectiontitlebgcolor
         })
       };
+      var CategoriesDropdown = function CategoriesDropdown() {
+        var _authdetailsContext$i3, _authdetailsContext$i4, _authdetailsContext$i6, _authdetailsContext$i7, _authdetailsContext$i8, _authdetailsContext$i9, _authdetailsContext$i10, _authdetailsContext$i11, _authdetailsContext$i12, _authdetailsContext$i13, _authdetailsContext$i14, _authdetailsContext$i15, _authdetailsContext$i16;
+        return /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "row m-0 w-100",
+          style: {
+            background: sectionproperties.collectionssectionbgcolor,
+            boxShadow: '0 0 10px ' + sectionproperties.collectionssectionshadowcolor
+          }
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "col-lg-12 p-0"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "row m-0 w-100"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: sectionstyles.dropdowntitle + ' col-lg-12 p-0 '
+        }, /*#__PURE__*/React__default["default"].createElement("p", {
+          className: "m-0 p-3 text-center"
+        }, langdetect == 'en' ? sectionproperties.collectionssectiontitleen : sectionproperties.collectionssectiontitlear)), /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "col-lg-12 flex-column cat_dropdown_hover scrollvertical pt-3 px-2",
+          style: {
+            height: sectionproperties.height + 'vh',
+            overflowY: 'scroll'
+          }
+        }, sectionproperties.fetchparenttype == 'Categories' && (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i3 = authdetailsContext.instinfo) === null || _authdetailsContext$i3 === void 0 ? void 0 : (_authdetailsContext$i4 = _authdetailsContext$i3.instcategories) === null || _authdetailsContext$i4 === void 0 ? void 0 : _authdetailsContext$i4.map(function (item, index) {
+          var _authdetailsContext$i5;
+          return /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": sectionstyles.categoryname + ' row ml-0 mr-0 w-100 cursor-pointer ',
+            onMouseEnter: function onMouseEnter() {
+              setshowdownheadermenu(true);
+              setChoosenindex(index);
+            }
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            className: ' col-lg-10 col-md-10 col-sm-10 p-0 d-flex justify-content-start align-items-center p-0 '
+          }, /*#__PURE__*/React__default["default"].createElement("p", {
+            "class": ' m-0 p-0 wordbreak wordbreak1 ',
+            onClick: function onClick() {
+              routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'categories/' + item.categoryid);
+            }
+          }, langdetect == 'en' ? item.title_en : item.title_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
+            className: 'col-lg-2 col-md-2 col-sm-2 d-flex justify-content-end align-items-center p-0 '
+          }, /*#__PURE__*/React__default["default"].createElement("i", {
+            className: ' p-0 h-100 allcentered '
+          }, langdetect == 'en' ? /*#__PURE__*/React__default["default"].createElement(BsChevronRight.BsChevronRight, {
+            size: sectionproperties.collectionsectioniconfontsize
+          }) : /*#__PURE__*/React__default["default"].createElement(BsChevronLeft.BsChevronLeft, {
+            size: sectionproperties.collectionsectioniconfontsize
+          }))), index != (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i5 = authdetailsContext.instinfo) === null || _authdetailsContext$i5 === void 0 ? void 0 : _authdetailsContext$i5.instcategories) - 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "col-lg-12 p-0 mt-3 mb-3"
+          }, /*#__PURE__*/React__default["default"].createElement("hr", {
+            "class": "m-0"
+          })));
+        })), sectionproperties.fetchparenttype == 'Parent Collections' && (pcollarray === null || pcollarray === void 0 ? void 0 : pcollarray.map(function (item, index) {
+          if (item.isshowntocustomers == 1) {
+            return /*#__PURE__*/React__default["default"].createElement("div", {
+              "class": sectionstyles.parentcollection + ' row ml-0 mr-0 w-100 cursor-pointer ',
+              onMouseEnter: function onMouseEnter() {
+                setshowdownheadermenu(true);
+                setChoosenindex(index);
+              }
+            }, /*#__PURE__*/React__default["default"].createElement("div", {
+              className: ' col-lg-10 col-md-10 col-sm-10 p-0 d-flex justify-content-start align-items-center p-0 '
+            }, /*#__PURE__*/React__default["default"].createElement("p", {
+              "class": ' m-0 p-0 wordbreak wordbreak1 ',
+              onClick: function onClick() {
+                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'parentcollections/' + item.parentcollectionid);
+              }
+            }, langdetect == 'en' ? item.title_en : item.title_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
+              className: 'col-lg-2 col-md-2 col-sm-2 d-flex justify-content-end align-items-center p-0 '
+            }, /*#__PURE__*/React__default["default"].createElement("i", {
+              className: ' p-0 h-100 allcentered '
+            }, langdetect == 'en' ? /*#__PURE__*/React__default["default"].createElement(BsChevronRight.BsChevronRight, {
+              size: sectionproperties.collectionsectioniconfontsize
+            }) : /*#__PURE__*/React__default["default"].createElement(BsChevronLeft.BsChevronLeft, {
+              size: sectionproperties.collectionsectioniconfontsize
+            }))), index != pcollarray - 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+              className: "col-lg-12 p-0 mt-3 mb-3"
+            }, /*#__PURE__*/React__default["default"].createElement("hr", {
+              "class": "m-0"
+            })));
+          }
+        })), sectionproperties.fetchparenttype == 'Collections' && (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i6 = authdetailsContext.instinfo) === null || _authdetailsContext$i6 === void 0 ? void 0 : _authdetailsContext$i6.instcollections.map(function (item, index) {
+          if (item.isshowntocustomers == 1) {
+            return /*#__PURE__*/React__default["default"].createElement("div", {
+              "class": slideshow_styles.parentcollection + ' row ml-0 mr-0 w-100 cursor-pointer ',
+              onMouseEnter: function onMouseEnter() {
+                setshowdownheadermenu(true);
+                setChoosenindex(index);
+              }
+            }, /*#__PURE__*/React__default["default"].createElement("div", {
+              className: ' col-lg-12 col-md-12 col-sm-12 p-0 d-flex justify-content-start align-items-center p-0 '
+            }, /*#__PURE__*/React__default["default"].createElement("p", {
+              "class": ' m-0 p-0 wordbreak wordbreak1 ',
+              onClick: function onClick() {
+                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.collectionid);
+              }
+            }, langdetect == 'en' ? item.title_en : item.title_ar)), index != pcollarray - 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+              className: "col-lg-12 p-0 mt-3 mb-3"
+            }, /*#__PURE__*/React__default["default"].createElement("hr", {
+              "class": "m-0"
+            })));
+          }
+        }))), sectionproperties.fetchparenttype == 'Categories' && Choosenindex.length != 0 && (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i7 = authdetailsContext.instinfo) === null || _authdetailsContext$i7 === void 0 ? void 0 : (_authdetailsContext$i8 = _authdetailsContext$i7.instcategories[Choosenindex]) === null || _authdetailsContext$i8 === void 0 ? void 0 : (_authdetailsContext$i9 = _authdetailsContext$i8.parentcolletions) === null || _authdetailsContext$i9 === void 0 ? void 0 : _authdetailsContext$i9.length) != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": langdetect == 'en' ? 'cat_dropdown-menu cat_dropdown cat_dropdownen' : 'cat_dropdown-menu cat_dropdown cat_dropdownar',
+          style: {
+            minHeight: sectionproperties.height + 'vh'
+          },
+          onMouseLeave: function onMouseLeave() {
+            setChoosenindex('');
+          }
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "row m-0 w-100"
+        }, authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i10 = authdetailsContext.instinfo) === null || _authdetailsContext$i10 === void 0 ? void 0 : (_authdetailsContext$i11 = _authdetailsContext$i10.instcategories[Choosenindex]) === null || _authdetailsContext$i11 === void 0 ? void 0 : (_authdetailsContext$i12 = _authdetailsContext$i11.parentcolletions) === null || _authdetailsContext$i12 === void 0 ? void 0 : _authdetailsContext$i12.map(function (item, index) {
+          var _item$collections;
+          return /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "col-lg-4 p-0"
+          }, /*#__PURE__*/React__default["default"].createElement("p", {
+            "class": sectionstyles.parentcollection + ' m-0 p-0 mb-3 cursor-pointer wordbreak wordbreak2 ',
+            onClick: function onClick() {
+              routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'parentcollections/' + item.parentcollectionid);
+            },
+            style: {
+              textAlign: langdetect == 'en' ? 'left' : 'right'
+            }
+          }, langdetect == 'en' ? item.title_en : item.title_ar), item === null || item === void 0 ? void 0 : (_item$collections = item.collections) === null || _item$collections === void 0 ? void 0 : _item$collections.map(function (item, index) {
+            return /*#__PURE__*/React__default["default"].createElement("div", {
+              "class": "col-lg-12 pl-1 pr-1"
+            }, /*#__PURE__*/React__default["default"].createElement("p", {
+              "class": sectionstyles.collectionName + ' cursor-pointer wordbreak wordbreak2 mb-1 ',
+              onClick: function onClick() {
+                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.collectionid);
+              },
+              style: {
+                textAlign: langdetect == 'en' ? 'left' : 'right'
+              }
+            }, langdetect == 'en' ? item.title_en : item.title_ar));
+          }));
+        }))), sectionproperties.fetchparenttype == 'Parent Collections' && Choosenindex.length != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": langdetect == 'en' ? 'cat_dropdown-menu cat_dropdown cat_dropdownen' : 'cat_dropdown-menu cat_dropdown cat_dropdownar',
+          style: {
+            minHeight: sectionproperties.height + 'vh'
+          },
+          onMouseLeave: function onMouseLeave() {
+            setChoosenindex('');
+          }
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "row m-0 w-100"
+        }, authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i13 = authdetailsContext.instinfo) === null || _authdetailsContext$i13 === void 0 ? void 0 : (_authdetailsContext$i14 = _authdetailsContext$i13.instcategories[0]) === null || _authdetailsContext$i14 === void 0 ? void 0 : (_authdetailsContext$i15 = _authdetailsContext$i14.parentcolletions[Choosenindex]) === null || _authdetailsContext$i15 === void 0 ? void 0 : (_authdetailsContext$i16 = _authdetailsContext$i15.collections) === null || _authdetailsContext$i16 === void 0 ? void 0 : _authdetailsContext$i16.map(function (item, index) {
+          return /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "col-lg-4 p-0",
+            onClick: function onClick() {
+              routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.collectionid);
+            }
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "col-lg-12 pl-1 pr-1"
+          }, /*#__PURE__*/React__default["default"].createElement("p", {
+            "class": sectionstyles.collectionName + ' cursor-pointer wordbreak wordbreak2 mb-1 ',
+            style: {
+              textAlign: langdetect == 'en' ? 'left' : 'right'
+            }
+          }, langdetect == 'en' ? item.title_en : item.title_ar)));
+        }))))));
+      };
+      var BackgroundImagesContent = function BackgroundImagesContent() {
+        var _imagesarray$, _imagesarray$2, _imagesarray$3, _imagesarray$4, _imagesarray$5, _imagesarray$6;
+        return /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "row m-0 w-100 align-items-center justify-content-center",
+          onMouseEnter: function onMouseEnter() {
+            setChoosenindex('');
+          }
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "col-lg-7 col-md-12 col-sm-12 pl-md-1 pl-sm-1 pr-md-1 pr-sm-1 mb-md-3 mb-sm-3 h-100"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": sectionproperties.bgcovercontainresponsive == 'Contain' ? "".concat(sectionstyles.imageBackground) + ' row m-0 w-100 h-md-auto ' : "".concat(sectionstyles.imageBackground) + ' row m-0 w-100 ',
+          style: {
+            height: sectionproperties.image_height + 'px',
+            position: 'relative'
+          }
+        }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
+          urlEndpoint: IKurlEndpoint,
+          publicKey: IKpublicKey,
+          path: imagesarray.length != 0 ? langdetect == 'en' ? '/tr:w-820,h-520/' + ((_imagesarray$ = imagesarray[0]) === null || _imagesarray$ === void 0 ? void 0 : _imagesarray$.bgsection_image) : '/tr:w-820,h-520/' + ((_imagesarray$2 = imagesarray[0]) === null || _imagesarray$2 === void 0 ? void 0 : _imagesarray$2.bgsection_image_ar) : '',
+          "class": sectionproperties.bgcovercontainresponsive == 'Contain' ? 'objectFit-md-contain' : '',
+          style: {
+            height: '100%',
+            width: '100%',
+            objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
+            borderTopLeftRadius: sectionproperties.image_bordertopleftradius + 'px',
+            borderTopRightRadius: sectionproperties.image_bordertoprightradius + 'px',
+            borderBottomLeftRadius: sectionproperties.image_borderBottomLeftRadius + 'px',
+            borderBottomRightRadius: sectionproperties.image_borderBottomRightRadius + 'px'
+          }
+        }))), /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "col-lg-5 p-sm-0"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "row m-0 w-100"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "col-lg-12 col-md-6 col-sm-6 p-0 mb-xl-3 mb-lg-3 pl-md-1 pl-sm-1 pr-md-1 pr-sm-1"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": sectionproperties.bgcovercontainresponsive == 'Contain' ? "".concat(sectionstyles.imageBackground) + ' row m-0 w-100 h-md-auto ' : "".concat(sectionstyles.imageBackground) + ' row m-0 w-100 ',
+          style: {
+            height: parseInt(sectionproperties.image_height / 2 - 5) + 'px',
+            position: 'relative'
+          }
+        }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
+          urlEndpoint: IKurlEndpoint,
+          publicKey: IKpublicKey,
+          path: imagesarray.length != 0 ? langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + ((_imagesarray$3 = imagesarray[1]) === null || _imagesarray$3 === void 0 ? void 0 : _imagesarray$3.bgsection_image) : '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + ((_imagesarray$4 = imagesarray[1]) === null || _imagesarray$4 === void 0 ? void 0 : _imagesarray$4.bgsection_image_ar) : '',
+          "class": sectionproperties.bgcovercontainresponsive == 'Contain' ? 'objectFit-md-contain' : '',
+          style: {
+            height: '100%',
+            width: '100%',
+            objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
+            borderTopLeftRadius: sectionproperties.image_bordertopleftradius + 'px',
+            borderTopRightRadius: sectionproperties.image_bordertoprightradius + 'px',
+            borderBottomLeftRadius: sectionproperties.image_borderBottomLeftRadius + 'px',
+            borderBottomRightRadius: sectionproperties.image_borderBottomRightRadius + 'px'
+          }
+        }))), /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "col-lg-12 col-md-6 col-sm-6 p-0 pl-md-1 pl-sm-1 pr-md-1 pr-sm-1"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": sectionproperties.bgcovercontainresponsive == 'Contain' ? "".concat(sectionstyles.imageBackground) + ' row m-0 w-100 h-md-auto ' : "".concat(sectionstyles.imageBackground) + ' row m-0 w-100 ',
+          style: {
+            height: parseInt(sectionproperties.image_height / 2 - 5) + 'px',
+            position: 'relative'
+          }
+        }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
+          urlEndpoint: IKurlEndpoint,
+          publicKey: IKpublicKey,
+          path: imagesarray.length != 0 ? langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + ((_imagesarray$5 = imagesarray[2]) === null || _imagesarray$5 === void 0 ? void 0 : _imagesarray$5.bgsection_image) : '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + ((_imagesarray$6 = imagesarray[2]) === null || _imagesarray$6 === void 0 ? void 0 : _imagesarray$6.bgsection_image_ar) : '',
+          "class": sectionproperties.bgcovercontainresponsive == 'Contain' ? 'objectFit-md-contain' : '',
+          style: {
+            height: '100%',
+            width: '100%',
+            objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
+            borderTopLeftRadius: sectionproperties.image_bordertopleftradius + 'px',
+            borderTopRightRadius: sectionproperties.image_bordertoprightradius + 'px',
+            borderBottomLeftRadius: sectionproperties.image_borderBottomLeftRadius + 'px',
+            borderBottomRightRadius: sectionproperties.image_borderBottomRightRadius + 'px'
+          }
+        }))))));
+      };
       return /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "row m-0 w-100 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2",
         style: {
@@ -32230,87 +32526,18 @@
           marginBottom: sectionproperties.marginBottom + 'px',
           paddingTop: sectionproperties.paddingTop + 'px',
           paddingBottom: sectionproperties.paddingBottom + 'px',
-          paddingLeft: sectionproperties.paddingLeft + 'px',
-          paddingRight: sectionproperties.paddingRight + 'px'
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-12 p-0"
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "row m-0 w-100 align-items-center justify-content-center",
-        style: {
-          height: sectionproperties.image_height + 'vh'
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-7 col-md-12 col-sm-12 pl-md-1 pl-sm-1 pr-md-1 pr-sm-1 mb-md-3 mb-sm-3 h-100"
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "".concat(sectionstyles.imageBackground) + ' row m-0 w-100 ',
-        style: {
-          height: 400,
-          position: 'relative'
-        }
-      }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
-        urlEndpoint: IKurlEndpoint,
-        publicKey: IKpublicKey,
-        path: imagesarray.length != 0 ? langdetect == 'en' ? (_imagesarray$ = imagesarray[0]) === null || _imagesarray$ === void 0 ? void 0 : _imagesarray$.bgsection_image : (_imagesarray$2 = imagesarray[0]) === null || _imagesarray$2 === void 0 ? void 0 : _imagesarray$2.bgsection_image_ar : '',
-        "class": sectionproperties.bgcovercontainresponsive == 'Contain' ? 'objectFit-md-contain' : '',
-        style: {
-          height: '100%',
-          width: '100%',
-          objectFit: sectionproperties.bgcovercontain,
-          borderTopLeftRadius: sectionproperties.image_bordertopleftradius + 'px',
-          borderTopRightRadius: sectionproperties.image_bordertoprightradius + 'px',
-          borderBottomLeftRadius: sectionproperties.image_borderBottomLeftRadius + 'px',
-          borderBottomRightRadius: sectionproperties.image_borderBottomRightRadius + 'px'
-        }
-      }))), /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-5 p-sm-0"
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "row m-0 w-100"
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-12 col-md-6 col-sm-6 p-0 mb-xl-3 mb-lg-3 pl-md-1 pl-sm-1 pr-md-1 pr-sm-1"
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "".concat(sectionstyles.imageBackground) + ' row m-0 w-100 ',
-        style: {
-          height: '172px',
-          position: 'relative'
-        }
-      }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
-        urlEndpoint: IKurlEndpoint,
-        publicKey: IKpublicKey,
-        path: imagesarray.length != 0 ? langdetect == 'en' ? (_imagesarray$3 = imagesarray[1]) === null || _imagesarray$3 === void 0 ? void 0 : _imagesarray$3.bgsection_image : (_imagesarray$4 = imagesarray[1]) === null || _imagesarray$4 === void 0 ? void 0 : _imagesarray$4.bgsection_image_ar : '',
-        "class": sectionproperties.bgcovercontainresponsive == 'Contain' ? 'objectFit-md-contain' : '',
-        style: {
-          height: '100%',
-          width: '100%',
-          objectFit: sectionproperties.bgcovercontain,
-          borderTopLeftRadius: sectionproperties.image_bordertopleftradius + 'px',
-          borderTopRightRadius: sectionproperties.image_bordertoprightradius + 'px',
-          borderBottomLeftRadius: sectionproperties.image_borderBottomLeftRadius + 'px',
-          borderBottomRightRadius: sectionproperties.image_borderBottomRightRadius + 'px'
-        }
-      }))), /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-12 col-md-6 col-sm-6 p-0 pl-md-1 pl-sm-1 pr-md-1 pr-sm-1"
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "".concat(sectionstyles.imageBackground) + ' row m-0 w-100 ',
-        style: {
-          height: '215px',
-          position: 'relative'
-        }
-      }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
-        urlEndpoint: IKurlEndpoint,
-        publicKey: IKpublicKey,
-        path: imagesarray.length != 0 ? langdetect == 'en' ? (_imagesarray$5 = imagesarray[2]) === null || _imagesarray$5 === void 0 ? void 0 : _imagesarray$5.bgsection_image : (_imagesarray$6 = imagesarray[2]) === null || _imagesarray$6 === void 0 ? void 0 : _imagesarray$6.bgsection_image_ar : '',
-        "class": sectionproperties.bgcovercontainresponsive == 'Contain' ? 'objectFit-md-contain' : '',
-        style: {
-          height: '100%',
-          width: '100%',
-          objectFit: sectionproperties.bgcovercontain,
-          borderTopLeftRadius: sectionproperties.image_bordertopleftradius + 'px',
-          borderTopRightRadius: sectionproperties.image_bordertoprightradius + 'px',
-          borderBottomLeftRadius: sectionproperties.image_borderBottomLeftRadius + 'px',
-          borderBottomRightRadius: sectionproperties.image_borderBottomRightRadius + 'px'
+          paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : sectionproperties.paddingRight + 'px',
+          paddingRight: langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px',
+          background: sectionproperties.backgroundColor
+        },
+        onMouseLeave: function onMouseLeave() {
+          setChoosenindex('');
         }
-      }))))))));
+      }, sectionproperties.collectionssectionshow == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "col-lg-2 d-md-none"
+      }, CategoriesDropdown()), /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": sectionproperties.collectionssectionshow == 'Show' ? 'col-lg-10 p-0' : 'col-lg-12 p-0'
+      }, BackgroundImagesContent()));
     };
 
     function ownKeys$14(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -35910,6 +36137,8 @@
       var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
       props.actions.lang;
       var langdetect = props.actions.langdetect;
+      var authdetailsContext = props.actions.authdetailsContext;
+      var routingcountext = props.actions.routingcountext;
       React.useEffect(function () {
         var secpropobj = {};
         StatePagePropertiesContext.pageobj.sections.forEach(function (sectionitem, sectionindex) {
@@ -35969,6 +36198,51 @@
             backgroundColor: sectionproperties.linebgcolor,
             borderRadius: '6px'
           }
+        }),
+        facebook_btn: glamor.css({
+          cursor: 'pointer',
+          background: sectionproperties.facebkbtnn_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.facebkbtnnbgColor,
+          width: sectionproperties.facebkbtnnWidth + 'px',
+          height: sectionproperties.facebkbtnnHeight + 'px',
+          borderRadius: sectionproperties.facebkbtnn_borderRadius + 'px',
+          color: sectionproperties.facebkbtnnTextcolor,
+          border: sectionproperties.facebkbtnnborderwidth + 'px solid ' + sectionproperties.facebkbtnnbordercolor,
+          transition: '.3s',
+          ':hover': {
+            background: sectionproperties.facebkbtnntransparentbgcoloronhover == 'Transparent' ? 'Transparent' : sectionproperties.facebkbtnnbgColoronhover,
+            color: sectionproperties.facebkbtnnTextcoloronhover,
+            borderColor: sectionproperties.facebkbtnnTextcoloronhover
+          }
+        }),
+        youtube_btn: glamor.css({
+          cursor: 'pointer',
+          background: sectionproperties.youtubebtn_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.youtubebtnbgColor,
+          width: sectionproperties.youtubebtnWidth + 'px',
+          height: sectionproperties.youtubebtnHeight + 'px',
+          borderRadius: sectionproperties.youtubebtn_borderRadius + 'px',
+          color: sectionproperties.youtubebtnTextcolor,
+          border: sectionproperties.youtubebtnborderwidth + 'px solid ' + sectionproperties.youtubebtnbordercolor,
+          transition: '.3s',
+          ':hover': {
+            background: sectionproperties.youtubebtn_transparentbgcoloronhover == 'Transparent' ? 'transparent' : sectionproperties.youtubebtnbgColoronhover,
+            color: sectionproperties.youtubebtnTextcoloronhover,
+            borderColor: sectionproperties.youtubebtnTextcoloronhover
+          }
+        }),
+        instgram_btn: glamor.css({
+          cursor: 'pointer',
+          background: sectionproperties.instgrambtn_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.instgrambtnbgColor,
+          width: sectionproperties.instgrambtnWidth + 'px',
+          height: sectionproperties.instgrambtnHeight + 'px',
+          borderRadius: sectionproperties.instgrambtn_borderRadius + 'px',
+          color: sectionproperties.instgrambtnTextcolor,
+          border: sectionproperties.instgrambtnborderwidth + 'px solid ' + sectionproperties.instgrambtnbordercolor,
+          transition: '.3s',
+          ':hover': {
+            background: sectionproperties.instgrambtn_transparentbgcoloronhover == 'Transparent' ? 'transparent' : sectionproperties.instgrambtnbgColoronhover,
+            color: sectionproperties.instgrambtnTextcoloronhover,
+            borderColor: sectionproperties.instgrambtnTextcoloronhover
+          }
         })
       };
       var SectionTitle = function SectionTitle() {
@@ -36010,7 +36284,10 @@
             fontSize: sectionproperties.sectionTitleFontSizeresp + 'px'
           }
         }, SectionTitle())), /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": "col-lg-12 p-0 d-flex justify-content-md-center"
+          "class": "col-lg-12 p-0 d-flex justify-content-md-center",
+          style: {
+            justifyContent: sectionproperties.text2centered == 'Centered' ? 'center' : 'start'
+          }
         }, /*#__PURE__*/React__default["default"].createElement("p", {
           "class": "pb-0 text-md-center pl-md-2 pr-md-2",
           style: {
@@ -36028,16 +36305,67 @@
           "class": "col-lg-12 p-0"
         }, /*#__PURE__*/React__default["default"].createElement("button", {
           "class": "".concat(section_styles.btn)
-        }, langdetect == 'en' ? sectionproperties.generalbtn_content : sectionproperties.slideshow_btn_text_ar))));
+        }, langdetect == 'en' ? sectionproperties.generalbtn_content : sectionproperties.slideshow_btn_text_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "col-lg-12 p-0 d-flex justify-content-start justify-content-sm-center mb-sm-4 align-items-center"
+        }, sectionproperties.fbbtn_show == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "".concat(section_styles.facebook_btn) + '  d-flex align-items-center justify-content-center ml-3 mr-3 ',
+          onClick: function onClick() {
+            var _authdetailsContext$i;
+            if ((authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i = authdetailsContext.instinfo) === null || _authdetailsContext$i === void 0 ? void 0 : _authdetailsContext$i.facebooklink) != null) {
+              var _authdetailsContext$i2;
+              window.open(authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i2 = authdetailsContext.instinfo) === null || _authdetailsContext$i2 === void 0 ? void 0 : _authdetailsContext$i2.facebooklink, '_blank');
+            }
+          }
+        }, /*#__PURE__*/React__default["default"].createElement(FaFacebookF.FaFacebookF, {
+          size: sectionproperties.facebkbtnniconfontsize
+        })), sectionproperties.instbtn_show == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "".concat(section_styles.instgram_btn) + '  d-flex align-items-center justify-content-center ml-3 mr-3 ',
+          onClick: function onClick() {
+            var _authdetailsContext$i3;
+            if ((authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i3 = authdetailsContext.instinfo) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.instagramlink) != null) {
+              var _authdetailsContext$i4;
+              window.open(authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i4 = authdetailsContext.instinfo) === null || _authdetailsContext$i4 === void 0 ? void 0 : _authdetailsContext$i4.instagramlink, '_blank');
+            }
+          }
+        }, /*#__PURE__*/React__default["default"].createElement(AiFillInstagram.AiFillInstagram, {
+          size: sectionproperties.instgrambtniconfontsize
+        })), sectionproperties.youtbtn_show == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "".concat(section_styles.youtube_btn) + '  d-flex align-items-center justify-content-center ml-3 mr-3 ',
+          onClick: function onClick() {
+            var _authdetailsContext$i5;
+            if ((authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i5 = authdetailsContext.instinfo) === null || _authdetailsContext$i5 === void 0 ? void 0 : _authdetailsContext$i5.whatsappnumber) != null) {
+              var _authdetailsContext$i6;
+              window.open('https://api.whatsapp.com/send?phone=' + (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i6 = authdetailsContext.instinfo) === null || _authdetailsContext$i6 === void 0 ? void 0 : _authdetailsContext$i6.whatsappnumber), '_blank');
+            }
+          }
+        }, /*#__PURE__*/React__default["default"].createElement(FaWhatsapp.FaWhatsapp, {
+          size: sectionproperties.youtubebtniconfontsize
+        })))));
       };
       var Image = function Image() {
-        var _imagesarray$, _imagesarray$2;
+        var _imagesarray$, _imagesarray$7, _imagesarray$8;
         return /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": sectionproperties.image_height == 0 ? 'col-lg-6 col-md-12 d-flex justify-content-start justify-content-md-center h-auto p-0' : 'col-lg-6 col-md-12 d-flex justify-content-start justify-content-md-center p-0'
+          "class": sectionproperties.image_height == 0 ? 'col-lg-6 col-md-12 d-flex justify-content-start justify-content-md-center h-auto p-0' : 'col-lg-6 col-md-12 d-flex justify-content-start justify-content-md-center p-0',
+          style: {
+            cursor: ((_imagesarray$ = imagesarray[0]) === null || _imagesarray$ === void 0 ? void 0 : _imagesarray$.IsClickable) == 'Yes' ? 'pointer' : 'default'
+          },
+          onClick: function onClick() {
+            var _imagesarray$2;
+            if (((_imagesarray$2 = imagesarray[0]) === null || _imagesarray$2 === void 0 ? void 0 : _imagesarray$2.IsClickable) == 'Yes') {
+              var _imagesarray$3, _imagesarray$4;
+              if ((_imagesarray$3 = imagesarray[0]) !== null && _imagesarray$3 !== void 0 && _imagesarray$3.clickable_page_route && ((_imagesarray$4 = imagesarray[0]) === null || _imagesarray$4 === void 0 ? void 0 : _imagesarray$4.clickable_page_route.length) != 0) {
+                var _imagesarray$5;
+                routingcountext((_imagesarray$5 = imagesarray[0]) === null || _imagesarray$5 === void 0 ? void 0 : _imagesarray$5.clickable_page_route, false, '');
+              } else {
+                var _imagesarray$6;
+                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + ((_imagesarray$6 = imagesarray[0]) === null || _imagesarray$6 === void 0 ? void 0 : _imagesarray$6.Clickable_Reference_Collection_ID));
+              }
+            }
+          }
         }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
           urlEndpoint: IKurlEndpoint,
           publicKey: IKpublicKey,
-          path: imagesarray.length != 0 ? langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w + '/' + ((_imagesarray$ = imagesarray[0]) === null || _imagesarray$ === void 0 ? void 0 : _imagesarray$.bgsection_image) : '/tr:w-' + sectionproperties.imagetr_w + '/' + ((_imagesarray$2 = imagesarray[0]) === null || _imagesarray$2 === void 0 ? void 0 : _imagesarray$2.bgsection_image_ar) : '',
+          path: imagesarray.length != 0 ? langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w + '/' + ((_imagesarray$7 = imagesarray[0]) === null || _imagesarray$7 === void 0 ? void 0 : _imagesarray$7.bgsection_image) : '/tr:w-' + sectionproperties.imagetr_w + '/' + ((_imagesarray$8 = imagesarray[0]) === null || _imagesarray$8 === void 0 ? void 0 : _imagesarray$8.bgsection_image_ar) : '',
           style: {
             width: '100%',
             height: sectionproperties.image_height == 0 ? 'auto' : sectionproperties.image_height + 'px',
@@ -37462,6 +37790,20 @@
         Choosenindex = _useState10[0],
         setChoosenindex = _useState10[1];
       var authdetailsContext = props.actions.authdetailsContext;
+      var _useState11 = React.useState([]),
+        _useState12 = _slicedToArray__default["default"](_useState11, 2),
+        pcollarray = _useState12[0],
+        setpcollarray = _useState12[1];
+      React.useEffect(function () {
+        var _authdetailsContext$i;
+        var temppcollarray = _toConsumableArray__default["default"](pcollarray);
+        authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i = authdetailsContext.instinfo) === null || _authdetailsContext$i === void 0 ? void 0 : _authdetailsContext$i.instcategories.forEach(function (arrayItem) {
+          arrayItem === null || arrayItem === void 0 ? void 0 : arrayItem.parentcolletions.forEach(function (item) {
+            temppcollarray.push(item);
+          });
+        });
+        setpcollarray(_toConsumableArray__default["default"](temppcollarray));
+      }, []);
       React.useEffect(function () {
         var secpropobj = {};
         StatePagePropertiesContext.pageobj.sections.forEach(function (sectionitem, sectionindex) {
@@ -37616,7 +37958,7 @@
         }))));
       };
       var SlideshowContent = function SlideshowContent() {
-        var _authdetailsContext$i, _authdetailsContext$i2, _authdetailsContext$i4, _authdetailsContext$i5, _authdetailsContext$i6, _authdetailsContext$i7, _authdetailsContext$i8, _authdetailsContext$i9;
+        var _authdetailsContext$i2, _authdetailsContext$i3, _authdetailsContext$i5, _authdetailsContext$i6, _authdetailsContext$i7, _authdetailsContext$i8, _authdetailsContext$i9, _authdetailsContext$i10, _authdetailsContext$i11, _authdetailsContext$i12, _authdetailsContext$i13, _authdetailsContext$i14, _authdetailsContext$i15;
         return /*#__PURE__*/React__default["default"].createElement("div", {
           "class": "col-lg-12 p-0"
         }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -37643,8 +37985,8 @@
             height: sectionproperties.height + 'vh',
             overflowY: 'scroll'
           }
-        }, authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i = authdetailsContext.instinfo) === null || _authdetailsContext$i === void 0 ? void 0 : (_authdetailsContext$i2 = _authdetailsContext$i.instcategories) === null || _authdetailsContext$i2 === void 0 ? void 0 : _authdetailsContext$i2.map(function (item, index) {
-          var _authdetailsContext$i3;
+        }, sectionproperties.fetchparenttype == 'Categories' && (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i2 = authdetailsContext.instinfo) === null || _authdetailsContext$i2 === void 0 ? void 0 : (_authdetailsContext$i3 = _authdetailsContext$i2.instcategories) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.map(function (item, index) {
+          var _authdetailsContext$i4;
           return /*#__PURE__*/React__default["default"].createElement("div", {
             "class": slideshow_styles.categoryname + ' row ml-0 mr-0 w-100 cursor-pointer ',
             onMouseEnter: function onMouseEnter() {
@@ -37666,12 +38008,62 @@
             size: sectionproperties.collectionsectioniconfontsize
           }) : /*#__PURE__*/React__default["default"].createElement(BsChevronLeft.BsChevronLeft, {
             size: sectionproperties.collectionsectioniconfontsize
-          }))), index != (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i3 = authdetailsContext.instinfo) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.instcategories) - 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+          }))), index != (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i4 = authdetailsContext.instinfo) === null || _authdetailsContext$i4 === void 0 ? void 0 : _authdetailsContext$i4.instcategories) - 1 && /*#__PURE__*/React__default["default"].createElement("div", {
             className: "col-lg-12 p-0 mt-3 mb-3"
           }, /*#__PURE__*/React__default["default"].createElement("hr", {
             "class": "m-0"
           })));
-        })), Choosenindex.length != 0 && (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i4 = authdetailsContext.instinfo) === null || _authdetailsContext$i4 === void 0 ? void 0 : (_authdetailsContext$i5 = _authdetailsContext$i4.instcategories[Choosenindex]) === null || _authdetailsContext$i5 === void 0 ? void 0 : (_authdetailsContext$i6 = _authdetailsContext$i5.parentcolletions) === null || _authdetailsContext$i6 === void 0 ? void 0 : _authdetailsContext$i6.length) != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
+        })), sectionproperties.fetchparenttype == 'Parent Collections' && (pcollarray === null || pcollarray === void 0 ? void 0 : pcollarray.map(function (item, index) {
+          if (item.isshowntocustomers == 1) {
+            return /*#__PURE__*/React__default["default"].createElement("div", {
+              "class": slideshow_styles.parentcollection + ' row ml-0 mr-0 w-100 cursor-pointer ',
+              onMouseEnter: function onMouseEnter() {
+                setshowdownheadermenu(true);
+                setChoosenindex(index);
+              }
+            }, /*#__PURE__*/React__default["default"].createElement("div", {
+              className: ' col-lg-10 col-md-10 col-sm-10 p-0 d-flex justify-content-start align-items-center p-0 '
+            }, /*#__PURE__*/React__default["default"].createElement("p", {
+              "class": ' m-0 p-0 wordbreak wordbreak1 ',
+              onClick: function onClick() {
+                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'parentcollections/' + item.parentcollectionid);
+              }
+            }, langdetect == 'en' ? item.title_en : item.title_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
+              className: 'col-lg-2 col-md-2 col-sm-2 d-flex justify-content-end align-items-center p-0 '
+            }, /*#__PURE__*/React__default["default"].createElement("i", {
+              className: ' p-0 h-100 allcentered '
+            }, langdetect == 'en' ? /*#__PURE__*/React__default["default"].createElement(BsChevronRight.BsChevronRight, {
+              size: sectionproperties.collectionsectioniconfontsize
+            }) : /*#__PURE__*/React__default["default"].createElement(BsChevronLeft.BsChevronLeft, {
+              size: sectionproperties.collectionsectioniconfontsize
+            }))), index != pcollarray - 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+              className: "col-lg-12 p-0 mt-3 mb-3"
+            }, /*#__PURE__*/React__default["default"].createElement("hr", {
+              "class": "m-0"
+            })));
+          }
+        })), sectionproperties.fetchparenttype == 'Collections' && (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i5 = authdetailsContext.instinfo) === null || _authdetailsContext$i5 === void 0 ? void 0 : _authdetailsContext$i5.instcollections.map(function (item, index) {
+          if (item.isshowntocustomers == 1) {
+            return /*#__PURE__*/React__default["default"].createElement("div", {
+              "class": slideshow_styles.parentcollection + ' row ml-0 mr-0 w-100 cursor-pointer ',
+              onMouseEnter: function onMouseEnter() {
+                setshowdownheadermenu(true);
+                setChoosenindex(index);
+              }
+            }, /*#__PURE__*/React__default["default"].createElement("div", {
+              className: ' col-lg-12 col-md-12 col-sm-12 p-0 d-flex justify-content-start align-items-center p-0 '
+            }, /*#__PURE__*/React__default["default"].createElement("p", {
+              "class": ' m-0 p-0 wordbreak wordbreak1 ',
+              onClick: function onClick() {
+                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.collectionid);
+              }
+            }, langdetect == 'en' ? item.title_en : item.title_ar)), index != pcollarray - 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+              className: "col-lg-12 p-0 mt-3 mb-3"
+            }, /*#__PURE__*/React__default["default"].createElement("hr", {
+              "class": "m-0"
+            })));
+          }
+        }))), sectionproperties.fetchparenttype == 'Categories' && Choosenindex.length != 0 && (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i6 = authdetailsContext.instinfo) === null || _authdetailsContext$i6 === void 0 ? void 0 : (_authdetailsContext$i7 = _authdetailsContext$i6.instcategories[Choosenindex]) === null || _authdetailsContext$i7 === void 0 ? void 0 : (_authdetailsContext$i8 = _authdetailsContext$i7.parentcolletions) === null || _authdetailsContext$i8 === void 0 ? void 0 : _authdetailsContext$i8.length) != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
           "class": langdetect == 'en' ? 'cat_dropdown-menu cat_dropdown cat_dropdownen' : 'cat_dropdown-menu cat_dropdown cat_dropdownar',
           style: {
             minHeight: sectionproperties.height + 'vh'
@@ -37681,7 +38073,7 @@
           }
         }, /*#__PURE__*/React__default["default"].createElement("div", {
           "class": "row m-0 w-100"
-        }, authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i7 = authdetailsContext.instinfo) === null || _authdetailsContext$i7 === void 0 ? void 0 : (_authdetailsContext$i8 = _authdetailsContext$i7.instcategories[Choosenindex]) === null || _authdetailsContext$i8 === void 0 ? void 0 : (_authdetailsContext$i9 = _authdetailsContext$i8.parentcolletions) === null || _authdetailsContext$i9 === void 0 ? void 0 : _authdetailsContext$i9.map(function (item, index) {
+        }, authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i9 = authdetailsContext.instinfo) === null || _authdetailsContext$i9 === void 0 ? void 0 : (_authdetailsContext$i10 = _authdetailsContext$i9.instcategories[Choosenindex]) === null || _authdetailsContext$i10 === void 0 ? void 0 : (_authdetailsContext$i11 = _authdetailsContext$i10.parentcolletions) === null || _authdetailsContext$i11 === void 0 ? void 0 : _authdetailsContext$i11.map(function (item, index) {
           var _item$collections;
           return /*#__PURE__*/React__default["default"].createElement("div", {
             "class": "col-lg-4 p-0"
@@ -37706,6 +38098,30 @@
               }
             }, langdetect == 'en' ? item.title_en : item.title_ar));
           }));
+        }))), sectionproperties.fetchparenttype == 'Parent Collections' && Choosenindex.length != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": langdetect == 'en' ? 'cat_dropdown-menu cat_dropdown cat_dropdownen' : 'cat_dropdown-menu cat_dropdown cat_dropdownar',
+          style: {
+            minHeight: sectionproperties.height + 'vh'
+          },
+          onMouseLeave: function onMouseLeave() {
+            setChoosenindex('');
+          }
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "row m-0 w-100"
+        }, authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i12 = authdetailsContext.instinfo) === null || _authdetailsContext$i12 === void 0 ? void 0 : (_authdetailsContext$i13 = _authdetailsContext$i12.instcategories[0]) === null || _authdetailsContext$i13 === void 0 ? void 0 : (_authdetailsContext$i14 = _authdetailsContext$i13.parentcolletions[Choosenindex]) === null || _authdetailsContext$i14 === void 0 ? void 0 : (_authdetailsContext$i15 = _authdetailsContext$i14.collections) === null || _authdetailsContext$i15 === void 0 ? void 0 : _authdetailsContext$i15.map(function (item, index) {
+          return /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "col-lg-4 p-0",
+            onClick: function onClick() {
+              routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.collectionid);
+            }
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "col-lg-12 pl-1 pr-1"
+          }, /*#__PURE__*/React__default["default"].createElement("p", {
+            "class": slideshow_styles.collectionName + ' cursor-pointer wordbreak wordbreak2 mb-1 ',
+            style: {
+              textAlign: langdetect == 'en' ? 'left' : 'right'
+            }
+          }, langdetect == 'en' ? item.title_en : item.title_ar)));
         }))))))), /*#__PURE__*/React__default["default"].createElement("div", {
           "class": sectionproperties.collectionssectionshow == 'Show' ? 'col-lg-10 col-md-12 col-sm-12 p-0 d-flex justify-content-center h-sm-auto' : 'col-lg-12 p-0 d-flex justify-content-center h-sm-auto',
           style: {
@@ -38018,12 +38434,12 @@
           background: sectionproperties.backgroundColor
         }
       }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": cardarrayofobjs.length != 0 ? 'col-lg-12 p-0 d-flex d-sm-none justify-content-center h-md-auto h-sm-auto' : 'col-lg-12 p-0 d-flex d-sm-none justify-content-center h-md-auto h-sm-auto',
+        "class": cardarrayofobjs.length != 0 ? 'col-lg-12 p-0 d-flex justify-content-center' : 'col-lg-12 p-0 d-flex justify-content-center h-md-auto h-sm-auto',
         style: {
           height: sectionproperties.bgcovercontain == 'Cover' ? sectionproperties.height + 'vh' : 'auto'
         }
       }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "h-md-auto h-sm-auto",
+        "class": cardarrayofobjs.length != 0 ? '' : 'h-md-auto h-sm-auto',
         style: {
           position: 'relative',
           borderTopLeftRadius: sectionproperties.borderTopLeftRadius + 'px',
@@ -38043,7 +38459,7 @@
         easing: "ease"
       }), Object.keys(bgimagearrayofobjs).length != 0 && bgimagearrayofobjs.map(function (item, index) {
         return /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": "row m-0 w-100 h-md-auto h-sm-auto",
+          "class": cardarrayofobjs.length != 0 ? 'row m-0 w-100' : 'row m-0 w-100 h-md-auto h-sm-auto',
           style: {
             borderTopLeftRadius: sectionproperties.borderTopLeftRadius + 'px',
             borderTopRightRadius: sectionproperties.borderTopRightRadius + 'px',
@@ -38052,43 +38468,7 @@
             height: sectionproperties.bgcovercontain == 'Cover' ? sectionproperties.height + 'vh' : 'auto'
           }
         }, /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": slideshow_styles.slideshow_styles + ' p-0 align-items-center d-flex d-sm-none h-md-auto h-sm-auto ',
-          key: index,
-          style: {
-            cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
-            width: '100%',
-            height: '100%',
-            borderTopLeftRadius: sectionproperties.borderTopLeftRadius + 'px',
-            borderTopRightRadius: sectionproperties.borderTopRightRadius + 'px',
-            borderBottomRightRadius: sectionproperties.borderBottomRightRadius + 'px',
-            borderBottomLeftRadius: sectionproperties.borderBottomLeftRadius + 'px',
-            paddingTop: sectionproperties.paddingTop + 'px',
-            paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : '',
-            paddingRight: langdetect == 'en' ? '' : sectionproperties.paddingLeft + 'px'
-          },
-          onClick: function onClick() {
-            if (item.IsClickableimg == 'Yes') {
-              if (item.clickableimg_page_route && item.clickableimg_page_route.length != 0) {
-                routingcountext(item.clickableimg_page_route, false, '');
-              } else {
-                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.Clickableimg_getcoection);
-              }
-            }
-          }
-        }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
-          urlEndpoint: IKurlEndpoint,
-          publicKey: IKpublicKey,
-          path: langdetect == 'en' ? item.imageen : item.imagear,
-          style: {
-            cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
-            objectFit: sectionproperties.bgcovercontain,
-            margin: 0,
-            padding: 0,
-            width: '100%',
-            height: '100%'
-          }
-        }), SlideShowTextContainer(item)), /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": slideshow_styles.beforebg + ' p-0 align-items-center d-none d-sm-flex ',
+          "class": slideshow_styles.slideshow_styles + ' p-0 align-items-center d-flex d-md-none ',
           key: index,
           style: {
             cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
@@ -38114,80 +38494,17 @@
         }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
           urlEndpoint: IKurlEndpoint,
           publicKey: IKpublicKey,
-          path: langdetect == 'en' ? item.image_resp_en : item.image_resp_ar,
+          path: langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.imageen : '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.imagear,
           style: {
             cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
-            objectFit: 'contain',
+            objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
             margin: 0,
             padding: 0,
             width: '100%',
             height: '100%'
           }
-        }), SlideShowTextContainer(item)));
-      })), cardarrayofobjs.length != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          position: 'absolute',
-          left: 0,
-          bottom: 60,
-          zIndex: 100
-        },
-        "class": "row m-0 w-100 "
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": ' col-xl-12 p-0 col-lg-12 col-md-12 col-sm-12 w-100'
-      }, /*#__PURE__*/React__default["default"].createElement(reactHorizontalScrollingMenu.ScrollMenu, {
-        itemClassName: "slideshowCard"
-        // LeftArrow={LeftArrow}
-        // RightArrow={RightArrow}
-        ,
-        transitionDuration: 500,
-        transitionEase: easingFunctions['linear'],
-        scrollContainerClassName: 'scrollmenuclasssubscrollbar'
-      }, Object.keys(cardarrayofobjs).length != 0 && cardarrayofobjs.map(function (cardItem, cardIndex) {
-        var id = cardIndex;
-        return /*#__PURE__*/React__default["default"].createElement(CardsArrayOfObjects, {
-          title: id,
-          itemId: id,
-          key: id,
-          cardItem: cardItem,
-          sectionproperties: sectionproperties,
-          props: props
-        });
-      })))))), /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": cardarrayofobjs.length != 0 ? 'col-lg-12 p-0 d-none d-sm-flex justify-content-center h-md-auto h-sm-auto' : 'col-lg-12 p-0 d-none d-sm-flex justify-content-center h-md-auto h-sm-auto',
-        style: {
-          height: sectionproperties.height + 'vh'
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "h-md-auto h-sm-auto",
-        style: {
-          position: 'relative',
-          borderTopLeftRadius: sectionproperties.borderTopLeftRadius + 'px',
-          borderTopRightRadius: sectionproperties.borderTopRightRadius + 'px',
-          borderBottomRightRadius: sectionproperties.borderBottomRightRadius + 'px',
-          borderBottomLeftRadius: sectionproperties.borderBottomLeftRadius + 'px',
-          width: sectionproperties.width + 'vw',
-          marginBottom: sectionproperties.marginBottom + 'px',
-          marginTop: sectionproperties.marginTop + 'px',
-          height: sectionproperties.height + 'vh',
-          overflow: 'hidden'
-        }
-      }, /*#__PURE__*/React__default["default"].createElement(reactSlideshowImage.Zoom, _extends__default["default"]({}, Slideshowsettings, {
-        transitionDuration: 1500,
-        duration: 1500,
-        arrow: true,
-        easing: "ease"
-      }), Object.keys(bgimagearrayofobjs).length != 0 && bgimagearrayofobjs.map(function (item, index) {
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": "row m-0 w-100 h-md-auto h-sm-auto",
-          style: {
-            borderTopLeftRadius: sectionproperties.borderTopLeftRadius + 'px',
-            borderTopRightRadius: sectionproperties.borderTopRightRadius + 'px',
-            borderBottomRightRadius: sectionproperties.borderBottomRightRadius + 'px',
-            borderBottomLeftRadius: sectionproperties.borderBottomLeftRadius + 'px',
-            height: sectionproperties.height + 'vh'
-          }
-        }, /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": 'beforebg p-0 align-items-center d-none d-sm-flex ',
+        }), SlideShowTextContainer(item)), /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": slideshow_styles.beforebg + ' p-0 align-items-center d-none d-md-flex ',
           key: index,
           style: {
             cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
@@ -38213,10 +38530,10 @@
         }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
           urlEndpoint: IKurlEndpoint,
           publicKey: IKpublicKey,
-          path: langdetect == 'en' ? item.image_resp_en : item.image_resp_ar,
+          path: langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w_resp + ',h-' + sectionproperties.imagetr_h_resp + '/' + item.image_resp_en : '/tr:w-' + sectionproperties.imagetr_w_resp + ',h-' + sectionproperties.imagetr_h_resp + '/' + item.image_resp_ar,
           style: {
             cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
-            objectFit: 'contain',
+            objectFit: sectionproperties.bgcovercontainresponsive == 'Cover' ? 'cover' : 'contain',
             margin: 0,
             padding: 0,
             width: '100%',
@@ -39410,7 +39727,16 @@
       var StaticPagesLinksContext = props.actions.StaticPagesLinksContext;
       props.actions.lang;
       var langdetect = props.actions.langdetect;
+      var setShowProductInfoModalContext = props.actions.setShowProductInfoModalContext;
+      var setProductIdProdutInfoModalContext = props.actions.setProductIdProdutInfoModalContext;
       var routingcountext = props.actions.routingcountext;
+      var _useState5 = React.useState(false),
+        _useState6 = _slicedToArray__default["default"](_useState5, 2),
+        showquantity = _useState6[0],
+        setshowquantity = _useState6[1];
+      var AddtoCartMutationContext = props.actions.AddtoCartMutationContext;
+      var AddtoCartContext = props.actions.AddtoCartContext;
+      var NotificationManager = props.actions.NotificationManager;
 
       // Sectionproperties
       React.useEffect(function () {
@@ -39424,6 +39750,13 @@
         });
         setsectionproperties(_objectSpread$B({}, secpropobj));
       }, [StatePagePropertiesContext]);
+      React.useEffect(function () {
+        if (item.quantity == 0) {
+          setshowquantity(false);
+        } else {
+          setshowquantity(true);
+        }
+      }, [props.cardinfoitemprops]);
 
       // Card Information
       React.useEffect(function () {
@@ -39431,6 +39764,51 @@
           setitem(props.cardinfoitemprops);
         }
       }, [props.cardinfoitemprops]);
+      var addtocartfunc = function addtocartfunc(type, quantity) {
+        var addtocardpayloadobj = {
+          functype: 'add',
+          productid: item.productid,
+          variantid: '',
+          quantity: quantity
+        };
+        var runfunc = false;
+        if (addtocardpayloadobj.productid.length != 0 && addtocardpayloadobj.quantity > 0) {
+          if (item.hasvariants == 1) {
+            if (addtocardpayloadobj.variantid.length != 0) {
+              runfunc = true;
+            } else {
+              NotificationManager.warning('', langdetect == 'en' ? 'Please Choose Product Options' : 'من فضلك اختر متغير');
+            }
+          } else {
+            runfunc = true;
+          }
+        } else {
+          NotificationManager.warning('', langdetect == 'en' ? 'Please Choose Quantity' : 'من فضلك اختر الكمية');
+        }
+        if (runfunc == true) {
+          AddtoCartContext(addtocardpayloadobj);
+        }
+      };
+      var addtocartbuttonrender = function addtocartbuttonrender() {
+        if (AddtoCartMutationContext.isLoading) {
+          var _AddtoCartMutationCon;
+          if ((AddtoCartMutationContext === null || AddtoCartMutationContext === void 0 ? void 0 : (_AddtoCartMutationCon = AddtoCartMutationContext.variables) === null || _AddtoCartMutationCon === void 0 ? void 0 : _AddtoCartMutationCon.productid) == item.productid) {
+            return /*#__PURE__*/React__default["default"].createElement("div", {
+              "class": ' d-flex align-items-center justify-content-center '
+            }, /*#__PURE__*/React__default["default"].createElement(reactCssfxLoading.CircularProgress, {
+              color: sectionproperties.quantitybtn_textcolor,
+              width: "20px",
+              height: "20px",
+              duration: "1s"
+            }));
+          } else {
+            return item.quantity;
+          }
+        }
+        if (!AddtoCartMutationContext.isLoading) {
+          return item.quantity;
+        }
+      };
 
       // Styles
       var card_cssstyles = {
@@ -39463,19 +39841,6 @@
           paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : sectionproperties.paddingRight + 'px',
           paddingRight: langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px'
         }),
-        button_styles: glamor.css({
-          width: sectionproperties.generalbtn_width + 'px',
-          height: sectionproperties.generalbtn_height + 'px',
-          border: sectionproperties.generalbtn_borderwidth + 'px solid' + sectionproperties.generalbtn_bordercolor,
-          borderRadius: sectionproperties.generalbtn_bordertopleftradius + 'px',
-          backgroundColor: sectionproperties.generalbtn_bgColortransparent == 'Transparent' ? 'transparent' : sectionproperties.generalbtn_bgColor,
-          color: sectionproperties.generalbtn_textColor,
-          ':hover': {
-            backgroundColor: sectionproperties.generalbtn_bgColortransparentonhover == 'Transparent' ? 'transparent' : sectionproperties.generalbtn_bgColoronhover,
-            color: sectionproperties.generalbtn_textColoronhover,
-            transition: '.3s'
-          }
-        }),
         cart_btn: glamor.css({
           width: sectionproperties.cartBtnWidth + 'px',
           height: sectionproperties.cartBtnHeight + 'px',
@@ -39492,6 +39857,86 @@
             color: sectionproperties.cartBtnTextcoloronhover
           }
         }),
+        button_styles: glamor.css({
+          width: sectionproperties.generalbtn_width + 'px',
+          height: sectionproperties.generalbtn_height + 'px',
+          border: sectionproperties.generalbtn_borderwidth + 'px solid' + sectionproperties.generalbtn_bordercolor,
+          borderRadius: sectionproperties.generalbtn_bordertopleftradius + 'px',
+          backgroundColor: sectionproperties.generalbtn_bgColortransparent == 'Transparent' ? 'transparent' : sectionproperties.generalbtn_bgColor,
+          ':hover': {
+            backgroundColor: sectionproperties.generalbtn_bgColortransparentonhover == 'Transparent' ? 'transparent' : sectionproperties.generalbtn_bgColoronhover,
+            color: sectionproperties.generalbtn_textColoronhover,
+            transition: '.3s'
+          }
+        }),
+        quantitybtn: glamor.css({
+          height: sectionproperties.quantitybtn_height + 'px',
+          width: sectionproperties.quantitybtn_width + 'px',
+          display: 'flex',
+          flexDirection: 'row',
+          overflow: 'hidden',
+          borderRadius: sectionproperties.quantitybtn_borderradius + 'px',
+          background: sectionproperties.quantitybtn_bgcolor,
+          alignItems: 'center',
+          justifyContent: 'center',
+          margin: 0,
+          position: 'relative',
+          fontWeight: sectionproperties.quantitybtn_textfontweight,
+          color: sectionproperties.quantitybtn_textcolor,
+          fontSize: sectionproperties.quantitybtn_textfontsize + 'px',
+          border: sectionproperties.quantitybtnborderwidth + 'px solid ' + sectionproperties.quantitybtnbordercolor
+        }),
+        quantitybtn_text: glamor.css({
+          margin: 'auto'
+        }),
+        add_quantitybtn_icon_container: glamor.css({
+          position: 'relative',
+          width: sectionproperties.add_quantitybtn_width + 'px',
+          height: sectionproperties.add_quantitybtn_height + 'px',
+          background: sectionproperties.add_quantitybtn_bgcolor,
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          borderTopLeftRadius: langdetect == 'en' ? sectionproperties.add_quantitybtn_leftborderradius + 'px' : sectionproperties.add_quantitybtn_rightborderradius + 'px',
+          borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.add_quantitybtn_leftborderradius + 'px' : sectionproperties.add_quantitybtn_rightborderradius + 'px',
+          borderTopRightRadius: langdetect == 'en' ? sectionproperties.add_quantitybtn_rightborderradius + 'px' : sectionproperties.add_quantitybtn_leftborderradius + 'px',
+          borderBottomRightRadius: langdetect == 'en' ? sectionproperties.add_quantitybtn_rightborderradius + 'px' : sectionproperties.add_quantitybtn_leftborderradius + 'px',
+          fontSize: sectionproperties.add_quantitybtn_textfontsize + 'px',
+          color: sectionproperties.add_quantitybtn_textcolor,
+          transition: '.3s',
+          ':hover': {
+            color: sectionproperties.add_quantitybtn_textcoloronhover,
+            background: sectionproperties.add_quantitybtn_bgcoloronhover
+          },
+          ':hover .addbtn': {
+            color: sectionproperties.add_quantitybtn_textcoloronhover,
+            transition: '.3s'
+          }
+        }),
+        minus_quantitybtn_icon_container: glamor.css({
+          position: 'relative',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          width: sectionproperties.remove_quantitybtn_width + 'px',
+          height: sectionproperties.remove_quantitybtn_height + 'px',
+          background: sectionproperties.remove_quantitybtn_bgcolor,
+          fontSize: sectionproperties.remove_quantitybtn_textfontsize + 'px',
+          color: sectionproperties.remove_quantitybtn_textcolor,
+          borderTopLeftRadius: langdetect == 'en' ? sectionproperties.remove_quantitybtn_leftborderradius + 'px' : sectionproperties.remove_quantitybtn_rightborderradius + 'px',
+          borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.remove_quantitybtn_leftborderradius + 'px' : sectionproperties.remove_quantitybtn_rightborderradius + 'px',
+          borderTopRightRadius: langdetect == 'en' ? sectionproperties.remove_quantitybtn_rightborderradius + 'px' : sectionproperties.remove_quantitybtn_leftborderradius + 'px',
+          borderBottomRightRadius: langdetect == 'en' ? sectionproperties.remove_quantitybtn_rightborderradius + 'px' : sectionproperties.remove_quantitybtn_leftborderradius + 'px',
+          transition: '.3s',
+          ':hover': {
+            color: sectionproperties.remove_quantitybtn_textcoloronhover,
+            background: sectionproperties.remove_quantitybtn_bgcoloronhover
+          },
+          ':hover .minusbtn': {
+            transition: '.3s',
+            color: sectionproperties.remove_quantitybtn_textcoloronhover
+          }
+        }),
         wishlist_btn: glamor.css({
           width: sectionproperties.favBtnWidth + 'px',
           height: sectionproperties.favBtnHeight + 'px',
@@ -39528,9 +39973,18 @@
         })
       };
       return /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": card_cssstyles.productcard + ' row m-0 w-100 '
+        "class": card_cssstyles.productcard + ' row ml-0 mr-0 w-100 '
       }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-12 p-0 h-100"
+        "class": "col-lg-12 pl-0 pr-0 h-100",
+        style: {
+          paddingTop: sectionproperties.paddingTop + 'px',
+          paddingBottom: sectionproperties.paddingBottom + 'px',
+          backgroundColor: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
+          borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.borderBottomLeftRadius + 'px' : sectionproperties.borderBottomRightRadius + 'px',
+          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'
+        }
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "row mt-0 ml-0 mr-0 w-100 align-items-center justify-content-center",
         style: {
@@ -39538,21 +39992,21 @@
           height: sectionproperties.image_height + 'px',
           marginBottom: sectionproperties.image_mb + 'px',
           paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : sectionproperties.paddingRight + 'px',
-          paddingRight: langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px',
-          borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px',
-          borderBottomRightRadius: langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px',
-          borderTopLeftRadius: langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px',
-          borderTopRightRadius: langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px',
-          backgroundColor: sectionproperties.image_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.image_bgcolor
+          paddingRight: langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px'
         }
       }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
         urlEndpoint: IKurlEndpoint,
         publicKey: IKpublicKey,
-        path: '/tr:w-350,h-300/' + item.image,
+        path: '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.image,
         style: {
           width: '100%',
           height: '100%',
-          objectFit: 'contain'
+          objectFit: sectionproperties.bgcovercontain == 'Contain' ? 'contain' : 'cover',
+          background: sectionproperties.image_bgtransparent == 'Transparent' ? 'Transparent' : sectionproperties.image_bgcolor,
+          borderTopLeftRadius: langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px',
+          borderTopRightRadius: langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px',
+          borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px',
+          borderBottomRightRadius: langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px'
         },
         loading: "lazy"
       }), item.hassale == 1 && /*#__PURE__*/React__default["default"].createElement("div", {
@@ -39574,15 +40028,65 @@
         "class": "h-100 d-flex align-items-center justify-content-center"
       }, /*#__PURE__*/React__default["default"].createElement(FaRegEye.FaRegEye, {
         size: sectionproperties.generalbtn_fontsize
-      }))), sectionproperties.cartBtnShow == 'Show' && /*#__PURE__*/React__default["default"].createElement("button", {
-        "class": "".concat(card_cssstyles.cart_btn) + ' ml-2 mr-2 ',
+      }))), sectionproperties.quantitybtn_show == 'Hide' && sectionproperties.cartBtnShow == 'Show' && /*#__PURE__*/React__default["default"].createElement("button", {
+        "class": "".concat(card_cssstyles.cart_btn) + ' ml-2 mr-2  ml-sm-1 mr-sm-1 w-sm-100px font-sm-12 ',
         onClick: function onClick() {
-          if (props.fetchingtypeprops == 'products') {
+          setShowProductInfoModalContext(true);
+          setProductIdProdutInfoModalContext(item.productid);
+        }
+      }, langdetect == 'en' ? sectionproperties.cartBtnContentenglish : sectionproperties.cartBtnContentarabic), sectionproperties.quantitybtn_show == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", null, sectionproperties.cartBtnShow == 'Show' && showquantity == false && /*#__PURE__*/React__default["default"].createElement("button", {
+        "class": "".concat(card_cssstyles.cart_btn) + ' ml-2 mr-2  ml-sm-1 mr-sm-1 w-sm-100px font-sm-12 ',
+        onClick: function onClick() {
+          setshowquantity(true);
+        }
+      }, langdetect == 'en' ? sectionproperties.cartBtnContentenglish : sectionproperties.cartBtnContentarabic), showquantity == true && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "".concat(card_cssstyles.quantitybtn) + ' w-sm-100px p-0 d-flex align-items-center justify-content-center ml-2 mr-2 ml-sm-1 mr-sm-1 ',
+        style: {
+          direction: 'ltr'
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("button", {
+        "class": "".concat(card_cssstyles.minus_quantitybtn_icon_container),
+        onClick: function onClick() {
+          if (item.hasvariants == 0) {
+            var tempitem = _objectSpread$B({}, item);
+            tempitem.quantity = parseInt(tempitem.quantity);
+            tempitem.quantity = tempitem.quantity - 1;
+            if (tempitem.quantity <= 0) {
+              tempitem.quantity = 0;
+            }
+            setitem(_objectSpread$B({}, tempitem));
+            addtocartfunc('add', tempitem.quantity);
+          } else {
             setShowProductInfoModalContext(true);
             setProductIdProdutInfoModalContext(item.productid);
           }
-        }
-      }, langdetect == 'en' ? sectionproperties.cartBtnContentenglish : sectionproperties.cartBtnContentarabic), sectionproperties.favBtnShow == 'Show' && /*#__PURE__*/React__default["default"].createElement("button", {
+        },
+        disabled: AddtoCartMutationContext.isLoading == true ? true : false
+      }, /*#__PURE__*/React__default["default"].createElement("i", {
+        "class": "h-100 allcentered minusbtn"
+      }, /*#__PURE__*/React__default["default"].createElement(FiMinus.FiMinus, null))), /*#__PURE__*/React__default["default"].createElement("span", {
+        "class": "".concat(card_cssstyles.quantitybtn_text) + ' d-flex align-items-center justify-content-center '
+      }, addtocartbuttonrender()), /*#__PURE__*/React__default["default"].createElement("button", {
+        "class": "".concat(card_cssstyles.add_quantitybtn_icon_container),
+        onClick: function onClick() {
+          if (item.hasvariants == 0) {
+            var tempitem = _objectSpread$B({}, item);
+            tempitem.quantity = parseInt(tempitem.quantity);
+            tempitem.quantity = tempitem.quantity + 1;
+            if (tempitem.quantity <= 0) {
+              tempitem.quantity = 0;
+            }
+            setitem(_objectSpread$B({}, tempitem));
+            addtocartfunc('add', tempitem.quantity);
+          } else {
+            setShowProductInfoModalContext(true);
+            setProductIdProdutInfoModalContext(item.productid);
+          }
+        },
+        disabled: AddtoCartMutationContext.isLoading == true ? true : false
+      }, /*#__PURE__*/React__default["default"].createElement("i", {
+        "class": "h-100 allcentered addbtn"
+      }, /*#__PURE__*/React__default["default"].createElement(FiPlus.FiPlus, null))))), sectionproperties.favBtnShow == 'Show' && /*#__PURE__*/React__default["default"].createElement("button", {
         "class": " ".concat(card_cssstyles.wishlist_btn) + '',
         onClick: function onClick() {
           addtofavoritescontext(item.productid);
@@ -39606,7 +40110,11 @@
       }), sectionproperties.faviconshape == 'Heart Shape' && /*#__PURE__*/React__default["default"].createElement(FaRegHeart.FaRegHeart, {
         size: sectionproperties.favBtnIconfontsize
       }))))), /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-12 p-0"
+        "class": "col-lg-12",
+        style: {
+          paddingRight: langdetect == 'en' ? sectionproperties.reservation_padding_right + 'px' : sectionproperties.reservation_padding_left + 'px',
+          paddingLeft: langdetect == 'en' ? sectionproperties.reservation_padding_left + 'px' : sectionproperties.reservation_padding_right + 'px'
+        }
       }, sectionproperties.prodNameShow == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "row m-0 w-100 align-items-center justify-content-start"
       }, /*#__PURE__*/React__default["default"].createElement("p", {
@@ -39617,7 +40125,7 @@
             routingcountext(StaticPagesLinksContext.productinfo, true, item.productid);
           }
         },
-        "class": "".concat(card_cssstyles.productNameStyles) + '  wordbreak wordbreak1 m-0 '
+        "class": sectionproperties.wordbreak == '1' ? "".concat(card_cssstyles.productNameStyles) + '  wordbreak wordbreak1 m-0 ' : "".concat(card_cssstyles.productNameStyles) + '  wordbreak wordbreak2 m-0 '
       }, item.name)), /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "row m-0 w-100 align-items-center justify-content-start"
       }, sectionproperties.prodPriceShow == 'Show' && /*#__PURE__*/React__default["default"].createElement("p", {