@lookiero/checkout 4.0.1-beta.0 → 4.0.1

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.
Files changed (89) hide show
  1. package/dist/infrastructure/ui/views/checkout/components/checkoutPaymentModal/CheckoutPaymentModal.js +4 -4
  2. package/dist/shared/tracking/infrastructure/useTrackCheckout.d.ts +3 -3
  3. package/dist/shared/tracking/infrastructure/useTrackCheckout.js +5 -5
  4. package/dist/shared/tracking/tracking.d.ts +2 -2
  5. package/package.json +1 -1
  6. package/dist/domain/checkoutBooking/event/createNotificationWhenCheckoutBookingExpired.d.ts +0 -6
  7. package/dist/domain/checkoutBooking/event/createNotificationWhenCheckoutBookingExpired.js +0 -13
  8. package/dist/infrastructure/domain/uiSetting/react/useIncrementIntroShownCount.d.ts +0 -10
  9. package/dist/infrastructure/domain/uiSetting/react/useIncrementIntroShownCount.js +0 -11
  10. package/dist/infrastructure/projection/uiSetting/react/useShouldIntroBeShown.d.ts +0 -6
  11. package/dist/infrastructure/projection/uiSetting/react/useShouldIntroBeShown.js +0 -7
  12. package/dist/infrastructure/projection/uiSetting/react/useViewIntroShownCount.d.ts +0 -6
  13. package/dist/infrastructure/projection/uiSetting/react/useViewIntroShownCount.js +0 -9
  14. package/dist/infrastructure/ui/components/templates/SafeAreaScrollView.d.ts +0 -13
  15. package/dist/infrastructure/ui/components/templates/SafeAreaScrollView.js +0 -19
  16. package/dist/infrastructure/ui/components/templates/SafeAreaScrollView.style.ts.d.ts +0 -6
  17. package/dist/infrastructure/ui/components/templates/SafeAreaScrollView.style.ts.js +0 -7
  18. package/dist/infrastructure/ui/components/templates/header/header/Header.d.ts +0 -3
  19. package/dist/infrastructure/ui/components/templates/header/header/Header.js +0 -10
  20. package/dist/infrastructure/ui/components/templates/header/header/Header.style.d.ts +0 -9
  21. package/dist/infrastructure/ui/components/templates/header/header/Header.style.js +0 -12
  22. package/dist/infrastructure/ui/components/templates/safeAreaScrollView/SafeAreaScrollView.d.ts +0 -13
  23. package/dist/infrastructure/ui/components/templates/safeAreaScrollView/SafeAreaScrollView.js +0 -19
  24. package/dist/infrastructure/ui/components/templates/safeAreaScrollView/SafeAreaScrollView.style.ts.d.ts +0 -6
  25. package/dist/infrastructure/ui/components/templates/safeAreaScrollView/SafeAreaScrollView.style.ts.js +0 -7
  26. package/dist/infrastructure/ui/hooks/usePaymentInstrumentUpdateEvents.d.ts +0 -2
  27. package/dist/infrastructure/ui/hooks/usePaymentInstrumentUpdateEvents.js +0 -28
  28. package/dist/infrastructure/ui/hooks/useToast.d.ts +0 -11
  29. package/dist/infrastructure/ui/hooks/useToast.js +0 -49
  30. package/dist/infrastructure/ui/views/checkout/components/checkoutSuccessModal/CheckoutSuccessModal.d.ts +0 -7
  31. package/dist/infrastructure/ui/views/checkout/components/checkoutSuccessModal/CheckoutSuccessModal.js +0 -25
  32. package/dist/infrastructure/ui/views/checkout/components/checkoutSuccessModal/CheckoutSuccessModal.style.d.ts +0 -16
  33. package/dist/infrastructure/ui/views/checkout/components/checkoutSuccessModal/CheckoutSuccessModal.style.js +0 -19
  34. package/dist/infrastructure/ui/views/intro/Intro.d.ts +0 -6
  35. package/dist/infrastructure/ui/views/intro/Intro.js +0 -52
  36. package/dist/infrastructure/ui/views/intro/Intro.style.d.ts +0 -52
  37. package/dist/infrastructure/ui/views/intro/Intro.style.js +0 -55
  38. package/dist/infrastructure/ui/views/item/Item.style.d.ts +0 -15
  39. package/dist/infrastructure/ui/views/item/Item.style.js +0 -18
  40. package/dist/infrastructure/ui/views/item/components/productVariant/ProductVariant.d.ts +0 -26
  41. package/dist/infrastructure/ui/views/item/components/productVariant/ProductVariant.js +0 -44
  42. package/dist/infrastructure/ui/views/item/components/productVariant/ProductVariant.style.d.ts +0 -45
  43. package/dist/infrastructure/ui/views/item/components/productVariant/ProductVariant.style.js +0 -53
  44. package/dist/infrastructure/ui/views/item/components/sizeChangeModal/SizeChangeModal.d.ts +0 -7
  45. package/dist/infrastructure/ui/views/item/components/sizeChangeModal/SizeChangeModal.js +0 -25
  46. package/dist/infrastructure/ui/views/item/components/sizeChangeModal/SizeChangeModal.style.d.ts +0 -16
  47. package/dist/infrastructure/ui/views/item/components/sizeChangeModal/SizeChangeModal.style.js +0 -19
  48. package/dist/infrastructure/ui/views/navigation/Navigation.d.ts +0 -21
  49. package/dist/infrastructure/ui/views/navigation/Navigation.js +0 -45
  50. package/dist/infrastructure/ui/views/navigation/Navigation.style.d.ts +0 -5
  51. package/dist/infrastructure/ui/views/navigation/Navigation.style.js +0 -30
  52. package/dist/infrastructure/ui/views/navigation/components/header/Header.d.ts +0 -46
  53. package/dist/infrastructure/ui/views/navigation/components/header/Header.js +0 -120
  54. package/dist/infrastructure/ui/views/navigation/components/header/Header.style.d.ts +0 -31
  55. package/dist/infrastructure/ui/views/navigation/components/header/Header.style.js +0 -34
  56. package/dist/infrastructure/ui/views/navigation/components/header/Logo.d.ts +0 -7
  57. package/dist/infrastructure/ui/views/navigation/components/header/Logo.js +0 -11
  58. package/dist/infrastructure/ui/views/navigation/components/header/Logo.style.d.ts +0 -7
  59. package/dist/infrastructure/ui/views/navigation/components/header/Logo.style.js +0 -8
  60. package/dist/infrastructure/ui/views/summary/components/checkoutItemsTabs/CheckoutItemsTabs.d.ts +0 -12
  61. package/dist/infrastructure/ui/views/summary/components/checkoutItemsTabs/CheckoutItemsTabs.js +0 -24
  62. package/dist/infrastructure/ui/views/summary/components/checkoutItemsTabs/CheckoutItemsTabs.style.d.ts +0 -15
  63. package/dist/infrastructure/ui/views/summary/components/checkoutItemsTabs/CheckoutItemsTabs.style.js +0 -18
  64. package/dist/shared/notifications/domain/notification/command/createNotification.d.ts +0 -17
  65. package/dist/shared/notifications/domain/notification/command/createNotification.js +0 -7
  66. package/dist/shared/notifications/infrastructure/domain/notification/react/useCreateNotification.d.ts +0 -21
  67. package/dist/shared/notifications/infrastructure/domain/notification/react/useCreateNotification.js +0 -22
  68. package/dist/shared/notifications/infrastructure/ui/components/NotificationItem.d.ts +0 -12
  69. package/dist/shared/notifications/infrastructure/ui/components/NotificationItem.js +0 -24
  70. package/dist/shared/notifications/infrastructure/ui/components/Notifications.d.ts +0 -9
  71. package/dist/shared/notifications/infrastructure/ui/components/Notifications.js +0 -20
  72. package/dist/shared/notifications/infrastructure/ui/components/Notifications.style.d.ts +0 -36
  73. package/dist/shared/notifications/infrastructure/ui/components/Notifications.style.js +0 -31
  74. package/dist/shared/tracking/infrastructure/usePageView.d.ts +0 -13
  75. package/dist/shared/tracking/infrastructure/usePageView.js +0 -27
  76. package/dist/shared/ui/components/atoms/error/Error.style.d.ts +0 -6
  77. package/dist/shared/ui/components/atoms/error/Error.style.js +0 -9
  78. package/dist/shared/ui/components/layouts/slider/Bullets.d.ts +0 -10
  79. package/dist/shared/ui/components/layouts/slider/Bullets.js +0 -29
  80. package/dist/shared/ui/components/layouts/slider/Bullets.style.d.ts +0 -12
  81. package/dist/shared/ui/components/layouts/slider/Bullets.style.js +0 -15
  82. package/dist/shared/ui/components/layouts/slider/Pagination.d.ts +0 -14
  83. package/dist/shared/ui/components/layouts/slider/Pagination.js +0 -11
  84. package/dist/shared/ui/components/layouts/slider/Pagination.style.d.ts +0 -23
  85. package/dist/shared/ui/components/layouts/slider/Pagination.style.js +0 -27
  86. package/dist/shared/ui/components/layouts/slider/Slider.d.ts +0 -15
  87. package/dist/shared/ui/components/layouts/slider/Slider.js +0 -132
  88. package/dist/shared/ui/components/layouts/slider/Slider.style.d.ts +0 -11
  89. package/dist/shared/ui/components/layouts/slider/Slider.style.js +0 -12
@@ -1,55 +0,0 @@
1
- import { StyleSheet } from "react-native";
2
- import { theme } from "../../theme/theme";
3
- const { borderSize, colorAccent, spaceXS, spaceS, spaceM, spaceL, spaceXL } = theme();
4
- const style = StyleSheet.create({
5
- bodyColumn: {
6
- paddingHorizontal: spaceXL,
7
- },
8
- bullet: {
9
- alignItems: "center",
10
- flexDirection: "row",
11
- marginVertical: spaceS,
12
- },
13
- content: {
14
- alignItems: "center",
15
- },
16
- description: {
17
- borderWidth: borderSize,
18
- marginBottom: spaceXL,
19
- padding: spaceM,
20
- width: "100%",
21
- },
22
- discount: {
23
- alignItems: "flex-end",
24
- flexDirection: "row",
25
- justifyContent: "center",
26
- marginBottom: spaceS,
27
- },
28
- discountContainer: {
29
- alignItems: "center",
30
- backgroundColor: colorAccent,
31
- marginBottom: spaceL,
32
- padding: spaceM,
33
- textAlign: "center",
34
- width: "100%",
35
- },
36
- intro: {
37
- flex: 1,
38
- justifyContent: "space-between",
39
- },
40
- percentage: {
41
- marginLeft: spaceXS,
42
- },
43
- subtitle: {
44
- marginBottom: spaceXL,
45
- textAlign: "center",
46
- },
47
- tickIcon: {
48
- marginRight: spaceS,
49
- },
50
- title: {
51
- marginBottom: spaceM,
52
- textAlign: "center",
53
- },
54
- });
55
- export { style };
@@ -1,15 +0,0 @@
1
- declare const style: {
2
- content: {
3
- paddingHorizontal: number;
4
- };
5
- feedbackContainer: {
6
- borderTopColor: string;
7
- borderTopWidth: number;
8
- marginVertical: number;
9
- };
10
- sliderContainer: {
11
- marginBottom: number;
12
- minHeight: number;
13
- };
14
- };
15
- export { style };
@@ -1,18 +0,0 @@
1
- import { StyleSheet } from "react-native";
2
- import { theme } from "../../theme/theme";
3
- const { borderSize, colorGrayscaleM, spaceXL } = theme();
4
- const style = StyleSheet.create({
5
- content: {
6
- paddingHorizontal: spaceXL,
7
- },
8
- feedbackContainer: {
9
- borderTopColor: colorGrayscaleM,
10
- borderTopWidth: borderSize,
11
- marginVertical: spaceXL,
12
- },
13
- sliderContainer: {
14
- marginBottom: spaceXL,
15
- minHeight: 500,
16
- },
17
- });
18
- export { style };
@@ -1,26 +0,0 @@
1
- import { FC } from "react";
2
- import { ImageStyle, StyleProp } from "react-native";
3
- import { CheckoutItemStatus } from "../../../../../../domain/checkoutItem/model/checkoutItem";
4
- import { ColorProjection, MediaProjection } from "../../../../../../projection/checkoutItem/checkoutItem";
5
- import { Country } from "../../../../../../projection/shared/country";
6
- import { PriceProjection } from "../../../../../../projection/shared/price";
7
- import { SizeProjection } from "../../../../../../projection/shared/size";
8
- interface ProductVariantStyle {
9
- readonly image: StyleProp<ImageStyle>;
10
- }
11
- interface ProductVariantProps {
12
- readonly media: MediaProjection[];
13
- readonly brand: string;
14
- readonly name: string;
15
- readonly price: PriceProjection;
16
- readonly size: SizeProjection;
17
- readonly color: ColorProjection;
18
- readonly status?: CheckoutItemStatus;
19
- readonly discarded?: boolean;
20
- readonly country: Country;
21
- readonly style?: Partial<ProductVariantStyle>;
22
- readonly onPress?: () => void;
23
- }
24
- declare const ProductVariant: FC<ProductVariantProps>;
25
- export type { ProductVariantStyle };
26
- export { ProductVariant };
@@ -1,44 +0,0 @@
1
- import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Text";
2
- import { useI18nMessage } from "@lookiero/i18n-react";
3
- import React from "react";
4
- import { Image, Pressable, View } from "react-native";
5
- import Svg, { Line } from "react-native-svg";
6
- import { CheckoutItemStatus } from "../../../../../../domain/checkoutItem/model/checkoutItem";
7
- import { size } from "../../../../../../projection/shared/size";
8
- import { Icon } from "../../../../../../shared/ui/components/atoms/icon/Icon";
9
- import { Price } from "../../../../components/atoms/price/Price";
10
- import { useMediaImage } from "../../../../hooks/useMediaImage";
11
- import { COLOR_I18N_PREFIX, I18nMessages } from "../../../../i18n/i18n";
12
- import { theme } from "../../../../theme/theme";
13
- import { IMAGE_WIDTH, style } from "./ProductVariant.style";
14
- const { colorContent } = theme();
15
- const ProductVariant = ({ media, brand, name, price, size: sizeProjection, color, status, discarded, country, style: customStyle, onPress, }) => {
16
- const uniqueText = useI18nMessage({ id: I18nMessages.ITEM_UNIQUE });
17
- const colorLabel = useI18nMessage({ id: color.label, prefix: COLOR_I18N_PREFIX });
18
- const sizeChangeText = useI18nMessage({ id: I18nMessages.PRODUCT_VARIANT_SIZE_CHANGE });
19
- const cdnImageUrl = useMediaImage();
20
- return (React.createElement(Pressable, { pointerEvents: onPress ? "auto" : "none", style: style.container, testID: "product-variant", onPress: onPress },
21
- React.createElement(View, { style: style.row },
22
- React.createElement(View, null,
23
- React.createElement(Image, { resizeMode: "contain", style: [style.media, customStyle?.image], testID: "product-variant-media", source: {
24
- uri: cdnImageUrl({
25
- url: media[0]?.url,
26
- width: IMAGE_WIDTH,
27
- }),
28
- } }),
29
- discarded && (React.createElement(Svg, { preserveAspectRatio: "none", stroke: colorContent, style: style.discarded, testID: "discarded", viewBox: "0 0 100 100" },
30
- React.createElement(Line, { vectorEffect: "non-scaling-stroke", x1: "100", x2: "0", y1: "0", y2: "100" })))),
31
- React.createElement(View, { style: style.descriptionContainer },
32
- React.createElement(View, null,
33
- React.createElement(Text, { level: 2, style: style.brand, detail: true }, brand),
34
- React.createElement(Text, { level: 2, detail: true }, name),
35
- React.createElement(Text, { level: 2, style: style.priceAndColor, detail: true },
36
- sizeProjection.unique ? uniqueText : size({ size: sizeProjection, country }),
37
- " / ",
38
- colorLabel),
39
- status === CheckoutItemStatus.REPLACED && (React.createElement(View, { style: style.sizeChange },
40
- React.createElement(Text, { level: 3, style: style.sizeChangeText, detail: true }, sizeChangeText)))),
41
- React.createElement(Price, { price: price, variant: "detail" }))),
42
- onPress && React.createElement(Icon, { name: "arrow-right" })));
43
- };
44
- export { ProductVariant };
@@ -1,45 +0,0 @@
1
- declare const IMAGE_WIDTH = 96;
2
- declare const style: {
3
- brand: {
4
- color: string;
5
- };
6
- container: {
7
- flexDirection: "row";
8
- justifyContent: "space-between";
9
- };
10
- descriptionContainer: {
11
- justifyContent: "space-between";
12
- marginLeft: number;
13
- };
14
- discarded: {
15
- height: string;
16
- left: number;
17
- position: "absolute";
18
- top: number;
19
- width: string;
20
- zIndex: number;
21
- };
22
- media: {
23
- borderColor: string;
24
- borderWidth: number;
25
- height: number;
26
- width: number;
27
- };
28
- priceAndColor: {
29
- color: string;
30
- };
31
- row: {
32
- flexDirection: "row";
33
- };
34
- sizeChange: {
35
- width?: string | undefined;
36
- backgroundColor: string;
37
- marginTop: number;
38
- paddingHorizontal: number;
39
- paddingVertical: number;
40
- };
41
- sizeChangeText: {
42
- textTransform: "uppercase";
43
- };
44
- };
45
- export { style, IMAGE_WIDTH };
@@ -1,53 +0,0 @@
1
- import { Platform, StyleSheet } from "react-native";
2
- import { theme } from "../../../../theme/theme";
3
- const { borderSize, colorGrayscaleL, colorInfo, spaceXS, spaceS, spaceM } = theme();
4
- const IMAGE_WIDTH = 96;
5
- const IMAGE_HEIGHT = 120;
6
- const style = StyleSheet.create({
7
- brand: {
8
- color: colorGrayscaleL,
9
- },
10
- container: {
11
- flexDirection: "row",
12
- justifyContent: "space-between",
13
- },
14
- descriptionContainer: {
15
- justifyContent: "space-between",
16
- marginLeft: spaceS,
17
- },
18
- discarded: {
19
- height: "100%",
20
- left: 0,
21
- position: "absolute",
22
- top: 0,
23
- width: "100%",
24
- zIndex: 10,
25
- },
26
- media: {
27
- borderColor: colorGrayscaleL,
28
- borderWidth: borderSize,
29
- height: IMAGE_HEIGHT,
30
- width: IMAGE_WIDTH,
31
- },
32
- priceAndColor: {
33
- color: colorGrayscaleL,
34
- },
35
- row: {
36
- flexDirection: "row",
37
- },
38
- sizeChange: {
39
- backgroundColor: colorInfo,
40
- marginTop: spaceM,
41
- paddingHorizontal: spaceS,
42
- paddingVertical: spaceXS,
43
- ...Platform.select({
44
- web: {
45
- width: "fit-content",
46
- },
47
- }),
48
- },
49
- sizeChangeText: {
50
- textTransform: "uppercase",
51
- },
52
- });
53
- export { style, IMAGE_WIDTH };
@@ -1,7 +0,0 @@
1
- import { FC } from "react";
2
- interface SizeChangeModalProps {
3
- readonly visible: boolean;
4
- readonly onDismiss: () => void;
5
- }
6
- declare const SizeChangeModal: FC<SizeChangeModalProps>;
7
- export { SizeChangeModal };
@@ -1,25 +0,0 @@
1
- import { Button } from "@lookiero/aurora-next/build/components/atoms/Button/Button";
2
- import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Text";
3
- import { useI18nMessage } from "@lookiero/i18n-react";
4
- import React from "react";
5
- import { View } from "react-native";
6
- import { Modal } from "../../../../../../shared/ui/components/layouts/modal/Modal";
7
- import { I18nMessages } from "../../../../i18n/i18n";
8
- import { style } from "./SizeChangeModal.style";
9
- const SizeChangeModal = ({ visible, onDismiss }) => {
10
- const titleText = useI18nMessage({ id: I18nMessages.SIZE_CHANGE_MODAL_TITLE });
11
- const descriptionText = useI18nMessage({ id: I18nMessages.SIZE_CHANGE_MODAL_DESCRIPTION });
12
- const buttonText = useI18nMessage({ id: I18nMessages.SIZE_CHANGE_MODAL_BUTTON });
13
- return (React.createElement(Modal, { visible: visible, onClose: onDismiss },
14
- React.createElement(View, { style: style.modal },
15
- React.createElement(Text, { level: 1, style: style.modalTitle, body: true }, titleText),
16
- React.createElement(Text, { level: 3, style: style.modalDescription, body: true }, descriptionText),
17
- React.createElement(Button
18
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
19
- // @ts-ignore
20
- , {
21
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
22
- // @ts-ignore
23
- style: style.button, onPress: onDismiss }, buttonText))));
24
- };
25
- export { SizeChangeModal };
@@ -1,16 +0,0 @@
1
- declare const style: {
2
- button: {
3
- flex: number;
4
- };
5
- modal: {
6
- padding: number;
7
- };
8
- modalDescription: {
9
- marginVertical: number;
10
- textAlign: "center";
11
- };
12
- modalTitle: {
13
- textAlign: "center";
14
- };
15
- };
16
- export { style };
@@ -1,19 +0,0 @@
1
- import { StyleSheet } from "react-native";
2
- import { theme } from "../../../../theme/theme";
3
- const { spaceXL } = theme();
4
- const style = StyleSheet.create({
5
- button: {
6
- flex: 0,
7
- },
8
- modal: {
9
- padding: spaceXL,
10
- },
11
- modalDescription: {
12
- marginVertical: spaceXL,
13
- textAlign: "center",
14
- },
15
- modalTitle: {
16
- textAlign: "center",
17
- },
18
- });
19
- export { style };
@@ -1,21 +0,0 @@
1
- import { FC, ReactNode } from "react";
2
- import { Country } from "../../../../projection/shared/country";
3
- interface MenuProps {
4
- readonly isVisible: boolean;
5
- readonly onClose: () => void;
6
- }
7
- type Menu = FC<MenuProps>;
8
- interface TabBarProps {
9
- readonly isPortalBusy: boolean;
10
- readonly panel: boolean;
11
- }
12
- type TabBar = FC<TabBarProps>;
13
- interface NavigationProps {
14
- readonly children: ReactNode;
15
- readonly customerId: string;
16
- readonly country: Country;
17
- readonly onOpenMenu: () => void;
18
- }
19
- declare const Navigation: FC<NavigationProps>;
20
- export type { Menu, TabBar };
21
- export { Navigation };
@@ -1,45 +0,0 @@
1
- import React, { useCallback } from "react";
2
- import { useTrackPressBack } from "../../../../shared/tracking/infrastructure/useTrackPressBack";
3
- import { useTrackPressMenu } from "../../../../shared/tracking/infrastructure/useTrackPressMenu";
4
- import { useTrackPressNext } from "../../../../shared/tracking/infrastructure/useTrackPressNext";
5
- import { useTrackPressPrevious } from "../../../../shared/tracking/infrastructure/useTrackPressPrevious";
6
- import { style } from "./Navigation.style";
7
- import { Header } from "./components/header/Header";
8
- const Navigation = ({ children, customerId, country, onOpenMenu }) => {
9
- const trackPressMenu = useTrackPressMenu();
10
- const handleOnOpenMenu = useCallback(({ page, checkoutId, collapse }) => {
11
- onOpenMenu();
12
- trackPressMenu({
13
- page,
14
- country,
15
- checkoutId,
16
- collapse,
17
- });
18
- }, [country, onOpenMenu, trackPressMenu]);
19
- const trackPressBack = useTrackPressBack();
20
- const handleOnBack = useCallback(({ page, checkoutId }) => trackPressBack({
21
- page,
22
- country,
23
- checkoutId,
24
- }), [country, trackPressBack]);
25
- const trackPressNext = useTrackPressNext();
26
- const handleOnNext = useCallback(({ page, checkoutId, from, to }) => trackPressNext({
27
- page,
28
- country,
29
- checkoutId,
30
- from,
31
- to,
32
- }), [country, trackPressNext]);
33
- const trackPressPrevious = useTrackPressPrevious();
34
- const handleOnPrevious = useCallback(({ page, checkoutId, from, to }) => trackPressPrevious({
35
- page,
36
- country,
37
- checkoutId,
38
- from,
39
- to,
40
- }), [country, trackPressPrevious]);
41
- return (React.createElement(React.Fragment, null,
42
- React.createElement(Header, { customerId: customerId, style: style.header, onBack: handleOnBack, onNext: handleOnNext, onOpenMenu: handleOnOpenMenu, onPrevious: handleOnPrevious }),
43
- children));
44
- };
45
- export { Navigation };
@@ -1,5 +0,0 @@
1
- declare const style: {
2
- header: {};
3
- tabBar: {};
4
- };
5
- export { style };
@@ -1,30 +0,0 @@
1
- import { Platform, StyleSheet } from "react-native";
2
- const style = StyleSheet.create({
3
- header: {
4
- ...Platform.select({
5
- web: {
6
- position: "fixed",
7
- zIndex: 1,
8
- },
9
- native: {
10
- position: "absolute",
11
- zIndex: 1,
12
- },
13
- }),
14
- },
15
- tabBar: {
16
- ...Platform.select({
17
- web: {
18
- position: "fixed",
19
- zIndex: 1,
20
- bottom: 0,
21
- },
22
- native: {
23
- position: "absolute",
24
- zIndex: 1,
25
- bottom: 0,
26
- },
27
- }),
28
- },
29
- });
30
- export { style };
@@ -1,46 +0,0 @@
1
- import { FC } from "react";
2
- import { StyleProp, ViewStyle } from "react-native";
3
- import { TrackingPage } from "../../../../../tracking/tracking";
4
- interface OnOpenMenuFunctionArgs {
5
- readonly page: TrackingPage;
6
- readonly checkoutId: string | undefined;
7
- readonly collapse: boolean;
8
- }
9
- interface OnOpenMenuFunction {
10
- (args: OnOpenMenuFunctionArgs): void;
11
- }
12
- interface OnBackFunctionArgs {
13
- readonly page: TrackingPage;
14
- readonly checkoutId: string | undefined;
15
- }
16
- interface OnBackFunction {
17
- (args: OnBackFunctionArgs): void;
18
- }
19
- interface OnNextFunctionArgs {
20
- readonly page: TrackingPage;
21
- readonly checkoutId: string | undefined;
22
- readonly from: string;
23
- readonly to: string;
24
- }
25
- interface OnNextFunction {
26
- (args: OnNextFunctionArgs): void;
27
- }
28
- interface OnPreviousFunctionArgs {
29
- readonly page: TrackingPage;
30
- readonly checkoutId: string | undefined;
31
- readonly from: string;
32
- readonly to: string;
33
- }
34
- interface OnPreviousFunction {
35
- (args: OnPreviousFunctionArgs): void;
36
- }
37
- interface HeaderProps {
38
- readonly customerId: string;
39
- readonly onOpenMenu: OnOpenMenuFunction;
40
- readonly onBack?: OnBackFunction;
41
- readonly onNext?: OnNextFunction;
42
- readonly onPrevious?: OnPreviousFunction;
43
- readonly style?: StyleProp<ViewStyle>;
44
- }
45
- declare const Header: FC<HeaderProps>;
46
- export { Header };
@@ -1,120 +0,0 @@
1
- import { Text } from "@lookiero/aurora";
2
- import { useI18nMessage } from "@lookiero/i18n-react";
3
- import React, { useCallback } from "react";
4
- import { View } from "react-native";
5
- import { SafeAreaView, useSafeAreaInsets } from "react-native-safe-area-context";
6
- import { generatePath, useMatch, useNavigate, useParams } from "react-router-native";
7
- import { ButtonIcon } from "../../../../../../shared/ui/components/molecules/buttonIcon/ButtonIcon";
8
- import { useViewFirstAvailableCheckoutByCustomerId } from "../../../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
9
- import { TrackingPage } from "../../../../../tracking/tracking";
10
- import { I18nMessages } from "../../../../i18n/i18n";
11
- import { Routes } from "../../../../routing/routes";
12
- import { useBasePath } from "../../../../routing/useBasePath";
13
- import { HEADER_HEIGHT, style } from "./Header.style";
14
- import { Logo } from "./Logo";
15
- const ButtonIconPlaceholder = () => React.createElement(View, { style: style.buttonIconPlaceholder });
16
- const DefaultHeader = ({ onOpenMenu }) => (React.createElement(View, { style: style.header, testID: "default-header" },
17
- React.createElement(Logo, { style: style.logo }),
18
- React.createElement(ButtonIconPlaceholder, null),
19
- React.createElement(ButtonIcon, { name: "menu", testID: "menu-button-icon", onPress: onOpenMenu })));
20
- const ItemHeader = ({ items, item, onNext, onPrevious }) => {
21
- const title = useI18nMessage({ id: I18nMessages.HEADER_CHECKOUT_TITLE });
22
- const itemIndex = items.indexOf(item);
23
- const isFirstItem = itemIndex === 0;
24
- const isLastItem = itemIndex === items.length - 1;
25
- const basePath = useBasePath();
26
- const navigate = useNavigate();
27
- const navigateToPreviousItem = useCallback(() => {
28
- const previousItemIndex = itemIndex === 0 ? items.length - 1 : itemIndex - 1;
29
- const previousItem = items[previousItemIndex];
30
- onPrevious?.({ from: item.id, to: previousItem.id });
31
- navigate(generatePath(`${basePath}/${Routes.ITEM}`, { id: previousItem.id }));
32
- }, [basePath, item.id, itemIndex, items, navigate, onPrevious]);
33
- const navigateToNextItem = useCallback(() => {
34
- const nextItemIndex = itemIndex === items.length - 1 ? 0 : itemIndex + 1;
35
- const nextItem = items[nextItemIndex];
36
- onNext?.({ from: item.id, to: nextItem.id });
37
- navigate(generatePath(`${basePath}/${Routes.ITEM}`, { id: nextItem.id }));
38
- }, [basePath, item.id, itemIndex, items, navigate, onNext]);
39
- return (React.createElement(View, { style: style.header, testID: "item-header" },
40
- !isFirstItem ? (React.createElement(ButtonIcon, { name: "arrow-left", testID: "arrow-left-button-icon", onPress: navigateToPreviousItem })) : (React.createElement(ButtonIconPlaceholder, null)),
41
- React.createElement(Text, { level: 3, detail: true, upperCase: true }, title),
42
- !isLastItem ? (React.createElement(ButtonIcon, { name: "arrow-right", testID: "arrow-right-button-icon", onPress: navigateToNextItem })) : (React.createElement(ButtonIconPlaceholder, null))));
43
- };
44
- const ItemDetailHeader = ({ onBack }) => {
45
- const title = useI18nMessage({ id: I18nMessages.HEADER_CHECKOUT_TITLE });
46
- const navigate = useNavigate();
47
- const handleOnBack = useCallback(() => {
48
- onBack?.();
49
- navigate(-1);
50
- }, [navigate, onBack]);
51
- return (React.createElement(View, { style: style.header, testID: "item-detail-header" },
52
- React.createElement(ButtonIconPlaceholder, null),
53
- React.createElement(Text, { level: 3, detail: true, upperCase: true }, title),
54
- React.createElement(ButtonIcon, { name: "close", testID: "close-button-icon", onPress: handleOnBack })));
55
- };
56
- const CheckoutHeader = ({ onBack }) => {
57
- const title = useI18nMessage({ id: I18nMessages.HEADER_COMPLETE_CHECKOUT_TITLE });
58
- const basePath = useBasePath();
59
- const navigate = useNavigate();
60
- const handleOnBack = useCallback(() => {
61
- onBack?.();
62
- navigate(`${basePath}/${Routes.SUMMARY}`);
63
- }, [basePath, navigate, onBack]);
64
- return (React.createElement(View, { style: style.header, testID: "checkout-header" },
65
- React.createElement(ButtonIcon, { name: "arrow-left", testID: "arrow-left-button-icon", onPress: handleOnBack }),
66
- React.createElement(Text, { level: 3, detail: true, upperCase: true }, title),
67
- React.createElement(ButtonIconPlaceholder, null)));
68
- };
69
- const Header = ({ customerId, onOpenMenu, onBack, onNext, onPrevious, style: customStyle }) => {
70
- const { id: itemId } = useParams();
71
- const [checkout] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
72
- const currentItem = checkout?.items.find((item) => item.id === itemId);
73
- const basePath = useBasePath();
74
- const itemRouteMatch = useMatch(`${basePath}/${Routes.ITEM}`);
75
- const itemDetailRouteMatch = useMatch(`${basePath}/${Routes.ITEM_DETAIL}`);
76
- const summaryRouteMatch = useMatch(`${basePath}/${Routes.SUMMARY}`);
77
- const checkoutRouteMatch = useMatch(`${basePath}/${Routes.CHECKOUT}`);
78
- const checkoutPaymentRouteMatch = useMatch(`${basePath}/${Routes.CHECKOUT}/${Routes.CHECKOUT_PAYMENT}`);
79
- const feedbackRouteMatch = useMatch(`${basePath}/${Routes.FEEDBACK}`);
80
- const trackingPage = useCallback(() => {
81
- if (itemRouteMatch || itemDetailRouteMatch)
82
- return TrackingPage.ITEM;
83
- if (checkoutRouteMatch || checkoutPaymentRouteMatch)
84
- return TrackingPage.CHECKOUT;
85
- if (summaryRouteMatch)
86
- return TrackingPage.SUMMARY;
87
- if (feedbackRouteMatch)
88
- return TrackingPage.FEEDBACK;
89
- return TrackingPage.NOT_FOUND;
90
- }, [
91
- checkoutPaymentRouteMatch,
92
- checkoutRouteMatch,
93
- feedbackRouteMatch,
94
- itemDetailRouteMatch,
95
- itemRouteMatch,
96
- summaryRouteMatch,
97
- ]);
98
- const { top: safeAreaInsetTop } = useSafeAreaInsets();
99
- const handleOnOpenMenu = useCallback(() => onOpenMenu({ page: trackingPage(), checkoutId: checkout?.id, collapse: false }), [checkout?.id, onOpenMenu, trackingPage]);
100
- const handleOnBack = useCallback(() => onBack?.({ page: trackingPage(), checkoutId: checkout?.id }), [checkout?.id, onBack, trackingPage]);
101
- const handleOnNext = useCallback(({ from, to }) => onNext?.({ page: trackingPage(), checkoutId: checkout?.id, from, to }), [checkout?.id, onNext, trackingPage]);
102
- const handleOnPrevious = useCallback(({ from, to }) => onPrevious?.({ page: trackingPage(), checkoutId: checkout?.id, from, to }), [checkout?.id, onPrevious, trackingPage]);
103
- let header;
104
- if (checkout?.items && currentItem) {
105
- if (itemRouteMatch) {
106
- header = (React.createElement(ItemHeader, { item: currentItem, items: checkout.items, onNext: handleOnNext, onPrevious: handleOnPrevious }));
107
- }
108
- else if (itemDetailRouteMatch) {
109
- header = React.createElement(ItemDetailHeader, { onBack: handleOnBack });
110
- }
111
- }
112
- else if (checkoutRouteMatch || checkoutPaymentRouteMatch) {
113
- header = React.createElement(CheckoutHeader, { onBack: handleOnBack });
114
- }
115
- else {
116
- header = React.createElement(DefaultHeader, { onOpenMenu: handleOnOpenMenu });
117
- }
118
- return (React.createElement(SafeAreaView, { edges: ["top"], style: [style.container, { height: HEADER_HEIGHT + safeAreaInsetTop }, customStyle] }, header));
119
- };
120
- export { Header };
@@ -1,31 +0,0 @@
1
- declare const HEADER_HEIGHT: number;
2
- declare const style: {
3
- buttonIconPlaceholder: {
4
- flexGrow: number;
5
- height: number;
6
- width: number;
7
- };
8
- container: {
9
- flexDirection: "row";
10
- flexGrow: number;
11
- width: string;
12
- };
13
- header: {
14
- alignItems: "center";
15
- backgroundColor: string;
16
- flexDirection: "row";
17
- flexGrow: number;
18
- flexWrap: "nowrap";
19
- height: number;
20
- justifyContent: "space-between";
21
- overflow: "visible";
22
- paddingHorizontal: number;
23
- width: string;
24
- };
25
- logo: {
26
- left: number;
27
- position: "absolute";
28
- top: number;
29
- };
30
- };
31
- export { style, HEADER_HEIGHT };