@lookiero/checkout 6.5.0-beta.5 → 6.5.1-beta.0

package/dist/src/infrastructure/ab-testing/kameleoonEnvironment.d.ts

@@ -1,11 +1,11 @@
-interface Experiment<T extends string> {
+interface Experiment {
     readonly id: string;
-    readonly variations: Record<T, string>;
+    readonly variations: Record<string, string>;
 }
 interface KameleoonEnvironment {
     readonly siteCode: string;
     readonly experiments: {
-        readonly newFeedback: Experiment<"v1">;
+        readonly newFeedback: Experiment;
     };
 }
 export type { KameleoonEnvironment };

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

@@ -1,8 +1,8 @@
 import { FC, ReactNode } from "react";
-import { Layout as LocalLayout } from "@lookiero/sty-psp-ui";
+import { Layout as UiLayout } from "@lookiero/sty-psp-ui";
 interface CheckoutProps {
     readonly children?: ReactNode;
-    readonly layout: LocalLayout;
+    readonly layout: UiLayout;
     readonly useRedirect: () => Record<string, string>;
 }
 declare const Checkout: FC<CheckoutProps>;

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

@@ -23,7 +23,7 @@ import { Pricing } from "../summary/components/pricing/Pricing";
 import { style } from "./Checkout.style";
 import { DeliveryBanner } from "./components/deliveryBanner/DeliveryBanner";
 import { PaymentInstrument } from "./components/paymentInstrument/PaymentInstrument";
-const Checkout = ({ children, layout: LocalLayout, useRedirect }) => {
+const Checkout = ({ children, layout: UiLayout, useRedirect }) => {
     const { customer: { customerId, country, segment }, } = useStaticInfo();
     const titleText = useI18nMessage({ id: I18nMessages.CHECKOUT_TITLE });
     const submitButtonText = useI18nMessage({ id: I18nMessages.CHECKOUT_PAY_BUTTON });
@@ -68,7 +68,7 @@ const Checkout = ({ children, layout: LocalLayout, useRedirect }) => {
     if (!dependenciesLoaded) {
         return React.createElement(Spinner, null);
     }
-    return (React.createElement(LocalLayout, { header: React.createElement(CheckoutHeader, { onBack: handleOnBack }), scrollEnabled: false, style: {
+    return (React.createElement(UiLayout, { header: React.createElement(CheckoutHeader, { onBack: handleOnBack }), scrollEnabled: false, style: {
             header: style.header,
             scrollView: style.scrollView,
         } },

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

@@ -29,6 +29,7 @@ declare const style: {
     };
     princingWrapperSmall: {
         backgroundColor: string;
+        paddingBottom: number;
     };
     resume: any;
     scrollView: {

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

@@ -1,7 +1,7 @@
 import { StyleSheet, Platform } from "react-native";
 import { theme } from "@lookiero/sty-psp-ui";
 import { HEADER_HEIGHT } from "../../components/templates/header/Header.style";
-const { borderRadius4, colorBgPrimaryLight, colorBgBase, space3, space4, space6, space12, space16 } = theme();
+const { borderRadius4, colorBgPrimaryLight, colorBgBase, space2, space3, space4, space6, space12, space16 } = theme();
 const style = StyleSheet.create({
     contentWrapper: {
         backgroundColor: colorBgBase,
@@ -33,6 +33,7 @@ const style = StyleSheet.create({
     },
     princingWrapperSmall: {
         backgroundColor: colorBgPrimaryLight,
+        paddingBottom: space2,
     },
     resume: {
         overflow: "hidden",

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

@@ -2,6 +2,7 @@ import React, { useCallback, useEffect, useRef } from "react";
 import { Spinner } from "@lookiero/aurora";
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
 import { useLogger } from "@lookiero/sty-psp-logging";
+import { useScreenSize } from "@lookiero/sty-psp-ui";
 import { CheckoutQuestionType } from "../../../../projection/checkoutQuestion/checkoutQuestion";
 import { useGiveCheckoutFeedback } from "../../../domain/checkoutFeedback/react/useGiveCheckoutFeedback";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
@@ -17,6 +18,8 @@ import { style } from "./Feedback.style";
 import { CheckoutQuestionsForm } from "./components/checkoutQuestionsForm/CheckoutQuestionsForm";
 const Feedback = ({ layout: Layout }) => {
     const logger = useLogger();
+    const screenSize = useScreenSize();
+    const isDesktop = screenSize === "L";
     const { customer: { customerId, country, segment }, } = useStaticInfo();
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const [checkoutQuestions, checkoutQuestionsStatus] = useListCheckoutQuestionsByCheckoutId({
@@ -78,8 +81,8 @@ const Feedback = ({ layout: Layout }) => {
     if (!dependenciesLoaded)
         return React.createElement(Spinner, null);
     return (React.createElement(CheckoutQuestionFeedbackProvider, { feedback: {}, onChanged: handleOnChangedFeedback },
-        React.createElement(Layout, { style: { scrollView: style.container } },
-            React.createElement(Body, { style: { column: style.bodyColumn } },
+        React.createElement(Layout, null,
+            React.createElement(Body, { style: { row: [style.container, isDesktop && style.containerDesktop] } },
                 React.createElement(CheckoutQuestionsForm, { checkoutQuestions: checkoutQuestions || [], submitButtonDisabled: giveCheckoutFeedbackStatus === CommandStatus.LOADING, onSubmit: handleOnSubmit })))));
 };
 export { Feedback };

package/dist/src/infrastructure/ui/views/feedback/Feedback.style.d.ts

@@ -1,10 +1,11 @@
 declare const style: {
-    bodyColumn: {
-        paddingBottom: number;
+    container: {
+        justifyContent: "flex-start";
         paddingHorizontal: number;
+        paddingVertical: number;
     };
-    container: {
-        paddingBottom: number;
+    containerDesktop: {
+        paddingHorizontal: number;
     };
 };
 export { style };

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

@@ -1,13 +1,14 @@
 import { StyleSheet } from "react-native";
 import { theme } from "@lookiero/sty-psp-ui";
-const { space8, space10 } = theme();
+const { space3, space6, space8 } = theme();
 const style = StyleSheet.create({
-    bodyColumn: {
-        paddingBottom: space8,
-        paddingHorizontal: space8,
-    },
     container: {
-        paddingBottom: space10,
+        justifyContent: "flex-start",
+        paddingHorizontal: space6,
+        paddingVertical: space8,
+    },
+    containerDesktop: {
+        paddingHorizontal: space3,
     },
 });
 export { style };

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

@@ -1,5 +1,4 @@
 import React, { useCallback, useMemo } from "react";
-import { View } from "react-native";
 import { Button } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import { CheckoutQuestionType, } from "../../../../../../projection/checkoutQuestion/checkoutQuestion";
@@ -12,7 +11,6 @@ import { HostSelectCheckoutQuestionItem } from "../../../../components/organisms
 import { IconCheckoutQuestionItem } from "../../../../components/organisms/checkoutQuestions/components/iconCheckoutQuestionItem/IconCheckoutQuestionItem";
 import { TextareaCheckoutQuestionItem } from "../../../../components/organisms/checkoutQuestions/components/textareaCheckoutQuestionItem/TextareaCheckoutQuestionItem";
 import { I18nMessages } from "../../../../i18n/i18n";
-import { style } from "./CheckoutQuestionsForm.style";
 const checkoutQuestionItems = {
     [CheckoutQuestionType.HOST_DEFAULT]: HostDefaultCheckoutQuestionItem,
     [CheckoutQuestionType.HOST_TEXTAREA]: HostDefaultCheckoutQuestionItem,
@@ -33,7 +31,6 @@ const CheckoutQuestionsForm = ({ checkoutQuestions, submitButtonDisabled, onSubm
     return (React.createElement(React.Fragment, null,
         React.createElement(CheckoutQuestionItemProvider, { checkoutQuestionItems: checkoutQuestionItems },
             React.createElement(CheckoutQuestions, { checkoutQuestions: filteredCheckoutQuestions })),
-        React.createElement(View, { style: style.buttonContainer },
-            React.createElement(Button, { busy: submitButtonDisabled, testID: "checkout-feedback-button", onPress: handlePress }, buttonText))));
+        React.createElement(Button, { busy: submitButtonDisabled, testID: "checkout-feedback-button", onPress: handlePress }, buttonText)));
 };
 export { CheckoutQuestionsForm };

package/dist/src/infrastructure/ui/views/item/views/itemWithoutCustomerDecission/ItemWithoutCustomerDecission.style.js

@@ -3,7 +3,6 @@ import { theme } from "@lookiero/sty-psp-ui";
 const { space10 } = theme();
 const style = StyleSheet.create({
     container: {
-        // justifyContent: "flex-start",
         paddingBottom: space10,
         paddingHorizontal: 0,
     },

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

@@ -1,7 +1,7 @@
 import { FC } from "react";
-import { Layout as LocalLayout } from "@lookiero/sty-psp-ui";
+import { Layout as UiLayout } from "@lookiero/sty-psp-ui";
 interface ReturnProps {
-    readonly layout: LocalLayout;
+    readonly layout: UiLayout;
 }
 declare const Return: FC<ReturnProps>;
 export { Return };

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

@@ -38,7 +38,7 @@ const returnQuestionItems = {
     [ReturnQuestionType.TEXTAREA]: TextareaReturnQuestionItem,
     [ReturnQuestionType.OPTION]: RadioReturnQuestionItem,
 };
-const ReturnForm = ({ checkout, checkoutItem, country, segment, layout: LocalLayout }) => {
+const ReturnForm = ({ checkout, checkoutItem, country, segment, layout: UiLayout }) => {
     const { screen } = useDevice();
     const navigate = useNavigate();
     const logger = useLogger();
@@ -110,7 +110,7 @@ const ReturnForm = ({ checkout, checkoutItem, country, segment, layout: LocalLay
     }
     return (React.createElement(ReturnQuestionItemProvider, { returnQuestionItems: returnQuestionItems },
         React.createElement(PortalHost, { name: "return-question-form-portal" }),
-        React.createElement(LocalLayout, { header: header, scrollEnabled: false, style: {
+        React.createElement(UiLayout, { header: header, scrollEnabled: false, style: {
                 safeAreaView: style.safeAreaView,
                 scrollView: style.scrollView,
             } },
@@ -125,7 +125,7 @@ const ReturnForm = ({ checkout, checkoutItem, country, segment, layout: LocalLay
                         React.createElement(View, { style: style.submit },
                             React.createElement(Button, { testID: "return-questions-button", onPress: handleOnSubmit }, submitButtonText))))))));
 };
-const Return = ({ layout: LocalLayout }) => {
+const Return = ({ layout: UiLayout }) => {
     const { id } = useParams();
     const { customer: { customerId, country, segment }, } = useStaticInfo();
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
@@ -135,6 +135,6 @@ const Return = ({ layout: LocalLayout }) => {
         return React.createElement(Spinner, null);
     }
     return (React.createElement(ReturnQuestionFeedbackProvider, { key: checkoutItem.id, feedback: checkoutItem.feedbacks || {} },
-        React.createElement(ReturnForm, { checkout: checkout, checkoutItem: checkoutItem, country: country, layout: LocalLayout, segment: segment })));
+        React.createElement(ReturnForm, { checkout: checkout, checkoutItem: checkoutItem, country: country, layout: UiLayout, segment: segment })));
 };
 export { Return };

package/dist/src/infrastructure/ui/views/summary/Summary.d.ts

@@ -1,7 +1,7 @@
 import { FC, ReactNode } from "react";
-import { Layout as LocalLayout } from "@lookiero/sty-psp-ui";
+import { Layout as UiLayout } from "@lookiero/sty-psp-ui";
 interface SummaryProps {
-    readonly layout: LocalLayout;
+    readonly layout: UiLayout;
     readonly children: ReactNode;
 }
 declare const Summary: FC<SummaryProps>;

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

@@ -21,7 +21,7 @@ import { Routes } from "../../routing/routes";
 import { useBasePath } from "../../routing/useBasePath";
 import { style } from "./Summary.style";
 import { CollapsiblePricing } from "./components/collapsiblePricing/CollapsiblePricing";
-const Summary = ({ layout: LocalLayout, children }) => {
+const Summary = ({ layout: UiLayout, children }) => {
     const { customer: { customerId, country, segment }, } = useStaticInfo();
     const [pricingCollapsed, setPricingCollapsed] = useState(true);
     const [pricingHeight, setPricingHeight] = useState(0);
@@ -79,7 +79,7 @@ const Summary = ({ layout: LocalLayout, children }) => {
     if (!dependenciesLoaded) {
         return React.createElement(Spinner, null);
     }
-    return (React.createElement(LocalLayout, { scrollEnabled: false, style: {
+    return (React.createElement(UiLayout, { scrollEnabled: false, style: {
             header: style.header,
             scrollView: style.scrollView,
         } },

package/dist/src/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "6.5.0-beta.5";
+export declare const VERSION = "6.5.1-beta.0";

package/dist/src/version.js

@@ -1 +1 @@
-export const VERSION = "6.5.0-beta.5";
+export const VERSION = "6.5.1-beta.0";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "6.5.0-beta.5",
+  "version": "6.5.1-beta.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "sideEffects": "false",
@@ -21,12 +21,12 @@
     "@lookiero/sty-psp-i18n": "^0.1.7",
     "@lookiero/sty-psp-locale": "^0.2.1",
     "@lookiero/sty-psp-logging": "^0.2.2",
-    "@lookiero/sty-psp-notifications": "^0.5.8-beta.0",
+    "@lookiero/sty-psp-notifications": "^0.5.8",
     "@lookiero/sty-psp-react-native": "^0.2.0",
     "@lookiero/sty-psp-segment": "^0.1.1",
     "@lookiero/sty-psp-storage": "^0.1.3",
     "@lookiero/sty-psp-tracking": "^0.1.6",
-    "@lookiero/sty-psp-ui": "^0.5.5-beta.0",
+    "@lookiero/sty-psp-ui": "^0.5.5",
     "@lookiero/sty-psp-ui-settings": "^0.1.1",
     "@lookiero/sty-psp-units": "^0.1.1",
     "@lookiero/sty-psp-uuid": "^0.1.0",

package/src/infrastructure/ab-testing/kameleoonEnvironment.ts

@@ -1,12 +1,12 @@
-interface Experiment<T extends string> {
+interface Experiment {
   readonly id: string;
-  readonly variations: Record<T, string>;
+  readonly variations: Record<string, string>;
 }
 
 interface KameleoonEnvironment {
   readonly siteCode: string;
   readonly experiments: {
-    readonly newFeedback: Experiment<"v1">;
+    readonly newFeedback: Experiment;
   };
 }
 

package/src/infrastructure/ui/views/checkout/Checkout.style.ts

@@ -2,7 +2,7 @@ import { StyleSheet, Platform } from "react-native";
 import { theme } from "@lookiero/sty-psp-ui";
 import { HEADER_HEIGHT } from "../../components/templates/header/Header.style";
 
-const { borderRadius4, colorBgPrimaryLight, colorBgBase, space3, space4, space6, space12, space16 } = theme();
+const { borderRadius4, colorBgPrimaryLight, colorBgBase, space2, space3, space4, space6, space12, space16 } = theme();
 
 const style = StyleSheet.create({
   contentWrapper: {
@@ -35,6 +35,7 @@ const style = StyleSheet.create({
   },
   princingWrapperSmall: {
     backgroundColor: colorBgPrimaryLight,
+    paddingBottom: space2,
   },
   resume: {
     overflow: "hidden",

package/src/infrastructure/ui/views/checkout/Checkout.tsx

@@ -4,7 +4,7 @@ import { useNavigate } from "react-router-native";
 import { Box, Button, Layout, Spinner, Text, useDevice } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import { QueryStatus } from "@lookiero/messaging-react";
-import { Layout as LocalLayout, Sticky } from "@lookiero/sty-psp-ui";
+import { Layout as UiLayout, Sticky } from "@lookiero/sty-psp-ui";
 import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
 import { useViewPricingByCheckoutId } from "../../../projection/pricing/react/useViewPricingByCheckoutId";
@@ -26,11 +26,11 @@ import { PaymentInstrument } from "./components/paymentInstrument/PaymentInstrum
 
 interface CheckoutProps {
   readonly children?: ReactNode;
-  readonly layout: LocalLayout;
+  readonly layout: UiLayout;
   readonly useRedirect: () => Record<string, string>;
 }
 
-const Checkout: FC<CheckoutProps> = ({ children, layout: LocalLayout, useRedirect }) => {
+const Checkout: FC<CheckoutProps> = ({ children, layout: UiLayout, useRedirect }) => {
   const {
     customer: { customerId, country, segment },
   } = useStaticInfo();
@@ -99,7 +99,7 @@ const Checkout: FC<CheckoutProps> = ({ children, layout: LocalLayout, useRedirec
   }
 
   return (
-    <LocalLayout
+    <UiLayout
       header={<CheckoutHeader onBack={handleOnBack} />}
       scrollEnabled={false}
       style={{
@@ -172,7 +172,7 @@ const Checkout: FC<CheckoutProps> = ({ children, layout: LocalLayout, useRedirec
       ) : null}
 
       {children}
-    </LocalLayout>
+    </UiLayout>
   );
 };
 

package/src/infrastructure/ui/views/feedback/Feedback.style.ts

@@ -1,15 +1,16 @@
 import { StyleSheet } from "react-native";
 import { theme } from "@lookiero/sty-psp-ui";
 
-const { space8, space10 } = theme();
+const { space3, space6, space8 } = theme();
 
 const style = StyleSheet.create({
-  bodyColumn: {
-    paddingBottom: space8,
-    paddingHorizontal: space8,
-  },
   container: {
-    paddingBottom: space10,
+    justifyContent: "flex-start",
+    paddingHorizontal: space6,
+    paddingVertical: space8,
+  },
+  containerDesktop: {
+    paddingHorizontal: space3,
   },
 });
 

package/src/infrastructure/ui/views/feedback/Feedback.tsx

@@ -2,7 +2,7 @@ import React, { FC, useCallback, useEffect, useRef } from "react";
 import { Spinner } from "@lookiero/aurora";
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
 import { useLogger } from "@lookiero/sty-psp-logging";
-import { Layout } from "@lookiero/sty-psp-ui";
+import { Layout, useScreenSize } from "@lookiero/sty-psp-ui";
 import { CheckoutFeedbackProjection } from "../../../../projection/checkoutFeedback/checkoutFeedback";
 import { CheckoutQuestionType } from "../../../../projection/checkoutQuestion/checkoutQuestion";
 import { useGiveCheckoutFeedback } from "../../../domain/checkoutFeedback/react/useGiveCheckoutFeedback";
@@ -33,6 +33,8 @@ interface FeedbackProps {
 
 const Feedback: FC<FeedbackProps> = ({ layout: Layout }) => {
   const logger = useLogger();
+  const screenSize = useScreenSize();
+  const isDesktop = screenSize === "L";
   const {
     customer: { customerId, country, segment },
   } = useStaticInfo();
@@ -114,8 +116,8 @@ const Feedback: FC<FeedbackProps> = ({ layout: Layout }) => {
 
   return (
     <CheckoutQuestionFeedbackProvider feedback={{}} onChanged={handleOnChangedFeedback}>
-      <Layout style={{ scrollView: style.container }}>
-        <Body style={{ column: style.bodyColumn }}>
+      <Layout>
+        <Body style={{ row: [style.container, isDesktop && style.containerDesktop] }}>
           <CheckoutQuestionsForm
             checkoutQuestions={checkoutQuestions || []}
             submitButtonDisabled={giveCheckoutFeedbackStatus === CommandStatus.LOADING}

package/src/infrastructure/ui/views/feedback/components/checkoutQuestionsForm/CheckoutQuestionsForm.tsx

@@ -1,5 +1,4 @@
 import React, { FC, useCallback, useMemo } from "react";
-import { View } from "react-native";
 import { Button } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import { CheckoutFeedbackProjection } from "../../../../../../projection/checkoutFeedback/checkoutFeedback";
@@ -19,7 +18,6 @@ import { HostSelectCheckoutQuestionItem } from "../../../../components/organisms
 import { IconCheckoutQuestionItem } from "../../../../components/organisms/checkoutQuestions/components/iconCheckoutQuestionItem/IconCheckoutQuestionItem";
 import { TextareaCheckoutQuestionItem } from "../../../../components/organisms/checkoutQuestions/components/textareaCheckoutQuestionItem/TextareaCheckoutQuestionItem";
 import { I18nMessages } from "../../../../i18n/i18n";
-import { style } from "./CheckoutQuestionsForm.style";
 
 const checkoutQuestionItems: CheckoutQuestionItems = {
   [CheckoutQuestionType.HOST_DEFAULT]: HostDefaultCheckoutQuestionItem,
@@ -61,11 +59,9 @@ const CheckoutQuestionsForm: FC<CheckoutQuestionsFormProps> = ({
         <CheckoutQuestions checkoutQuestions={filteredCheckoutQuestions} />
       </CheckoutQuestionItemProvider>
 
-      <View style={style.buttonContainer}>
-        <Button busy={submitButtonDisabled} testID="checkout-feedback-button" onPress={handlePress}>
-          {buttonText}
-        </Button>
-      </View>
+      <Button busy={submitButtonDisabled} testID="checkout-feedback-button" onPress={handlePress}>
+        {buttonText}
+      </Button>
     </>
   );
 };

package/src/infrastructure/ui/views/item/views/itemWithoutCustomerDecission/ItemWithoutCustomerDecission.style.ts

@@ -5,7 +5,6 @@ const { space10 } = theme();
 
 const style = StyleSheet.create({
   container: {
-    // justifyContent: "flex-start",
     paddingBottom: space10,
     paddingHorizontal: 0,
   },

package/src/infrastructure/ui/views/return/Return.tsx

@@ -7,7 +7,7 @@ import { useI18nMessage } from "@lookiero/i18n-react";
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
 import { useLogger } from "@lookiero/sty-psp-logging";
 import { Segment } from "@lookiero/sty-psp-segment";
-import { Layout as LocalLayout } from "@lookiero/sty-psp-ui";
+import { Layout as UiLayout } from "@lookiero/sty-psp-ui";
 import { CheckoutProjection } from "../../../../projection/checkout/checkout";
 import { CheckoutItemProjection } from "../../../../projection/checkoutItem/checkoutItem";
 import { FeedbackProjection } from "../../../../projection/feedback/feedback";
@@ -56,11 +56,11 @@ interface ReturnFormProps {
   readonly checkoutItem: CheckoutItemProjection;
   readonly country: Country;
   readonly segment: Segment;
-  readonly layout: LocalLayout;
+  readonly layout: UiLayout;
   readonly checkout: CheckoutProjection;
 }
 
-const ReturnForm: FC<ReturnFormProps> = ({ checkout, checkoutItem, country, segment, layout: LocalLayout }) => {
+const ReturnForm: FC<ReturnFormProps> = ({ checkout, checkoutItem, country, segment, layout: UiLayout }) => {
   const { screen } = useDevice();
   const navigate = useNavigate();
   const logger = useLogger();
@@ -163,7 +163,7 @@ const ReturnForm: FC<ReturnFormProps> = ({ checkout, checkoutItem, country, segm
   return (
     <ReturnQuestionItemProvider returnQuestionItems={returnQuestionItems}>
       <PortalHost name="return-question-form-portal" />
-      <LocalLayout
+      <UiLayout
         header={header}
         scrollEnabled={false}
         style={{
@@ -195,16 +195,16 @@ const ReturnForm: FC<ReturnFormProps> = ({ checkout, checkoutItem, country, segm
             </Box>
           </Layout>
         </ScrollView>
-      </LocalLayout>
+      </UiLayout>
     </ReturnQuestionItemProvider>
   );
 };
 
 interface ReturnProps {
-  readonly layout: LocalLayout;
+  readonly layout: UiLayout;
 }
 
-const Return: FC<ReturnProps> = ({ layout: LocalLayout }) => {
+const Return: FC<ReturnProps> = ({ layout: UiLayout }) => {
   const { id } = useParams();
   const {
     customer: { customerId, country, segment },
@@ -223,7 +223,7 @@ const Return: FC<ReturnProps> = ({ layout: LocalLayout }) => {
         checkout={checkout}
         checkoutItem={checkoutItem}
         country={country}
-        layout={LocalLayout}
+        layout={UiLayout}
         segment={segment}
       />
     </ReturnQuestionFeedbackProvider>

package/src/infrastructure/ui/views/summary/Summary.tsx

@@ -4,7 +4,7 @@ import { generatePath, useMatch, useNavigate } from "react-router-native";
 import { Box, Text, Layout, useDevice, Spinner } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import { QueryStatus } from "@lookiero/messaging-react";
-import { Layout as LocalLayout, Sticky } from "@lookiero/sty-psp-ui";
+import { Layout as UiLayout, Sticky } from "@lookiero/sty-psp-ui";
 import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
 import { useViewFiveItemsDiscountByCustomerId } from "../../../projection/checkout/react/useViewFiveItemsDiscountByCustomerId";
@@ -23,11 +23,11 @@ import { style } from "./Summary.style";
 import { CollapsiblePricing } from "./components/collapsiblePricing/CollapsiblePricing";
 
 interface SummaryProps {
-  readonly layout: LocalLayout;
+  readonly layout: UiLayout;
   readonly children: ReactNode;
 }
 
-const Summary: FC<SummaryProps> = ({ layout: LocalLayout, children }) => {
+const Summary: FC<SummaryProps> = ({ layout: UiLayout, children }) => {
   const {
     customer: { customerId, country, segment },
   } = useStaticInfo();
@@ -110,7 +110,7 @@ const Summary: FC<SummaryProps> = ({ layout: LocalLayout, children }) => {
   }
 
   return (
-    <LocalLayout
+    <UiLayout
       scrollEnabled={false}
       style={{
         header: style.header,
@@ -170,7 +170,7 @@ const Summary: FC<SummaryProps> = ({ layout: LocalLayout, children }) => {
           </Body>
         </Sticky>
       ) : null}
-    </LocalLayout>
+    </UiLayout>
   );
 };
 

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

@@ -1,13 +0,0 @@
-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 };