@lookiero/checkout 9.8.4 → 9.9.0-beta.0

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

@@ -1,29 +1,20 @@
-import { useCallback, useEffect } from "react";
-import { useEvent } from "@lookiero/event";
-import { NotificationLevel, useCreateToastNotification } from "@lookiero/sty-psp-notifications";
-import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
-import { I18nMessages } from "../i18n/i18n";
-const PAYMENT_ERROR = "ERROR";
-const PAYMENT_SUCCESS = "PAYMENT_INSTRUMENT_UPDATED";
-const usePaymentInstrumentEvents = ({ logger }) => {
-    const { subscribe, unsubscribe } = useEvent();
-    const [createNotification] = useCreateToastNotification({ contextId: MESSAGING_CONTEXT_ID, logger });
-    const onSuccess = useCallback(({ message }) => createNotification({ bodyI18nKey: message.id, level: NotificationLevel.SUCCESS }), [createNotification]);
-    const onError = useCallback(({ error }) => {
-        if (error.toaster) {
-            createNotification({
-                bodyI18nKey: error.toaster.id || I18nMessages.CHECKOUT_TOAST_PAYMENT_ERROR,
-                level: NotificationLevel.ERROR,
-            });
-        }
-    }, [createNotification]);
+import { useEffect } from "react";
+import { Section, usePaymentStatusManager } from "@lookiero/payments-front";
+const usePaymentInstrumentEvents = ({ onSuccess, onError }) => {
+    const refreshStatus = usePaymentStatusManager(Section.BOX_CHECKOUT);
     useEffect(() => {
-        subscribe({ event: PAYMENT_ERROR }, onError);
-        subscribe({ event: PAYMENT_SUCCESS }, onSuccess);
-        return () => {
-            unsubscribe({ event: PAYMENT_ERROR }, onError);
-            unsubscribe({ event: PAYMENT_SUCCESS }, onSuccess);
-        };
-    }, [subscribe, unsubscribe, createNotification, onError, onSuccess]);
+        const { isLoading, consumePayload } = refreshStatus;
+        if (isLoading) {
+            return;
+        }
+        consumePayload((payload) => {
+            if (payload.success) {
+                onSuccess(payload);
+            }
+            else {
+                onError(payload);
+            }
+        });
+    }, [onError, onSuccess, refreshStatus]);
 };
 export { usePaymentInstrumentEvents };

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

@@ -16,7 +16,7 @@ interface UseSubmitCheckoutFunctionArgs {
     readonly checkoutBookingId: string;
     readonly paymentFlowRef: RefObject<PaymentFlowRef>;
     readonly onError: () => void;
-    readonly onSuccess?: () => void;
+    readonly onSuccess: () => void;
     readonly logger: Logger;
 }
 interface UseSubmitCheckoutFunction {

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

@@ -1,29 +1,15 @@
 import { useCallback, useMemo, useState } from "react";
 import { CommandStatus } from "@lookiero/messaging-react";
 import { NotificationLevel, useCreateToastNotification } from "@lookiero/sty-psp-notifications";
-import { viewCheckoutBookingById, } from "../../../projection/checkoutBooking/viewCheckoutBookingById";
 import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
 import { useSubmitCheckout as useSubmitCheckoutCommand } from "../../domain/checkout/react/useSubmitCheckout";
 import { useBlockCheckoutBooking } from "../../domain/checkoutBooking/react/useBlockCheckoutBooking";
 import { I18nMessages } from "../i18n/i18n";
-import { useQueryBus } from "./useQueryBus";
-var ChargeStatus;
-(function (ChargeStatus) {
-    ChargeStatus["EXECUTED"] = "EXECUTED";
-    ChargeStatus["REQUIRES_ACTION"] = "REQUIRES_ACTION";
-    ChargeStatus["REQUIRED_ACTION_CANCELLED"] = "REQUIRED_ACTION_CANCELLED";
-    ChargeStatus["REJECTED"] = "REJECTED";
-    ChargeStatus["CANCELLED"] = "CANCELLED";
-    ChargeStatus["TO_CONFIRM"] = "TO_CONFIRM";
-    ChargeStatus["ERROR"] = "ERROR";
-    ChargeStatus["UNKNOWN"] = "UNKNOWN";
-})(ChargeStatus || (ChargeStatus = {}));
+import { usePaymentInstrumentEvents } from "./usePaymentInstrumentEvents";
 const useSubmitCheckout = ({ checkoutId, checkoutBookingId, paymentFlowRef, onError, onSuccess, logger, }) => {
-    const queryBus = useQueryBus();
     const [submitCheckoutCommand, submitCheckoutCommandStatus] = useSubmitCheckoutCommand({ checkoutId, logger });
     const [blockCheckoutBooking, blockCheckoutBookingStatus] = useBlockCheckoutBooking({ checkoutBookingId, logger });
     const [createNotification] = useCreateToastNotification({ contextId: MESSAGING_CONTEXT_ID, logger });
-    const [checkoutBookingExpired, setCheckoutBookingExpired] = useState(false);
     const [startLegacyBoxCheckoutStatus, setStartLegacyBoxCheckoutStatus] = useState("idle");
     const submitCheckout = useCallback(async ({ paymentFlowPayload, sizeChangeEnabled }) => {
         try {
@@ -32,40 +18,27 @@ const useSubmitCheckout = ({ checkoutId, checkoutBookingId, paymentFlowRef, onEr
         catch (error) {
             return;
         }
-        const checkoutBooking = await queryBus(viewCheckoutBookingById({ checkoutBookingId }));
-        if (checkoutBooking?.isExpired) {
-            setCheckoutBookingExpired(true);
-            return;
-        }
-        paymentFlowRef.current?.startLegacyBoxCheckout(
+        setStartLegacyBoxCheckoutStatus("loading");
         // eslint-disable-next-line @typescript-eslint/ban-ts-comment
         // @ts-ignore
-        paymentFlowPayload, async ({ status, toaster, final }) => {
-            setStartLegacyBoxCheckoutStatus("loading");
-            if (final) {
-                if (status === ChargeStatus.EXECUTED) {
-                    setStartLegacyBoxCheckoutStatus("success");
-                    await submitCheckoutCommand();
-                    onSuccess?.();
-                }
-                else {
-                    createNotification({
-                        level: NotificationLevel.ERROR,
-                        bodyI18nKey: toaster?.id || I18nMessages.CHECKOUT_TOAST_PAYMENT_ERROR,
-                    });
-                    setStartLegacyBoxCheckoutStatus("error");
-                }
-            }
+        paymentFlowRef.current?.startLegacyBoxCheckout(paymentFlowPayload);
+    }, [paymentFlowRef, blockCheckoutBooking]);
+    const onPaymentSuccess = useCallback(async () => {
+        setStartLegacyBoxCheckoutStatus("success");
+        await submitCheckoutCommand();
+        createNotification({
+            bodyI18nKey: I18nMessages.CHECKOUT_TOAST_PAYMENT_SUCCESS,
+            level: NotificationLevel.SUCCESS,
+        });
+    }, [createNotification, submitCheckoutCommand]);
+    const onPaymentError = useCallback((payload) => {
+        setStartLegacyBoxCheckoutStatus("error");
+        createNotification({
+            bodyI18nKey: payload.metadata?.toaster?.id || I18nMessages.CHECKOUT_TOAST_PAYMENT_ERROR,
+            level: NotificationLevel.ERROR,
         });
-    }, [
-        queryBus,
-        checkoutBookingId,
-        paymentFlowRef,
-        blockCheckoutBooking,
-        submitCheckoutCommand,
-        onSuccess,
-        createNotification,
-    ]);
+    }, [createNotification]);
+    usePaymentInstrumentEvents({ onSuccess: onPaymentSuccess, onError: onPaymentError });
     const status = useMemo(() => {
         if (blockCheckoutBookingStatus === CommandStatus.LOADING ||
             startLegacyBoxCheckoutStatus === "loading" ||
@@ -75,23 +48,17 @@ const useSubmitCheckout = ({ checkoutId, checkoutBookingId, paymentFlowRef, onEr
         if (blockCheckoutBookingStatus === CommandStatus.SUCCESS &&
             startLegacyBoxCheckoutStatus === "success" &&
             submitCheckoutCommandStatus === CommandStatus.SUCCESS) {
+            onSuccess();
             return "success";
         }
         if (blockCheckoutBookingStatus === CommandStatus.ERROR ||
             startLegacyBoxCheckoutStatus === "error" ||
-            submitCheckoutCommandStatus === CommandStatus.ERROR ||
-            checkoutBookingExpired) {
+            submitCheckoutCommandStatus === CommandStatus.ERROR) {
             onError();
             return "error";
         }
         return "idle";
-    }, [
-        blockCheckoutBookingStatus,
-        startLegacyBoxCheckoutStatus,
-        submitCheckoutCommandStatus,
-        checkoutBookingExpired,
-        onError,
-    ]);
+    }, [blockCheckoutBookingStatus, startLegacyBoxCheckoutStatus, submitCheckoutCommandStatus, onSuccess, onError]);
     return [submitCheckout, status];
 };
 export { useSubmitCheckout };

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

@@ -0,0 +1,10 @@
+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,17 @@
+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/i18n.d.ts

@@ -46,6 +46,7 @@ declare enum I18nMessages {
     CHECKOUT_TITLE = "checkout.title",
     CHECKOUT_PAY_BUTTON = "checkout.pay_button",
     CHECKOUT_TOAST_PAYMENT_ERROR = "checkout.toast_payment_error",
+    CHECKOUT_TOAST_PAYMENT_SUCCESS = "checkout.toast_payment_success",
     CHECKOUT_SUCCESS_MODAL_TITLE = "checkout.success_modal_title",
     CHECKOUT_SUCCESS_MODAL_DESCRIPTION = "checkout.success_modal_description",
     CHECKOUT_SUCCESS_MODAL_BUTTON = "checkout.success_modal_button",

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

@@ -48,6 +48,7 @@ var I18nMessages;
     I18nMessages["CHECKOUT_TITLE"] = "checkout.title";
     I18nMessages["CHECKOUT_PAY_BUTTON"] = "checkout.pay_button";
     I18nMessages["CHECKOUT_TOAST_PAYMENT_ERROR"] = "checkout.toast_payment_error";
+    I18nMessages["CHECKOUT_TOAST_PAYMENT_SUCCESS"] = "checkout.toast_payment_success";
     I18nMessages["CHECKOUT_SUCCESS_MODAL_TITLE"] = "checkout.success_modal_title";
     I18nMessages["CHECKOUT_SUCCESS_MODAL_DESCRIPTION"] = "checkout.success_modal_description";
     I18nMessages["CHECKOUT_SUCCESS_MODAL_BUTTON"] = "checkout.success_modal_button";

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

@@ -0,0 +1,20 @@
+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,27 @@
+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,10 @@
+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,27 @@
+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/App.style.d.ts

@@ -0,0 +1,6 @@
+declare const style: {
+  container: {
+    flex: number;
+  };
+};
+export { style };

package/dist/src/infrastructure/ui/views/App.style.js

@@ -0,0 +1,8 @@
+import { StyleSheet } from "react-native";
+
+const style = StyleSheet.create({
+  container: {
+    flex: 1,
+  },
+});
+export { style };

package/dist/src/infrastructure/ui/views/checkout/components/checkoutPaymentModal/CheckoutPaymentModal.js

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useRef, useState } from "react";
 import { useNavigate } from "react-router-native";
 import { QueryStatus } from "@lookiero/messaging-react";
-import { PaymentFlow } from "@lookiero/payments-front";
+import { PaymentFlow, Section } from "@lookiero/payments-front";
 import { useLogger } from "@lookiero/sty-psp-logging";
 import { CheckoutItemStatus } from "../../../../../../domain/checkoutItem/model/checkoutItem";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
@@ -85,6 +85,6 @@ const CheckoutPaymentModal = ({ coupon, isFirstOrder, subscription, orderNumber,
     const dependenciesLoaded = (dependenciesLoadedStatuses.includes(checkoutStatus) || checkout) && authToken;
     if (!dependenciesLoaded)
         return null;
-    return React.createElement(PaymentFlow, { ref: paymentFlowRef, token: authToken });
+    return React.createElement(PaymentFlow, { ref: paymentFlowRef, section: Section.BOX_CHECKOUT, token: authToken });
 };
 export { CheckoutPaymentModal };

package/dist/src/infrastructure/ui/views/checkout/components/paymentInstrument/PaymentInstrument.js

@@ -1,12 +1,12 @@
-import React, { useRef } from "react";
+import React from "react";
 import { PaymentInstrumentSelect, Section } from "@lookiero/payments-front";
-import { useLogger } from "@lookiero/sty-psp-logging";
-import { usePaymentInstrumentEvents } from "../../../../hooks/usePaymentInstrumentEvents";
+import { useStaticInfo } from "../../../../hooks/useStaticInfo";
 const PaymentInstrument = ({ useRedirect }) => {
-    const paymentInstrumentSelectRef = useRef(null);
     const { returnUrl } = useRedirect();
-    const logger = useLogger();
-    usePaymentInstrumentEvents({ logger });
-    return (React.createElement(PaymentInstrumentSelect, { ref: paymentInstrumentSelectRef, beforeRedirect: returnUrl ? () => Promise.resolve(returnUrl) : undefined, hasError: false, section: Section.BOX_CHECKOUT }));
+    const { customer } = useStaticInfo();
+    return (React.createElement(PaymentInstrumentSelect, { beforeRedirect: returnUrl ? () => Promise.resolve(returnUrl) : undefined, hasError: false, section: Section.BOX_CHECKOUT, userInformation: {
+            email: customer.email,
+            name: customer.name,
+        }, showSingleUsePaymentMethods: true }));
 };
 export { PaymentInstrument };

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,11 @@
+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,12 @@
+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,64 @@
+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,16 @@
+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,44 @@
+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/summary/components/stickyPricing/StickyPricing.d.ts

@@ -0,0 +1,14 @@
+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,28 @@
+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,11 @@
+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 };