tabexseriescomponents 0.0.382 → 0.0.384

package/dist/index.umd.js

@@ -17668,7 +17668,7 @@
     function ownKeys$1Y(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
     function _objectSpread$1Y(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1Y(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1Y(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
     var Headerresponsive = function Headerresponsive(props) {
-      var _logoarrayofobjects$, _logoarrayofobjects$2, _authdetailsContext$c, _authdetailsContext$c2, _authdetailsContext$i, _authdetailsContext$i2, _authdetailsContext$i3, _authdetailsContext$i4, _authdetailsContext$i5;
+      var _logoarrayofobjects$, _logoarrayofobjects$2, _authdetailsContext$c, _authdetailsContext$c2, _authdetailsContext$i, _authdetailsContext$i2, _authdetailsContext$i3, _authdetailsContext$i4, _authdetailsContext$i5, _fetchCategoriesQuery;
       var actions = props.actions;
       var LogoutMutationContext = props.actions.LogoutMutationContext;
       var setsidecartnavshowcontext = props.actions.setsidecartnavshowcontext;
@@ -17685,16 +17685,16 @@
       var routingcountext = props.actions.routingcountext;
       var StaticPagesLinksContext = props.actions.StaticPagesLinksContext;
       var setcurrencyfunccontext = props.actions.setcurrencyfunccontext;
-      props.actions.fetchCategoriesQueryContext;
+      var fetchCategoriesQueryContext = props.actions.fetchCategoriesQueryContext;
       var ikimagecredcontext = props.actions.ikimagecredcontext;
       var _useState = React.useState(''),
         _useState2 = _slicedToArray__default["default"](_useState, 2),
         sectionproperties = _useState2[0],
         setsectionproperties = _useState2[1];
       var _useState3 = React.useState(''),
-        _useState4 = _slicedToArray__default["default"](_useState3, 2);
-        _useState4[0];
-        _useState4[1];
+        _useState4 = _slicedToArray__default["default"](_useState3, 2),
+        Choosenindex = _useState4[0],
+        setChoosenindex = _useState4[1];
       React.useEffect(function () {
         if (props.sectionpropertiesprops != undefined) {
           setsectionproperties(_objectSpread$1Y({}, props.sectionpropertiesprops));
@@ -17705,13 +17705,13 @@
         logoarrayofobjects = _useState6[0],
         setlogoarrayofobjects = _useState6[1];
       var _useState7 = React.useState(false),
-        _useState8 = _slicedToArray__default["default"](_useState7, 2);
-        _useState8[0];
-        _useState8[1];
+        _useState8 = _slicedToArray__default["default"](_useState7, 2),
+        openCnvas = _useState8[0],
+        setopenCnvas = _useState8[1];
       var _useState9 = React.useState(''),
-        _useState10 = _slicedToArray__default["default"](_useState9, 2);
-        _useState10[0];
-        _useState10[1];
+        _useState10 = _slicedToArray__default["default"](_useState9, 2),
+        activeTab = _useState10[0],
+        setactiveTab = _useState10[1];
       React.useEffect(function () {
         if (templateproperties_context.length != 0 && templateproperties_context.logoarrayofobjects != undefined) {
           var logoarrayofobjectsparsed = JSON.parse(templateproperties_context.logoarrayofobjects);
@@ -17968,13 +17968,17 @@
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: langdetect == 'en' ? 'mr-1' : 'ml-1',
         onClick: function onClick() {
-          var element2 = document.getElementById('filter');
-          element2.classList.toggle('d-flex');
-          if (sectionproperties.showhidesubheader == 'Show') {
-            var element3 = document.getElementById('subheader');
-            element3.classList.toggle('d-none');
+          if (sectionproperties.responsiveheaderstyle == 'Style 1 With Canvas') {
+            setopenCnvas(true);
+            setactiveTab('menu');
+          } else {
+            var element2 = document.getElementById('filter');
+            element2.classList.toggle('d-flex');
+            if (sectionproperties.showhidesubheader == 'Show') {
+              var element3 = document.getElementById('subheader');
+              element3.classList.toggle('d-none');
+            }
           }
-          // setopenCnvas(true);
         }
       }, /*#__PURE__*/React__default["default"].createElement("i", {
         "class": "h-100 allcentered"
@@ -18515,7 +18519,7 @@
         style: {
           borderColor: sectionproperties.resp_header_separatorbg
         }
-      }))))))), sectionproperties.showhidesubheader == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+      }))))))), sectionproperties.showhidesubheader == 'Show' && sectionproperties.showresponsivesubheader != 'Hide' && /*#__PURE__*/React__default["default"].createElement("div", {
         className: "col-lg-12 p-0 h-100",
         id: "subheader"
       }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -18525,6 +18529,282 @@
       }, /*#__PURE__*/React__default["default"].createElement(Subheader, {
         sectionpropertiesprops: sectionproperties,
         actions: actions
+      }))))), sectionproperties.length != 0 && sectionproperties.responsiveheaderstyle == 'Style 1 With Canvas' && /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas, {
+        show: openCnvas,
+        onHide: function onHide() {
+          setopenCnvas(false);
+        },
+        placement: langdetect == 'en' ? 'start' : 'end',
+        scroll: true,
+        style: {
+          width: '90%',
+          backgroundColor: 'white'
+        },
+        backdrop: true
+      }, /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas.Header, null, /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas.Title, null, /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "allcentered",
+        style: {
+          position: 'absolute',
+          right: -34,
+          top: 5,
+          width: 30,
+          height: 30,
+          background: '#000'
+        },
+        onClick: function onClick() {
+          setopenCnvas(false);
+        }
+      }, /*#__PURE__*/React__default["default"].createElement(IoMdClose.IoMdClose, {
+        color: '#fff',
+        size: 16
+      })), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "row m-0 w-100 mb-5",
+        style: {
+          borderBottom: '1px solid #eee'
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        className: 'col-6 allcentered py-3',
+        onClick: function onClick() {
+          setactiveTab('menu');
+        },
+        style: {
+          background: activeTab == 'menu' ? 'white' : '#eee'
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("p", {
+        className: "m-0 p-0",
+        style: {
+          textTransform: 'uppercase',
+          fontWeight: 500,
+          fontSize: '15px',
+          transition: '.3s',
+          color: '#000'
+        }
+      }, langdetect == 'en' ? 'MENU' : 'القائمة')), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: 'col-6 allcentered py-3',
+        onClick: function onClick() {
+          setactiveTab('categories');
+        },
+        style: {
+          background: activeTab == 'categories' ? 'white' : '#eee'
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("p", {
+        className: "m-0 p-0",
+        style: {
+          textTransform: 'uppercase',
+          fontWeight: 500,
+          fontSize: '15px',
+          transition: '.3s',
+          color: '#000'
+        }
+      }, langdetect == 'en' ? 'COLLECTIONS' : 'المجموعات'))))), /*#__PURE__*/React__default["default"].createElement(reactBootstrap.Offcanvas.Body, null, activeTab == 'menu' && /*#__PURE__*/React__default["default"].createElement("div", {
+        className: ' row m-0 w-100 anim '
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "col-lg-12 p-0"
+      }, /*#__PURE__*/React__default["default"].createElement("ul", {
+        className: ' d-flex justify-content-center flex-column p-0 '
+      }, templatepropcontext.pagesnprop.map(function (item, index) {
+        if (item.isnavigation == 1 && item.isactive == 1) {
+          return /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "row m-0 w-100"
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "col-lg-12 d-flex justify-content-start pl-3 pr-3",
+            style: {
+              paddingTop: index == 0 ? 5 : 0
+            }
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            onClick: function onClick() {
+              routingcountext(item.navigationroute, false, '');
+              setopenCnvas(false);
+            }
+          }, /*#__PURE__*/React__default["default"].createElement("p", {
+            className: "".concat(header_cssstyles.navbar_item_text_responsive) + ' mb-0 p-0 '
+          }, langdetect == 'en' ? item.pagename : item.pagename_ar))), /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "col-lg-12 p-0"
+          }, /*#__PURE__*/React__default["default"].createElement("hr", {
+            className: "mt-4 mb-4",
+            style: {
+              borderColor: sectionproperties.resp_header_separatorbg
+            }
+          })));
+        }
+      }), authdetailsContext.loggedin == true && sectionproperties.ShowUserBtn == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "row m-0 w-100"
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "col-lg-12 d-flex justify-content-start",
+        onClick: function onClick() {
+          routingcountext(StaticPagesLinksContext.Ordershistory);
+          setopenCnvas(false);
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("p", {
+        className: "".concat(header_cssstyles.navbar_item_text_responsive) + ' mb-0 p-0 d-flex justify-content-start '
+      }, lang.orderhistory)), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "col-lg-12 p-0"
+      }, /*#__PURE__*/React__default["default"].createElement("hr", {
+        className: "mt-4 mb-4",
+        style: {
+          borderColor: sectionproperties.resp_header_separatorbg
+        }
+      }))), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "row m-0 w-100"
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "col-lg-12 d-flex justify-content-start",
+        onClick: function onClick() {
+          routingcountext(StaticPagesLinksContext.Wishlist);
+          setopenCnvas(false);
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("p", {
+        className: "".concat(header_cssstyles.navbar_item_text_responsive) + ' mb-0 p-0 d-flex justify-content-start '
+      }, lang.wishlist)), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "col-lg-12 p-0"
+      }, /*#__PURE__*/React__default["default"].createElement("hr", {
+        className: "mt-3 mb-3",
+        style: {
+          borderColor: sectionproperties.resp_header_separatorbg
+        }
+      }))), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "row m-0 w-100"
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "col-lg-12 d-flex justify-content-start",
+        onClick: function onClick() {
+          routingcountext(StaticPagesLinksContext.Policies);
+          setopenCnvas(false);
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("p", {
+        className: "".concat(header_cssstyles.navbar_item_text_responsive) + ' mb-0 p-0 '
+      }, lang.policies)))))), activeTab == 'categories' && /*#__PURE__*/React__default["default"].createElement("div", {
+        className: ' row m-0 w-100 accordionContainer anim'
+      }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.Accordion, {
+        allowMultipleExpanded: true,
+        allowZeroExpanded: true
+      }, fetchCategoriesQueryContext === null || fetchCategoriesQueryContext === void 0 || (_fetchCategoriesQuery = fetchCategoriesQueryContext.data) === null || _fetchCategoriesQuery === void 0 || (_fetchCategoriesQuery = _fetchCategoriesQuery.data) === null || _fetchCategoriesQuery === void 0 ? void 0 : _fetchCategoriesQuery.categories.map(function (item, index) {
+        if (item.isshowntocustomers == 1) {
+          var _fetchCategoriesQuery2, _fetchCategoriesQuery3;
+          return /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItem, {
+            uuid: index
+          }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemHeading, {
+            onClick: function onClick() {
+              setChoosenindex(index);
+            }
+          }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemButton, null, /*#__PURE__*/React__default["default"].createElement("div", {
+            className: ' row m-0 p-0 mb-2 '
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            className: ' row m-0 w-100 px-3 '
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "col-10  p-0"
+            // onClick={() => {
+            //     routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'categories/' + item.categoryid);
+            // }}
+          }, /*#__PURE__*/React__default["default"].createElement("p", {
+            className: "".concat(header_cssstyles.navbar_item_text_responsive) + ' mb-0 p-0 '
+          }, langdetect == 'en' ? item.title_en : item.title_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "col-lg-2 col-md-2 col-sm-2 p-0"
+          }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemState, null, function (state) {
+            if (state.expanded == true) {
+              return /*#__PURE__*/React__default["default"].createElement("i", {
+                className: ' collapsetitle h-100 d-flex align-items-center justify-content-end   '
+              }, /*#__PURE__*/React__default["default"].createElement(FiChevronDown.FiChevronDown, {
+                style: {
+                  color: '#000',
+                  fontSize: 15
+                }
+              }));
+            } else {
+              return /*#__PURE__*/React__default["default"].createElement("i", {
+                className: ' collapsetitle h-100 d-flex align-items-center justify-content-end   '
+              }, /*#__PURE__*/React__default["default"].createElement(FiChevronUp.FiChevronUp, {
+                style: {
+                  color: '#000',
+                  fontSize: 15
+                }
+              }));
+            }
+          }))), /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "col-lg-12 p-0"
+          }, /*#__PURE__*/React__default["default"].createElement("hr", {
+            className: "mt-3 mb-3",
+            style: {
+              borderColor: sectionproperties.resp_header_separatorbg
+            }
+          }))))), /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemPanel, {
+            className: "p-0"
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "row mt-0 mb-2 ml-0 mr-0 d-lg-flex"
+          }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.Accordion, {
+            allowMultipleExpanded: true,
+            allowZeroExpanded: true
+          }, Choosenindex.length != 0 && (fetchCategoriesQueryContext === null || fetchCategoriesQueryContext === void 0 || (_fetchCategoriesQuery2 = fetchCategoriesQueryContext.data) === null || _fetchCategoriesQuery2 === void 0 || (_fetchCategoriesQuery2 = _fetchCategoriesQuery2.data) === null || _fetchCategoriesQuery2 === void 0 || (_fetchCategoriesQuery2 = _fetchCategoriesQuery2.categories[Choosenindex]) === null || _fetchCategoriesQuery2 === void 0 || (_fetchCategoriesQuery2 = _fetchCategoriesQuery2.parentcolletions) === null || _fetchCategoriesQuery2 === void 0 ? void 0 : _fetchCategoriesQuery2.length) != 0 && (fetchCategoriesQueryContext === null || fetchCategoriesQueryContext === void 0 || (_fetchCategoriesQuery3 = fetchCategoriesQueryContext.data) === null || _fetchCategoriesQuery3 === void 0 || (_fetchCategoriesQuery3 = _fetchCategoriesQuery3.data) === null || _fetchCategoriesQuery3 === void 0 || (_fetchCategoriesQuery3 = _fetchCategoriesQuery3.categories[Choosenindex]) === null || _fetchCategoriesQuery3 === void 0 ? void 0 : _fetchCategoriesQuery3.parentcolletions.map(function (pitem, pindex) {
+            if (pitem.isshowntocustomers == 1) {
+              return /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItem, {
+                uuid: pindex
+              }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemHeading, null, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemButton, null, /*#__PURE__*/React__default["default"].createElement("div", {
+                className: ' row m-0 p-0 mb-2 '
+              }, /*#__PURE__*/React__default["default"].createElement("div", {
+                className: ' row m-0 w-100 px-4 '
+              }, /*#__PURE__*/React__default["default"].createElement("div", {
+                className: "col-10  p-0",
+                onClick: function onClick() {
+                  // routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'categories/' + item.categoryid);
+                }
+              }, /*#__PURE__*/React__default["default"].createElement("p", {
+                className: "".concat(header_cssstyles.navbar_item_text_responsive) + ' mb-0 p-0 '
+              }, langdetect == 'en' ? pitem.title_en : pitem.title_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
+                className: "col-lg-2 col-md-2 col-sm-2 p-0"
+              }, /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemState, null, function (state) {
+                if (state.expanded == true) {
+                  return /*#__PURE__*/React__default["default"].createElement("i", {
+                    className: ' collapsetitle h-100 d-flex align-items-center justify-content-end   '
+                  }, /*#__PURE__*/React__default["default"].createElement(FiChevronDown.FiChevronDown, {
+                    style: {
+                      color: '#000',
+                      fontSize: 15
+                    }
+                  }));
+                } else {
+                  return /*#__PURE__*/React__default["default"].createElement("i", {
+                    className: ' collapsetitle h-100 d-flex align-items-center justify-content-end   '
+                  }, /*#__PURE__*/React__default["default"].createElement(FiChevronUp.FiChevronUp, {
+                    style: {
+                      color: '#000',
+                      fontSize: 15
+                    }
+                  }));
+                }
+              }))), /*#__PURE__*/React__default["default"].createElement("div", {
+                className: "col-lg-12 p-0"
+              }, /*#__PURE__*/React__default["default"].createElement("hr", {
+                className: "mt-3 mb-3",
+                style: {
+                  borderColor: sectionproperties.resp_header_separatorbg
+                }
+              }))))), /*#__PURE__*/React__default["default"].createElement(reactAccessibleAccordion.AccordionItemPanel, {
+                className: "p-0"
+              }, pitem.collections.length != 0 && pitem.collections.map(function (collitem, collindex) {
+                if (collitem.isshowntocustomers == 1) {
+                  return /*#__PURE__*/React__default["default"].createElement("div", {
+                    className: ' row m-0 p-0 mb-2 '
+                  }, /*#__PURE__*/React__default["default"].createElement("div", {
+                    className: ' row m-0 w-100 px-5 '
+                  }, /*#__PURE__*/React__default["default"].createElement("div", {
+                    className: "col-10  p-0",
+                    onClick: function onClick() {
+                      routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + collitem.collectionid);
+                      setopenCnvas(false);
+                    }
+                  }, /*#__PURE__*/React__default["default"].createElement("p", {
+                    className: "".concat(header_cssstyles.navbar_item_text_responsive) + ' mb-0 p-0 '
+                  }, langdetect == 'en' ? collitem.title_en : collitem.title_ar))), /*#__PURE__*/React__default["default"].createElement("div", {
+                    className: "col-lg-12 p-0"
+                  }, /*#__PURE__*/React__default["default"].createElement("hr", {
+                    className: "mt-3 mb-3",
+                    style: {
+                      borderColor: sectionproperties.resp_header_separatorbg
+                    }
+                  })));
+                }
+              })));
+            }
+          }))))));
+        }
       })))))));
     };
 
@@ -35667,7 +35947,7 @@
     function ownKeys$1B(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
     function _objectSpread$1B(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1B(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1B(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
     var TwoTieredWithCenteredLogoHeader = function TwoTieredWithCenteredLogoHeader(props) {
-      var _authdetailsContext$i2, _logoarrayofobjects$, _logoarrayofobjects$2, _authdetailsContext$c, _authdetailsContext$c2, _fetchcustomercartQue, _fetchcustomercartQue2;
+      var _textarray$, _textarray$2, _authdetailsContext$i2, _logoarrayofobjects$, _logoarrayofobjects$2, _authdetailsContext$c, _authdetailsContext$c2, _fetchcustomercartQue, _fetchcustomercartQue2;
       var _useState = React.useState(''),
         _useState2 = _slicedToArray__default["default"](_useState, 2),
         sectionproperties = _useState2[0],
@@ -35688,6 +35968,10 @@
       var StaticPagesLinksContext = props.actions.StaticPagesLinksContext;
       var ikimagecredcontext = props.actions.ikimagecredcontext;
       var actions = props.actions;
+      var _useState3 = React.useState([]),
+        _useState4 = _slicedToArray__default["default"](_useState3, 2),
+        textarray = _useState4[0],
+        settextarray = _useState4[1];
       React.useEffect(function () {
         var secpropobj = {};
         StatePagePropertiesContext.pageobj.sections.forEach(function (sectionitem, sectionindex) {
@@ -35704,10 +35988,10 @@
         }
         setsectionproperties(_objectSpread$1B({}, secpropobj));
       }, [StatePagePropertiesContext]);
-      var _useState3 = React.useState([]),
-        _useState4 = _slicedToArray__default["default"](_useState3, 2),
-        logoarrayofobjects = _useState4[0],
-        setlogoarrayofobjects = _useState4[1];
+      var _useState5 = React.useState([]),
+        _useState6 = _slicedToArray__default["default"](_useState5, 2),
+        logoarrayofobjects = _useState6[0],
+        setlogoarrayofobjects = _useState6[1];
       React.useEffect(function () {
         if (templateproperties_context.length != 0 && templateproperties_context.logoarrayofobjects != undefined) {
           var logoarrayofobjectsparsed = JSON.parse(templateproperties_context.logoarrayofobjects);
@@ -35996,12 +36280,53 @@
           }
         })
       };
+      React.useEffect(function () {
+        if (templateproperties_context.length != 0 && templateproperties_context.txtArray != undefined) {
+          var textarrayparsed = JSON.parse(templateproperties_context.txtArray);
+          if (Array.isArray(textarrayparsed)) {
+            settextarray(_toConsumableArray__default["default"](textarrayparsed));
+          }
+        }
+      }, [templateproperties_context]);
       return /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "row m-0 w-100 d-flex align-items-center justify-content-center "
       }, sectionproperties.showdownloadapp == 'Show' && /*#__PURE__*/React__default["default"].createElement(DownloadApp, {
         sectionpropertiesprops: sectionproperties,
         actions: actions
-      }), /*#__PURE__*/React__default["default"].createElement("div", {
+      }), sectionproperties.showtextslider == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "col-lg-12 px-0 allcentered",
+        style: {
+          background: templateproperties_context.textsliderbgcolor,
+          paddingTop: templateproperties_context.paddinghorizontal + 'px',
+          paddingBottom: templateproperties_context.paddinghorizontal + 'px'
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "col-lg-4 col-md-6"
+      }, templateproperties_context.textslidertype == 'Slider' && /*#__PURE__*/React__default["default"].createElement("marquee", null, /*#__PURE__*/React__default["default"].createElement("span", {
+        "class": "d-flex flex-row align-items-center"
+      }, textarray.map(function (item, index) {
+        return /*#__PURE__*/React__default["default"].createElement("p", {
+          "class": header_cssstyles.textSlider + ' mb-0 p-0 ',
+          style: {
+            fontSize: templateproperties_context.textsliderfontsize + 'px',
+            color: templateproperties_context.textsliderfontcolor,
+            fontWeight: templateproperties_context.textsliderfontweight,
+            marginLeft: 100,
+            marginRight: 100
+          }
+        }, langdetect == 'en' ? item.textEnglish : item.textArabic);
+      }))), templateproperties_context.textslidertype == 'Text' && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "w-100 allcentered"
+      }, /*#__PURE__*/React__default["default"].createElement("p", {
+        "class": header_cssstyles.textSlider + ' mb-0 p-0 ',
+        style: {
+          fontSize: templateproperties_context.textsliderfontsize + 'px',
+          color: templateproperties_context.textsliderfontcolor,
+          fontWeight: templateproperties_context.textsliderfontweight
+        }
+      }, langdetect == 'en' ? (_textarray$ = textarray[0]) === null || _textarray$ === void 0 ? void 0 : _textarray$.textEnglish : (_textarray$2 = textarray[0]) === null || _textarray$2 === void 0 ? void 0 : _textarray$2.textArabic))))
+      // <MarqueeHeader sectionpropertiesprops={sectionproperties} actions={actions} />
+      , /*#__PURE__*/React__default["default"].createElement("div", {
         "class": " ".concat(header_cssstyles.headercontainer) + ' d-flex d-md-none align-items-center m-0 pl-lg-2 pr-lg-2 '
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         "class": "row m-0 w-100 "
@@ -44742,7 +45067,11 @@
           borderTopLeftRadius: sectionproperties.borderTopLeftRadius + 'px',
           borderTopRightRadius: sectionproperties.borderTopRightRadius + 'px',
           borderColor: sectionproperties.sectioncardbordercolor,
-          border: sectionproperties.sectioncardborderwidth + 'px solid'
+          border: sectionproperties.sectioncardborderwidth + 'px solid',
+          '@media (max-width: 800px)': {
+            paddingTop: sectionproperties.paddingverticalresponsive + 'px',
+            paddingBottom: sectionproperties.paddingverticalresponsive + 'px'
+          }
         }),
         viewmorebtn: glamor.css({
           width: sectionproperties.viewmorebtn_Width + 'px',
@@ -50008,6 +50337,12 @@
             borderTopRightRadius: sectionproperties.image_bordertoprightradius + 'px',
             borderBottomLeftRadius: sectionproperties.image_borderBottomLeftRadius + 'px',
             borderBottomRightRadius: sectionproperties.image_borderBottomRightRadius + 'px'
+          },
+          height: '100%',
+          width: '100%',
+          '@media (max-width: 800px)': {
+            width: sectionproperties.innerwidthheightresp + '%',
+            height: sectionproperties.innerwidthheightresp + '%'
           }
         }),
         text1styles: glamor.css({
@@ -50086,7 +50421,7 @@
         }, /*#__PURE__*/React__default["default"].createElement("div", {
           className: sectionproperties.collectionssectionshow == 'Show' ? 'col-lg-10 col-md-12 p-md-0' : 'col-lg-12 p-0'
         }, /*#__PURE__*/React__default["default"].createElement("div", {
-          className: "row m-0 w-100"
+          className: sectionproperties.justifyContentCenter == 'Centered' ? 'row m-0 w-100 allcentered' : 'row m-0 w-100 allcentered'
         }, Object.keys(bgimagearrayofobjs).length != 0 && bgimagearrayofobjs.map(function (item, index) {
           return /*#__PURE__*/React__default["default"].createElement("div", {
             className: bgimagearrayofobjs[index].bg1_numberofcols != 12 ? ' d-flex align-items-stretch col-md-6 col-sm-12 pr-sm-2 pl-sm-2 mb-md-3 mt-md-3 col-lg-' + bgimagearrayofobjs[index].bg1_numberofcols : ' d-flex align-items-stretch col-md-12 col-sm-12 pr-md-0 pl-md-0 col-lg-' + bgimagearrayofobjs[index].bg1_numberofcols,
@@ -50112,16 +50447,13 @@
           }, /*#__PURE__*/React__default["default"].createElement("div", {
             className: "row ml-0 mr-0 d-flex justify-content-center w-100"
           }, /*#__PURE__*/React__default["default"].createElement("div", {
-            className: sectionproperties.bgcovercontainresponsive == 'Contain' ? 'col-lg-12 p-0 h-md-auto' : 'col-lg-12 p-0',
+            className: sectionproperties.bgcovercontainresponsive == 'Contain' ? 'col-lg-12 p-0 h-md-auto allcentered' : 'col-lg-12 p-0 allcentered',
             style: {
               height: sectionproperties.bgcovercontain == 'Contain' ? 'auto' : sectionproperties.image_height + 'vh'
             }
           }, /*#__PURE__*/React__default["default"].createElement("div", {
             className: "".concat(bgcssstyles.bgimage) + ' d-md-flex d-sm-none ',
-            style: {
-              height: '100%',
-              width: '100%'
-            }
+            style: {}
           }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
             urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
             publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
@@ -50138,10 +50470,7 @@
             }
           })), /*#__PURE__*/React__default["default"].createElement("div", {
             className: "".concat(bgcssstyles.bgimage) + ' d-none d-md-none d-sm-flex',
-            style: {
-              height: '100%',
-              width: '100%'
-            }
+            style: {}
           }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
             urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
             publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
@@ -52098,6 +52427,32 @@
             backgroundColor: sectionproperties.linebgcolor,
             borderRadius: '5px'
           }
+        }),
+        imageimage: glamor.css({
+          width: '100%',
+          height: sectionproperties.image_height == 0 ? 'auto' : sectionproperties.image_height + 'px',
+          margin: 0,
+          padding: 0,
+          objectFit: sectionproperties.bgcovercontain,
+          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',
+          '@media (max-width: 800px)': {
+            height: sectionproperties.height_responsive == 0 ? 'auto' : sectionproperties.height_responsive + '%'
+          }
+        }),
+        editortext: glamor.css({
+          textAlign: sectionproperties.text2centered == 'Centered' ? 'center' : sectionproperties.text2centered == 'Justify' ? 'justify' : 'start',
+          color: sectionproperties.slideshowText2ContentColor,
+          fontSize: sectionproperties.slideshowText2ContentFontSize + 'px',
+          fontWeight: sectionproperties.slideshowText2ContentFontWeight,
+          paddingLeft: langdetect == 'en' ? sectionproperties.slideshowText2Content_marginLeft + 'px' : sectionproperties.slideshowText2Content_marginRight + 'px',
+          paddingRight: langdetect == 'en' ? sectionproperties.slideshowText2Content_marginRight + 'px' : sectionproperties.slideshowText2Content_marginLeft + 'px',
+          '@media (max-width: 800px)': {
+            fontSize: sectionproperties.slideshowText2ContentFontSize_resp + 'px',
+            textAlign: sectionproperties.text2centered == 'Centered' ? 'center' : sectionproperties.text2centered == 'Justify' ? 'justify' : 'start'
+          }
         })
       };
       var SectionTitle = function SectionTitle() {
@@ -52182,15 +52537,8 @@
             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: {
-            textAlign: sectionproperties.text2centered == 'Centered' ? 'center' : 'start',
-            color: sectionproperties.slideshowText2ContentColor,
-            fontSize: sectionproperties.slideshowText2ContentFontSize + 'px',
-            fontWeight: sectionproperties.slideshowText2ContentFontWeight,
-            paddingLeft: langdetect == 'en' ? sectionproperties.slideshowText2Content_marginLeft + 'px' : sectionproperties.slideshowText2Content_marginRight + 'px',
-            paddingRight: langdetect == 'en' ? sectionproperties.slideshowText2Content_marginRight + 'px' : sectionproperties.slideshowText2Content_marginLeft + 'px'
-          },
+          "class": sectionproperties.text2centered == 'Justify' ? section_styles.editortext + ' pb-0 pl-md-2 pr-md-2 ' : section_styles.editortext + ' pb-0 text-md-center pl-md-2 pr-md-2 ',
+          style: {},
           dangerouslySetInnerHTML: {
             __html: langdetect == 'en' ? sectionproperties.contenteditor : sectionproperties.text2editortextar
           }
@@ -52273,20 +52621,11 @@
             }
           }
         }, imagesarray.length != 0 && /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
+          "class": section_styles.imageimage,
           urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
           publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
           path: langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + ((_imagesarray$7 = imagesarray[0]) === null || _imagesarray$7 === void 0 ? void 0 : _imagesarray$7.bgsection_image) : '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + ((_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',
-            margin: 0,
-            padding: 0,
-            objectFit: sectionproperties.bgcovercontain,
-            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'
-          }
+          style: {}
         }));
       };
       return /*#__PURE__*/React__default["default"].createElement("div", {
@@ -52304,12 +52643,12 @@
           width: sectionproperties.width + 'vw'
         }
       }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": sectionproperties.paddingLeft != 0 && sectionproperties.paddingRight != 0 ? 'row m-0 w-100 d-flex justify-content-between plr-1025-1 pr-md-3 pl-md-3' : sectionproperties.paddingLeft != 0 ? langdetect == 'en' ? 'row m-0 w-100 d-flex justify-content-between pl-1025-1 pl-md-3' : 'row m-0 w-100 d-flex justify-content-between pr-1025-1 pr-md-3' : sectionproperties.paddingRight != 0 ? langdetect == 'en' ? 'row m-0 w-100 d-flex justify-content-between pr-1025-1 pr-md-3' : 'row m-0 w-100 d-flex justify-content-between pl-1025-1 pl-md-3' : 'row m-0 w-100 d-flex justify-content-between',
+        "class": sectionproperties.paddingLeft != 0 && sectionproperties.paddingRight != 0 ? section_styles.sectioncintainer + ' row m-0 w-100 d-flex justify-content-between plr-1025-1 pr-md-3 pl-md-3 ' : sectionproperties.paddingLeft != 0 ? langdetect == 'en' ? section_styles.sectioncintainer + ' row m-0 w-100 d-flex justify-content-between pl-1025-1 pl-md-3 ' : section_styles.sectioncintainer + ' row m-0 w-100 d-flex justify-content-between pr-1025-1 pr-md-3 ' : sectionproperties.paddingRight != 0 ? langdetect == 'en' ? section_styles.sectioncintainer + ' row m-0 w-100 d-flex justify-content-between pr-1025-1 pr-md-3 ' : section_styles.sectioncintainer + ' row m-0 w-100 d-flex justify-content-between pl-1025-1 pl-md-3 ' : section_styles.sectioncintainer + ' row m-0 w-100 d-flex justify-content-between ',
         style: {
           paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : sectionproperties.paddingRight + 'px',
           paddingRight: langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px',
-          paddingTop: sectionproperties.paddingTop + 'px',
-          paddingBottom: sectionproperties.paddingBottom + 'px',
+          // paddingTop: sectionproperties.paddingTop + 'px',
+          // paddingBottom: sectionproperties.paddingBottom + 'px',
           marginTop: sectionproperties.marginTop + 'px',
           marginBottom: sectionproperties.marginBottom + 'px',
           borderTopLeftRadius: langdetect == 'en' ? sectionproperties.borderTopLeftRadius + 'px' : sectionproperties.borderTopRightRadius + 'px',

package/package.json

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