tabexseriescomponents 0.0.106 → 0.0.108

package/dist/index.esm.js

@@ -19,7 +19,6 @@ import { IoMdClose } from '@react-icons/all-files/io/IoMdClose';
 import { Modal, Offcanvas } from 'react-bootstrap';
 import 'react-query';
 import ImageGallery from 'react-image-gallery';
-import ShowMoreText from 'react-show-more-text';
 import { useParams } from 'react-router';
 import { IKImage } from 'imagekitio-react';
 import { MdAddShoppingCart as MdAddShoppingCart$1 } from '@react-icons/all-files/md/MdAddShoppingCart';
@@ -1625,14 +1624,7 @@ var Productinfo = function Productinfo(props) {
     className: "row m-0 w-100 d-flex flex-column"
   }, /*#__PURE__*/React.createElement("p", {
     className: "m-0 p-0 text-light font-15 d-flex justify-content-start"
-  }, lang.description, ":"), /*#__PURE__*/React.createElement(ShowMoreText, {
-    lines: 5,
-    more: lang.showmore,
-    less: lang.showless,
-    anchorClass: "my-anchor-css-className",
-    expanded: false,
-    truncatedEndingComponent: '... '
-  }, /*#__PURE__*/React.createElement("p", {
+  }, lang.description, ":"), /*#__PURE__*/React.createElement("p", {
     className: 'text-black text-capitalize m-0 p-0 wordbreak',
     style: {
       textAlign: langdetect == 'en' ? 'left' : 'right'
@@ -1640,7 +1632,7 @@ var Productinfo = function Productinfo(props) {
     dangerouslySetInnerHTML: {
       __html: langdetect == 'en' ? fetchProductInfoQueryContext.data.data.productinfo.description_en : fetchProductInfoQueryContext.data.data.productinfo.description_ar
     }
-  })))), langdetect == 'ar' && fetchProductInfoQueryContext.data.data.productinfo.description_ar != '' && /*#__PURE__*/React.createElement("div", {
+  }))), langdetect == 'ar' && fetchProductInfoQueryContext.data.data.productinfo.description_ar != '' && /*#__PURE__*/React.createElement("div", {
     className: "col-lg-12 p-0 mb-5 d-flex justify-content-center",
     style: {
       minHeight: '15vh'
@@ -1649,14 +1641,7 @@ var Productinfo = function Productinfo(props) {
     className: "row m-0 w-100 d-flex flex-column"
   }, /*#__PURE__*/React.createElement("p", {
     className: "m-0 p-0 text-light font-15 d-flex justify-content-start"
-  }, lang.description, ":"), /*#__PURE__*/React.createElement(ShowMoreText, {
-    lines: 5,
-    more: lang.showmore,
-    less: lang.showless,
-    anchorClass: "my-anchor-css-className",
-    expanded: false,
-    truncatedEndingComponent: '... '
-  }, /*#__PURE__*/React.createElement("p", {
+  }, lang.description, ":"), /*#__PURE__*/React.createElement("p", {
     className: 'text-black text-capitalize m-0 p-0 wordbreak',
     style: {
       textAlign: langdetect == 'en' ? 'left' : 'right'
@@ -1664,7 +1649,7 @@ var Productinfo = function Productinfo(props) {
     dangerouslySetInnerHTML: {
       __html: langdetect == 'en' ? fetchProductInfoQueryContext.data.data.productinfo.description_en : fetchProductInfoQueryContext.data.data.productinfo.description_ar
     }
-  })))), fetchProductInfoQueryContext.data.data.productinfo.hasvariants == 1 && /*#__PURE__*/React.createElement("div", {
+  }))), fetchProductInfoQueryContext.data.data.productinfo.hasvariants == 1 && /*#__PURE__*/React.createElement("div", {
     className: "row m-0 w-100 d-flex align-items-start"
   }, fetchProductInfoQueryContext.data.data.productinfo.productoptions.map(function (item, index) {
     return /*#__PURE__*/React.createElement("div", {
@@ -31644,7 +31629,6 @@ var Threebgimages = function Threebgimages(props) {
 function ownKeys$J(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$J(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$J(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$J(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var Twobgimages = function Twobgimages(props) {
-  var _bgimagearrayofobjs$;
   var _useState = useState(''),
     _useState2 = _slicedToArray(_useState, 2),
     sectionproperties = _useState2[0],
@@ -31778,207 +31762,221 @@ var Twobgimages = function Twobgimages(props) {
       }
     })
   };
-  return /*#__PURE__*/React.createElement("div", {
-    className: "row m-0 w-100"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "col-lg-12 p-0"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: ((_bgimagearrayofobjs$ = bgimagearrayofobjs[0]) === null || _bgimagearrayofobjs$ === void 0 ? void 0 : _bgimagearrayofobjs$.bg1_numberofcols) == '12' ? 'row w-100 ml-0 mr-0 pl-md-0 pr-md-0 no-repeat' : 'row w-100 ml-0 mr-0 pl-md-3 pr-md-3 no-repeat',
-    style: {
-      paddingTop: sectionproperties.paddingTop + 'px',
-      paddingBottom: sectionproperties.paddingBottom + 'px',
-      paddingLeft: sectionproperties.paddingLeft + 'px',
-      paddingRight: sectionproperties.paddingRight + 'px',
-      backgroundImage: maincontainerarrayofobjs.length != 0 ? 'url(' + serverbaselink$1 + maincontainerarrayofobjs[0].back_bgimage + ')' : '',
-      backgroundSize: 'cover',
-      background: sectionproperties.backgroundColor
-    }
-  }, sectionproperties.collectionssectionshow == 'Show' && /*#__PURE__*/React.createElement("div", {
-    className: "col-lg-2 col-md-12 pl-2 pr-2 mb-md-3"
-  }, /*#__PURE__*/React.createElement(Categoriesdropdown, {
-    sectionpropertiesprops: sectionproperties,
-    actions: actions
-  })), /*#__PURE__*/React.createElement("div", {
-    className: sectionproperties.collectionssectionshow == 'Show' ? 'col-lg-10 col-md-12 p-md-0' : 'col-lg-12 p-0'
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "row m-0 w-100"
-  }, Object.keys(bgimagearrayofobjs).length != 0 && bgimagearrayofobjs.map(function (item, index) {
-    // bgimagearrayofobjs.IsClickable
-    // bgimagearrayofobjs.clickable_page_route
-    // bgimagearrayofobjs.Clickable_Reference_Collection_ID
+  var BackgroundImage = function BackgroundImage() {
+    var _bgimagearrayofobjs$;
     return /*#__PURE__*/React.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,
-      style: {
-        paddingLeft: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : '7px',
-        paddingRight: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : '7px',
-        cursor: item.place_clickable == 'General' ? 'pointer' : 'default'
-      },
-      onClick: function onClick() {
-        if (item.IsClickable == 'Yes') {
-          if (item.place_clickable == 'General') {
-            if (item.clickable_page_route && item.clickable_page_route.length != 0) {
-              routingcountext(item.clickable_page_route, false, '');
-            } else {
-              routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.Clickable_Reference_Collection_ID);
-            }
-          }
-        }
-      }
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "row ml-0 mr-0 d-flex justify-content-center w-100"
-    }, /*#__PURE__*/React.createElement("div", {
-      className: sectionproperties.bgcovercontainresponsive == 'Contain' ? 'col-lg-12 p-0 h-md-auto' : 'col-lg-12 p-0',
-      style: {
-        height: sectionproperties.image_height + 'vh'
-      }
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(bgcssstyles.bgimage) + ' d-md-flex d-sm-none ',
-      style: {
-        height: '100%',
-        width: '100%'
-      }
-    }, /*#__PURE__*/React.createElement(IKImage, {
-      urlEndpoint: IKurlEndpoint,
-      publicKey: IKpublicKey,
-      path: bgimagearrayofobjs.length != 0 ? langdetect == 'en' ? bgimagearrayofobjs[index].bg1_image : bgimagearrayofobjs[index].bg1_image_ar : '',
-      className: 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.createElement("div", {
-      className: "".concat(bgcssstyles.bgimage) + ' d-none d-md-none d-sm-flex',
-      style: {
-        height: '100%',
-        width: '100%'
-      }
-    }, /*#__PURE__*/React.createElement(IKImage, {
-      urlEndpoint: IKurlEndpoint,
-      publicKey: IKpublicKey,
-      path: bgimagearrayofobjs.length != 0 ? langdetect == 'en' ? bgimagearrayofobjs[index].bg1_imageresponsive : bgimagearrayofobjs[index].bg1_imageresponsive_ar : '',
-      className: sectionproperties.bgcovercontainresponsive == 'Contain' ? 'objectFit-md-contain' : '',
+      className: ((_bgimagearrayofobjs$ = bgimagearrayofobjs[0]) === null || _bgimagearrayofobjs$ === void 0 ? void 0 : _bgimagearrayofobjs$.bg1_numberofcols) == '12' ? 'row w-100 ml-0 mr-0 pl-md-0 pr-md-0 no-repeat' : 'row w-100 ml-0 mr-0 pl-md-3 pr-md-3 no-repeat',
       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'
+        paddingTop: sectionproperties.paddingTop + 'px',
+        paddingBottom: sectionproperties.paddingBottom + 'px',
+        paddingLeft: sectionproperties.paddingLeft + 'px',
+        paddingRight: sectionproperties.paddingRight + 'px',
+        backgroundImage: maincontainerarrayofobjs.length != 0 ? 'url(' + serverbaselink$1 + maincontainerarrayofobjs[0].back_bgimage + ')' : '',
+        backgroundSize: 'cover',
+        background: sectionproperties.backgroundColor
       }
+    }, sectionproperties.collectionssectionshow == 'Show' && /*#__PURE__*/React.createElement("div", {
+      className: "col-lg-2 col-md-12 pl-2 pr-2 mb-md-3"
+    }, /*#__PURE__*/React.createElement(Categoriesdropdown, {
+      sectionpropertiesprops: sectionproperties,
+      actions: actions
     })), /*#__PURE__*/React.createElement("div", {
-      className: "".concat(bgcssstyles.bgImageContainer) + ' col-lg-12 p-0 w-100 ',
-      style: {
-        position: 'absolute',
-        top: 0,
-        right: 0,
-        bottom: 0,
-        left: 0,
-        zIndex: 1
-      }
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(bgcssstyles.centered_container) + ' row m-0 d-flex pt-0 '
+      className: sectionproperties.collectionssectionshow == 'Show' ? 'col-lg-10 col-md-12 p-md-0' : 'col-lg-12 p-0'
     }, /*#__PURE__*/React.createElement("div", {
-      className: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? ' p-0 d-flex flex-column d-md-none col-lg-12 ' : ' p-0 d-flex flex-column d-md-none col-lg-6 ',
-      style: {
-        position: 'relative',
-        overflow: 'hidden'
-      }
-    }, /*#__PURE__*/React.createElement("p", {
-      className: 'd-flex justify-content-md-center wordbreak',
-      style: {
-        maxWidth: '100%',
-        position: 'relative',
-        fontSize: bgimagearrayofobjs[index].bg1_fontsize + 'px',
-        color: bgimagearrayofobjs[index].bg1_txtcolor,
-        textTransform: bgimagearrayofobjs[index].bg1_txttransform,
-        fontWeight: bgimagearrayofobjs[index].bg1_fontweight,
-        top: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : bgimagearrayofobjs[index].bg1_texttop + 'px',
-        left: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : langdetect == 'en' ? bgimagearrayofobjs[index].bg1_textleft + 'px' : '',
-        right: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : langdetect == 'en' ? '' : bgimagearrayofobjs[index].bg1_textleft + 'px',
-        bottom: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : '',
-        margin: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 'auto' : '',
-        textAlign: langdetect == 'en' ? 'left' : 'right'
-      }
-    }, langdetect == 'en' ? bgimagearrayofobjs[index].bg1_text_en : bgimagearrayofobjs[index].bg1_text_ar), bgimagearrayofobjs[index].showdescription1 == 'Show' && /*#__PURE__*/React.createElement("p", {
-      className: 'd-flex justify-content-md-center wordbreak',
-      style: {
-        // maxWidth: '97%',
-        position: 'relative',
-        fontSize: bgimagearrayofobjs[index].bg1_desfontsize + 'px',
-        color: bgimagearrayofobjs[index].bg1_descolor,
-        textTransform: bgimagearrayofobjs[index].bg1_destxttransform,
-        fontWeight: bgimagearrayofobjs[index].bg1_desfontweight,
-        top: bgimagearrayofobjs[index].desc1top + 'px',
-        left: langdetect == 'en' ? bgimagearrayofobjs[index].desc1left + 'px' : '',
-        right: langdetect == 'en' ? '' : bgimagearrayofobjs[index].desc1left + 'px',
-        textAlign: langdetect == 'en' ? 'left' : 'right'
-      }
-    }, langdetect == 'en' ? bgimagearrayofobjs[index].bg1_descriptionen : bgimagearrayofobjs[index].bg1_descriptionar), bgimagearrayofobjs[index].showbutton1 == 'Show' && /*#__PURE__*/React.createElement("button", {
-      className: "".concat(bgcssstyles.btnone) + ' allcentered ',
-      style: {
-        top: bgimagearrayofobjs[index].bg1_btnpositiontop + 'px',
-        left: langdetect == 'en' ? bgimagearrayofobjs[index].bg1_btnpositionleft + 'px' : '',
-        right: langdetect == 'en' ? '' : bgimagearrayofobjs[index].bg1_btnpositionleft + 'px',
-        letterSpacing: langdetect == 'en' ? '1px' : 0
-      },
-      onClick: function onClick() {
-        if (item.IsClickable == 'Yes') {
-          if (item.place_clickable == 'Button') {
-            if (item.clickable_page_route && item.clickable_page_route.length != 0) {
-              routingcountext(item.clickable_page_route, false, '');
-            } else {
-              routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.Clickable_Reference_Collection_ID);
+      className: "row m-0 w-100"
+    }, Object.keys(bgimagearrayofobjs).length != 0 && bgimagearrayofobjs.map(function (item, index) {
+      // bgimagearrayofobjs.IsClickable
+      // bgimagearrayofobjs.clickable_page_route
+      // bgimagearrayofobjs.Clickable_Reference_Collection_ID
+      return /*#__PURE__*/React.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,
+        style: {
+          paddingLeft: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : '7px',
+          paddingRight: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : '7px',
+          cursor: item.place_clickable == 'General' ? 'pointer' : 'default'
+        },
+        onClick: function onClick() {
+          if (item.IsClickable == 'Yes') {
+            if (item.place_clickable == 'General') {
+              if (item.clickable_page_route && item.clickable_page_route.length != 0) {
+                routingcountext(item.clickable_page_route, false, '');
+              } else {
+                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.Clickable_Reference_Collection_ID);
+              }
             }
           }
         }
-      }
-    }, langdetect == 'en' ? sectionproperties.generalbtn_content : sectionproperties.slideshow_btn_text_ar, ' ', langdetect == 'en' ? /*#__PURE__*/React.createElement(IoIosArrowRoundForward, {
-      size: 20
-    }) : /*#__PURE__*/React.createElement(IoIosArrowRoundBack, {
-      size: 20
-    }))), /*#__PURE__*/React.createElement("div", {
-      className: "col-md-12 d-none d-md-flex flex-column mt-auto mb-auto "
-    }, /*#__PURE__*/React.createElement("p", {
-      className: "wordbreak m-0",
-      style: {
-        position: 'relative',
-        fontSize: bgimagearrayofobjs[index].bg1_fontsize + 'px',
-        color: bgimagearrayofobjs[index].bg1_txtcolor,
-        textTransform: bgimagearrayofobjs[index].bg1_txttransform,
-        fontWeight: bgimagearrayofobjs[index].bg1_fontweight,
-        textAlign: langdetect == 'en' ? 'left' : 'right'
-      }
-    }, langdetect == 'en' ? bgimagearrayofobjs[index].bg1_text_en : bgimagearrayofobjs[index].bg1_text_ar), bgimagearrayofobjs[index].showdescription1 == 'Show' && /*#__PURE__*/React.createElement("p", {
-      className: 'd-flex justify-content-md-center wordbreak m-0',
-      style: {
-        position: 'relative',
-        fontSize: bgimagearrayofobjs[index].bg1_desfontsize + 'px',
-        color: bgimagearrayofobjs[index].bg1_descolor,
-        textTransform: bgimagearrayofobjs[index].bg1_destxttransform,
-        fontWeight: bgimagearrayofobjs[index].bg1_desfontweight,
-        textAlign: langdetect == 'en' ? 'left' : 'right'
-      }
-    }, langdetect == 'en' ? bgimagearrayofobjs[index].bg1_descriptionen : bgimagearrayofobjs[index].bg1_descriptionar), bgimagearrayofobjs[index].showbutton1 == 'Show' && /*#__PURE__*/React.createElement("button", {
-      className: "".concat(bgcssstyles.btnresp) + ' mt-md-5 mt-sm-3 ',
-      onClick: function onClick() {
-        if (item.IsClickable == 'Yes') {
-          if (item.place_clickable == 'Button') {
-            if (item.clickable_page_route && item.clickable_page_route.length != 0) {
-              routingcountext(item.clickable_page_route, false, '');
-            } else {
-              routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.Clickable_Reference_Collection_ID);
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "row ml-0 mr-0 d-flex justify-content-center w-100"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: sectionproperties.bgcovercontainresponsive == 'Contain' ? 'col-lg-12 p-0 h-md-auto' : 'col-lg-12 p-0',
+        style: {
+          height: sectionproperties.image_height + 'vh'
+        }
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "".concat(bgcssstyles.bgimage) + ' d-md-flex d-sm-none ',
+        style: {
+          height: '100%',
+          width: '100%'
+        }
+      }, /*#__PURE__*/React.createElement(IKImage, {
+        urlEndpoint: IKurlEndpoint,
+        publicKey: IKpublicKey,
+        path: bgimagearrayofobjs.length != 0 ? langdetect == 'en' ? bgimagearrayofobjs[index].bg1_image : bgimagearrayofobjs[index].bg1_image_ar : '',
+        className: 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.createElement("div", {
+        className: "".concat(bgcssstyles.bgimage) + ' d-none d-md-none d-sm-flex',
+        style: {
+          height: '100%',
+          width: '100%'
+        }
+      }, /*#__PURE__*/React.createElement(IKImage, {
+        urlEndpoint: IKurlEndpoint,
+        publicKey: IKpublicKey,
+        path: bgimagearrayofobjs.length != 0 ? langdetect == 'en' ? bgimagearrayofobjs[index].bg1_imageresponsive : bgimagearrayofobjs[index].bg1_imageresponsive_ar : '',
+        className: 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.createElement("div", {
+        className: "".concat(bgcssstyles.bgImageContainer) + ' col-lg-12 p-0 w-100 ',
+        style: {
+          position: 'absolute',
+          top: 0,
+          right: 0,
+          bottom: 0,
+          left: 0,
+          zIndex: 1
+        }
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "".concat(bgcssstyles.centered_container) + ' row m-0 d-flex pt-0 '
+      }, /*#__PURE__*/React.createElement("div", {
+        className: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? ' p-0 d-flex flex-column d-md-none col-lg-12 ' : ' p-0 d-flex flex-column d-md-none col-lg-6 ',
+        style: {
+          position: 'relative',
+          overflow: 'hidden'
+        }
+      }, /*#__PURE__*/React.createElement("p", {
+        className: 'd-flex justify-content-md-center wordbreak',
+        style: {
+          maxWidth: '100%',
+          position: 'relative',
+          fontSize: bgimagearrayofobjs[index].bg1_fontsize + 'px',
+          color: bgimagearrayofobjs[index].bg1_txtcolor,
+          textTransform: bgimagearrayofobjs[index].bg1_txttransform,
+          fontWeight: bgimagearrayofobjs[index].bg1_fontweight,
+          top: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : bgimagearrayofobjs[index].bg1_texttop + 'px',
+          left: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : langdetect == 'en' ? bgimagearrayofobjs[index].bg1_textleft + 'px' : '',
+          right: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : langdetect == 'en' ? '' : bgimagearrayofobjs[index].bg1_textleft + 'px',
+          bottom: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 0 : '',
+          margin: bgimagearrayofobjs[index].bg1_numberofcols == '12' ? 'auto' : '',
+          textAlign: langdetect == 'en' ? 'left' : 'right'
+        }
+      }, langdetect == 'en' ? bgimagearrayofobjs[index].bg1_text_en : bgimagearrayofobjs[index].bg1_text_ar), bgimagearrayofobjs[index].showdescription1 == 'Show' && /*#__PURE__*/React.createElement("p", {
+        className: 'd-flex justify-content-md-center wordbreak',
+        style: {
+          // maxWidth: '97%',
+          position: 'relative',
+          fontSize: bgimagearrayofobjs[index].bg1_desfontsize + 'px',
+          color: bgimagearrayofobjs[index].bg1_descolor,
+          textTransform: bgimagearrayofobjs[index].bg1_destxttransform,
+          fontWeight: bgimagearrayofobjs[index].bg1_desfontweight,
+          top: bgimagearrayofobjs[index].desc1top + 'px',
+          left: langdetect == 'en' ? bgimagearrayofobjs[index].desc1left + 'px' : '',
+          right: langdetect == 'en' ? '' : bgimagearrayofobjs[index].desc1left + 'px',
+          textAlign: langdetect == 'en' ? 'left' : 'right'
+        }
+      }, langdetect == 'en' ? bgimagearrayofobjs[index].bg1_descriptionen : bgimagearrayofobjs[index].bg1_descriptionar), bgimagearrayofobjs[index].showbutton1 == 'Show' && /*#__PURE__*/React.createElement("button", {
+        className: "".concat(bgcssstyles.btnone) + ' allcentered ',
+        style: {
+          top: bgimagearrayofobjs[index].bg1_btnpositiontop + 'px',
+          left: langdetect == 'en' ? bgimagearrayofobjs[index].bg1_btnpositionleft + 'px' : '',
+          right: langdetect == 'en' ? '' : bgimagearrayofobjs[index].bg1_btnpositionleft + 'px',
+          letterSpacing: langdetect == 'en' ? '1px' : 0
+        },
+        onClick: function onClick() {
+          if (item.IsClickable == 'Yes') {
+            if (item.place_clickable == 'Button') {
+              if (item.clickable_page_route && item.clickable_page_route.length != 0) {
+                routingcountext(item.clickable_page_route, false, '');
+              } else {
+                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.Clickable_Reference_Collection_ID);
+              }
             }
           }
         }
-      }
-    }, langdetect == 'en' ? sectionproperties.generalbtn_content : sectionproperties.slideshow_btn_text_ar)))))));
-  }))))));
+      }, langdetect == 'en' ? sectionproperties.generalbtn_content : sectionproperties.slideshow_btn_text_ar, ' ', langdetect == 'en' ? /*#__PURE__*/React.createElement(IoIosArrowRoundForward, {
+        size: 20
+      }) : /*#__PURE__*/React.createElement(IoIosArrowRoundBack, {
+        size: 20
+      }))), /*#__PURE__*/React.createElement("div", {
+        className: "col-md-12 d-none d-md-flex flex-column mt-auto mb-auto "
+      }, /*#__PURE__*/React.createElement("p", {
+        className: "wordbreak m-0",
+        style: {
+          position: 'relative',
+          fontSize: bgimagearrayofobjs[index].bg1_fontsize + 'px',
+          color: bgimagearrayofobjs[index].bg1_txtcolor,
+          textTransform: bgimagearrayofobjs[index].bg1_txttransform,
+          fontWeight: bgimagearrayofobjs[index].bg1_fontweight,
+          textAlign: langdetect == 'en' ? 'left' : 'right'
+        }
+      }, langdetect == 'en' ? bgimagearrayofobjs[index].bg1_text_en : bgimagearrayofobjs[index].bg1_text_ar), bgimagearrayofobjs[index].showdescription1 == 'Show' && /*#__PURE__*/React.createElement("p", {
+        className: 'd-flex justify-content-md-center wordbreak m-0',
+        style: {
+          position: 'relative',
+          fontSize: bgimagearrayofobjs[index].bg1_desfontsize + 'px',
+          color: bgimagearrayofobjs[index].bg1_descolor,
+          textTransform: bgimagearrayofobjs[index].bg1_destxttransform,
+          fontWeight: bgimagearrayofobjs[index].bg1_desfontweight,
+          textAlign: langdetect == 'en' ? 'left' : 'right'
+        }
+      }, langdetect == 'en' ? bgimagearrayofobjs[index].bg1_descriptionen : bgimagearrayofobjs[index].bg1_descriptionar), bgimagearrayofobjs[index].showbutton1 == 'Show' && /*#__PURE__*/React.createElement("button", {
+        className: "".concat(bgcssstyles.btnresp) + ' mt-md-5 mt-sm-3 ',
+        onClick: function onClick() {
+          if (item.IsClickable == 'Yes') {
+            if (item.place_clickable == 'Button') {
+              if (item.clickable_page_route && item.clickable_page_route.length != 0) {
+                routingcountext(item.clickable_page_route, false, '');
+              } else {
+                routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, 'collections/' + item.Clickable_Reference_Collection_ID);
+              }
+            }
+          }
+        }
+      }, langdetect == 'en' ? sectionproperties.generalbtn_content : sectionproperties.slideshow_btn_text_ar)))))));
+    }))));
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "row m-0 w-100"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "col-lg-12 p-0 d-flex d-md-none",
+    style: {
+      marginTop: sectionproperties.marginTop + 'px',
+      marginBottom: sectionproperties.marginBottom + 'px'
+    }
+  }, BackgroundImage()), /*#__PURE__*/React.createElement("div", {
+    className: "col-lg-12 p-0 d-none d-md-flex",
+    style: {
+      marginTop: sectionproperties.marginTopResp + 'px',
+      marginBottom: sectionproperties.marginBottomResp + 'px'
+    }
+  }, BackgroundImage()));
 };
 
 function ownKeys$I(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; }