@coorpacademy/components 11.14.9 → 11.14.10

package/es/organism/review-slide/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-slide/index.native.tsx"],"names":[],"mappings":";AA0BA,OAAO,EAAa,gBAAgB,EAAa,MAAM,cAAc,CAAC;AAoQtE,QAAA,MAAM,KAAK,UAAW,gBAAgB,gBAmFrC,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-slide/index.native.tsx"],"names":[],"mappings":";AA2BA,OAAO,EAAa,gBAAgB,EAAa,MAAM,cAAc,CAAC;AAoQtE,QAAA,MAAM,KAAK,UAAW,gBAAgB,gBAqErC,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/es/organism/review-slide/index.native.js

@@ -10,6 +10,7 @@ import Button from '../../atom/button/index.native';
 import { TYPE_AUDIO, TYPE_IMAGE, TYPE_VIDEO } from '../../molecule/answer/prop-types';
 import Video from '../../molecule/video-player-mobile/index.native';
 import Html from '../../atom/html/index.native';
+import useMobileKeyboardVisibility from '../../util/use-mobile-keyboard-visibility';
 const styles = StyleSheet.create({
   mediaContainer: {
     alignItems: 'center',
@@ -246,19 +247,7 @@ const Slide = props => {
     slideIndex = '0'
   } = props;
   const [isValidated, setValidated] = useState(false);
-  const [isKeyboardVisible, setKeyboardVisible] = useState(false);
-  useEffect(() => {
-    const showListener = Keyboard.addListener('keyboardDidShow', () => {
-      setKeyboardVisible(true);
-    });
-    const hideListener = Keyboard.addListener('keyboardDidHide', () => {
-      setKeyboardVisible(false);
-    });
-    return () => {
-      showListener.remove();
-      hideListener.remove();
-    };
-  }, []);
+  const isKeyboardVisible = useMobileKeyboardVisibility();
   const handleValidatePress = useCallback(() => {
     Keyboard.dismiss();
     setValidated(true); // calling the onclick later, after react has rerendered, to display the locking BG as soon as possible

package/es/organism/review-slide/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["React","useCallback","useEffect","useMemo","useState","Animated","Easing","Image","Keyboard","ScrollView","StyleSheet","useWindowDimensions","View","get","getOr","useTranslateY","Answer","ReviewCorrectionPopin","useTemplateContext","Button","TYPE_AUDIO","TYPE_IMAGE","TYPE_VIDEO","Video","Html","styles","create","mediaContainer","alignItems","justifyContent","width","height","borderRadius","overflow","image","flex","correctionPopinWrapper","position","bottom","MediaView","media","autoplay","type","uri","url","split","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","translateUp","fromValue","toValue","duration","easing","bezier","start","klf","undefined","information","label","message","next","onClick","_correctionPopinProps","resultLabel","style","animatedStyle","createQuestionStyle","theme","questionHeading","questionOriginContainer","marginBottom","spacing","tiny","marginTop","small","questionOrigin","fontSize","lineHeight","color","colors","text","primary","textAlign","questionTextContainer","marginVertical","questionText","fontWeight","questionHelpContainer","questionHelp","gray","medium","choicesScrollView","choicesScrollContent","flexGrow","padding","Question","props","answerUI","isKeyboardVisible","autoplayMedia","setStyle","questionStyle","hasVideoOrImage","includes","createSlideStyle","num","screenWidth","slideWidth","hiddenBackgroundToLockActions","left","right","top","backgroundColor","slide","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","validateButton","isValidated","setValidated","setKeyboardVisible","showListener","addListener","hideListener","remove","handleValidatePress","dismiss","setTimeout","slideStyle","isFirstSlide","loading","parentContentTitle","disabled"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useMemo, useState} from 'react';\n\nimport {\n  Animated,\n  Easing,\n  Image,\n  Keyboard,\n  ScrollView,\n  StyleSheet,\n  TextStyle,\n  useWindowDimensions,\n  View,\n  ViewStyle\n} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport {useTranslateY} from '@coorpacademy/react-native-animation';\nimport Answer from '../../molecule/answer/index.native';\nimport ReviewCorrectionPopin from '../../molecule/review-correction-popin/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Button from '../../atom/button/index.native';\nimport {TYPE_AUDIO, TYPE_IMAGE, TYPE_VIDEO} from '../../molecule/answer/prop-types';\nimport Video from '../../molecule/video-player-mobile/index.native';\nimport {Media} from '../../molecule/questions/types';\nimport Html from '../../atom/html/index.native';\nimport {PopinProps, ReviewSlideProps, SlideProps} from './prop-types';\n\nconst styles = StyleSheet.create({\n  mediaContainer: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '100%',\n    height: 200,\n    borderRadius: 10,\n    overflow: 'hidden'\n  },\n  image: {\n    flex: 1,\n    width: '100%'\n  },\n  correctionPopinWrapper: {\n    position: 'absolute',\n    bottom: 16,\n    width: '105%'\n  }\n});\n\nconst MediaView = ({media, autoplay}: {media?: Media; autoplay: boolean}) => {\n  if (!media) {\n    return null;\n  }\n\n  switch (media.type) {\n    case TYPE_VIDEO:\n      return (\n        <View style={styles.mediaContainer}>\n          <Video media={media} autoplay={autoplay} />\n        </View>\n      );\n    case TYPE_IMAGE: {\n      const uri = `https://${media.url?.split('//')[1]}`;\n      return <Image style={[styles.mediaContainer, styles.image]} source={{uri}} />;\n    }\n    case TYPE_AUDIO:\n    default:\n      return null;\n  }\n};\n\nconst CorrectionPopin = ({\n  correctionPopinProps,\n  slideIndex,\n  showCorrectionPopin,\n  animateCorrectionPopin\n}: PopinProps) => {\n  const translateUp = useTranslateY({\n    fromValue: 500,\n    toValue: 0,\n    duration: 500,\n    easing: Easing.bezier(0.34, 1.36, 0.64, 1)\n  });\n\n  // the translation is required only once on mount\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(() => translateUp.start(), []);\n\n  if (!showCorrectionPopin) return null;\n\n  const klf = getOr(undefined, 'klf', correctionPopinProps);\n  const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n  const next = get('next', correctionPopinProps);\n  const onClick = get(['next', 'onClick'], correctionPopinProps);\n\n  const _correctionPopinProps = {\n    next: {\n      onClick,\n      label: next && next.label,\n      'data-name': `next-question-button-${slideIndex}`,\n      'aria-label': next && next['aria-label']\n    },\n    klf,\n    information,\n    type: correctionPopinProps.type,\n    resultLabel: correctionPopinProps.resultLabel\n  };\n\n  const style = animateCorrectionPopin\n    ? [styles.correctionPopinWrapper, translateUp.animatedStyle]\n    : styles.correctionPopinWrapper;\n\n  return (\n    <Animated.View style={style}>\n      <ReviewCorrectionPopin {..._correctionPopinProps} />\n    </Animated.View>\n  );\n};\n\ntype StyleSheetType = {\n  questionHeading: ViewStyle;\n  questionOriginContainer: ViewStyle;\n  questionOrigin: TextStyle;\n  questionTextContainer: ViewStyle;\n  questionText: TextStyle;\n  questionHelpContainer: ViewStyle;\n  questionHelp: TextStyle;\n  choicesScrollView: ViewStyle;\n  choicesScrollContent: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between',\n      alignItems: 'center'\n    },\n    questionOriginContainer: {\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      textAlign: 'center'\n    },\n    questionTextContainer: {\n      marginVertical: 4,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary\n    },\n    questionHelpContainer: {\n      marginVertical: 4\n    },\n    questionHelp: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.gray.medium,\n      marginBottom: 0,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    choicesScrollView: {\n      marginTop: 20,\n      width: '100%'\n    },\n    choicesScrollContent: {\n      flexGrow: 1,\n      justifyContent: 'space-around',\n      padding: 10\n    }\n  });\n\ntype QuestionProps = {\n  autoplayMedia: boolean;\n  answerUI: SlideProps['answerUI'];\n  isKeyboardVisible: boolean;\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {\n    answerUI,\n    questionText,\n    questionOrigin = '',\n    isKeyboardVisible,\n    autoplayMedia = false\n  } = props;\n  const {theme} = useTemplateContext();\n  const [style, setStyle] = useState<StyleSheetType>();\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme);\n    setStyle(questionStyle);\n  }, [theme]);\n\n  if (!answerUI || !questionText || !style) return null;\n\n  const hasVideoOrImage =\n    answerUI.media?.type && [TYPE_VIDEO, TYPE_IMAGE].includes(answerUI.media.type);\n\n  return (\n    <>\n      <View style={style.questionHeading}>\n        <View style={style.questionOriginContainer}>\n          <Html style={style.questionOrigin} isTextCentered>\n            {questionOrigin}\n          </Html>\n        </View>\n        <View style={style.questionTextContainer}>\n          <Html style={style.questionText} isTextCentered>\n            {questionText}\n          </Html>\n        </View>\n        <View style={style.questionHelpContainer}>\n          <Html style={style.questionHelp}>{get('help', answerUI)}</Html>\n        </View>\n      </View>\n      <ScrollView\n        style={style.choicesScrollView}\n        contentContainerStyle={style.choicesScrollContent}\n        showsHorizontalScrollIndicator={false}\n        showsVerticalScrollIndicator={false}\n      >\n        {!isKeyboardVisible && hasVideoOrImage ? (\n          <MediaView media={answerUI.media} autoplay={autoplayMedia} />\n        ) : null}\n        <View\n          style={{\n            marginTop: hasVideoOrImage ? 30 : 0\n          }}\n        >\n          <Answer {...answerUI} />\n        </View>\n      </ScrollView>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n  hiddenBackgroundToLockActions: ViewStyle;\n};\n\nconst createSlideStyle = (\n  num: number,\n  screenWidth: number,\n  isKeyboardVisible: boolean\n): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    hiddenBackgroundToLockActions: {\n      position: 'absolute',\n      left: 0,\n      right: 0,\n      top: 0,\n      bottom: 0,\n      backgroundColor: '#00000000'\n    },\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: (isKeyboardVisible ? 5 : 34) + num * 5,\n      backgroundColor: '#fff', // theme.colors.white\n      height: '90%',\n      width: slideWidth,\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      padding: 25,\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.05,\n      shadowRadius: 16,\n      elevation: 10 - num * 1,\n      borderRadius: 16\n    }\n  });\n};\n\nconst Slide = (props: ReviewSlideProps) => {\n  const {animatedStyle, slide, correctionPopinProps, validateButton, num, slideIndex = '0'} = props;\n  const [isValidated, setValidated] = useState<boolean>(false);\n  const [isKeyboardVisible, setKeyboardVisible] = useState<boolean>(false);\n\n  useEffect(() => {\n    const showListener = Keyboard.addListener('keyboardDidShow', () => {\n      setKeyboardVisible(true);\n    });\n\n    const hideListener = Keyboard.addListener('keyboardDidHide', () => {\n      setKeyboardVisible(false);\n    });\n\n    return () => {\n      showListener.remove();\n      hideListener.remove();\n    };\n  }, []);\n\n  const handleValidatePress = useCallback(() => {\n    Keyboard.dismiss();\n    setValidated(true);\n\n    // calling the onclick later, after react has rerendered, to display the locking BG as soon as possible\n    setTimeout(() => {\n      validateButton.onClick();\n    }, 20);\n\n    // only to create on mount\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const {width} = useWindowDimensions();\n  const slideStyle = useMemo(\n    () => createSlideStyle(num, width, isKeyboardVisible),\n    [num, width, isKeyboardVisible]\n  );\n  const isFirstSlide = num === 1;\n\n  const {\n    loading,\n    parentContentTitle,\n    questionText,\n    answerUI,\n    showCorrectionPopin,\n    animateCorrectionPopin\n  } = slide;\n\n  if (loading) {\n    return <View style={slideStyle.slide} />;\n  }\n\n  return (\n    <Animated.View style={[slideStyle.slide, animatedStyle]}>\n      <Question\n        questionOrigin={parentContentTitle}\n        questionText={questionText}\n        answerUI={answerUI}\n        autoplayMedia={isFirstSlide}\n        isKeyboardVisible={isKeyboardVisible}\n        key=\"question-container\"\n      />\n      {isKeyboardVisible ? null : (\n        <Button\n          disabled={isValidated || validateButton.disabled}\n          submitValue={validateButton.label}\n          onPress={handleValidatePress}\n          testID={`slide-validate-button-${slideIndex}`}\n        />\n      )}\n      {isValidated ? <View style={slideStyle.hiddenBackgroundToLockActions} /> : null}\n      {correctionPopinProps ? (\n        <CorrectionPopin\n          correctionPopinProps={correctionPopinProps}\n          slideIndex={slideIndex}\n          showCorrectionPopin={showCorrectionPopin}\n          animateCorrectionPopin={animateCorrectionPopin}\n          key=\"correction-popin\"\n        />\n      ) : null}\n    </Animated.View>\n  );\n};\n\nexport default Slide;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["React","useCallback","useEffect","useMemo","useState","Animated","Easing","Image","Keyboard","ScrollView","StyleSheet","useWindowDimensions","View","get","getOr","useTranslateY","Answer","ReviewCorrectionPopin","useTemplateContext","Button","TYPE_AUDIO","TYPE_IMAGE","TYPE_VIDEO","Video","Html","useMobileKeyboardVisibility","styles","create","mediaContainer","alignItems","justifyContent","width","height","borderRadius","overflow","image","flex","correctionPopinWrapper","position","bottom","MediaView","media","autoplay","type","uri","url","split","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","translateUp","fromValue","toValue","duration","easing","bezier","start","klf","undefined","information","label","message","next","onClick","_correctionPopinProps","resultLabel","style","animatedStyle","createQuestionStyle","theme","questionHeading","questionOriginContainer","marginBottom","spacing","tiny","marginTop","small","questionOrigin","fontSize","lineHeight","color","colors","text","primary","textAlign","questionTextContainer","marginVertical","questionText","fontWeight","questionHelpContainer","questionHelp","gray","medium","choicesScrollView","choicesScrollContent","flexGrow","padding","Question","props","answerUI","isKeyboardVisible","autoplayMedia","setStyle","questionStyle","hasVideoOrImage","includes","createSlideStyle","num","screenWidth","slideWidth","hiddenBackgroundToLockActions","left","right","top","backgroundColor","slide","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","validateButton","isValidated","setValidated","handleValidatePress","dismiss","setTimeout","slideStyle","isFirstSlide","loading","parentContentTitle","disabled"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useMemo, useState} from 'react';\n\nimport {\n  Animated,\n  Easing,\n  Image,\n  Keyboard,\n  ScrollView,\n  StyleSheet,\n  TextStyle,\n  useWindowDimensions,\n  View,\n  ViewStyle\n} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport {useTranslateY} from '@coorpacademy/react-native-animation';\nimport Answer from '../../molecule/answer/index.native';\nimport ReviewCorrectionPopin from '../../molecule/review-correction-popin/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Button from '../../atom/button/index.native';\nimport {TYPE_AUDIO, TYPE_IMAGE, TYPE_VIDEO} from '../../molecule/answer/prop-types';\nimport Video from '../../molecule/video-player-mobile/index.native';\nimport {Media} from '../../molecule/questions/types';\nimport Html from '../../atom/html/index.native';\nimport useMobileKeyboardVisibility from '../../util/use-mobile-keyboard-visibility';\nimport {PopinProps, ReviewSlideProps, SlideProps} from './prop-types';\n\nconst styles = StyleSheet.create({\n  mediaContainer: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '100%',\n    height: 200,\n    borderRadius: 10,\n    overflow: 'hidden'\n  },\n  image: {\n    flex: 1,\n    width: '100%'\n  },\n  correctionPopinWrapper: {\n    position: 'absolute',\n    bottom: 16,\n    width: '105%'\n  }\n});\n\nconst MediaView = ({media, autoplay}: {media?: Media; autoplay: boolean}) => {\n  if (!media) {\n    return null;\n  }\n\n  switch (media.type) {\n    case TYPE_VIDEO:\n      return (\n        <View style={styles.mediaContainer}>\n          <Video media={media} autoplay={autoplay} />\n        </View>\n      );\n    case TYPE_IMAGE: {\n      const uri = `https://${media.url?.split('//')[1]}`;\n      return <Image style={[styles.mediaContainer, styles.image]} source={{uri}} />;\n    }\n    case TYPE_AUDIO:\n    default:\n      return null;\n  }\n};\n\nconst CorrectionPopin = ({\n  correctionPopinProps,\n  slideIndex,\n  showCorrectionPopin,\n  animateCorrectionPopin\n}: PopinProps) => {\n  const translateUp = useTranslateY({\n    fromValue: 500,\n    toValue: 0,\n    duration: 500,\n    easing: Easing.bezier(0.34, 1.36, 0.64, 1)\n  });\n\n  // the translation is required only once on mount\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(() => translateUp.start(), []);\n\n  if (!showCorrectionPopin) return null;\n\n  const klf = getOr(undefined, 'klf', correctionPopinProps);\n  const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n  const next = get('next', correctionPopinProps);\n  const onClick = get(['next', 'onClick'], correctionPopinProps);\n\n  const _correctionPopinProps = {\n    next: {\n      onClick,\n      label: next && next.label,\n      'data-name': `next-question-button-${slideIndex}`,\n      'aria-label': next && next['aria-label']\n    },\n    klf,\n    information,\n    type: correctionPopinProps.type,\n    resultLabel: correctionPopinProps.resultLabel\n  };\n\n  const style = animateCorrectionPopin\n    ? [styles.correctionPopinWrapper, translateUp.animatedStyle]\n    : styles.correctionPopinWrapper;\n\n  return (\n    <Animated.View style={style}>\n      <ReviewCorrectionPopin {..._correctionPopinProps} />\n    </Animated.View>\n  );\n};\n\ntype StyleSheetType = {\n  questionHeading: ViewStyle;\n  questionOriginContainer: ViewStyle;\n  questionOrigin: TextStyle;\n  questionTextContainer: ViewStyle;\n  questionText: TextStyle;\n  questionHelpContainer: ViewStyle;\n  questionHelp: TextStyle;\n  choicesScrollView: ViewStyle;\n  choicesScrollContent: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between',\n      alignItems: 'center'\n    },\n    questionOriginContainer: {\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      textAlign: 'center'\n    },\n    questionTextContainer: {\n      marginVertical: 4,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary\n    },\n    questionHelpContainer: {\n      marginVertical: 4\n    },\n    questionHelp: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.gray.medium,\n      marginBottom: 0,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    choicesScrollView: {\n      marginTop: 20,\n      width: '100%'\n    },\n    choicesScrollContent: {\n      flexGrow: 1,\n      justifyContent: 'space-around',\n      padding: 10\n    }\n  });\n\ntype QuestionProps = {\n  autoplayMedia: boolean;\n  answerUI: SlideProps['answerUI'];\n  isKeyboardVisible: boolean;\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {\n    answerUI,\n    questionText,\n    questionOrigin = '',\n    isKeyboardVisible,\n    autoplayMedia = false\n  } = props;\n  const {theme} = useTemplateContext();\n  const [style, setStyle] = useState<StyleSheetType>();\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme);\n    setStyle(questionStyle);\n  }, [theme]);\n\n  if (!answerUI || !questionText || !style) return null;\n\n  const hasVideoOrImage =\n    answerUI.media?.type && [TYPE_VIDEO, TYPE_IMAGE].includes(answerUI.media.type);\n\n  return (\n    <>\n      <View style={style.questionHeading}>\n        <View style={style.questionOriginContainer}>\n          <Html style={style.questionOrigin} isTextCentered>\n            {questionOrigin}\n          </Html>\n        </View>\n        <View style={style.questionTextContainer}>\n          <Html style={style.questionText} isTextCentered>\n            {questionText}\n          </Html>\n        </View>\n        <View style={style.questionHelpContainer}>\n          <Html style={style.questionHelp}>{get('help', answerUI)}</Html>\n        </View>\n      </View>\n      <ScrollView\n        style={style.choicesScrollView}\n        contentContainerStyle={style.choicesScrollContent}\n        showsHorizontalScrollIndicator={false}\n        showsVerticalScrollIndicator={false}\n      >\n        {!isKeyboardVisible && hasVideoOrImage ? (\n          <MediaView media={answerUI.media} autoplay={autoplayMedia} />\n        ) : null}\n        <View\n          style={{\n            marginTop: hasVideoOrImage ? 30 : 0\n          }}\n        >\n          <Answer {...answerUI} />\n        </View>\n      </ScrollView>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n  hiddenBackgroundToLockActions: ViewStyle;\n};\n\nconst createSlideStyle = (\n  num: number,\n  screenWidth: number,\n  isKeyboardVisible: boolean\n): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    hiddenBackgroundToLockActions: {\n      position: 'absolute',\n      left: 0,\n      right: 0,\n      top: 0,\n      bottom: 0,\n      backgroundColor: '#00000000'\n    },\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: (isKeyboardVisible ? 5 : 34) + num * 5,\n      backgroundColor: '#fff', // theme.colors.white\n      height: '90%',\n      width: slideWidth,\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      padding: 25,\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.05,\n      shadowRadius: 16,\n      elevation: 10 - num * 1,\n      borderRadius: 16\n    }\n  });\n};\n\nconst Slide = (props: ReviewSlideProps) => {\n  const {animatedStyle, slide, correctionPopinProps, validateButton, num, slideIndex = '0'} = props;\n  const [isValidated, setValidated] = useState<boolean>(false);\n\n  const isKeyboardVisible = useMobileKeyboardVisibility();\n\n  const handleValidatePress = useCallback(() => {\n    Keyboard.dismiss();\n    setValidated(true);\n\n    // calling the onclick later, after react has rerendered, to display the locking BG as soon as possible\n    setTimeout(() => {\n      validateButton.onClick();\n    }, 20);\n\n    // only to create on mount\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const {width} = useWindowDimensions();\n  const slideStyle = useMemo(\n    () => createSlideStyle(num, width, isKeyboardVisible),\n    [num, width, isKeyboardVisible]\n  );\n  const isFirstSlide = num === 1;\n\n  const {\n    loading,\n    parentContentTitle,\n    questionText,\n    answerUI,\n    showCorrectionPopin,\n    animateCorrectionPopin\n  } = slide;\n\n  if (loading) {\n    return <View style={slideStyle.slide} />;\n  }\n\n  return (\n    <Animated.View style={[slideStyle.slide, animatedStyle]}>\n      <Question\n        questionOrigin={parentContentTitle}\n        questionText={questionText}\n        answerUI={answerUI}\n        autoplayMedia={isFirstSlide}\n        isKeyboardVisible={isKeyboardVisible}\n        key=\"question-container\"\n      />\n      {isKeyboardVisible ? null : (\n        <Button\n          disabled={isValidated || validateButton.disabled}\n          submitValue={validateButton.label}\n          onPress={handleValidatePress}\n          testID={`slide-validate-button-${slideIndex}`}\n        />\n      )}\n      {isValidated ? <View style={slideStyle.hiddenBackgroundToLockActions} /> : null}\n      {correctionPopinProps ? (\n        <CorrectionPopin\n          correctionPopinProps={correctionPopinProps}\n          slideIndex={slideIndex}\n          showCorrectionPopin={showCorrectionPopin}\n          animateCorrectionPopin={animateCorrectionPopin}\n          key=\"correction-popin\"\n        />\n      ) : null}\n    </Animated.View>\n  );\n};\n\nexport default Slide;\n"],"mappings":"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"}

package/es/template/mobile-login/receive-email/index.native.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export declare type Props = {
+    locales: {
+        title: string;
+        explanation: string;
+        subtitle: string;
+        cta: string;
+    };
+    onClose: () => void;
+};
+declare const ReceiveEmail: (props: Props) => JSX.Element;
+export default ReceiveEmail;
+//# sourceMappingURL=index.native.d.ts.map

package/es/template/mobile-login/receive-email/index.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../src/template/mobile-login/receive-email/index.native.tsx"],"names":[],"mappings":";AAuHA,oBAAY,KAAK,GAAG;IAClB,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,WAAW,EAAE,MAAM,CAAC;QACpB,QAAQ,EAAE,MAAM,CAAC;QACjB,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IACF,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,QAAA,MAAM,YAAY,UAAW,KAAK,gBAoEjC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/es/template/mobile-login/receive-email/index.native.js

@@ -0,0 +1,184 @@
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { Animated, Easing, StyleSheet, Text, TextInput, View } from 'react-native';
+import { NovaCompositionNavigationLeftArrow as ArrowIcon, NovaCompositionCoorpacademyEmail as MailIcon, NovaCompositionCoorpacademySendEmail as SendIcon } from '@coorpacademy/nova-icons';
+import Touchable from '../../../hoc/touchable/index.native';
+import useMobileKeyboardVisibility from '../../../util/use-mobile-keyboard-visibility';
+const styles = StyleSheet.create({
+  container: {
+    width: '100%',
+    height: '100%',
+    flex: 1,
+    alignItems: 'flex-start',
+    paddingVertical: 50,
+    paddingHorizontal: 24
+  },
+  contentWrapper: {
+    width: '100%'
+  },
+  backButton: {
+    paddingVertical: 20
+  },
+  arrowIcon: {
+    fill: '#515161',
+    width: 24,
+    height: 15
+  },
+  mailIconWrapper: {
+    backgroundColor: '#f1f6fe',
+    width: 64,
+    height: 64,
+    padding: 23,
+    marginVertical: 24,
+    borderRadius: 16,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  mailIcon: {
+    fill: '#0061ff',
+    width: 24,
+    height: 18
+  },
+  innerMailIcon: {
+    fill: '#515161',
+    width: 16,
+    height: 12,
+    marginTop: -30,
+    marginLeft: 16
+  },
+  title: {
+    color: '#1D1D2B',
+    fontSize: 24,
+    fontWeight: '600',
+    lineHeight: 32,
+    textAlign: 'left',
+    marginBottom: 12
+  },
+  explanation: {
+    color: '#515161',
+    fontSize: 17,
+    letterSpacing: 0.4,
+    fontWeight: '500',
+    lineHeight: 22,
+    textAlign: 'left',
+    marginBottom: 24
+  },
+  subtitle: {
+    color: '#1D1D2B',
+    fontSize: 15,
+    fontWeight: '600',
+    lineHeight: 20,
+    textAlign: 'left',
+    marginBottom: 8
+  },
+  textInput: {
+    height: 48,
+    width: '100%',
+    backgroundColor: '#F4F4F5',
+    fontSize: 15,
+    lineHeight: 16,
+    alignContent: 'center',
+    color: '#515161',
+    borderRadius: 7,
+    paddingHorizontal: 40
+  },
+  ctaWrapper: {
+    width: '100%'
+  },
+  ctaButton: {
+    borderRadius: 12,
+    paddingHorizontal: 50,
+    paddingVertical: 16,
+    flexDirection: 'row',
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginTop: 30
+  },
+  sendIcon: {
+    fill: '#fff',
+    width: 16,
+    height: 16,
+    marginRight: 8
+  },
+  ctaText: {
+    color: '#fff',
+    fontWeight: '700',
+    fontSize: 15,
+    lineHeight: 24
+  }
+});
+const enabledColor = '#0061ff';
+const disabledColor = '#9999A8';
+const emailRegex = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
+
+const ReceiveEmail = props => {
+  const {
+    locales,
+    onClose
+  } = props;
+  const [isValid, setValid] = useState(false);
+  const isKeyboardVisible = useMobileKeyboardVisibility();
+  const handleChangeText = useCallback(value => {
+    setValid(emailRegex.test(value));
+  }, []);
+  const animationRef = useRef(new Animated.Value(0)).current;
+  const animatedOpacity = animationRef.interpolate({
+    inputRange: [0, 1],
+    outputRange: [0, 1]
+  });
+  useEffect(() => {
+    const animation = Animated.timing(animationRef, {
+      toValue: isValid ? 1 : 0,
+      duration: 250,
+      easing: Easing.out(Easing.sin),
+      useNativeDriver: false
+    });
+    animation.start();
+  }, [animationRef, isValid]);
+  return /*#__PURE__*/React.createElement(View, {
+    style: [styles.container, {
+      justifyContent: isKeyboardVisible ? 'flex-start' : 'space-between'
+    }],
+    testID: "receive-email"
+  }, /*#__PURE__*/React.createElement(View, {
+    style: styles.contentWrapper
+  }, /*#__PURE__*/React.createElement(Touchable, {
+    style: styles.backButton,
+    onPress: onClose
+  }, /*#__PURE__*/React.createElement(ArrowIcon, {
+    style: styles.arrowIcon
+  })), isKeyboardVisible ? null : /*#__PURE__*/React.createElement(View, {
+    style: styles.mailIconWrapper
+  }, /*#__PURE__*/React.createElement(MailIcon, {
+    style: styles.mailIcon
+  })), /*#__PURE__*/React.createElement(Text, {
+    style: styles.title
+  }, locales.title), /*#__PURE__*/React.createElement(Text, {
+    style: styles.explanation
+  }, locales.explanation), /*#__PURE__*/React.createElement(Text, {
+    style: styles.subtitle
+  }, locales.subtitle), /*#__PURE__*/React.createElement(TextInput, {
+    style: styles.textInput,
+    placeholder: "john.doe@company.com",
+    placeholderTextColor: disabledColor,
+    onChangeText: handleChangeText
+  }), /*#__PURE__*/React.createElement(MailIcon, {
+    style: styles.innerMailIcon
+  })), /*#__PURE__*/React.createElement(Animated.View, {
+    style: [styles.ctaWrapper, {
+      opacity: animatedOpacity
+    }]
+  }, /*#__PURE__*/React.createElement(Touchable, {
+    disabled: !isValid,
+    style: [styles.ctaButton, {
+      backgroundColor: isValid ? enabledColor : disabledColor
+    }],
+    onPress: onClose
+  }, /*#__PURE__*/React.createElement(SendIcon, {
+    style: styles.sendIcon
+  }), /*#__PURE__*/React.createElement(Text, {
+    style: styles.ctaText
+  }, locales.cta))));
+};
+
+export default ReceiveEmail;
+//# sourceMappingURL=index.native.js.map

package/es/template/mobile-login/receive-email/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.js","names":["React","useCallback","useEffect","useRef","useState","Animated","Easing","StyleSheet","Text","TextInput","View","NovaCompositionNavigationLeftArrow","ArrowIcon","NovaCompositionCoorpacademyEmail","MailIcon","NovaCompositionCoorpacademySendEmail","SendIcon","Touchable","useMobileKeyboardVisibility","styles","create","container","width","height","flex","alignItems","paddingVertical","paddingHorizontal","contentWrapper","backButton","arrowIcon","fill","mailIconWrapper","backgroundColor","padding","marginVertical","borderRadius","justifyContent","mailIcon","innerMailIcon","marginTop","marginLeft","title","color","fontSize","fontWeight","lineHeight","textAlign","marginBottom","explanation","letterSpacing","subtitle","textInput","alignContent","ctaWrapper","ctaButton","flexDirection","sendIcon","marginRight","ctaText","enabledColor","disabledColor","emailRegex","ReceiveEmail","props","locales","onClose","isValid","setValid","isKeyboardVisible","handleChangeText","value","test","animationRef","Value","current","animatedOpacity","interpolate","inputRange","outputRange","animation","timing","toValue","duration","easing","out","sin","useNativeDriver","start","opacity","cta"],"sources":["../../../../src/template/mobile-login/receive-email/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useRef, useState} from 'react';\nimport {Animated, Easing, StyleSheet, Text, TextInput, View} from 'react-native';\nimport {\n  NovaCompositionNavigationLeftArrow as ArrowIcon,\n  NovaCompositionCoorpacademyEmail as MailIcon,\n  NovaCompositionCoorpacademySendEmail as SendIcon\n} from '@coorpacademy/nova-icons';\n\nimport Touchable from '../../../hoc/touchable/index.native';\nimport useMobileKeyboardVisibility from '../../../util/use-mobile-keyboard-visibility';\n\nconst styles = StyleSheet.create({\n  container: {\n    width: '100%',\n    height: '100%',\n    flex: 1,\n    alignItems: 'flex-start',\n    paddingVertical: 50,\n    paddingHorizontal: 24\n  },\n  contentWrapper: {\n    width: '100%'\n  },\n  backButton: {\n    paddingVertical: 20\n  },\n  arrowIcon: {\n    fill: '#515161',\n    width: 24,\n    height: 15\n  },\n  mailIconWrapper: {\n    backgroundColor: '#f1f6fe',\n    width: 64,\n    height: 64,\n    padding: 23,\n    marginVertical: 24,\n    borderRadius: 16,\n    justifyContent: 'center',\n    alignItems: 'center'\n  },\n  mailIcon: {\n    fill: '#0061ff',\n    width: 24,\n    height: 18\n  },\n  innerMailIcon: {\n    fill: '#515161',\n    width: 16,\n    height: 12,\n    marginTop: -30,\n    marginLeft: 16\n  },\n  title: {\n    color: '#1D1D2B',\n    fontSize: 24,\n    fontWeight: '600',\n    lineHeight: 32,\n    textAlign: 'left',\n    marginBottom: 12\n  },\n  explanation: {\n    color: '#515161',\n    fontSize: 17,\n    letterSpacing: 0.4,\n    fontWeight: '500',\n    lineHeight: 22,\n    textAlign: 'left',\n    marginBottom: 24\n  },\n  subtitle: {\n    color: '#1D1D2B',\n    fontSize: 15,\n    fontWeight: '600',\n    lineHeight: 20,\n    textAlign: 'left',\n    marginBottom: 8\n  },\n  textInput: {\n    height: 48,\n    width: '100%',\n    backgroundColor: '#F4F4F5',\n    fontSize: 15,\n    lineHeight: 16,\n    alignContent: 'center',\n    color: '#515161',\n    borderRadius: 7,\n    paddingHorizontal: 40\n  },\n  ctaWrapper: {\n    width: '100%'\n  },\n  ctaButton: {\n    borderRadius: 12,\n    paddingHorizontal: 50,\n    paddingVertical: 16,\n    flexDirection: 'row',\n    justifyContent: 'center',\n    alignItems: 'center',\n    marginTop: 30\n  },\n  sendIcon: {\n    fill: '#fff',\n    width: 16,\n    height: 16,\n    marginRight: 8\n  },\n  ctaText: {\n    color: '#fff',\n    fontWeight: '700',\n    fontSize: 15,\n    lineHeight: 24\n  }\n});\n\nconst enabledColor = '#0061ff';\nconst disabledColor = '#9999A8';\nconst emailRegex = /^\\w+([-+.']\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$/;\n\nexport type Props = {\n  locales: {\n    title: string;\n    explanation: string;\n    subtitle: string;\n    cta: string;\n  };\n  onClose: () => void;\n};\n\nconst ReceiveEmail = (props: Props) => {\n  const {locales, onClose} = props;\n\n  const [isValid, setValid] = useState<boolean>(false);\n  const isKeyboardVisible = useMobileKeyboardVisibility();\n\n  const handleChangeText = useCallback(value => {\n    setValid(emailRegex.test(value));\n  }, []);\n\n  const animationRef = useRef<Animated.Value>(new Animated.Value(0)).current;\n  const animatedOpacity = animationRef.interpolate({\n    inputRange: [0, 1],\n    outputRange: [0, 1]\n  });\n\n  useEffect(() => {\n    const animation = Animated.timing(animationRef, {\n      toValue: isValid ? 1 : 0,\n      duration: 250,\n      easing: Easing.out(Easing.sin),\n      useNativeDriver: false\n    });\n\n    animation.start();\n  }, [animationRef, isValid]);\n\n  return (\n    <View\n      style={[\n        styles.container,\n        {justifyContent: isKeyboardVisible ? 'flex-start' : 'space-between'}\n      ]}\n      testID=\"receive-email\"\n    >\n      <View style={styles.contentWrapper}>\n        <Touchable style={styles.backButton} onPress={onClose}>\n          <ArrowIcon style={styles.arrowIcon} />\n        </Touchable>\n        {isKeyboardVisible ? null : (\n          <View style={styles.mailIconWrapper}>\n            <MailIcon style={styles.mailIcon} />\n          </View>\n        )}\n        <Text style={styles.title}>{locales.title}</Text>\n        <Text style={styles.explanation}>{locales.explanation}</Text>\n        <Text style={styles.subtitle}>{locales.subtitle}</Text>\n        <TextInput\n          style={styles.textInput}\n          placeholder=\"john.doe@company.com\"\n          placeholderTextColor={disabledColor}\n          onChangeText={handleChangeText}\n        />\n        <MailIcon style={styles.innerMailIcon} />\n      </View>\n\n      <Animated.View style={[styles.ctaWrapper, {opacity: animatedOpacity}]}>\n        <Touchable\n          disabled={!isValid}\n          style={[styles.ctaButton, {backgroundColor: isValid ? enabledColor : disabledColor}]}\n          onPress={onClose}\n        >\n          <SendIcon style={styles.sendIcon} />\n          <Text style={styles.ctaText}>{locales.cta}</Text>\n        </Touchable>\n      </Animated.View>\n    </View>\n  );\n};\n\nexport default ReceiveEmail;\n"],"mappings":"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"}

package/es/util/use-mobile-keyboard-visibility.d.ts

@@ -0,0 +1,3 @@
+declare const useMobileKeyboardVisibility: () => boolean;
+export default useMobileKeyboardVisibility;
+//# sourceMappingURL=use-mobile-keyboard-visibility.d.ts.map

package/es/util/use-mobile-keyboard-visibility.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-mobile-keyboard-visibility.d.ts","sourceRoot":"","sources":["../../src/util/use-mobile-keyboard-visibility.tsx"],"names":[],"mappings":"AAGA,QAAA,MAAM,2BAA2B,eAyBhC,CAAC;AAEF,eAAe,2BAA2B,CAAC"}

package/es/util/use-mobile-keyboard-visibility.js

@@ -0,0 +1,22 @@
+import { useEffect, useState } from 'react';
+import { Keyboard, Platform } from 'react-native';
+
+const useMobileKeyboardVisibility = () => {
+  const [isKeyboardVisible, setKeyboardVisible] = useState(false);
+  useEffect(() => {
+    const showListener = Keyboard.addListener(Platform.OS === 'ios' ? 'keyboardWillShow' : 'keyboardDidShow', () => {
+      setKeyboardVisible(true);
+    });
+    const hideListener = Keyboard.addListener(Platform.OS === 'ios' ? 'keyboardWillHide' : 'keyboardDidHide', () => {
+      setKeyboardVisible(false);
+    });
+    return () => {
+      showListener.remove();
+      hideListener.remove();
+    };
+  }, []);
+  return isKeyboardVisible;
+};
+
+export default useMobileKeyboardVisibility;
+//# sourceMappingURL=use-mobile-keyboard-visibility.js.map

package/es/util/use-mobile-keyboard-visibility.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-mobile-keyboard-visibility.js","names":["useEffect","useState","Keyboard","Platform","useMobileKeyboardVisibility","isKeyboardVisible","setKeyboardVisible","showListener","addListener","OS","hideListener","remove"],"sources":["../../src/util/use-mobile-keyboard-visibility.tsx"],"sourcesContent":["import {useEffect, useState} from 'react';\nimport {Keyboard, Platform} from 'react-native';\n\nconst useMobileKeyboardVisibility = () => {\n  const [isKeyboardVisible, setKeyboardVisible] = useState<boolean>(false);\n\n  useEffect(() => {\n    const showListener = Keyboard.addListener(\n      Platform.OS === 'ios' ? 'keyboardWillShow' : 'keyboardDidShow',\n      () => {\n        setKeyboardVisible(true);\n      }\n    );\n\n    const hideListener = Keyboard.addListener(\n      Platform.OS === 'ios' ? 'keyboardWillHide' : 'keyboardDidHide',\n      () => {\n        setKeyboardVisible(false);\n      }\n    );\n\n    return () => {\n      showListener.remove();\n      hideListener.remove();\n    };\n  }, []);\n\n  return isKeyboardVisible;\n};\n\nexport default useMobileKeyboardVisibility;\n"],"mappings":"AAAA,SAAQA,SAAR,EAAmBC,QAAnB,QAAkC,OAAlC;AACA,SAAQC,QAAR,EAAkBC,QAAlB,QAAiC,cAAjC;;AAEA,MAAMC,2BAA2B,GAAG,MAAM;EACxC,MAAM,CAACC,iBAAD,EAAoBC,kBAApB,IAA0CL,QAAQ,CAAU,KAAV,CAAxD;EAEAD,SAAS,CAAC,MAAM;IACd,MAAMO,YAAY,GAAGL,QAAQ,CAACM,WAAT,CACnBL,QAAQ,CAACM,EAAT,KAAgB,KAAhB,GAAwB,kBAAxB,GAA6C,iBAD1B,EAEnB,MAAM;MACJH,kBAAkB,CAAC,IAAD,CAAlB;IACD,CAJkB,CAArB;IAOA,MAAMI,YAAY,GAAGR,QAAQ,CAACM,WAAT,CACnBL,QAAQ,CAACM,EAAT,KAAgB,KAAhB,GAAwB,kBAAxB,GAA6C,iBAD1B,EAEnB,MAAM;MACJH,kBAAkB,CAAC,KAAD,CAAlB;IACD,CAJkB,CAArB;IAOA,OAAO,MAAM;MACXC,YAAY,CAACI,MAAb;MACAD,YAAY,CAACC,MAAb;IACD,CAHD;EAID,CAnBQ,EAmBN,EAnBM,CAAT;EAqBA,OAAON,iBAAP;AACD,CAzBD;;AA2BA,eAAeD,2BAAf"}

package/lib/organism/review-slide/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-slide/index.native.tsx"],"names":[],"mappings":";AA0BA,OAAO,EAAa,gBAAgB,EAAa,MAAM,cAAc,CAAC;AAoQtE,QAAA,MAAM,KAAK,UAAW,gBAAgB,gBAmFrC,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-slide/index.native.tsx"],"names":[],"mappings":";AA2BA,OAAO,EAAa,gBAAgB,EAAa,MAAM,cAAc,CAAC;AAoQtE,QAAA,MAAM,KAAK,UAAW,gBAAgB,gBAqErC,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/lib/organism/review-slide/index.native.js

@@ -27,6 +27,8 @@ var _index4 = _interopRequireDefault(require("../../molecule/video-player-mobile
 
 var _index5 = _interopRequireDefault(require("../../atom/html/index.native"));
 
+var _useMobileKeyboardVisibility = _interopRequireDefault(require("../../util/use-mobile-keyboard-visibility"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -269,21 +271,7 @@ const Slide = props => {
     slideIndex = '0'
   } = props;
   const [isValidated, setValidated] = (0, _react.useState)(false);
-  const [isKeyboardVisible, setKeyboardVisible] = (0, _react.useState)(false);
-  (0, _react.useEffect)(() => {
-    const showListener = _reactNative.Keyboard.addListener('keyboardDidShow', () => {
-      setKeyboardVisible(true);
-    });
-
-    const hideListener = _reactNative.Keyboard.addListener('keyboardDidHide', () => {
-      setKeyboardVisible(false);
-    });
-
-    return () => {
-      showListener.remove();
-      hideListener.remove();
-    };
-  }, []);
+  const isKeyboardVisible = (0, _useMobileKeyboardVisibility.default)();
   const handleValidatePress = (0, _react.useCallback)(() => {
     _reactNative.Keyboard.dismiss();
 

package/lib/organism/review-slide/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["styles","StyleSheet","create","mediaContainer","alignItems","justifyContent","width","height","borderRadius","overflow","image","flex","correctionPopinWrapper","position","bottom","MediaView","media","autoplay","type","TYPE_VIDEO","TYPE_IMAGE","uri","url","split","TYPE_AUDIO","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","translateUp","useTranslateY","fromValue","toValue","duration","easing","Easing","bezier","useEffect","start","klf","getOr","undefined","information","label","message","next","get","onClick","_correctionPopinProps","resultLabel","style","animatedStyle","createQuestionStyle","theme","questionHeading","questionOriginContainer","marginBottom","spacing","tiny","marginTop","small","questionOrigin","fontSize","lineHeight","color","colors","text","primary","textAlign","questionTextContainer","marginVertical","questionText","fontWeight","questionHelpContainer","questionHelp","gray","medium","choicesScrollView","choicesScrollContent","flexGrow","padding","Question","props","answerUI","isKeyboardVisible","autoplayMedia","useTemplateContext","setStyle","useState","questionStyle","hasVideoOrImage","includes","createSlideStyle","num","screenWidth","slideWidth","hiddenBackgroundToLockActions","left","right","top","backgroundColor","slide","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","validateButton","isValidated","setValidated","setKeyboardVisible","showListener","Keyboard","addListener","hideListener","remove","handleValidatePress","useCallback","dismiss","setTimeout","useWindowDimensions","slideStyle","useMemo","isFirstSlide","loading","parentContentTitle","disabled"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useMemo, useState} from 'react';\n\nimport {\n  Animated,\n  Easing,\n  Image,\n  Keyboard,\n  ScrollView,\n  StyleSheet,\n  TextStyle,\n  useWindowDimensions,\n  View,\n  ViewStyle\n} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport {useTranslateY} from '@coorpacademy/react-native-animation';\nimport Answer from '../../molecule/answer/index.native';\nimport ReviewCorrectionPopin from '../../molecule/review-correction-popin/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Button from '../../atom/button/index.native';\nimport {TYPE_AUDIO, TYPE_IMAGE, TYPE_VIDEO} from '../../molecule/answer/prop-types';\nimport Video from '../../molecule/video-player-mobile/index.native';\nimport {Media} from '../../molecule/questions/types';\nimport Html from '../../atom/html/index.native';\nimport {PopinProps, ReviewSlideProps, SlideProps} from './prop-types';\n\nconst styles = StyleSheet.create({\n  mediaContainer: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '100%',\n    height: 200,\n    borderRadius: 10,\n    overflow: 'hidden'\n  },\n  image: {\n    flex: 1,\n    width: '100%'\n  },\n  correctionPopinWrapper: {\n    position: 'absolute',\n    bottom: 16,\n    width: '105%'\n  }\n});\n\nconst MediaView = ({media, autoplay}: {media?: Media; autoplay: boolean}) => {\n  if (!media) {\n    return null;\n  }\n\n  switch (media.type) {\n    case TYPE_VIDEO:\n      return (\n        <View style={styles.mediaContainer}>\n          <Video media={media} autoplay={autoplay} />\n        </View>\n      );\n    case TYPE_IMAGE: {\n      const uri = `https://${media.url?.split('//')[1]}`;\n      return <Image style={[styles.mediaContainer, styles.image]} source={{uri}} />;\n    }\n    case TYPE_AUDIO:\n    default:\n      return null;\n  }\n};\n\nconst CorrectionPopin = ({\n  correctionPopinProps,\n  slideIndex,\n  showCorrectionPopin,\n  animateCorrectionPopin\n}: PopinProps) => {\n  const translateUp = useTranslateY({\n    fromValue: 500,\n    toValue: 0,\n    duration: 500,\n    easing: Easing.bezier(0.34, 1.36, 0.64, 1)\n  });\n\n  // the translation is required only once on mount\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(() => translateUp.start(), []);\n\n  if (!showCorrectionPopin) return null;\n\n  const klf = getOr(undefined, 'klf', correctionPopinProps);\n  const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n  const next = get('next', correctionPopinProps);\n  const onClick = get(['next', 'onClick'], correctionPopinProps);\n\n  const _correctionPopinProps = {\n    next: {\n      onClick,\n      label: next && next.label,\n      'data-name': `next-question-button-${slideIndex}`,\n      'aria-label': next && next['aria-label']\n    },\n    klf,\n    information,\n    type: correctionPopinProps.type,\n    resultLabel: correctionPopinProps.resultLabel\n  };\n\n  const style = animateCorrectionPopin\n    ? [styles.correctionPopinWrapper, translateUp.animatedStyle]\n    : styles.correctionPopinWrapper;\n\n  return (\n    <Animated.View style={style}>\n      <ReviewCorrectionPopin {..._correctionPopinProps} />\n    </Animated.View>\n  );\n};\n\ntype StyleSheetType = {\n  questionHeading: ViewStyle;\n  questionOriginContainer: ViewStyle;\n  questionOrigin: TextStyle;\n  questionTextContainer: ViewStyle;\n  questionText: TextStyle;\n  questionHelpContainer: ViewStyle;\n  questionHelp: TextStyle;\n  choicesScrollView: ViewStyle;\n  choicesScrollContent: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between',\n      alignItems: 'center'\n    },\n    questionOriginContainer: {\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      textAlign: 'center'\n    },\n    questionTextContainer: {\n      marginVertical: 4,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary\n    },\n    questionHelpContainer: {\n      marginVertical: 4\n    },\n    questionHelp: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.gray.medium,\n      marginBottom: 0,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    choicesScrollView: {\n      marginTop: 20,\n      width: '100%'\n    },\n    choicesScrollContent: {\n      flexGrow: 1,\n      justifyContent: 'space-around',\n      padding: 10\n    }\n  });\n\ntype QuestionProps = {\n  autoplayMedia: boolean;\n  answerUI: SlideProps['answerUI'];\n  isKeyboardVisible: boolean;\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {\n    answerUI,\n    questionText,\n    questionOrigin = '',\n    isKeyboardVisible,\n    autoplayMedia = false\n  } = props;\n  const {theme} = useTemplateContext();\n  const [style, setStyle] = useState<StyleSheetType>();\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme);\n    setStyle(questionStyle);\n  }, [theme]);\n\n  if (!answerUI || !questionText || !style) return null;\n\n  const hasVideoOrImage =\n    answerUI.media?.type && [TYPE_VIDEO, TYPE_IMAGE].includes(answerUI.media.type);\n\n  return (\n    <>\n      <View style={style.questionHeading}>\n        <View style={style.questionOriginContainer}>\n          <Html style={style.questionOrigin} isTextCentered>\n            {questionOrigin}\n          </Html>\n        </View>\n        <View style={style.questionTextContainer}>\n          <Html style={style.questionText} isTextCentered>\n            {questionText}\n          </Html>\n        </View>\n        <View style={style.questionHelpContainer}>\n          <Html style={style.questionHelp}>{get('help', answerUI)}</Html>\n        </View>\n      </View>\n      <ScrollView\n        style={style.choicesScrollView}\n        contentContainerStyle={style.choicesScrollContent}\n        showsHorizontalScrollIndicator={false}\n        showsVerticalScrollIndicator={false}\n      >\n        {!isKeyboardVisible && hasVideoOrImage ? (\n          <MediaView media={answerUI.media} autoplay={autoplayMedia} />\n        ) : null}\n        <View\n          style={{\n            marginTop: hasVideoOrImage ? 30 : 0\n          }}\n        >\n          <Answer {...answerUI} />\n        </View>\n      </ScrollView>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n  hiddenBackgroundToLockActions: ViewStyle;\n};\n\nconst createSlideStyle = (\n  num: number,\n  screenWidth: number,\n  isKeyboardVisible: boolean\n): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    hiddenBackgroundToLockActions: {\n      position: 'absolute',\n      left: 0,\n      right: 0,\n      top: 0,\n      bottom: 0,\n      backgroundColor: '#00000000'\n    },\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: (isKeyboardVisible ? 5 : 34) + num * 5,\n      backgroundColor: '#fff', // theme.colors.white\n      height: '90%',\n      width: slideWidth,\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      padding: 25,\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.05,\n      shadowRadius: 16,\n      elevation: 10 - num * 1,\n      borderRadius: 16\n    }\n  });\n};\n\nconst Slide = (props: ReviewSlideProps) => {\n  const {animatedStyle, slide, correctionPopinProps, validateButton, num, slideIndex = '0'} = props;\n  const [isValidated, setValidated] = useState<boolean>(false);\n  const [isKeyboardVisible, setKeyboardVisible] = useState<boolean>(false);\n\n  useEffect(() => {\n    const showListener = Keyboard.addListener('keyboardDidShow', () => {\n      setKeyboardVisible(true);\n    });\n\n    const hideListener = Keyboard.addListener('keyboardDidHide', () => {\n      setKeyboardVisible(false);\n    });\n\n    return () => {\n      showListener.remove();\n      hideListener.remove();\n    };\n  }, []);\n\n  const handleValidatePress = useCallback(() => {\n    Keyboard.dismiss();\n    setValidated(true);\n\n    // calling the onclick later, after react has rerendered, to display the locking BG as soon as possible\n    setTimeout(() => {\n      validateButton.onClick();\n    }, 20);\n\n    // only to create on mount\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const {width} = useWindowDimensions();\n  const slideStyle = useMemo(\n    () => createSlideStyle(num, width, isKeyboardVisible),\n    [num, width, isKeyboardVisible]\n  );\n  const isFirstSlide = num === 1;\n\n  const {\n    loading,\n    parentContentTitle,\n    questionText,\n    answerUI,\n    showCorrectionPopin,\n    animateCorrectionPopin\n  } = slide;\n\n  if (loading) {\n    return <View style={slideStyle.slide} />;\n  }\n\n  return (\n    <Animated.View style={[slideStyle.slide, animatedStyle]}>\n      <Question\n        questionOrigin={parentContentTitle}\n        questionText={questionText}\n        answerUI={answerUI}\n        autoplayMedia={isFirstSlide}\n        isKeyboardVisible={isKeyboardVisible}\n        key=\"question-container\"\n      />\n      {isKeyboardVisible ? null : (\n        <Button\n          disabled={isValidated || validateButton.disabled}\n          submitValue={validateButton.label}\n          onPress={handleValidatePress}\n          testID={`slide-validate-button-${slideIndex}`}\n        />\n      )}\n      {isValidated ? <View style={slideStyle.hiddenBackgroundToLockActions} /> : null}\n      {correctionPopinProps ? (\n        <CorrectionPopin\n          correctionPopinProps={correctionPopinProps}\n          slideIndex={slideIndex}\n          showCorrectionPopin={showCorrectionPopin}\n          animateCorrectionPopin={animateCorrectionPopin}\n          key=\"correction-popin\"\n        />\n      ) : null}\n    </Animated.View>\n  );\n};\n\nexport default Slide;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["styles","StyleSheet","create","mediaContainer","alignItems","justifyContent","width","height","borderRadius","overflow","image","flex","correctionPopinWrapper","position","bottom","MediaView","media","autoplay","type","TYPE_VIDEO","TYPE_IMAGE","uri","url","split","TYPE_AUDIO","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","translateUp","useTranslateY","fromValue","toValue","duration","easing","Easing","bezier","useEffect","start","klf","getOr","undefined","information","label","message","next","get","onClick","_correctionPopinProps","resultLabel","style","animatedStyle","createQuestionStyle","theme","questionHeading","questionOriginContainer","marginBottom","spacing","tiny","marginTop","small","questionOrigin","fontSize","lineHeight","color","colors","text","primary","textAlign","questionTextContainer","marginVertical","questionText","fontWeight","questionHelpContainer","questionHelp","gray","medium","choicesScrollView","choicesScrollContent","flexGrow","padding","Question","props","answerUI","isKeyboardVisible","autoplayMedia","useTemplateContext","setStyle","useState","questionStyle","hasVideoOrImage","includes","createSlideStyle","num","screenWidth","slideWidth","hiddenBackgroundToLockActions","left","right","top","backgroundColor","slide","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","validateButton","isValidated","setValidated","useMobileKeyboardVisibility","handleValidatePress","useCallback","Keyboard","dismiss","setTimeout","useWindowDimensions","slideStyle","useMemo","isFirstSlide","loading","parentContentTitle","disabled"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useMemo, useState} from 'react';\n\nimport {\n  Animated,\n  Easing,\n  Image,\n  Keyboard,\n  ScrollView,\n  StyleSheet,\n  TextStyle,\n  useWindowDimensions,\n  View,\n  ViewStyle\n} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport {useTranslateY} from '@coorpacademy/react-native-animation';\nimport Answer from '../../molecule/answer/index.native';\nimport ReviewCorrectionPopin from '../../molecule/review-correction-popin/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Button from '../../atom/button/index.native';\nimport {TYPE_AUDIO, TYPE_IMAGE, TYPE_VIDEO} from '../../molecule/answer/prop-types';\nimport Video from '../../molecule/video-player-mobile/index.native';\nimport {Media} from '../../molecule/questions/types';\nimport Html from '../../atom/html/index.native';\nimport useMobileKeyboardVisibility from '../../util/use-mobile-keyboard-visibility';\nimport {PopinProps, ReviewSlideProps, SlideProps} from './prop-types';\n\nconst styles = StyleSheet.create({\n  mediaContainer: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '100%',\n    height: 200,\n    borderRadius: 10,\n    overflow: 'hidden'\n  },\n  image: {\n    flex: 1,\n    width: '100%'\n  },\n  correctionPopinWrapper: {\n    position: 'absolute',\n    bottom: 16,\n    width: '105%'\n  }\n});\n\nconst MediaView = ({media, autoplay}: {media?: Media; autoplay: boolean}) => {\n  if (!media) {\n    return null;\n  }\n\n  switch (media.type) {\n    case TYPE_VIDEO:\n      return (\n        <View style={styles.mediaContainer}>\n          <Video media={media} autoplay={autoplay} />\n        </View>\n      );\n    case TYPE_IMAGE: {\n      const uri = `https://${media.url?.split('//')[1]}`;\n      return <Image style={[styles.mediaContainer, styles.image]} source={{uri}} />;\n    }\n    case TYPE_AUDIO:\n    default:\n      return null;\n  }\n};\n\nconst CorrectionPopin = ({\n  correctionPopinProps,\n  slideIndex,\n  showCorrectionPopin,\n  animateCorrectionPopin\n}: PopinProps) => {\n  const translateUp = useTranslateY({\n    fromValue: 500,\n    toValue: 0,\n    duration: 500,\n    easing: Easing.bezier(0.34, 1.36, 0.64, 1)\n  });\n\n  // the translation is required only once on mount\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(() => translateUp.start(), []);\n\n  if (!showCorrectionPopin) return null;\n\n  const klf = getOr(undefined, 'klf', correctionPopinProps);\n  const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n  const next = get('next', correctionPopinProps);\n  const onClick = get(['next', 'onClick'], correctionPopinProps);\n\n  const _correctionPopinProps = {\n    next: {\n      onClick,\n      label: next && next.label,\n      'data-name': `next-question-button-${slideIndex}`,\n      'aria-label': next && next['aria-label']\n    },\n    klf,\n    information,\n    type: correctionPopinProps.type,\n    resultLabel: correctionPopinProps.resultLabel\n  };\n\n  const style = animateCorrectionPopin\n    ? [styles.correctionPopinWrapper, translateUp.animatedStyle]\n    : styles.correctionPopinWrapper;\n\n  return (\n    <Animated.View style={style}>\n      <ReviewCorrectionPopin {..._correctionPopinProps} />\n    </Animated.View>\n  );\n};\n\ntype StyleSheetType = {\n  questionHeading: ViewStyle;\n  questionOriginContainer: ViewStyle;\n  questionOrigin: TextStyle;\n  questionTextContainer: ViewStyle;\n  questionText: TextStyle;\n  questionHelpContainer: ViewStyle;\n  questionHelp: TextStyle;\n  choicesScrollView: ViewStyle;\n  choicesScrollContent: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between',\n      alignItems: 'center'\n    },\n    questionOriginContainer: {\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      textAlign: 'center'\n    },\n    questionTextContainer: {\n      marginVertical: 4,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary\n    },\n    questionHelpContainer: {\n      marginVertical: 4\n    },\n    questionHelp: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.gray.medium,\n      marginBottom: 0,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    choicesScrollView: {\n      marginTop: 20,\n      width: '100%'\n    },\n    choicesScrollContent: {\n      flexGrow: 1,\n      justifyContent: 'space-around',\n      padding: 10\n    }\n  });\n\ntype QuestionProps = {\n  autoplayMedia: boolean;\n  answerUI: SlideProps['answerUI'];\n  isKeyboardVisible: boolean;\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {\n    answerUI,\n    questionText,\n    questionOrigin = '',\n    isKeyboardVisible,\n    autoplayMedia = false\n  } = props;\n  const {theme} = useTemplateContext();\n  const [style, setStyle] = useState<StyleSheetType>();\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme);\n    setStyle(questionStyle);\n  }, [theme]);\n\n  if (!answerUI || !questionText || !style) return null;\n\n  const hasVideoOrImage =\n    answerUI.media?.type && [TYPE_VIDEO, TYPE_IMAGE].includes(answerUI.media.type);\n\n  return (\n    <>\n      <View style={style.questionHeading}>\n        <View style={style.questionOriginContainer}>\n          <Html style={style.questionOrigin} isTextCentered>\n            {questionOrigin}\n          </Html>\n        </View>\n        <View style={style.questionTextContainer}>\n          <Html style={style.questionText} isTextCentered>\n            {questionText}\n          </Html>\n        </View>\n        <View style={style.questionHelpContainer}>\n          <Html style={style.questionHelp}>{get('help', answerUI)}</Html>\n        </View>\n      </View>\n      <ScrollView\n        style={style.choicesScrollView}\n        contentContainerStyle={style.choicesScrollContent}\n        showsHorizontalScrollIndicator={false}\n        showsVerticalScrollIndicator={false}\n      >\n        {!isKeyboardVisible && hasVideoOrImage ? (\n          <MediaView media={answerUI.media} autoplay={autoplayMedia} />\n        ) : null}\n        <View\n          style={{\n            marginTop: hasVideoOrImage ? 30 : 0\n          }}\n        >\n          <Answer {...answerUI} />\n        </View>\n      </ScrollView>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n  hiddenBackgroundToLockActions: ViewStyle;\n};\n\nconst createSlideStyle = (\n  num: number,\n  screenWidth: number,\n  isKeyboardVisible: boolean\n): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    hiddenBackgroundToLockActions: {\n      position: 'absolute',\n      left: 0,\n      right: 0,\n      top: 0,\n      bottom: 0,\n      backgroundColor: '#00000000'\n    },\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: (isKeyboardVisible ? 5 : 34) + num * 5,\n      backgroundColor: '#fff', // theme.colors.white\n      height: '90%',\n      width: slideWidth,\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      padding: 25,\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.05,\n      shadowRadius: 16,\n      elevation: 10 - num * 1,\n      borderRadius: 16\n    }\n  });\n};\n\nconst Slide = (props: ReviewSlideProps) => {\n  const {animatedStyle, slide, correctionPopinProps, validateButton, num, slideIndex = '0'} = props;\n  const [isValidated, setValidated] = useState<boolean>(false);\n\n  const isKeyboardVisible = useMobileKeyboardVisibility();\n\n  const handleValidatePress = useCallback(() => {\n    Keyboard.dismiss();\n    setValidated(true);\n\n    // calling the onclick later, after react has rerendered, to display the locking BG as soon as possible\n    setTimeout(() => {\n      validateButton.onClick();\n    }, 20);\n\n    // only to create on mount\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const {width} = useWindowDimensions();\n  const slideStyle = useMemo(\n    () => createSlideStyle(num, width, isKeyboardVisible),\n    [num, width, isKeyboardVisible]\n  );\n  const isFirstSlide = num === 1;\n\n  const {\n    loading,\n    parentContentTitle,\n    questionText,\n    answerUI,\n    showCorrectionPopin,\n    animateCorrectionPopin\n  } = slide;\n\n  if (loading) {\n    return <View style={slideStyle.slide} />;\n  }\n\n  return (\n    <Animated.View style={[slideStyle.slide, animatedStyle]}>\n      <Question\n        questionOrigin={parentContentTitle}\n        questionText={questionText}\n        answerUI={answerUI}\n        autoplayMedia={isFirstSlide}\n        isKeyboardVisible={isKeyboardVisible}\n        key=\"question-container\"\n      />\n      {isKeyboardVisible ? null : (\n        <Button\n          disabled={isValidated || validateButton.disabled}\n          submitValue={validateButton.label}\n          onPress={handleValidatePress}\n          testID={`slide-validate-button-${slideIndex}`}\n        />\n      )}\n      {isValidated ? <View style={slideStyle.hiddenBackgroundToLockActions} /> : null}\n      {correctionPopinProps ? (\n        <CorrectionPopin\n          correctionPopinProps={correctionPopinProps}\n          slideIndex={slideIndex}\n          showCorrectionPopin={showCorrectionPopin}\n          animateCorrectionPopin={animateCorrectionPopin}\n          key=\"correction-popin\"\n        />\n      ) : null}\n    </Animated.View>\n  );\n};\n\nexport default Slide;\n"],"mappings":"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"}

package/lib/template/mobile-login/receive-email/index.native.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export declare type Props = {
+    locales: {
+        title: string;
+        explanation: string;
+        subtitle: string;
+        cta: string;
+    };
+    onClose: () => void;
+};
+declare const ReceiveEmail: (props: Props) => JSX.Element;
+export default ReceiveEmail;
+//# sourceMappingURL=index.native.d.ts.map

package/lib/template/mobile-login/receive-email/index.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../src/template/mobile-login/receive-email/index.native.tsx"],"names":[],"mappings":";AAuHA,oBAAY,KAAK,GAAG;IAClB,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,WAAW,EAAE,MAAM,CAAC;QACpB,QAAQ,EAAE,MAAM,CAAC;QACjB,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IACF,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,QAAA,MAAM,YAAY,UAAW,KAAK,gBAoEjC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/template/mobile-login/receive-email/index.native.js

@@ -0,0 +1,203 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactNative = require("react-native");
+
+var _novaIcons = require("@coorpacademy/nova-icons");
+
+var _index = _interopRequireDefault(require("../../../hoc/touchable/index.native"));
+
+var _useMobileKeyboardVisibility = _interopRequireDefault(require("../../../util/use-mobile-keyboard-visibility"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const styles = _reactNative.StyleSheet.create({
+  container: {
+    width: '100%',
+    height: '100%',
+    flex: 1,
+    alignItems: 'flex-start',
+    paddingVertical: 50,
+    paddingHorizontal: 24
+  },
+  contentWrapper: {
+    width: '100%'
+  },
+  backButton: {
+    paddingVertical: 20
+  },
+  arrowIcon: {
+    fill: '#515161',
+    width: 24,
+    height: 15
+  },
+  mailIconWrapper: {
+    backgroundColor: '#f1f6fe',
+    width: 64,
+    height: 64,
+    padding: 23,
+    marginVertical: 24,
+    borderRadius: 16,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  mailIcon: {
+    fill: '#0061ff',
+    width: 24,
+    height: 18
+  },
+  innerMailIcon: {
+    fill: '#515161',
+    width: 16,
+    height: 12,
+    marginTop: -30,
+    marginLeft: 16
+  },
+  title: {
+    color: '#1D1D2B',
+    fontSize: 24,
+    fontWeight: '600',
+    lineHeight: 32,
+    textAlign: 'left',
+    marginBottom: 12
+  },
+  explanation: {
+    color: '#515161',
+    fontSize: 17,
+    letterSpacing: 0.4,
+    fontWeight: '500',
+    lineHeight: 22,
+    textAlign: 'left',
+    marginBottom: 24
+  },
+  subtitle: {
+    color: '#1D1D2B',
+    fontSize: 15,
+    fontWeight: '600',
+    lineHeight: 20,
+    textAlign: 'left',
+    marginBottom: 8
+  },
+  textInput: {
+    height: 48,
+    width: '100%',
+    backgroundColor: '#F4F4F5',
+    fontSize: 15,
+    lineHeight: 16,
+    alignContent: 'center',
+    color: '#515161',
+    borderRadius: 7,
+    paddingHorizontal: 40
+  },
+  ctaWrapper: {
+    width: '100%'
+  },
+  ctaButton: {
+    borderRadius: 12,
+    paddingHorizontal: 50,
+    paddingVertical: 16,
+    flexDirection: 'row',
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginTop: 30
+  },
+  sendIcon: {
+    fill: '#fff',
+    width: 16,
+    height: 16,
+    marginRight: 8
+  },
+  ctaText: {
+    color: '#fff',
+    fontWeight: '700',
+    fontSize: 15,
+    lineHeight: 24
+  }
+});
+
+const enabledColor = '#0061ff';
+const disabledColor = '#9999A8';
+const emailRegex = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
+
+const ReceiveEmail = props => {
+  const {
+    locales,
+    onClose
+  } = props;
+  const [isValid, setValid] = (0, _react.useState)(false);
+  const isKeyboardVisible = (0, _useMobileKeyboardVisibility.default)();
+  const handleChangeText = (0, _react.useCallback)(value => {
+    setValid(emailRegex.test(value));
+  }, []);
+  const animationRef = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
+  const animatedOpacity = animationRef.interpolate({
+    inputRange: [0, 1],
+    outputRange: [0, 1]
+  });
+  (0, _react.useEffect)(() => {
+    const animation = _reactNative.Animated.timing(animationRef, {
+      toValue: isValid ? 1 : 0,
+      duration: 250,
+      easing: _reactNative.Easing.out(_reactNative.Easing.sin),
+      useNativeDriver: false
+    });
+
+    animation.start();
+  }, [animationRef, isValid]);
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styles.container, {
+      justifyContent: isKeyboardVisible ? 'flex-start' : 'space-between'
+    }],
+    testID: "receive-email"
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.contentWrapper
+  }, /*#__PURE__*/_react.default.createElement(_index.default, {
+    style: styles.backButton,
+    onPress: onClose
+  }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationLeftArrow, {
+    style: styles.arrowIcon
+  })), isKeyboardVisible ? null : /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.mailIconWrapper
+  }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademyEmail, {
+    style: styles.mailIcon
+  })), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: styles.title
+  }, locales.title), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: styles.explanation
+  }, locales.explanation), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: styles.subtitle
+  }, locales.subtitle), /*#__PURE__*/_react.default.createElement(_reactNative.TextInput, {
+    style: styles.textInput,
+    placeholder: "john.doe@company.com",
+    placeholderTextColor: disabledColor,
+    onChangeText: handleChangeText
+  }), /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademyEmail, {
+    style: styles.innerMailIcon
+  })), /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
+    style: [styles.ctaWrapper, {
+      opacity: animatedOpacity
+    }]
+  }, /*#__PURE__*/_react.default.createElement(_index.default, {
+    disabled: !isValid,
+    style: [styles.ctaButton, {
+      backgroundColor: isValid ? enabledColor : disabledColor
+    }],
+    onPress: onClose
+  }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademySendEmail, {
+    style: styles.sendIcon
+  }), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: styles.ctaText
+  }, locales.cta))));
+};
+
+var _default = ReceiveEmail;
+exports.default = _default;
+//# sourceMappingURL=index.native.js.map

package/lib/template/mobile-login/receive-email/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.js","names":["styles","StyleSheet","create","container","width","height","flex","alignItems","paddingVertical","paddingHorizontal","contentWrapper","backButton","arrowIcon","fill","mailIconWrapper","backgroundColor","padding","marginVertical","borderRadius","justifyContent","mailIcon","innerMailIcon","marginTop","marginLeft","title","color","fontSize","fontWeight","lineHeight","textAlign","marginBottom","explanation","letterSpacing","subtitle","textInput","alignContent","ctaWrapper","ctaButton","flexDirection","sendIcon","marginRight","ctaText","enabledColor","disabledColor","emailRegex","ReceiveEmail","props","locales","onClose","isValid","setValid","useState","isKeyboardVisible","useMobileKeyboardVisibility","handleChangeText","useCallback","value","test","animationRef","useRef","Animated","Value","current","animatedOpacity","interpolate","inputRange","outputRange","useEffect","animation","timing","toValue","duration","easing","Easing","out","sin","useNativeDriver","start","opacity","cta"],"sources":["../../../../src/template/mobile-login/receive-email/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useRef, useState} from 'react';\nimport {Animated, Easing, StyleSheet, Text, TextInput, View} from 'react-native';\nimport {\n  NovaCompositionNavigationLeftArrow as ArrowIcon,\n  NovaCompositionCoorpacademyEmail as MailIcon,\n  NovaCompositionCoorpacademySendEmail as SendIcon\n} from '@coorpacademy/nova-icons';\n\nimport Touchable from '../../../hoc/touchable/index.native';\nimport useMobileKeyboardVisibility from '../../../util/use-mobile-keyboard-visibility';\n\nconst styles = StyleSheet.create({\n  container: {\n    width: '100%',\n    height: '100%',\n    flex: 1,\n    alignItems: 'flex-start',\n    paddingVertical: 50,\n    paddingHorizontal: 24\n  },\n  contentWrapper: {\n    width: '100%'\n  },\n  backButton: {\n    paddingVertical: 20\n  },\n  arrowIcon: {\n    fill: '#515161',\n    width: 24,\n    height: 15\n  },\n  mailIconWrapper: {\n    backgroundColor: '#f1f6fe',\n    width: 64,\n    height: 64,\n    padding: 23,\n    marginVertical: 24,\n    borderRadius: 16,\n    justifyContent: 'center',\n    alignItems: 'center'\n  },\n  mailIcon: {\n    fill: '#0061ff',\n    width: 24,\n    height: 18\n  },\n  innerMailIcon: {\n    fill: '#515161',\n    width: 16,\n    height: 12,\n    marginTop: -30,\n    marginLeft: 16\n  },\n  title: {\n    color: '#1D1D2B',\n    fontSize: 24,\n    fontWeight: '600',\n    lineHeight: 32,\n    textAlign: 'left',\n    marginBottom: 12\n  },\n  explanation: {\n    color: '#515161',\n    fontSize: 17,\n    letterSpacing: 0.4,\n    fontWeight: '500',\n    lineHeight: 22,\n    textAlign: 'left',\n    marginBottom: 24\n  },\n  subtitle: {\n    color: '#1D1D2B',\n    fontSize: 15,\n    fontWeight: '600',\n    lineHeight: 20,\n    textAlign: 'left',\n    marginBottom: 8\n  },\n  textInput: {\n    height: 48,\n    width: '100%',\n    backgroundColor: '#F4F4F5',\n    fontSize: 15,\n    lineHeight: 16,\n    alignContent: 'center',\n    color: '#515161',\n    borderRadius: 7,\n    paddingHorizontal: 40\n  },\n  ctaWrapper: {\n    width: '100%'\n  },\n  ctaButton: {\n    borderRadius: 12,\n    paddingHorizontal: 50,\n    paddingVertical: 16,\n    flexDirection: 'row',\n    justifyContent: 'center',\n    alignItems: 'center',\n    marginTop: 30\n  },\n  sendIcon: {\n    fill: '#fff',\n    width: 16,\n    height: 16,\n    marginRight: 8\n  },\n  ctaText: {\n    color: '#fff',\n    fontWeight: '700',\n    fontSize: 15,\n    lineHeight: 24\n  }\n});\n\nconst enabledColor = '#0061ff';\nconst disabledColor = '#9999A8';\nconst emailRegex = /^\\w+([-+.']\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$/;\n\nexport type Props = {\n  locales: {\n    title: string;\n    explanation: string;\n    subtitle: string;\n    cta: string;\n  };\n  onClose: () => void;\n};\n\nconst ReceiveEmail = (props: Props) => {\n  const {locales, onClose} = props;\n\n  const [isValid, setValid] = useState<boolean>(false);\n  const isKeyboardVisible = useMobileKeyboardVisibility();\n\n  const handleChangeText = useCallback(value => {\n    setValid(emailRegex.test(value));\n  }, []);\n\n  const animationRef = useRef<Animated.Value>(new Animated.Value(0)).current;\n  const animatedOpacity = animationRef.interpolate({\n    inputRange: [0, 1],\n    outputRange: [0, 1]\n  });\n\n  useEffect(() => {\n    const animation = Animated.timing(animationRef, {\n      toValue: isValid ? 1 : 0,\n      duration: 250,\n      easing: Easing.out(Easing.sin),\n      useNativeDriver: false\n    });\n\n    animation.start();\n  }, [animationRef, isValid]);\n\n  return (\n    <View\n      style={[\n        styles.container,\n        {justifyContent: isKeyboardVisible ? 'flex-start' : 'space-between'}\n      ]}\n      testID=\"receive-email\"\n    >\n      <View style={styles.contentWrapper}>\n        <Touchable style={styles.backButton} onPress={onClose}>\n          <ArrowIcon style={styles.arrowIcon} />\n        </Touchable>\n        {isKeyboardVisible ? null : (\n          <View style={styles.mailIconWrapper}>\n            <MailIcon style={styles.mailIcon} />\n          </View>\n        )}\n        <Text style={styles.title}>{locales.title}</Text>\n        <Text style={styles.explanation}>{locales.explanation}</Text>\n        <Text style={styles.subtitle}>{locales.subtitle}</Text>\n        <TextInput\n          style={styles.textInput}\n          placeholder=\"john.doe@company.com\"\n          placeholderTextColor={disabledColor}\n          onChangeText={handleChangeText}\n        />\n        <MailIcon style={styles.innerMailIcon} />\n      </View>\n\n      <Animated.View style={[styles.ctaWrapper, {opacity: animatedOpacity}]}>\n        <Touchable\n          disabled={!isValid}\n          style={[styles.ctaButton, {backgroundColor: isValid ? enabledColor : disabledColor}]}\n          onPress={onClose}\n        >\n          <SendIcon style={styles.sendIcon} />\n          <Text style={styles.ctaText}>{locales.cta}</Text>\n        </Touchable>\n      </Animated.View>\n    </View>\n  );\n};\n\nexport default ReceiveEmail;\n"],"mappings":"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"}

package/lib/util/use-mobile-keyboard-visibility.d.ts

@@ -0,0 +1,3 @@
+declare const useMobileKeyboardVisibility: () => boolean;
+export default useMobileKeyboardVisibility;
+//# sourceMappingURL=use-mobile-keyboard-visibility.d.ts.map

package/lib/util/use-mobile-keyboard-visibility.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-mobile-keyboard-visibility.d.ts","sourceRoot":"","sources":["../../src/util/use-mobile-keyboard-visibility.tsx"],"names":[],"mappings":"AAGA,QAAA,MAAM,2BAA2B,eAyBhC,CAAC;AAEF,eAAe,2BAA2B,CAAC"}

package/lib/util/use-mobile-keyboard-visibility.js

@@ -0,0 +1,31 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _react = require("react");
+
+var _reactNative = require("react-native");
+
+const useMobileKeyboardVisibility = () => {
+  const [isKeyboardVisible, setKeyboardVisible] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
+    const showListener = _reactNative.Keyboard.addListener(_reactNative.Platform.OS === 'ios' ? 'keyboardWillShow' : 'keyboardDidShow', () => {
+      setKeyboardVisible(true);
+    });
+
+    const hideListener = _reactNative.Keyboard.addListener(_reactNative.Platform.OS === 'ios' ? 'keyboardWillHide' : 'keyboardDidHide', () => {
+      setKeyboardVisible(false);
+    });
+
+    return () => {
+      showListener.remove();
+      hideListener.remove();
+    };
+  }, []);
+  return isKeyboardVisible;
+};
+
+var _default = useMobileKeyboardVisibility;
+exports.default = _default;
+//# sourceMappingURL=use-mobile-keyboard-visibility.js.map

package/lib/util/use-mobile-keyboard-visibility.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-mobile-keyboard-visibility.js","names":["useMobileKeyboardVisibility","isKeyboardVisible","setKeyboardVisible","useState","useEffect","showListener","Keyboard","addListener","Platform","OS","hideListener","remove"],"sources":["../../src/util/use-mobile-keyboard-visibility.tsx"],"sourcesContent":["import {useEffect, useState} from 'react';\nimport {Keyboard, Platform} from 'react-native';\n\nconst useMobileKeyboardVisibility = () => {\n  const [isKeyboardVisible, setKeyboardVisible] = useState<boolean>(false);\n\n  useEffect(() => {\n    const showListener = Keyboard.addListener(\n      Platform.OS === 'ios' ? 'keyboardWillShow' : 'keyboardDidShow',\n      () => {\n        setKeyboardVisible(true);\n      }\n    );\n\n    const hideListener = Keyboard.addListener(\n      Platform.OS === 'ios' ? 'keyboardWillHide' : 'keyboardDidHide',\n      () => {\n        setKeyboardVisible(false);\n      }\n    );\n\n    return () => {\n      showListener.remove();\n      hideListener.remove();\n    };\n  }, []);\n\n  return isKeyboardVisible;\n};\n\nexport default useMobileKeyboardVisibility;\n"],"mappings":";;;;;AAAA;;AACA;;AAEA,MAAMA,2BAA2B,GAAG,MAAM;EACxC,MAAM,CAACC,iBAAD,EAAoBC,kBAApB,IAA0C,IAAAC,eAAA,EAAkB,KAAlB,CAAhD;EAEA,IAAAC,gBAAA,EAAU,MAAM;IACd,MAAMC,YAAY,GAAGC,qBAAA,CAASC,WAAT,CACnBC,qBAAA,CAASC,EAAT,KAAgB,KAAhB,GAAwB,kBAAxB,GAA6C,iBAD1B,EAEnB,MAAM;MACJP,kBAAkB,CAAC,IAAD,CAAlB;IACD,CAJkB,CAArB;;IAOA,MAAMQ,YAAY,GAAGJ,qBAAA,CAASC,WAAT,CACnBC,qBAAA,CAASC,EAAT,KAAgB,KAAhB,GAAwB,kBAAxB,GAA6C,iBAD1B,EAEnB,MAAM;MACJP,kBAAkB,CAAC,KAAD,CAAlB;IACD,CAJkB,CAArB;;IAOA,OAAO,MAAM;MACXG,YAAY,CAACM,MAAb;MACAD,YAAY,CAACC,MAAb;IACD,CAHD;EAID,CAnBD,EAmBG,EAnBH;EAqBA,OAAOV,iBAAP;AACD,CAzBD;;eA2BeD,2B"}

package/locales/.mtslconfig.json

@@ -0,0 +1 @@
+{"ignore_dirs":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "11.14.9",
+  "version": "11.14.10",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -56,7 +56,7 @@
     "Soualmi Djamel <djamel.soualmi@coorpacademy.com>"
   ],
   "dependencies": {
-    "@coorpacademy/nova-icons": "4.2.2",
+    "@coorpacademy/nova-icons": "4.2.3",
     "@coorpacademy/react-native-animation": "1.0.3",
     "@jwplayer/jwplayer-react": "^1.1.0",
     "@types/react": "^17.0.50",
@@ -168,5 +168,5 @@
     "last 2 versions",
     "IE 11"
   ],
-  "gitHead": "2504da4c90c44091d4593804c854834da35ced3b"
+  "gitHead": "c306b63dd14b956f43c81d9c99c0642a33dad055"
 }