@lookiero/checkout 0.2.27-beta.9 → 0.2.28
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.
- package/dist/infrastructure/projection/checkout/httpFirstAvailableCheckoutByCustomerIdView.js +7 -17
- package/dist/infrastructure/projection/checkout/httpIsCheckoutEnabledByCustomerIdView.js +6 -7
- package/dist/infrastructure/ui/shared/components/atoms/input/Input.js +9 -7
- package/dist/infrastructure/ui/shared/components/atoms/input/Input.style.d.ts +1 -1
- package/dist/infrastructure/ui/shared/components/atoms/input/Input.style.js +4 -4
- package/package.json +1 -1
- package/dist/infrastructure/delivery/_mock/bootstrap.mock.d.ts +0 -6
- package/dist/infrastructure/delivery/_mock/bootstrap.mock.js +0 -34
- package/dist/infrastructure/delivery/_mock/checkout.mock.d.ts +0 -9
- package/dist/infrastructure/delivery/_mock/checkout.mock.js +0 -46
- package/dist/infrastructure/domain/react/useBookSizeReplaceableProductVariantsForCheckoutItem.d.ts +0 -15
- package/dist/infrastructure/domain/react/useBookSizeReplaceableProductVariantsForCheckoutItem.js +0 -15
- package/dist/infrastructure/domain/react/useSetCheckoutIntroShown.d.ts +0 -10
- package/dist/infrastructure/domain/react/useSetCheckoutIntroShown.js +0 -9
- package/dist/infrastructure/domain/react/useUpdateUiSetting.d.ts +0 -14
- package/dist/infrastructure/domain/react/useUpdateUiSetting.js +0 -15
- package/dist/infrastructure/projection/httpBookedSizeReplaceableProductVariantsForCheckoutItemView.d.ts +0 -36
- package/dist/infrastructure/projection/httpBookedSizeReplaceableProductVariantsForCheckoutItemView.js +0 -30
- package/dist/infrastructure/projection/httpFirstAvailableCheckoutByCustomerIdView.d.ts +0 -60
- package/dist/infrastructure/projection/httpFirstAvailableCheckoutByCustomerIdView.js +0 -54
- package/dist/infrastructure/projection/httpFiveItemsDiscountByCustomerIdView.d.ts +0 -12
- package/dist/infrastructure/projection/httpFiveItemsDiscountByCustomerIdView.js +0 -7
- package/dist/infrastructure/projection/httpIsCheckoutEnabledByCustomerIdView.d.ts +0 -12
- package/dist/infrastructure/projection/httpIsCheckoutEnabledByCustomerIdView.js +0 -7
- package/dist/infrastructure/projection/react/useViewBookedSizeReplaceableProductVariantsForCheckoutItem.d.ts +0 -10
- package/dist/infrastructure/projection/react/useViewBookedSizeReplaceableProductVariantsForCheckoutItem.js +0 -9
- package/dist/infrastructure/projection/react/useViewCheckoutIntroShown.d.ts +0 -2
- package/dist/infrastructure/projection/react/useViewCheckoutIntroShown.js +0 -6
- package/dist/infrastructure/projection/react/useViewFirstAvailableCheckoutByCustomerId.d.ts +0 -10
- package/dist/infrastructure/projection/react/useViewFirstAvailableCheckoutByCustomerId.js +0 -9
- package/dist/infrastructure/projection/react/useViewFiveItemsDiscountByCustomerId.d.ts +0 -10
- package/dist/infrastructure/projection/react/useViewFiveItemsDiscountByCustomerId.js +0 -9
- package/dist/infrastructure/projection/react/useViewIsCheckoutAccessibleByCustomerId.d.ts +0 -10
- package/dist/infrastructure/projection/react/useViewIsCheckoutAccessibleByCustomerId.js +0 -9
- package/dist/infrastructure/projection/react/useViewUiSettingByKey.d.ts +0 -10
- package/dist/infrastructure/projection/react/useViewUiSettingByKey.js +0 -12
- package/dist/infrastructure/projection/storageUiSettingByKeyView.d.ts +0 -13
- package/dist/infrastructure/projection/storageUiSettingByKeyView.js +0 -15
- package/dist/infrastructure/ui/components/atoms/modal/Modal.d.ts +0 -7
- package/dist/infrastructure/ui/components/atoms/modal/Modal.js +0 -7
- package/dist/infrastructure/ui/components/atoms/modal/Modal.style.d.ts +0 -21
- package/dist/infrastructure/ui/components/atoms/modal/Modal.style.js +0 -24
- package/dist/infrastructure/ui/components/atoms/spinner/Spinner.d.ts +0 -3
- package/dist/infrastructure/ui/components/atoms/spinner/Spinner.js +0 -8
- package/dist/infrastructure/ui/components/atoms/spinner/Spinner.style.d.ts +0 -9
- package/dist/infrastructure/ui/components/atoms/spinner/Spinner.style.js +0 -10
- package/dist/infrastructure/ui/components/layouts/slider/Pagination.d.ts +0 -14
- package/dist/infrastructure/ui/components/layouts/slider/Pagination.js +0 -11
- package/dist/infrastructure/ui/components/layouts/slider/Pagination.style.d.ts +0 -23
- package/dist/infrastructure/ui/components/layouts/slider/Pagination.style.js +0 -27
- package/dist/infrastructure/ui/components/layouts/slider/Slider.d.ts +0 -20
- package/dist/infrastructure/ui/components/layouts/slider/Slider.js +0 -132
- package/dist/infrastructure/ui/components/layouts/slider/Slider.style.d.ts +0 -11
- package/dist/infrastructure/ui/components/layouts/slider/Slider.style.js +0 -12
- package/dist/infrastructure/ui/components/organisms/dropdown/Dropdown.d.ts +0 -15
- package/dist/infrastructure/ui/components/organisms/dropdown/Dropdown.js +0 -20
- package/dist/infrastructure/ui/components/organisms/dropdown/Dropdown.style.d.ts +0 -6
- package/dist/infrastructure/ui/components/organisms/dropdown/Dropdown.style.js +0 -9
- package/dist/infrastructure/ui/components/templates/SafeAreaScrollView.style.d.ts +0 -10
- package/dist/infrastructure/ui/components/templates/SafeAreaScrollView.style.js +0 -11
- package/dist/infrastructure/ui/views/item/components/actions/Actions.d.ts +0 -11
- package/dist/infrastructure/ui/views/item/components/actions/Actions.js +0 -24
- package/dist/infrastructure/ui/views/item/components/actions/Actions.style.d.ts +0 -20
- package/dist/infrastructure/ui/views/item/components/actions/Actions.style.js +0 -23
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { UseQueryFunctionResult } from "@lookiero/messaging-react";
|
|
2
|
-
import { IsCheckoutAccessibleByCustomerIdProjection } from "../../../projection/checkout/viewIsCheckoutAccessibleByCustomerId";
|
|
3
|
-
interface UseViewIsCheckoutAccessibleByCustomerIdFunctionArgs {
|
|
4
|
-
readonly customerId: string | undefined;
|
|
5
|
-
}
|
|
6
|
-
interface UseViewIsCheckoutAccessibleByCustomerIdFunction {
|
|
7
|
-
(args: UseViewIsCheckoutAccessibleByCustomerIdFunctionArgs): UseQueryFunctionResult<IsCheckoutAccessibleByCustomerIdProjection>;
|
|
8
|
-
}
|
|
9
|
-
declare const useViewIsCheckoutAccessibleByCustomerId: UseViewIsCheckoutAccessibleByCustomerIdFunction;
|
|
10
|
-
export { useViewIsCheckoutAccessibleByCustomerId };
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { useQuery } from "@lookiero/messaging-react";
|
|
2
|
-
import { viewIsCheckoutAccessibleByCustomerId, } from "../../../projection/checkout/viewIsCheckoutAccessibleByCustomerId";
|
|
3
|
-
import { CHECKOUT_MESSAGING_REACT_ID } from "../../delivery/bootstrap";
|
|
4
|
-
const useViewIsCheckoutAccessibleByCustomerId = ({ customerId }) => useQuery({
|
|
5
|
-
query: viewIsCheckoutAccessibleByCustomerId({ customerId }),
|
|
6
|
-
contextId: CHECKOUT_MESSAGING_REACT_ID,
|
|
7
|
-
options: { staleTime: Infinity, retry: false, refetchOnWindowFocus: false },
|
|
8
|
-
});
|
|
9
|
-
export { useViewIsCheckoutAccessibleByCustomerId };
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { UseQueryFunctionResult } from "@lookiero/messaging-react";
|
|
2
|
-
import { UiSettingProjection } from "../../../projection/uiSetting/viewUiSettingByKey";
|
|
3
|
-
interface UseViewUiSettingByKeyFunctionArgs {
|
|
4
|
-
readonly key: string;
|
|
5
|
-
}
|
|
6
|
-
interface UseViewUiSettingByKeyFunction {
|
|
7
|
-
(args: UseViewUiSettingByKeyFunctionArgs): UseQueryFunctionResult<UiSettingProjection>;
|
|
8
|
-
}
|
|
9
|
-
declare const useViewUiSettingByKey: UseViewUiSettingByKeyFunction;
|
|
10
|
-
export { useViewUiSettingByKey };
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { useQuery } from "@lookiero/messaging-react";
|
|
2
|
-
import { UI_SETTING_UPDATED } from "../../../domain/uiSetting/model/uiSettingUpdated";
|
|
3
|
-
import { viewUiSettingByKey } from "../../../projection/uiSetting/viewUiSettingByKey";
|
|
4
|
-
import { CHECKOUT_MESSAGING_REACT_ID } from "../../delivery/bootstrap";
|
|
5
|
-
const isUiSettingUpdated = (event) => event.name === UI_SETTING_UPDATED;
|
|
6
|
-
const useViewUiSettingByKey = ({ key }) => useQuery({
|
|
7
|
-
query: viewUiSettingByKey({ key }),
|
|
8
|
-
contextId: CHECKOUT_MESSAGING_REACT_ID,
|
|
9
|
-
invalidation: isUiSettingUpdated,
|
|
10
|
-
options: { staleTime: Infinity, retry: false, refetchOnWindowFocus: false },
|
|
11
|
-
});
|
|
12
|
-
export { useViewUiSettingByKey };
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { UiSettingByKeyView } from "../../projection/uiSetting/viewUiSettingByKey";
|
|
2
|
-
import { ReadFunction } from "../persistence/storage";
|
|
3
|
-
import { UiSettingDto } from "../persistence/uiSettingData";
|
|
4
|
-
interface StorageUiSettingByKeyView extends UiSettingByKeyView {
|
|
5
|
-
}
|
|
6
|
-
interface StorageUiSettingByKeyViewFunctionArgs {
|
|
7
|
-
readonly read: ReadFunction<UiSettingDto>;
|
|
8
|
-
}
|
|
9
|
-
interface StorageUiSettingByKeyViewFunction {
|
|
10
|
-
(args: StorageUiSettingByKeyViewFunctionArgs): StorageUiSettingByKeyView;
|
|
11
|
-
}
|
|
12
|
-
declare const storageUiSettingByKeyView: StorageUiSettingByKeyViewFunction;
|
|
13
|
-
export { storageUiSettingByKeyView };
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
const toUiSettingProjection = (uiSettingDto) => ({
|
|
2
|
-
id: uiSettingDto.id,
|
|
3
|
-
key: uiSettingDto.key,
|
|
4
|
-
value: uiSettingDto.value,
|
|
5
|
-
});
|
|
6
|
-
const storageUiSettingByKeyView = ({ read }) => async ({ key }) => {
|
|
7
|
-
try {
|
|
8
|
-
const uiSettingDto = await read(key);
|
|
9
|
-
return uiSettingDto ? toUiSettingProjection(uiSettingDto) : undefined;
|
|
10
|
-
}
|
|
11
|
-
catch (ignored) {
|
|
12
|
-
throw new Error("Could not fetch the uiSetting");
|
|
13
|
-
}
|
|
14
|
-
};
|
|
15
|
-
export { storageUiSettingByKeyView };
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Modal as RNModal, View } from "react-native";
|
|
3
|
-
import { style } from "./Modal.style";
|
|
4
|
-
const Modal = ({ children, visible }) => (React.createElement(RNModal, { transparent: true, visible: visible },
|
|
5
|
-
React.createElement(View, { style: style.centeredView },
|
|
6
|
-
React.createElement(View, { style: style.modalView }, children))));
|
|
7
|
-
export { Modal };
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
declare const style: {
|
|
2
|
-
centeredView: {
|
|
3
|
-
backgroundColor: string;
|
|
4
|
-
flex: number;
|
|
5
|
-
justifyContent: "center";
|
|
6
|
-
paddingHorizontal: number;
|
|
7
|
-
};
|
|
8
|
-
modalView: {
|
|
9
|
-
backgroundColor: string;
|
|
10
|
-
elevation: number;
|
|
11
|
-
padding: number;
|
|
12
|
-
shadowColor: string;
|
|
13
|
-
shadowOffset: {
|
|
14
|
-
width: number;
|
|
15
|
-
height: number;
|
|
16
|
-
};
|
|
17
|
-
shadowOpacity: number;
|
|
18
|
-
shadowRadius: number;
|
|
19
|
-
};
|
|
20
|
-
};
|
|
21
|
-
export { style };
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { StyleSheet } from "react-native";
|
|
2
|
-
import { theme } from "../../../theme/theme";
|
|
3
|
-
const { colorBase, colorContent, colorOverlay, spaceXL } = theme();
|
|
4
|
-
const style = StyleSheet.create({
|
|
5
|
-
centeredView: {
|
|
6
|
-
backgroundColor: colorOverlay,
|
|
7
|
-
flex: 1,
|
|
8
|
-
justifyContent: "center",
|
|
9
|
-
paddingHorizontal: spaceXL,
|
|
10
|
-
},
|
|
11
|
-
modalView: {
|
|
12
|
-
backgroundColor: colorBase,
|
|
13
|
-
elevation: 5,
|
|
14
|
-
padding: spaceXL,
|
|
15
|
-
shadowColor: colorContent,
|
|
16
|
-
shadowOffset: {
|
|
17
|
-
width: 0,
|
|
18
|
-
height: 2,
|
|
19
|
-
},
|
|
20
|
-
shadowOpacity: 0.25,
|
|
21
|
-
shadowRadius: 4,
|
|
22
|
-
},
|
|
23
|
-
});
|
|
24
|
-
export { style };
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { ActivityIndicator, View } from "react-native";
|
|
3
|
-
import { theme } from "../../../theme/theme";
|
|
4
|
-
import { style } from "./Spinner.style";
|
|
5
|
-
const { colorPrimary } = theme();
|
|
6
|
-
const Spinner = () => (React.createElement(View, { style: style.container },
|
|
7
|
-
React.createElement(ActivityIndicator, { size: "large", color: colorPrimary })));
|
|
8
|
-
export { Spinner };
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { FC } from "react";
|
|
2
|
-
import { StyleProp, ViewStyle } from "react-native";
|
|
3
|
-
interface PaginationProps {
|
|
4
|
-
readonly touchable?: boolean;
|
|
5
|
-
readonly paginationStyle?: StyleProp<ViewStyle>;
|
|
6
|
-
readonly paginationItemStyle?: StyleProp<ViewStyle>;
|
|
7
|
-
readonly paginationActiveItemStyle?: StyleProp<ViewStyle>;
|
|
8
|
-
readonly count?: number;
|
|
9
|
-
readonly activeIndex?: number;
|
|
10
|
-
readonly onChange: (index: number) => void;
|
|
11
|
-
readonly renderItem?: (index: number) => JSX.Element;
|
|
12
|
-
}
|
|
13
|
-
declare const Pagination: FC<PaginationProps>;
|
|
14
|
-
export { Pagination };
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Pressable, View } from "react-native";
|
|
3
|
-
import { style } from "./Pagination.style";
|
|
4
|
-
const Pagination = ({ touchable = true, paginationStyle, paginationItemStyle, paginationActiveItemStyle, count = 0, activeIndex = 0, renderItem, onChange, }) => (React.createElement(View, { style: [style.paginationWrapper, paginationStyle], testID: "slider-pagination" }, Array.from(Array(count).keys()).map((index) => (React.createElement(View, { key: index, style: style.paginationContainer },
|
|
5
|
-
React.createElement(Pressable, { onPress: !touchable ? undefined : () => onChange(index), style: [
|
|
6
|
-
style.paginationItem,
|
|
7
|
-
activeIndex === index && style.active,
|
|
8
|
-
paginationItemStyle,
|
|
9
|
-
activeIndex === index && paginationActiveItemStyle,
|
|
10
|
-
], testID: "slider-pagination-item" }, renderItem?.(index)))))));
|
|
11
|
-
export { Pagination };
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
declare const style: {
|
|
2
|
-
paginationWrapper: {
|
|
3
|
-
alignItems: "center";
|
|
4
|
-
bottom: number;
|
|
5
|
-
flexDirection: "row";
|
|
6
|
-
justifyContent: "center";
|
|
7
|
-
position: "absolute";
|
|
8
|
-
width: string;
|
|
9
|
-
};
|
|
10
|
-
paginationContainer: {
|
|
11
|
-
margin: number;
|
|
12
|
-
};
|
|
13
|
-
paginationItem: {
|
|
14
|
-
width: number;
|
|
15
|
-
height: number;
|
|
16
|
-
borderRadius: number;
|
|
17
|
-
backgroundColor: string;
|
|
18
|
-
};
|
|
19
|
-
active: {
|
|
20
|
-
backgroundColor: string;
|
|
21
|
-
};
|
|
22
|
-
};
|
|
23
|
-
export { style };
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import { StyleSheet } from "react-native";
|
|
2
|
-
import { theme } from "../../../theme/theme";
|
|
3
|
-
const { colorGrayscaleS, colorGrayscaleXL } = theme();
|
|
4
|
-
const DOT_SIZE = 8;
|
|
5
|
-
const style = StyleSheet.create({
|
|
6
|
-
paginationWrapper: {
|
|
7
|
-
alignItems: "center",
|
|
8
|
-
bottom: 10,
|
|
9
|
-
flexDirection: "row",
|
|
10
|
-
justifyContent: "center",
|
|
11
|
-
position: "absolute",
|
|
12
|
-
width: "100%",
|
|
13
|
-
},
|
|
14
|
-
paginationContainer: {
|
|
15
|
-
margin: 3,
|
|
16
|
-
},
|
|
17
|
-
paginationItem: {
|
|
18
|
-
width: DOT_SIZE,
|
|
19
|
-
height: DOT_SIZE,
|
|
20
|
-
borderRadius: DOT_SIZE / 2,
|
|
21
|
-
backgroundColor: colorGrayscaleS,
|
|
22
|
-
},
|
|
23
|
-
active: {
|
|
24
|
-
backgroundColor: colorGrayscaleXL,
|
|
25
|
-
},
|
|
26
|
-
});
|
|
27
|
-
export { style };
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { FC, ReactNode } from "react";
|
|
2
|
-
import { StyleProp, ViewStyle } from "react-native";
|
|
3
|
-
interface SliderProps {
|
|
4
|
-
readonly children: ReactNode[];
|
|
5
|
-
readonly active?: number;
|
|
6
|
-
readonly loop?: boolean;
|
|
7
|
-
readonly minDistanceToCapture?: number;
|
|
8
|
-
readonly minDistanceForAction?: number;
|
|
9
|
-
readonly gesturesEnabled?: boolean;
|
|
10
|
-
readonly paginationEnabled?: boolean;
|
|
11
|
-
readonly paginationStyle?: StyleProp<ViewStyle>;
|
|
12
|
-
readonly paginationItemStyle?: StyleProp<ViewStyle>;
|
|
13
|
-
readonly paginationActiveItemStyle?: StyleProp<ViewStyle>;
|
|
14
|
-
readonly onSliderStart?: () => void;
|
|
15
|
-
readonly onSliderEnd?: () => void;
|
|
16
|
-
readonly onChanged?: (index: number) => void;
|
|
17
|
-
readonly paginationRenderItem?: (index: number) => JSX.Element;
|
|
18
|
-
}
|
|
19
|
-
declare const Slider: FC<SliderProps>;
|
|
20
|
-
export { Slider };
|
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
import React, { useCallback, useEffect, useRef, useState } from "react";
|
|
2
|
-
import { Animated, I18nManager, PanResponder, StyleSheet, View, } from "react-native";
|
|
3
|
-
import { Pagination } from "./Pagination";
|
|
4
|
-
import { style } from "./Slider.style";
|
|
5
|
-
const DEFAULT_WIDTH = 200;
|
|
6
|
-
const Slider = ({ children, active = 0, loop = false, minDistanceToCapture = 5, minDistanceForAction = 0.2, gesturesEnabled = true, paginationEnabled = true, paginationStyle, paginationItemStyle, paginationActiveItemStyle, onSliderStart, onSliderEnd, onChanged, paginationRenderItem, }) => {
|
|
7
|
-
const flatennedChildren = children.flat();
|
|
8
|
-
const count = flatennedChildren.length;
|
|
9
|
-
const [width, setWidth] = useState(0);
|
|
10
|
-
const widthRef = useRef(width);
|
|
11
|
-
const activeIndex = useRef(active);
|
|
12
|
-
const animatedValueX = useRef(0);
|
|
13
|
-
const animatedValueY = useRef(0);
|
|
14
|
-
const pan = useRef(new Animated.ValueXY()).current;
|
|
15
|
-
const started = useRef(false);
|
|
16
|
-
const panResponder = useRef(PanResponder.create({
|
|
17
|
-
onPanResponderTerminationRequest: () => false,
|
|
18
|
-
onMoveShouldSetPanResponder: () => gesturesEnabled,
|
|
19
|
-
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
20
|
-
onMoveShouldSetPanResponderCapture: (_e, gestureState) => {
|
|
21
|
-
if (!gesturesEnabled) {
|
|
22
|
-
return false;
|
|
23
|
-
}
|
|
24
|
-
startAnimation();
|
|
25
|
-
const allow = Math.abs(gestureState.dx) > minDistanceToCapture;
|
|
26
|
-
return allow;
|
|
27
|
-
},
|
|
28
|
-
onPanResponderGrant: () => fixState(),
|
|
29
|
-
onPanResponderMove: Animated.event([null, { dx: pan.x }], {
|
|
30
|
-
useNativeDriver: false,
|
|
31
|
-
}),
|
|
32
|
-
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
33
|
-
onPanResponderRelease: (_e, gesture) => {
|
|
34
|
-
const correction = gesture.moveX - gesture.x0;
|
|
35
|
-
if (Math.abs(correction) < widthRef.current * minDistanceForAction) {
|
|
36
|
-
spring({ x: 0, y: 0 });
|
|
37
|
-
}
|
|
38
|
-
else {
|
|
39
|
-
changeIndex(correction > 0 ? (I18nManager.isRTL ? 1 : -1) : I18nManager.isRTL ? -1 : 1);
|
|
40
|
-
}
|
|
41
|
-
},
|
|
42
|
-
onPanResponderEnd: () => endAnimation(),
|
|
43
|
-
})).current;
|
|
44
|
-
const startAnimation = useCallback(() => {
|
|
45
|
-
if (!started.current) {
|
|
46
|
-
onSliderStart?.();
|
|
47
|
-
started.current = true;
|
|
48
|
-
}
|
|
49
|
-
}, [onSliderStart]);
|
|
50
|
-
const endAnimation = useCallback(() => {
|
|
51
|
-
if (started.current) {
|
|
52
|
-
onSliderEnd?.();
|
|
53
|
-
started.current = false;
|
|
54
|
-
}
|
|
55
|
-
}, [onSliderEnd]);
|
|
56
|
-
const fixState = useCallback(() => {
|
|
57
|
-
animatedValueX.current = widthRef.current * activeIndex.current * (I18nManager.isRTL ? 1 : -1);
|
|
58
|
-
animatedValueY.current = 0;
|
|
59
|
-
pan.setOffset({
|
|
60
|
-
x: animatedValueX.current,
|
|
61
|
-
y: animatedValueY.current,
|
|
62
|
-
});
|
|
63
|
-
pan.setValue({ x: 0, y: 0 });
|
|
64
|
-
}, [pan]);
|
|
65
|
-
const spring = useCallback((toValue) => {
|
|
66
|
-
Animated.spring(pan, {
|
|
67
|
-
toValue,
|
|
68
|
-
useNativeDriver: false,
|
|
69
|
-
}).start();
|
|
70
|
-
}, [pan]);
|
|
71
|
-
const changeIndex = useCallback((delta = 1) => {
|
|
72
|
-
const toValue = { x: 0, y: 0 };
|
|
73
|
-
let skipChanges = !delta;
|
|
74
|
-
let calcDelta = delta;
|
|
75
|
-
if (activeIndex.current <= 0 && delta < 0) {
|
|
76
|
-
skipChanges = !loop;
|
|
77
|
-
calcDelta = count + delta;
|
|
78
|
-
}
|
|
79
|
-
else if (activeIndex.current + 1 >= count && delta > 0) {
|
|
80
|
-
skipChanges = !loop;
|
|
81
|
-
calcDelta = -1 * activeIndex.current + delta - 1;
|
|
82
|
-
}
|
|
83
|
-
if (skipChanges) {
|
|
84
|
-
return spring(toValue);
|
|
85
|
-
}
|
|
86
|
-
const index = activeIndex.current + calcDelta;
|
|
87
|
-
activeIndex.current = index;
|
|
88
|
-
toValue.x = widthRef.current * (I18nManager.isRTL ? 1 : -1) * calcDelta;
|
|
89
|
-
spring(toValue);
|
|
90
|
-
onChanged?.(index);
|
|
91
|
-
}, [count, loop, onChanged, spring]);
|
|
92
|
-
const fixAndGo = useCallback((delta) => {
|
|
93
|
-
fixState();
|
|
94
|
-
startAnimation();
|
|
95
|
-
changeIndex(delta);
|
|
96
|
-
}, [changeIndex, fixState, startAnimation]);
|
|
97
|
-
const goTo = useCallback((index = 0) => {
|
|
98
|
-
const delta = index - activeIndex.current;
|
|
99
|
-
if (delta) {
|
|
100
|
-
fixAndGo(delta);
|
|
101
|
-
}
|
|
102
|
-
}, [fixAndGo]);
|
|
103
|
-
const getActiveIndex = useCallback(() => activeIndex.current, []);
|
|
104
|
-
useEffect(() => {
|
|
105
|
-
pan.x.addListener(({ value }) => (animatedValueX.current = value));
|
|
106
|
-
pan.y.addListener(({ value }) => (animatedValueY.current = value));
|
|
107
|
-
return () => {
|
|
108
|
-
pan.x.removeAllListeners();
|
|
109
|
-
pan.y.removeAllListeners();
|
|
110
|
-
};
|
|
111
|
-
}, [pan.x, pan.y]);
|
|
112
|
-
useEffect(() => {
|
|
113
|
-
if (activeIndex.current !== active) {
|
|
114
|
-
goTo(active);
|
|
115
|
-
}
|
|
116
|
-
}, [active, goTo]);
|
|
117
|
-
const onLayoutWrapper = useCallback(({ nativeEvent: { layout: { width: wrapperWidth }, }, }) => {
|
|
118
|
-
const width = wrapperWidth || DEFAULT_WIDTH;
|
|
119
|
-
setWidth(width);
|
|
120
|
-
widthRef.current = width;
|
|
121
|
-
fixState();
|
|
122
|
-
}, [fixState]);
|
|
123
|
-
return (React.createElement(View, { style: style.container, onLayout: onLayoutWrapper, testID: "slider" },
|
|
124
|
-
React.createElement(Animated.View, { style: StyleSheet.flatten([
|
|
125
|
-
{
|
|
126
|
-
transform: [{ translateX: pan.x }, { translateY: pan.y }],
|
|
127
|
-
},
|
|
128
|
-
style.sliderAreaStyle,
|
|
129
|
-
]), ...panResponder.panHandlers }, flatennedChildren.map((child, index) => (React.createElement(View, { key: index, style: { width }, testID: "slider-child" }, child)))),
|
|
130
|
-
paginationEnabled && (React.createElement(Pagination, { count: count, activeIndex: getActiveIndex(), onChange: (index) => goTo(index), paginationStyle: paginationStyle, paginationItemStyle: paginationItemStyle, paginationActiveItemStyle: paginationActiveItemStyle, renderItem: paginationRenderItem }))));
|
|
131
|
-
};
|
|
132
|
-
export { Slider };
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { FC } from "react";
|
|
2
|
-
interface Option {
|
|
3
|
-
readonly name: string;
|
|
4
|
-
readonly value: string;
|
|
5
|
-
}
|
|
6
|
-
interface DrodownProps {
|
|
7
|
-
readonly defaultValue: string;
|
|
8
|
-
readonly label: string;
|
|
9
|
-
readonly name: string;
|
|
10
|
-
readonly options: Option[];
|
|
11
|
-
readonly disabled?: boolean;
|
|
12
|
-
readonly onChanged?: (value: string) => void;
|
|
13
|
-
}
|
|
14
|
-
declare const Dropdown: FC<DrodownProps>;
|
|
15
|
-
export { Dropdown };
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import React, { useCallback, useState } from "react";
|
|
2
|
-
import { View } from "react-native";
|
|
3
|
-
import { InputDropdown } from "@lookiero/aurora-next/build/components/organisms/InputDropdown/InputDropdown";
|
|
4
|
-
import { style } from "./Dropdown.style";
|
|
5
|
-
const Dropdown = ({ defaultValue, label, name, options, disabled = false, onChanged }) => {
|
|
6
|
-
const [value, setValue] = useState(defaultValue);
|
|
7
|
-
const handleOnChange = useCallback((value) => {
|
|
8
|
-
setValue(value);
|
|
9
|
-
onChanged?.(value);
|
|
10
|
-
}, [onChanged]);
|
|
11
|
-
return (React.createElement(View, { pointerEvents: disabled ? "none" : "auto" },
|
|
12
|
-
React.createElement(InputDropdown, { label: label, name: name, options: options, value: value, onChange: handleOnChange,
|
|
13
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
14
|
-
// @ts-ignore
|
|
15
|
-
disabled: disabled,
|
|
16
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
17
|
-
// @ts-ignore
|
|
18
|
-
style: style.dropdown })));
|
|
19
|
-
};
|
|
20
|
-
export { Dropdown };
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { SizeProjection } from "../../../../../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
|
|
2
|
-
import { FC } from "react";
|
|
3
|
-
interface ActionsProps {
|
|
4
|
-
readonly sizes: SizeProjection[];
|
|
5
|
-
readonly size: SizeProjection;
|
|
6
|
-
readonly onKeep: (value: string) => void;
|
|
7
|
-
readonly onReturn: (value: string) => void;
|
|
8
|
-
readonly onReplace: (value: string) => void;
|
|
9
|
-
}
|
|
10
|
-
declare const Actions: FC<ActionsProps>;
|
|
11
|
-
export { Actions };
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { Button } from "@lookiero/aurora-next/build/components/atoms/Button/Button";
|
|
2
|
-
import { BUTTON_VARIANT } from "@lookiero/aurora-next/build/components/atoms/Button/Button.definition";
|
|
3
|
-
import { Dropdown } from "../../../../components/organisms/dropdown/Dropdown";
|
|
4
|
-
import { I18nMessages } from "../../../../i18n/i18n";
|
|
5
|
-
import { useI18nMessage } from "@lookiero/i18n-react";
|
|
6
|
-
import { View } from "react-native";
|
|
7
|
-
import React, { useMemo } from "react";
|
|
8
|
-
import { style } from "./Actions.style";
|
|
9
|
-
const Actions = ({ sizes, size, onKeep, onReplace, onReturn }) => {
|
|
10
|
-
const sizesLabelText = useI18nMessage({ id: I18nMessages.ITEM_SIZES_LABEL });
|
|
11
|
-
const sizesNameText = useI18nMessage({ id: I18nMessages.ITEM_SIZES_NAME });
|
|
12
|
-
const keepButtonText = useI18nMessage({ id: I18nMessages.ITEM_KEEP_BUTTON });
|
|
13
|
-
const returnButtonText = useI18nMessage({ id: I18nMessages.ITEM_RETURN_BUTTON });
|
|
14
|
-
const options = useMemo(() => sizes.map((size) => ({ name: size.lookiero, value: size.id })), [sizes]);
|
|
15
|
-
const disabled = useMemo(() => options.length === 1 && options[0]?.value === size.id, [options, size.id]);
|
|
16
|
-
return (React.createElement(View, { style: style.container },
|
|
17
|
-
React.createElement(Button, { onPress: onKeep }, keepButtonText),
|
|
18
|
-
React.createElement(View, { style: style.row },
|
|
19
|
-
!size.unique && (React.createElement(View, { style: style.dropdownContainer },
|
|
20
|
-
React.createElement(Dropdown, { defaultValue: size.id, label: sizesLabelText, name: sizesNameText, options: options, onChanged: onReplace, disabled: disabled }))),
|
|
21
|
-
React.createElement(View, { style: style.returnButtonContainer },
|
|
22
|
-
React.createElement(Button, { variant: BUTTON_VARIANT.SECONDARY, onPress: onReturn }, returnButtonText)))));
|
|
23
|
-
};
|
|
24
|
-
export { Actions };
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
declare const style: {
|
|
2
|
-
container: {
|
|
3
|
-
padding: number;
|
|
4
|
-
width: string;
|
|
5
|
-
};
|
|
6
|
-
row: {
|
|
7
|
-
alignItems: "center";
|
|
8
|
-
flexDirection: "row";
|
|
9
|
-
marginTop: number;
|
|
10
|
-
};
|
|
11
|
-
dropdownContainer: {
|
|
12
|
-
flex: number;
|
|
13
|
-
zIndex: number;
|
|
14
|
-
marginRight: number;
|
|
15
|
-
};
|
|
16
|
-
returnButtonContainer: {
|
|
17
|
-
flex: number;
|
|
18
|
-
};
|
|
19
|
-
};
|
|
20
|
-
export { style };
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { StyleSheet } from "react-native";
|
|
2
|
-
import { theme } from "../../../../theme/theme";
|
|
3
|
-
const { spaceL } = theme();
|
|
4
|
-
const style = StyleSheet.create({
|
|
5
|
-
container: {
|
|
6
|
-
padding: spaceL,
|
|
7
|
-
width: "100%",
|
|
8
|
-
},
|
|
9
|
-
row: {
|
|
10
|
-
alignItems: "center",
|
|
11
|
-
flexDirection: "row",
|
|
12
|
-
marginTop: spaceL,
|
|
13
|
-
},
|
|
14
|
-
dropdownContainer: {
|
|
15
|
-
flex: 1,
|
|
16
|
-
zIndex: 4,
|
|
17
|
-
marginRight: spaceL,
|
|
18
|
-
},
|
|
19
|
-
returnButtonContainer: {
|
|
20
|
-
flex: 1,
|
|
21
|
-
},
|
|
22
|
-
});
|
|
23
|
-
export { style };
|