tabexseriescomponents 0.0.796 → 0.0.797

package/dist/index.umd.js

@@ -18677,6 +18677,7 @@
             cardobj.hasvariants = arrayItem.productinfo.hasvariants;
             cardobj.description_en = arrayItem.productinfo.description_en;
             cardobj.description_ar = arrayItem.productinfo.description_ar;
+            cardobj.productmainimage = arrayItem.productinfo.productmainimage;
             if (sectionproperties.removedecimals == 'Without Decimals') {
               cardobj.defaultprice = parseFloat(Number(arrayItem.productinfo.defaultprice).toFixed(2));
             } else if (sectionproperties.removedecimals == 'Without Decimals and Separated With Comma') {
@@ -67529,165 +67530,171 @@
           }
         }, langdetect == 'en' ? 'SHOP' : 'تسوق', ' ')));
       };
-      return /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": ' row m-0 w-100 d-flex justify-content-center align-items-center ',
-        style: {
-          background: sectionproperties.lower_section_background
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": 'col-lg-12 p-0 d-flex justify-content-center'
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": slideshow_styles.contt,
-        style: {
-          // height: sectionproperties.height + 'vh',
-        }
-      }, /*#__PURE__*/React__default["default"].createElement(reactSlideshowImage.Fade, _extends__default["default"]({}, Slideshowsettings, {
-        transitionDuration: 1500,
-        duration: 1500,
-        arrow: true,
-        easing: "ease"
-      }), Object.keys(bgimagearrayofobjs).length != 0 && bgimagearrayofobjs.map(function (item, index) {
+      var SlideshowallContent = function SlideshowallContent() {
         return /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": sectionproperties.zoominimagewhenhover == 'Yes' ? 'row m-0 w-100 slideshowzoomonhover' : 'row m-0 w-100 ',
+          "class": slideshow_styles.contt,
           style: {
-            borderTopLeftRadius: sectionproperties.borderTopLeftRadius + 'px',
-            borderTopRightRadius: sectionproperties.borderTopRightRadius + 'px',
-            borderBottomRightRadius: sectionproperties.borderBottomRightRadius + 'px',
-            borderBottomLeftRadius: sectionproperties.borderBottomLeftRadius + 'px'
+            // height: sectionproperties.height + 'vh',
           }
-        }, /*#__PURE__*/React__default["default"].createElement("div", {
-          onClick: function onClick() {
-            if (sectionproperties.showcurrencylangcont != 'Show') {
-              if (item.IsClickableimg == 'Yes') {
-                if (item.clickableimg_page_route && item.clickableimg_page_route.length != 0) {
-                  routingcountext(item.clickableimg_page_route, false, '');
-                } else {
-                  routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, item.Clickableimg_getcoection);
+        }, /*#__PURE__*/React__default["default"].createElement(reactSlideshowImage.Fade, _extends__default["default"]({}, Slideshowsettings, {
+          transitionDuration: 1500,
+          duration: 1500,
+          arrow: true,
+          easing: "ease"
+        }), Object.keys(bgimagearrayofobjs).length != 0 && bgimagearrayofobjs.map(function (item, index) {
+          return /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": sectionproperties.zoominimagewhenhover == 'Yes' ? 'row m-0 w-100 slideshowzoomonhover' : 'row m-0 w-100 ',
+            style: {
+              borderTopLeftRadius: sectionproperties.borderTopLeftRadius + 'px',
+              borderTopRightRadius: sectionproperties.borderTopRightRadius + 'px',
+              borderBottomRightRadius: sectionproperties.borderBottomRightRadius + 'px',
+              borderBottomLeftRadius: sectionproperties.borderBottomLeftRadius + 'px'
+            }
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            onClick: function onClick() {
+              if (sectionproperties.showcurrencylangcont != 'Show') {
+                if (item.IsClickableimg == 'Yes') {
+                  if (item.clickableimg_page_route && item.clickableimg_page_route.length != 0) {
+                    routingcountext(item.clickableimg_page_route, false, '');
+                  } else {
+                    routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, item.Clickableimg_getcoection);
+                  }
                 }
               }
+            },
+            "class": 'p-0 align-items-center d-sm-none ',
+            key: index,
+            style: {
+              cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
+              direction: langdetect == 'en' ? 'ltr' : 'rtl',
+              width: '100%',
+              height: sectionproperties.height != 0 ? sectionproperties.height + 'vh' : 'auto',
+              paddingTop: sectionproperties.paddingTop + 'px'
             }
-          },
-          "class": 'p-0 align-items-center d-sm-none ',
-          key: index,
-          style: {
-            cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
-            direction: langdetect == 'en' ? 'ltr' : 'rtl',
-            width: '100%',
-            height: sectionproperties.height != 0 ? sectionproperties.height + 'vh' : 'auto',
-            paddingTop: sectionproperties.paddingTop + 'px'
-          }
-        }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
-          urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
-          publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
-          path: langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.imageen : '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.imagear,
-          style: {
-            cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
-            objectFit: sectionproperties.bgcovercontain == 'Contain' ? 'contain' : 'cover',
-            margin: 0,
-            padding: 0,
-            width: '100%',
-            height: '100%',
-            borderRadius: sectionproperties.imageborderradius + 'px'
-          }
-        }), sectionproperties.showcurrencylangcont == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": 'row m-0 w-100 pl-md-2 pr-md-2',
-          style: {
-            position: 'absolute',
-            top: '20%',
-            zIndex: 1000,
-            paddingTop: sectionproperties.paddingTop + 'px',
-            paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : '',
-            paddingRight: langdetect == 'en' ? '' : sectionproperties.paddingLeft + 'px'
-          }
-        }, LanguageCurrencyCont(item)), sectionproperties.showcurrencylangcont != 'Show' && SlideShowTextContainer(item)), /*#__PURE__*/React__default["default"].createElement("div", {
-          onClick: function onClick() {
-            if (sectionproperties.showcurrencylangcont != 'Show') {
-              if (item.IsClickableimg == 'Yes') {
-                if (item.clickableimg_page_route && item.clickableimg_page_route.length != 0) {
-                  routingcountext(item.clickableimg_page_route, false, '');
-                } else {
-                  routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, item.Clickableimg_getcoection);
+          }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
+            urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
+            publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
+            path: langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.imageen : '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.imagear,
+            style: {
+              cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
+              objectFit: sectionproperties.bgcovercontain == 'Contain' ? 'contain' : 'cover',
+              margin: 0,
+              padding: 0,
+              width: '100%',
+              height: '100%',
+              borderRadius: sectionproperties.imageborderradius + 'px'
+            }
+          }), sectionproperties.showcurrencylangcont == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": 'row m-0 w-100 pl-md-2 pr-md-2',
+            style: {
+              position: 'absolute',
+              top: '20%',
+              zIndex: 1000,
+              paddingTop: sectionproperties.paddingTop + 'px',
+              paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : '',
+              paddingRight: langdetect == 'en' ? '' : sectionproperties.paddingLeft + 'px'
+            }
+          }, LanguageCurrencyCont(item)), sectionproperties.showcurrencylangcont != 'Show' && SlideShowTextContainer(item)), /*#__PURE__*/React__default["default"].createElement("div", {
+            onClick: function onClick() {
+              if (sectionproperties.showcurrencylangcont != 'Show') {
+                if (item.IsClickableimg == 'Yes') {
+                  if (item.clickableimg_page_route && item.clickableimg_page_route.length != 0) {
+                    routingcountext(item.clickableimg_page_route, false, '');
+                  } else {
+                    routingcountext(StaticPagesLinksContext.GeneralProductsComponent, true, item.Clickableimg_getcoection);
+                  }
                 }
               }
+            },
+            "class": 'p-0 align-items-center d-none d-sm-flex ',
+            key: index,
+            style: {
+              cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
+              width: '100%',
+              height: 'auto',
+              paddingTop: sectionproperties.paddingTop + 'px',
+              paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : '',
+              paddingRight: langdetect == 'en' ? '' : sectionproperties.paddingLeft + 'px'
             }
-          },
-          "class": 'p-0 align-items-center d-none d-sm-flex ',
-          key: index,
-          style: {
-            cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
-            width: '100%',
-            height: 'auto',
-            paddingTop: sectionproperties.paddingTop + 'px',
-            paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : '',
-            paddingRight: langdetect == 'en' ? '' : sectionproperties.paddingLeft + 'px'
-          }
-        }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
-          urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
-          publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
-          path: langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w_resp + ',h-' + sectionproperties.imagetr_h_resp + '/' + item.image_resp_en : '/tr:w-' + sectionproperties.imagetr_w_resp + ',h-' + sectionproperties.imagetr_h_resp + '/' + item.image_resp_ar,
-          style: {
-            cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
-            objectFit: 'contain',
-            margin: 0,
-            padding: 0,
-            width: '100%',
-            height: '100%',
-            borderRadius: sectionproperties.imageborderradius + 'px'
-          }
-        }), sectionproperties.showcurrencylangcont == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": 'row m-0 w-100 pl-md-2 pr-md-2',
-          style: {
-            position: 'absolute',
-            top: '20%',
-            zIndex: 1000,
-            paddingTop: sectionproperties.paddingTop + 'px',
-            paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : '',
-            paddingRight: langdetect == 'en' ? '' : sectionproperties.paddingLeft + 'px'
-          }
-        }, LanguageCurrencyCont(item)), sectionproperties.showcurrencylangcont != 'Show' && SlideShowTextContainer(item)));
-      })), cardsarray.length != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "".concat(slideshow_styles.innerSection) + ' col-lg-9 col-md-10 col-sm-10 ml-auto mr-auto '
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": ' row m-0 w-100 align-items-center justify-content-center '
-      }, cardsarray.map(function (cardItem, cardinfoindex) {
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": "col-lg-3 col-md-6 col-sm-12 d-flex align-items-center justify-content-center justify-content-md-start mb-md-2 mb-sm-3 p-0"
-        }, /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": "row m-0 w-100 d-flex align-items-center"
+          }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
+            urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
+            publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
+            path: langdetect == 'en' ? '/tr:w-' + sectionproperties.imagetr_w_resp + ',h-' + sectionproperties.imagetr_h_resp + '/' + item.image_resp_en : '/tr:w-' + sectionproperties.imagetr_w_resp + ',h-' + sectionproperties.imagetr_h_resp + '/' + item.image_resp_ar,
+            style: {
+              cursor: item.IsClickableimg == 'Yes' ? 'pointer' : 'default',
+              objectFit: 'contain',
+              margin: 0,
+              padding: 0,
+              width: '100%',
+              height: '100%',
+              borderRadius: sectionproperties.imageborderradius + 'px'
+            }
+          }), sectionproperties.showcurrencylangcont == 'Show' && /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": 'row m-0 w-100 pl-md-2 pr-md-2',
+            style: {
+              position: 'absolute',
+              top: '20%',
+              zIndex: 1000,
+              paddingTop: sectionproperties.paddingTop + 'px',
+              paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : '',
+              paddingRight: langdetect == 'en' ? '' : sectionproperties.paddingLeft + 'px'
+            }
+          }, LanguageCurrencyCont(item)), sectionproperties.showcurrencylangcont != 'Show' && SlideShowTextContainer(item)));
+        })), cardsarray.length != 0 && /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "".concat(slideshow_styles.innerSection) + ' col-lg-9 col-md-10 col-sm-10 ml-auto mr-auto '
         }, /*#__PURE__*/React__default["default"].createElement("div", {
-          style: {
-            width: '70px',
-            height: '70px'
-          }
-        }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
-          urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
-          publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
-          path: cardsarray.length != 0 ? cardItem.cardobj_img : '',
-          style: {
-            width: '100%',
-            height: '100%',
-            borderRadius: '100%'
-          }
-        })), /*#__PURE__*/React__default["default"].createElement("div", {
-          "class": "col-lg-8 col-md-8 col-sm-8 d-flex flex-column"
-        }, /*#__PURE__*/React__default["default"].createElement("p", {
-          "class": "p-0 m-0 wordbreak wordbreak1",
-          style: {
-            color: sectionproperties.sectionTitleColor,
-            fontSize: sectionproperties.sectionTitleFontSize + 'px',
-            fontWeight: sectionproperties.sectionTitleFontWeight,
-            textAlign: langdetect == 'en' ? 'left' : 'right'
-          }
-        }, langdetect == 'en' ? cardItem.cardobj_titleen : cardItem.cardobj_titlear), /*#__PURE__*/React__default["default"].createElement("p", {
-          "class": "m-0 wordbreak wordbreak1",
-          style: {
-            color: sectionproperties.prodCatColor,
-            fontSize: sectionproperties.prodCatFontSize + 'px',
-            fontWeight: sectionproperties.prodCatFontWeight,
-            textAlign: langdetect == 'en' ? 'left' : 'right'
-          }
-        }, langdetect == 'en' ? cardItem.cardobj_descripen : cardItem.cardobj_descripar))));
-      }))))));
+          "class": ' row m-0 w-100 align-items-center justify-content-center '
+        }, cardsarray.map(function (cardItem, cardinfoindex) {
+          return /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "col-lg-3 col-md-6 col-sm-12 d-flex align-items-center justify-content-center justify-content-md-start mb-md-2 mb-sm-3 p-0"
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "row m-0 w-100 d-flex align-items-center"
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            style: {
+              width: '70px',
+              height: '70px'
+            }
+          }, /*#__PURE__*/React__default["default"].createElement(Imagekitimagecomp, {
+            urlEndpoint: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimageendpoint,
+            publicKey: ikimagecredcontext === null || ikimagecredcontext === void 0 ? void 0 : ikimagecredcontext.ikimagepublickey,
+            path: cardsarray.length != 0 ? cardItem.cardobj_img : '',
+            style: {
+              width: '100%',
+              height: '100%',
+              borderRadius: '100%'
+            }
+          })), /*#__PURE__*/React__default["default"].createElement("div", {
+            "class": "col-lg-8 col-md-8 col-sm-8 d-flex flex-column"
+          }, /*#__PURE__*/React__default["default"].createElement("p", {
+            "class": "p-0 m-0 wordbreak wordbreak1",
+            style: {
+              color: sectionproperties.sectionTitleColor,
+              fontSize: sectionproperties.sectionTitleFontSize + 'px',
+              fontWeight: sectionproperties.sectionTitleFontWeight,
+              textAlign: langdetect == 'en' ? 'left' : 'right'
+            }
+          }, langdetect == 'en' ? cardItem.cardobj_titleen : cardItem.cardobj_titlear), /*#__PURE__*/React__default["default"].createElement("p", {
+            "class": "m-0 wordbreak wordbreak1",
+            style: {
+              color: sectionproperties.prodCatColor,
+              fontSize: sectionproperties.prodCatFontSize + 'px',
+              fontWeight: sectionproperties.prodCatFontWeight,
+              textAlign: langdetect == 'en' ? 'left' : 'right'
+            }
+          }, langdetect == 'en' ? cardItem.cardobj_descripen : cardItem.cardobj_descripar))));
+        }))));
+      };
+      return /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": ' row m-0 w-100 d-flex justify-content-center align-items-center ',
+        style: {
+          background: sectionproperties.lower_section_background
+        }
+      }, sectionproperties.showanimation == 'Yes' && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": 'col-lg-12 p-0 d-flex justify-content-center',
+        "data-aos": 'fade-up'
+      }, SlideshowallContent()), sectionproperties.showanimation != 'Yes' && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": 'col-lg-12 p-0 d-flex justify-content-center'
+      }, SlideshowallContent()));
     };
 
     function ownKeys$P(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; }
@@ -68205,6 +68212,28 @@
           }), SlideShowTextContainer(item)));
         }))))));
       };
+      var SlideshowallContent = function SlideshowallContent() {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "col-lg-12 p-0",
+          "data-aos": 'fade-up'
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "row m-0 w-100 d-flex d-md-none",
+          style: {
+            paddingTop: sectionproperties.marginTop + 'px'
+          },
+          onMouseLeave: function onMouseLeave() {
+            setChoosenindex('');
+          }
+        }, SlideshowContent()), /*#__PURE__*/React__default["default"].createElement("div", {
+          "class": "row m-0 w-100 d-none d-md-flex",
+          style: {
+            paddingTop: sectionproperties.marginTopResp + 'px'
+          },
+          onMouseLeave: function onMouseLeave() {
+            setChoosenindex('');
+          }
+        }, SlideshowContent()));
+      };
       return /*#__PURE__*/React__default["default"].createElement("div", {
         "class": sectionproperties.collectionssectionshow == 'Show' ? 'row ml-0 mr-0 w-100 d-flex justify-content-center px-1025-1 pl-md-2 pr-md-2' : sectionproperties.width == '100' ? 'row ml-0 mr-0 w-100 d-flex justify-content-center' : 'row ml-0 mr-0 w-100 d-flex justify-content-center px-1025-1 pl-md-2 pr-md-2',
         style: {
@@ -68216,25 +68245,12 @@
         onMouseEnter: function onMouseEnter() {
           setChoosenindex('');
         }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "col-lg-12 p-0"
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "row m-0 w-100 d-flex d-md-none",
-        style: {
-          paddingTop: sectionproperties.marginTop + 'px'
-        },
-        onMouseLeave: function onMouseLeave() {
-          setChoosenindex('');
-        }
-      }, SlideshowContent()), /*#__PURE__*/React__default["default"].createElement("div", {
-        "class": "row m-0 w-100 d-none d-md-flex",
-        style: {
-          paddingTop: sectionproperties.marginTopResp + 'px'
-        },
-        onMouseLeave: function onMouseLeave() {
-          setChoosenindex('');
-        }
-      }, SlideshowContent())));
+      }, sectionproperties.showanimation == 'Yes' && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "row m-0 w-100",
+        "data-aos": 'fade-up'
+      }, SlideshowallContent()), sectionproperties.showanimation != 'Yes' && /*#__PURE__*/React__default["default"].createElement("div", {
+        "class": "row m-0 w-100"
+      }, SlideshowallContent()));
     };
 
     function ownKeys$O(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; }
@@ -81780,14 +81796,14 @@
             style: {
               // backgroundColor: isChoosedValueExists ? 'lightblue' : 'white',
               color: isChoosedValueExists ? '#ffffff' : '#000000',
-              border: isChoosedValueExists ? '1px solid #617464' : '1px solid #000000',
+              border: isChoosedValueExists ? '1px solid ' + sectionproperties.activeproductcolor : '1px solid ' + sectionproperties.variantcontainerbordercolor,
               padding: (item === null || item === void 0 || (_item$option_info = item.option_info) === null || _item$option_info === void 0 ? void 0 : _item$option_info.optionname) == 'Color' ? '5px' : '5px 10px',
               cursor: valitem.disabled ? 'not-allowed' : 'pointer',
               fontSize: '13px',
               width: (item === null || item === void 0 || (_item$option_info2 = item.option_info) === null || _item$option_info2 === void 0 ? void 0 : _item$option_info2.optionname) == 'Color' ? 25 : '',
               height: (item === null || item === void 0 || (_item$option_info3 = item.option_info) === null || _item$option_info3 === void 0 ? void 0 : _item$option_info3.optionname) == 'Color' ? 25 : '',
               borderRadius: (item === null || item === void 0 || (_item$option_info4 = item.option_info) === null || _item$option_info4 === void 0 ? void 0 : _item$option_info4.optionname) == 'Color' ? 100 : 5,
-              background: (item === null || item === void 0 || (_item$option_info5 = item.option_info) === null || _item$option_info5 === void 0 ? void 0 : _item$option_info5.optionname) == 'Color' ? valitem === null || valitem === void 0 || (_valitem$valueinfo = valitem.valueinfo) === null || _valitem$valueinfo === void 0 ? void 0 : _valitem$valueinfo.valuename : isChoosedValueExists ? '#617464' : '#ffffff',
+              background: (item === null || item === void 0 || (_item$option_info5 = item.option_info) === null || _item$option_info5 === void 0 ? void 0 : _item$option_info5.optionname) == 'Color' ? valitem === null || valitem === void 0 || (_valitem$valueinfo = valitem.valueinfo) === null || _valitem$valueinfo === void 0 ? void 0 : _valitem$valueinfo.valuename : isChoosedValueExists ? sectionproperties.activeproductcolor : '#ffffff',
               fontWeight: 500
             },
             disabled: valitem.disabled
@@ -81847,6 +81863,24 @@
       React.useEffect(function () {
         setitem(props.cardinfoitemprops);
       }, [props.cardinfoitemprops]);
+      React.useEffect(function () {
+        var productImagetoBeSelected = '';
+        var Tempitem = _objectSpread$6({}, item);
+        productImagetoBeSelected = item.productmainimage;
+        if (variantObj != undefined && variantObj != null && Object.keys(variantObj).length != 0 && variantObj != '') {
+          var variatgalleryid = variantObj.variantgalleryid;
+          if (variatgalleryid != undefined && variatgalleryid != null && variatgalleryid != '') {
+            var _item$productimages;
+            item === null || item === void 0 || (_item$productimages = item.productimages) === null || _item$productimages === void 0 || _item$productimages.forEach(function (item, index) {
+              if (item.galleryid == variatgalleryid) {
+                productImagetoBeSelected = item.path;
+              }
+            });
+          }
+        }
+        Tempitem.image = productImagetoBeSelected;
+        setitem(_objectSpread$6({}, Tempitem));
+      }, [variantObj]);
       var card_cssstyles = {
         productcard: glamor.css({
           minWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.width + 'px',
@@ -82338,7 +82372,8 @@
         style: {
           zIndex: 2,
           position: 'absolute',
-          top: sectionproperties.badge_top + 'px',
+          top: sectionproperties.badgeposition == 'Top' ? sectionproperties.badge_top + 'px' : '',
+          bottom: sectionproperties.badgeposition == 'Bottom' ? sectionproperties.badge_top + 'px' : '',
           left: langdetect == 'en' ? sectionproperties.badge_right + 'px' : '',
           right: langdetect == 'en' ? '' : sectionproperties.badge_right + 'px',
           width: sectionproperties.badge_width == 0 ? '90%' : sectionproperties.badge_width + 'px',

package/package.json

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