@lookiero/checkout 0.4.1 → 0.4.3

package/dist/infrastructure/delivery/baseBootstrap.d.ts

@@ -10,7 +10,7 @@ import { CheckoutItem } from "../../domain/checkoutItem/model/checkoutItem";
 import { CheckoutItemsGetFunction, CheckoutItemsSaveFunction } from "../../domain/checkoutItem/model/checkoutItems";
 import { UiSetting } from "../../domain/uiSetting/model/uiSetting";
 import { UiSettingGetFunction, UiSettingSaveFunction } from "../../domain/uiSetting/model/uiSettings";
-import { BookedSizeChangeProductsVariantsForCheckoutItemView } from "../../projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem";
+import { BookedProductsVariantsForCheckoutItemView } from "../../projection/bookedProductsVariants/viewBookedProductVariantsForCheckoutItem";
 import { CheckoutByIdView } from "../../projection/checkout/viewCheckoutById";
 import { FirstAvailableCheckoutByCustomerIdView } from "../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
 import { FiveItemsDiscountByCustomerIdView } from "../../projection/checkout/viewFiveItemsDiscountByCustomerId";
@@ -34,7 +34,7 @@ interface BaseBootstrapFunctionArgs<UiSettingGetFunctionArgs extends RepositoryG
     readonly checkoutItemByIdView: CheckoutItemByIdView;
     readonly checkoutBookingByIdView: CheckoutBookingByIdView;
     readonly returnQuestionsByCheckoutItemIdView: ReturnQuestionsByCheckoutItemIdView;
-    readonly bookedSizeChangeProductsVariantsForCheckoutItemView: BookedSizeChangeProductsVariantsForCheckoutItemView;
+    readonly bookedProductsVariantsForCheckoutItemView: BookedProductsVariantsForCheckoutItemView;
     readonly pricingByCheckoutIdView: PricingByCheckoutIdView;
     readonly paymentFlowPayloadByCheckoutIdView: PaymentFlowPayloadByCheckoutIdView;
     readonly checkoutQuestionsByCheckoutIdView: CheckoutQuestionsByCheckoutIdView;

package/dist/infrastructure/delivery/baseBootstrap.js

@@ -13,7 +13,7 @@ import { RETURN_CHECKOUT_ITEM } from "../../domain/checkoutItem/command/returnCh
 import { keepCheckoutItemHandler, replaceCheckoutItemHandler, returnCheckoutItemHandler, } from "../../domain/checkoutItem/model/checkoutItem";
 import { UPDATE_UI_SETTING } from "../../domain/uiSetting/command/updateUiSetting";
 import { updateUiSettingHandler } from "../../domain/uiSetting/model/uiSetting";
-import { viewBookedSizeChangeProductsVariantsForCheckoutItemHandler, VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, } from "../../projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem";
+import { viewBookedProductsVariantsForCheckoutItemHandler, VIEW_BOOKED_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, } from "../../projection/bookedProductsVariants/viewBookedProductVariantsForCheckoutItem";
 import { viewCheckoutByIdHandler, VIEW_CHECKOUT_BY_ID, } from "../../projection/checkout/viewCheckoutById";
 import { viewFirstAvailableCheckoutByCustomerIdHandler, VIEW_FIRST_AVAILABLE_CHECKOUT_BY_CUSTOMER_ID, } from "../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
 import { viewFiveItemsDiscountByCustomerIdHandler, VIEW_FIVE_ITEMS_DISCOUNT_BY_CUSTOMER_ID, } from "../../projection/checkout/viewFiveItemsDiscountByCustomerId";
@@ -27,7 +27,7 @@ import { viewPricingByCheckoutIdHandler, VIEW_PRICING_BY_CHECKOUT_ID, } from "..
 import { listReturnQuestionsByCheckoutItemIdHandler, LIST_RETURN_QUESTIONS_BY_CHECKOUT_ITEM_ID, } from "../../projection/returnQuestion/listReturnQuestionsByCheckoutItemId";
 import { viewUiSettingByKeyHandler, VIEW_UI_SETTING_BY_KEY, } from "../../projection/uiSetting/viewUiSettingByKey";
 const MESSAGING_CONTEXT_ID = "Checkout";
-const baseBootstrap = ({ checkoutByIdView, firstAvailableCheckoutByCustomerIdView, isCheckoutEnabledByCustomerIdView, fiveItemsDiscountByCustomerIdView, uiSettingByKeyView, checkoutItemByIdView, returnQuestionsByCheckoutItemIdView, bookedSizeChangeProductsVariantsForCheckoutItemView, checkoutBookingByIdView, pricingByCheckoutIdView, paymentFlowPayloadByCheckoutIdView, checkoutQuestionsByCheckoutIdView, getUiSetting, saveUiSetting, uiSettingsDependencies, getCheckout, saveCheckout, checkoutsDependencies, getCheckoutItem, saveCheckoutItem, checkoutItemsDependencies, getCheckoutBooking, saveCheckoutBooking, checkoutBookingsDependencies, getCheckoutFeedback, saveCheckoutFeedback, checkoutFeedbacksDependencies, }) => messagingBootstrap({ id: MESSAGING_CONTEXT_ID })
+const baseBootstrap = ({ checkoutByIdView, firstAvailableCheckoutByCustomerIdView, isCheckoutEnabledByCustomerIdView, fiveItemsDiscountByCustomerIdView, uiSettingByKeyView, checkoutItemByIdView, returnQuestionsByCheckoutItemIdView, bookedProductsVariantsForCheckoutItemView, checkoutBookingByIdView, pricingByCheckoutIdView, paymentFlowPayloadByCheckoutIdView, checkoutQuestionsByCheckoutIdView, getUiSetting, saveUiSetting, uiSettingsDependencies, getCheckout, saveCheckout, checkoutsDependencies, getCheckoutItem, saveCheckoutItem, checkoutItemsDependencies, getCheckoutBooking, saveCheckoutBooking, checkoutBookingsDependencies, getCheckoutFeedback, saveCheckoutFeedback, checkoutFeedbacksDependencies, }) => messagingBootstrap({ id: MESSAGING_CONTEXT_ID })
     .query(VIEW_FIVE_ITEMS_DISCOUNT_BY_CUSTOMER_ID, viewFiveItemsDiscountByCustomerIdHandler, {
     view: fiveItemsDiscountByCustomerIdView,
 })
@@ -64,8 +64,8 @@ const baseBootstrap = ({ checkoutByIdView, firstAvailableCheckoutByCustomerIdVie
     .query(VIEW_CHECKOUT_BOOKING_BY_ID, viewCheckoutBookingByIdHandler, {
     view: checkoutBookingByIdView,
 })
-    .query(VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, viewBookedSizeChangeProductsVariantsForCheckoutItemHandler, {
-    view: bookedSizeChangeProductsVariantsForCheckoutItemView,
+    .query(VIEW_BOOKED_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, viewBookedProductsVariantsForCheckoutItemHandler, {
+    view: bookedProductsVariantsForCheckoutItemView,
 })
     .command(BOOK_CHECKOUT_BOOKING_FOR_CHECKOUT_ITEM, bookCheckoutBookingForCheckoutItemHandler)(getCheckoutBooking, saveCheckoutBooking, ...checkoutBookingsDependencies)
     .command(BLOCK_CHECKOUT_BOOKING, blockCheckoutBookingHandler)(getCheckoutBooking, saveCheckoutBooking, ...checkoutBookingsDependencies)

package/dist/infrastructure/delivery/bootstrap.js

@@ -4,7 +4,7 @@ import { getCheckoutFeedback, saveCheckoutFeedback } from "../domain/checkoutFee
 import { getCheckoutItem, saveCheckoutItem } from "../domain/checkoutItem/model/httpCheckoutItems";
 import { getUiSetting, saveUiSetting } from "../domain/uiSetting/model/storageUiSettings";
 import { read, write } from "../persistence/asyncStorageStorage";
-import { httpBookedSizeChangeProductsVariantsForCheckoutItemView } from "../projection/bookedSizeChangeProductsVariants/httpBookedSizeChangeProductsVariantsForCheckoutItemView";
+import { httpBookedProductsVariantsForCheckoutItemView } from "../projection/bookedProductsVariants/httpBookedProductsVariantsForCheckoutItemView";
 import { httpCheckoutByIdView } from "../projection/checkout/httpCheckoutByIdView";
 import { httpFirstAvailableCheckoutByCustomerIdView } from "../projection/checkout/httpFirstAvailableCheckoutByCustomerIdView";
 import { httpFiveItemsDiscountByCustomerIdView } from "../projection/checkout/httpFiveItemsDiscountByCustomerIdView";
@@ -30,7 +30,7 @@ const bootstrap = ({ apiUrl, getAuthToken }) => {
         checkoutItemByIdView: httpCheckoutItemByIdView({ httpPost }),
         returnQuestionsByCheckoutItemIdView: httpReturnQuestionsByCheckoutItemIdView({ httpPost }),
         checkoutBookingByIdView: httpCheckoutBookingByIdView({ httpPost }),
-        bookedSizeChangeProductsVariantsForCheckoutItemView: httpBookedSizeChangeProductsVariantsForCheckoutItemView({
+        bookedProductsVariantsForCheckoutItemView: httpBookedProductsVariantsForCheckoutItemView({
             httpPost,
         }),
         pricingByCheckoutIdView: httpPricingByCheckoutIdView({

package/dist/infrastructure/delivery/mock/dataSourceCheckoutBookings.js

@@ -1,7 +1,7 @@
 import invariant from "tiny-invariant";
 import { v4 as uuid } from "uuid";
 import { CheckoutStatus } from "../../../domain/checkout/model/checkout";
-import { viewBookedSizeChangeProductsVariantsForCheckoutItem, } from "../../../projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem";
+import { viewBookedProductsVariantsForCheckoutItem, } from "../../../projection/bookedProductsVariants/viewBookedProductVariantsForCheckoutItem";
 const toCheckoutBookingDomain = (checkoutBooking) => {
     invariant(checkoutBooking, "No checkoutBooking found!");
     return {
@@ -16,7 +16,7 @@ const toCheckoutBookingProjection = (checkoutBooking) => ({
     checkoutItemIds: checkoutBooking.checkoutItemIds,
     checkoutStatus: checkoutBooking.checkoutStatus,
 });
-const getCheckoutBooking = ({ queryBus }) => async (aggregateId) => toCheckoutBookingDomain(await queryBus(viewBookedSizeChangeProductsVariantsForCheckoutItem({ checkoutItemId: aggregateId })));
+const getCheckoutBooking = ({ queryBus }) => async (aggregateId) => toCheckoutBookingDomain(await queryBus(viewBookedProductsVariantsForCheckoutItem({ checkoutItemId: aggregateId })));
 const saveCheckoutBooking = ({ dataSource }) => async (aggregateRoot) => {
     dataSource.saveCheckoutBooking(toCheckoutBookingProjection(aggregateRoot));
 };

package/dist/infrastructure/projection/bookedProductsVariants/httpBookedProductsVariantsForCheckoutItemView.d.ts

@@ -0,0 +1,12 @@
+import { BookedProductsVariantsForCheckoutItemView } from "../../../projection/bookedProductsVariants/viewBookedProductVariantsForCheckoutItem";
+import { HttpPostFunction } from "../../delivery/http/httpClient";
+interface HttpBookedProductsVariantsForCheckoutItemView extends BookedProductsVariantsForCheckoutItemView {
+}
+interface HttpBookedProductsVariantsForCheckoutItemViewFunctionArgs {
+    readonly httpPost: HttpPostFunction;
+}
+interface HttpBookedProductsVariantsForCheckoutItemViewFunction {
+    (args: HttpBookedProductsVariantsForCheckoutItemViewFunctionArgs): HttpBookedProductsVariantsForCheckoutItemView;
+}
+declare const httpBookedProductsVariantsForCheckoutItemView: HttpBookedProductsVariantsForCheckoutItemViewFunction;
+export { httpBookedProductsVariantsForCheckoutItemView };

package/dist/infrastructure/projection/{bookedSizeChangeProductsVariants/httpBookedSizeChangeProductsVariantsForCheckoutItemView.js → bookedProductsVariants/httpBookedProductsVariantsForCheckoutItemView.js}

@@ -1,4 +1,4 @@
-const httpBookedSizeChangeProductsVariantsForCheckoutItemView = ({ httpPost }) => async ({ checkoutItemId, signal }) => {
+const httpBookedProductsVariantsForCheckoutItemView = ({ httpPost }) => async ({ checkoutItemId, signal }) => {
     const response = await httpPost({
         endpoint: "/view-booked-product-variants-for-checkout-item",
         body: { checkoutItemId },
@@ -6,4 +6,4 @@ const httpBookedSizeChangeProductsVariantsForCheckoutItemView = ({ httpPost }) =
     });
     return !response.ok || response.status === 404 ? null : (await response.json()).result;
 };
-export { httpBookedSizeChangeProductsVariantsForCheckoutItemView };
+export { httpBookedProductsVariantsForCheckoutItemView };

package/dist/infrastructure/projection/bookedProductsVariants/react/useViewBookedProductsVariantsForCheckoutItem.d.ts

@@ -0,0 +1,10 @@
+import { UseQueryFunctionResult } from "@lookiero/messaging-react";
+import { BookedProductsVariantsProjection } from "../../../../projection/bookedProductsVariants/bookedProductsVariants";
+interface UseViewBookedProductsVariantsForCheckoutItemFunctionArgs {
+    readonly checkoutItemId: string;
+}
+interface UseViewBookedProductsVariantsForCheckoutItemFunction {
+    (args: UseViewBookedProductsVariantsForCheckoutItemFunctionArgs): UseQueryFunctionResult<BookedProductsVariantsProjection>;
+}
+declare const useViewBookedProductsVariantsForCheckoutItem: UseViewBookedProductsVariantsForCheckoutItemFunction;
+export { useViewBookedProductsVariantsForCheckoutItem };

package/dist/infrastructure/projection/{bookedSizeChangeProductsVariants/react/useViewBookedSizeChangeProductsVariantsForCheckoutItem.js → bookedProductsVariants/react/useViewBookedProductsVariantsForCheckoutItem.js}

@@ -1,12 +1,12 @@
 import { useQuery } from "@lookiero/messaging-react";
 import { CHECKOUT_BOOKING_BOOKED, } from "../../../../domain/checkoutBooking/model/checkoutBookingBooked";
-import { viewBookedSizeChangeProductsVariantsForCheckoutItem } from "../../../../projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem";
+import { viewBookedProductsVariantsForCheckoutItem } from "../../../../projection/bookedProductsVariants/viewBookedProductVariantsForCheckoutItem";
 import { MESSAGING_CONTEXT_ID } from "../../../delivery/baseBootstrap";
 const isCheckoutBookingBooked = (event) => event.name === CHECKOUT_BOOKING_BOOKED;
-const useViewBookedSizeChangeProductsVariantsForCheckoutItem = ({ checkoutItemId }) => useQuery({
-    query: viewBookedSizeChangeProductsVariantsForCheckoutItem({ checkoutItemId }),
+const useViewBookedProductsVariantsForCheckoutItem = ({ checkoutItemId, }) => useQuery({
+    query: viewBookedProductsVariantsForCheckoutItem({ checkoutItemId }),
     contextId: MESSAGING_CONTEXT_ID,
     invalidation: isCheckoutBookingBooked,
     options: { staleTime: Infinity, retry: false, refetchOnWindowFocus: false },
 });
-export { useViewBookedSizeChangeProductsVariantsForCheckoutItem };
+export { useViewBookedProductsVariantsForCheckoutItem };

package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/buttonCheckoutQuestionItem/ButtonCheckoutQuestionItem.js

@@ -2,14 +2,13 @@ import { Button } from "@lookiero/aurora-next/build/components/atoms/Button/Butt
 import { BUTTON_VARIANT } from "@lookiero/aurora-next/build/components/atoms/Button/Button.definition";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import React, { useCallback } from "react";
-import { CHECKOUT_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
 import { theme } from "../../../../../theme/theme";
 import { useCheckoutQuestionFeedbackForId } from "../../behaviors/useCheckoutQuestionFeedback";
 import { style } from "./ButtonCheckoutQuestionItem.style";
 const { colorAccent, colorBase } = theme();
 const ButtonCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, }) => {
     const { feedback, onChange } = useCheckoutQuestionFeedbackForId({ id: checkoutQuestionParentId });
-    const optionText = useI18nMessage({ id: checkoutQuestion.name, prefix: CHECKOUT_QUESTIONS_PREFIX });
+    const optionText = useI18nMessage({ id: checkoutQuestion.name });
     const handleOnPress = useCallback(() => onChange({ checkoutQuestionId: checkoutQuestionParentId, checkoutQuestionFeedback: checkoutQuestion.id }), [onChange, checkoutQuestion.id, checkoutQuestionParentId]);
     return (React.createElement(Button
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment

package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/hostDefaultCheckoutQuestionItem/HostDefaultCheckoutQuestionItem.js

@@ -1,10 +1,9 @@
 import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Text";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import React from "react";
-import { RETURN_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
 import { style } from "./HostDefaultCheckoutQuestionItem.style";
 const HostDefaultCheckoutQuestionItem = ({ checkoutQuestion, children, }) => {
-    const titleText = useI18nMessage({ id: checkoutQuestion.name, prefix: RETURN_QUESTIONS_PREFIX });
+    const titleText = useI18nMessage({ id: checkoutQuestion.name });
     return (React.createElement(React.Fragment, null,
         React.createElement(Text, { level: 3, style: style.title }, titleText),
         children));

package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/hostSelectCheckoutQuestionItem/HostSelectCheckoutQuestionItem.js

@@ -2,10 +2,9 @@ import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Tex
 import { useI18nMessage } from "@lookiero/i18n-react";
 import React from "react";
 import { View } from "react-native";
-import { CHECKOUT_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
 import { style } from "./HostSelectCheckoutQuestionItem.style";
 const HostSelectCheckoutQuestionItem = ({ checkoutQuestion, children, }) => {
-    const titleText = useI18nMessage({ id: checkoutQuestion.name, prefix: CHECKOUT_QUESTIONS_PREFIX });
+    const titleText = useI18nMessage({ id: checkoutQuestion.name });
     return (React.createElement(React.Fragment, null,
         React.createElement(Text, { level: 3, style: style.title }, titleText),
         React.createElement(View, { style: style.content }, children)));

package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/iconCheckoutQuestionItem/IconCheckoutQuestionItem.d.ts

@@ -1,5 +1,5 @@
 import { CheckoutQuestionItem } from "../CheckoutQuestionItem";
-type IconName = "checkout.checkout_question.icon.bad" | "checkout.checkout_question.icon.regular" | "checkout.checkout_question.icon.good";
+type IconName = "checkout_question.icon.bad" | "checkout_question.icon.regular" | "checkout_question.icon.good";
 declare const IconCheckoutQuestionItem: CheckoutQuestionItem;
 export type { IconName };
 export { IconCheckoutQuestionItem };

package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/iconCheckoutQuestionItem/IconCheckoutQuestionItem.js

@@ -10,11 +10,11 @@ import { Sad } from "./icons/Sad";
 const { colorAccent } = theme();
 const ICON = {
     // eslint-disable-next-line @typescript-eslint/naming-convention
-    "checkout.checkout_question.icon.bad": Sad,
+    "checkout_question.icon.bad": Sad,
     // eslint-disable-next-line @typescript-eslint/naming-convention
-    "checkout.checkout_question.icon.regular": Normal,
+    "checkout_question.icon.regular": Normal,
     // eslint-disable-next-line @typescript-eslint/naming-convention
-    "checkout.checkout_question.icon.good": Happy,
+    "checkout_question.icon.good": Happy,
 };
 const IconCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, }) => {
     const Icon = ICON[checkoutQuestion.name];

package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/textareaCheckoutQuestionItem/TextareaCheckoutQuestionItem.js

@@ -1,14 +1,10 @@
 import { useI18nMessage } from "@lookiero/i18n-react";
 import React, { useCallback } from "react";
 import { InputField } from "../../../../../../../shared/ui/components/molecules/inputField/InputField";
-import { RETURN_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
 import { useCheckoutQuestionFeedbackForId } from "../../behaviors/useCheckoutQuestionFeedback";
 const TEXTAREA_MIN_HEIGHT = 96;
 const TextareaCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, }) => {
-    const placeholderText = useI18nMessage({
-        id: checkoutQuestion.placeholder,
-        prefix: RETURN_QUESTIONS_PREFIX,
-    });
+    const placeholderText = useI18nMessage({ id: checkoutQuestion.placeholder });
     const { feedback, onChange } = useCheckoutQuestionFeedbackForId({ id: checkoutQuestionParentId });
     const handleOnChange = useCallback((value) => onChange({ checkoutQuestionId: checkoutQuestionParentId, checkoutQuestionFeedback: value }), [onChange, checkoutQuestionParentId]);
     return (React.createElement(InputField, { label: placeholderText, minHeight: TEXTAREA_MIN_HEIGHT, placeholder: placeholderText, value: feedback, multiline: true, onChange: handleOnChange }));

package/dist/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem.js

@@ -1,10 +1,9 @@
 import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Text";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import React from "react";
-import { RETURN_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
 import { style } from "./HostDefaultReturnQuestionItem.style";
 const HostDefaultReturnQuestionItem = ({ returnQuestion, children }) => {
-    const titleText = useI18nMessage({ id: returnQuestion.name, prefix: RETURN_QUESTIONS_PREFIX });
+    const titleText = useI18nMessage({ id: returnQuestion.name });
     return (React.createElement(React.Fragment, null,
         React.createElement(Text, { level: 3, style: style.title }, titleText),
         children));

package/dist/infrastructure/ui/components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem.js

@@ -4,19 +4,18 @@ import { TouchableHighlight, View } from "react-native";
 import { Modal } from "../../../../../../../shared/ui/components/layouts/modal/Modal";
 import { ButtonIcon } from "../../../../../../../shared/ui/components/molecules/buttonIcon/ButtonIcon";
 import { InputField } from "../../../../../../../shared/ui/components/molecules/inputField/InputField";
-import { RETURN_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
 import { useReturnQuestionFeedback, useReturnQuestionFeedbackForId } from "../../behaviors/useReturnQuestionFeedback";
 import { deepestReturnQuestionWithFeedbackForReturnQuestion, feedbackForReturnQuestion, } from "../../util/returnQuestionFeedback";
 import { style, containerUnderlayColor } from "./HostSelectReturnQuestionItem.style";
 const HostSelectReturnQuestionItem = ({ returnQuestion, children, portalHostName, }) => {
-    const placeholderText = useI18nMessage({ id: returnQuestion.placeholder, prefix: RETURN_QUESTIONS_PREFIX });
+    const placeholderText = useI18nMessage({ id: returnQuestion.placeholder });
     const [modalVisible, setModalVisible] = useState(false);
     const handleOnPress = useCallback(() => setModalVisible(true), []);
     const handleOnModalClose = useCallback(() => setModalVisible(false), []);
     const feedback = useReturnQuestionFeedback();
     const { onChange } = useReturnQuestionFeedbackForId({ id: returnQuestion.id });
     const intl = useIntl();
-    const translate = useCallback((returnQuestionName) => intl.formatMessage({ id: `${RETURN_QUESTIONS_PREFIX}${returnQuestionName}`, defaultMessage: returnQuestionName }), [intl]);
+    const translate = useCallback((returnQuestionName) => intl.formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [intl]);
     const inputValue = feedbackForReturnQuestion({ feedback, returnQuestion, translate }).join(" / ");
     const deepestReturnQuestionWithFeedback = deepestReturnQuestionWithFeedbackForReturnQuestion({
         feedback,

package/dist/infrastructure/ui/components/organisms/returnQuestions/components/hostStackReturnQuestionItem/HostStackReturnQuestionItem.js

@@ -3,17 +3,16 @@ import { useI18nMessage } from "@lookiero/i18n-react";
 import { animated, useSpring } from "@react-spring/native";
 import React, { useCallback, useState } from "react";
 import { View } from "react-native";
-import { RETURN_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
 import ReturnQuestion from "../../ReturnQuestion";
 import { useReturnQuestionFeedbackForId } from "../../behaviors/useReturnQuestionFeedback";
 import { style } from "./HostStackReturnQuestionItem.style";
 const HostStackReturnQuestionItem = ({ returnQuestion, children, portalHostName, }) => {
-    const titleText = useI18nMessage({ id: returnQuestion.name, prefix: RETURN_QUESTIONS_PREFIX });
+    const titleText = useI18nMessage({ id: returnQuestion.name });
     const { feedback } = useReturnQuestionFeedbackForId({ id: returnQuestion.id });
     const feedbackReturnQuestion = feedback
         ? returnQuestion.children?.find((returnQuestion) => returnQuestion.id === feedback)
         : undefined;
-    const feedbackText = useI18nMessage({ id: feedbackReturnQuestion?.name, prefix: RETURN_QUESTIONS_PREFIX });
+    const feedbackText = useI18nMessage({ id: feedbackReturnQuestion?.name });
     const [stackHeight, setStackHeight] = useState();
     const handleOnLayout = useCallback(({ nativeEvent: { layout: { height }, }, }) => setStackHeight(height), []);
     const stackSyle = useSpring({ height: stackHeight });

package/dist/infrastructure/ui/components/organisms/returnQuestions/components/optionReturnQuestionItem/OptionReturnQuestionItem.js

@@ -2,12 +2,11 @@ import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Tex
 import { useI18nMessage } from "@lookiero/i18n-react";
 import React, { useCallback } from "react";
 import { TouchableHighlight } from "react-native";
-import { RETURN_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
 import { useReturnQuestionFeedbackForId } from "../../behaviors/useReturnQuestionFeedback";
 import { containerUnderlayColor, style } from "./OptionReturnQuestionItem.style";
 const OptionReturnQuestionItem = ({ returnQuestion, returnQuestionParentId, }) => {
     const { onChange } = useReturnQuestionFeedbackForId({ id: returnQuestionParentId });
-    const optionText = useI18nMessage({ id: returnQuestion.name, prefix: RETURN_QUESTIONS_PREFIX });
+    const optionText = useI18nMessage({ id: returnQuestion.name });
     const handleOnPress = useCallback(() => onChange({ returnQuestionId: returnQuestionParentId, returnQuestionFeedback: returnQuestion.id }), [onChange, returnQuestion.id, returnQuestionParentId]);
     return (React.createElement(TouchableHighlight, { style: style.container, underlayColor: containerUnderlayColor, onPress: handleOnPress },
         React.createElement(Text, { level: 3, style: style.text }, optionText)));

package/dist/infrastructure/ui/components/organisms/returnQuestions/components/returnQuestionFeedbackItem/ReturnQuestionFeedbackItem.js

@@ -2,22 +2,16 @@ import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Tex
 import { useI18nMessage, useIntl } from "@lookiero/i18n-react";
 import React, { useCallback } from "react";
 import { View } from "react-native";
-import { I18nMessages, RETURN_QUESTIONS_FEEDBACK_PREFIX, RETURN_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
+import { I18nMessages } from "../../../../../i18n/i18n";
 import { useReturnQuestionFeedback } from "../../behaviors/useReturnQuestionFeedback";
 import { feedbackForReturnQuestion } from "../../util/returnQuestionFeedback";
 import { style } from "./ReturnQuestionFeedbackItem.style";
 const ReturnQuestionFeedbackItem = ({ returnQuestion }) => {
-    const titleText = useI18nMessage({ id: returnQuestion.name, prefix: RETURN_QUESTIONS_FEEDBACK_PREFIX });
-    const unansweredText = useI18nMessage({
-        id: I18nMessages.FEEDBACK_UNANSWERED,
-        prefix: RETURN_QUESTIONS_FEEDBACK_PREFIX,
-    });
+    const titleText = useI18nMessage({ id: returnQuestion.name });
+    const unansweredText = useI18nMessage({ id: I18nMessages.FEEDBACK_UNANSWERED });
     const returnQuestionFeedback = useReturnQuestionFeedback();
     const intl = useIntl();
-    const translate = useCallback((returnQuestionName) => intl.formatMessage({
-        id: `${RETURN_QUESTIONS_PREFIX}${returnQuestionName}`,
-        defaultMessage: returnQuestionName,
-    }), [intl]);
+    const translate = useCallback((returnQuestionName) => intl.formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [intl]);
     const feedback = feedbackForReturnQuestion({ feedback: returnQuestionFeedback, returnQuestion, translate }).join(" / ");
     return (React.createElement(View, { style: style.container },
         React.createElement(Text, { level: 2, style: style.title, detail: true }, titleText),

package/dist/infrastructure/ui/components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem.js

@@ -1,11 +1,10 @@
 import { useI18nMessage } from "@lookiero/i18n-react";
 import React, { useCallback } from "react";
 import { InputField } from "../../../../../../../shared/ui/components/molecules/inputField/InputField";
-import { RETURN_QUESTIONS_PREFIX } from "../../../../../i18n/i18n";
 import { useReturnQuestionFeedbackForId } from "../../behaviors/useReturnQuestionFeedback";
 const TEXTAREA_MIN_HEIGHT = 96;
 const TextareaReturnQuestionItem = ({ returnQuestion, returnQuestionParentId, }) => {
-    const placeholderText = useI18nMessage({ id: returnQuestion.placeholder, prefix: RETURN_QUESTIONS_PREFIX });
+    const placeholderText = useI18nMessage({ id: returnQuestion.placeholder });
     const { feedback, onChange } = useReturnQuestionFeedbackForId({ id: returnQuestionParentId });
     const handleOnChange = useCallback((value) => onChange({ returnQuestionId: returnQuestionParentId, returnQuestionFeedback: value }), [onChange, returnQuestionParentId]);
     return (React.createElement(InputField, { label: placeholderText, minHeight: TEXTAREA_MIN_HEIGHT, placeholder: placeholderText, value: feedback, multiline: true, onChange: handleOnChange }));

package/dist/infrastructure/ui/components/templates/SafeAreaScrollView.d.ts

@@ -4,6 +4,7 @@ import { Edge } from "react-native-safe-area-context";
 type SafeAreaScrollViewStyle = "safeAreaView" | "scrollView";
 interface SafeAreaScrollViewProps {
     readonly children: ReactNode;
+    readonly scrollerPaddingTop?: number;
     readonly edges?: Edge[];
     readonly style?: Partial<Record<SafeAreaScrollViewStyle, StyleProp<ViewStyle>>>;
 }

package/dist/infrastructure/ui/components/templates/SafeAreaScrollView.js

@@ -1,16 +1,14 @@
 import React from "react";
 import { ScrollView } from "react-native";
 import { SafeAreaView, useSafeAreaInsets } from "react-native-safe-area-context";
-import { theme } from "../../theme/theme";
-const { spaceXL } = theme();
-const SafeAreaScrollView = ({ children, edges = ["top", "bottom", "left", "right"], style: customStyle, }) => {
+const SafeAreaScrollView = ({ children, edges = ["top", "bottom", "left", "right"], style: customStyle, scrollerPaddingTop = 0, }) => {
     const { top: safeAreaInsetTop, bottom: safeAreaInsetBottom } = useSafeAreaInsets();
     return (React.createElement(SafeAreaView, { edges: edges, style: customStyle?.safeAreaView },
         React.createElement(ScrollView, { contentContainerStyle: [
                 {
                     // Why did we set this??
-                    paddingTop: !safeAreaInsetTop ? spaceXL : 0,
-                    paddingBottom: !safeAreaInsetBottom ? spaceXL : 0,
+                    paddingTop: safeAreaInsetTop + scrollerPaddingTop,
+                    paddingBottom: safeAreaInsetBottom,
                 },
                 customStyle?.scrollView,
             ] }, children)));

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

@@ -1,7 +1,4 @@
 declare const COLOR_I18N_PREFIX = "color.";
-declare const RETURN_QUESTIONS_PREFIX = "return_questions.";
-declare const RETURN_QUESTIONS_FEEDBACK_PREFIX = "return_questions_feedback.";
-declare const CHECKOUT_QUESTIONS_PREFIX = "checkout_questions.";
 declare enum I18nMessages {
     INTRO_TITLE = "intro.title",
     INTRO_SUBTITLE = "intro.subtitle",
@@ -30,8 +27,8 @@ declare enum I18nMessages {
     GET_OUT_OF_CHECKOUT_MODAL_DESCRIPTION = "get_out_of_checkout_modal.description",
     GET_OUT_OF_CHECKOUT_MODAL_DISMISS_BUTTON = "get_out_of_checkout_modal.dismiss_button",
     GET_OUT_OF_CHECKOUT_MODAL_CONFIRM_BUTTON = "get_out_of_checkout_modal.confirm_button",
-    FEEDBACK_TITLE = "feedback.title",
-    FEEDBACK_UNANSWERED = "feedback.unanswered",
+    FEEDBACK_TITLE = "return_questions_feedback.feedback.title",
+    FEEDBACK_UNANSWERED = "return_questions_feedback.feedback.unanswered",
     RETURN_QUESTIONS_TITLE = "return_questions.title",
     RETURN_QUESTIONS_SUBMIT_BUTTON = "return_questions.submit_button",
     SUMMARY_TITLE = "summary.title",
@@ -62,4 +59,4 @@ declare enum I18nMessages {
     HEADER_COMPLETE_CHECKOUT_TITLE = "header.complete_checkout_title",
     FEEDBACK_BUTTON = "feedback.button"
 }
-export { I18nMessages, COLOR_I18N_PREFIX, RETURN_QUESTIONS_PREFIX, RETURN_QUESTIONS_FEEDBACK_PREFIX, CHECKOUT_QUESTIONS_PREFIX, };
+export { I18nMessages, COLOR_I18N_PREFIX };

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

@@ -1,7 +1,4 @@
 const COLOR_I18N_PREFIX = "color.";
-const RETURN_QUESTIONS_PREFIX = "return_questions.";
-const RETURN_QUESTIONS_FEEDBACK_PREFIX = "return_questions_feedback.";
-const CHECKOUT_QUESTIONS_PREFIX = "checkout_questions.";
 var I18nMessages;
 (function (I18nMessages) {
     I18nMessages["INTRO_TITLE"] = "intro.title";
@@ -31,8 +28,8 @@ var I18nMessages;
     I18nMessages["GET_OUT_OF_CHECKOUT_MODAL_DESCRIPTION"] = "get_out_of_checkout_modal.description";
     I18nMessages["GET_OUT_OF_CHECKOUT_MODAL_DISMISS_BUTTON"] = "get_out_of_checkout_modal.dismiss_button";
     I18nMessages["GET_OUT_OF_CHECKOUT_MODAL_CONFIRM_BUTTON"] = "get_out_of_checkout_modal.confirm_button";
-    I18nMessages["FEEDBACK_TITLE"] = "feedback.title";
-    I18nMessages["FEEDBACK_UNANSWERED"] = "feedback.unanswered";
+    I18nMessages["FEEDBACK_TITLE"] = "return_questions_feedback.feedback.title";
+    I18nMessages["FEEDBACK_UNANSWERED"] = "return_questions_feedback.feedback.unanswered";
     I18nMessages["RETURN_QUESTIONS_TITLE"] = "return_questions.title";
     I18nMessages["RETURN_QUESTIONS_SUBMIT_BUTTON"] = "return_questions.submit_button";
     I18nMessages["SUMMARY_TITLE"] = "summary.title";
@@ -63,4 +60,4 @@ var I18nMessages;
     I18nMessages["HEADER_COMPLETE_CHECKOUT_TITLE"] = "header.complete_checkout_title";
     I18nMessages["FEEDBACK_BUTTON"] = "feedback.button";
 })(I18nMessages || (I18nMessages = {}));
-export { I18nMessages, COLOR_I18N_PREFIX, RETURN_QUESTIONS_PREFIX, RETURN_QUESTIONS_FEEDBACK_PREFIX, CHECKOUT_QUESTIONS_PREFIX, };
+export { I18nMessages, COLOR_I18N_PREFIX };

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

@@ -1,6 +1,5 @@
 import { PortalProvider } from "@gorhom/portal";
 import React from "react";
-import { View } from "react-native";
 import { SafeAreaProvider } from "react-native-safe-area-context";
 import { Notifications } from "../../../shared/notifications/infrastructure/ui/views/Notifications";
 import { style } from "./App.style";
@@ -8,6 +7,5 @@ import { Header } from "./header/Header";
 const App = ({ customerId, menu, children }) => (React.createElement(SafeAreaProvider, null,
     React.createElement(Header, { customerId: customerId, menu: menu, style: style.header }),
     React.createElement(Notifications, null),
-    React.createElement(PortalProvider, null,
-        React.createElement(View, { style: style.body }, children))));
+    React.createElement(PortalProvider, null, children)));
 export { App };

package/dist/infrastructure/ui/views/App.style.d.ts

@@ -1,9 +1,4 @@
 declare const style: {
-    body: {
-        minHeight: string;
-        paddingTop: number;
-        zIndex: number;
-    };
     header: {};
 };
 export { style };

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

@@ -1,12 +1,5 @@
 import { Platform, StyleSheet } from "react-native";
-import { theme } from "../theme/theme";
-const { spaceXXXL } = theme();
 const style = StyleSheet.create({
-    body: {
-        minHeight: "100%",
-        paddingTop: spaceXXXL,
-        zIndex: 0,
-    },
     header: {
         ...Platform.select({
             web: {

package/dist/infrastructure/ui/views/checkout/Checkout.js

@@ -19,6 +19,7 @@ import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollVie
 import { I18nMessages } from "../../i18n/i18n";
 import { Routes } from "../../routing/routes";
 import { useBasePath } from "../../routing/useBasePath";
+import { HEADER_HEIGHT } from "../header/Header.style";
 import { ProductVariant } from "../item/components/productVariant/ProductVariant";
 import { Pricing } from "../summary/components/pricing/Pricing";
 import { style } from "./Checkout.style";
@@ -86,7 +87,7 @@ const Checkout = ({ customerId, getAuthToken, useRedirect }) => {
         return React.createElement(Spinner, null);
     return (React.createElement(React.Fragment, null,
         React.createElement(CheckoutSuccessModal, { visible: success, onDismiss: handleOnSuccessModalDismiss }),
-        React.createElement(SafeAreaScrollView, null,
+        React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT },
             React.createElement(Body, { style: { column: style.bodyColumn } },
                 hasReplacedCheckoutItem && (React.createElement(View, { style: style.deliveryBannerContainer },
                     React.createElement(DeliveryBanner, null))),

package/dist/infrastructure/ui/views/checkout/Checkout.style.d.ts

@@ -10,6 +10,7 @@ declare const style: {
     };
     pricingContainer: {
         marginTop: number;
+        paddingBottom: number;
     };
     title: {
         marginBottom: number;

package/dist/infrastructure/ui/views/checkout/Checkout.style.js

@@ -13,6 +13,7 @@ const style = StyleSheet.create({
     },
     pricingContainer: {
         marginTop: spaceXL,
+        paddingBottom: spaceXL,
     },
     title: {
         marginBottom: spaceM,

package/dist/infrastructure/ui/views/feedback/Feedback.js

@@ -7,6 +7,7 @@ import { useListCheckoutQuestionsByCheckoutId } from "../../../projection/checko
 import { Body } from "../../components/layouts/body/Body";
 import { CheckoutQuestionFeedbackProvider } from "../../components/organisms/checkoutQuestions/behaviors/useCheckoutQuestionFeedback";
 import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollView";
+import { HEADER_HEIGHT } from "../header/Header.style";
 import { style } from "./Feedback.style";
 import { CheckoutQuestionsForm } from "./components/checkoutQuestionsForm/CheckoutQuestionsForm";
 const Feedback = ({ customerId }) => {
@@ -28,7 +29,7 @@ const Feedback = ({ customerId }) => {
     if (!dependenciesLoaded)
         return React.createElement(Spinner, null);
     return (React.createElement(CheckoutQuestionFeedbackProvider, { feedback: {} },
-        React.createElement(SafeAreaScrollView, null,
+        React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT },
             React.createElement(Body, { style: { column: style.bodyColumn } },
                 React.createElement(CheckoutQuestionsForm, { checkoutQuestions: checkoutQuestions || [], submitButtonDisabled: giveCheckoutFeedbackStatus === CommandStatus.LOADING, onSubmit: handleOnSubmit })))));
 };

package/dist/infrastructure/ui/views/header/Header.style.d.ts

@@ -1,3 +1,4 @@
+declare const HEADER_HEIGHT: number;
 declare const style: {
     buttonIconPlaceholder: {
         height: number;
@@ -25,4 +26,4 @@ declare const style: {
         textTransform: "uppercase";
     };
 };
-export { style };
+export { style, HEADER_HEIGHT };

package/dist/infrastructure/ui/views/header/Header.style.js

@@ -1,6 +1,7 @@
 import { StyleSheet } from "react-native";
 import { theme } from "../../theme/theme";
 const { colorBase, spaceXXL, spaceXXXL, spaceS } = theme();
+const HEADER_HEIGHT = spaceXXXL;
 const style = StyleSheet.create({
     buttonIconPlaceholder: {
         height: spaceXXL,
@@ -9,7 +10,7 @@ const style = StyleSheet.create({
     container: {
         backgroundColor: colorBase,
         flex: 1,
-        height: spaceXXXL,
+        height: HEADER_HEIGHT,
         paddingHorizontal: spaceS,
         width: "100%",
     },
@@ -28,4 +29,4 @@ const style = StyleSheet.create({
         textTransform: "uppercase",
     },
 });
-export { style };
+export { style, HEADER_HEIGHT };

package/dist/infrastructure/ui/views/intro/Intro.js

@@ -11,6 +11,7 @@ import { useViewFiveItemsDiscountByCustomerId } from "../../../projection/checko
 import { Body } from "../../components/layouts/body/Body";
 import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollView";
 import { I18nMessages } from "../../i18n/i18n";
+import { HEADER_HEIGHT } from "../header/Header.style";
 import { style } from "./Intro.style";
 const Bullet = ({ text }) => (React.createElement(View, { style: style.bullet },
     React.createElement(Icon, { name: "rounded-tick", style: style.tickIcon }),
@@ -29,7 +30,7 @@ const Intro = ({ customerId }) => {
     const [incrementIntroShownCount, incrementIntroShownCountStatus] = useIncrementIntroShownCount();
     if (fiveItemsDiscountStatus === QueryStatus.LOADING)
         return React.createElement(Spinner, null);
-    return (React.createElement(SafeAreaScrollView, null,
+    return (React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT },
         React.createElement(Body, { style: { column: style.bodyColumn } },
             React.createElement(View, { style: style.container },
                 React.createElement(View, { style: style.content },

package/dist/infrastructure/ui/views/item/Item.js

@@ -1,6 +1,6 @@
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
-import { View } from "react-native";
+import { Platform, View } from "react-native";
 import { generatePath, useMatch, useNavigate, useParams } from "react-router-native";
 import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
 import "../../../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
@@ -9,7 +9,7 @@ import { useBookCheckoutBookingForCheckoutItem } from "../../../domain/checkoutB
 import { useKeepCheckoutItem } from "../../../domain/checkoutItem/react/useKeepCheckoutItem";
 import { useReplaceCheckoutItem } from "../../../domain/checkoutItem/react/useReplaceCheckoutItem";
 import { useReturnCheckoutItem } from "../../../domain/checkoutItem/react/useReturnCheckoutItem";
-import { useViewBookedSizeChangeProductsVariantsForCheckoutItem } from "../../../projection/bookedSizeChangeProductsVariants/react/useViewBookedSizeChangeProductsVariantsForCheckoutItem";
+import { useViewBookedProductsVariantsForCheckoutItem } from "../../../projection/bookedProductsVariants/react/useViewBookedProductsVariantsForCheckoutItem";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
 import { useListReturnQuestionsByCheckoutItemId } from "../../../projection/returnQuestion/react/useListReturnQuestionsByCheckoutItemId";
 import { Body } from "../../components/layouts/body/Body";
@@ -17,6 +17,8 @@ import { ReturnQuestionFeedbackProvider } from "../../components/organisms/retur
 import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollView";
 import { Routes } from "../../routing/routes";
 import { useBasePath } from "../../routing/useBasePath";
+import { theme } from "../../theme/theme";
+import { HEADER_HEIGHT } from "../header/Header.style";
 import { style } from "./Item.style";
 import { CustomerDecissionBanner } from "./components/banner/CustomerDecissionBanner";
 import { ItemActions } from "./components/itemActions/ItemActions";
@@ -26,6 +28,7 @@ import { ReturnQuestionsFeedback } from "./components/returnQuestionsFeedback/Re
 import { ReturnQuestionsForm } from "./components/returnQuestionsForm/ReturnQuestionsForm";
 import { SizeChangeModal } from "./components/sizeChangeModal/SizeChangeModal";
 import { SizeWithoutStockModal } from "./components/sizeWithoutStockModal/SizeWithoutStockModal";
+const { spaceXL } = theme();
 const Item = ({ customerId }) => {
     const { id } = useParams();
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
@@ -70,7 +73,7 @@ const Item = ({ customerId }) => {
             navigateToNextView();
         }
     }, [navigateToNextView, replaceCheckoutItemStatus]);
-    const [bookedSizeChangeProductsVariants, bookedSizeChangeProductsVariantsStatus] = useViewBookedSizeChangeProductsVariantsForCheckoutItem({
+    const [bookedProductsVariants, bookedProductsVariantsStatus] = useViewBookedProductsVariantsForCheckoutItem({
         checkoutItemId: checkoutItem.id,
     });
     const [bookCheckoutBooking] = useBookCheckoutBookingForCheckoutItem({
@@ -78,8 +81,8 @@ const Item = ({ customerId }) => {
         checkoutBookingId: checkout?.checkoutBookingId,
     });
     useEffect(() => {
-        checkout && bookedSizeChangeProductsVariants === null && bookCheckoutBooking();
-    }, [bookCheckoutBooking, bookedSizeChangeProductsVariants, checkout]);
+        checkout && bookedProductsVariants === null && bookCheckoutBooking();
+    }, [bookCheckoutBooking, bookedProductsVariants, checkout]);
     const [returnQuestions, returnQuestionsStatus] = useListReturnQuestionsByCheckoutItemId({
         checkoutItemId: checkoutItem.id,
     });
@@ -124,8 +127,8 @@ const Item = ({ customerId }) => {
     const dependenciesLoadedStatuses = [QueryStatus.ERROR, QueryStatus.SUCCESS];
     const dependenciesLoaded = dependenciesLoadedStatuses.includes(returnQuestionsStatus) &&
         (dependenciesLoadedStatuses.includes(checkoutStatus) || checkout) &&
-        dependenciesLoadedStatuses.includes(bookedSizeChangeProductsVariantsStatus) &&
-        bookedSizeChangeProductsVariants;
+        dependenciesLoadedStatuses.includes(bookedProductsVariantsStatus) &&
+        bookedProductsVariants;
     if (!dependenciesLoaded)
         return React.createElement(Spinner, null);
     const { price } = checkoutItem;
@@ -133,16 +136,16 @@ const Item = ({ customerId }) => {
     return (React.createElement(ReturnQuestionFeedbackProvider, { feedback: checkoutItem.feedbacks || {} },
         React.createElement(SizeWithoutStockModal, { visible: sizeWithoutStockModalVisible, onDismiss: handleOnHideSizeWithoutStockModal }),
         React.createElement(SizeChangeModal, { visible: sizeChangeModalVisible, onDismiss: handleOnHideSizeChangeModal }),
-        React.createElement(SafeAreaScrollView, null,
+        React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT },
             React.createElement(Body, null,
                 customerDecissionMade && (React.createElement(CustomerDecissionBanner, { checkoutItemStatus: checkoutItem.status, onPress: handleOnBannerPress })),
-                React.createElement(View, { style: [style.container, { paddingBottom: stickyHeight }] },
+                React.createElement(View, { style: [style.container, { paddingBottom: Platform.OS === "web" ? spaceXL : stickyHeight }] },
                     React.createElement(View, { style: style.sliderContainer },
                         React.createElement(ProductVariantSlider, { producVariantMedia: media })),
                     React.createElement(ProductVariantDescription, { brand: brand, color: color, name: name, price: price, size: productVariantSelected.size }),
                     checkoutItem.status === CheckoutItemStatus.RETURNED && (React.createElement(View, { style: style.feedbackContainer },
                         React.createElement(ReturnQuestionsFeedback, { returnQuestions: returnQuestions || [], onEditFeedback: handleOnEditFeedback })))))),
-        !customerDecissionMade && (React.createElement(ItemActions, { keepButtonLoading: keepCheckoutItemStatus === CommandStatus.LOADING, productVariantSelected: productVariantSelected, productVariants: bookedSizeChangeProductsVariants?.productVariants || [], returnButtonLoading: returnCheckoutItemStatus === CommandStatus.LOADING, sizeSelectorDisabled: replaceCheckoutItemStatus === CommandStatus.LOADING, onKeep: handleOnKeep, onLayout: handleOnStickyLayout, onReplace: handleOnReplace, onReturn: handleOnReturn, onSizeSelectorPress: handleOnShowSizeWithoutStockModal })),
+        !customerDecissionMade && (React.createElement(ItemActions, { keepButtonLoading: keepCheckoutItemStatus === CommandStatus.LOADING, productVariantSelected: productVariantSelected, productVariants: bookedProductsVariants?.productVariants || [], returnButtonLoading: returnCheckoutItemStatus === CommandStatus.LOADING, sizeSelectorDisabled: replaceCheckoutItemStatus === CommandStatus.LOADING, onKeep: handleOnKeep, onLayout: handleOnStickyLayout, onReplace: handleOnReplace, onReturn: handleOnReturn, onSizeSelectorPress: handleOnShowSizeWithoutStockModal })),
         React.createElement(ReturnQuestionsForm, { checkoutItemPrice: checkoutItem.price, productVariant: checkoutItem.productVariant, returnQuestions: returnQuestions || [], visible: returnQuestionsVisible, onClose: handleOnHideReturnQuestions, onSubmit: handleOnSubmit })));
 };
 export { Item };

package/dist/infrastructure/ui/views/item/components/itemActions/ItemActions.d.ts

@@ -1,5 +1,5 @@
 import { FC } from "react";
-import { ProductVariantProjection } from "../../../../../../projection/bookedSizeChangeProductsVariants/bookedSizeChangeProductsVariants";
+import { ProductVariantProjection } from "../../../../../../projection/bookedProductsVariants/bookedProductsVariants";
 import { Layout } from "../../../../../../shared/ui/components/layouts/sticky/Sticky";
 interface ItemActionsProps {
     readonly productVariants: ProductVariantProjection[];

package/dist/infrastructure/ui/views/item/components/returnQuestionsFeedback/ReturnQuestionsFeedback.js

@@ -8,7 +8,7 @@ import { ReturnQuestions } from "../../../../components/organisms/returnQuestion
 import { ReturnQuestionItemProvider, } from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionItem";
 import { HostDefaultReturnQuestionFeedbackItem } from "../../../../components/organisms/returnQuestions/components/hostDefaultReturnQuestionFeedbackItem/HostDefaultReturnQuestionFeedbackItem";
 import { ReturnQuestionFeedbackItem } from "../../../../components/organisms/returnQuestions/components/returnQuestionFeedbackItem/ReturnQuestionFeedbackItem";
-import { I18nMessages, RETURN_QUESTIONS_FEEDBACK_PREFIX } from "../../../../i18n/i18n";
+import { I18nMessages } from "../../../../i18n/i18n";
 import { style } from "./ReturnQuestionsFeedback.style";
 const returnQuestionItems = {
     [ReturnQuestionType.HOST_DEFAULT]: HostDefaultReturnQuestionFeedbackItem,
@@ -19,7 +19,7 @@ const returnQuestionItems = {
     [ReturnQuestionType.OPTION]: ReturnQuestionFeedbackItem,
 };
 const ReturnQuestionsFeedback = ({ returnQuestions, onEditFeedback }) => {
-    const titleText = useI18nMessage({ id: I18nMessages.FEEDBACK_TITLE, prefix: RETURN_QUESTIONS_FEEDBACK_PREFIX });
+    const titleText = useI18nMessage({ id: I18nMessages.FEEDBACK_TITLE });
     return (React.createElement(View, null,
         React.createElement(View, { style: style.titleContainer },
             React.createElement(Text, { level: 2, style: style.title }, titleText),

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

@@ -14,7 +14,7 @@ import { HostSelectReturnQuestionItem } from "../../../../components/organisms/r
 import { HostStackReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/hostStackReturnQuestionItem/HostStackReturnQuestionItem";
 import { OptionReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/optionReturnQuestionItem/OptionReturnQuestionItem";
 import { TextareaReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem";
-import { I18nMessages, RETURN_QUESTIONS_PREFIX } from "../../../../i18n/i18n";
+import { I18nMessages } from "../../../../i18n/i18n";
 import { ProductVariant } from "../productVariant/ProductVariant";
 import { style } from "./ReturnQuestionsForm.style";
 const RETURN_QUESTION_FORM_PORTAL_HOST_NAME = "return-question-form-portal";
@@ -27,11 +27,8 @@ const returnQuestionItems = {
     [ReturnQuestionType.OPTION]: OptionReturnQuestionItem,
 };
 const ReturnQuestionsForm = ({ returnQuestions, checkoutItemPrice, productVariant, visible, onSubmit, onClose, }) => {
-    const titleText = useI18nMessage({ id: I18nMessages.RETURN_QUESTIONS_TITLE, prefix: RETURN_QUESTIONS_PREFIX });
-    const submitButtonText = useI18nMessage({
-        id: I18nMessages.RETURN_QUESTIONS_SUBMIT_BUTTON,
-        prefix: RETURN_QUESTIONS_PREFIX,
-    });
+    const titleText = useI18nMessage({ id: I18nMessages.RETURN_QUESTIONS_TITLE });
+    const submitButtonText = useI18nMessage({ id: I18nMessages.RETURN_QUESTIONS_SUBMIT_BUTTON });
     const { media, brand, name, size, color } = productVariant;
     const feedback = useReturnQuestionFeedback();
     const handleOnSubmit = useCallback(() => onSubmit(feedback), [feedback, onSubmit]);

package/dist/infrastructure/ui/views/summary/Summary.js

@@ -14,10 +14,13 @@ import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollVie
 import { I18nMessages } from "../../i18n/i18n";
 import { Routes } from "../../routing/routes";
 import { useBasePath } from "../../routing/useBasePath";
+import { theme } from "../../theme/theme";
+import { HEADER_HEIGHT } from "../header/Header.style";
 import { style } from "./Summary.style";
 import { CheckoutItemsTabs } from "./components/checkoutItemsTabs/CheckoutItemsTabs";
 import { FiveItemsDiscountBanner } from "./components/fiveItemsDiscountBanner/FiveItemsDiscountBanner";
 import { StickyPricing } from "./components/stickyPricing/StickyPricing";
+const { spaceXL } = theme();
 const Summary = ({ customerId }) => {
     const titleText = useI18nMessage({ id: I18nMessages.SUMMARY_TITLE });
     const descriptionText = useI18nMessage({ id: I18nMessages.SUMMARY_DESCRIPTION });
@@ -39,8 +42,8 @@ const Summary = ({ customerId }) => {
     if (!dependenciesLoaded)
         return React.createElement(Spinner, null);
     return (React.createElement(React.Fragment, null,
-        React.createElement(SafeAreaScrollView, { style: { safeAreaView: style.container } },
-            React.createElement(Body, null,
+        React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT, style: { safeAreaView: style.container } },
+            React.createElement(Body, { style: { row: { paddingBottom: spaceXL } } },
                 fiveItemsDiscount !== 0 && React.createElement(FiveItemsDiscountBanner, { fiveItemsDiscount: fiveItemsDiscount }),
                 React.createElement(View, { style: style.content },
                     React.createElement(Text, { level: 3, style: style.title, heading: true }, titleText),

package/dist/infrastructure/ui/views/summary/components/checkoutItemsTabs/CheckoutItemsTabs.js

@@ -16,9 +16,9 @@ const CheckoutItemsTabs = ({ checkoutItemsKept, checkoutItemsReturned, onPressIt
     const returnEmptyText = useI18nMessage({ id: I18nMessages.SUMMARY_RETURN_EMPTY });
     const handleOnPressItem = useCallback((checkoutItemId) => onPressItem(checkoutItemId), [onPressItem]);
     return (React.createElement(Tabs, { style: { sliderContainer: style.sliderContainer }, tabLabels: [`${keepTabText} (${checkoutItemsKept.length})`, `${returnTabText} (${checkoutItemsReturned.length})`] },
-        React.createElement(React.Fragment, null, checkoutItemsKept.length === 0 ? (React.createElement(Text, null, keepEmptyText)) : (checkoutItemsKept.map((checkoutItem) => (React.createElement(CheckoutItem, { key: checkoutItem.id, checkoutItemPrice: checkoutItem.price, checkoutItemStatus: checkoutItem.status, testID: "keep-checkout-item", checkoutItemProductVariant: checkoutItem.status === CheckoutItemStatus.REPLACED && checkoutItem.replacedFor
+        React.createElement(React.Fragment, null, checkoutItemsKept.length === 0 ? (React.createElement(Text, { style: style.emptyText }, keepEmptyText)) : (checkoutItemsKept.map((checkoutItem) => (React.createElement(CheckoutItem, { key: checkoutItem.id, checkoutItemPrice: checkoutItem.price, checkoutItemStatus: checkoutItem.status, testID: "keep-checkout-item", checkoutItemProductVariant: checkoutItem.status === CheckoutItemStatus.REPLACED && checkoutItem.replacedFor
                 ? checkoutItem.replacedFor
                 : checkoutItem.productVariant, onPress: () => handleOnPressItem(checkoutItem.id) }))))),
-        React.createElement(React.Fragment, null, checkoutItemsReturned.length === 0 ? (React.createElement(Text, null, returnEmptyText)) : (checkoutItemsReturned.map((checkoutItem) => (React.createElement(CheckoutItem, { key: checkoutItem.id, checkoutItemPrice: checkoutItem.price, checkoutItemProductVariant: checkoutItem.productVariant, checkoutItemStatus: checkoutItem.status, style: { image: style.returnCheckoutItem }, testID: "return-checkout-item", discarded: true, onPress: () => handleOnPressItem(checkoutItem.id) })))))));
+        React.createElement(React.Fragment, null, checkoutItemsReturned.length === 0 ? (React.createElement(Text, { style: style.emptyText }, returnEmptyText)) : (checkoutItemsReturned.map((checkoutItem) => (React.createElement(CheckoutItem, { key: checkoutItem.id, checkoutItemPrice: checkoutItem.price, checkoutItemProductVariant: checkoutItem.productVariant, checkoutItemStatus: checkoutItem.status, style: { image: style.returnCheckoutItem }, testID: "return-checkout-item", discarded: true, onPress: () => handleOnPressItem(checkoutItem.id) })))))));
 };
 export { CheckoutItemsTabs };

package/dist/infrastructure/ui/views/summary/components/checkoutItemsTabs/CheckoutItemsTabs.style.d.ts

@@ -2,6 +2,9 @@ declare const style: {
     checkoutItem: {
         paddingVertical: number;
     };
+    emptyText: {
+        paddingTop: number;
+    };
     returnCheckoutItem: {
         borderColor: string;
     };

package/dist/infrastructure/ui/views/summary/components/checkoutItemsTabs/CheckoutItemsTabs.style.js

@@ -5,6 +5,9 @@ const style = StyleSheet.create({
     checkoutItem: {
         paddingVertical: spaceM,
     },
+    emptyText: {
+        paddingTop: spaceM,
+    },
     returnCheckoutItem: {
         borderColor: colorContent,
     },

package/dist/projection/{bookedSizeChangeProductsVariants/bookedSizeChangeProductsVariants.d.ts → bookedProductsVariants/bookedProductsVariants.d.ts}

@@ -3,7 +3,7 @@ interface ProductVariantProjection {
     readonly id: string;
     readonly size: SizeProjection;
 }
-interface BookedSizeChangeProductsVariantsProjection {
+interface BookedProductsVariantsProjection {
     readonly productVariants: ProductVariantProjection[];
 }
-export type { BookedSizeChangeProductsVariantsProjection, ProductVariantProjection };
+export type { BookedProductsVariantsProjection, ProductVariantProjection };

package/dist/projection/bookedProductsVariants/viewBookedProductVariantsForCheckoutItem.d.ts

@@ -0,0 +1,25 @@
+import { CancelableQueryViewArgs, Query, QueryHandlerFunction, QueryHandlerFunctionArgs } from "@lookiero/messaging";
+import { BookedProductsVariantsProjection } from "./bookedProductsVariants";
+declare const VIEW_BOOKED_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM = "view_booked_product_variants_for_checkout_item";
+interface ViewBookedProductsVariantsForCheckoutItemPayload {
+    readonly checkoutItemId: string;
+}
+interface ViewBookedProductsVariantsForCheckoutItem extends Query<typeof VIEW_BOOKED_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM>, ViewBookedProductsVariantsForCheckoutItemPayload {
+}
+interface ViewBookedProductsVariantsForCheckoutItemFunction {
+    (payload: ViewBookedProductsVariantsForCheckoutItemPayload): ViewBookedProductsVariantsForCheckoutItem;
+}
+declare const viewBookedProductsVariantsForCheckoutItem: ViewBookedProductsVariantsForCheckoutItemFunction;
+type ViewBookedProductsVariantsForCheckoutItemResult = BookedProductsVariantsProjection | null;
+interface BookedProductsVariantsForCheckoutItemViewArgs extends CancelableQueryViewArgs {
+    readonly checkoutItemId: string;
+}
+interface BookedProductsVariantsForCheckoutItemView {
+    (args: BookedProductsVariantsForCheckoutItemViewArgs): Promise<ViewBookedProductsVariantsForCheckoutItemResult>;
+}
+interface ViewBookedProductsVariantsForCheckoutItemHandlerFunctionArgs extends QueryHandlerFunctionArgs {
+    readonly view: BookedProductsVariantsForCheckoutItemView;
+}
+declare const viewBookedProductsVariantsForCheckoutItemHandler: QueryHandlerFunction<ViewBookedProductsVariantsForCheckoutItem, ViewBookedProductsVariantsForCheckoutItemResult, ViewBookedProductsVariantsForCheckoutItemHandlerFunctionArgs>;
+export type { ViewBookedProductsVariantsForCheckoutItem, BookedProductsVariantsForCheckoutItemView, ViewBookedProductsVariantsForCheckoutItemResult, };
+export { VIEW_BOOKED_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, viewBookedProductsVariantsForCheckoutItem, viewBookedProductsVariantsForCheckoutItemHandler, };

package/dist/projection/bookedProductsVariants/viewBookedProductVariantsForCheckoutItem.js

@@ -0,0 +1,8 @@
+import { query, } from "@lookiero/messaging";
+const VIEW_BOOKED_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM = "view_booked_product_variants_for_checkout_item";
+const viewBookedProductsVariantsForCheckoutItem = (payload) => ({
+    ...query({ name: VIEW_BOOKED_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM }),
+    ...payload,
+});
+const viewBookedProductsVariantsForCheckoutItemHandler = ({ view, signal }) => async ({ checkoutItemId }) => view({ checkoutItemId, signal });
+export { VIEW_BOOKED_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, viewBookedProductsVariantsForCheckoutItem, viewBookedProductsVariantsForCheckoutItemHandler, };

package/dist/shared/notifications/infrastructure/ui/components/Notifications.js

@@ -3,11 +3,16 @@ import { View } from "react-native";
 import { Column } from "../../../../ui/components/layouts/column/Column";
 import { Row } from "../../../../ui/components/layouts/row/Row";
 import { Stack } from "../../../../ui/components/layouts/stack/Stack";
+import { useScreenSize } from "../../../../ui/hooks/useScreenSize";
 import { NotificationItem } from "./NotificationItem";
 import { style } from "./Notifications.style";
 const NOTIFICATIONS_AUTOHIDE_TIMEOUT = 10000;
-const Notifications = ({ notifications = [], onRemove, autoHideTimeout = NOTIFICATIONS_AUTOHIDE_TIMEOUT, }) => (React.createElement(View, { pointerEvents: "box-none", style: style.notifications, testID: "notifications" },
-    React.createElement(Row, { style: style.row },
-        React.createElement(Column, null,
-            React.createElement(Stack, null, notifications.map((notification) => (React.createElement(NotificationItem, { key: notification.id, autoHideTimeout: autoHideTimeout, notification: notification, style: { toast: style.toast }, testID: notification.id, onRemove: onRemove }))))))));
+const Notifications = ({ notifications = [], onRemove, autoHideTimeout = NOTIFICATIONS_AUTOHIDE_TIMEOUT, }) => {
+    const screenSize = useScreenSize();
+    const isSmallDevice = screenSize === "S";
+    return (React.createElement(View, { pointerEvents: "box-none", style: style.notifications, testID: "notifications" },
+        React.createElement(Row, { style: [style.row, isSmallDevice && style.rowSmall] },
+            React.createElement(Column, null,
+                React.createElement(Stack, null, notifications.map((notification) => (React.createElement(NotificationItem, { key: notification.id, autoHideTimeout: autoHideTimeout, notification: notification, style: { toast: style.toast }, testID: notification.id, onRemove: onRemove }))))))));
+};
 export { Notifications };

package/dist/shared/notifications/infrastructure/ui/components/Notifications.style.d.ts

@@ -1,25 +1,33 @@
-declare const style: {
-    layoutLarge: {
-        paddingLeft: number;
-        paddingRight: number;
-    };
-    layoutSmall: {
-        paddingLeft: string;
-        paddingRight: string;
-    };
+import { StyleSheet } from "react-native";
+declare const style: StyleSheet.NamedStyles<any> | StyleSheet.NamedStyles<{
     notifications: {
+        top: number;
+        width: string;
+        zIndex: number;
         left: number;
-        position: "absolute";
+    } | {
         top: number;
         width: string;
         zIndex: number;
+        position: "sticky";
+        left: number;
+    } | {
+        top: number;
+        width: string;
+        zIndex: number;
+        position: "absolute";
+        left: number;
     };
     row: {
         flex: number;
         justifyContent: "center";
     };
+    rowSmall: {
+        paddingLeft: number;
+        paddingRight: number;
+    };
     toast: {
         marginTop: number;
     };
-};
+}>;
 export { style };

package/dist/shared/notifications/infrastructure/ui/components/Notifications.style.js

@@ -1,18 +1,16 @@
-import { StyleSheet } from "react-native";
+import { Platform, StyleSheet } from "react-native";
 import { theme } from "../../../../../infrastructure/ui/theme/theme";
 const { spaceM } = theme();
 const style = StyleSheet.create({
-    layoutLarge: {
-        paddingLeft: 0,
-        paddingRight: 0,
-    },
-    layoutSmall: {
-        paddingLeft: "$spaceM",
-        paddingRight: "$spaceM",
-    },
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
     notifications: {
         left: 0,
-        position: "absolute",
+        ...Platform.select({
+            web: { position: "sticky" },
+            ios: { position: "absolute" },
+            android: { position: "absolute" },
+        }),
         top: 0,
         width: "100%",
         zIndex: 20,
@@ -21,6 +19,10 @@ const style = StyleSheet.create({
         flex: 1,
         justifyContent: "center",
     },
+    rowSmall: {
+        paddingLeft: spaceM,
+        paddingRight: spaceM,
+    },
     toast: {
         marginTop: spaceM,
     },

package/dist/shared/ui/components/layouts/modal/Modal.js

@@ -10,17 +10,19 @@ import { ButtonIcon } from "../../molecules/buttonIcon/ButtonIcon";
 import { Row } from "../row/Row";
 import { Sticky } from "../sticky/Sticky";
 import { style } from "./Modal.style";
-const { spaceXXL } = theme();
+const { spaceXL, spaceXXL } = theme();
 const TRANSITION_MODAL_SCALE = 0.9;
 const DEFAULT_SAFEAREA_INSET_TOP = spaceXXL;
+const MODAL_DESKTOP_VERTICAL_PADDING = spaceXXL;
 const Modal = ({ children, visible, header, footer, portalHostName, onClose, showCloseButton = false, size = { M: "2/3", L: "1/3" }, style: customStyle, scroll = false, }) => {
     const { height: screenHeight } = Dimensions.get(Platform.OS === "web" ? "window" : "screen");
     const { top: safeAreaInsetTop, bottom: safeAreaInsetBottom } = useSafeAreaInsets();
-    // On Android safeAreaInsetTop won't return the actual value.
-    const screenSizeWithoutInsets = screenHeight - (Platform.OS === "android" ? DEFAULT_SAFEAREA_INSET_TOP : safeAreaInsetTop);
     const screenSize = useScreenSize();
     const isSmallDevice = screenSize === "S";
     const columnSizeForScreenSize = size[screenSize];
+    // On Android safeAreaInsetTop won't return the actual value.
+    const screenSizeWithoutInsets = screenHeight - (Platform.OS === "android" ? DEFAULT_SAFEAREA_INSET_TOP : safeAreaInsetTop);
+    const modalMaxHeight = screenSizeWithoutInsets - (!isSmallDevice ? MODAL_DESKTOP_VERTICAL_PADDING : 0);
     const handleHardwareBackPress = useCallback(() => {
         if (!visible) {
             return;
@@ -65,7 +67,7 @@ const Modal = ({ children, visible, header, footer, portalHostName, onClose, sho
                         {
                             opacity: modalOpacity,
                             transform: [{ translateY: modalTranslateY }, { scale: modalScale }],
-                            maxHeight: screenSizeWithoutInsets,
+                            maxHeight: modalMaxHeight,
                         },
                         customStyle?.modal,
                     ], onLayout: handleOnModalLayout },
@@ -73,7 +75,9 @@ const Modal = ({ children, visible, header, footer, portalHostName, onClose, sho
                         React.createElement(View, null, header),
                         showCloseButton && (React.createElement(ButtonIcon, { name: "close", style: { button: customStyle?.closeButton }, onPress: onClose })))),
                     React.createElement(ModalContentView, null,
-                        React.createElement(View, { style: { paddingBottom: safeAreaInsetBottom + footerHeight } }, children)),
+                        React.createElement(View, { style: {
+                                paddingBottom: safeAreaInsetBottom + (Platform.OS === "web" ? spaceXL : footerHeight),
+                            } }, children)),
                     footer && (React.createElement(Sticky, { style: style.stickyFooter, onLayout: handleOnFooterLayout }, footer))))))))));
 };
 export { Modal };

package/dist/shared/ui/components/layouts/modal/Modal.style.d.ts

@@ -29,15 +29,18 @@ declare const style: StyleSheet.NamedStyles<any> | StyleSheet.NamedStyles<{
     "2/3": ViewStyle;
     container: {
         width: string;
+        zIndex: number;
         height: string;
         overflow: "hidden";
     } | {
         width: string;
+        zIndex: number;
         position: "fixed";
         height: string;
         overflow: "hidden";
     } | {
         width: string;
+        zIndex: number;
         position: "absolute";
         height: string;
         overflow: "hidden";

package/dist/shared/ui/components/layouts/modal/Modal.style.js

@@ -27,6 +27,7 @@ const style = StyleSheet.create({
             ios: { position: "absolute" },
         }),
         width: "100%",
+        zIndex: 100,
     },
     header: {
         alignItems: "center",

package/dist/shared/ui/components/layouts/sticky/Sticky.style.js

@@ -11,7 +11,7 @@ const style = StyleSheet.create({
         paddingTop: spaceXL,
         shadowColor: colorBase,
         shadowOffset: {
-            height: -40,
+            height: -spaceXL,
             width: 0,
         },
         shadowOpacity: 1,

package/dist/shared/ui/components/molecules/buttonIcon/ButtonIcon.style.d.ts

@@ -1,6 +1,7 @@
 declare const buttonIconUnderlayColor: string;
 declare const style: {
     buttonIcon: {
+        flexGrow: number;
         padding: number;
     };
 };

package/dist/shared/ui/components/molecules/buttonIcon/ButtonIcon.style.js

@@ -4,6 +4,7 @@ const { spaceS, colorGrayscaleS } = theme();
 const buttonIconUnderlayColor = colorGrayscaleS;
 const style = StyleSheet.create({
     buttonIcon: {
+        flexGrow: 0,
         padding: spaceS,
     },
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "0.4.1",
+  "version": "0.4.3",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
@@ -35,7 +35,7 @@
     "@react-spring/native": "^9.5.5",
     "inline-style-prefixer": "6.0.1",
     "react-native-safe-area-context": "^4.4.1",
-    "react-native-svg": "12.3.0",
+    "react-native-svg": "^12.1.1",
     "tiny-invariant": "^1.3.1",
     "uuid": "^9.0.0"
   },

package/dist/infrastructure/projection/bookedSizeChangeProductsVariants/httpBookedSizeChangeProductsVariantsForCheckoutItemView.d.ts

@@ -1,12 +0,0 @@
-import { BookedSizeChangeProductsVariantsForCheckoutItemView } from "../../../projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem";
-import { HttpPostFunction } from "../../delivery/http/httpClient";
-interface HttpBookedSizeChangeProductsVariantsForCheckoutItemView extends BookedSizeChangeProductsVariantsForCheckoutItemView {
-}
-interface HttpBookedSizeChangeProductsVariantsForCheckoutItemViewFunctionArgs {
-    readonly httpPost: HttpPostFunction;
-}
-interface HttpBookedSizeChangeProductsVariantsForCheckoutItemViewFunction {
-    (args: HttpBookedSizeChangeProductsVariantsForCheckoutItemViewFunctionArgs): HttpBookedSizeChangeProductsVariantsForCheckoutItemView;
-}
-declare const httpBookedSizeChangeProductsVariantsForCheckoutItemView: HttpBookedSizeChangeProductsVariantsForCheckoutItemViewFunction;
-export { httpBookedSizeChangeProductsVariantsForCheckoutItemView };

package/dist/infrastructure/projection/bookedSizeChangeProductsVariants/react/useViewBookedSizeChangeProductsVariantsForCheckoutItem.d.ts

@@ -1,10 +0,0 @@
-import { UseQueryFunctionResult } from "@lookiero/messaging-react";
-import { BookedSizeChangeProductsVariantsProjection } from "../../../../projection/bookedSizeChangeProductsVariants/bookedSizeChangeProductsVariants";
-interface UseViewBookedSizeChangeProductsVariantsForCheckoutItemFunctionArgs {
-    readonly checkoutItemId: string;
-}
-interface UseViewBookedSizeChangeProductsVariantsForCheckoutItemFunction {
-    (args: UseViewBookedSizeChangeProductsVariantsForCheckoutItemFunctionArgs): UseQueryFunctionResult<BookedSizeChangeProductsVariantsProjection>;
-}
-declare const useViewBookedSizeChangeProductsVariantsForCheckoutItem: UseViewBookedSizeChangeProductsVariantsForCheckoutItemFunction;
-export { useViewBookedSizeChangeProductsVariantsForCheckoutItem };

package/dist/projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem.d.ts

@@ -1,25 +0,0 @@
-import { CancelableQueryViewArgs, Query, QueryHandlerFunction, QueryHandlerFunctionArgs } from "@lookiero/messaging";
-import { BookedSizeChangeProductsVariantsProjection } from "./bookedSizeChangeProductsVariants";
-declare const VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM = "view_booked_size_change_product_variants_for_checkout_item";
-interface ViewBookedSizeChangeProductsVariantsForCheckoutItemPayload {
-    readonly checkoutItemId: string;
-}
-interface ViewBookedSizeChangeProductsVariantsForCheckoutItem extends Query<typeof VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM>, ViewBookedSizeChangeProductsVariantsForCheckoutItemPayload {
-}
-interface ViewBookedSizeChangeProductsVariantsForCheckoutItemFunction {
-    (payload: ViewBookedSizeChangeProductsVariantsForCheckoutItemPayload): ViewBookedSizeChangeProductsVariantsForCheckoutItem;
-}
-declare const viewBookedSizeChangeProductsVariantsForCheckoutItem: ViewBookedSizeChangeProductsVariantsForCheckoutItemFunction;
-type ViewBookedSizeChangeProductsVariantsForCheckoutItemResult = BookedSizeChangeProductsVariantsProjection | null;
-interface BookedSizeChangeProductsVariantsForCheckoutItemViewArgs extends CancelableQueryViewArgs {
-    readonly checkoutItemId: string;
-}
-interface BookedSizeChangeProductsVariantsForCheckoutItemView {
-    (args: BookedSizeChangeProductsVariantsForCheckoutItemViewArgs): Promise<ViewBookedSizeChangeProductsVariantsForCheckoutItemResult>;
-}
-interface ViewBookedSizeChangeProductsVariantsForCheckoutItemHandlerFunctionArgs extends QueryHandlerFunctionArgs {
-    readonly view: BookedSizeChangeProductsVariantsForCheckoutItemView;
-}
-declare const viewBookedSizeChangeProductsVariantsForCheckoutItemHandler: QueryHandlerFunction<ViewBookedSizeChangeProductsVariantsForCheckoutItem, ViewBookedSizeChangeProductsVariantsForCheckoutItemResult, ViewBookedSizeChangeProductsVariantsForCheckoutItemHandlerFunctionArgs>;
-export type { ViewBookedSizeChangeProductsVariantsForCheckoutItem, BookedSizeChangeProductsVariantsForCheckoutItemView, ViewBookedSizeChangeProductsVariantsForCheckoutItemResult, };
-export { VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, viewBookedSizeChangeProductsVariantsForCheckoutItem, viewBookedSizeChangeProductsVariantsForCheckoutItemHandler, };

package/dist/projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem.js

@@ -1,8 +0,0 @@
-import { query, } from "@lookiero/messaging";
-const VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM = "view_booked_size_change_product_variants_for_checkout_item";
-const viewBookedSizeChangeProductsVariantsForCheckoutItem = (payload) => ({
-    ...query({ name: VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM }),
-    ...payload,
-});
-const viewBookedSizeChangeProductsVariantsForCheckoutItemHandler = ({ view, signal }) => async ({ checkoutItemId }) => view({ checkoutItemId, signal });
-export { VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, viewBookedSizeChangeProductsVariantsForCheckoutItem, viewBookedSizeChangeProductsVariantsForCheckoutItemHandler, };