@trafilea/afrodita-components 5.0.0-beta.165 → 5.0.0-beta.167

package/build/index.d.ts

@@ -2331,8 +2331,9 @@ interface ProductGalleryMobileProps {
     bottomTag?: JSX.Element;
     productImageDataTestId?: string;
     borderRadiusVariant?: boolean;
+    selectedValue?: ImageType;
 }
-declare const ProductGalleryMobile: ({ images, customClick, topTag, bottomTag, productImageDataTestId, borderRadiusVariant, }: ProductGalleryMobileProps) => JSX.Element;
+declare const ProductGalleryMobile: ({ images, customClick, topTag, bottomTag, productImageDataTestId, borderRadiusVariant, selectedValue, }: ProductGalleryMobileProps) => JSX.Element;
 
 interface RadioProps {
     name: string;

package/build/index.esm.js

@@ -13231,7 +13231,7 @@ var settings = {
     initialSlide: 0,
 };
 var ImageProductWithTags = function (_a) {
-    var images = _a.images, _b = _a.customClick, customClick = _b === void 0 ? false : _b, topTag = _a.topTag, bottomTag = _a.bottomTag, testId = _a.testId, borderRadiusVariant = _a.borderRadiusVariant;
+    var images = _a.images, _b = _a.customClick, customClick = _b === void 0 ? false : _b, topTag = _a.topTag, bottomTag = _a.bottomTag, testId = _a.testId, borderRadiusVariant = _a.borderRadiusVariant, selectedValue = _a.selectedValue;
     var slick = useRef(null);
     var sliderWrapper = useRef(null);
     usePreventVerticalScroll(sliderWrapper);
@@ -13239,6 +13239,15 @@ var ImageProductWithTags = function (_a) {
         var _a;
         (_a = slick.current) === null || _a === void 0 ? void 0 : _a.slickGoTo(i);
     }, [slick]);
+    useEffect(function () {
+        var _a;
+        if (selectedValue) {
+            var matchingIndex = images.findIndex(function (image) { return image.imageUrl === selectedValue.imageUrl; });
+            if (matchingIndex) {
+                (_a = slick.current) === null || _a === void 0 ? void 0 : _a.slickGoTo(matchingIndex);
+            }
+        }
+    }, [images, selectedValue]);
     return (jsxs$1(Fragment$1, { children: [customClick && (jsx$1("div", __assign$1({ style: { display: 'flex', marginBottom: '20px', gap: '10px' } }, { children: images.map(function (_, i) { return (jsx$1(ButtonPrimary, { onClick: function () { return onButtonClick(i); }, text: String(i + 1), inline: true }, i)); }) }), void 0)), jsx$1(Container$h, __assign$1({ "data-testid": testId, borderRadiusVariant: borderRadiusVariant, ref: sliderWrapper }, { children: jsx$1(Slider, __assign$1({}, settings, { ref: slick }, { children: images.map(function (image) {
                         return (jsxs$1("div", { children: [jsx$1(InnerImageZoom, { src: image.imageUrl, zoomSrc: image.imageUrl, zoomType: "hover", imgAttributes: { alt: image.alt, width: '100%', height: '510px' }, height: 510, fullscreenOnMobile: true, className: "zoomWrapper" }, void 0), jsx$1(TopTagContainer, __assign$1({ borderRadiusVariant: borderRadiusVariant, "data-testid": "topTag" }, { children: topTag }), void 0), jsx$1(BottomTagContainer, __assign$1({ "data-testid": "bottomTag" }, { children: bottomTag }), void 0)] }, image.key));
                     }) }), void 0) }), void 0)] }, void 0));
@@ -13280,8 +13289,8 @@ var templateObject_1$m, templateObject_2$f, templateObject_3$f;
 
 var Container$g = newStyled.div(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  height: fit-content;\n  position: relative;\n  max-width: 450px;\n"], ["\n  display: flex;\n  flex-direction: column;\n  height: fit-content;\n  position: relative;\n  max-width: 450px;\n"])));
 var ProductGalleryMobile = function (_a) {
-    var images = _a.images, customClick = _a.customClick, topTag = _a.topTag, bottomTag = _a.bottomTag, productImageDataTestId = _a.productImageDataTestId, _b = _a.borderRadiusVariant, borderRadiusVariant = _b === void 0 ? false : _b;
-    return (jsx$1(Container$g, { children: jsx$1(ImageProductWithTags, { images: images, customClick: customClick, topTag: topTag, bottomTag: bottomTag, testId: productImageDataTestId, borderRadiusVariant: borderRadiusVariant }, void 0) }, void 0));
+    var images = _a.images, customClick = _a.customClick, topTag = _a.topTag, bottomTag = _a.bottomTag, productImageDataTestId = _a.productImageDataTestId, _b = _a.borderRadiusVariant, borderRadiusVariant = _b === void 0 ? false : _b, selectedValue = _a.selectedValue;
+    return (jsx$1(Container$g, { children: jsx$1(ImageProductWithTags, { images: images, customClick: customClick, topTag: topTag, bottomTag: bottomTag, testId: productImageDataTestId, borderRadiusVariant: borderRadiusVariant, selectedValue: selectedValue }, void 0) }, void 0));
 };
 var templateObject_1$l;