@coorpacademy/components 11.2.7 → 11.2.8

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

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","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","useTemplateContext","styleSheet","setStylesheet","useState","isCongratsTranslationDone","setCongratsTranslationDone","isRankShown","setRankShown","scrollViewRef","useRef","showCongrats","useAnimateProp","onComplete","translateCongrats","useTranslateY","showConfettis","fadeInRank","translateRank","useTranslateX","setTimeout","current","scrollToEnd","animatedRank","animatedStyle","fadeInStars","delay","translateStars","showButton1","showButton2","congratsSequence","sequence","parallel","useEffect","start","_stylesheet","handleContinueRevisingPress","onClick","handleReviseAnotherSkillPress","showStarLottieAnimation","animationSrc","reviewCardTitle","reviewCardValue","rankSuffix","RankIcon","positive","StarIcon","battle","label","BOX_STYLE","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: 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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"}
+{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","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","useTemplateContext","styleSheet","setStylesheet","useState","isCongratsTranslationDone","setCongratsTranslationDone","isRankShown","setRankShown","scrollViewRef","useRef","showCongrats","useAnimateProp","onComplete","translateCongrats","useTranslateY","showConfettis","fadeInRank","translateRank","useTranslateX","setTimeout","current","scrollToEnd","animatedRank","animatedStyle","fadeInStars","delay","translateStars","showButton1","showButton2","congratsSequence","sequence","parallel","useEffect","start","_stylesheet","handleContinueRevisingPress","onClick","handleReviseAnotherSkillPress","showStarLottieAnimation","animationSrc","reviewCardTitle","reviewCardValue","rankSuffix","RankIcon","positive","StarIcon","battle","label","BOX_STYLE","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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "11.2.7",
+  "version": "11.2.8",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -159,5 +159,5 @@
     "last 2 versions",
     "IE 11"
   ],
-  "gitHead": "59ef4c9b320af26fd9f25764770e75c927d43d2e"
+  "gitHead": "077da9c9b42d74c4456e22f81554a6dacea4e892"
 }