@coorpacademy/components 11.2.7-alpha.3 → 11.2.8-alpha.3

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

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["React","useEffect","useRef","useState","Animated","ScrollView","StyleSheet","Text","LottieView","NovaCompositionCoorpacademyStar","StarIcon","NovaSolidVoteRewardsRewardsBadge5","RankIcon","sequence","parallel","useAnimateProp","useTranslateY","useTranslateX","useTemplateContext","Button","BOX_STYLE","CardCongrats","createStyleSheet","theme","create","congrats","position","width","height","flexDirection","alignItems","paddingVertical","flex","buttons","paddingHorizontal","justifyContent","title","fontWeight","fontSize","lineHeight","marginVertical","color","colors","text","primary","confettis","flexGrow","pointerEvents","scrollView","scrollViewContent","fadeIn","property","fromValue","toValue","duration","translateHorizontally","ReviewCongrats","props","ariaLabel","animationLottie","cardCongratsStar","cardCongratsRank","buttonRevising","buttonRevisingSkill","styleSheet","setStylesheet","isCongratsTranslationDone","setCongratsTranslationDone","isRankShown","setRankShown","scrollViewRef","showCongrats","onComplete","translateCongrats","showConfettis","fadeInRank","translateRank","setTimeout","current","scrollToEnd","animatedRank","animatedStyle","fadeInStars","delay","translateStars","showButton1","showButton2","congratsSequence","start","_stylesheet","handleContinueRevisingPress","onClick","handleReviseAnotherSkillPress","animationSrc","reviewCardTitle","reviewCardValue","rankSuffix","positive","battle","label","backgroundColor","uri"],"sources":["../../../src/organism/review-congrats/index.native.tsx"],"sourcesContent":["import React, {useEffect, useRef, useState} from 'react';\nimport {Animated, ScrollView, StyleSheet, Text, TextStyle, ViewStyle} from 'react-native';\nimport LottieView from 'lottie-react-native';\nimport {noop} from 'lodash/fp';\nimport {\n  NovaCompositionCoorpacademyStar as StarIcon,\n  NovaSolidVoteRewardsRewardsBadge5 as RankIcon\n} from '@coorpacademy/nova-icons';\nimport {\n  sequence,\n  parallel,\n  useAnimateProp,\n  useTranslateY,\n  useTranslateX\n} from '@coorpacademy/react-native-animation';\nimport type {AnimatePropParams} from '@coorpacademy/react-native-animation/es/use-animate-prop';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Button from '../../atom/button/index.native';\nimport {BOX_STYLE} from '../../variables/shadow';\nimport CardCongrats from '../../molecule/card-congrats/index.native';\nimport {ReviewCongratsProps} from './prop-types';\n\ntype StyleSheetType = {\n  buttons: ViewStyle;\n  congrats: ViewStyle;\n  confettis: ViewStyle;\n  scrollView: ViewStyle;\n  scrollViewContent: ViewStyle;\n  title: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    congrats: {\n      position: 'absolute',\n      width: '100%',\n      height: '100%',\n      flexDirection: 'column',\n      alignItems: 'center',\n      paddingVertical: 90,\n      flex: 1\n    },\n    buttons: {\n      width: '100%',\n      paddingHorizontal: 20,\n      flexDirection: 'column',\n      justifyContent: 'space-between',\n      flex: 1\n    },\n    title: {\n      fontWeight: '400',\n      fontSize: 32,\n      lineHeight: 40,\n      marginVertical: 20,\n      color: theme.colors.text.primary\n    },\n    confettis: {\n      flexGrow: 1,\n      position: 'absolute',\n      width: '100%',\n      height: '100%',\n      pointerEvents: 'box-none'\n    },\n    scrollView: {\n      height: 300\n    },\n    scrollViewContent: {\n      alignItems: 'center',\n      paddingHorizontal: 40\n    }\n  });\n\nconst fadeIn: AnimatePropParams = {\n  property: 'opacity',\n  fromValue: 0,\n  toValue: 1,\n  duration: 350\n};\n\nconst translateHorizontally = {\n  property: 'translateX',\n  fromValue: 180,\n  toValue: 0,\n  duration: 800\n};\n\nconst ReviewCongrats = (props: ReviewCongratsProps) => {\n  const {\n    'aria-label': ariaLabel,\n    animationLottie,\n    title,\n    cardCongratsStar,\n    cardCongratsRank,\n    buttonRevising,\n    buttonRevisingSkill\n  } = props;\n\n  const {theme} = useTemplateContext();\n\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const [isCongratsTranslationDone, setCongratsTranslationDone] = useState<boolean>(false);\n  const [isRankShown, setRankShown] = useState<boolean>(false);\n\n  const scrollViewRef = useRef<ScrollView>(null);\n\n  const showCongrats = useAnimateProp({\n    property: 'opacity',\n    fromValue: 0,\n    toValue: 1,\n    duration: 950,\n    onComplete: () => {\n      setCongratsTranslationDone(true);\n    }\n  });\n\n  const translateCongrats = useTranslateY({\n    fromValue: 100,\n    toValue: 0,\n    duration: 550\n  });\n\n  const showConfettis = useAnimateProp(fadeIn);\n  const fadeInRank = useAnimateProp(fadeIn);\n  const translateRank = useTranslateX({\n    ...translateHorizontally,\n    onComplete: () => {\n      setRankShown(true);\n      setTimeout(() => {\n        scrollViewRef?.current?.scrollToEnd();\n      }, 700);\n    }\n  });\n\n  const animatedRank = [fadeInRank.animatedStyle, translateRank.animatedStyle];\n\n  const fadeInStars = useAnimateProp({\n    ...fadeIn,\n    delay: 1000\n  });\n\n  const translateStars = useTranslateX({\n    ...translateHorizontally,\n    delay: 1000\n  });\n\n  const showButton1 = useAnimateProp(fadeIn);\n  const showButton2 = useAnimateProp(fadeIn);\n\n  const congratsSequence = sequence([\n    parallel([showCongrats, translateCongrats]),\n    parallel([showConfettis, fadeInRank, translateRank]),\n    parallel([fadeInStars, translateStars]),\n    sequence([showButton1, showButton2])\n  ]);\n\n  useEffect(() => {\n    congratsSequence.start();\n    // (required only once on mount)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  const handleContinueRevisingPress = buttonRevising?.onClick || noop;\n  const handleReviseAnotherSkillPress = buttonRevisingSkill?.onClick || noop;\n\n  return (\n    <Animated.View\n      style={[styleSheet.congrats, translateCongrats.animatedStyle, showCongrats.animatedStyle]}\n      accessibilityLabel={ariaLabel}\n    >\n      <Text style={styleSheet.title}>{title}</Text>\n      <ScrollView\n        ref={scrollViewRef}\n        horizontal\n        showsHorizontalScrollIndicator={false}\n        style={styleSheet.scrollView}\n        contentContainerStyle={styleSheet.scrollViewContent}\n      >\n        {cardCongratsRank ? (\n          <Animated.View style={animatedRank}>\n            <CardCongrats\n              animationUri={cardCongratsRank.animationLottie.animationSrc}\n              text={cardCongratsRank.reviewCardTitle}\n              value={`${cardCongratsRank.reviewCardValue} ${cardCongratsRank.rankSuffix}`}\n              Icon={RankIcon}\n              iconColor={theme.colors.positive}\n              textColor={theme.colors.text.primary}\n              direction=\"row-reverse\"\n            />\n          </Animated.View>\n        ) : null}\n        <Animated.View style={[fadeInStars.animatedStyle, translateStars.animatedStyle]}>\n          <CardCongrats\n            animationUri={isRankShown ? cardCongratsStar.animationLottie.animationSrc : null}\n            Icon={StarIcon}\n            text={cardCongratsStar.reviewCardTitle}\n            value={cardCongratsStar.reviewCardValue}\n            iconColor={theme.colors.battle}\n            textColor={theme.colors.battle}\n            direction=\"row\"\n          />\n        </Animated.View>\n      </ScrollView>\n\n      <Animated.View style={styleSheet.buttons}>\n        {buttonRevisingSkill ? (\n          <Animated.View style={showButton1.animatedStyle}>\n            <Button\n              onPress={handleReviseAnotherSkillPress}\n              accessibilityLabel={buttonRevisingSkill['aria-label']}\n              submitValue={buttonRevisingSkill.label}\n              style={{...BOX_STYLE, backgroundColor: '#fff'}}\n              textStyle={{color: '#123'}}\n            />\n          </Animated.View>\n        ) : null}\n        {buttonRevising ? (\n          <Animated.View style={showButton2.animatedStyle}>\n            <Button\n              onPress={handleContinueRevisingPress}\n              accessibilityLabel={buttonRevising['aria-label']}\n              submitValue={buttonRevising.label}\n            />\n          </Animated.View>\n        ) : null}\n      </Animated.View>\n\n      {isCongratsTranslationDone ? (\n        <Animated.View\n          pointerEvents=\"none\"\n          style={[styleSheet.confettis, showConfettis.animatedStyle]}\n        >\n          <LottieView source={{uri: animationLottie.animationSrc}} autoPlay loop={false} />\n        </Animated.View>\n      ) : null}\n    </Animated.View>\n  );\n};\n\nexport default ReviewCongrats;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["React","useEffect","useRef","useState","Animated","ScrollView","StyleSheet","Text","LottieView","NovaCompositionCoorpacademyStar","StarIcon","NovaSolidVoteRewardsRewardsBadge5","RankIcon","sequence","parallel","useAnimateProp","useTranslateY","useTranslateX","useTemplateContext","Button","BOX_STYLE","CardCongrats","createStyleSheet","theme","create","congrats","position","width","height","flexDirection","alignItems","paddingVertical","flex","buttons","paddingHorizontal","justifyContent","title","fontWeight","fontSize","lineHeight","marginVertical","color","colors","text","primary","confettis","flexGrow","pointerEvents","scrollView","scrollViewContent","fadeIn","property","fromValue","toValue","duration","translateHorizontally","ReviewCongrats","props","ariaLabel","animationLottie","cardCongratsStar","cardCongratsRank","buttonRevising","buttonRevisingSkill","styleSheet","setStylesheet","isCongratsTranslationDone","setCongratsTranslationDone","isRankShown","setRankShown","scrollViewRef","showCongrats","onComplete","translateCongrats","showConfettis","fadeInRank","translateRank","setTimeout","current","scrollToEnd","animatedRank","animatedStyle","fadeInStars","delay","translateStars","showButton1","showButton2","congratsSequence","start","_stylesheet","handleContinueRevisingPress","onClick","handleReviseAnotherSkillPress","showStarLottieAnimation","animationSrc","reviewCardTitle","reviewCardValue","rankSuffix","positive","battle","label","backgroundColor","uri"],"sources":["../../../src/organism/review-congrats/index.native.tsx"],"sourcesContent":["import React, {useEffect, useRef, useState} from 'react';\nimport {Animated, ScrollView, StyleSheet, Text, TextStyle, ViewStyle} from 'react-native';\nimport LottieView from 'lottie-react-native';\nimport {noop} from 'lodash/fp';\nimport {\n  NovaCompositionCoorpacademyStar as StarIcon,\n  NovaSolidVoteRewardsRewardsBadge5 as RankIcon\n} from '@coorpacademy/nova-icons';\nimport {\n  sequence,\n  parallel,\n  useAnimateProp,\n  useTranslateY,\n  useTranslateX\n} from '@coorpacademy/react-native-animation';\nimport type {AnimatePropParams} from '@coorpacademy/react-native-animation/es/use-animate-prop';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Button from '../../atom/button/index.native';\nimport {BOX_STYLE} from '../../variables/shadow';\nimport CardCongrats from '../../molecule/card-congrats/index.native';\nimport {ReviewCongratsProps} from './prop-types';\n\ntype StyleSheetType = {\n  buttons: ViewStyle;\n  congrats: ViewStyle;\n  confettis: ViewStyle;\n  scrollView: ViewStyle;\n  scrollViewContent: ViewStyle;\n  title: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    congrats: {\n      position: 'absolute',\n      width: '100%',\n      height: '100%',\n      flexDirection: 'column',\n      alignItems: 'center',\n      paddingVertical: 90,\n      flex: 1\n    },\n    buttons: {\n      width: '100%',\n      paddingHorizontal: 20,\n      flexDirection: 'column',\n      justifyContent: 'space-between',\n      height: 114\n    },\n    title: {\n      fontWeight: '400',\n      fontSize: 32,\n      lineHeight: 40,\n      marginVertical: 20,\n      color: theme.colors.text.primary\n    },\n    confettis: {\n      flexGrow: 1,\n      position: 'absolute',\n      width: '100%',\n      height: '100%',\n      pointerEvents: 'box-none'\n    },\n    scrollView: {\n      height: 300\n    },\n    scrollViewContent: {\n      alignItems: 'center',\n      paddingHorizontal: 40\n    }\n  });\n\nconst fadeIn: AnimatePropParams = {\n  property: 'opacity',\n  fromValue: 0,\n  toValue: 1,\n  duration: 350\n};\n\nconst translateHorizontally = {\n  property: 'translateX',\n  fromValue: 180,\n  toValue: 0,\n  duration: 800\n};\n\nconst ReviewCongrats = (props: ReviewCongratsProps) => {\n  const {\n    'aria-label': ariaLabel,\n    animationLottie,\n    title,\n    cardCongratsStar,\n    cardCongratsRank,\n    buttonRevising,\n    buttonRevisingSkill\n  } = props;\n\n  const {theme} = useTemplateContext();\n\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const [isCongratsTranslationDone, setCongratsTranslationDone] = useState<boolean>(false);\n  const [isRankShown, setRankShown] = useState<boolean>(false);\n\n  const scrollViewRef = useRef<ScrollView>(null);\n\n  const showCongrats = useAnimateProp({\n    property: 'opacity',\n    fromValue: 0,\n    toValue: 1,\n    duration: 950,\n    onComplete: () => {\n      setCongratsTranslationDone(true);\n    }\n  });\n\n  const translateCongrats = useTranslateY({\n    fromValue: 100,\n    toValue: 0,\n    duration: 550\n  });\n\n  const showConfettis = useAnimateProp(fadeIn);\n  const fadeInRank = useAnimateProp(fadeIn);\n  const translateRank = useTranslateX({\n    ...translateHorizontally,\n    onComplete: () => {\n      setRankShown(true);\n      setTimeout(() => {\n        scrollViewRef?.current?.scrollToEnd();\n      }, 700);\n    }\n  });\n\n  const animatedRank = [fadeInRank.animatedStyle, translateRank.animatedStyle];\n\n  const fadeInStars = useAnimateProp({\n    ...fadeIn,\n    delay: cardCongratsRank ? 1000 : 0\n  });\n\n  const translateStars = useTranslateX({\n    ...translateHorizontally,\n    delay: cardCongratsRank ? 1000 : 0\n  });\n\n  const showButton1 = useAnimateProp(fadeIn);\n  const showButton2 = useAnimateProp(fadeIn);\n\n  const congratsSequence = sequence([\n    parallel([showCongrats, translateCongrats]),\n    parallel([\n      showConfettis,\n      cardCongratsRank\n        ? sequence([parallel([fadeInRank, translateRank]), parallel([fadeInStars, translateStars])])\n        : parallel([fadeInStars, translateStars])\n    ]),\n    sequence([showButton1, showButton2])\n  ]);\n\n  useEffect(() => {\n    congratsSequence.start();\n    // (required only once on mount)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  const handleContinueRevisingPress = buttonRevising?.onClick || noop;\n  const handleReviseAnotherSkillPress = buttonRevisingSkill?.onClick || noop;\n  const showStarLottieAnimation = !cardCongratsRank || isRankShown;\n\n  return (\n    <Animated.View\n      style={[styleSheet.congrats, translateCongrats.animatedStyle, showCongrats.animatedStyle]}\n      accessibilityLabel={ariaLabel}\n    >\n      <Text style={styleSheet.title}>{title}</Text>\n      <ScrollView\n        ref={scrollViewRef}\n        horizontal\n        showsHorizontalScrollIndicator={false}\n        style={styleSheet.scrollView}\n        contentContainerStyle={styleSheet.scrollViewContent}\n      >\n        {cardCongratsRank ? (\n          <Animated.View style={animatedRank}>\n            <CardCongrats\n              animationUri={cardCongratsRank.animationLottie.animationSrc}\n              text={cardCongratsRank.reviewCardTitle}\n              value={`${cardCongratsRank.reviewCardValue} ${cardCongratsRank.rankSuffix}`}\n              Icon={RankIcon}\n              iconColor={theme.colors.positive}\n              textColor={theme.colors.text.primary}\n              direction=\"row-reverse\"\n            />\n          </Animated.View>\n        ) : null}\n        <Animated.View style={[fadeInStars.animatedStyle, translateStars.animatedStyle]}>\n          <CardCongrats\n            animationUri={\n              showStarLottieAnimation ? cardCongratsStar.animationLottie.animationSrc : null\n            }\n            Icon={StarIcon}\n            text={cardCongratsStar.reviewCardTitle}\n            value={cardCongratsStar.reviewCardValue}\n            iconColor={theme.colors.battle}\n            textColor={theme.colors.battle}\n            direction=\"row\"\n          />\n        </Animated.View>\n      </ScrollView>\n\n      <Animated.View style={styleSheet.buttons}>\n        {buttonRevisingSkill ? (\n          <Animated.View style={showButton1.animatedStyle}>\n            <Button\n              onPress={handleReviseAnotherSkillPress}\n              accessibilityLabel={buttonRevisingSkill['aria-label']}\n              submitValue={buttonRevisingSkill.label}\n              style={{...BOX_STYLE, backgroundColor: '#fff'}}\n              textStyle={{color: '#123'}}\n            />\n          </Animated.View>\n        ) : null}\n        {buttonRevising ? (\n          <Animated.View style={showButton2.animatedStyle}>\n            <Button\n              onPress={handleContinueRevisingPress}\n              accessibilityLabel={buttonRevising['aria-label']}\n              submitValue={buttonRevising.label}\n            />\n          </Animated.View>\n        ) : null}\n      </Animated.View>\n\n      {isCongratsTranslationDone ? (\n        <Animated.View\n          pointerEvents=\"none\"\n          style={[styleSheet.confettis, showConfettis.animatedStyle]}\n        >\n          <LottieView source={{uri: animationLottie.animationSrc}} autoPlay loop={false} />\n        </Animated.View>\n      ) : null}\n    </Animated.View>\n  );\n};\n\nexport default ReviewCongrats;\n"],"mappings":"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"}

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":";AAoBA,OAAO,EAAa,gBAAgB,EAAa,MAAM,cAAc,CAAC;AAwKtE,QAAA,MAAM,KAAK,UAAW,gBAAgB,gBA8CrC,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-slide/index.native.tsx"],"names":[],"mappings":";AAoBA,OAAO,EAAa,gBAAgB,EAAa,MAAM,cAAc,CAAC;AA0KtE,QAAA,MAAM,KAAK,UAAW,gBAAgB,gBA8CrC,CAAC;AAEF,eAAe,KAAK,CAAC"}

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

@@ -27,7 +27,9 @@ const CorrectionPopin = ({
     toValue: 0,
     duration: 500,
     easing: Easing.bezier(0.34, 1.36, 0.64, 1)
-  });
+  }); // the translation is required only once on mount
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+
   useEffect(() => translateUp.start(), []);
   if (!showCorrectionPopin) return null;
   const klf = getOr(undefined, 'klf', correctionPopinProps);

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

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["React","useEffect","useState","Animated","Easing","ScrollView","StyleSheet","useWindowDimensions","View","get","getOr","useTranslateY","Text","Answer","ReviewCorrectionPopin","useTemplateContext","Button","styles","create","correctionPopinWrapper","position","bottom","width","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","translateUp","fromValue","toValue","duration","easing","bezier","start","klf","undefined","information","label","message","next","onClick","_correctionPopinProps","type","resultLabel","style","animatedStyle","createQuestionStyle","theme","questionHeading","justifyContent","questionOrigin","fontSize","lineHeight","color","colors","text","primary","marginBottom","spacing","tiny","marginTop","small","textAlign","questionText","fontWeight","questionHelp","gray","medium","choicesScrollView","marginVertical","choicesScrollContent","padding","Question","props","answerUI","setStyle","questionStyle","createSlideStyle","num","screenWidth","slideWidth","slide","left","backgroundColor","height","alignItems","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","borderRadius","Slide","validateButton","slideStyle","loading","parentContentTitle","handleValidatePress","disabled"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {\n  Animated,\n  Easing,\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 Text from '../../atom/text/index.native';\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 {PopinProps, ReviewSlideProps, SlideProps} from './prop-types';\n\nconst styles = StyleSheet.create({\n  correctionPopinWrapper: {\n    position: 'absolute',\n    bottom: 16,\n    width: '105%'\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  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  questionOrigin: ViewStyle;\n  questionText: TextStyle;\n  questionHelp: ViewStyle;\n  choicesScrollView: ViewStyle;\n  choicesScrollContent: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between'\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary,\n      textAlign: 'center'\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      marginVertical: 20,\n      width: '100%'\n    },\n    choicesScrollContent: {\n      padding: 10\n    }\n  });\n\ntype QuestionProps = {\n  answerUI: SlideProps['answerUI'];\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {answerUI, questionText, questionOrigin} = 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  return (\n    <>\n      <View style={style.questionHeading}>\n        <Text style={style.questionOrigin}>{questionOrigin}</Text>\n        <Text style={style.questionText}>{questionText}</Text>\n        <Text style={style.questionHelp}>{get('help', answerUI)}</Text>\n      </View>\n      <ScrollView\n        style={style.choicesScrollView}\n        contentContainerStyle={style.choicesScrollContent}\n        centerContent\n        showsHorizontalScrollIndicator={false}\n        showsVerticalScrollIndicator={false}\n      >\n        <Answer {...answerUI} />\n      </ScrollView>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n};\n\nconst createSlideStyle = (num: number, screenWidth: number): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: 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\n  const {width} = useWindowDimensions();\n  const slideStyle = createSlideStyle(num, width);\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  const {onClick: handleValidatePress} = validateButton;\n\n  return (\n    <Animated.View style={[slideStyle.slide, animatedStyle]}>\n      <Question\n        questionOrigin={parentContentTitle}\n        questionText={questionText}\n        answerUI={answerUI}\n        key=\"question-container\"\n      />\n      <Button\n        disabled={validateButton.disabled}\n        submitValue={validateButton.label}\n        onPress={handleValidatePress}\n        testID={`slide-validate-button-${slideIndex}`}\n      />\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","useEffect","useState","Animated","Easing","ScrollView","StyleSheet","useWindowDimensions","View","get","getOr","useTranslateY","Text","Answer","ReviewCorrectionPopin","useTemplateContext","Button","styles","create","correctionPopinWrapper","position","bottom","width","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","translateUp","fromValue","toValue","duration","easing","bezier","start","klf","undefined","information","label","message","next","onClick","_correctionPopinProps","type","resultLabel","style","animatedStyle","createQuestionStyle","theme","questionHeading","justifyContent","questionOrigin","fontSize","lineHeight","color","colors","text","primary","marginBottom","spacing","tiny","marginTop","small","textAlign","questionText","fontWeight","questionHelp","gray","medium","choicesScrollView","marginVertical","choicesScrollContent","padding","Question","props","answerUI","setStyle","questionStyle","createSlideStyle","num","screenWidth","slideWidth","slide","left","backgroundColor","height","alignItems","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","borderRadius","Slide","validateButton","slideStyle","loading","parentContentTitle","handleValidatePress","disabled"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {\n  Animated,\n  Easing,\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 Text from '../../atom/text/index.native';\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 {PopinProps, ReviewSlideProps, SlideProps} from './prop-types';\n\nconst styles = StyleSheet.create({\n  correctionPopinWrapper: {\n    position: 'absolute',\n    bottom: 16,\n    width: '105%'\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  questionOrigin: ViewStyle;\n  questionText: TextStyle;\n  questionHelp: ViewStyle;\n  choicesScrollView: ViewStyle;\n  choicesScrollContent: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between'\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary,\n      textAlign: 'center'\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      marginVertical: 20,\n      width: '100%'\n    },\n    choicesScrollContent: {\n      padding: 10\n    }\n  });\n\ntype QuestionProps = {\n  answerUI: SlideProps['answerUI'];\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {answerUI, questionText, questionOrigin} = 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  return (\n    <>\n      <View style={style.questionHeading}>\n        <Text style={style.questionOrigin}>{questionOrigin}</Text>\n        <Text style={style.questionText}>{questionText}</Text>\n        <Text style={style.questionHelp}>{get('help', answerUI)}</Text>\n      </View>\n      <ScrollView\n        style={style.choicesScrollView}\n        contentContainerStyle={style.choicesScrollContent}\n        centerContent\n        showsHorizontalScrollIndicator={false}\n        showsVerticalScrollIndicator={false}\n      >\n        <Answer {...answerUI} />\n      </ScrollView>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n};\n\nconst createSlideStyle = (num: number, screenWidth: number): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: 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\n  const {width} = useWindowDimensions();\n  const slideStyle = createSlideStyle(num, width);\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  const {onClick: handleValidatePress} = validateButton;\n\n  return (\n    <Animated.View style={[slideStyle.slide, animatedStyle]}>\n      <Question\n        questionOrigin={parentContentTitle}\n        questionText={questionText}\n        answerUI={answerUI}\n        key=\"question-container\"\n      />\n      <Button\n        disabled={validateButton.disabled}\n        submitValue={validateButton.label}\n        onPress={handleValidatePress}\n        testID={`slide-validate-button-${slideIndex}`}\n      />\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/organism/review-stacked-slides/index.native.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="react" />
 import type { ReviewStackProps } from './prop-types';
-export declare const TOTAL_SLIDES_STACK = 5;
 declare const StackedSlides: (props: ReviewStackProps) => JSX.Element;
 export default StackedSlides;
 //# sourceMappingURL=index.native.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-stacked-slides/index.native.tsx"],"names":[],"mappings":";AAMA,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAEnD,eAAO,MAAM,kBAAkB,IAAI,CAAC;AAyBpC,QAAA,MAAM,aAAa,UAAW,gBAAgB,gBA2G7C,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-stacked-slides/index.native.tsx"],"names":[],"mappings":";AAKA,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAenD,QAAA,MAAM,aAAa,UAAW,gBAAgB,gBAuI7C,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/es/organism/review-stacked-slides/index.native.js

@@ -3,7 +3,6 @@ import { Animated, Easing, StyleSheet, useWindowDimensions } from 'react-native'
 import keys from 'lodash/fp/keys';
 import { useTranslateY } from '@coorpacademy/react-native-animation';
 import Slide from '../review-slide/index.native';
-export const TOTAL_SLIDES_STACK = 5;
 const style = StyleSheet.create({
   slides: {
     flex: 1,
@@ -11,26 +10,12 @@ const style = StyleSheet.create({
     width: '100%'
   }
 });
-
-const FakeSlide = ({
-  position,
-  validateButton
-}) => /*#__PURE__*/React.createElement(Slide, {
-  num: position,
-  slide: {
-    loading: true,
-    position
-  },
-  slideIndex: `${position}`,
-  validateButton: validateButton
-});
 /*
    - slides are ordered to be played from left to right: [0,1,2,3]
    - slides are piled on the view, so we need to reverse the order:
    -> it's like our eye is looking from the right [3,2,1,0] <-- oO
 */
 
-
 const StackedSlides = props => {
   const {
     height: windowHeight
@@ -42,7 +27,8 @@ const StackedSlides = props => {
     correctionPopinProps
   } = props;
   const [unstacked, setUnstacked] = useState([]);
-  const [restacked, setRestacked] = useState();
+  const [restacking, setRestacking] = useState(null);
+  const [restackingDone, setRestackingDone] = useState(false);
   const hideSlides = useTranslateY({
     fromValue: 0,
     toValue: windowHeight,
@@ -54,6 +40,12 @@ const StackedSlides = props => {
     duration: 500,
     easing: Easing.cubic
   });
+  const restackTranslation = useTranslateY({
+    toValue: 0,
+    fromValue: -windowHeight,
+    duration: 1200,
+    easing: Easing.out(Easing.cubic)
+  });
   useEffect(() => {
     if (endReview) {
       hideSlides.start();
@@ -63,10 +55,12 @@ const StackedSlides = props => {
   const unstackingSlide = keys(slides).find(k => slides[k].animationType === 'unstack');
   const remainingKeys = keys(slides).filter(k => slides[k].position >= 0 && !slides[k].animationType);
   const orderedKeys = remainingKeys.sort((k1, k2) => slides[k2].position > slides[k1].position ? 1 : -1);
-  const animatedSlide = restackingSlide || unstackingSlide;
+  const animatedFrontSlide = unstackingSlide || (restackingSlide && restacking === null ? restackingSlide : undefined);
+  const animatedRestackedSlide = restacking !== null;
   useEffect(() => {
-    if (restacked && orderedKeys.includes(restacked)) {
-      setRestacked(null);
+    if (restacking !== null && orderedKeys.includes(restacking)) {
+      setRestacking(null);
+      setRestackingDone(false);
     } // this effect is required only when the list orderedKeys changes
     // eslint-disable-next-line react-hooks/exhaustive-deps
 
@@ -81,18 +75,24 @@ const StackedSlides = props => {
     }
   }, [unstackingSlide, unstacked, setUnstacked, translateDown]);
   useEffect(() => {
-    const restacking = restackingSlide && restacked !== restackingSlide;
+    const startRestacking = !restackingDone && restackingSlide && restacking !== restackingSlide;
 
-    if (restacking) {
+    if (startRestacking) {
       translateDown.start(() => {
-        setRestacked(restackingSlide);
+        setRestacking(restackingSlide);
+        restackTranslation.start(() => {
+          setRestackingDone(true);
+        });
       });
-    }
-  }, [restackingSlide, restacked, setRestacked, translateDown]);
+    } // this effect is required only to trigger the restack animation when a new restackingSlide is set
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+
+  }, [restackingSlide, restacking]);
   const stackedSlides = orderedKeys.map((slideIndex, index) => {
     const slide = slides[slideIndex];
+    const num = orderedKeys.length - index;
     return /*#__PURE__*/React.createElement(Slide, {
-      num: orderedKeys.length - index,
+      num,
       slideIndex,
       slide,
       validateButton,
@@ -101,23 +101,28 @@ const StackedSlides = props => {
     });
   });
 
-  if (animatedSlide) {
+  if (animatedFrontSlide) {
     stackedSlides.push( /*#__PURE__*/React.createElement(Slide, {
       num: 0,
-      slideIndex: animatedSlide,
-      slide: slides[animatedSlide],
+      slideIndex: animatedFrontSlide,
+      slide: slides[animatedFrontSlide],
       validateButton,
       correctionPopinProps,
       animatedStyle: [translateDown.animatedStyle],
-      key: animatedSlide
+      key: animatedFrontSlide
     }));
   }
 
   return /*#__PURE__*/React.createElement(Animated.View, {
     style: [style.slides, hideSlides.animatedStyle]
-  }, restacked ? /*#__PURE__*/React.createElement(FakeSlide, {
-    position: orderedKeys.length + 1,
-    validateButton: validateButton
+  }, animatedRestackedSlide ? /*#__PURE__*/React.createElement(Slide, {
+    num: orderedKeys.length + 1,
+    slideIndex: restacking,
+    slide: slides[restacking],
+    validateButton,
+    correctionPopinProps,
+    animatedStyle: [restackTranslation.animatedStyle],
+    key: restacking
   }) : null, stackedSlides);
 };
 

package/es/organism/review-stacked-slides/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["React","useEffect","useState","Animated","Easing","StyleSheet","useWindowDimensions","keys","useTranslateY","Slide","TOTAL_SLIDES_STACK","style","create","slides","flex","height","width","FakeSlide","position","validateButton","loading","StackedSlides","props","windowHeight","endReview","correctionPopinProps","unstacked","setUnstacked","restacked","setRestacked","hideSlides","fromValue","toValue","duration","translateDown","easing","cubic","start","restackingSlide","find","k","animationType","unstackingSlide","remainingKeys","filter","orderedKeys","sort","k1","k2","animatedSlide","includes","toString","unstacking","restacking","stackedSlides","map","slideIndex","index","slide","num","length","push","animatedStyle"],"sources":["../../../src/organism/review-stacked-slides/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {Animated, Easing, StyleSheet, useWindowDimensions} from 'react-native';\nimport keys from 'lodash/fp/keys';\nimport {useTranslateY} from '@coorpacademy/react-native-animation';\nimport Slide from '../review-slide/index.native';\nimport type {ReviewSlideProps} from '../review-slide/prop-types';\nimport type {ReviewStackProps} from './prop-types';\n\nexport const TOTAL_SLIDES_STACK = 5;\n\nconst style = StyleSheet.create({\n  slides: {\n    flex: 1,\n    height: '100%',\n    width: '100%'\n  }\n});\n\ntype FakeSlideProps = {position: number; validateButton: ReviewSlideProps['validateButton']};\nconst FakeSlide = ({position, validateButton}: FakeSlideProps) => (\n  <Slide\n    num={position}\n    slide={{loading: true, position}}\n    slideIndex={`${position}`}\n    validateButton={validateButton}\n  />\n);\n\n/*\n   - slides are ordered to be played from left to right: [0,1,2,3]\n   - slides are piled on the view, so we need to reverse the order:\n   -> it's like our eye is looking from the right [3,2,1,0] <-- oO\n*/\nconst StackedSlides = (props: ReviewStackProps) => {\n  const {height: windowHeight} = useWindowDimensions();\n  const {endReview, slides, validateButton, correctionPopinProps} = props;\n  const [unstacked, setUnstacked] = useState<string[]>([]);\n  const [restacked, setRestacked] = useState<string | null>();\n\n  const hideSlides = useTranslateY({\n    fromValue: 0,\n    toValue: windowHeight,\n    duration: 800\n  });\n\n  const translateDown = useTranslateY({\n    fromValue: 0,\n    toValue: windowHeight - 100,\n    duration: 500,\n    easing: Easing.cubic\n  });\n\n  useEffect(() => {\n    if (endReview) {\n      hideSlides.start();\n    }\n  }, [endReview, hideSlides]);\n\n  const restackingSlide = keys(slides).find(k => slides[k].animationType === 'restack');\n  const unstackingSlide = keys(slides).find(k => slides[k].animationType === 'unstack');\n\n  const remainingKeys = keys(slides).filter(\n    k => slides[k].position >= 0 && !slides[k].animationType\n  );\n\n  const orderedKeys = remainingKeys.sort((k1, k2) =>\n    slides[k2].position > slides[k1].position ? 1 : -1\n  );\n\n  const animatedSlide = restackingSlide || unstackingSlide;\n\n  useEffect(() => {\n    if (restacked && orderedKeys.includes(restacked)) {\n      setRestacked(null);\n    }\n    // this effect is required only when the list orderedKeys changes\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [orderedKeys.toString()]);\n\n  useEffect(() => {\n    const unstacking = unstackingSlide && !unstacked.includes(unstackingSlide);\n\n    if (unstacking) {\n      translateDown.start(() => {\n        setUnstacked([...unstacked, unstackingSlide]);\n      });\n    }\n  }, [unstackingSlide, unstacked, setUnstacked, translateDown]);\n\n  useEffect(() => {\n    const restacking = restackingSlide && restacked !== restackingSlide;\n\n    if (restacking) {\n      translateDown.start(() => {\n        setRestacked(restackingSlide);\n      });\n    }\n  }, [restackingSlide, restacked, setRestacked, translateDown]);\n\n  const stackedSlides = orderedKeys.map((slideIndex, index) => {\n    const slide = slides[slideIndex];\n\n    return (\n      <Slide\n        {...{\n          num: orderedKeys.length - index,\n          slideIndex,\n          slide,\n          validateButton,\n          correctionPopinProps\n        }}\n        key={slideIndex}\n      />\n    );\n  });\n\n  if (animatedSlide) {\n    stackedSlides.push(\n      <Slide\n        {...{\n          num: 0,\n          slideIndex: animatedSlide,\n          slide: slides[animatedSlide],\n          validateButton,\n          correctionPopinProps\n        }}\n        animatedStyle={[translateDown.animatedStyle]}\n        key={animatedSlide}\n      />\n    );\n  }\n\n  return (\n    <Animated.View style={[style.slides, hideSlides.animatedStyle]}>\n      {restacked ? (\n        <FakeSlide position={orderedKeys.length + 1} validateButton={validateButton} />\n      ) : null}\n      {stackedSlides}\n    </Animated.View>\n  );\n};\n\nexport default StackedSlides;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["React","useEffect","useState","Animated","Easing","StyleSheet","useWindowDimensions","keys","useTranslateY","Slide","style","create","slides","flex","height","width","StackedSlides","props","windowHeight","endReview","validateButton","correctionPopinProps","unstacked","setUnstacked","restacking","setRestacking","restackingDone","setRestackingDone","hideSlides","fromValue","toValue","duration","translateDown","easing","cubic","restackTranslation","out","start","restackingSlide","find","k","animationType","unstackingSlide","remainingKeys","filter","position","orderedKeys","sort","k1","k2","animatedFrontSlide","undefined","animatedRestackedSlide","includes","toString","unstacking","startRestacking","stackedSlides","map","slideIndex","index","slide","num","length","push","animatedStyle"],"sources":["../../../src/organism/review-stacked-slides/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {Animated, Easing, StyleSheet, useWindowDimensions} from 'react-native';\nimport keys from 'lodash/fp/keys';\nimport {useTranslateY} from '@coorpacademy/react-native-animation';\nimport Slide from '../review-slide/index.native';\nimport type {ReviewStackProps} from './prop-types';\n\nconst style = StyleSheet.create({\n  slides: {\n    flex: 1,\n    height: '100%',\n    width: '100%'\n  }\n});\n\n/*\n   - slides are ordered to be played from left to right: [0,1,2,3]\n   - slides are piled on the view, so we need to reverse the order:\n   -> it's like our eye is looking from the right [3,2,1,0] <-- oO\n*/\nconst StackedSlides = (props: ReviewStackProps) => {\n  const {height: windowHeight} = useWindowDimensions();\n  const {endReview, slides, validateButton, correctionPopinProps} = props;\n  const [unstacked, setUnstacked] = useState<string[]>([]);\n  const [restacking, setRestacking] = useState<string | null>(null);\n  const [restackingDone, setRestackingDone] = useState<boolean>(false);\n\n  const hideSlides = useTranslateY({\n    fromValue: 0,\n    toValue: windowHeight,\n    duration: 800\n  });\n\n  const translateDown = useTranslateY({\n    fromValue: 0,\n    toValue: windowHeight - 100,\n    duration: 500,\n    easing: Easing.cubic\n  });\n\n  const restackTranslation = useTranslateY({\n    toValue: 0,\n    fromValue: -windowHeight,\n    duration: 1200,\n    easing: Easing.out(Easing.cubic)\n  });\n\n  useEffect(() => {\n    if (endReview) {\n      hideSlides.start();\n    }\n  }, [endReview, hideSlides]);\n\n  const restackingSlide = keys(slides).find(k => slides[k].animationType === 'restack');\n  const unstackingSlide = keys(slides).find(k => slides[k].animationType === 'unstack');\n\n  const remainingKeys = keys(slides).filter(\n    k => slides[k].position >= 0 && !slides[k].animationType\n  );\n\n  const orderedKeys = remainingKeys.sort((k1, k2) =>\n    slides[k2].position > slides[k1].position ? 1 : -1\n  );\n\n  const animatedFrontSlide =\n    unstackingSlide || (restackingSlide && restacking === null ? restackingSlide : undefined);\n\n  const animatedRestackedSlide = restacking !== null;\n\n  useEffect(() => {\n    if (restacking !== null && orderedKeys.includes(restacking)) {\n      setRestacking(null);\n      setRestackingDone(false);\n    }\n    // this effect is required only when the list orderedKeys changes\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [orderedKeys.toString()]);\n\n  useEffect(() => {\n    const unstacking = unstackingSlide && !unstacked.includes(unstackingSlide);\n\n    if (unstacking) {\n      translateDown.start(() => {\n        setUnstacked([...unstacked, unstackingSlide]);\n      });\n    }\n  }, [unstackingSlide, unstacked, setUnstacked, translateDown]);\n\n  useEffect(() => {\n    const startRestacking = !restackingDone && restackingSlide && restacking !== restackingSlide;\n\n    if (startRestacking) {\n      translateDown.start(() => {\n        setRestacking(restackingSlide);\n        restackTranslation.start(() => {\n          setRestackingDone(true);\n        });\n      });\n    }\n    // this effect is required only to trigger the restack animation when a new restackingSlide is set\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [restackingSlide, restacking]);\n\n  const stackedSlides = orderedKeys.map((slideIndex, index) => {\n    const slide = slides[slideIndex];\n    const num = orderedKeys.length - index;\n\n    return (\n      <Slide\n        {...{\n          num,\n          slideIndex,\n          slide,\n          validateButton,\n          correctionPopinProps\n        }}\n        key={slideIndex}\n      />\n    );\n  });\n\n  if (animatedFrontSlide) {\n    stackedSlides.push(\n      <Slide\n        {...{\n          num: 0,\n          slideIndex: animatedFrontSlide,\n          slide: slides[animatedFrontSlide],\n          validateButton,\n          correctionPopinProps\n        }}\n        animatedStyle={[translateDown.animatedStyle]}\n        key={animatedFrontSlide}\n      />\n    );\n  }\n\n  return (\n    <Animated.View style={[style.slides, hideSlides.animatedStyle]}>\n      {animatedRestackedSlide ? (\n        <Slide\n          {...{\n            num: orderedKeys.length + 1,\n            slideIndex: restacking,\n            slide: slides[restacking],\n            validateButton,\n            correctionPopinProps\n          }}\n          animatedStyle={[restackTranslation.animatedStyle]}\n          key={restacking}\n        />\n      ) : null}\n      {stackedSlides}\n    </Animated.View>\n  );\n};\n\nexport default StackedSlides;\n"],"mappings":"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"}

package/es/organism/user-preferences/index.d.ts

@@ -18,6 +18,7 @@ declare namespace UserPreferences {
             'data-name': PropTypes.Requireable<string>;
             requiredSelection: PropTypes.Requireable<boolean>;
         }> | null | undefined)[]>;
+        const moreInfoAriaLabel: PropTypes.Requireable<string>;
     }
 }
 import PropTypes from "prop-types";

package/es/organism/user-preferences/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/user-preferences/index.js"],"names":[],"mappings":";AA+BA,0DAaC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/user-preferences/index.js"],"names":[],"mappings":";AAoCA,0DAaC"}

package/es/organism/user-preferences/index.js

@@ -1,6 +1,6 @@
 import _isEmpty from "lodash/fp/isEmpty";
 import _map from "lodash/fp/map";
-const _excluded = ["label", "description"];
+const _excluded = ["label", "description", "moreInfoAriaLabel"];
 
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
@@ -15,7 +15,8 @@ import style from './style.css';
 const Settings = props => {
   const {
     label,
-    description
+    description,
+    moreInfoAriaLabel
   } = props,
         settings = _objectWithoutPropertiesLoose(props, _excluded);
 
@@ -28,7 +29,8 @@ const Settings = props => {
   }, /*#__PURE__*/React.createElement(InfoIcon, {
     height: 16,
     width: 16,
-    className: style.infoIcon
+    className: style.infoIcon,
+    "aria-label": moreInfoAriaLabel
   }), /*#__PURE__*/React.createElement("div", {
     className: style.showToolTip
   }, /*#__PURE__*/React.createElement("div", {
@@ -43,17 +45,20 @@ Settings.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, InputS
 
 const UserPreferences = props => {
   const {
-    preferences = []
+    preferences = [],
+    moreInfoAriaLabel
   } = props;
   return /*#__PURE__*/React.createElement("div", {
     className: style.preferences
   }, _map(settings => /*#__PURE__*/React.createElement(Settings, _extends({}, settings, {
-    key: settings.label
+    key: settings.label,
+    moreInfoAriaLabel: moreInfoAriaLabel
   })), preferences));
 };
 
 UserPreferences.propTypes = process.env.NODE_ENV !== "production" ? {
-  preferences: PropTypes.arrayOf(PropTypes.shape(Settings.propTypes))
+  preferences: PropTypes.arrayOf(PropTypes.shape(Settings.propTypes)),
+  moreInfoAriaLabel: PropTypes.string
 } : {};
 export default UserPreferences;
 //# sourceMappingURL=index.js.map

package/es/organism/user-preferences/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionCoorpacademyInformationIcon","InfoIcon","InputSwitch","style","Settings","props","label","description","settings","infoIconWrapper","infoIcon","showToolTip","descriptionLabel","propTypes","string","isRequired","UserPreferences","preferences","arrayOf","shape"],"sources":["../../../src/organism/user-preferences/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map, isEmpty} from 'lodash/fp';\nimport {NovaCompositionCoorpacademyInformationIcon as InfoIcon} from '@coorpacademy/nova-icons';\nimport InputSwitch from '../../atom/input-switch';\nimport style from './style.css';\n\nconst Settings = props => {\n  const {label, description, ...settings} = props;\n  return (\n    <div className={style.settings}>\n      <InputSwitch {...settings} />\n      <span className={style.label}>{label}</span>\n      {isEmpty(description) ? null : (\n        <div className={style.infoIconWrapper}>\n          <InfoIcon height={16} width={16} className={style.infoIcon} />\n          <div className={style.showToolTip}>\n            <div className={style.descriptionLabel}>{description}</div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nSettings.propTypes = {\n  ...InputSwitch.propTypes,\n  label: PropTypes.string.isRequired,\n  description: PropTypes.string\n};\n\nconst UserPreferences = props => {\n  const {preferences = []} = props;\n\n  return (\n    <div className={style.preferences}>\n      {map(\n        settings => (\n          <Settings {...settings} key={settings.label} />\n        ),\n        preferences\n      )}\n    </div>\n  );\n};\n\nUserPreferences.propTypes = {\n  preferences: PropTypes.arrayOf(PropTypes.shape(Settings.propTypes))\n};\n\nexport default UserPreferences;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAAQC,0CAA0C,IAAIC,QAAtD,QAAqE,0BAArE;AACA,OAAOC,WAAP,MAAwB,yBAAxB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAGC,KAAK,IAAI;EACxB,MAAM;IAACC,KAAD;IAAQC;EAAR,IAAoCF,KAA1C;EAAA,MAA8BG,QAA9B,iCAA0CH,KAA1C;;EACA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACK;EAAtB,gBACE,oBAAC,WAAD,EAAiBA,QAAjB,CADF,eAEE;IAAM,SAAS,EAAEL,KAAK,CAACG;EAAvB,GAA+BA,KAA/B,CAFF,EAGG,SAAQC,WAAR,IAAuB,IAAvB,gBACC;IAAK,SAAS,EAAEJ,KAAK,CAACM;EAAtB,gBACE,oBAAC,QAAD;IAAU,MAAM,EAAE,EAAlB;IAAsB,KAAK,EAAE,EAA7B;IAAiC,SAAS,EAAEN,KAAK,CAACO;EAAlD,EADF,eAEE;IAAK,SAAS,EAAEP,KAAK,CAACQ;EAAtB,gBACE;IAAK,SAAS,EAAER,KAAK,CAACS;EAAtB,GAAyCL,WAAzC,CADF,CAFF,CAJJ,CADF;AAcD,CAhBD;;AAkBAH,QAAQ,CAACS,SAAT,wDACKX,WAAW,CAACW,SADjB;EAEEP,KAAK,EAAEP,SAAS,CAACe,MAAV,CAAiBC,UAF1B;EAGER,WAAW,EAAER,SAAS,CAACe;AAHzB;;AAMA,MAAME,eAAe,GAAGX,KAAK,IAAI;EAC/B,MAAM;IAACY,WAAW,GAAG;EAAf,IAAqBZ,KAA3B;EAEA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACc;EAAtB,GACG,KACCT,QAAQ,iBACN,oBAAC,QAAD,eAAcA,QAAd;IAAwB,GAAG,EAAEA,QAAQ,CAACF;EAAtC,GAFH,EAICW,WAJD,CADH,CADF;AAUD,CAbD;;AAeAD,eAAe,CAACH,SAAhB,2CAA4B;EAC1BI,WAAW,EAAElB,SAAS,CAACmB,OAAV,CAAkBnB,SAAS,CAACoB,KAAV,CAAgBf,QAAQ,CAACS,SAAzB,CAAlB;AADa,CAA5B;AAIA,eAAeG,eAAf"}
+{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionCoorpacademyInformationIcon","InfoIcon","InputSwitch","style","Settings","props","label","description","moreInfoAriaLabel","settings","infoIconWrapper","infoIcon","showToolTip","descriptionLabel","propTypes","string","isRequired","UserPreferences","preferences","arrayOf","shape"],"sources":["../../../src/organism/user-preferences/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map, isEmpty} from 'lodash/fp';\nimport {NovaCompositionCoorpacademyInformationIcon as InfoIcon} from '@coorpacademy/nova-icons';\nimport InputSwitch from '../../atom/input-switch';\nimport style from './style.css';\n\nconst Settings = props => {\n  const {label, description, moreInfoAriaLabel, ...settings} = props;\n  return (\n    <div className={style.settings}>\n      <InputSwitch {...settings} />\n      <span className={style.label}>{label}</span>\n      {isEmpty(description) ? null : (\n        <div className={style.infoIconWrapper}>\n          <InfoIcon\n            height={16}\n            width={16}\n            className={style.infoIcon}\n            aria-label={moreInfoAriaLabel}\n          />\n          <div className={style.showToolTip}>\n            <div className={style.descriptionLabel}>{description}</div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nSettings.propTypes = {\n  ...InputSwitch.propTypes,\n  label: PropTypes.string.isRequired,\n  description: PropTypes.string\n};\n\nconst UserPreferences = props => {\n  const {preferences = [], moreInfoAriaLabel} = props;\n\n  return (\n    <div className={style.preferences}>\n      {map(\n        settings => (\n          <Settings {...settings} key={settings.label} moreInfoAriaLabel={moreInfoAriaLabel} />\n        ),\n        preferences\n      )}\n    </div>\n  );\n};\n\nUserPreferences.propTypes = {\n  preferences: PropTypes.arrayOf(PropTypes.shape(Settings.propTypes)),\n  moreInfoAriaLabel: PropTypes.string\n};\n\nexport default UserPreferences;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAAQC,0CAA0C,IAAIC,QAAtD,QAAqE,0BAArE;AACA,OAAOC,WAAP,MAAwB,yBAAxB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAGC,KAAK,IAAI;EACxB,MAAM;IAACC,KAAD;IAAQC,WAAR;IAAqBC;EAArB,IAAuDH,KAA7D;EAAA,MAAiDI,QAAjD,iCAA6DJ,KAA7D;;EACA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACM;EAAtB,gBACE,oBAAC,WAAD,EAAiBA,QAAjB,CADF,eAEE;IAAM,SAAS,EAAEN,KAAK,CAACG;EAAvB,GAA+BA,KAA/B,CAFF,EAGG,SAAQC,WAAR,IAAuB,IAAvB,gBACC;IAAK,SAAS,EAAEJ,KAAK,CAACO;EAAtB,gBACE,oBAAC,QAAD;IACE,MAAM,EAAE,EADV;IAEE,KAAK,EAAE,EAFT;IAGE,SAAS,EAAEP,KAAK,CAACQ,QAHnB;IAIE,cAAYH;EAJd,EADF,eAOE;IAAK,SAAS,EAAEL,KAAK,CAACS;EAAtB,gBACE;IAAK,SAAS,EAAET,KAAK,CAACU;EAAtB,GAAyCN,WAAzC,CADF,CAPF,CAJJ,CADF;AAmBD,CArBD;;AAuBAH,QAAQ,CAACU,SAAT,wDACKZ,WAAW,CAACY,SADjB;EAEER,KAAK,EAAEP,SAAS,CAACgB,MAAV,CAAiBC,UAF1B;EAGET,WAAW,EAAER,SAAS,CAACgB;AAHzB;;AAMA,MAAME,eAAe,GAAGZ,KAAK,IAAI;EAC/B,MAAM;IAACa,WAAW,GAAG,EAAf;IAAmBV;EAAnB,IAAwCH,KAA9C;EAEA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACe;EAAtB,GACG,KACCT,QAAQ,iBACN,oBAAC,QAAD,eAAcA,QAAd;IAAwB,GAAG,EAAEA,QAAQ,CAACH,KAAtC;IAA6C,iBAAiB,EAAEE;EAAhE,GAFH,EAICU,WAJD,CADH,CADF;AAUD,CAbD;;AAeAD,eAAe,CAACH,SAAhB,2CAA4B;EAC1BI,WAAW,EAAEnB,SAAS,CAACoB,OAAV,CAAkBpB,SAAS,CAACqB,KAAV,CAAgBhB,QAAQ,CAACU,SAAzB,CAAlB,CADa;EAE1BN,iBAAiB,EAAET,SAAS,CAACgB;AAFH,CAA5B;AAKA,eAAeE,eAAf"}

package/es/template/activity/index.d.ts

@@ -3,6 +3,7 @@ declare class Progression extends React.Component<any, any, any> {
     static propTypes: {
         mainTitle: PropTypes.Validator<string>;
         mainSubtitle: PropTypes.Validator<string>;
+        adaptiveAriaLabel: PropTypes.Requireable<string>;
         total: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
             label: PropTypes.Validator<string>;
             stars: PropTypes.Validator<number>;
@@ -32,6 +33,7 @@ declare class Progression extends React.Component<any, any, any> {
             label: PropTypes.Validator<string>;
             level: PropTypes.Validator<string>;
             state: PropTypes.Validator<string>;
+            adaptiveAriaLabel: PropTypes.Requireable<string>;
             type: PropTypes.Validator<string>;
             adaptive: PropTypes.Validator<boolean>;
             onClick: PropTypes.Requireable<(...args: any[]) => any>;

package/es/template/activity/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/activity/index.js"],"names":[],"mappings":";AAaA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAuBE;IAEF;;;;;;;;;;;;;;;;;;;;;;MAEE;IAEF,sCAIC;IAED,8BAME;IAEF,oCAKE;IAEF,sBA+EC;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/activity/index.js"],"names":[],"mappings":";AAaA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAwBE;IAEF;;;;;;;;;;;;;;;;;;;;;;MAEE;IAEF,sCAIC;IAED,8BAME;IAEF,oCAKE;IAEF,sBAoFC;CACF"}

package/es/template/activity/index.js

@@ -51,6 +51,7 @@ class Progression extends React.Component {
       mainSubtitle,
       recommendation = {},
       progressions = [],
+      adaptiveAriaLabel,
       total,
       engines = [],
       themeFilter = {},
@@ -66,7 +67,8 @@ class Progression extends React.Component {
       className: style.loader
     }, /*#__PURE__*/React.createElement(Loader, null)) : null;
     const allProgressions = progressions.map(progression => /*#__PURE__*/React.createElement(ProgressionItem, _extends({}, _omit(['ref'], progression), {
-      key: progression.ref
+      key: progression.ref,
+      adaptiveAriaLabel: adaptiveAriaLabel
     })));
     const coreProgression = /*#__PURE__*/React.createElement("div", {
       "data-name": "activityCore",
@@ -127,6 +129,7 @@ Progression.contextTypes = {
 Progression.propTypes = process.env.NODE_ENV !== "production" ? {
   mainTitle: PropTypes.string.isRequired,
   mainSubtitle: PropTypes.string.isRequired,
+  adaptiveAriaLabel: PropTypes.string,
   total: PropTypes.shape({
     label: PropTypes.string.isRequired,
     stars: PropTypes.number.isRequired

package/es/template/activity/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","Button","Select","Loader","ProgressionItem","EngineStars","StarsSummary","style","Progression","Component","constructor","props","context","handleClick","e","recommendation","stopPropagation","preventDefault","onClick","handleSelectTheme","themeFilter","onChange","bind","render","mainTitle","mainSubtitle","progressions","total","engines","loading","skin","primary","loader","allProgressions","map","progression","ref","coreProgression","core","themeSelect","options","selectBorder","select","recommendationSection","recommendationWrapper","title","subtitle","course","innerHTML","__html","courseTitle","cta","backgroundColor","default","headerProgression","wrapperCta","wrapperProgression","contextTypes","childContextTypes","propTypes","string","isRequired","shape","label","stars","number","arrayOf","bool","func"],"sources":["../../../src/template/activity/index.js"],"sourcesContent":["import React from 'react';\nimport {get, omit, isEmpty} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport Provider from '../../atom/provider';\nimport Button from '../../atom/button';\nimport Select from '../../atom/select';\nimport Loader from '../../atom/loader';\nimport ProgressionItem from './progression-item';\nimport EngineStars from './engine-stars';\nimport StarsSummary from './stars-summary';\nimport style from './style.css';\n\nclass Progression extends React.Component {\n  static propTypes = {\n    mainTitle: PropTypes.string.isRequired,\n    mainSubtitle: PropTypes.string.isRequired,\n    total: PropTypes.shape({\n      label: PropTypes.string.isRequired,\n      stars: PropTypes.number.isRequired\n    }).isRequired,\n    engines: PropTypes.arrayOf(PropTypes.shape(EngineStars.propTypes)),\n    loading: PropTypes.bool.isRequired,\n    progressions: PropTypes.arrayOf(\n      PropTypes.shape({...ProgressionItem.propTypes, ref: PropTypes.string.isRequired})\n    ),\n    themeFilter: PropTypes.shape({\n      options: Select.propTypes.options.isRequired,\n      onChange: Select.propTypes.onChange\n    }),\n    recommendation: PropTypes.shape({\n      cta: PropTypes.string.isRequired,\n      title: PropTypes.string.isRequired,\n      subtitle: PropTypes.string.isRequired,\n      courseTitle: PropTypes.string.isRequired,\n      onClick: PropTypes.func\n    })\n  };\n\n  static contextTypes = {\n    skin: Provider.childContextTypes.skin\n  };\n\n  constructor(props, context) {\n    super(props, context);\n    this.handleClick = this.handleClick.bind(this);\n    this.handleSelectTheme = this.handleSelectTheme.bind(this);\n  }\n\n  handleClick = e => {\n    const {recommendation} = this.props;\n    e.stopPropagation();\n    e.preventDefault();\n    const {onClick} = recommendation;\n    onClick && onClick(e);\n  };\n\n  handleSelectTheme = e => {\n    const {\n      themeFilter: {onChange}\n    } = this.props;\n    onChange && onChange(e);\n  };\n\n  render() {\n    const {\n      mainTitle,\n      mainSubtitle,\n      recommendation = {},\n      progressions = [],\n      total,\n      engines = [],\n      themeFilter = {},\n      loading\n    } = this.props;\n    const {skin} = this.context;\n\n    const primary = get('common.primary', skin);\n    const loader = loading ? (\n      <div className={style.loader}>\n        <Loader />\n      </div>\n    ) : null;\n    const allProgressions = progressions.map(progression => (\n      <ProgressionItem {...omit(['ref'], progression)} key={progression.ref} />\n    ));\n\n    const coreProgression = (\n      <div data-name=\"activityCore\" className={style.core}>\n        {allProgressions}\n      </div>\n    );\n    const themeSelect = !isEmpty(themeFilter.options) ? (\n      <Select\n        borderClassName={style.selectBorder}\n        className={style.select}\n        theme=\"thematiques\"\n        options={themeFilter.options}\n        onChange={this.handleSelectTheme}\n      />\n    ) : null;\n    const recommendationSection = !isEmpty(recommendation) ? (\n      <div className={style.recommendationWrapper}>\n        <p className={style.recommendationSection}>{recommendation.title} </p>\n        <p className={style.recommendationSection}>\n          <span>{recommendation.subtitle} </span>\n          <span\n            className={classnames(style.course, style.innerHTML)}\n            // eslint-disable-next-line react/no-danger\n            dangerouslySetInnerHTML={{__html: recommendation.courseTitle}}\n          />\n        </p>\n        <Button\n          type=\"link\"\n          onClick={this.handleClick}\n          submitValue={recommendation.cta}\n          style={{\n            backgroundColor: primary\n          }}\n          className={style.cta}\n        />\n      </div>\n    ) : null;\n    return (\n      <div className={style.default}>\n        <div data-name=\"activity-header\">\n          <div className={style.mainTitle}>\n            <span>{mainTitle}</span> {mainSubtitle}\n          </div>\n          <div className={style.headerProgression}>\n            <div className={style.wrapperCta}>\n              {themeSelect}\n              {recommendationSection}\n            </div>\n            <StarsSummary engines={engines} total={total} />\n          </div>\n        </div>\n        <div className={style.wrapperProgression} data-name=\"activityList\">\n          {coreProgression}\n          {loader}\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default Progression;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","Button","Select","Loader","ProgressionItem","EngineStars","StarsSummary","style","Progression","Component","constructor","props","context","handleClick","e","recommendation","stopPropagation","preventDefault","onClick","handleSelectTheme","themeFilter","onChange","bind","render","mainTitle","mainSubtitle","progressions","adaptiveAriaLabel","total","engines","loading","skin","primary","loader","allProgressions","map","progression","ref","coreProgression","core","themeSelect","options","selectBorder","select","recommendationSection","recommendationWrapper","title","subtitle","course","innerHTML","__html","courseTitle","cta","backgroundColor","default","headerProgression","wrapperCta","wrapperProgression","contextTypes","childContextTypes","propTypes","string","isRequired","shape","label","stars","number","arrayOf","bool","func"],"sources":["../../../src/template/activity/index.js"],"sourcesContent":["import React from 'react';\nimport {get, omit, isEmpty} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport Provider from '../../atom/provider';\nimport Button from '../../atom/button';\nimport Select from '../../atom/select';\nimport Loader from '../../atom/loader';\nimport ProgressionItem from './progression-item';\nimport EngineStars from './engine-stars';\nimport StarsSummary from './stars-summary';\nimport style from './style.css';\n\nclass Progression extends React.Component {\n  static propTypes = {\n    mainTitle: PropTypes.string.isRequired,\n    mainSubtitle: PropTypes.string.isRequired,\n    adaptiveAriaLabel: PropTypes.string,\n    total: PropTypes.shape({\n      label: PropTypes.string.isRequired,\n      stars: PropTypes.number.isRequired\n    }).isRequired,\n    engines: PropTypes.arrayOf(PropTypes.shape(EngineStars.propTypes)),\n    loading: PropTypes.bool.isRequired,\n    progressions: PropTypes.arrayOf(\n      PropTypes.shape({...ProgressionItem.propTypes, ref: PropTypes.string.isRequired})\n    ),\n    themeFilter: PropTypes.shape({\n      options: Select.propTypes.options.isRequired,\n      onChange: Select.propTypes.onChange\n    }),\n    recommendation: PropTypes.shape({\n      cta: PropTypes.string.isRequired,\n      title: PropTypes.string.isRequired,\n      subtitle: PropTypes.string.isRequired,\n      courseTitle: PropTypes.string.isRequired,\n      onClick: PropTypes.func\n    })\n  };\n\n  static contextTypes = {\n    skin: Provider.childContextTypes.skin\n  };\n\n  constructor(props, context) {\n    super(props, context);\n    this.handleClick = this.handleClick.bind(this);\n    this.handleSelectTheme = this.handleSelectTheme.bind(this);\n  }\n\n  handleClick = e => {\n    const {recommendation} = this.props;\n    e.stopPropagation();\n    e.preventDefault();\n    const {onClick} = recommendation;\n    onClick && onClick(e);\n  };\n\n  handleSelectTheme = e => {\n    const {\n      themeFilter: {onChange}\n    } = this.props;\n    onChange && onChange(e);\n  };\n\n  render() {\n    const {\n      mainTitle,\n      mainSubtitle,\n      recommendation = {},\n      progressions = [],\n      adaptiveAriaLabel,\n      total,\n      engines = [],\n      themeFilter = {},\n      loading\n    } = this.props;\n    const {skin} = this.context;\n\n    const primary = get('common.primary', skin);\n    const loader = loading ? (\n      <div className={style.loader}>\n        <Loader />\n      </div>\n    ) : null;\n    const allProgressions = progressions.map(progression => (\n      <ProgressionItem\n        {...omit(['ref'], progression)}\n        key={progression.ref}\n        adaptiveAriaLabel={adaptiveAriaLabel}\n      />\n    ));\n\n    const coreProgression = (\n      <div data-name=\"activityCore\" className={style.core}>\n        {allProgressions}\n      </div>\n    );\n    const themeSelect = !isEmpty(themeFilter.options) ? (\n      <Select\n        borderClassName={style.selectBorder}\n        className={style.select}\n        theme=\"thematiques\"\n        options={themeFilter.options}\n        onChange={this.handleSelectTheme}\n      />\n    ) : null;\n    const recommendationSection = !isEmpty(recommendation) ? (\n      <div className={style.recommendationWrapper}>\n        <p className={style.recommendationSection}>{recommendation.title} </p>\n        <p className={style.recommendationSection}>\n          <span>{recommendation.subtitle} </span>\n          <span\n            className={classnames(style.course, style.innerHTML)}\n            // eslint-disable-next-line react/no-danger\n            dangerouslySetInnerHTML={{__html: recommendation.courseTitle}}\n          />\n        </p>\n        <Button\n          type=\"link\"\n          onClick={this.handleClick}\n          submitValue={recommendation.cta}\n          style={{\n            backgroundColor: primary\n          }}\n          className={style.cta}\n        />\n      </div>\n    ) : null;\n    return (\n      <div className={style.default}>\n        <div data-name=\"activity-header\">\n          <div className={style.mainTitle}>\n            <span>{mainTitle}</span> {mainSubtitle}\n          </div>\n          <div className={style.headerProgression}>\n            <div className={style.wrapperCta}>\n              {themeSelect}\n              {recommendationSection}\n            </div>\n            <StarsSummary engines={engines} total={total} />\n          </div>\n        </div>\n        <div className={style.wrapperProgression} data-name=\"activityList\">\n          {coreProgression}\n          {loader}\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default Progression;\n"],"mappings":"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"}

package/es/template/activity/progression-item.d.ts

@@ -10,6 +10,7 @@ declare namespace ProgressionItem {
         const label: PropTypes.Validator<string>;
         const level: PropTypes.Validator<string>;
         const state: PropTypes.Validator<string>;
+        const adaptiveAriaLabel: PropTypes.Requireable<string>;
         const type: PropTypes.Validator<string>;
         const adaptive: PropTypes.Validator<boolean>;
         const onClick: PropTypes.Requireable<(...args: any[]) => any>;

package/es/template/activity/progression-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"progression-item.d.ts","sourceRoot":"","sources":["../../../src/template/activity/progression-item.js"],"names":[],"mappings":";AAmCA,wEAwFC"}
+{"version":3,"file":"progression-item.d.ts","sourceRoot":"","sources":["../../../src/template/activity/progression-item.js"],"names":[],"mappings":";AAmCA,wEAyFC"}