@lookiero/checkout 8.13.2 → 8.13.3-beta.1

package/dist/src/infrastructure/projection/checkout/react/useViewIsCheckoutAccessibleByCustomerId.d.ts

@@ -0,0 +1,10 @@
+import { UseQueryFunctionResult } from "@lookiero/messaging-react";
+import { IsCheckoutAccessibleByCustomerIdProjection } from "../../../../projection/checkout/viewIsCheckoutAccessibleByCustomerId";
+interface UseViewIsCheckoutAccessibleByCustomerIdFunctionArgs {
+    readonly customerId: string | undefined;
+}
+interface UseViewIsCheckoutAccessibleByCustomerIdFunction {
+    (args: UseViewIsCheckoutAccessibleByCustomerIdFunctionArgs): UseQueryFunctionResult<IsCheckoutAccessibleByCustomerIdProjection>;
+}
+declare const useViewIsCheckoutAccessibleByCustomerId: UseViewIsCheckoutAccessibleByCustomerIdFunction;
+export { useViewIsCheckoutAccessibleByCustomerId };

package/dist/src/infrastructure/projection/checkout/react/useViewIsCheckoutAccessibleByCustomerId.js

@@ -0,0 +1,17 @@
+import { useQuery } from "@lookiero/messaging-react";
+import { isCheckoutFeedbackGiven } from "../../../../domain/checkoutFeedback/model/checkoutFeedbackGiven";
+import { viewIsCheckoutAccessibleByCustomerId, } from "../../../../projection/checkout/viewIsCheckoutAccessibleByCustomerId";
+import { MESSAGING_CONTEXT_ID } from "../../../delivery/baseBootstrap";
+const useViewIsCheckoutAccessibleByCustomerId = ({ customerId }) => useQuery({
+    query: viewIsCheckoutAccessibleByCustomerId({ customerId }),
+    contextId: MESSAGING_CONTEXT_ID,
+    invalidation: isCheckoutFeedbackGiven,
+    options: {
+        refetchOnMount: "always",
+        staleTime: Infinity,
+        retry: false,
+        refetchOnWindowFocus: false,
+        cacheTime: 0,
+    },
+});
+export { useViewIsCheckoutAccessibleByCustomerId };

package/dist/src/infrastructure/ui/components/layouts/layout/Layout.d.ts

@@ -0,0 +1,21 @@
+import { FC, ReactNode, RefObject } from "react";
+import { LayoutChangeEvent, ScrollView, StyleProp, ViewStyle } from "react-native";
+interface LayoutStyle {
+    readonly safeAreaView: StyleProp<ViewStyle>;
+    readonly scrollView: StyleProp<ViewStyle>;
+    readonly header: StyleProp<ViewStyle>;
+}
+interface LayoutProps {
+    readonly children: ReactNode;
+    readonly header?: JSX.Element | null;
+    readonly footer?: JSX.Element | null;
+    readonly panel?: JSX.Element | null;
+    readonly stickyHeader?: boolean;
+    readonly stickyHeaderHiddenOnScroll?: boolean;
+    readonly scrollRef?: RefObject<ScrollView>;
+    readonly scrollEnabled?: boolean;
+    readonly style?: Partial<LayoutStyle>;
+    readonly onLayout?: (event: LayoutChangeEvent) => void;
+}
+type Layout = FC<LayoutProps>;
+export type { Layout };

package/dist/src/infrastructure/ui/components/layouts/layout/Layout.js

@@ -0,0 +1 @@
+export {};

package/dist/src/infrastructure/ui/components/layouts/layout/components/footer/Footer.d.ts

@@ -0,0 +1,6 @@
+import { FC, ReactNode } from "react";
+interface FooterProps {
+    readonly children: ReactNode;
+}
+declare const Footer: FC<FooterProps>;
+export { Footer };

package/dist/src/infrastructure/ui/components/layouts/layout/components/footer/Footer.js

@@ -0,0 +1,4 @@
+import React from "react";
+import { Platform } from "react-native";
+const Footer = ({ children }) => (Platform.OS !== "web" ? React.createElement(React.Fragment, null, children) : null);
+export { Footer };

package/dist/src/infrastructure/ui/components/layouts/layout/components/header/Header.d.ts

@@ -0,0 +1,6 @@
+import { FC, ReactNode } from "react";
+interface HeaderProps {
+    readonly children: ReactNode;
+}
+declare const Header: FC<HeaderProps>;
+export { Header };

package/dist/src/infrastructure/ui/components/layouts/layout/components/header/Header.js

@@ -0,0 +1,5 @@
+import React from "react";
+import { View } from "react-native";
+import { style } from "./Header.style";
+const Header = ({ children }) => React.createElement(View, { style: style.header }, children);
+export { Header };

package/dist/src/infrastructure/ui/components/layouts/layout/components/header/Header.style.d.ts

@@ -0,0 +1,4 @@
+declare const style: {
+    header: {};
+};
+export { style };

package/dist/src/infrastructure/ui/components/layouts/layout/components/header/Header.style.js

@@ -0,0 +1,19 @@
+import { Platform, StyleSheet } from "react-native";
+import { HEADER_HEIGHT } from "../../../../templates/header/Header.style";
+const style = StyleSheet.create({
+    header: {
+        ...Platform.select({
+            web: {
+                position: "sticky",
+                top: 0,
+                zIndex: 10,
+                height: HEADER_HEIGHT,
+            },
+            native: {
+                position: "relative",
+                height: HEADER_HEIGHT,
+            },
+        }),
+    },
+});
+export { style };

package/dist/src/infrastructure/ui/components/layouts/layout/dummyLayout/DummyLayout.d.ts

@@ -0,0 +1,3 @@
+import { Layout } from "../Layout";
+declare const DummyLayout: Layout;
+export { DummyLayout };

package/dist/src/infrastructure/ui/components/layouts/layout/dummyLayout/DummyLayout.js

@@ -0,0 +1,18 @@
+/* eslint-disable react/prop-types */
+import React from "react";
+import { View } from "react-native";
+import { GestureHandlerRootView, ScrollView as RNGHScrollView } from "react-native-gesture-handler";
+import { SafeAreaView } from "react-native-safe-area-context";
+import { Footer as DefaultFooter } from "../../../templates/footer/Footer";
+import { DefaultHeader } from "../../../templates/header/defaultHeader/DefaultHeader";
+import { Footer } from "../components/footer/Footer";
+import { Header } from "../components/header/Header";
+import { style } from "./DummyLayout.style";
+const DummyLayout = ({ children, header = React.createElement(DefaultHeader, null), footer = React.createElement(DefaultFooter, null), panel, style: customStyle, scrollEnabled, onLayout, }) => (React.createElement(SafeAreaView, { style: [style.safeAreaView, customStyle?.safeAreaView] },
+    React.createElement(GestureHandlerRootView, { style: { flex: 1 } },
+        React.createElement(RNGHScrollView, { contentContainerStyle: [style.scrollView, customStyle?.scrollView], scrollEnabled: scrollEnabled, scrollEventThrottle: 16, showsVerticalScrollIndicator: false, stickyHeaderIndices: [0] },
+            React.createElement(Header, null, header),
+            panel,
+            React.createElement(View, { style: style.children, onLayout: onLayout }, children))),
+    React.createElement(Footer, null, footer)));
+export { DummyLayout };

package/dist/src/infrastructure/ui/components/layouts/layout/dummyLayout/DummyLayout.style.d.ts

@@ -0,0 +1,12 @@
+declare const style: {
+    children: {
+        flex: number;
+    };
+    safeAreaView: {
+        flex: number;
+    };
+    scrollView: {
+        flexGrow: number;
+    };
+};
+export { style };

package/dist/src/infrastructure/ui/components/layouts/layout/dummyLayout/DummyLayout.style.js

@@ -0,0 +1,13 @@
+import { StyleSheet } from "react-native";
+const style = StyleSheet.create({
+    children: {
+        flex: 1,
+    },
+    safeAreaView: {
+        flex: 1,
+    },
+    scrollView: {
+        flexGrow: 1,
+    },
+});
+export { style };

package/dist/src/infrastructure/ui/components/templates/header/defaultHeader/DefaultHeader.d.ts

@@ -0,0 +1,6 @@
+import { FC } from "react";
+interface DefaultHeaderProps {
+    readonly onPressMenu?: () => void;
+}
+declare const DefaultHeader: FC<DefaultHeaderProps>;
+export { DefaultHeader };

package/dist/src/infrastructure/ui/components/templates/header/defaultHeader/DefaultHeader.js

@@ -0,0 +1,11 @@
+import React from "react";
+import { ButtonIcon } from "@lookiero/aurora";
+import { Header } from "../Header";
+import { ButtonIconPlaceholder } from "../buttonIconPlaceholder/ButtonIconPlaceholder";
+import { Logo } from "../logo/Logo";
+import { style } from "./DefaultHeader.style";
+const DefaultHeader = ({ onPressMenu }) => (React.createElement(Header, { testID: "default-header" },
+    React.createElement(Logo, null),
+    React.createElement(ButtonIconPlaceholder, null),
+    React.createElement(ButtonIcon, { name: "menu", style: style.button, testID: "menu-button-icon", onPress: onPressMenu })));
+export { DefaultHeader };

package/dist/src/infrastructure/ui/components/templates/header/defaultHeader/DefaultHeader.style.d.ts

@@ -0,0 +1,8 @@
+declare const style: {
+    button: {
+        alignSelf: "auto";
+        height: number;
+        width: number;
+    };
+};
+export { style };

package/dist/src/infrastructure/ui/components/templates/header/defaultHeader/DefaultHeader.style.js

@@ -0,0 +1,11 @@
+import { StyleSheet } from "react-native";
+import { theme } from "@lookiero/sty-psp-ui";
+const { space10 } = theme();
+const style = StyleSheet.create({
+    button: {
+        alignSelf: "auto",
+        height: space10,
+        width: space10,
+    },
+});
+export { style };

package/dist/src/infrastructure/ui/hooks/useNewFeedbackExperiment.d.ts

@@ -0,0 +1,11 @@
+import { FC, ReactNode } from "react";
+declare enum NewFeedbackExperimentVariation {
+    CONTROL = "control",
+    RETURN_PAGE = "return_page"
+}
+interface NewFeedbackExperimentProviderProps {
+    readonly children: ReactNode;
+}
+declare const NewFeedbackExperimentProvider: FC<NewFeedbackExperimentProviderProps>;
+declare const useNewFeedbackExperiment: () => NewFeedbackExperimentVariation;
+export { useNewFeedbackExperiment, NewFeedbackExperimentProvider, NewFeedbackExperimentVariation };

package/dist/src/infrastructure/ui/hooks/useNewFeedbackExperiment.js

@@ -0,0 +1,49 @@
+import React, { createContext, useContext, useEffect, useMemo, useRef } from "react";
+import invariant from "tiny-invariant";
+import { Spinner } from "@lookiero/aurora";
+import { useAssignedVariationByExperimentId } from "@lookiero/sty-psp-ab-testing";
+import { useViewFirstAvailableCheckoutByCustomerId } from "../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
+import { useTrackAssignedVariationByExperiment } from "../../tracking/useTrackAssignedVariationByExperiment";
+import { useStaticInfo } from "./useStaticInfo";
+var NewFeedbackExperimentVariation;
+(function (NewFeedbackExperimentVariation) {
+    NewFeedbackExperimentVariation["CONTROL"] = "control";
+    NewFeedbackExperimentVariation["RETURN_PAGE"] = "return_page";
+})(NewFeedbackExperimentVariation || (NewFeedbackExperimentVariation = {}));
+const NewFeedbackExperimentContext = createContext(null);
+const NewFeedbackExperimentProvider = ({ children }) => {
+    const { kameleoon: { experiments: { newFeedback: { id: newFeedbackId, variations }, }, }, customer: { customerId, country, segment }, } = useStaticInfo();
+    const [checkout] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
+    const { assignedVariation: newFeedbackVariation } = useAssignedVariationByExperimentId({
+        experimentId: newFeedbackId,
+    });
+    const trackAssignedVariation = useTrackAssignedVariationByExperiment({
+        checkoutId: checkout?.id,
+        country,
+        segment,
+        experimentId: newFeedbackId,
+    });
+    const value = useMemo(() => ({
+        variation: newFeedbackVariation?.id === Number(variations.v1)
+            ? NewFeedbackExperimentVariation.RETURN_PAGE
+            : NewFeedbackExperimentVariation.CONTROL,
+    }), [newFeedbackVariation?.id, variations.v1]);
+    const assignedVariantTracked = useRef(false);
+    useEffect(() => {
+        if (assignedVariantTracked.current || !newFeedbackVariation || !checkout?.id) {
+            return;
+        }
+        trackAssignedVariation({ assignedVariation: newFeedbackVariation });
+        assignedVariantTracked.current = true;
+    }, [checkout?.id, newFeedbackVariation, trackAssignedVariation]);
+    if (!checkout) {
+        return React.createElement(Spinner, null);
+    }
+    return React.createElement(NewFeedbackExperimentContext.Provider, { value: value }, children);
+};
+const useNewFeedbackExperiment = () => {
+    const newFeedbackExperiment = useContext(NewFeedbackExperimentContext);
+    invariant(newFeedbackExperiment, "Your are trying to use the useNewFeedbackExperiment hook without wrapping your app with the <NewFeedbackExperimentProvider>.");
+    return newFeedbackExperiment.variation;
+};
+export { useNewFeedbackExperiment, NewFeedbackExperimentProvider, NewFeedbackExperimentVariation };

package/dist/src/infrastructure/ui/i18n/fetchTranslations.d.ts

@@ -0,0 +1,9 @@
+import { EndpointFunction, FetchTranslationFuction } from "@lookiero/i18n";
+interface FetchTranslationsFuntionArgs {
+    readonly translations: EndpointFunction[];
+}
+interface FetchTranslationsFuntion {
+    (args: FetchTranslationsFuntionArgs): FetchTranslationFuction;
+}
+declare const fetchTranslations: FetchTranslationsFuntion;
+export { fetchTranslations };

package/dist/src/infrastructure/ui/i18n/fetchTranslations.js

@@ -0,0 +1,9 @@
+import { fetchFetchTranslation } from "@lookiero/i18n";
+const fetchTranslations = ({ translations }) => async ({ locale }) => {
+    const translationsMessages = await Promise.all(translations.map((endpoint) => fetchFetchTranslation({ endpoint })({ locale })));
+    return translationsMessages.reduce((acc, translationMessages) => ({
+        ...acc,
+        ...translationMessages,
+    }), {});
+};
+export { fetchTranslations };

package/dist/src/infrastructure/ui/i18n/translationEndpoint.d.ts

@@ -0,0 +1,19 @@
+import { EndpointFunction } from "@lookiero/i18n";
+interface TranslationEndpointFunctionArgs {
+    readonly translationsUrl: string;
+    readonly translationsApiKey: string;
+}
+interface TranslationEndpointFunction {
+    (args: TranslationEndpointFunctionArgs): EndpointFunction;
+}
+declare const translationEndpoint: TranslationEndpointFunction;
+type Project = "user-area-front" | "inventory-catalog" | "checkout";
+interface TranslationExternalEndpointFunctionArgs {
+    readonly translationsUrl: string;
+    readonly projects: [project: Project, filter?: string][];
+}
+interface TranslationExternalEndpointFunction {
+    (args: TranslationExternalEndpointFunctionArgs): EndpointFunction;
+}
+declare const translationExternalEndpoint: TranslationExternalEndpointFunction;
+export { translationEndpoint, translationExternalEndpoint };

package/dist/src/infrastructure/ui/i18n/translationEndpoint.js

@@ -0,0 +1,21 @@
+import { Country } from "../../../projection/shared/country";
+import { Locale } from "../../../projection/shared/locale";
+const translationEndpoint = ({ translationsUrl, translationsApiKey }) => (locale) => `${translationsUrl}/${locale}?key=${translationsApiKey}&no-folding=true`;
+const COUNTRY = {
+    [Locale.ES]: Country.ES,
+    [Locale.FR]: Country.FR,
+    [Locale.EN]: Country.GB,
+    [Locale.IT]: Country.IT,
+    [Locale.PT]: Country.PT,
+    [Locale.DE]: Country.DE,
+    [Locale.AT]: Country.AT,
+    [Locale.NL]: Country.NL,
+    [Locale.SE]: Country.SE,
+};
+const translationExternalEndpoint = ({ translationsUrl, projects }) => (locale) => {
+    const projectsQueryParam = projects
+        .map(([project, filter]) => `projectFilter=${project}${filter ? `:${filter}` : ""}`)
+        .join("&");
+    return `${translationsUrl}/${locale}/${COUNTRY[locale]}?${projectsQueryParam}`;
+};
+export { translationEndpoint, translationExternalEndpoint };

package/dist/src/infrastructure/ui/routing/CheckoutAccessibilityMiddleware.d.ts

@@ -0,0 +1,9 @@
+import { FC } from "react";
+interface CheckoutAccessibilityMiddlewareProps {
+    readonly customerId: string | undefined;
+    readonly onNotAccessible: () => void;
+    readonly loader?: JSX.Element;
+    readonly children: JSX.Element;
+}
+declare const CheckoutAccessibilityMiddleware: FC<CheckoutAccessibilityMiddlewareProps>;
+export { CheckoutAccessibilityMiddleware };

package/dist/src/infrastructure/ui/routing/CheckoutAccessibilityMiddleware.js

@@ -0,0 +1,21 @@
+import React, { useEffect, useRef } from "react";
+import { Spinner } from "@lookiero/aurora";
+import { QueryStatus } from "@lookiero/messaging-react";
+import { useViewIsCheckoutAccessibleByCustomerId } from "../../projection/checkout/react/useViewIsCheckoutAccessibleByCustomerId";
+const CheckoutAccessibilityMiddleware = ({ customerId, onNotAccessible, loader = React.createElement(Spinner, null), children, }) => {
+    const [accessible, status] = useViewIsCheckoutAccessibleByCustomerId({ customerId });
+    const onNotAccessibleRef = useRef(onNotAccessible);
+    onNotAccessibleRef.current = onNotAccessible;
+    const notAccessible = accessible === false || status === QueryStatus.ERROR;
+    useEffect(() => {
+        if (notAccessible) {
+            onNotAccessibleRef.current();
+        }
+    }, [notAccessible]);
+    return accessible === undefined && [QueryStatus.IDLE, QueryStatus.LOADING].includes(status)
+        ? loader
+        : accessible
+            ? children
+            : null;
+};
+export { CheckoutAccessibilityMiddleware };

package/dist/src/infrastructure/ui/views/feedback/components/checkoutQuestionsForm/CheckoutQuestionsForm.style.d.ts

@@ -0,0 +1,7 @@
+declare const style: {
+    buttonContainer: {
+        paddingHorizontal: number;
+        paddingVertical: number;
+    };
+};
+export { style };

package/dist/src/infrastructure/ui/views/feedback/components/checkoutQuestionsForm/CheckoutQuestionsForm.style.js

@@ -0,0 +1,10 @@
+import { StyleSheet } from "react-native";
+import { theme } from "@lookiero/sty-psp-ui";
+const { space6, space8 } = theme();
+const style = StyleSheet.create({
+    buttonContainer: {
+        paddingHorizontal: space6,
+        paddingVertical: space8,
+    },
+});
+export { style };

package/dist/src/infrastructure/ui/views/item/components/returnQuestionsForm/ReturnQuestionsForm.d.ts

@@ -0,0 +1,11 @@
+import { FC } from "react";
+import { FeedbackProjection } from "../../../../../../projection/feedback/feedback";
+import { ReturnQuestionProjection } from "../../../../../../projection/returnQuestion/returnQuestion";
+interface ReturnQuestionsFormProps {
+    readonly visible: boolean;
+    readonly returnQuestions: ReturnQuestionProjection[];
+    readonly onSubmit: (feedback: FeedbackProjection) => void;
+    readonly onClose: () => void;
+}
+declare const ReturnQuestionsForm: FC<ReturnQuestionsFormProps>;
+export { ReturnQuestionsForm };

package/dist/src/infrastructure/ui/views/item/components/returnQuestionsForm/ReturnQuestionsForm.js

@@ -0,0 +1,40 @@
+import { PortalHost } from "@gorhom/portal";
+import React, { useCallback } from "react";
+import { View } from "react-native";
+import { Button, Text } from "@lookiero/aurora";
+import { useI18nMessage } from "@lookiero/i18n-react";
+import { Modal } from "@lookiero/sty-psp-ui";
+import { ReturnQuestionType, } from "../../../../../../projection/returnQuestion/returnQuestion";
+import { ReturnQuestions } from "../../../../components/organisms/returnQuestions/ReturnQuestions";
+import { useReturnQuestionFeedback } from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionFeedback";
+import { ReturnQuestionItemProvider, } from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionItem";
+import { HostDefaultReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem";
+import { HostSelectReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem";
+import { HostStackReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/hostStackReturnQuestionItem/modal/HostStackReturnQuestionItem";
+import { OptionReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/optionReturnQuestionItem/OptionReturnQuestionItem";
+import { TextareaReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem";
+import { I18nMessages } from "../../../../i18n/i18n";
+import { style } from "./ReturnQuestionsForm.style";
+const RETURN_QUESTION_FORM_PORTAL_HOST_NAME = "return-question-form-portal";
+const returnQuestionItems = {
+    [ReturnQuestionType.HOST_DEFAULT]: HostDefaultReturnQuestionItem,
+    [ReturnQuestionType.HOST_TEXTAREA]: HostDefaultReturnQuestionItem,
+    [ReturnQuestionType.HOST_SELECT]: HostSelectReturnQuestionItem,
+    [ReturnQuestionType.HOST_STACK]: HostStackReturnQuestionItem,
+    [ReturnQuestionType.TEXTAREA]: TextareaReturnQuestionItem,
+    [ReturnQuestionType.OPTION]: OptionReturnQuestionItem,
+};
+const ReturnQuestionsForm = ({ returnQuestions, visible, onSubmit, onClose }) => {
+    const titleText = useI18nMessage({ id: I18nMessages.RETURN_QUESTIONS_TITLE });
+    const submitButtonText = useI18nMessage({ id: I18nMessages.RETURN_QUESTIONS_SUBMIT_BUTTON });
+    const feedback = useReturnQuestionFeedback();
+    const handleOnSubmit = useCallback(() => onSubmit(feedback), [feedback, onSubmit]);
+    return (React.createElement(ReturnQuestionItemProvider, { returnQuestionItems: returnQuestionItems },
+        React.createElement(PortalHost, { name: RETURN_QUESTION_FORM_PORTAL_HOST_NAME }),
+        React.createElement(Modal, { portalHostName: RETURN_QUESTION_FORM_PORTAL_HOST_NAME, testID: "return-questions-form-modal", visible: visible, scroll: true, showCloseButton: true, onClose: onClose },
+            React.createElement(View, { style: style.modalContent },
+                React.createElement(Text, { level: 3, style: style.title, heading: true }, titleText),
+                React.createElement(ReturnQuestions, { portalHostName: RETURN_QUESTION_FORM_PORTAL_HOST_NAME, returnQuestions: returnQuestions }),
+                React.createElement(Button, { style: style.submit, testID: "return-questions-button", onPress: handleOnSubmit }, submitButtonText)))));
+};
+export { ReturnQuestionsForm };

package/dist/src/infrastructure/ui/views/item/components/returnQuestionsForm/ReturnQuestionsForm.style.d.ts

@@ -0,0 +1,12 @@
+declare const style: {
+    modalContent: {
+        paddingHorizontal: number;
+    };
+    submit: {
+        marginTop: number;
+    };
+    title: {
+        marginBottom: number;
+    };
+};
+export { style };

package/dist/src/infrastructure/ui/views/item/components/returnQuestionsForm/ReturnQuestionsForm.style.js

@@ -0,0 +1,15 @@
+import { StyleSheet } from "react-native";
+import { theme } from "@lookiero/sty-psp-ui";
+const { space6, space8 } = theme();
+const style = StyleSheet.create({
+    modalContent: {
+        paddingHorizontal: space6,
+    },
+    submit: {
+        marginTop: space8,
+    },
+    title: {
+        marginBottom: space6,
+    },
+});
+export { style };

package/dist/src/infrastructure/ui/views/return/Return.style.d.ts

@@ -0,0 +1,40 @@
+declare const style: {
+    description: {
+        color: string;
+    };
+    desktopInfo: {
+        borderTopLeftRadius: number;
+        borderTopRightRadius: number;
+    };
+    desktopLayoutSpacing: {
+        paddingVertical: number;
+    };
+    headerWrapper: {
+        display: "flex";
+        flexDirection: "column";
+    };
+    info: {
+        backgroundColor: string;
+        paddingBottom: number;
+        paddingHorizontal: number;
+        paddingTop: number;
+    };
+    layout: {
+        flex: number;
+        justifyContent: "center";
+    };
+    safeAreaView: {
+        backgroundColor: string;
+        flex: number;
+    };
+    scrollView: {
+        flex: number;
+    };
+    submit: {
+        backgroundColor: string;
+        borderBottomLeftRadius: number;
+        borderBottomRightRadius: number;
+        padding: number;
+    };
+};
+export { style };

package/dist/src/infrastructure/ui/views/return/Return.style.js

@@ -0,0 +1,43 @@
+import { StyleSheet } from "react-native";
+import { theme } from "@lookiero/sty-psp-ui";
+const { borderRadius5, colorBgPrimaryLight, colorBgBase, colorTextMedium, space4, space6, space8 } = theme();
+const style = StyleSheet.create({
+    description: {
+        color: colorTextMedium,
+    },
+    desktopInfo: {
+        borderTopLeftRadius: borderRadius5,
+        borderTopRightRadius: borderRadius5,
+    },
+    desktopLayoutSpacing: {
+        paddingVertical: space8,
+    },
+    headerWrapper: {
+        display: "flex",
+        flexDirection: "column",
+    },
+    info: {
+        backgroundColor: colorBgBase,
+        paddingBottom: space4,
+        paddingHorizontal: space6,
+        paddingTop: space8,
+    },
+    layout: {
+        flex: 1,
+        justifyContent: "center",
+    },
+    safeAreaView: {
+        backgroundColor: colorBgPrimaryLight,
+        flex: 1,
+    },
+    scrollView: {
+        flex: 1,
+    },
+    submit: {
+        backgroundColor: colorBgBase,
+        borderBottomLeftRadius: borderRadius5,
+        borderBottomRightRadius: borderRadius5,
+        padding: space6,
+    },
+});
+export { style };

package/dist/src/infrastructure/ui/views/return/components/returnQuestionsForm/ReturnQuestionsForm.js

@@ -101,13 +101,14 @@ const ReturnQuestionsForm = ({ checkout, checkoutItem, country, layout: Layout,
             } },
             React.createElement(ProductVariantPreview, { country: country, item: checkoutItem }),
             React.createElement(ScrollView, { showsVerticalScrollIndicator: false, testID: "return-questions-form" },
-                React.createElement(AuroraLayout, { fullWidth: !screen.L, style: [style.layout, screen.L ? style.desktopLayoutSpacing : undefined] },
-                    React.createElement(Box, { size: { L: "2/3" } },
-                        React.createElement(View, { style: [style.info, !screen.S && style.desktopInfo] },
-                            React.createElement(Text, { level: 3, heading: true }, titleText),
-                            React.createElement(Text, { level: 1, style: style.description, detail: true }, descriptionText)),
-                        React.createElement(ReturnQuestions, { portalHostName: RETURN_QUESTION_FORM_PORTAL_HOST_NAME, returnQuestions: returnQuestions }),
-                        React.createElement(View, { style: style.submit },
-                            React.createElement(Button, { testID: "return-questions-button", onPress: handleOnSubmit }, submitButtonText))))))));
+                React.createElement(View, { style: style.background },
+                    React.createElement(AuroraLayout, { fullWidth: !screen.L, style: [style.layout, screen.L ? style.desktopLayoutSpacing : undefined] },
+                        React.createElement(Box, { size: { L: "2/3" } },
+                            React.createElement(View, { style: [style.info, !screen.S && style.desktopInfo] },
+                                React.createElement(Text, { level: 3, heading: true }, titleText),
+                                React.createElement(Text, { level: 1, style: style.description, detail: true }, descriptionText)),
+                            React.createElement(ReturnQuestions, { portalHostName: RETURN_QUESTION_FORM_PORTAL_HOST_NAME, returnQuestions: returnQuestions }),
+                            React.createElement(View, { style: [style.submit, !screen.S && style.submitDesktop] },
+                                React.createElement(Button, { testID: "return-questions-button", onPress: handleOnSubmit }, submitButtonText)))))))));
 };
 export { ReturnQuestionsForm };

package/dist/src/infrastructure/ui/views/return/components/returnQuestionsForm/ReturnQuestionsForm.style.d.ts

@@ -1,4 +1,7 @@
 declare const style: {
+    background: {
+        backgroundColor: string;
+    };
     description: {
         color: string;
     };
@@ -27,7 +30,6 @@ declare const style: {
         justifyContent: "center";
     };
     safeAreaView: {
-        backgroundColor: string;
         flex: number;
     };
     scrollView: {
@@ -35,9 +37,11 @@ declare const style: {
     };
     submit: {
         backgroundColor: string;
+        padding: number;
+    };
+    submitDesktop: {
         borderBottomLeftRadius: number;
         borderBottomRightRadius: number;
-        padding: number;
     };
 };
 export { style };

package/dist/src/infrastructure/ui/views/return/components/returnQuestionsForm/ReturnQuestionsForm.style.js

@@ -3,6 +3,9 @@ import { theme } from "@lookiero/sty-psp-ui";
 import { HEADER_HEIGHT } from "../../../../components/templates/header/Header.style";
 const { borderRadius5, colorBgPrimaryLight, colorBgBase, colorTextMedium, space4, space6, space8 } = theme();
 const style = StyleSheet.create({
+    background: {
+        backgroundColor: colorBgPrimaryLight,
+    },
     description: {
         color: colorTextMedium,
     },
@@ -31,7 +34,6 @@ const style = StyleSheet.create({
         justifyContent: "center",
     },
     safeAreaView: {
-        backgroundColor: colorBgPrimaryLight,
         flex: 1,
     },
     scrollView: {
@@ -39,9 +41,11 @@ const style = StyleSheet.create({
     },
     submit: {
         backgroundColor: colorBgBase,
+        padding: space6,
+    },
+    submitDesktop: {
         borderBottomLeftRadius: borderRadius5,
         borderBottomRightRadius: borderRadius5,
-        padding: space6,
     },
 });
 export { style };

package/dist/src/infrastructure/ui/views/summary/components/stickyPricing/StickyPricing.d.ts

@@ -0,0 +1,13 @@
+import { FC } from "react";
+import { LayoutRectangle } from "react-native";
+import { PricingProjection } from "../../../../../../projection/pricing/pricing";
+interface StickyPricingProps {
+    readonly pricing: PricingProjection;
+    readonly totalCheckoutItemsKept: number;
+    readonly collapsed: boolean;
+    readonly onPress: () => void;
+    readonly onSubmit: () => void;
+    readonly onLayout?: ({ width, height }: LayoutRectangle) => void;
+}
+declare const StickyPricing: FC<StickyPricingProps>;
+export { StickyPricing };

package/dist/src/infrastructure/ui/views/summary/components/stickyPricing/StickyPricing.js

@@ -0,0 +1,9 @@
+import React from "react";
+import { Sticky } from "@lookiero/sty-psp-ui";
+import { Body } from "../../../../components/layouts/body/Body";
+import { Pricing } from "../pricing/Pricing";
+import { style } from "./StickyPricing.style";
+const StickyPricing = ({ pricing, totalCheckoutItemsKept, collapsed, onPress, onSubmit, onLayout, }) => (React.createElement(Sticky, { style: style.sticky, onLayout: onLayout },
+    React.createElement(Body, null,
+        React.createElement(Pricing, { balanceDiscount: pricing.balanceDiscount, collapsed: collapsed, discount: pricing.discount, discountPercentage: pricing.discountPercentage, pendingToPay: pricing.pendingToPay, service: pricing.service, subtotal: pricing.subtotal, totalCheckoutItemsKept: totalCheckoutItemsKept, onPress: onPress, onSubmit: onSubmit }))));
+export { StickyPricing };

package/dist/src/infrastructure/ui/views/summary/components/stickyPricing/StickyPricing.style.d.ts

@@ -0,0 +1,7 @@
+declare const style: {
+    sticky: {
+        paddingBottom: number;
+        paddingTop: number;
+    };
+};
+export { style };

package/dist/src/infrastructure/ui/views/summary/components/stickyPricing/StickyPricing.style.js

@@ -0,0 +1,10 @@
+import { StyleSheet } from "react-native";
+import { theme } from "@lookiero/sty-psp-ui";
+const { space3, space4 } = theme();
+const style = StyleSheet.create({
+    sticky: {
+        paddingBottom: space4,
+        paddingTop: space3,
+    },
+});
+export { style };

package/dist/src/projection/checkout/viewIsCheckoutAccessibleByCustomerId.d.ts

@@ -0,0 +1,17 @@
+import { Query, QueryHandlerFunction, QueryHandlerFunctionArgs } from "@lookiero/messaging";
+type IsCheckoutAccessibleByCustomerIdProjection = boolean;
+declare const VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID = "view_is_checkout_accessible_by_customer_id";
+interface ViewIsCheckoutAccessibleByCustomerIdPayload {
+    readonly customerId: string | undefined;
+}
+interface ViewIsCheckoutAccessibleByCustomerId extends Query<typeof VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID>, ViewIsCheckoutAccessibleByCustomerIdPayload {
+}
+interface ViewIsCheckoutAccessibleByCustomerIdFunction {
+    (payload: ViewIsCheckoutAccessibleByCustomerIdPayload): ViewIsCheckoutAccessibleByCustomerId;
+}
+declare const viewIsCheckoutAccessibleByCustomerId: ViewIsCheckoutAccessibleByCustomerIdFunction;
+interface ViewIsCheckoutAccessibleByCustomerIdHandlerFunctionArgs extends QueryHandlerFunctionArgs {
+}
+declare const viewIsCheckoutAccessibleByCustomerIdHandler: QueryHandlerFunction<ViewIsCheckoutAccessibleByCustomerId, IsCheckoutAccessibleByCustomerIdProjection, ViewIsCheckoutAccessibleByCustomerIdHandlerFunctionArgs>;
+export type { IsCheckoutAccessibleByCustomerIdProjection };
+export { VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID, viewIsCheckoutAccessibleByCustomerId, viewIsCheckoutAccessibleByCustomerIdHandler, };

package/dist/src/projection/checkout/viewIsCheckoutAccessibleByCustomerId.js

@@ -0,0 +1,13 @@
+import { query } from "@lookiero/messaging";
+import { viewFirstAvailableCheckoutByCustomerId } from "./viewFirstAvailableCheckoutByCustomerId";
+import { viewIsCheckoutEnabledByCustomerId } from "./viewIsCheckoutEnabledByCustomerId";
+const VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID = "view_is_checkout_accessible_by_customer_id";
+const viewIsCheckoutAccessibleByCustomerId = (payload) => ({
+    ...query({ name: VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID }),
+    ...payload,
+});
+const isNonEmptyCustomerId = (customerId) => Boolean(customerId);
+const viewIsCheckoutAccessibleByCustomerIdHandler = ({ queryBus }) => async ({ customerId }) => isNonEmptyCustomerId(customerId) &&
+    Boolean(await queryBus(viewFirstAvailableCheckoutByCustomerId({ customerId }))) &&
+    Boolean(await queryBus(viewIsCheckoutEnabledByCustomerId({ customerId })));
+export { VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID, viewIsCheckoutAccessibleByCustomerId, viewIsCheckoutAccessibleByCustomerIdHandler, };

package/dist/src/projection/shared/country.d.ts

@@ -0,0 +1,14 @@
+declare enum Country {
+    ES = "ES",
+    FR = "FR",
+    GB = "GB",
+    BE = "BE",
+    LU = "LU",
+    IT = "IT",
+    PT = "PT",
+    DE = "DE",
+    AT = "AT",
+    NL = "NL",
+    SE = "SE"
+}
+export { Country };

package/dist/src/projection/shared/country.js

@@ -0,0 +1,15 @@
+var Country;
+(function (Country) {
+    Country["ES"] = "ES";
+    Country["FR"] = "FR";
+    Country["GB"] = "GB";
+    Country["BE"] = "BE";
+    Country["LU"] = "LU";
+    Country["IT"] = "IT";
+    Country["PT"] = "PT";
+    Country["DE"] = "DE";
+    Country["AT"] = "AT";
+    Country["NL"] = "NL";
+    Country["SE"] = "SE";
+})(Country || (Country = {}));
+export { Country };

package/dist/src/projection/shared/customer.d.ts

@@ -0,0 +1,8 @@
+import { Country } from "@lookiero/sty-psp-locale";
+import { Segment } from "@lookiero/sty-psp-segment";
+interface Customer {
+    readonly customerId: string;
+    readonly country: Country;
+    readonly segment: Segment;
+}
+export type { Customer };

package/dist/src/projection/shared/customer.js

@@ -0,0 +1 @@
+export {};

package/dist/src/projection/shared/locale.d.ts

@@ -0,0 +1,12 @@
+declare enum Locale {
+    ES = "es",
+    FR = "fr",
+    EN = "en",
+    IT = "it",
+    PT = "pt",
+    DE = "de",
+    AT = "at",
+    NL = "nl",
+    SE = "sv"
+}
+export { Locale };

package/dist/src/projection/shared/locale.js

@@ -0,0 +1,13 @@
+var Locale;
+(function (Locale) {
+    Locale["ES"] = "es";
+    Locale["FR"] = "fr";
+    Locale["EN"] = "en";
+    Locale["IT"] = "it";
+    Locale["PT"] = "pt";
+    Locale["DE"] = "de";
+    Locale["AT"] = "at";
+    Locale["NL"] = "nl";
+    Locale["SE"] = "sv";
+})(Locale || (Locale = {}));
+export { Locale };

package/dist/src/projection/shared/order.d.ts

@@ -0,0 +1,6 @@
+interface Order {
+    readonly orderNumber: number;
+    readonly isFirstOrder: boolean;
+    readonly coupon: string | null;
+}
+export type { Order };

package/dist/src/projection/shared/order.js

@@ -0,0 +1 @@
+export {};

package/dist/src/projection/shared/price.d.ts

@@ -0,0 +1,10 @@
+import { Currency } from "../../domain/checkoutItem/model/currency";
+interface PriceProjection {
+    readonly amount: number;
+    readonly currency: Currency;
+    readonly discountedPrice?: {
+        readonly amount: number;
+        readonly percentage: number;
+    };
+}
+export type { PriceProjection };

package/dist/src/projection/shared/price.js

@@ -0,0 +1 @@
+export {};

package/dist/src/projection/shared/size.d.ts

@@ -0,0 +1,20 @@
+import { Country } from "./country";
+interface SizeProjection {
+    readonly id: string;
+    readonly lookiero: string;
+    readonly uk: string;
+    readonly it: string;
+    readonly europe: string;
+    readonly unique: boolean;
+    readonly visualOrder?: number;
+}
+interface SizeFunctionArgs {
+    readonly size: SizeProjection;
+    readonly country: Country;
+}
+interface SizeFunction {
+    (args: SizeFunctionArgs): string;
+}
+declare const size: SizeFunction;
+export type { SizeProjection };
+export { size };

package/dist/src/projection/shared/size.js

@@ -0,0 +1,3 @@
+import { Country } from "./country";
+const size = ({ size, country }) => (country === Country.GB ? size.uk : size.lookiero);
+export { size };

package/dist/src/projection/shared/subscription.d.ts

@@ -0,0 +1,2 @@
+type Subscription = "o" | "m" | "b" | "q";
+export type { Subscription };

package/dist/src/projection/shared/subscription.js

@@ -0,0 +1 @@
+export {};

package/dist/src/shared/ui/components/atoms/error/Error.d.ts

@@ -0,0 +1,10 @@
+import { FC } from "react";
+import { StyleProp, TextStyle } from "react-native";
+type ErrorStyle = StyleProp<TextStyle>;
+interface ErrorProps {
+    readonly error?: string | null;
+    readonly style?: ErrorStyle;
+}
+declare const Error: FC<ErrorProps>;
+export type { ErrorStyle };
+export { Error };

package/dist/src/shared/ui/components/atoms/error/Error.js

@@ -0,0 +1,4 @@
+import React from "react";
+import { COLOR, Text } from "@lookiero/aurora";
+const Error = ({ error, style: customStyle }) => (React.createElement(Text, { color: COLOR.TEXT_ERROR, level: 2, style: customStyle, detail: true }, error));
+export { Error };

package/dist/src/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "8.13.2";
+export declare const VERSION = "8.13.3-beta.1";

package/dist/src/version.js

@@ -1 +1 @@
-export const VERSION = "8.13.2";
+export const VERSION = "8.13.3-beta.1";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "8.13.2",
+  "version": "8.13.3-beta.1",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "sideEffects": "false",

package/src/infrastructure/ui/views/return/components/returnQuestionsForm/ReturnQuestionsForm.style.ts

@@ -5,6 +5,9 @@ import { HEADER_HEIGHT } from "../../../../components/templates/header/Header.st
 const { borderRadius5, colorBgPrimaryLight, colorBgBase, colorTextMedium, space4, space6, space8 } = theme();
 
 const style = StyleSheet.create({
+  background: {
+    backgroundColor: colorBgPrimaryLight,
+  },
   description: {
     color: colorTextMedium,
   },
@@ -33,7 +36,6 @@ const style = StyleSheet.create({
     justifyContent: "center",
   },
   safeAreaView: {
-    backgroundColor: colorBgPrimaryLight,
     flex: 1,
   },
   scrollView: {
@@ -41,9 +43,11 @@ const style = StyleSheet.create({
   },
   submit: {
     backgroundColor: colorBgBase,
+    padding: space6,
+  },
+  submitDesktop: {
     borderBottomLeftRadius: borderRadius5,
     borderBottomRightRadius: borderRadius5,
-    padding: space6,
   },
 });
 

package/src/infrastructure/ui/views/return/components/returnQuestionsForm/ReturnQuestionsForm.tsx

@@ -154,29 +154,34 @@ const ReturnQuestionsForm: FC<ReturnQuestionsFormProps> = ({
         <ProductVariantPreview country={country} item={checkoutItem} />
 
         <ScrollView showsVerticalScrollIndicator={false} testID="return-questions-form">
-          <AuroraLayout fullWidth={!screen.L} style={[style.layout, screen.L ? style.desktopLayoutSpacing : undefined]}>
-            <Box size={{ L: "2/3" }}>
-              <View style={[style.info, !screen.S && style.desktopInfo]}>
-                <Text level={3} heading>
-                  {titleText}
-                </Text>
-                <Text level={1} style={style.description} detail>
-                  {descriptionText}
-                </Text>
-              </View>
-
-              <ReturnQuestions
-                portalHostName={RETURN_QUESTION_FORM_PORTAL_HOST_NAME}
-                returnQuestions={returnQuestions}
-              />
-
-              <View style={style.submit}>
-                <Button testID="return-questions-button" onPress={handleOnSubmit}>
-                  {submitButtonText}
-                </Button>
-              </View>
-            </Box>
-          </AuroraLayout>
+          <View style={style.background}>
+            <AuroraLayout
+              fullWidth={!screen.L}
+              style={[style.layout, screen.L ? style.desktopLayoutSpacing : undefined]}
+            >
+              <Box size={{ L: "2/3" }}>
+                <View style={[style.info, !screen.S && style.desktopInfo]}>
+                  <Text level={3} heading>
+                    {titleText}
+                  </Text>
+                  <Text level={1} style={style.description} detail>
+                    {descriptionText}
+                  </Text>
+                </View>
+
+                <ReturnQuestions
+                  portalHostName={RETURN_QUESTION_FORM_PORTAL_HOST_NAME}
+                  returnQuestions={returnQuestions}
+                />
+
+                <View style={[style.submit, !screen.S && style.submitDesktop]}>
+                  <Button testID="return-questions-button" onPress={handleOnSubmit}>
+                    {submitButtonText}
+                  </Button>
+                </View>
+              </Box>
+            </AuroraLayout>
+          </View>
         </ScrollView>
       </Layout>
     </ReturnQuestionItemProvider>