@lookiero/checkout 3.9.0-beta.0 → 3.9.0-beta.1

package/dist/infrastructure/ui/views/item/components/productVariantSlider/ProductVariantSlider.js

@@ -1,5 +1,6 @@
 import React, { useCallback } from "react";
-import { Image } from "react-native";
+import { Image, View } from "react-native";
+import { AspectRatioView } from "../../../../../../shared/ui/components/atoms/aspectRatioView/AspectRatioView";
 import { Carousel2, } from "../../../../../../shared/ui/components/layouts/carousel/Carousel2";
 import { Bullets } from "../../../../../../shared/ui/components/layouts/slider/Bullets";
 import { useMediaImage } from "../../../../hooks/useMediaImage";
@@ -7,13 +8,15 @@ import { style } from "./ProductVariantSlider.style";
 const ProductVariantSlider = ({ producVariantMedia, onChanged }) => {
     const cdnImageUrl = useMediaImage();
     const handleOnActiveChanged = useCallback((activeIndex) => onChanged?.(activeIndex), [onChanged]);
-    const renderItem = useCallback(({ item }) => (React.createElement(Image, { resizeMode: "contain", style: style.image, testID: "product-variant-image", source: {
-            uri: cdnImageUrl({
-                url: item.url,
-                width: 600,
-            }),
-        } })), [cdnImageUrl]);
+    const renderItem = useCallback(({ item }) => (React.createElement(View, { style: style.slide },
+        React.createElement(AspectRatioView, { aspectRatio: 4 / 3 },
+            React.createElement(Image, { resizeMode: "contain", style: style.image, testID: "product-variant-image", source: {
+                    uri: cdnImageUrl({
+                        url: item.url,
+                        width: 600,
+                    }),
+                } })))), [cdnImageUrl]);
     const renderBullets = useCallback(({ activeIndex, count, onChange }) => React.createElement(Bullets, { activeIndex: activeIndex, count: count, onChange: onChange }), []);
-    return (React.createElement(Carousel2, { bullets: renderBullets, data: producVariantMedia, style: { container: style.carousel }, onActiveIndexChanged: handleOnActiveChanged }, renderItem));
+    return (React.createElement(Carousel2, { bullets: renderBullets, data: producVariantMedia, onActiveIndexChanged: handleOnActiveChanged }, renderItem));
 };
 export { ProductVariantSlider };

package/dist/infrastructure/ui/views/item/components/productVariantSlider/ProductVariantSlider.style.d.ts

@@ -1,7 +1,4 @@
 declare const style: {
-    carousel: {
-        overflow: "visible";
-    };
     image: {
         flex: number;
     };
@@ -24,5 +21,8 @@ declare const style: {
         marginTop: number;
         position: "relative";
     };
+    slide: {
+        paddingHorizontal: number;
+    };
 };
 export { style };

package/dist/infrastructure/ui/views/item/components/productVariantSlider/ProductVariantSlider.style.js

@@ -1,11 +1,8 @@
 import { StyleSheet } from "react-native";
 import { theme } from "../../../../theme/theme";
-const { colorBase, colorGrayscaleL, colorContent, spaceM } = theme();
+const { colorBase, colorGrayscaleL, colorContent, spaceM, spaceXL } = theme();
 const PAGINATION_SIZE = 37;
 const style = StyleSheet.create({
-    carousel: {
-        overflow: "visible",
-    },
     image: {
         flex: 1,
     },
@@ -28,5 +25,8 @@ const style = StyleSheet.create({
         marginTop: spaceM,
         position: "relative",
     },
+    slide: {
+        paddingHorizontal: spaceXL,
+    },
 });
 export { style };

package/dist/infrastructure/ui/views/item/views/productVariant/ProductVariant.js

@@ -1,7 +1,6 @@
 import React, { useCallback, useEffect } from "react";
 import { View } from "react-native";
 import { useTrackImageView } from "../../../../../../shared/tracking/infrastructure/useTrackImageView";
-import { AspectRatioView } from "../../../../../../shared/ui/components/atoms/aspectRatioView/AspectRatioView";
 import { TrackingPage } from "../../../../../tracking/tracking";
 import { ProductVariantDescription } from "../../components/productVariantDescription/ProductVariantDescription";
 import { ProductVariantSlider } from "../../components/productVariantSlider/ProductVariantSlider";
@@ -20,10 +19,10 @@ const ProductVariant = ({ country, checkoutId, checkoutItem, currentProductVaria
     const handleOnChangedProductVariantSlider = useCallback((active) => trackImageView({ perspective: checkoutItem.productVariant.media[active]?.perspective }), [checkoutItem.productVariant.media, trackImageView]);
     const { price } = checkoutItem;
     const { media, brand, name, color } = checkoutItem.productVariant;
-    return (React.createElement(View, { style: [style.content, customStyle?.content], testID: "product-variant" },
-        React.createElement(AspectRatioView, { aspectRatio: 4 / 3 },
-            React.createElement(ProductVariantSlider, { producVariantMedia: media, onChanged: handleOnChangedProductVariantSlider })),
-        React.createElement(ProductVariantDescription, { brand: brand, color: color, country: country, name: name, price: price, size: currentProductVariant.size }),
-        children));
+    return (React.createElement(View, { testID: "product-variant" },
+        React.createElement(ProductVariantSlider, { producVariantMedia: media, onChanged: handleOnChangedProductVariantSlider }),
+        React.createElement(View, { style: [style.content, customStyle?.content] },
+            React.createElement(ProductVariantDescription, { brand: brand, color: color, country: country, name: name, price: price, size: currentProductVariant.size }),
+            children)));
 };
 export { ProductVariant };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "3.9.0-beta.0",
+  "version": "3.9.0-beta.1",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [