@lookiero/checkout 8.14.0-beta.2 → 8.14.0

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/ReturnQuestionItem.d.ts

@@ -1,16 +1,12 @@
 import { FC, ReactNode } from "react";
-import { StyleProp, ViewStyle } from "react-native";
 import { ReturnQuestionProjection } from "../../../../../../projection/returnQuestion/returnQuestion";
-interface ReturnQuestionItemStyle {
-    readonly modal: StyleProp<ViewStyle>;
-}
-interface ReturnQuestionItemProps {
+import { ReturnQuestionType } from "../../../../../../projection/returnQuestion/returnQuestion.constants";
+interface ReturnQuestionItemProps<RQT extends ReturnQuestionType> {
     readonly returnQuestionParent: ReturnQuestionProjection;
-    readonly returnQuestion: ReturnQuestionProjection;
+    readonly returnQuestion: ReturnQuestionProjection<RQT>;
     readonly children?: ReactNode;
     readonly portalHostName?: string;
     readonly testID?: string;
-    readonly style?: Partial<ReturnQuestionItemStyle>;
 }
-type ReturnQuestionItem = FC<ReturnQuestionItemProps>;
+type ReturnQuestionItem<QT extends ReturnQuestionType> = FC<ReturnQuestionItemProps<QT>>;
 export type { ReturnQuestionItem, ReturnQuestionItemProps };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionFeedbackItem/HostDefaultReturnQuestionFeedbackItem.d.ts

@@ -1,3 +1,4 @@
+import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../ReturnQuestionItem";
-declare const HostDefaultReturnQuestionFeedbackItem: ReturnQuestionItem;
+declare const HostDefaultReturnQuestionFeedbackItem: ReturnQuestionItem<ReturnQuestionType.HOST_DEFAULT>;
 export { HostDefaultReturnQuestionFeedbackItem };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionFeedbackItem/HostDefaultReturnQuestionFeedbackItem.js

@@ -1,3 +1,4 @@
+/* eslint-disable react/prop-types */
 import React from "react";
 const HostDefaultReturnQuestionFeedbackItem = ({ children }) => (React.createElement(React.Fragment, null, children));
 export { HostDefaultReturnQuestionFeedbackItem };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem.d.ts

@@ -1,3 +1,4 @@
+import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../ReturnQuestionItem";
-declare const HostDefaultReturnQuestionItem: ReturnQuestionItem;
+declare const HostDefaultReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_DEFAULT>;
 export { HostDefaultReturnQuestionItem };

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

@@ -1,14 +1,16 @@
+/* eslint-disable react/prop-types */
 import React from "react";
 import { Text, View } from "@lookiero/aurora";
-import { useI18nMessage } from "@lookiero/i18n-react";
+import { useIntl } from "@lookiero/i18n-react";
+import { returnQuestionWithTranslationKey } from "../../../../../../../projection/returnQuestion/returnQuestion.typeguard";
 import { I18nMessages } from "../../../../../i18n/i18n";
 import { style } from "./HostDefaultReturnQuestionItem.style";
-const HostDefaultReturnQuestionItem = ({ returnQuestion, children }) => {
-    const titleText = useI18nMessage({ id: returnQuestion.name });
-    const isAllOptions = returnQuestion.name === I18nMessages.RETURN_QUESTION_MAIN_ALL_OPINION;
+const HostDefaultReturnQuestionItem = ({ returnQuestion, children, }) => {
+    const { formatMessage } = useIntl();
+    const isAllOptions = returnQuestion.translationKey === I18nMessages.RETURN_QUESTION_MAIN_ALL_OPINION;
     return (React.createElement(React.Fragment, null,
-        titleText && titleText !== " " && !isAllOptions ? (React.createElement(View, { style: style.title },
-            React.createElement(Text, { level: 3, action: true }, titleText))) : null,
+        returnQuestionWithTranslationKey(returnQuestion) && returnQuestion.translationKey !== " " && !isAllOptions ? (React.createElement(View, { style: style.title },
+            React.createElement(Text, { level: 3, action: true }, formatMessage({ id: returnQuestion.translationKey })))) : null,
         children));
 };
 export { HostDefaultReturnQuestionItem };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostRadioGroupReturnQuestionItem/HostRadioGroupReturnQuestionItem.d.ts

@@ -1,4 +1,5 @@
+import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../ReturnQuestionItem";
 import { style } from "./HostRadioGroupReturnQuestionItem.style";
-declare const HostRadioGroupReturnQuestionItem: ReturnQuestionItem;
+declare const HostRadioGroupReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_SELECT>;
 export { HostRadioGroupReturnQuestionItem, style };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostRadioGroupReturnQuestionItem/HostRadioGroupReturnQuestionItem.js

@@ -1,3 +1,4 @@
+/* eslint-disable react/prop-types */
 import React, { useMemo } from "react";
 import { View } from "react-native";
 import { Text } from "@lookiero/aurora";
@@ -5,7 +6,7 @@ import { useIntl } from "@lookiero/i18n-react";
 import { style } from "./HostRadioGroupReturnQuestionItem.style";
 const HostRadioGroupReturnQuestionItem = ({ returnQuestion, children, testID, }) => {
     const { formatMessage } = useIntl();
-    const placeholderText = useMemo(() => (returnQuestion.placeholder ? formatMessage({ id: returnQuestion.placeholder }) : ""), [formatMessage, returnQuestion.placeholder]);
+    const placeholderText = useMemo(() => (returnQuestion.metadata.placeholder ? formatMessage({ id: returnQuestion.metadata.placeholder }) : ""), [formatMessage, returnQuestion.metadata.placeholder]);
     return (React.createElement(React.Fragment, null,
         React.createElement(View, { style: style.wrapper, testID: testID },
             React.createElement(Text, { level: 3, style: style.title, action: true }, placeholderText),

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem.d.ts

@@ -1,3 +1,4 @@
+import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../ReturnQuestionItem";
-declare const HostSelectReturnQuestionItem: ReturnQuestionItem;
+declare const HostSelectReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_SELECT>;
 export { HostSelectReturnQuestionItem };

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

@@ -1,3 +1,4 @@
+/* eslint-disable react/prop-types */
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { TouchableHighlight, View } from "react-native";
 import { ButtonIcon } from "@lookiero/aurora";
@@ -7,9 +8,9 @@ import { InputField } from "../../../../../../../shared/ui/components/molecules/
 import { useReturnQuestionFeedback, useReturnQuestionFeedbackForReturnQuestion, } from "../../behaviors/useReturnQuestionFeedback";
 import { deepestReturnQuestionWithFeedbackForReturnQuestion, feedbackForReturnQuestion, } from "../../util/returnQuestionFeedback";
 import { style, containerUnderlayColor } from "./HostSelectReturnQuestionItem.style";
-const HostSelectReturnQuestionItem = ({ returnQuestion, children, portalHostName, testID, style: customStyle, }) => {
+const HostSelectReturnQuestionItem = ({ returnQuestion, children, portalHostName, testID, }) => {
     const { formatMessage } = useIntl();
-    const placeholderText = useMemo(() => (returnQuestion.placeholder ? formatMessage({ id: returnQuestion.placeholder }) : ""), [formatMessage, returnQuestion.placeholder]);
+    const placeholderText = useMemo(() => (returnQuestion.metadata.placeholder ? formatMessage({ id: returnQuestion.metadata.placeholder }) : ""), [formatMessage, returnQuestion.metadata.placeholder]);
     const [modalVisible, setModalVisible] = useState(false);
     const handleOnPress = useCallback(() => setModalVisible(true), []);
     const handleOnModalClose = useCallback(() => setModalVisible(false), []);
@@ -35,6 +36,6 @@ const HostSelectReturnQuestionItem = ({ returnQuestion, children, portalHostName
             React.createElement(View, { pointerEvents: "none" },
                 React.createElement(InputField, { editable: false, icon: "arrow_down", label: placeholderText, value: inputValue }))),
         React.createElement(Modal, { portalHostName: portalHostName, style: deepestReturnQuestionWithFeedback && { header: style.header }, visible: modalVisible, header: deepestReturnQuestionWithFeedback && (React.createElement(ButtonIcon, { name: "arrow_left", style: style.backButton, testID: "modal-back-button", onPress: handleOnBackButtonPress })), scroll: true, showCloseButton: true, onClose: handleOnModalClose },
-            React.createElement(View, { style: [style.modal, customStyle?.modal] }, children))));
+            React.createElement(View, { style: style.modalContent }, children))));
 };
 export { HostSelectReturnQuestionItem };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem.style.d.ts

@@ -9,7 +9,7 @@ declare const style: {
     header: {
         justifyContent: "space-between";
     };
-    modal: {
+    modalContent: {
         paddingBottom: number;
         paddingHorizontal: number;
     };

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

@@ -12,7 +12,7 @@ const style = StyleSheet.create({
     header: {
         justifyContent: "space-between",
     },
-    modal: {
+    modalContent: {
         paddingBottom: space6,
         paddingHorizontal: space6,
     },

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostStackReturnQuestionItem/form/HostStackReturnQuestionItem.d.ts

@@ -1,3 +1,4 @@
+import { ReturnQuestionType } from "../../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../../ReturnQuestionItem";
-declare const HostStackReturnQuestionItem: ReturnQuestionItem;
+declare const HostStackReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_STACK>;
 export { HostStackReturnQuestionItem };

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

@@ -1,4 +1,5 @@
+/* eslint-disable react/prop-types */
 import React from "react";
 import ReturnQuestion from "../../../ReturnQuestion";
-const HostStackReturnQuestionItem = ({ returnQuestion, portalHostName, style: customStyle, }) => (React.createElement(React.Fragment, null, returnQuestion.children?.map((childReturnQuestion) => (React.createElement(ReturnQuestion, { key: childReturnQuestion.id, portalHostName: portalHostName, returnQuestion: childReturnQuestion, returnQuestionParent: returnQuestion, style: customStyle })))));
+const HostStackReturnQuestionItem = ({ returnQuestion, portalHostName, }) => (React.createElement(React.Fragment, null, returnQuestion.children?.map((childReturnQuestion) => (React.createElement(ReturnQuestion, { key: childReturnQuestion.id, portalHostName: portalHostName, returnQuestion: childReturnQuestion, returnQuestionParent: returnQuestion })))));
 export { HostStackReturnQuestionItem };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostStackReturnQuestionItem/modal/HostStackReturnQuestionItem.d.ts

@@ -1,3 +1,4 @@
+import { ReturnQuestionType } from "../../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../../ReturnQuestionItem";
-declare const HostStackReturnQuestionItem: ReturnQuestionItem;
+declare const HostStackReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_STACK>;
 export { HostStackReturnQuestionItem };

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

@@ -1,27 +1,29 @@
+/* eslint-disable react/prop-types */
 import { animated, useSpring } from "@react-spring/native";
 import React, { useCallback, useMemo, useState } from "react";
 import { View } from "react-native";
 import { COLOR, Text } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
+import { returnQuestionHasChildren } from "../../../../../../../../projection/returnQuestion/returnQuestion.typeguard";
 import ReturnQuestion from "../../../ReturnQuestion";
 import { useReturnQuestionFeedbackForReturnQuestion } from "../../../behaviors/useReturnQuestionFeedback";
 import { style } from "./HostStackReturnQuestionItem.style";
-const HostStackReturnQuestionItem = ({ returnQuestion, children, portalHostName, style: customStyle, }) => {
+const HostStackReturnQuestionItem = ({ returnQuestion, children, portalHostName, }) => {
     const { formatMessage } = useIntl();
     const { feedback } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion });
     const feedbackReturnQuestion = feedback
         ? returnQuestion.children?.find((returnQuestion) => returnQuestion.id === feedback)
         : undefined;
-    const titleText = useMemo(() => (returnQuestion.name ? formatMessage({ id: returnQuestion.name }) : undefined), [formatMessage, returnQuestion.name]);
-    const feedbackText = useMemo(() => (feedbackReturnQuestion ? formatMessage({ id: feedbackReturnQuestion.name }) : undefined), [feedbackReturnQuestion, formatMessage]);
+    const titleText = useMemo(() => (returnQuestion.translationKey ? formatMessage({ id: returnQuestion.translationKey }) : undefined), [formatMessage, returnQuestion.translationKey]);
+    const feedbackText = useMemo(() => (feedbackReturnQuestion ? formatMessage({ id: feedbackReturnQuestion.translationKey }) : undefined), [feedbackReturnQuestion, formatMessage]);
     const [stackHeight, setStackHeight] = useState();
     const handleOnLayout = useCallback(({ nativeEvent: { layout: { height }, }, }) => setStackHeight(height), []);
     const stackSyle = useSpring({ height: stackHeight });
     return (React.createElement(animated.View, { style: stackSyle },
         React.createElement(View, { onLayout: handleOnLayout },
             titleText && (React.createElement(Text, { level: 3, style: style.title, heading: true }, titleText)),
-            feedbackReturnQuestion ? (React.createElement(React.Fragment, null,
+            feedbackReturnQuestion && returnQuestionHasChildren(feedbackReturnQuestion) ? (React.createElement(React.Fragment, null,
                 React.createElement(Text, { color: COLOR.TEXT_MEDIUM, level: 3 }, feedbackText),
-                feedbackReturnQuestion.children?.map((childReturnQuestion) => (React.createElement(ReturnQuestion, { key: childReturnQuestion.id, portalHostName: portalHostName, returnQuestion: childReturnQuestion, returnQuestionParent: feedbackReturnQuestion, style: customStyle }))))) : (children))));
+                feedbackReturnQuestion.children?.map((childReturnQuestion) => (React.createElement(ReturnQuestion, { key: childReturnQuestion.id, portalHostName: portalHostName, returnQuestion: childReturnQuestion, returnQuestionParent: feedbackReturnQuestion }))))) : (children))));
 };
 export { HostStackReturnQuestionItem };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/modalOptionReturnQuestionItems/ModalOptionReturnQuestionItems.d.ts

@@ -1,13 +1,11 @@
 import React from "react";
-import { StyleProp, ViewStyle } from "react-native";
 import { ReturnQuestionProjection } from "../../../../../../../projection/returnQuestion/returnQuestion";
 interface ModalOptionReturnQuestionItemsProps {
     readonly portalHostName?: string;
     readonly returnQuestion: ReturnQuestionProjection;
     readonly returnQuestionParent: ReturnQuestionProjection;
     readonly visible: boolean;
-    readonly style?: StyleProp<ViewStyle>;
     readonly onClose: () => void;
 }
-declare const ModalOptionReturnQuestionItems: ({ portalHostName, returnQuestion, visible, style: customStyle, onClose, }: ModalOptionReturnQuestionItemsProps) => React.JSX.Element;
+declare const ModalOptionReturnQuestionItems: ({ portalHostName, returnQuestion, visible, onClose, }: ModalOptionReturnQuestionItemsProps) => React.JSX.Element;
 export { ModalOptionReturnQuestionItems };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/modalOptionReturnQuestionItems/ModalOptionReturnQuestionItems.js

@@ -3,14 +3,16 @@ import { View } from "react-native";
 import { COLOR, Text } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
 import { Modal } from "@lookiero/sty-psp-ui";
+import { returnQuestionHasChildren } from "../../../../../../../projection/returnQuestion/returnQuestion.typeguard";
 import ReturnQuestion from "../../ReturnQuestion";
 import { style } from "./ModalOptionReturnQuestionItems.style";
-const ModalOptionReturnQuestionItems = ({ portalHostName, returnQuestion, visible, style: customStyle, onClose, }) => {
+const ModalOptionReturnQuestionItems = ({ portalHostName, returnQuestion, visible, onClose, }) => {
     const { formatMessage } = useIntl();
-    const title = formatMessage({ id: returnQuestion.name });
+    const title = formatMessage({ id: returnQuestion.translationKey });
     return (React.createElement(Modal, { portalHostName: portalHostName, visible: visible, scroll: true, showCloseButton: true, onClose: onClose },
-        React.createElement(View, { style: [style.modalContent, customStyle] },
+        React.createElement(View, { style: style.modalContent },
             React.createElement(Text, { color: COLOR.TEXT_MEDIUM, level: 2, style: style.optionText }, title),
-            React.createElement(React.Fragment, null, returnQuestion.children?.map((childReturnQuestion) => (React.createElement(ReturnQuestion, { key: childReturnQuestion.id, portalHostName: "", returnQuestion: childReturnQuestion, returnQuestionParent: returnQuestion, style: { modal: customStyle } })))))));
+            React.createElement(React.Fragment, null, returnQuestionHasChildren(returnQuestion) &&
+                returnQuestion.children?.map((childReturnQuestion) => (React.createElement(ReturnQuestion, { key: childReturnQuestion.id, portalHostName: "", returnQuestion: childReturnQuestion, returnQuestionParent: returnQuestion })))))));
 };
 export { ModalOptionReturnQuestionItems };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/optionReturnQuestionItem/OptionReturnQuestionItem.d.ts

@@ -1,3 +1,4 @@
+import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../ReturnQuestionItem";
-declare const OptionReturnQuestionItem: ReturnQuestionItem;
+declare const OptionReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.OPTION>;
 export { OptionReturnQuestionItem };

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

@@ -1,3 +1,4 @@
+/* eslint-disable react/prop-types */
 import React, { useCallback } from "react";
 import { TouchableHighlight } from "react-native";
 import { Text } from "@lookiero/aurora";
@@ -6,7 +7,7 @@ import { useReturnQuestionFeedbackForReturnQuestion } from "../../behaviors/useR
 import { containerUnderlayColor, style } from "./OptionReturnQuestionItem.style";
 const OptionReturnQuestionItem = ({ returnQuestion, returnQuestionParent, testID, }) => {
     const { onChange } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion: returnQuestionParent });
-    const optionText = useI18nMessage({ id: returnQuestion.name });
+    const optionText = useI18nMessage({ id: returnQuestion.translationKey });
     const handleOnPress = useCallback(() => onChange({ returnQuestionId: returnQuestionParent.id, returnQuestionFeedback: returnQuestion.id }), [onChange, returnQuestion.id, returnQuestionParent.id]);
     return (React.createElement(TouchableHighlight, { accessibilityLabel: testID, style: style.container, testID: testID, underlayColor: containerUnderlayColor, onPress: handleOnPress },
         React.createElement(Text, { level: 3, style: style.text }, optionText)));

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/radioReturnQuestionItem/RadioReturnQuestionItem.d.ts

@@ -1,3 +1,4 @@
+import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../ReturnQuestionItem";
-declare const RadioReturnQuestionItem: ReturnQuestionItem;
+declare const RadioReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.OPTION>;
 export { RadioReturnQuestionItem };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/radioReturnQuestionItem/RadioReturnQuestionItem.js

@@ -1,18 +1,19 @@
+/* eslint-disable react/prop-types */
 import React, { useCallback, useEffect, useState } from "react";
-import { View, Option, OPTION_VARIANT } from "@lookiero/aurora";
+import { View, Option, OPTION_VARIANT, SIZE } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
 import { useReturnQuestionFeedback, useReturnQuestionFeedbackForReturnQuestion, } from "../../behaviors/useReturnQuestionFeedback";
 import { deepestReturnQuestionWithFeedbackForReturnQuestion, feedbackForReturnQuestion, } from "../../util/returnQuestionFeedback";
 import { ModalOptionReturnQuestionItems } from "../modalOptionReturnQuestionItems/ModalOptionReturnQuestionItems";
 import { style } from "./RadioReturnQuestionItem.style";
-const RadioReturnQuestionItem = ({ returnQuestion, returnQuestionParent, testID, portalHostName, style: customStyle, }) => {
+const RadioReturnQuestionItem = ({ returnQuestion, returnQuestionParent, testID, portalHostName, }) => {
     const intl = useIntl();
     const [modalVisible, setModalVisible] = useState(false);
     const { feedback: feedbackId, onChange, clear, } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion: returnQuestionParent });
     const feedback = useReturnQuestionFeedback();
     const translate = useCallback((returnQuestionName) => intl.formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [intl]);
     const inputValue = feedbackForReturnQuestion({ feedback, returnQuestion, translate }).join(" / ");
-    const optionText = intl.formatMessage({ id: returnQuestion.name });
+    const optionText = intl.formatMessage({ id: returnQuestion.translationKey });
     const hasChildren = Boolean(returnQuestion.children && returnQuestion.children.length > 0);
     const handleOnModalClose = useCallback(() => {
         // Uncomment if we want to clear current selection (and update callback's dependencies)
@@ -43,7 +44,7 @@ const RadioReturnQuestionItem = ({ returnQuestion, returnQuestionParent, testID,
      */
     return (React.createElement(React.Fragment, null,
         React.createElement(View, { style: style.wrapper, testID: testID },
-            React.createElement(Option, { checked: returnQuestion.id === feedbackId, name: returnQuestion.id, title: inputValue ? `${optionText} / ${inputValue}` : `${optionText}`, value: returnQuestion.id, variant: OPTION_VARIANT.BUTTON, onChange: handleOnPress })),
-        hasChildren ? (React.createElement(ModalOptionReturnQuestionItems, { portalHostName: portalHostName, returnQuestion: returnQuestion, returnQuestionParent: returnQuestion, style: customStyle?.modal, visible: modalVisible, onClose: handleOnModalClose })) : null));
+            React.createElement(Option, { checked: returnQuestion.id === feedbackId, flex: SIZE.XS, name: returnQuestion.id, title: inputValue ? `${optionText} / ${inputValue}` : `${optionText}`, value: returnQuestion.id, variant: OPTION_VARIANT.BUTTON, onChange: handleOnPress })),
+        hasChildren ? (React.createElement(ModalOptionReturnQuestionItems, { portalHostName: portalHostName, returnQuestion: returnQuestion, returnQuestionParent: returnQuestion, visible: modalVisible, onClose: handleOnModalClose })) : null));
 };
 export { RadioReturnQuestionItem };

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/returnQuestionFeedbackItem/ReturnQuestionFeedbackItem.d.ts

@@ -1,3 +1,4 @@
+import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../ReturnQuestionItem";
-declare const ReturnQuestionFeedbackItem: ReturnQuestionItem;
+declare const ReturnQuestionFeedbackItem: ReturnQuestionItem<ReturnQuestionType.HOST_DEFAULT>;
 export { ReturnQuestionFeedbackItem };

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

@@ -1,3 +1,4 @@
+/* eslint-disable react/prop-types */
 import React, { useCallback } from "react";
 import { View } from "react-native";
 import { Text } from "@lookiero/aurora";
@@ -7,7 +8,7 @@ import { useReturnQuestionFeedback } from "../../behaviors/useReturnQuestionFeed
 import { feedbackForReturnQuestion } from "../../util/returnQuestionFeedback";
 import { style } from "./ReturnQuestionFeedbackItem.style";
 const ReturnQuestionFeedbackItem = ({ returnQuestion }) => {
-    const titleText = useI18nMessage({ id: returnQuestion.name });
+    const titleText = useI18nMessage({ id: returnQuestion.translationKey });
     const unansweredText = useI18nMessage({ id: I18nMessages.FEEDBACK_UNANSWERED });
     const returnQuestionFeedback = useReturnQuestionFeedback();
     const intl = useIntl();

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem.d.ts

@@ -1,3 +1,4 @@
+import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { ReturnQuestionItem } from "../ReturnQuestionItem";
-declare const TextareaReturnQuestionItem: ReturnQuestionItem;
+declare const TextareaReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.TEXTAREA>;
 export { TextareaReturnQuestionItem };

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

@@ -1,3 +1,4 @@
+/* eslint-disable react/prop-types */
 import React, { useCallback, useMemo } from "react";
 import { View } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
@@ -6,7 +7,7 @@ import { useReturnQuestionFeedbackForReturnQuestion } from "../../behaviors/useR
 import { style } from "./TextareaReturnQuestionItem.style";
 const TextareaReturnQuestionItem = ({ returnQuestion, returnQuestionParent, testID, }) => {
     const { formatMessage } = useIntl();
-    const placeholderText = useMemo(() => (returnQuestion.placeholder ? formatMessage({ id: returnQuestion.placeholder }) : ""), [formatMessage, returnQuestion.placeholder]);
+    const placeholderText = useMemo(() => (returnQuestion.metadata.placeholder ? formatMessage({ id: returnQuestion.metadata.placeholder }) : ""), [formatMessage, returnQuestion.metadata.placeholder]);
     const { feedback, onChange } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion: returnQuestionParent });
     const handleOnChange = useCallback((value) => onChange({ returnQuestionId: returnQuestionParent.id, returnQuestionFeedback: value }), [onChange, returnQuestionParent.id]);
     return (React.createElement(View, { style: style.wrapper },

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/util/returnQuestionFeedback.js

@@ -1,3 +1,4 @@
+import { returnQuestionHasChildren, returnQuestionWithTranslationKey, } from "../../../../../../projection/returnQuestion/returnQuestion.typeguard";
 const REGEX = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
 const isUuid = (value) => {
     return typeof value === "string" && REGEX.test(value);
@@ -7,11 +8,14 @@ const feedbackForReturnQuestion = ({ feedback, returnQuestion, translate, acc =
     if (returnQuestionId) {
         const returnQuestionFeedback = feedback[returnQuestionId];
         if (isUuid(returnQuestionFeedback)) {
-            const feebackReturnQuestionChild = returnQuestion.children?.find((childReturnQuestion) => childReturnQuestion.id === returnQuestionFeedback);
+            const feebackReturnQuestionChild = returnQuestionHasChildren(returnQuestion) &&
+                returnQuestion.children?.find((childReturnQuestion) => childReturnQuestion.id === returnQuestionFeedback);
             if (feebackReturnQuestionChild) {
                 return [
                     ...acc,
-                    translate(feebackReturnQuestionChild?.name),
+                    ...(returnQuestionWithTranslationKey(feebackReturnQuestionChild)
+                        ? [translate(feebackReturnQuestionChild.translationKey)]
+                        : []),
                     ...feedbackForReturnQuestion({ feedback, returnQuestion: feebackReturnQuestionChild, translate, acc }),
                 ];
             }
@@ -19,17 +23,20 @@ const feedbackForReturnQuestion = ({ feedback, returnQuestion, translate, acc =
         }
         return [...acc, returnQuestionFeedback];
     }
-    return (returnQuestion.children?.reduce((acc, childReturnQuestion) => [
-        ...acc,
-        ...feedbackForReturnQuestion({ feedback, returnQuestion: childReturnQuestion, translate, acc }),
-    ], []) || []);
+    return ((returnQuestionHasChildren(returnQuestion) &&
+        returnQuestion.children?.reduce((acc, childReturnQuestion) => [
+            ...acc,
+            ...feedbackForReturnQuestion({ feedback, returnQuestion: childReturnQuestion, translate, acc }),
+        ], [])) ||
+        []);
 };
 const deepestReturnQuestionWithFeedbackForReturnQuestion = ({ feedback, returnQuestion, deepestReturnQuestion, }) => {
     const returnQuestionId = Object.keys(feedback).find((id) => id === returnQuestion.id);
     if (returnQuestionId) {
         const returnQuestionFeedback = feedback[returnQuestionId];
         if (isUuid(returnQuestionFeedback)) {
-            const feebackReturnQuestionChild = returnQuestion.children?.find((childReturnQuestion) => childReturnQuestion.id === returnQuestionFeedback);
+            const feebackReturnQuestionChild = returnQuestionHasChildren(returnQuestion) &&
+                returnQuestion.children?.find((childReturnQuestion) => childReturnQuestion.id === returnQuestionFeedback);
             if (feebackReturnQuestionChild) {
                 return deepestReturnQuestionWithFeedbackForReturnQuestion({
                     feedback,
@@ -41,7 +48,8 @@ const deepestReturnQuestionWithFeedbackForReturnQuestion = ({ feedback, returnQu
         }
         return [returnQuestion, false];
     }
-    const feebackReturnQuestionChild = returnQuestion.children?.find((childReturnQuestion) => Object.keys(feedback).find((id) => id === childReturnQuestion.id));
+    const feebackReturnQuestionChild = returnQuestionHasChildren(returnQuestion) &&
+        returnQuestion.children?.find((childReturnQuestion) => Object.keys(feedback).find((id) => id === childReturnQuestion.id));
     if (feebackReturnQuestionChild) {
         return deepestReturnQuestionWithFeedbackForReturnQuestion({
             feedback,
@@ -49,6 +57,7 @@ const deepestReturnQuestionWithFeedbackForReturnQuestion = ({ feedback, returnQu
             deepestReturnQuestion: feebackReturnQuestionChild,
         });
     }
-    return [deepestReturnQuestion, !returnQuestion.children || returnQuestion.children.length === 0];
+    const hasChildren = Boolean(returnQuestionHasChildren(returnQuestion) && returnQuestion.children && returnQuestion.children.length > 0);
+    return [deepestReturnQuestion, !hasChildren];
 };
 export { feedbackForReturnQuestion, deepestReturnQuestionWithFeedbackForReturnQuestion };

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

@@ -1,5 +1,4 @@
 import React from "react";
-import { StyleProp, ViewStyle } from "react-native";
 import { useRoutes as reactRouterUseRoutes } from "react-router-native";
 import { I18n } from "@lookiero/i18n-react";
 import { Locale } from "@lookiero/sty-psp-locale";
@@ -8,10 +7,6 @@ import { Customer } from "../../../projection/customer/customer";
 import { Order } from "../../../projection/order/order";
 import { Subscription } from "../../../projection/subscription/subscription";
 import { KameleoonEnvironment } from "../../ab-testing/kameleoonEnvironment";
-import { AppStyle } from "../views/App";
-interface RoutingStyle extends AppStyle {
-    readonly modal: StyleProp<ViewStyle>;
-}
 interface RoutingProps {
     readonly basePath?: string;
     readonly customer: Customer;
@@ -21,7 +16,6 @@ interface RoutingProps {
     readonly I18n: I18n;
     readonly kameleoon: KameleoonEnvironment;
     readonly layout: Layout;
-    readonly style?: Partial<RoutingStyle>;
     readonly getAuthToken: () => Promise<string>;
     readonly onNotAccessible: () => void;
     readonly onCheckoutSubmitted?: () => void;
@@ -37,4 +31,3 @@ interface RoutingProps {
  */
 declare const MemoizedRouting: React.NamedExoticComponent<RoutingProps>;
 export { MemoizedRouting as Routing };
-export type { RoutingStyle };

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

@@ -14,7 +14,7 @@ import { SummaryTabs } from "../views/summaryTabs/SummaryTabs";
 import { CheckoutMiddleware } from "./CheckoutMiddleware";
 import { Routes } from "./routes";
 import { BasePathProvider } from "./useBasePath";
-const Routing = ({ basePath = "", customer, order, subscription, locale, I18n, kameleoon, layout, style: customStyle, getAuthToken, onI18nError, onNotAccessible, onCheckoutSubmitted, useRedirect, useRoutes = reactRouterUseRoutes, }) => {
+const Routing = ({ basePath = "", customer, order, subscription, locale, I18n, kameleoon, layout, getAuthToken, onI18nError, onNotAccessible, onCheckoutSubmitted, useRedirect, useRoutes = reactRouterUseRoutes, }) => {
     return useRoutes([
         {
             path: "",
@@ -23,18 +23,18 @@ const Routing = ({ basePath = "", customer, order, subscription, locale, I18n, k
                     React.createElement(I18n, { loader: React.createElement(Spinner, null), locale: locale, onError: onI18nError },
                         React.createElement(Kameleoon, { loader: React.createElement(Spinner, null), siteCode: kameleoon.siteCode },
                             React.createElement(CheckoutMiddleware, { customerId: customer?.customerId, onNotAccessible: onNotAccessible },
-                                React.createElement(App, { style: { container: customStyle?.container, notifications: customStyle?.notifications } },
+                                React.createElement(App, null,
                                     React.createElement(Outlet, null)))))))),
             children: [
                 {
                     path: Routes.ITEM,
                     element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
-                        React.createElement(Item, { layout: layout, style: { modal: customStyle?.modal } }))),
+                        React.createElement(Item, { layout: layout }))),
                 },
                 {
                     path: Routes.ITEM_DETAIL,
                     element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
-                        React.createElement(Item, { layout: layout, style: { modal: customStyle?.modal } }))),
+                        React.createElement(Item, { layout: layout }))),
                 },
                 {
                     path: Routes.SUMMARY,
@@ -69,7 +69,7 @@ const Routing = ({ basePath = "", customer, order, subscription, locale, I18n, k
                 {
                     path: Routes.RETURN,
                     element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
-                        React.createElement(Return, { layout: layout, style: { modal: customStyle?.modal } }))),
+                        React.createElement(Return, { layout: layout }))),
                 },
                 {
                     path: "*",

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

@@ -1,14 +1,6 @@
 import { FC } from "react";
-import { StyleProp, ViewStyle } from "react-native";
-import { NotificationsStyle } from "@lookiero/sty-psp-notifications";
-interface AppStyle {
-    readonly container: StyleProp<ViewStyle>;
-    readonly notifications: Partial<NotificationsStyle>;
-}
 interface AppProps {
     readonly children: JSX.Element;
-    readonly style?: Partial<AppStyle>;
 }
 declare const App: FC<AppProps>;
-export type { AppStyle };
 export { App };

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

@@ -1,17 +1,15 @@
 import { PortalProvider } from "@gorhom/portal";
 import React from "react";
-import { StatusBar, View } from "react-native";
+import { StatusBar } from "react-native";
 import { SafeAreaProvider } from "react-native-safe-area-context";
 import { PortalProvider as AuroraPortalProvider } from "@lookiero/aurora";
 import { Notifications } from "@lookiero/sty-psp-notifications";
 import { theme } from "@lookiero/sty-psp-ui";
 import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
-import { style } from "./App.style";
 const { colorBgBase } = theme();
-const App = ({ children, style: customStyle }) => (React.createElement(View, { style: [style.container, customStyle?.container] },
-    React.createElement(SafeAreaProvider, null,
-        React.createElement(PortalProvider, null,
-            React.createElement(StatusBar, { backgroundColor: colorBgBase, barStyle: "dark-content", translucent: true }),
-            React.createElement(Notifications, { contextId: MESSAGING_CONTEXT_ID, style: customStyle?.notifications }),
-            React.createElement(AuroraPortalProvider, null, children)))));
+const App = ({ children }) => (React.createElement(SafeAreaProvider, null,
+    React.createElement(PortalProvider, null,
+        React.createElement(StatusBar, { backgroundColor: colorBgBase, barStyle: "dark-content", translucent: true }),
+        React.createElement(Notifications, { contextId: MESSAGING_CONTEXT_ID }),
+        React.createElement(AuroraPortalProvider, null, children))));
 export { App };

package/dist/src/infrastructure/ui/views/item/Item.d.ts

@@ -1,12 +1,7 @@
 import { FC } from "react";
-import { StyleProp, ViewStyle } from "react-native";
 import { Layout } from "@lookiero/sty-psp-ui";
-interface ItemStyle {
-    readonly modal: StyleProp<ViewStyle>;
-}
 interface ItemProps {
     readonly layout: Layout;
-    readonly style?: Partial<ItemStyle>;
 }
 declare const Item: FC<ItemProps>;
 export { Item };

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

@@ -26,7 +26,7 @@ import { useBasePath } from "../../routing/useBasePath";
 import { style } from "./Item.style";
 import { ItemWithCustomerDecission, } from "./views/itemWithCustomerDecission/ItemWithCustomerDecission";
 import { ItemWithoutCustomerDecission, } from "./views/itemWithoutCustomerDecission/ItemWithoutCustomerDecission";
-const Item = ({ layout: Layout, style: customStyle }) => {
+const Item = ({ layout: Layout }) => {
     const logger = useLogger();
     const screenSize = useScreenSize();
     const navigate = useNavigate();
@@ -141,10 +141,10 @@ const Item = ({ layout: Layout, style: customStyle }) => {
         return React.createElement(Spinner, { testID: "spinner" });
     }
     return (React.createElement(ReturnQuestionFeedbackProvider, { key: checkoutItem.id, feedback: checkoutItem.feedbacks || {} },
-        React.createElement(Layout, { header: header, scrollEnabled: !itemWithoutCustomerDecission, style: {
+        React.createElement(Layout, { footer: null, header: header, scrollEnabled: !itemWithoutCustomerDecission, style: {
                 header: fiveItemsDiscount !== 0 ? style.headerWithDoubleHeight : style.header,
                 scrollView: { height: itemWithoutCustomerDecission ? "100%" : "auto" },
                 safeAreaView: isDesktopScreen ? style.safeAreaView : null,
-            } }, itemWithoutCustomerDecission ? (React.createElement(ItemWithoutCustomerDecission, { bookedProductsVariants: bookedProductsVariants, checkoutId: checkout.id, checkoutItem: checkoutItem, currentProductVariant: currentProductVariant, style: customStyle, onReturn: goToReturnPage })) : (React.createElement(ItemWithCustomerDecission, { checkoutId: checkout.id, checkoutItem: checkoutItem, currentProductVariant: currentProductVariant, returnQuestions: returnQuestions, onEditFeedback: goToReturnPage })))));
+            } }, itemWithoutCustomerDecission ? (React.createElement(ItemWithoutCustomerDecission, { bookedProductsVariants: bookedProductsVariants, checkoutId: checkout.id, checkoutItem: checkoutItem, currentProductVariant: currentProductVariant, onReturn: goToReturnPage })) : (React.createElement(ItemWithCustomerDecission, { checkoutId: checkout.id, checkoutItem: checkoutItem, currentProductVariant: currentProductVariant, returnQuestions: returnQuestions, onEditFeedback: goToReturnPage })))));
 };
 export { Item };

package/dist/src/infrastructure/ui/views/item/components/getOutOfCheckoutModal/GetOutOfCheckoutModal.d.ts

@@ -1,8 +1,6 @@
 import { FC } from "react";
-import { StyleProp, ViewStyle } from "react-native";
 interface GetOutOfCheckoutModalProps {
     readonly visible: boolean;
-    readonly style?: StyleProp<ViewStyle>;
     readonly onDismiss: () => void;
     readonly onConfirm: () => void;
 }

package/dist/src/infrastructure/ui/views/item/components/getOutOfCheckoutModal/GetOutOfCheckoutModal.js

@@ -5,13 +5,13 @@ import { useI18nMessage } from "@lookiero/i18n-react";
 import { Modal } from "@lookiero/sty-psp-ui";
 import { I18nMessages } from "../../../../i18n/i18n";
 import { style } from "./GetOutOfCheckoutModal.style";
-const GetOutOfCheckoutModal = ({ visible, style: customStyle, onDismiss, onConfirm, }) => {
+const GetOutOfCheckoutModal = ({ visible, onDismiss, onConfirm }) => {
     const titleText = useI18nMessage({ id: I18nMessages.GET_OUT_OF_CHECKOUT_MODAL_TITLE });
     const descriptionText = useI18nMessage({ id: I18nMessages.GET_OUT_OF_CHECKOUT_MODAL_DESCRIPTION });
     const dismissButtonText = useI18nMessage({ id: I18nMessages.GET_OUT_OF_CHECKOUT_MODAL_DISMISS_BUTTON });
     const confirmButtonText = useI18nMessage({ id: I18nMessages.GET_OUT_OF_CHECKOUT_MODAL_CONFIRM_BUTTON });
     return (React.createElement(Modal, { visible: visible, onClose: onDismiss },
-        React.createElement(View, { style: [style.modal, customStyle] },
+        React.createElement(View, { style: style.modalContent },
             React.createElement(Text, { align: ALIGN.CENTER, level: 1, style: style.title }, titleText),
             React.createElement(Text, { level: 3, style: style.description }, descriptionText),
             React.createElement(Button, { style: style.button, onPress: onDismiss },