@lookiero/checkout 0.5.0-beta.0 → 0.5.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14,8 +14,8 @@ import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollVie
14
14
  import { I18nMessages } from "../../i18n/i18n";
15
15
  import { Routes } from "../../routing/routes";
16
16
  import { useBasePath } from "../../routing/useBasePath";
17
- import { HEADER_HEIGHT } from "../navigation/components/header/Header.style";
18
17
  import { ProductVariant } from "../item/components/productVariant/ProductVariant";
18
+ import { HEADER_HEIGHT } from "../navigation/components/header/Header.style";
19
19
  import { Pricing } from "../summary/components/pricing/Pricing";
20
20
  import { style } from "./Checkout.style";
21
21
  import { DeliveryBanner } from "./components/deliveryBanner/DeliveryBanner";
@@ -38,7 +38,7 @@ const Checkout = ({ children, customerId, useRedirect }) => {
38
38
  if (!dependenciesLoaded)
39
39
  return React.createElement(Spinner, null);
40
40
  return (React.createElement(React.Fragment, null,
41
- React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0 },
41
+ React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0, style: { safeAreaView: style.container } },
42
42
  React.createElement(Body, { style: { column: style.bodyColumn } },
43
43
  hasReplacedCheckoutItem && (React.createElement(View, { style: style.deliveryBannerContainer },
44
44
  React.createElement(DeliveryBanner, null))),
@@ -5,6 +5,9 @@ declare const style: {
5
5
  checkoutItemKept: {
6
6
  paddingVertical: number;
7
7
  };
8
+ container: {
9
+ flex: number;
10
+ };
8
11
  deliveryBannerContainer: {
9
12
  marginBottom: number;
10
13
  };
@@ -8,6 +8,9 @@ const style = StyleSheet.create({
8
8
  checkoutItemKept: {
9
9
  paddingVertical: spaceM,
10
10
  },
11
+ container: {
12
+ flex: 1,
13
+ },
11
14
  deliveryBannerContainer: {
12
15
  marginBottom: spaceXXL,
13
16
  },
@@ -30,7 +30,7 @@ const Feedback = ({ customerId }) => {
30
30
  if (!dependenciesLoaded)
31
31
  return React.createElement(Spinner, null);
32
32
  return (React.createElement(CheckoutQuestionFeedbackProvider, { feedback: {} },
33
- React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0 },
33
+ React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0, style: { safeAreaView: style.container } },
34
34
  React.createElement(Body, { style: { column: style.bodyColumn } },
35
35
  React.createElement(CheckoutQuestionsForm, { checkoutQuestions: checkoutQuestions || [], submitButtonDisabled: giveCheckoutFeedbackStatus === CommandStatus.LOADING, onSubmit: handleOnSubmit })))));
36
36
  };
@@ -2,5 +2,8 @@ declare const style: {
2
2
  bodyColumn: {
3
3
  paddingHorizontal: number;
4
4
  };
5
+ container: {
6
+ flex: number;
7
+ };
5
8
  };
6
9
  export { style };
@@ -5,5 +5,8 @@ const style = StyleSheet.create({
5
5
  bodyColumn: {
6
6
  paddingHorizontal: spaceXL,
7
7
  },
8
+ container: {
9
+ flex: 1,
10
+ },
8
11
  });
9
12
  export { style };
@@ -30,9 +30,9 @@ const Intro = ({ customerId }) => {
30
30
  const [incrementIntroShownCount, incrementIntroShownCountStatus] = useIncrementIntroShownCount();
31
31
  if (fiveItemsDiscountStatus === QueryStatus.LOADING)
32
32
  return React.createElement(Spinner, null);
33
- return (React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0 },
33
+ return (React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0, style: { safeAreaView: style.container } },
34
34
  React.createElement(Body, { style: { column: style.bodyColumn } },
35
- React.createElement(View, { style: style.container },
35
+ React.createElement(View, { style: style.intro },
36
36
  React.createElement(View, { style: style.content },
37
37
  React.createElement(Text, { level: 3, style: style.title, heading: true }, titleText),
38
38
  React.createElement(Text, { level: 3, style: style.subtitle, body: true }, subTitleText),
@@ -9,7 +9,6 @@ declare const style: {
9
9
  };
10
10
  container: {
11
11
  flex: number;
12
- justifyContent: "space-between";
13
12
  };
14
13
  content: {
15
14
  alignItems: "center";
@@ -34,6 +33,10 @@ declare const style: {
34
33
  textAlign: "center";
35
34
  width: string;
36
35
  };
36
+ intro: {
37
+ flex: number;
38
+ justifyContent: "space-between";
39
+ };
37
40
  percentage: {
38
41
  marginLeft: number;
39
42
  };
@@ -12,7 +12,6 @@ const style = StyleSheet.create({
12
12
  },
13
13
  container: {
14
14
  flex: 1,
15
- justifyContent: "space-between",
16
15
  },
17
16
  content: {
18
17
  alignItems: "center",
@@ -37,6 +36,10 @@ const style = StyleSheet.create({
37
36
  textAlign: "center",
38
37
  width: "100%",
39
38
  },
39
+ intro: {
40
+ flex: 1,
41
+ justifyContent: "space-between",
42
+ },
40
43
  percentage: {
41
44
  marginLeft: spaceXS,
42
45
  },
@@ -136,10 +136,10 @@ const Item = ({ customerId }) => {
136
136
  return (React.createElement(ReturnQuestionFeedbackProvider, { feedback: checkoutItem.feedbacks || {} },
137
137
  React.createElement(SizeWithoutStockModal, { visible: sizeWithoutStockModalVisible, onDismiss: handleOnHideSizeWithoutStockModal }),
138
138
  React.createElement(SizeChangeModal, { visible: sizeChangeModalVisible, onDismiss: handleOnHideSizeChangeModal }),
139
- React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0, footer: !customerDecissionMade && (React.createElement(ItemActions, { keepButtonLoading: keepCheckoutItemStatus === CommandStatus.LOADING, productVariantSelected: productVariantSelected, productVariants: bookedProductsVariants?.productVariants || [], returnButtonLoading: returnCheckoutItemStatus === CommandStatus.LOADING, sizeSelectorDisabled: replaceCheckoutItemStatus === CommandStatus.LOADING, onKeep: handleOnKeep, onLayout: handleOnStickyLayout, onReplace: handleOnReplace, onReturn: handleOnReturn, onSizeSelectorPress: handleOnShowSizeWithoutStockModal })) },
139
+ React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0, style: { safeAreaView: style.container }, footer: !customerDecissionMade && (React.createElement(ItemActions, { keepButtonLoading: keepCheckoutItemStatus === CommandStatus.LOADING, productVariantSelected: productVariantSelected, productVariants: bookedProductsVariants?.productVariants || [], returnButtonLoading: returnCheckoutItemStatus === CommandStatus.LOADING, sizeSelectorDisabled: replaceCheckoutItemStatus === CommandStatus.LOADING, onKeep: handleOnKeep, onLayout: handleOnStickyLayout, onReplace: handleOnReplace, onReturn: handleOnReturn, onSizeSelectorPress: handleOnShowSizeWithoutStockModal })) },
140
140
  React.createElement(Body, null,
141
141
  customerDecissionMade && (React.createElement(CustomerDecissionBanner, { checkoutItemStatus: checkoutItem.status, onPress: handleOnBannerPress })),
142
- React.createElement(View, { style: [style.container, { paddingBottom: Platform.OS === "web" ? spaceXL : stickyHeight }] },
142
+ React.createElement(View, { style: [style.content, { paddingBottom: Platform.OS === "web" ? spaceXL : stickyHeight }] },
143
143
  React.createElement(View, { style: style.sliderContainer },
144
144
  React.createElement(ProductVariantSlider, { producVariantMedia: media })),
145
145
  React.createElement(ProductVariantDescription, { brand: brand, color: color, name: name, price: price, size: productVariantSelected.size }),
@@ -1,5 +1,8 @@
1
1
  declare const style: {
2
2
  container: {
3
+ flex: number;
4
+ };
5
+ content: {
3
6
  paddingHorizontal: number;
4
7
  };
5
8
  feedbackContainer: {
@@ -3,6 +3,9 @@ import { theme } from "../../theme/theme";
3
3
  const { borderSize, colorGrayscaleM, spaceXL } = theme();
4
4
  const style = StyleSheet.create({
5
5
  container: {
6
+ flex: 1,
7
+ },
8
+ content: {
6
9
  paddingHorizontal: spaceXL,
7
10
  },
8
11
  feedbackContainer: {
@@ -1,12 +1,10 @@
1
1
  import React, { useCallback } from "react";
2
2
  import { View } from "react-native";
3
- import { useSafeAreaInsets } from "react-native-safe-area-context";
4
3
  import { theme } from "../../../../../infrastructure/ui/theme/theme";
5
4
  import { style } from "./Sticky.style";
6
5
  const { spaceXL } = theme();
7
6
  const Sticky = ({ children, style: customStyle, onLayout }) => {
8
- const { bottom: safeAreaInsetBottom } = useSafeAreaInsets();
9
7
  const handleOnLayout = useCallback(({ nativeEvent: { layout: { width, height }, }, }) => onLayout?.({ width, height }), [onLayout]);
10
- return (React.createElement(View, { style: [style.sticky, { paddingBottom: safeAreaInsetBottom + spaceXL }, customStyle], onLayout: handleOnLayout }, children));
8
+ return (React.createElement(View, { style: [style.sticky, { paddingBottom: spaceXL }, customStyle], onLayout: handleOnLayout }, children));
11
9
  };
12
10
  export { Sticky };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lookiero/checkout",
3
- "version": "0.5.0-beta.0",
3
+ "version": "0.5.0-beta.2",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "files": [