@lookiero/checkout 0.2.24 → 0.2.26

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

@@ -1,46 +1,46 @@
 import { ViewStyle } from "react-native";
 declare const style: {
     container: {
-        position: "absolute";
-        width: string;
         height: string;
         overflow: "hidden";
+        position: "absolute";
+        width: string;
     };
-    overlay: {
-        zIndex: number;
+    header: {
+        alignItems: "center";
+        flexDirection: "row";
+        justifyContent: "space-between";
+        padding: number;
+    };
+    modal: {
+        "1/4": ViewStyle;
+        "1/3": ViewStyle;
+        "1/2": ViewStyle;
+        "2/3": ViewStyle;
         backgroundColor: string;
         position: "absolute";
         width: string;
-        height: string;
-        cursor: string;
+        zIndex: number;
     };
-    safeArea: {
-        flex: number;
+    overlay: {
+        backgroundColor: string;
+        cursor: string;
+        height: string;
+        position: "absolute";
+        width: string;
         zIndex: number;
     };
     row: {
-        flex: number;
         alignContent: "center";
+        flex: number;
         justifyContent: "center";
     };
     rowSmall: {
         justifyContent: "flex-end";
     };
-    modal: {
-        "1/4": ViewStyle;
-        "1/3": ViewStyle;
-        "1/2": ViewStyle;
-        "2/3": ViewStyle;
-        backgroundColor: string;
-        position: "absolute";
-        width: string;
+    safeArea: {
+        flex: number;
         zIndex: number;
     };
-    header: {
-        alignItems: "center";
-        justifyContent: "space-between";
-        padding: number;
-        flexDirection: "row";
-    };
 };
 export { style };

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

@@ -17,43 +17,43 @@ const modalStylesForColumSize = {
 };
 const style = StyleSheet.create({
     container: {
-        position: "absolute",
-        width: "100%",
         height: "100%",
         overflow: "hidden",
+        position: "absolute",
+        width: "100%",
+    },
+    header: {
+        alignItems: "center",
+        flexDirection: "row",
+        justifyContent: "space-between",
+        padding: spaceM,
+    },
+    modal: {
+        backgroundColor: colorBase,
+        position: "absolute",
+        width: "100%",
+        zIndex: 3,
+        ...modalStylesForColumSize,
     },
     overlay: {
-        zIndex: 1,
         backgroundColor: colorOverlay,
+        cursor: "pointer",
+        height: "100%",
         position: "absolute",
         width: "100%",
-        height: "100%",
-        cursor: "pointer",
-    },
-    safeArea: {
-        flex: 1,
-        zIndex: 2,
+        zIndex: 1,
     },
     row: {
-        flex: 1,
         alignContent: "center",
+        flex: 1,
         justifyContent: "center",
     },
     rowSmall: {
         justifyContent: "flex-end",
     },
-    modal: {
-        backgroundColor: colorBase,
-        position: "absolute",
-        width: "100%",
-        zIndex: 3,
-        ...modalStylesForColumSize,
-    },
-    header: {
-        alignItems: "center",
-        justifyContent: "space-between",
-        padding: spaceM,
-        flexDirection: "row",
+    safeArea: {
+        flex: 1,
+        zIndex: 2,
     },
 });
 export { style };

package/dist/infrastructure/ui/shared/components/layouts/row/Row.style.d.ts

@@ -1,10 +1,10 @@
 declare const style: {
     row: {
+        alignItems: "center";
         flexWrap: "wrap";
+        marginHorizontal: string;
         maxWidth: number;
         width: string;
-        alignItems: "center";
-        marginHorizontal: string;
     };
     rowLarge: {
         maxWidth: number;

package/dist/infrastructure/ui/shared/components/layouts/row/Row.style.js

@@ -4,11 +4,11 @@ const { spaceXXL, layoutMaxWidth } = theme();
 const rowLargeMaxWidth = layoutMaxWidth - 2 * spaceXXL;
 const style = StyleSheet.create({
     row: {
+        alignItems: "center",
         flexWrap: "wrap",
+        marginHorizontal: "auto",
         maxWidth: layoutMaxWidth,
         width: "100%",
-        alignItems: "center",
-        marginHorizontal: "auto",
     },
     rowLarge: {
         maxWidth: rowLargeMaxWidth,

package/dist/infrastructure/ui/shared/components/layouts/slider/Pagination.js

@@ -2,10 +2,10 @@ import React from "react";
 import { Pressable, View } from "react-native";
 import { style } from "./Pagination.style";
 const Pagination = ({ touchable = true, paginationStyle, paginationItemStyle, paginationActiveItemStyle, count = 0, activeIndex = 0, renderItem, onChange, }) => (React.createElement(View, { style: [style.paginationWrapper, paginationStyle], testID: "slider-pagination" }, Array.from(Array(count).keys()).map((index) => (React.createElement(View, { key: index, style: style.paginationContainer },
-    React.createElement(Pressable, { onPress: !touchable ? undefined : () => onChange(index), style: [
+    React.createElement(Pressable, { testID: "slider-pagination-item", style: [
             style.paginationItem,
             activeIndex === index && style.active,
             paginationItemStyle,
             activeIndex === index && paginationActiveItemStyle,
-        ], testID: "slider-pagination-item" }, renderItem?.(index)))))));
+        ], onPress: !touchable ? undefined : () => onChange(index) }, renderItem?.(index)))))));
 export { Pagination };

package/dist/infrastructure/ui/shared/components/layouts/slider/Pagination.style.d.ts

@@ -1,23 +1,23 @@
 declare const style: {
-    paginationWrapper: {
-        alignItems: "center";
-        bottom: number;
-        flexDirection: "row";
-        justifyContent: "center";
-        position: "absolute";
-        width: string;
+    active: {
+        backgroundColor: string;
     };
     paginationContainer: {
         margin: number;
     };
     paginationItem: {
-        width: number;
-        height: number;
-        borderRadius: number;
         backgroundColor: string;
+        borderRadius: number;
+        height: number;
+        width: number;
     };
-    active: {
-        backgroundColor: string;
+    paginationWrapper: {
+        alignItems: "center";
+        bottom: number;
+        flexDirection: "row";
+        justifyContent: "center";
+        position: "absolute";
+        width: string;
     };
 };
 export { style };

package/dist/infrastructure/ui/shared/components/layouts/slider/Pagination.style.js

@@ -3,25 +3,25 @@ import { theme } from "../../../../theme/theme";
 const { colorGrayscaleS, colorGrayscaleXL } = theme();
 const DOT_SIZE = 8;
 const style = StyleSheet.create({
-    paginationWrapper: {
-        alignItems: "center",
-        bottom: 10,
-        flexDirection: "row",
-        justifyContent: "center",
-        position: "absolute",
-        width: "100%",
+    active: {
+        backgroundColor: colorGrayscaleXL,
     },
     paginationContainer: {
         margin: 3,
     },
     paginationItem: {
-        width: DOT_SIZE,
-        height: DOT_SIZE,
-        borderRadius: DOT_SIZE / 2,
         backgroundColor: colorGrayscaleS,
+        borderRadius: DOT_SIZE / 2,
+        height: DOT_SIZE,
+        width: DOT_SIZE,
     },
-    active: {
-        backgroundColor: colorGrayscaleXL,
+    paginationWrapper: {
+        alignItems: "center",
+        bottom: 10,
+        flexDirection: "row",
+        justifyContent: "center",
+        position: "absolute",
+        width: "100%",
     },
 });
 export { style };

package/dist/infrastructure/ui/shared/components/layouts/slider/Slider.js

@@ -120,13 +120,13 @@ const Slider = ({ children, active = 0, loop = false, minDistanceToCapture = 5,
         widthRef.current = width;
         fixState();
     }, [fixState]);
-    return (React.createElement(View, { style: style.container, onLayout: onLayoutWrapper, testID: "slider" },
+    return (React.createElement(View, { style: style.container, testID: "slider", onLayout: onLayoutWrapper },
         React.createElement(Animated.View, { style: StyleSheet.flatten([
                 {
                     transform: [{ translateX: pan.x }, { translateY: pan.y }],
                 },
                 style.sliderAreaStyle,
             ]), ...panResponder.panHandlers }, flatennedChildren.map((child, index) => (React.createElement(View, { key: index, style: { width }, testID: "slider-child" }, child)))),
-        paginationEnabled && (React.createElement(Pagination, { count: count, activeIndex: getActiveIndex(), onChange: (index) => goTo(index), paginationStyle: paginationStyle, paginationItemStyle: paginationItemStyle, paginationActiveItemStyle: paginationActiveItemStyle, renderItem: paginationRenderItem }))));
+        paginationEnabled && (React.createElement(Pagination, { activeIndex: getActiveIndex(), count: count, paginationActiveItemStyle: paginationActiveItemStyle, paginationItemStyle: paginationItemStyle, paginationStyle: paginationStyle, renderItem: paginationRenderItem, onChange: (index) => goTo(index) }))));
 };
 export { Slider };

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

@@ -2,6 +2,6 @@ import React from "react";
 import { TouchableHighlight } from "react-native";
 import { Icon } from "../../atoms/icon/Icon";
 import { buttonIconUnderlayColor, style } from "./ButtonIcon.style";
-const ButtonIcon = ({ name, style: customStyle, testID = "button-icon", onPress, ...restProps }) => (React.createElement(TouchableHighlight, { style: [style.buttonIcon, customStyle?.button], onPress: onPress, underlayColor: buttonIconUnderlayColor, testID: testID, ...restProps },
+const ButtonIcon = ({ name, style: customStyle, testID = "button-icon", onPress, ...restProps }) => (React.createElement(TouchableHighlight, { style: [style.buttonIcon, customStyle?.button], testID: testID, underlayColor: buttonIconUnderlayColor, onPress: onPress, ...restProps },
     React.createElement(Icon, { name: name, style: customStyle?.icon })));
 export { ButtonIcon };

package/dist/infrastructure/ui/shared/components/molecules/inputField/InputField.js

@@ -6,7 +6,7 @@ import { Field } from "../../atoms/field/Field";
 import { Icon } from "../../atoms/icon/Icon";
 import { Input } from "../../atoms/input/Input";
 import { style } from "./InputField.style";
-const { colorContent, colorGrayscaleL, colorPrimary, spaceM, iconSize } = theme();
+const { colorBase, colorContent, colorGrayscaleL, colorPrimary, spaceM, iconSize } = theme();
 const inputPaddingRightWithIcon = iconSize + spaceM * 2;
 const InputField = ({ label, placeholder, value, multiline = false, minHeight, error, style: customStyle, onChange = () => void 0, icon, ...inputRestProps }) => {
     const [isFocused, setIsFocused] = useState(false);
@@ -15,14 +15,14 @@ const InputField = ({ label, placeholder, value, multiline = false, minHeight, e
     const handleOnFocus = useCallback(() => setIsFocused(true), []);
     const color = error ? colorPrimary : isFocused ? colorContent : colorGrayscaleL;
     return (React.createElement(View, { style: customStyle?.inputField, testID: "input-field" },
-        React.createElement(Field, { label: label, isFocused: isFocused || !!value, style: {
+        React.createElement(Field, { isFocused: isFocused || !!value, label: label, style: {
                 field: { ...style.field, ...customStyle?.field },
                 fieldText: {
                     color,
                     ...customStyle?.fieldText,
                 },
             } }),
-        React.createElement(Input, { value: value, placeholder: placeholder, multiline: multiline, minHeight: minHeight, onChangeText: handleOnChange, onBlur: handleOnBlur, onFocus: handleOnFocus, style: [!!icon ? { paddingRight: inputPaddingRightWithIcon } : {}, { borderColor: color }, customStyle?.input], ...inputRestProps }),
+        React.createElement(Input, { minHeight: minHeight, multiline: multiline, placeholder: placeholder, placeholderTextColor: isFocused ? colorGrayscaleL : colorBase, style: [!!icon ? { paddingRight: inputPaddingRightWithIcon } : {}, { borderColor: color }, customStyle?.input], value: value, onBlur: handleOnBlur, onChangeText: handleOnChange, onFocus: handleOnFocus, ...inputRestProps }),
         !!icon && React.createElement(Icon, { name: icon, style: [style.icon, { color }, customStyle?.icon] }),
         !!error && React.createElement(Error, { error: error, style: [style.error, customStyle?.error] })));
 };

package/dist/infrastructure/ui/shared/components/molecules/inputField/InputField.style.d.ts

@@ -1,12 +1,12 @@
 declare const style: {
+    error: {
+        marginLeft: number;
+        marginTop: number;
+    };
     field: {
         position: "absolute";
         zIndex: number;
     };
-    error: {
-        marginTop: number;
-        marginLeft: number;
-    };
     icon: {
         position: "absolute";
         right: number;

package/dist/infrastructure/ui/shared/components/molecules/inputField/InputField.style.js

@@ -2,14 +2,14 @@ import { StyleSheet } from "react-native";
 import { theme } from "../../../../theme/theme";
 const { spaceXS, spaceM, spaceL } = theme();
 const style = StyleSheet.create({
+    error: {
+        marginLeft: spaceL,
+        marginTop: spaceXS,
+    },
     field: {
         position: "absolute",
         zIndex: 4,
     },
-    error: {
-        marginTop: spaceXS,
-        marginLeft: spaceL,
-    },
     icon: {
         position: "absolute",
         right: spaceM,

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

@@ -14,7 +14,7 @@ import { Spinner } from "../../shared/components/atoms/spinner/Spinner";
 import { style } from "./Intro.style";
 const Bullet = ({ text }) => (React.createElement(View, { style: style.bullet },
     React.createElement(Icon, { name: "rounded-tick", style: style.tickIcon }),
-    React.createElement(Text, { detail: true, level: 2 }, text)));
+    React.createElement(Text, { level: 2, detail: true }, text)));
 const Intro = ({ customerId }) => {
     const titleText = useI18nMessage({ id: I18nMessages.INTRO_TITLE });
     const subTitleText = useI18nMessage({ id: I18nMessages.INTRO_SUBTITLE });
@@ -34,15 +34,15 @@ const Intro = ({ customerId }) => {
         React.createElement(Body, null,
             React.createElement(View, { style: style.container },
                 React.createElement(View, { style: style.content },
-                    React.createElement(Text, { heading: true, level: 3, style: style.title }, titleText),
-                    React.createElement(Text, { body: true, level: 3, style: style.subtitle }, subTitleText),
+                    React.createElement(Text, { level: 3, style: style.title, heading: true }, titleText),
+                    React.createElement(Text, { level: 3, style: style.subtitle, body: true }, subTitleText),
                     React.createElement(View, { style: style.discountContainer },
                         React.createElement(View, { style: style.discount },
-                            React.createElement(Text, { heading: true, level: 2 },
+                            React.createElement(Text, { level: 2, heading: true },
                                 "- ",
                                 fiveItemsDiscount),
-                            React.createElement(Text, { heading: true, level: 3, style: style.percentage }, "%")),
-                        React.createElement(Text, { body: true, level: 3 }, discountText)),
+                            React.createElement(Text, { level: 3, style: style.percentage, heading: true }, "%")),
+                        React.createElement(Text, { level: 3, body: true }, discountText)),
                     React.createElement(View, { style: style.description },
                         React.createElement(Bullet, { text: bulletOneText }),
                         React.createElement(Bullet, { text: bulletTwoText }),

package/dist/infrastructure/ui/views/intro/Intro.style.d.ts

@@ -1,4 +1,9 @@
 declare const style: {
+    bullet: {
+        alignItems: "center";
+        flexDirection: "row";
+        marginVertical: number;
+    };
     container: {
         flex: number;
         justifyContent: "space-between";
@@ -6,12 +11,17 @@ declare const style: {
     content: {
         alignItems: "center";
     };
-    title: {
+    description: {
+        borderWidth: number;
         marginBottom: number;
-        textAlign: "center";
+        padding: number;
+        width: string;
     };
-    subtitle: {
-        textAlign: "center";
+    discount: {
+        alignItems: "flex-end";
+        flexDirection: "row";
+        justifyContent: "center";
+        marginBottom: number;
     };
     discountContainer: {
         alignItems: "center";
@@ -21,28 +31,18 @@ declare const style: {
         textAlign: "center";
         width: string;
     };
-    discount: {
-        alignItems: "flex-end";
-        flexDirection: "row";
-        justifyContent: "center";
-        marginBottom: number;
-    };
     percentage: {
         marginLeft: number;
     };
-    description: {
-        borderWidth: number;
-        marginBottom: number;
-        padding: number;
-        width: string;
-    };
-    bullet: {
-        alignItems: "center";
-        flexDirection: "row";
-        marginVertical: number;
+    subtitle: {
+        textAlign: "center";
     };
     tickIcon: {
         marginRight: number;
     };
+    title: {
+        marginBottom: number;
+        textAlign: "center";
+    };
 };
 export { style };

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

@@ -2,6 +2,11 @@ import { StyleSheet } from "react-native";
 import { theme } from "../../theme/theme";
 const { borderSize, colorAccent, spaceXS, spaceS, spaceM, spaceL, spaceXL } = theme();
 const style = StyleSheet.create({
+    bullet: {
+        alignItems: "center",
+        flexDirection: "row",
+        marginVertical: spaceS,
+    },
     container: {
         flex: 1,
         justifyContent: "space-between",
@@ -9,12 +14,17 @@ const style = StyleSheet.create({
     content: {
         alignItems: "center",
     },
-    title: {
-        marginBottom: spaceM,
-        textAlign: "center",
+    description: {
+        borderWidth: borderSize,
+        marginBottom: spaceXL,
+        padding: spaceM,
+        width: "100%",
     },
-    subtitle: {
-        textAlign: "center",
+    discount: {
+        alignItems: "flex-end",
+        flexDirection: "row",
+        justifyContent: "center",
+        marginBottom: spaceS,
     },
     discountContainer: {
         alignItems: "center",
@@ -24,28 +34,18 @@ const style = StyleSheet.create({
         textAlign: "center",
         width: "100%",
     },
-    discount: {
-        alignItems: "flex-end",
-        flexDirection: "row",
-        justifyContent: "center",
-        marginBottom: spaceS,
-    },
     percentage: {
         marginLeft: spaceXS,
     },
-    description: {
-        borderWidth: borderSize,
-        marginBottom: spaceXL,
-        padding: spaceM,
-        width: "100%",
-    },
-    bullet: {
-        alignItems: "center",
-        flexDirection: "row",
-        marginVertical: spaceS,
+    subtitle: {
+        textAlign: "center",
     },
     tickIcon: {
         marginRight: spaceS,
     },
+    title: {
+        marginBottom: spaceM,
+        textAlign: "center",
+    },
 });
 export { style };

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

@@ -33,7 +33,7 @@ const Item = ({ customerId }) => {
             React.createElement(Body, null,
                 React.createElement(View, { style: style.sliderContainer },
                     React.createElement(ProductVariantSlider, { producVariantMedia: media })),
-                React.createElement(ProductVariantDescription, { brand: brand, name: name, price: price, size: size, color: color }),
+                React.createElement(ProductVariantDescription, { brand: brand, color: color, name: name, price: price, size: size }),
                 Object.entries(feedback).length !== 0 && (React.createElement(View, { style: style.feedbackContainer },
                     React.createElement(ReturnQuestionsFeedback, { feedback: feedback, returnQuestions: returnQuestions, onEditFeedback: handleOnEditFeedback }))),
                 React.createElement(View, { style: { flexDirection: "row", justifyContent: "center" } },

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

@@ -1,12 +1,12 @@
 declare const style: {
-    sliderContainer: {
-        minHeight: number;
-        marginBottom: number;
-    };
     feedbackContainer: {
-        marginVertical: number;
         borderTopColor: string;
         borderTopWidth: number;
+        marginVertical: number;
+    };
+    sliderContainer: {
+        marginBottom: number;
+        minHeight: number;
     };
 };
 export { style };

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

@@ -2,14 +2,14 @@ import { StyleSheet } from "react-native";
 import { theme } from "../../theme/theme";
 const { borderSize, colorGrayscaleM, spaceXL } = theme();
 const style = StyleSheet.create({
-    sliderContainer: {
-        minHeight: 500,
-        marginBottom: spaceXL,
-    },
     feedbackContainer: {
-        marginVertical: spaceXL,
         borderTopColor: colorGrayscaleM,
         borderTopWidth: borderSize,
+        marginVertical: spaceXL,
+    },
+    sliderContainer: {
+        marginBottom: spaceXL,
+        minHeight: 500,
     },
 });
 export { style };

package/dist/infrastructure/ui/views/item/components/banner/CustomerDecissionBanner.js

@@ -14,8 +14,8 @@ const CustomerDecissionBanner = ({ checkoutItemStatus, onPress }) => {
     const decissionText = useI18nMessage({ id: i18nMessageForCheckoutItemStatus[checkoutItemStatus] });
     const bannerButtonText = useI18nMessage({ id: I18nMessages.ITEM_BANNER_BUTTON });
     return (React.createElement(View, { style: style.container },
-        React.createElement(Text, { detail: true, level: 2, style: style.decissionText }, decissionText),
+        React.createElement(Text, { level: 2, style: style.decissionText, detail: true }, decissionText),
         React.createElement(Pressable, { onPress: onPress },
-            React.createElement(Text, { detail: true, level: 2, style: style.buttonText }, bannerButtonText))));
+            React.createElement(Text, { level: 2, style: style.buttonText, detail: true }, bannerButtonText))));
 };
 export { CustomerDecissionBanner };

package/dist/infrastructure/ui/views/item/components/banner/CustomerDecissionBanner.style.d.ts

@@ -1,17 +1,17 @@
 declare const style: {
+    buttonText: {
+        textDecorationLine: "underline";
+    };
     container: {
         alignItems: "center";
         backgroundColor: string;
-        paddingTop: number;
-        paddingHorizontal: number;
         paddingBottom: number;
+        paddingHorizontal: number;
+        paddingTop: number;
     };
     decissionText: {
-        textAlign: "center";
         marginBottom: number;
-    };
-    buttonText: {
-        textDecorationLine: "underline";
+        textAlign: "center";
     };
 };
 export { style };

package/dist/infrastructure/ui/views/item/components/banner/CustomerDecissionBanner.style.js

@@ -2,19 +2,19 @@ import { StyleSheet } from "react-native";
 import { theme } from "../../../../theme/theme";
 const { colorInfo, spaceM, spaceL } = theme();
 const style = StyleSheet.create({
+    buttonText: {
+        textDecorationLine: "underline",
+    },
     container: {
         alignItems: "center",
         backgroundColor: colorInfo,
-        paddingTop: spaceM,
-        paddingHorizontal: spaceL,
         paddingBottom: spaceL,
+        paddingHorizontal: spaceL,
+        paddingTop: spaceM,
     },
     decissionText: {
-        textAlign: "center",
         marginBottom: spaceM,
-    },
-    buttonText: {
-        textDecorationLine: "underline",
+        textAlign: "center",
     },
 });
 export { style };

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

@@ -12,8 +12,8 @@ const GetOutOfCheckoutModal = ({ visible, onDismiss, onConfirm }) => {
     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 },
-        React.createElement(Text, { body: true, level: 1, style: style.modalTitle }, titleText),
-        React.createElement(Text, { body: true, level: 3, style: style.modalDescription }, descriptionText),
+        React.createElement(Text, { level: 1, style: style.modalTitle, body: true }, titleText),
+        React.createElement(Text, { level: 3, style: style.modalDescription, body: true }, descriptionText),
         React.createElement(Button
         // eslint-disable-next-line @typescript-eslint/ban-ts-comment
         // @ts-ignore

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

@@ -1,16 +1,16 @@
 declare const style: {
-    modalTitle: {
-        textAlign: "center";
-    };
-    modalDescription: {
-        marginVertical: number;
-        textAlign: "center";
-    };
     button: {
         flex: number;
     };
     confirmButton: {
         marginTop: number;
     };
+    modalDescription: {
+        marginVertical: number;
+        textAlign: "center";
+    };
+    modalTitle: {
+        textAlign: "center";
+    };
 };
 export { style };