tabexseriescomponents 0.0.129 → 0.0.131

package/dist/index.cjs.js

@@ -48,6 +48,7 @@ var HiOutlineChevronRight = require('@react-icons/all-files/hi/HiOutlineChevronR
 var HiOutlineChevronLeft = require('@react-icons/all-files/hi/HiOutlineChevronLeft');
 var GoGlobe = require('@react-icons/all-files/go/GoGlobe');
 var VscGlobe = require('@react-icons/all-files/vsc/VscGlobe');
+var FiLayers = require('@react-icons/all-files/fi/FiLayers');
 var HiOutlineTrash = require('@react-icons/all-files/hi/HiOutlineTrash');
 var BiSad = require('@react-icons/all-files/bi/BiSad');
 var TextareaAutosize = require('react-textarea-autosize');
@@ -71,7 +72,6 @@ var reactHorizontalScrollingMenu = require('react-horizontal-scrolling-menu');
 var FaArrowAltCircleRight = require('@react-icons/all-files/fa/FaArrowAltCircleRight');
 var FaArrowAltCircleLeft = require('@react-icons/all-files/fa/FaArrowAltCircleLeft');
 var FiFilter = require('@react-icons/all-files/fi/FiFilter');
-var FiLayers = require('@react-icons/all-files/fi/FiLayers');
 var BiLogOutCircle = require('@react-icons/all-files/bi/BiLogOutCircle');
 var BiChevronDown = require('@react-icons/all-files/bi/BiChevronDown');
 var BiUser = require('@react-icons/all-files/bi/BiUser');
@@ -3445,7 +3445,7 @@ var Ordershistory = function Ordershistory(props) {
   }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-lg-12 p-0"
   }, !fetchorderhistoryQueryContext.isFetching && fetchorderhistoryQueryContext.isSuccess && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: 'row ml-0 mr-0 d-flex justify-content-center w-100 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2',
+    className: 'row ml-0 mr-0 d-flex justify-content-center w-100 pl-lg-4 pr-lg-4 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2',
     style: {
       marginTop: sectionproperties.marginTop + 'px',
       marginBottom: sectionproperties.marginBottom + 'px',
@@ -3564,7 +3564,8 @@ var Ordershistory = function Ordershistory(props) {
     className: "w-100",
     style: {
       background: 'white',
-      padding: '20px'
+      padding: '20px',
+      minHeight: '70vh'
     }
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(generalstyles.table_responsive) + ' col-lg-12 '
@@ -3724,7 +3725,7 @@ var Ordershistory = function Ordershistory(props) {
       className: "row m-0 w-100"
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: ' col-lg-12 col-md-12 d-flex p-0'
-    }, /*#__PURE__*/React__default["default"].createElement("div", {
+    }, item.mainproductimage != undefined && item.mainproductimage != '' && item.mainproductimage != null && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "".concat(orderhistory_cssstyles.tableimagecont)
     }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
       urlEndpoint: IKurlEndpoint,
@@ -3733,9 +3734,16 @@ var Ordershistory = function Ordershistory(props) {
       style: {
         width: '100%',
         height: '100%',
-        objectFit: 'cover'
+        objectFit: 'contain'
       },
       loading: "lazy"
+    })), item.mainproductimage == '' && /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "".concat(orderhistory_cssstyles.tableimagecont) + ' allcentered ',
+      style: {
+        background: '#eee'
+      }
+    }, /*#__PURE__*/React__default["default"].createElement(FiLayers.FiLayers, {
+      color: "#ccc"
     })), /*#__PURE__*/React__default["default"].createElement("div", {
       className: " pl-2 pr-2 ",
       style: {
@@ -3746,12 +3754,18 @@ var Ordershistory = function Ordershistory(props) {
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "col-lg-12 col-md-12 col-sm-12 p-0 d-flex align-items-start"
     }, /*#__PURE__*/React__default["default"].createElement("p", {
-      className: orderhistory_cssstyles.productNameStyles + ' p-0 m-0 wordbreak '
+      className: orderhistory_cssstyles.productNameStyles + ' p-0 m-0 wordbreak wordbreak3 ',
+      style: {
+        textAlign: langdetect == 'en' ? 'left' : 'right'
+      }
     }, item.productname)), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "col-lg-12 col-md-12 col-sm-12 p-0 d-flex align-items-center"
     }, /*#__PURE__*/React__default["default"].createElement("p", {
-      className: orderhistory_cssstyles.productPricestyles + ' m-0 p-0 wordbreak '
-    }, langdetect == 'en' ? 'EGP' : '', " ", item.finalprice, " x ", item.quantity, ' ', langdetect == 'en' ? '' : 'ج.م')), /*#__PURE__*/React__default["default"].createElement("div", {
+      className: orderhistory_cssstyles.productPricestyles + ' m-0 p-0 wordbreak d-flex flex-row ',
+      style: {
+        direction: 'ltr'
+      }
+    }, /*#__PURE__*/React__default["default"].createElement("div", null, item.quantity, " x ", item.finalprice, " ", langdetect == 'en' ? 'EGP' : 'ج.م'))), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "col-lg-12 col-md-12 col-sm-12 p-0 d-flex align-items-center"
     }, item.isvariant == 1 && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "row m-0 w-100"
@@ -4185,7 +4199,7 @@ var Wishlist = function Wishlist(props) {
   }, lang.mywishlist)))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-lg-12 p-0"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: 'row ml-0 mr-0 d-flex justify-content-center w-100 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2',
+    className: 'row ml-0 mr-0 d-flex justify-content-center w-100 pl-lg-4 pr-lg-4 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2',
     style: {
       width: sectionproperties.width + 'vw',
       marginTop: sectionproperties.marginTop + 'px',
@@ -4761,7 +4775,7 @@ var Viewcart = function Viewcart(props) {
   }, lang.mycart)))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-lg-12 p-0"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: 'row ml-0 mr-0 d-flex justify-content-center w-100 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2',
+    className: 'row ml-0 mr-0 d-flex justify-content-center w-100 pl-lg-4 pr-lg-4 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2',
     style: {
       marginTop: sectionproperties.marginTop + 'px',
       marginBottom: sectionproperties.marginBottom + 'px',
@@ -4836,13 +4850,16 @@ var Viewcart = function Viewcart(props) {
       style: {
         width: '100%',
         height: '100%',
-        objectFit: 'cover'
+        objectFit: 'contain'
       },
       loading: "lazy"
     })), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "col-lg-8 col-sm-8 col-md-8"
     }, /*#__PURE__*/React__default["default"].createElement("p", {
-      className: "".concat(viewcart_cssstyles.productNameStyles) + ' m-0 p-0 wordbreak d-flex justify-content-start '
+      className: "".concat(viewcart_cssstyles.productNameStyles) + ' m-0 p-0 wordbreak wordbreak3 d-flex justify-content-start ',
+      style: {
+        textAlign: langdetect == 'en' ? 'left' : 'right'
+      }
     }, langdetect == 'en' ? item.productinfo.name_en : item.productinfo.name_ar), item.productinfo.hasvariants == 1 && item.productinfo.variantinfo.variantoptions.map(function (variantitem, variantindex) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "col-lg-12 col-md-12 col-sm-12 p-0 d-flex"
@@ -7072,7 +7089,7 @@ var AccountInformation = function AccountInformation(props) {
   }, lang.accountinformation)))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-lg-12 p-0"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "row m-0 w-100 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2",
+    className: "row m-0 w-100 pl-lg-4 pr-lg-4 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2",
     style: {
       marginTop: sectionproperties.marginTop + 'px',
       marginBottom: sectionproperties.marginBottom + 'px',
@@ -7290,9 +7307,12 @@ var Policies = function Policies(props) {
       fontWeight: sectionproperties.imagetextfontWeight
     }
   }, lang.policies)))), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "col-lg-12 p-0"
+    className: "col-lg-12 p-0",
+    style: {
+      minHeight: '70vh'
+    }
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "row ml-0 mr-0 w-100 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2",
+    className: "row ml-0 mr-0 w-100 pl-lg-4 pr-lg-4 pl-md-3 pr-md-3 pl-sm-2 pr-sm-2",
     style: {
       marginTop: sectionproperties.marginTop + 'px',
       marginBottom: sectionproperties.marginBottom + 'px',
@@ -7707,7 +7727,10 @@ var CartSlider = function CartSlider(props) {
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "col-lg-12 col-md-12 col-sm-12 p-0 d-flex"
     }, /*#__PURE__*/React__default["default"].createElement("p", {
-      className: "".concat(cart_cssstyles.productNameStyles) + ' m-0 p-0 wordbreak d-flex align-items-start '
+      className: "".concat(cart_cssstyles.productNameStyles) + ' m-0 p-0 wordbreak wordbreak3 d-flex align-items-start ',
+      style: {
+        textAlign: langdetect == 'en' ? 'left' : 'right'
+      }
     }, langdetect == 'en' ? item.productinfo.name_en : item.productinfo.name_ar)), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "".concat(cart_cssstyles.productPricestyles) + ' col-lg-12 col-md-12 col-sm-12 p-0 d-flex '
     }, item.quantity, " x", /*#__PURE__*/React__default["default"].createElement("span", {
@@ -22513,8 +22536,8 @@ var TwoTieredHeader = function TwoTieredHeader(props) {
   }))))), /*#__PURE__*/React__default["default"].createElement("div", {
     "class": "col-xl-3 col-lg-4 plr-1025-1",
     style: {
-      paddingLeft: langdetect == 'en' ? '5rem' : 0,
-      paddingRight: langdetect == 'ar' ? '5rem' : 0
+      paddingLeft: langdetect == 'en' ? '3rem' : 0,
+      paddingRight: langdetect == 'ar' ? '3rem' : 0
     }
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     "class": "row m-0 w-100 d-flex align-items-center justify-content-between h-100"
@@ -23686,9 +23709,9 @@ var Allinonefooter = function Allinonefooter(props) {
       color: sectionproperties.iconcontainercolor,
       backgroundColor: sectionproperties.iconcontainerbg,
       border: sectionproperties.iconcontainer_borderWidth + 'px solid ' + sectionproperties.iconcontainer_bordercolor,
+      transition: '.3s',
       ':hover': {
-        backgroundColor: sectionproperties.iconcontainerbgonhover,
-        color: sectionproperties.iconcontainercoloronhover
+        backgroundColor: sectionproperties.iconcontainerbgonhover
       }
     }),
     iconTextStyle: glamor.css({
@@ -23697,9 +23720,10 @@ var Allinonefooter = function Allinonefooter(props) {
       fontWeight: sectionproperties.footerinfotext_secondaryfontweight
     }),
     footerinfoContainer: glamor.css({
-      ':hover .footerinfo': {
+      ':hover .iconStyle': {
         transition: '.3s',
-        color: sectionproperties.footerinfotext_coloronhover
+        color: sectionproperties.footerinfotext_coloronhover,
+        borderColor: sectionproperties.footerinfotext_coloronhover
       }
     }),
     logoStyles: glamor.css({
@@ -23815,7 +23839,7 @@ var Allinonefooter = function Allinonefooter(props) {
         window.open('tel:+' + (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i2 = authdetailsContext.instinfo) === null || _authdetailsContext$i2 === void 0 ? void 0 : (_authdetailsContext$i3 = _authdetailsContext$i2.contactinfo) === null || _authdetailsContext$i3 === void 0 ? void 0 : _authdetailsContext$i3.mobile), '_self');
       }
     }, /*#__PURE__*/React__default["default"].createElement("div", {
-      "class": "".concat(footerStyles.iconStyle) + ' allcentered ' + "".concat(langdetect == 'en' ? ' mr-2 ' : ' ml-2 ')
+      "class": "".concat(footerStyles.iconStyle) + ' allcentered iconStyle ' + "".concat(langdetect == 'en' ? ' mr-2 ' : ' ml-2 ')
     }, /*#__PURE__*/React__default["default"].createElement("i", {
       "class": "h-100 d-flex justify-content-center align-items-center"
     }, /*#__PURE__*/React__default["default"].createElement(AiOutlinePhone.AiOutlinePhone, {
@@ -23826,7 +23850,7 @@ var Allinonefooter = function Allinonefooter(props) {
         textAlign: langdetect == 'en' ? 'left' : 'right'
       }
     }, langdetect == 'en' ? 'Contact us' : 'إتصل بنا'), /*#__PURE__*/React__default["default"].createElement("p", {
-      "class": "".concat(footerStyles.iconTextStyle) + ' p-0 m-0 wordbreak footerinfo ',
+      "class": "".concat(footerStyles.iconTextStyle) + ' p-0 m-0 wordbreak iconStyle ',
       style: {
         textAlign: langdetect == 'en' ? 'left' : 'right'
       }
@@ -23837,7 +23861,7 @@ var Allinonefooter = function Allinonefooter(props) {
         window.open('mailto:' + (authdetailsContext === null || authdetailsContext === void 0 ? void 0 : (_authdetailsContext$i6 = authdetailsContext.instinfo) === null || _authdetailsContext$i6 === void 0 ? void 0 : (_authdetailsContext$i7 = _authdetailsContext$i6.contactinfo) === null || _authdetailsContext$i7 === void 0 ? void 0 : _authdetailsContext$i7.email), '_self');
       }
     }, /*#__PURE__*/React__default["default"].createElement("div", {
-      "class": "".concat(footerStyles.iconStyle) + ' allcentered ' + "".concat(langdetect == 'en' ? ' mr-2 ' : ' ml-2 ')
+      "class": "".concat(footerStyles.iconStyle) + ' allcentered iconStyle ' + "".concat(langdetect == 'en' ? ' mr-2 ' : ' ml-2 ')
     }, /*#__PURE__*/React__default["default"].createElement("i", {
       "class": "h-100 d-flex justify-content-center align-items-center"
     }, /*#__PURE__*/React__default["default"].createElement(AiOutlineMail.AiOutlineMail, {
@@ -23848,7 +23872,7 @@ var Allinonefooter = function Allinonefooter(props) {
         textAlign: langdetect == 'en' ? 'left' : 'right'
       }
     }, langdetect == 'en' ? 'Email' : 'البريد الإلكتروني'), /*#__PURE__*/React__default["default"].createElement("p", {
-      "class": "".concat(footerStyles.iconTextStyle) + ' p-0 m-0 wordbreak text-transform-none footerinfo ',
+      "class": "".concat(footerStyles.iconTextStyle) + ' p-0 m-0 wordbreak text-transform-none iconStyle ',
       style: {
         textAlign: langdetect == 'en' ? 'left' : 'right'
       }
@@ -35743,10 +35767,10 @@ var Slideshowfade = function Slideshowfade(props) {
     }, /*#__PURE__*/React__default["default"].createElement(imagekitioReact.IKImage, {
       urlEndpoint: IKurlEndpoint,
       publicKey: IKpublicKey,
-      path: langdetect == 'en' ? item.imageen : item.imagear,
+      path: langdetect == 'en' ? 'tr:w-2000,h-700' + item.imageen : 'tr:w-2000,h-700' + item.imagear,
       style: {
         cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
-        objectFit: 'cover',
+        objectFit: sectionproperties.bgcovercontain,
         margin: 0,
         padding: 0,
         width: '100%',
@@ -35775,7 +35799,7 @@ var Slideshowfade = function Slideshowfade(props) {
     }, /*#__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-2000,h-700' + item.image_resp_en : 'tr:w-2000,h-700' + item.image_resp_ar,
       style: {
         cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
         objectFit: 'contain',
@@ -36647,8 +36671,8 @@ var NewProductcard = function NewProductcard(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -36679,6 +36703,9 @@ var NewProductcard = function NewProductcard(props) {
       setsectionproperties(_objectSpread$x({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     colorvariantcontainer: glamor.css({
       width: sectionproperties.variantcontainer_minwidth + 'vh',
@@ -37042,8 +37069,8 @@ var UserCardWithSocialMediaOnHover = function UserCardWithSocialMediaOnHover(pro
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   var langdetect = props.actions.langdetect;
   props.actions.StaticPagesLinksContext;
@@ -37060,6 +37087,9 @@ var UserCardWithSocialMediaOnHover = function UserCardWithSocialMediaOnHover(pro
     });
     setsectionproperties(_objectSpread$w({}, secpropobj));
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -37210,8 +37240,8 @@ var Card20 = function Card20(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -37236,6 +37266,9 @@ var Card20 = function Card20(props) {
     });
     setsectionproperties(_objectSpread$v({}, secpropobj));
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var cardstyles = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -37452,8 +37485,8 @@ var Card21 = function Card21(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -37486,6 +37519,9 @@ var Card21 = function Card21(props) {
       setsectionproperties(_objectSpread$u({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var cardsstyles2 = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -37780,8 +37816,8 @@ var Card22 = function Card22(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -37814,6 +37850,9 @@ var Card22 = function Card22(props) {
       setsectionproperties(_objectSpread$t({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var cardsstyles2 = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -38008,8 +38047,8 @@ var Card23 = function Card23(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -38042,6 +38081,9 @@ var Card23 = function Card23(props) {
       setsectionproperties(_objectSpread$s({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var cardsstyles2 = {
     showmodal: glamor.css({
       backgroundColor: sectionproperties.generalbtn_bgColortransparent == 'Transparent' ? 'transparent' : sectionproperties.generalbtn_bgColor,
@@ -38302,12 +38344,15 @@ var Card23 = function Card23(props) {
       textAlign: langdetect == 'en' ? 'left' : 'right'
     }
   }, plainString(langdetect == 'en' ? item.description_en : item.description_ar)), sectionproperties.prodNameShow == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
-    "class": "col-lg-12 p-0 "
+    "class": "col-lg-12 p-0 ",
+    style: {
+      minHeight: '6vh'
+    }
   }, /*#__PURE__*/React__default["default"].createElement("p", {
     onClick: function onClick() {
       cardonclickfunctionContext(sectionproperties === null || sectionproperties === void 0 ? void 0 : sectionproperties.onClickRoute, item.productid, props.fetchingtypeprops, item.collectionid);
     },
-    "class": sectionproperties.wordbreak == '1' ? "".concat(cardsstyles2.productNameStyles) + '  wordbreak wordbreak1 m-0 ' : "".concat(cardsstyles2.productNameStyles) + '  wordbreak wordbreak2 m-0 ',
+    "class": sectionproperties.wordbreak == '1' ? "".concat(cardsstyles2.productNameStyles) + '  wordbreak wordbreak2 m-0 ' : "".concat(cardsstyles2.productNameStyles) + '  wordbreak wordbreak2 m-0 ',
     style: {
       textAlign: langdetect == 'en' ? 'left' : 'right'
     }
@@ -38364,8 +38409,8 @@ var CardBadgeSlideFromTop = function CardBadgeSlideFromTop(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -38398,6 +38443,9 @@ var CardBadgeSlideFromTop = function CardBadgeSlideFromTop(props) {
       setsectionproperties(_objectSpread$r({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var cardsstyles2 = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -38739,9 +38787,7 @@ var Productcard_with_zoominonhover = function Productcard_with_zoominonhover(pro
     }
   }, [StatePagePropertiesContext]);
   React.useEffect(function () {
-    if (props.cardinfoitemprops != undefined) {
-      setitem(props.cardinfoitemprops);
-    }
+    setitem(props.cardinfoitemprops);
   }, [props.cardinfoitemprops]);
   var updatequantity = function updatequantity(type) {
     var tempitem = _objectSpread$q({}, item);
@@ -39210,8 +39256,8 @@ var Categorycard_with_twolinestransition = function Categorycard_with_twolinestr
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   var langdetect = props.actions.langdetect;
   props.actions.routingcountext;
@@ -39240,6 +39286,9 @@ var Categorycard_with_twolinestransition = function Categorycard_with_twolinestr
       setsectionproperties(_objectSpread$p({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var plainString = function plainString(html) {
     var divContainer = document.createElement('div');
     divContainer.innerHTML = html;
@@ -39387,8 +39436,8 @@ var Categorycard_fullimage = function Categorycard_fullimage(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -39421,6 +39470,9 @@ var Categorycard_fullimage = function Categorycard_fullimage(props) {
       setsectionproperties(_objectSpread$o({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -39586,8 +39638,8 @@ var Categorycard_slidebgscaled = function Categorycard_slidebgscaled(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -39616,6 +39668,9 @@ var Categorycard_slidebgscaled = function Categorycard_slidebgscaled(props) {
       setsectionproperties(_objectSpread$n({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var categorycard_cssstyles = {
     categoryCard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? sectionproperties.backgroundColor : '',
@@ -39765,8 +39820,8 @@ var Categorycard_with_trianglebg = function Categorycard_with_trianglebg(props)
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -39795,6 +39850,9 @@ var Categorycard_with_trianglebg = function Categorycard_with_trianglebg(props)
       setsectionproperties(_objectSpread$m({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var categorycard_cssstyles = {
     cardcontainer: glamor.css({
       position: 'relative',
@@ -39924,8 +39982,8 @@ var Categorycard_withshapes = function Categorycard_withshapes(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   props.actions.langdetect;
@@ -39958,6 +40016,9 @@ var Categorycard_withshapes = function Categorycard_withshapes(props) {
       setsectionproperties(_objectSpread$l({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     categoryCard: glamor.css((_css = {
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? sectionproperties.backgroundColor : '',
@@ -40078,8 +40139,8 @@ var Categorycard_withtext = function Categorycard_withtext(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -40112,6 +40173,9 @@ var Categorycard_withtext = function Categorycard_withtext(props) {
       setsectionproperties(_objectSpread$k({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var categorycard_cssstyles = {
     categorycard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -40254,8 +40318,8 @@ var CategoryCardwithhoveraction = function CategoryCardwithhoveraction(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -40288,6 +40352,9 @@ var CategoryCardwithhoveraction = function CategoryCardwithhoveraction(props) {
       setsectionproperties(_objectSpread$j({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     cardcontainer: glamor.css({
       marginTop: sectionproperties.marginTop + 'px',
@@ -40421,8 +40488,8 @@ var Classiccategorycard = function Classiccategorycard(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -40448,6 +40515,9 @@ var Classiccategorycard = function Classiccategorycard(props) {
       setsectionproperties(_objectSpread$i({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     imagestyle: glamor.css({
       width: sectionproperties.image_width + 'px',
@@ -40551,8 +40621,8 @@ var Horizontalcard = function Horizontalcard(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   var lang = props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -40581,6 +40651,9 @@ var Horizontalcard = function Horizontalcard(props) {
       setsectionproperties(_objectSpread$h({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css({
       marginTop: sectionproperties.marginTop + 'px',
@@ -40826,6 +40899,9 @@ var MenuCard = function MenuCard(props) {
       setsectionproperties(_objectSpread$g({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var plainString = function plainString(html) {
     var divContainer = document.createElement('div');
     divContainer.innerHTML = html;
@@ -41286,6 +41362,9 @@ var ModernCardWithQuantityButton = function ModernCardWithQuantityButton(props)
       setsectionproperties(_objectSpread$f({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   React.useEffect(function () {
     if (props.cardinfoitemprops != undefined) {
       setitem(props.cardinfoitemprops);
@@ -41722,6 +41801,9 @@ var ModernProductCard = function ModernProductCard(props) {
       setsectionproperties(_objectSpread$e({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var plainString = function plainString(html) {
     var divContainer = document.createElement('div');
     divContainer.innerHTML = html;
@@ -42086,8 +42168,8 @@ var Productcard_animatedbuttons = function Productcard_animatedbuttons(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -42118,6 +42200,9 @@ var Productcard_animatedbuttons = function Productcard_animatedbuttons(props) {
       setsectionproperties(_objectSpread$d({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -42359,8 +42444,8 @@ var Productcard_with_circularbg = function Productcard_with_circularbg(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   var lang = props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -42395,6 +42480,9 @@ var Productcard_with_circularbg = function Productcard_with_circularbg(props) {
       setsectionproperties(_objectSpread$c({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productCard: glamor.css({
       position: 'relative',
@@ -42597,8 +42685,8 @@ var Productcard_with_circularhover = function Productcard_with_circularhover(pro
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   var lang = props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -42629,6 +42717,9 @@ var Productcard_with_circularhover = function Productcard_with_circularhover(pro
       setsectionproperties(_objectSpread$b({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     cardContainer: glamor.css({
       // minHeight: 600,
@@ -42867,8 +42958,8 @@ var Productcard_with_slideanimation = function Productcard_with_slideanimation(p
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   var lang = props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -42899,6 +42990,9 @@ var Productcard_with_slideanimation = function Productcard_with_slideanimation(p
       setsectionproperties(_objectSpread$a({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css({
       position: 'relative',
@@ -43118,8 +43212,8 @@ var Productcard_with_variants = function Productcard_with_variants(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -43150,6 +43244,9 @@ var Productcard_with_variants = function Productcard_with_variants(props) {
       setsectionproperties(_objectSpread$9({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     colorvariantcontainer: glamor.css({
       width: sectionproperties.variantcontainer_minwidth + 'vh',
@@ -43463,8 +43560,8 @@ var Productcard6 = function Productcard6(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   var lang = props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -43495,6 +43592,9 @@ var Productcard6 = function Productcard6(props) {
       setsectionproperties(_objectSpread$8({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css((_css = {
       position: 'relative',
@@ -43682,8 +43782,8 @@ var Productcard7 = function Productcard7(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -43714,6 +43814,9 @@ var Productcard7 = function Productcard7(props) {
       setsectionproperties(_objectSpread$7({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -43928,8 +44031,8 @@ var Productcarddefault = function Productcarddefault(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -43960,6 +44063,9 @@ var Productcarddefault = function Productcarddefault(props) {
       setsectionproperties(_objectSpread$6({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -44205,6 +44311,9 @@ var Productccard_with_imageontopleft = function Productccard_with_imageontopleft
       setsectionproperties(_objectSpread$5({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   React.useEffect(function () {
     if (props.cardinfoitemprops != undefined) {
       setitem(props.cardinfoitemprops);
@@ -44470,6 +44579,9 @@ var Prouductcard_with_zoomhover = function Prouductcard_with_zoomhover(props) {
       setsectionproperties(_objectSpread$4({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   React.useEffect(function () {
     if (props.cardinfoitemprops != undefined) {
       setitem(props.cardinfoitemprops);
@@ -44566,8 +44678,8 @@ var Simplecategorycardwithtextbelow = function Simplecategorycardwithtextbelow(p
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   var langdetect = props.actions.langdetect;
   var cardonclickfunctionContext = props.actions.cardonclickfunctionContext;
@@ -44586,6 +44698,9 @@ var Simplecategorycardwithtextbelow = function Simplecategorycardwithtextbelow(p
     });
     setsectionproperties(_objectSpread$3({}, secpropobj));
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var plainString = function plainString(html) {
     var divContainer = document.createElement('div');
     divContainer.innerHTML = html;
@@ -44709,8 +44824,8 @@ var Simpleproductcard = function Simpleproductcard(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   var lang = props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -44745,6 +44860,9 @@ var Simpleproductcard = function Simpleproductcard(props) {
       setsectionproperties(_objectSpread$2({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css({
       background: sectionproperties.backgroundColortransparent == 'Transparent' ? 'transparent' : sectionproperties.backgroundColor,
@@ -44962,8 +45080,8 @@ var StylishProductCard = function StylishProductCard(props) {
     setsectionproperties = _useState2[1];
   var _useState3 = React.useState(props.cardinfoitemprops),
     _useState4 = _slicedToArray__default["default"](_useState3, 2),
-    item = _useState4[0];
-    _useState4[1];
+    item = _useState4[0],
+    setitem = _useState4[1];
   var StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
   props.actions.lang;
   var langdetect = props.actions.langdetect;
@@ -44994,6 +45112,9 @@ var StylishProductCard = function StylishProductCard(props) {
       setsectionproperties(_objectSpread$1({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   var card_cssstyles = {
     productcard: glamor.css({
       marginTop: sectionproperties.marginTop + 'px',
@@ -45316,6 +45437,9 @@ var ProductCardWithTextOnImage = function ProductCardWithTextOnImage(props) {
       setsectionproperties(_objectSpread({}, secpropobj));
     }
   }, [StatePagePropertiesContext]);
+  React.useEffect(function () {
+    setitem(props.cardinfoitemprops);
+  }, [props.cardinfoitemprops]);
   React.useEffect(function () {
     if (sectionproperties.length != 0 && sectionproperties.arrayofobjectimagesonly != undefined) {
       var arrayofobjectimagesonlyparsed = JSON.parse(sectionproperties.arrayofobjectimagesonly);