@hedia/recommendation-screen 2.1.51 → 2.1.52-alpha.0

package/dist/src/components/RecommendationModal.d.ts

@@ -83,6 +83,9 @@ export declare const stylesModal: {
     modalStyle: {
         margin: number;
     };
+    scrollViewContainer: {
+        flexGrow: number;
+    };
     container: {
         flex: number;
         backgroundColor: string;

package/dist/src/components/RecommendationModal.js

@@ -1,6 +1,6 @@
 import { t } from "@lingui/macro";
 import * as React from "react";
-import { Dimensions, StyleSheet, TouchableOpacity, View } from "react-native";
+import { Dimensions, ScrollView, StyleSheet, TouchableOpacity, View } from "react-native";
 import ReactNativeModal from "react-native-modal";
 import { i18n } from "../locale/i18nUtils";
 import { Testing } from "../types/enum";
@@ -98,7 +98,7 @@ export default class RecommendationModal extends React.Component {
     secondPage = () => {
         const { attentionMessage, suggestedCarbohydrates } = this.props;
         const willRecommendCarbs = suggestedCarbohydrates !== null && suggestedCarbohydrates > 0;
-        return (<React.Fragment>
+        return (<View style={{ flex: 1 }}>
 				<View style={stylesModal.container}>
 					<View style={stylesModal.titleContainer}>
 						<Text style={stylesModal.textTittleMessage}>{i18n._(t `Attention`)}</Text>
@@ -111,7 +111,7 @@ export default class RecommendationModal extends React.Component {
 							<Text style={stylesModal.buttonText}>{i18n._(t `OK`)}</Text>
 						</TouchableOpacity>
 					</View>)}
-			</React.Fragment>);
+			</View>);
     };
     /**
      * @returns JSX element for displaying the “first” page of the recommendation modal.
@@ -129,8 +129,10 @@ export default class RecommendationModal extends React.Component {
     render() {
         const { isVisible } = this.props;
         const { firstPageVisible } = this.state;
-        return (<ReactNativeModal isVisible={isVisible} style={stylesModal.modalStyle}>
-				{firstPageVisible ? this.firstPage() : this.secondPage()}
+        return (<ReactNativeModal isVisible={isVisible} style={stylesModal.modalStyle} backdropColor={colors.semiDarkBlue} backdropOpacity={1}>
+				<ScrollView contentContainerStyle={stylesModal.scrollViewContainer}>
+					{firstPageVisible ? this.firstPage() : this.secondPage()}
+				</ScrollView>
 			</ReactNativeModal>);
     }
 }
@@ -142,6 +144,9 @@ const buttonBorderWidth = height / 500;
 /** @internal */
 export const stylesModal = StyleSheet.create({
     modalStyle: { margin: 0 },
+    scrollViewContainer: {
+        flexGrow: 1,
+    },
     container: {
         flex: 4,
         backgroundColor: colors.semiDarkBlue,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hedia/recommendation-screen",
-  "version": "2.1.51",
+  "version": "2.1.52-alpha.0",
   "description": "Hedia Recommendation Screen for Bolus and Carbohydrates",
   "main": "dist/index.js",
   "files": [