@coorpacademy/components 10.27.5-alpha.31 → 10.27.5-alpha.89

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/organism/review-slide/index.native.tsx"],"names":["React","useEffect","useState","StyleSheet","useWindowDimensions","View","get","getOr","Text","Answer","useTemplateContext","Touchable","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","klf","information","label","message","next","_correctionPopinProps","onClick","console","log","type","resultLabel","toString","createQuestionStyle","theme","brandTheme","create","questionHeading","justifyContent","questionOrigin","fontSize","lineHeight","color","colors","text","primary","marginBottom","spacing","tiny","marginTop","small","textAlign","questionText","fontWeight","questionHelp","gray","medium","choicesContainer","flex","width","validateButton","backgroundColor","borderRadius","validateButtonText","white","Question","props","answerUI","style","setStyle","questionStyle","createSlideStyle","num","screenWidth","slideWidth","slide","position","left","bottom","height","alignItems","padding","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","slideStyle","loading","parentContentTitle"],"mappings":"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","sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {StyleSheet, TextStyle, useWindowDimensions, View, ViewStyle} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport Text from '../../atom/text/index.native';\nimport Answer from '../../molecule/answer/index.native';\n// import Loader from '../../atom/loader';\n// import ReviewCorrectionPopin from '../../molecule/review-correction-popin';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Brand} from '../../variables/brand.native';\nimport {ReviewCorrectionPopinProps} from '../../molecule/review-correction-popin/prop-types';\nimport {ReviewSlideProps, SlideProps} from './prop-types';\n\ntype PopinProps = {\n  correctionPopinProps: ReviewCorrectionPopinProps;\n  slideIndex: unknown;\n  showCorrectionPopin: unknown;\n  animateCorrectionPopin: unknown;\n};\n\nconst CorrectionPopin = ({\n  correctionPopinProps,\n  slideIndex,\n  showCorrectionPopin,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  animateCorrectionPopin\n}: PopinProps) => {\n  if (!showCorrectionPopin) return null;\n\n  const klf = getOr({}, 'klf', correctionPopinProps);\n  const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n  const next = get('next', correctionPopinProps);\n\n  const _correctionPopinProps = {\n    next: {\n      onClick: () => {\n        // eslint-disable-next-line no-console\n        console.log('Next Slide');\n      },\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  return (\n    <Text>@todo ReviewCorrectionPopin {_correctionPopinProps.toString()}</Text>\n    // <ReviewCorrectionPopin {..._correctionPopinProps} />\n  );\n};\n\n// const ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {\n//   const {label, onClick, disabled} = validateButton;\n//   const validateButtonProps = {\n//     type: 'primary',\n//     label,\n//     'aria-label': label,\n//     'data-name': `slide-validate-button-${slideIndex}`,\n//     onClick,\n//     disabled,\n//     customStyle: {\n//       backgroundColor: primarySkinColor\n//     }\n//   };\n\n//   return <Button title=\"validate todo\" />;\n// };\n\ntype StyleSheetType = {\n  questionHeading: ViewStyle;\n  questionOrigin: ViewStyle;\n  questionText: TextStyle;\n  questionHelp: ViewStyle;\n  choicesContainer: ViewStyle;\n  validateButton: ViewStyle;\n  validateButtonText: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme, brandTheme: Brand): 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    choicesContainer: {\n      flex: 1,\n      width: '100%',\n      justifyContent: 'center'\n    },\n    validateButton: {\n      backgroundColor: brandTheme?.colors?.primary || theme.colors.text.primary,\n      borderRadius: 7,\n      width: '100%'\n    },\n    validateButtonText: {\n      fontSize: 14,\n      lineHeight: 20,\n      fontWeight: '700',\n      color: theme.colors.white,\n      marginBottom: 16,\n      marginTop: 16,\n      textAlign: 'center'\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, brandTheme} = useTemplateContext();\n  const [style, setStyle] = useState<StyleSheetType>();\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme, brandTheme);\n    setStyle(questionStyle);\n  }, [theme, brandTheme]);\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      <View style={style.choicesContainer}>\n        <Answer {...answerUI} />\n      </View>\n      <Touchable style={style.validateButton}>\n        <Text style={style.validateButtonText}>@todo validate</Text>\n      </Touchable>\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 {slide, correctionPopinProps, 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  return (\n    <View style={slideStyle.slide}>\n      {loading ? (\n        // <Loader className={style.loader} theme=\"default\" aria-label={loadingAriaLabel} />\n        <Text>@todo loader {num}</Text>\n      ) : (\n        <>\n          <Question\n            questionOrigin={parentContentTitle}\n            questionText={questionText}\n            answerUI={answerUI}\n            key=\"question-container\"\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        </>\n      )}\n    </View>\n  );\n};\n\nexport default Slide;\n"],"file":"index.native.js"}
+{"version":3,"file":"index.native.js","names":["React","useEffect","useState","StyleSheet","useWindowDimensions","View","get","getOr","Text","Answer","useTemplateContext","Touchable","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","klf","information","label","message","next","_correctionPopinProps","onClick","console","log","type","resultLabel","toString","createQuestionStyle","theme","brandTheme","create","questionHeading","justifyContent","questionOrigin","fontSize","lineHeight","color","colors","text","primary","marginBottom","spacing","tiny","marginTop","small","textAlign","questionText","fontWeight","questionHelp","gray","medium","choicesContainer","flex","width","validateButton","backgroundColor","borderRadius","validateButtonText","white","Question","props","answerUI","style","setStyle","questionStyle","createSlideStyle","num","screenWidth","slideWidth","slide","position","left","bottom","height","alignItems","padding","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","slideStyle","loading","parentContentTitle"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {StyleSheet, TextStyle, useWindowDimensions, View, ViewStyle} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport Text from '../../atom/text/index.native';\nimport Answer from '../../molecule/answer/index.native';\n// import Loader from '../../atom/loader';\n// import ReviewCorrectionPopin from '../../molecule/review-correction-popin';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Brand} from '../../variables/brand.native';\nimport {ReviewCorrectionPopinProps} from '../../molecule/review-correction-popin/prop-types';\nimport {ReviewSlideProps, SlideProps} from './prop-types';\n\ntype PopinProps = {\n  correctionPopinProps: ReviewCorrectionPopinProps;\n  slideIndex: unknown;\n  showCorrectionPopin: unknown;\n  animateCorrectionPopin: unknown;\n};\n\nconst CorrectionPopin = ({\n  correctionPopinProps,\n  slideIndex,\n  showCorrectionPopin,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  animateCorrectionPopin\n}: PopinProps) => {\n  if (!showCorrectionPopin) return null;\n\n  const klf = getOr({}, 'klf', correctionPopinProps);\n  const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n  const next = get('next', correctionPopinProps);\n\n  const _correctionPopinProps = {\n    next: {\n      onClick: () => {\n        // eslint-disable-next-line no-console\n        console.log('Next Slide');\n      },\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  return (\n    <Text>@todo ReviewCorrectionPopin {_correctionPopinProps.toString()}</Text>\n    // <ReviewCorrectionPopin {..._correctionPopinProps} />\n  );\n};\n\n// const ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {\n//   const {label, onClick, disabled} = validateButton;\n//   const validateButtonProps = {\n//     type: 'primary',\n//     label,\n//     'aria-label': label,\n//     'data-name': `slide-validate-button-${slideIndex}`,\n//     onClick,\n//     disabled,\n//     customStyle: {\n//       backgroundColor: primarySkinColor\n//     }\n//   };\n\n//   return <Button title=\"validate todo\" />;\n// };\n\ntype StyleSheetType = {\n  questionHeading: ViewStyle;\n  questionOrigin: ViewStyle;\n  questionText: TextStyle;\n  questionHelp: ViewStyle;\n  choicesContainer: ViewStyle;\n  validateButton: ViewStyle;\n  validateButtonText: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme, brandTheme: Brand): 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    choicesContainer: {\n      flex: 1,\n      width: '100%',\n      justifyContent: 'center'\n    },\n    validateButton: {\n      backgroundColor: brandTheme?.colors?.primary || theme.colors.text.primary,\n      borderRadius: 7,\n      width: '100%'\n    },\n    validateButtonText: {\n      fontSize: 14,\n      lineHeight: 20,\n      fontWeight: '700',\n      color: theme.colors.white,\n      marginBottom: 16,\n      marginTop: 16,\n      textAlign: 'center'\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, brandTheme} = useTemplateContext();\n  const [style, setStyle] = useState<StyleSheetType>();\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme, brandTheme);\n    setStyle(questionStyle);\n  }, [theme, brandTheme]);\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      <View style={style.choicesContainer}>\n        <Answer {...answerUI} />\n      </View>\n      <Touchable style={style.validateButton}>\n        <Text style={style.validateButtonText}>@todo validate</Text>\n      </Touchable>\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 {slide, correctionPopinProps, 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  return (\n    <View style={slideStyle.slide}>\n      {loading ? (\n        // <Loader className={style.loader} theme=\"default\" aria-label={loadingAriaLabel} />\n        <Text>@todo loader {num}</Text>\n      ) : (\n        <>\n          <Question\n            questionOrigin={parentContentTitle}\n            questionText={questionText}\n            answerUI={answerUI}\n            key=\"question-container\"\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        </>\n      )}\n    </View>\n  );\n};\n\nexport default Slide;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAeC,SAAf,EAA0BC,QAA1B,QAAyC,OAAzC;AACA,SAAQC,UAAR,EAA+BC,mBAA/B,EAAoDC,IAApD,QAA0E,cAA1E;AACA,OAAOC,GAAP,MAAgB,eAAhB;AACA,OAAOC,KAAP,MAAkB,iBAAlB;AACA,OAAOC,IAAP,MAAiB,8BAAjB;AACA,OAAOC,MAAP,MAAmB,oCAAnB,C,CACA;AACA;;AACA,SAAQC,kBAAR,QAAiC,4CAAjC;AAEA,OAAOC,SAAP,MAAsB,kCAAtB;;AAYA,MAAMC,eAAe,GAAG,CAAC;EACvBC,oBADuB;EAEvBC,UAFuB;EAGvBC,mBAHuB;EAIvB;EACAC;AALuB,CAAD,KAMN;EAChB,IAAI,CAACD,mBAAL,EAA0B,OAAO,IAAP;EAE1B,MAAME,GAAG,GAAGV,KAAK,CAAC,EAAD,EAAK,KAAL,EAAYM,oBAAZ,CAAjB;EACA,MAAMK,WAAW,GAAGX,KAAK,CAAC;IAACY,KAAK,EAAE,EAAR;IAAYC,OAAO,EAAE;EAArB,CAAD,EAA2B,aAA3B,EAA0CP,oBAA1C,CAAzB;EACA,MAAMQ,IAAI,GAAGf,GAAG,CAAC,MAAD,EAASO,oBAAT,CAAhB;EAEA,MAAMS,qBAAqB,GAAG;IAC5BD,IAAI,EAAE;MACJE,OAAO,EAAE,MAAM;QACb;QACAC,OAAO,CAACC,GAAR,CAAY,YAAZ;MACD,CAJG;MAKJN,KAAK,EAAEE,IAAI,IAAIA,IAAI,CAACF,KALhB;MAMJ,aAAc,wBAAuBL,UAAW,EAN5C;MAOJ,cAAcO,IAAI,IAAIA,IAAI,CAAC,YAAD;IAPtB,CADsB;IAU5BJ,GAV4B;IAW5BC,WAX4B;IAY5BQ,IAAI,EAAEb,oBAAoB,CAACa,IAZC;IAa5BC,WAAW,EAAEd,oBAAoB,CAACc;EAbN,CAA9B;EAgBA,oBACE,oBAAC,IAAD,wCAAmCL,qBAAqB,CAACM,QAAtB,EAAnC,CADF,CAEE;EAFF;AAID,CAjCD,C,CAmCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;AAYA,MAAMC,mBAAmB,GAAG,CAACC,KAAD,EAAeC,UAAf,KAC1B5B,UAAU,CAAC6B,MAAX,CAAkB;EAChBC,eAAe,EAAE;IACfC,cAAc,EAAE;EADD,CADD;EAIhBC,cAAc,EAAE;IACdC,QAAQ,EAAE,EADI;IAEdC,UAAU,EAAE,EAFE;IAGdC,KAAK,EAAER,KAAK,CAACS,MAAN,CAAaC,IAAb,CAAkBC,OAHX;IAIdC,YAAY,EAAEZ,KAAK,CAACa,OAAN,CAAcC,IAJd;IAKdC,SAAS,EAAEf,KAAK,CAACa,OAAN,CAAcG,KALX;IAMdC,SAAS,EAAE;EANG,CAJA;EAYhBC,YAAY,EAAE;IACZZ,QAAQ,EAAE,EADE;IAEZC,UAAU,EAAE,EAFA;IAGZY,UAAU,EAAE,KAHA;IAIZX,KAAK,EAAER,KAAK,CAACS,MAAN,CAAaC,IAAb,CAAkBC,OAJb;IAKZM,SAAS,EAAE;EALC,CAZE;EAmBhBG,YAAY,EAAE;IACZd,QAAQ,EAAE,EADE;IAEZC,UAAU,EAAE,EAFA;IAGZC,KAAK,EAAER,KAAK,CAACS,MAAN,CAAaY,IAAb,CAAkBC,MAHb;IAIZV,YAAY,EAAE,CAJF;IAKZG,SAAS,EAAEf,KAAK,CAACa,OAAN,CAAcG,KALb;IAMZC,SAAS,EAAE;EANC,CAnBE;EA2BhBM,gBAAgB,EAAE;IAChBC,IAAI,EAAE,CADU;IAEhBC,KAAK,EAAE,MAFS;IAGhBrB,cAAc,EAAE;EAHA,CA3BF;EAgChBsB,cAAc,EAAE;IACdC,eAAe,EAAE1B,UAAU,EAAEQ,MAAZ,EAAoBE,OAApB,IAA+BX,KAAK,CAACS,MAAN,CAAaC,IAAb,CAAkBC,OADpD;IAEdiB,YAAY,EAAE,CAFA;IAGdH,KAAK,EAAE;EAHO,CAhCA;EAqChBI,kBAAkB,EAAE;IAClBvB,QAAQ,EAAE,EADQ;IAElBC,UAAU,EAAE,EAFM;IAGlBY,UAAU,EAAE,KAHM;IAIlBX,KAAK,EAAER,KAAK,CAACS,MAAN,CAAaqB,KAJF;IAKlBlB,YAAY,EAAE,EALI;IAMlBG,SAAS,EAAE,EANO;IAOlBE,SAAS,EAAE;EAPO;AArCJ,CAAlB,CADF;;AAuDA,MAAMc,QAAQ,GAAIC,KAAD,IAA0B;EACzC,MAAM;IAACC,QAAD;IAAWf,YAAX;IAAyBb;EAAzB,IAA2C2B,KAAjD;EACA,MAAM;IAAChC,KAAD;IAAQC;EAAR,IAAsBrB,kBAAkB,EAA9C;EACA,MAAM,CAACsD,KAAD,EAAQC,QAAR,IAAoB/D,QAAQ,EAAlC;EAEAD,SAAS,CAAC,MAAM;IACd,MAAMiE,aAAa,GAAGrC,mBAAmB,CAACC,KAAD,EAAQC,UAAR,CAAzC;IACAkC,QAAQ,CAACC,aAAD,CAAR;EACD,CAHQ,EAGN,CAACpC,KAAD,EAAQC,UAAR,CAHM,CAAT;EAKA,IAAI,CAACgC,QAAD,IAAa,CAACf,YAAd,IAA8B,CAACgB,KAAnC,EAA0C,OAAO,IAAP;EAE1C,oBACE,uDACE,oBAAC,IAAD;IAAM,KAAK,EAAEA,KAAK,CAAC/B;EAAnB,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAE+B,KAAK,CAAC7B;EAAnB,GAAoCA,cAApC,CADF,eAEE,oBAAC,IAAD;IAAM,KAAK,EAAE6B,KAAK,CAAChB;EAAnB,GAAkCA,YAAlC,CAFF,eAGE,oBAAC,IAAD;IAAM,KAAK,EAAEgB,KAAK,CAACd;EAAnB,GAAkC5C,GAAG,CAAC,MAAD,EAASyD,QAAT,CAArC,CAHF,CADF,eAME,oBAAC,IAAD;IAAM,KAAK,EAAEC,KAAK,CAACX;EAAnB,gBACE,oBAAC,MAAD,EAAYU,QAAZ,CADF,CANF,eASE,oBAAC,SAAD;IAAW,KAAK,EAAEC,KAAK,CAACR;EAAxB,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAEQ,KAAK,CAACL;EAAnB,oBADF,CATF,CADF;AAeD,CA3BD;;AAiCA,MAAMQ,gBAAgB,GAAG,CAACC,GAAD,EAAcC,WAAd,KAAkD;EACzE,MAAMC,UAAU,GAAGD,WAAW,GAAG,EAAd,GAAmBD,GAAG,GAAG,CAA5C;EAEA,OAAOjE,UAAU,CAAC6B,MAAX,CAAkB;IACvBuC,KAAK,EAAE;MACLC,QAAQ,EAAE,UADL;MAELC,IAAI,EAAE,KAAKL,GAAG,GAAG,CAFZ;MAGLM,MAAM,EAAE,KAAKN,GAAG,GAAG,CAHd;MAILX,eAAe,EAAE,MAJZ;MAIoB;MACzBkB,MAAM,EAAE,KALH;MAMLpB,KAAK,EAAEe,UANF;MAOLpC,cAAc,EAAE,eAPX;MAQL0C,UAAU,EAAE,QARP;MASLC,OAAO,EAAE,EATJ;MAULC,WAAW,EAAE,MAVR;MAWLC,YAAY,EAAE;QAACxB,KAAK,EAAE,CAAR;QAAWoB,MAAM,EAAE,CAAC;MAApB,CAXT;MAYLK,aAAa,EAAE,IAZV;MAaLC,YAAY,EAAE,EAbT;MAcLC,SAAS,EAAE,KAAKd,GAAG,GAAG,CAdjB;MAeLV,YAAY,EAAE;IAfT;EADgB,CAAlB,CAAP;AAmBD,CAtBD;;AAwBA,MAAMyB,KAAK,GAAIrB,KAAD,IAA6B;EACzC,MAAM;IAACS,KAAD;IAAQ1D,oBAAR;IAA8BuD,GAA9B;IAAmCtD,UAAU,GAAG;EAAhD,IAAuDgD,KAA7D;EAEA,MAAM;IAACP;EAAD,IAAUnD,mBAAmB,EAAnC;EACA,MAAMgF,UAAU,GAAGjB,gBAAgB,CAACC,GAAD,EAAMb,KAAN,CAAnC;EAEA,MAAM;IACJ8B,OADI;IAEJC,kBAFI;IAGJtC,YAHI;IAIJe,QAJI;IAKJhD,mBALI;IAMJC;EANI,IAOFuD,KAPJ;EASA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAEa,UAAU,CAACb;EAAxB,GACGc,OAAO;EAAA;EACN;EACA,oBAAC,IAAD,yBAAoBjB,GAApB,CAFM,gBAIN,uDACE,oBAAC,QAAD;IACE,cAAc,EAAEkB,kBADlB;IAEE,YAAY,EAAEtC,YAFhB;IAGE,QAAQ,EAAEe,QAHZ;IAIE,GAAG,EAAC;EAJN,EADF,EAOGlD,oBAAoB,gBACnB,oBAAC,eAAD;IACE,oBAAoB,EAAEA,oBADxB;IAEE,UAAU,EAAEC,UAFd;IAGE,mBAAmB,EAAEC,mBAHvB;IAIE,sBAAsB,EAAEC,sBAJ1B;IAKE,GAAG,EAAC;EALN,EADmB,GAQjB,IAfN,CALJ,CADF;AA0BD,CAzCD;;AA2CA,eAAemE,KAAf"}

package/es/organism/review-slide/prop-types.d.ts

@@ -12,7 +12,7 @@ export declare const SlidePropsTypes: PropTypes.Requireable<PropTypes.InferProps
     parentContentTitle: PropTypes.Requireable<string>;
     questionText: PropTypes.Requireable<string>;
     answerUI: PropTypes.Requireable<PropTypes.InferProps<{
-        model: PropTypes.Validator<PropTypes.InferProps<{
+        model: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
             type: PropTypes.Validator<string>;
             answer: PropTypes.Requireable<(PropTypes.InferProps<{
                 title: PropTypes.Validator<string>;
@@ -30,9 +30,9 @@ export declare const SlidePropsTypes: PropTypes.Requireable<PropTypes.InferProps
                 type: PropTypes.Requireable<string>;
                 name: PropTypes.Requireable<string>;
             }> | null | undefined)[]>;
-        }>>;
+        }>>>;
         help: PropTypes.Requireable<string>;
-        media: PropTypes.Requireable<PropTypes.InferProps<{
+        media: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
             type: PropTypes.Validator<string>;
             id: PropTypes.Requireable<string>;
             width: PropTypes.Requireable<string>;
@@ -72,7 +72,7 @@ export declare const SlidePropsTypes: PropTypes.Requireable<PropTypes.InferProps
         }> | PropTypes.InferProps<{
             type: PropTypes.Validator<string>;
             mediaUrl: PropTypes.Validator<string>;
-        }>>;
+        }> | null | undefined>>;
     }>>;
 }>>;
 declare const propTypes: {
@@ -88,7 +88,7 @@ declare const propTypes: {
         parentContentTitle: PropTypes.Requireable<string>;
         questionText: PropTypes.Requireable<string>;
         answerUI: PropTypes.Requireable<PropTypes.InferProps<{
-            model: PropTypes.Validator<PropTypes.InferProps<{
+            model: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
                 type: PropTypes.Validator<string>;
                 answer: PropTypes.Requireable<(PropTypes.InferProps<{
                     title: PropTypes.Validator<string>;
@@ -106,9 +106,9 @@ declare const propTypes: {
                     type: PropTypes.Requireable<string>;
                     name: PropTypes.Requireable<string>;
                 }> | null | undefined)[]>;
-            }>>;
+            }>>>;
             help: PropTypes.Requireable<string>;
-            media: PropTypes.Requireable<PropTypes.InferProps<{
+            media: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                 type: PropTypes.Validator<string>;
                 id: PropTypes.Requireable<string>;
                 width: PropTypes.Requireable<string>;
@@ -148,7 +148,7 @@ declare const propTypes: {
             }> | PropTypes.InferProps<{
                 type: PropTypes.Validator<string>;
                 mediaUrl: PropTypes.Validator<string>;
-            }>>;
+            }> | null | undefined>>;
         }>>;
     }>>;
     validateButton: PropTypes.Requireable<PropTypes.InferProps<{

package/es/organism/review-slide/prop-types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/organism/review-slide/prop-types.ts"],"names":["PropTypes","ReviewCorrectionPopinPropTypes","AnswerPropTypes","SlidePropsTypes","shape","position","number","loading","bool","loadingAriaLabel","string","animationType","isCorrect","animateCorrectionPopin","showCorrectionPopin","parentContentTitle","questionText","answerUI","propTypes","slideIndex","slide","validateButton","label","isRequired","onClick","func","disabled","correctionPopinProps","klf","information","next","resultLabel","type"],"mappings":"AAAA,OAAOA,SAAP,MAAsB,YAAtB;AACA,OAAOC,8BAAP,MAEO,mDAFP;AAGA,OAAOC,eAAP,MAA2C,kCAA3C;AAEA,OAAO,MAAMC,eAAe,GAAGH,SAAS,CAACI,KAAV,CAAgB;AAC7CC,EAAAA,QAAQ,EAAEL,SAAS,CAACM,MADyB;AAE7CC,EAAAA,OAAO,EAAEP,SAAS,CAACQ,IAF0B;AAG7CC,EAAAA,gBAAgB,EAAET,SAAS,CAACU,MAHiB;AAI7CC,EAAAA,aAAa,EAAEX,SAAS,CAACU,MAJoB;AAIZ;AACjCE,EAAAA,SAAS,EAAEZ,SAAS,CAACQ,IALwB;AAM7CK,EAAAA,sBAAsB,EAAEb,SAAS,CAACQ,IANW;AAO7CM,EAAAA,mBAAmB,EAAEd,SAAS,CAACQ,IAPc;AAQ7CO,EAAAA,kBAAkB,EAAEf,SAAS,CAACU,MARe;AAS7CM,EAAAA,YAAY,EAAEhB,SAAS,CAACU,MATqB;AAU7CO,EAAAA,QAAQ,EAAEjB,SAAS,CAACI,KAAV,CAAgBF,eAAhB;AAVmC,CAAhB,CAAxB;AAaP,MAAMgB,SAAS,GAAG;AAChBC,EAAAA,UAAU,EAAEnB,SAAS,CAACU,MADN;AAEhBU,EAAAA,KAAK,EAAEjB,eAFS;AAGhBkB,EAAAA,cAAc,EAAErB,SAAS,CAACI,KAAV,CAAgB;AAC9BkB,IAAAA,KAAK,EAAEtB,SAAS,CAACU,MAAV,CAAiBa,UADM;AAE9BC,IAAAA,OAAO,EAAExB,SAAS,CAACyB,IAAV,CAAeF,UAFM;AAG9BG,IAAAA,QAAQ,EAAE1B,SAAS,CAACQ;AAHU,GAAhB,CAHA;AAQhBmB,EAAAA,oBAAoB,EAAE3B,SAAS,CAACI,KAAV,CAAgB;AACpCwB,IAAAA,GAAG,EAAE3B,8BAA8B,CAAC2B,GADA;AAEpCC,IAAAA,WAAW,EAAE5B,8BAA8B,CAAC4B,WAFR;AAGpCC,IAAAA,IAAI,EAAE9B,SAAS,CAACI,KAAV,CAAgB;AACpBkB,MAAAA,KAAK,EAAEtB,SAAS,CAACU,MADG;AAEpB,oBAAcV,SAAS,CAACU,MAFJ,CAEW;AAC/B;;AAHoB,KAAhB,CAH8B;AAQpCqB,IAAAA,WAAW,EAAE9B,8BAA8B,CAAC8B,WARR;AASpCC,IAAAA,IAAI,EAAE/B,8BAA8B,CAAC+B;AATD,GAAhB;AARN,CAAlB;AAqBA,eAAed,SAAf","sourcesContent":["import PropTypes from 'prop-types';\nimport ReviewCorrectionPopinPropTypes, {\n  ReviewCorrectionPopinProps\n} from '../../molecule/review-correction-popin/prop-types';\nimport AnswerPropTypes, {AnswerProps} from '../../molecule/answer/prop-types';\n\nexport const SlidePropsTypes = PropTypes.shape({\n  position: PropTypes.number,\n  loading: PropTypes.bool,\n  loadingAriaLabel: PropTypes.string,\n  animationType: PropTypes.string, // 'unstack' | 'restack'\n  isCorrect: PropTypes.bool,\n  animateCorrectionPopin: PropTypes.bool,\n  showCorrectionPopin: PropTypes.bool,\n  parentContentTitle: PropTypes.string,\n  questionText: PropTypes.string,\n  answerUI: PropTypes.shape(AnswerPropTypes)\n});\n\nconst propTypes = {\n  slideIndex: PropTypes.string,\n  slide: SlidePropsTypes,\n  validateButton: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    onClick: PropTypes.func.isRequired,\n    disabled: PropTypes.bool\n  }),\n  correctionPopinProps: PropTypes.shape({\n    klf: ReviewCorrectionPopinPropTypes.klf,\n    information: ReviewCorrectionPopinPropTypes.information,\n    next: PropTypes.shape({\n      label: PropTypes.string,\n      'aria-label': PropTypes.string // Pourquoi le onClick du next n'est pas ici !\n      // updateSlidesOnNext: PropTypes.func.isRequired ???\n    }),\n    resultLabel: ReviewCorrectionPopinPropTypes.resultLabel,\n    type: ReviewCorrectionPopinPropTypes.type\n  })\n};\n\nexport default propTypes;\n\nexport type SlideProps = {\n  position: number;\n  loading: boolean;\n  loadingAriaLabel?: string;\n  animationType?: 'unstack' | 'restack';\n  isCorrect?: boolean;\n  animateCorrectionPopin?: boolean;\n  showCorrectionPopin?: boolean;\n  parentContentTitle?: string;\n  questionText?: string;\n  answerUI?: AnswerProps;\n};\n\nexport type ReviewSlideProps = {\n  slideIndex: string;\n  num: number;\n  slide: SlideProps;\n  correctionPopinProps?: ReviewCorrectionPopinProps;\n  validateButton: {\n    label: string;\n    onClick: () => void;\n    disabled: boolean;\n  };\n};\n"],"file":"prop-types.js"}
+{"version":3,"file":"prop-types.js","names":["PropTypes","ReviewCorrectionPopinPropTypes","AnswerPropTypes","SlidePropsTypes","shape","position","number","loading","bool","loadingAriaLabel","string","animationType","isCorrect","animateCorrectionPopin","showCorrectionPopin","parentContentTitle","questionText","answerUI","propTypes","slideIndex","slide","validateButton","label","isRequired","onClick","func","disabled","correctionPopinProps","klf","information","next","resultLabel","type"],"sources":["../../../src/organism/review-slide/prop-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport ReviewCorrectionPopinPropTypes, {\n  ReviewCorrectionPopinProps\n} from '../../molecule/review-correction-popin/prop-types';\nimport AnswerPropTypes, {AnswerProps} from '../../molecule/answer/prop-types';\n\nexport const SlidePropsTypes = PropTypes.shape({\n  position: PropTypes.number,\n  loading: PropTypes.bool,\n  loadingAriaLabel: PropTypes.string,\n  animationType: PropTypes.string, // 'unstack' | 'restack'\n  isCorrect: PropTypes.bool,\n  animateCorrectionPopin: PropTypes.bool,\n  showCorrectionPopin: PropTypes.bool,\n  parentContentTitle: PropTypes.string,\n  questionText: PropTypes.string,\n  answerUI: PropTypes.shape(AnswerPropTypes)\n});\n\nconst propTypes = {\n  slideIndex: PropTypes.string,\n  slide: SlidePropsTypes,\n  validateButton: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    onClick: PropTypes.func.isRequired,\n    disabled: PropTypes.bool\n  }),\n  correctionPopinProps: PropTypes.shape({\n    klf: ReviewCorrectionPopinPropTypes.klf,\n    information: ReviewCorrectionPopinPropTypes.information,\n    next: PropTypes.shape({\n      label: PropTypes.string,\n      'aria-label': PropTypes.string // Pourquoi le onClick du next n'est pas ici !\n      // updateSlidesOnNext: PropTypes.func.isRequired ???\n    }),\n    resultLabel: ReviewCorrectionPopinPropTypes.resultLabel,\n    type: ReviewCorrectionPopinPropTypes.type\n  })\n};\n\nexport default propTypes;\n\nexport type SlideProps = {\n  position: number;\n  loading: boolean;\n  loadingAriaLabel?: string;\n  animationType?: 'unstack' | 'restack';\n  isCorrect?: boolean;\n  animateCorrectionPopin?: boolean;\n  showCorrectionPopin?: boolean;\n  parentContentTitle?: string;\n  questionText?: string;\n  answerUI?: AnswerProps;\n};\n\nexport type ReviewSlideProps = {\n  slideIndex: string;\n  num: number;\n  slide: SlideProps;\n  correctionPopinProps?: ReviewCorrectionPopinProps;\n  validateButton: {\n    label: string;\n    onClick: () => void;\n    disabled: boolean;\n  };\n};\n"],"mappings":"AAAA,OAAOA,SAAP,MAAsB,YAAtB;AACA,OAAOC,8BAAP,MAEO,mDAFP;AAGA,OAAOC,eAAP,MAA2C,kCAA3C;AAEA,OAAO,MAAMC,eAAe,GAAGH,SAAS,CAACI,KAAV,CAAgB;EAC7CC,QAAQ,EAAEL,SAAS,CAACM,MADyB;EAE7CC,OAAO,EAAEP,SAAS,CAACQ,IAF0B;EAG7CC,gBAAgB,EAAET,SAAS,CAACU,MAHiB;EAI7CC,aAAa,EAAEX,SAAS,CAACU,MAJoB;EAIZ;EACjCE,SAAS,EAAEZ,SAAS,CAACQ,IALwB;EAM7CK,sBAAsB,EAAEb,SAAS,CAACQ,IANW;EAO7CM,mBAAmB,EAAEd,SAAS,CAACQ,IAPc;EAQ7CO,kBAAkB,EAAEf,SAAS,CAACU,MARe;EAS7CM,YAAY,EAAEhB,SAAS,CAACU,MATqB;EAU7CO,QAAQ,EAAEjB,SAAS,CAACI,KAAV,CAAgBF,eAAhB;AAVmC,CAAhB,CAAxB;AAaP,MAAMgB,SAAS,GAAG;EAChBC,UAAU,EAAEnB,SAAS,CAACU,MADN;EAEhBU,KAAK,EAAEjB,eAFS;EAGhBkB,cAAc,EAAErB,SAAS,CAACI,KAAV,CAAgB;IAC9BkB,KAAK,EAAEtB,SAAS,CAACU,MAAV,CAAiBa,UADM;IAE9BC,OAAO,EAAExB,SAAS,CAACyB,IAAV,CAAeF,UAFM;IAG9BG,QAAQ,EAAE1B,SAAS,CAACQ;EAHU,CAAhB,CAHA;EAQhBmB,oBAAoB,EAAE3B,SAAS,CAACI,KAAV,CAAgB;IACpCwB,GAAG,EAAE3B,8BAA8B,CAAC2B,GADA;IAEpCC,WAAW,EAAE5B,8BAA8B,CAAC4B,WAFR;IAGpCC,IAAI,EAAE9B,SAAS,CAACI,KAAV,CAAgB;MACpBkB,KAAK,EAAEtB,SAAS,CAACU,MADG;MAEpB,cAAcV,SAAS,CAACU,MAFJ,CAEW;MAC/B;;IAHoB,CAAhB,CAH8B;IAQpCqB,WAAW,EAAE9B,8BAA8B,CAAC8B,WARR;IASpCC,IAAI,EAAE/B,8BAA8B,CAAC+B;EATD,CAAhB;AARN,CAAlB;AAqBA,eAAed,SAAf"}

package/es/organism/review-slide/style.css

@@ -112,6 +112,7 @@ _:-ms-fullscreen, :root .validateButtonWrapper {
   border-radius: 7px;
   margin: 0 15px 15px;
   width: 95%;
+  z-index: 100;
 }
 
 .popinAnimation {

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/review-stacked-slides/index.js"],"names":[],"mappings":"AAOA,mCAAoC;;AAqBpC;;;;;gBA6CC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/review-stacked-slides/index.js"],"names":[],"mappings":"AAOA,mCAAoC;;AA6BpC;;;;;gBA8CC"}

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

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || 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); }
-
 import React from 'react';
 import classnames from 'classnames';
 import _toString from 'lodash/fp/toString';
@@ -14,6 +12,13 @@ const stylesByPosition = {
   3: style.position3,
   4: style.position4
 };
+const unstackByPosition = {
+  0: style.slideOutAndIn0,
+  1: style.slideOutAndIn1,
+  2: style.slideOutAndIn2,
+  3: style.slideOutAndIn3,
+  4: style.slideOutAndIn4
+};
 
 const getSlideAnimation = (action, position) => {
   switch (action) {
@@ -21,10 +26,10 @@ const getSlideAnimation = (action, position) => {
       return style.slideOutHideAndIn;
 
     case 'restack':
-      return style.slideOutAndIn;
+      return unstackByPosition[position];
 
     default:
-      return position < 0 ? style.hiddenSlide : stylesByPosition[position];
+      return null;
   }
 };
 
@@ -46,15 +51,14 @@ const StackedSlides = ({
     const slideView = /*#__PURE__*/React.createElement("div", {
       key: `slide-${slideIndex}`,
       "data-name": `slide-${slideIndex}`,
-      className: classnames(style.slideBase, getSlideAnimation(animationType, position), endReview ? style.endReview : null)
-    }, /*#__PURE__*/React.createElement(ReviewSlide, _extends({
+      className: classnames(style.slideBase, getSlideAnimation(animationType, position), position < 0 ? style.hiddenSlide : stylesByPosition[position], endReview ? style.endReview : null)
+    }, /*#__PURE__*/React.createElement(ReviewSlide, {
       slideIndex: _toString(slideIndex),
       slide,
       validateButton,
-      correctionPopinProps
-    }, {
+      correctionPopinProps,
       key: slideIndex
-    })));
+    }));
     stackedSlides.push(slideView);
   }
 

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/organism/review-stacked-slides/index.js"],"names":["React","classnames","_toString","ReviewSlide","propTypes","style","TOTAL_SLIDES_STACK","stylesByPosition","position0","position1","position2","position3","position4","getSlideAnimation","action","position","slideOutHideAndIn","slideOutAndIn","hiddenSlide","StackedSlides","slides","endReview","validateButton","correctionPopinProps","stackedSlides","slideIndex","slide","animationType","slideView","slideBase","push","stackedSlidesYAxisOverflowContainer","stackedSlidesContainer"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,SAAP,MAAsB,oBAAtB;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,OAAO,MAAMC,kBAAkB,GAAG,CAA3B;AAEP,MAAMC,gBAAgB,GAAG;AACvB,KAAGF,KAAK,CAACG,SADc;AAEvB,KAAGH,KAAK,CAACI,SAFc;AAGvB,KAAGJ,KAAK,CAACK,SAHc;AAIvB,KAAGL,KAAK,CAACM,SAJc;AAKvB,KAAGN,KAAK,CAACO;AALc,CAAzB;;AAQA,MAAMC,iBAAiB,GAAG,CAACC,MAAD,EAASC,QAAT,KAAsB;AAC9C,UAAQD,MAAR;AACE,SAAK,SAAL;AACE,aAAOT,KAAK,CAACW,iBAAb;;AACF,SAAK,SAAL;AACE,aAAOX,KAAK,CAACY,aAAb;;AACF;AACE,aAAOF,QAAQ,GAAG,CAAX,GAAeV,KAAK,CAACa,WAArB,GAAmCX,gBAAgB,CAACQ,QAAD,CAA1D;AANJ;AAQD,CATD;;AAWA,MAAMI,aAAa,GAAG,CAAC;AAACC,EAAAA,MAAD;AAASC,EAAAA,SAAT;AAAoBC,EAAAA,cAApB;AAAoCC,EAAAA;AAApC,CAAD,KAA+D;AACnF,QAAMC,aAAa,GAAG,EAAtB,CADmF,CAEnF;;AACA,OAAK,IAAIC,UAAU,GAAG,CAAtB,EAAyBA,UAAU,GAAGnB,kBAAtC,EAA0DmB,UAAU,EAApE,EAAwE;AACtE,UAAMC,KAAK,GAAGN,MAAM,CAAClB,SAAS,CAACuB,UAAD,CAAV,CAApB;;AACA,UAAM;AAACE,MAAAA,aAAD;AAAgBZ,MAAAA;AAAhB,QAA4BW,KAAlC;AAEA,UAAME,SAAS,gBACb;AACE,MAAA,GAAG,EAAG,SAAQH,UAAW,EAD3B;AAEE,mBAAY,SAAQA,UAAW,EAFjC;AAGE,MAAA,SAAS,EAAExB,UAAU,CACnBI,KAAK,CAACwB,SADa,EAEnBhB,iBAAiB,CAACc,aAAD,EAAgBZ,QAAhB,CAFE,EAGnBM,SAAS,GAAGhB,KAAK,CAACgB,SAAT,GAAqB,IAHX;AAHvB,oBASE,oBAAC,WAAD,WACM;AACFI,MAAAA,UAAU,EAAEvB,SAAS,CAACuB,UAAD,CADnB;AAEFC,MAAAA,KAFE;AAGFJ,MAAAA,cAHE;AAIFC,MAAAA;AAJE,KADN;AAOE,MAAA,GAAG,EAAEE;AAPP,OATF,CADF;AAqBAD,IAAAA,aAAa,CAACM,IAAd,CAAmBF,SAAnB;AACD;;AAED,sBACE;AACE,IAAA,GAAG,EAAC,qCADN;AAEE,IAAA,SAAS,EAAEvB,KAAK,CAAC0B;AAFnB,kBAIE;AACE,IAAA,GAAG,EAAC,0BADN;AAEE,iBAAU,0BAFZ;AAGE,IAAA,SAAS,EAAE1B,KAAK,CAAC2B;AAHnB,KAKGR,aALH,CAJF,CADF;AAcD,CA7CD;;AA+CAL,aAAa,CAACf,SAAd,2CAA0BA,SAA1B;AAEA,eAAee,aAAf","sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport _toString from 'lodash/fp/toString';\nimport ReviewSlide from '../review-slide';\nimport propTypes from './prop-types';\nimport style from './style.css';\n\nexport const TOTAL_SLIDES_STACK = 5;\n\nconst stylesByPosition = {\n  0: style.position0,\n  1: style.position1,\n  2: style.position2,\n  3: style.position3,\n  4: style.position4\n};\n\nconst getSlideAnimation = (action, position) => {\n  switch (action) {\n    case 'unstack':\n      return style.slideOutHideAndIn;\n    case 'restack':\n      return style.slideOutAndIn;\n    default:\n      return position < 0 ? style.hiddenSlide : stylesByPosition[position];\n  }\n};\n\nconst StackedSlides = ({slides, endReview, validateButton, correctionPopinProps}) => {\n  const stackedSlides = [];\n  // eslint-disable-next-line fp/no-loops\n  for (let slideIndex = 0; slideIndex < TOTAL_SLIDES_STACK; slideIndex++) {\n    const slide = slides[_toString(slideIndex)];\n    const {animationType, position} = slide;\n\n    const slideView = (\n      <div\n        key={`slide-${slideIndex}`}\n        data-name={`slide-${slideIndex}`}\n        className={classnames(\n          style.slideBase,\n          getSlideAnimation(animationType, position),\n          endReview ? style.endReview : null\n        )}\n      >\n        <ReviewSlide\n          {...{\n            slideIndex: _toString(slideIndex),\n            slide,\n            validateButton,\n            correctionPopinProps\n          }}\n          key={slideIndex}\n        />\n      </div>\n    );\n    stackedSlides.push(slideView);\n  }\n\n  return (\n    <div\n      key=\"stacked-slides-container-y-overflow\"\n      className={style.stackedSlidesYAxisOverflowContainer}\n    >\n      <div\n        key=\"stacked-slides-container\"\n        data-name=\"stacked-slides-container\"\n        className={style.stackedSlidesContainer}\n      >\n        {stackedSlides}\n      </div>\n    </div>\n  );\n};\n\nStackedSlides.propTypes = propTypes;\n\nexport default StackedSlides;\n"],"file":"index.js"}
+{"version":3,"file":"index.js","names":["React","classnames","_toString","ReviewSlide","propTypes","style","TOTAL_SLIDES_STACK","stylesByPosition","position0","position1","position2","position3","position4","unstackByPosition","slideOutAndIn0","slideOutAndIn1","slideOutAndIn2","slideOutAndIn3","slideOutAndIn4","getSlideAnimation","action","position","slideOutHideAndIn","StackedSlides","slides","endReview","validateButton","correctionPopinProps","stackedSlides","slideIndex","slide","animationType","slideView","slideBase","hiddenSlide","push","stackedSlidesYAxisOverflowContainer","stackedSlidesContainer"],"sources":["../../../src/organism/review-stacked-slides/index.js"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport _toString from 'lodash/fp/toString';\nimport ReviewSlide from '../review-slide';\nimport propTypes from './prop-types';\nimport style from './style.css';\n\nexport const TOTAL_SLIDES_STACK = 5;\n\nconst stylesByPosition = {\n  0: style.position0,\n  1: style.position1,\n  2: style.position2,\n  3: style.position3,\n  4: style.position4\n};\n\nconst unstackByPosition = {\n  0: style.slideOutAndIn0,\n  1: style.slideOutAndIn1,\n  2: style.slideOutAndIn2,\n  3: style.slideOutAndIn3,\n  4: style.slideOutAndIn4\n};\n\nconst getSlideAnimation = (action, position) => {\n  switch (action) {\n    case 'unstack':\n      return style.slideOutHideAndIn;\n    case 'restack':\n      return unstackByPosition[position];\n    default:\n      return null;\n  }\n};\n\nconst StackedSlides = ({slides, endReview, validateButton, correctionPopinProps}) => {\n  const stackedSlides = [];\n  // eslint-disable-next-line fp/no-loops\n  for (let slideIndex = 0; slideIndex < TOTAL_SLIDES_STACK; slideIndex++) {\n    const slide = slides[_toString(slideIndex)];\n    const {animationType, position} = slide;\n\n    const slideView = (\n      <div\n        key={`slide-${slideIndex}`}\n        data-name={`slide-${slideIndex}`}\n        className={classnames(\n          style.slideBase,\n          getSlideAnimation(animationType, position),\n          position < 0 ? style.hiddenSlide : stylesByPosition[position],\n          endReview ? style.endReview : null\n        )}\n      >\n        <ReviewSlide\n          {...{\n            slideIndex: _toString(slideIndex),\n            slide,\n            validateButton,\n            correctionPopinProps\n          }}\n          key={slideIndex}\n        />\n      </div>\n    );\n    stackedSlides.push(slideView);\n  }\n\n  return (\n    <div\n      key=\"stacked-slides-container-y-overflow\"\n      className={style.stackedSlidesYAxisOverflowContainer}\n    >\n      <div\n        key=\"stacked-slides-container\"\n        data-name=\"stacked-slides-container\"\n        className={style.stackedSlidesContainer}\n      >\n        {stackedSlides}\n      </div>\n    </div>\n  );\n};\n\nStackedSlides.propTypes = propTypes;\n\nexport default StackedSlides;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,SAAP,MAAsB,oBAAtB;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,OAAO,MAAMC,kBAAkB,GAAG,CAA3B;AAEP,MAAMC,gBAAgB,GAAG;EACvB,GAAGF,KAAK,CAACG,SADc;EAEvB,GAAGH,KAAK,CAACI,SAFc;EAGvB,GAAGJ,KAAK,CAACK,SAHc;EAIvB,GAAGL,KAAK,CAACM,SAJc;EAKvB,GAAGN,KAAK,CAACO;AALc,CAAzB;AAQA,MAAMC,iBAAiB,GAAG;EACxB,GAAGR,KAAK,CAACS,cADe;EAExB,GAAGT,KAAK,CAACU,cAFe;EAGxB,GAAGV,KAAK,CAACW,cAHe;EAIxB,GAAGX,KAAK,CAACY,cAJe;EAKxB,GAAGZ,KAAK,CAACa;AALe,CAA1B;;AAQA,MAAMC,iBAAiB,GAAG,CAACC,MAAD,EAASC,QAAT,KAAsB;EAC9C,QAAQD,MAAR;IACE,KAAK,SAAL;MACE,OAAOf,KAAK,CAACiB,iBAAb;;IACF,KAAK,SAAL;MACE,OAAOT,iBAAiB,CAACQ,QAAD,CAAxB;;IACF;MACE,OAAO,IAAP;EANJ;AAQD,CATD;;AAWA,MAAME,aAAa,GAAG,CAAC;EAACC,MAAD;EAASC,SAAT;EAAoBC,cAApB;EAAoCC;AAApC,CAAD,KAA+D;EACnF,MAAMC,aAAa,GAAG,EAAtB,CADmF,CAEnF;;EACA,KAAK,IAAIC,UAAU,GAAG,CAAtB,EAAyBA,UAAU,GAAGvB,kBAAtC,EAA0DuB,UAAU,EAApE,EAAwE;IACtE,MAAMC,KAAK,GAAGN,MAAM,CAACtB,SAAS,CAAC2B,UAAD,CAAV,CAApB;;IACA,MAAM;MAACE,aAAD;MAAgBV;IAAhB,IAA4BS,KAAlC;IAEA,MAAME,SAAS,gBACb;MACE,GAAG,EAAG,SAAQH,UAAW,EAD3B;MAEE,aAAY,SAAQA,UAAW,EAFjC;MAGE,SAAS,EAAE5B,UAAU,CACnBI,KAAK,CAAC4B,SADa,EAEnBd,iBAAiB,CAACY,aAAD,EAAgBV,QAAhB,CAFE,EAGnBA,QAAQ,GAAG,CAAX,GAAehB,KAAK,CAAC6B,WAArB,GAAmC3B,gBAAgB,CAACc,QAAD,CAHhC,EAInBI,SAAS,GAAGpB,KAAK,CAACoB,SAAT,GAAqB,IAJX;IAHvB,gBAUE,oBAAC,WAAD;MAEII,UAAU,EAAE3B,SAAS,CAAC2B,UAAD,CAFzB;MAGIC,KAHJ;MAIIJ,cAJJ;MAKIC,oBALJ;MAOE,GAAG,EAAEE;IAPP,EAVF,CADF;IAsBAD,aAAa,CAACO,IAAd,CAAmBH,SAAnB;EACD;;EAED,oBACE;IACE,GAAG,EAAC,qCADN;IAEE,SAAS,EAAE3B,KAAK,CAAC+B;EAFnB,gBAIE;IACE,GAAG,EAAC,0BADN;IAEE,aAAU,0BAFZ;IAGE,SAAS,EAAE/B,KAAK,CAACgC;EAHnB,GAKGT,aALH,CAJF,CADF;AAcD,CA9CD;;AAgDAL,aAAa,CAACnB,SAAd,2CAA0BA,SAA1B;AAEA,eAAemB,aAAf"}

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ReviewStackProps } from './prop-types';
 export declare const TOTAL_SLIDES_STACK = 5;
 declare const StackedSlides: (props: ReviewStackProps) => JSX.Element;

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":"AAIA,OAAO,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAE9C,eAAO,MAAM,kBAAkB,IAAI,CAAC;AAUpC,QAAA,MAAM,aAAa,UAAW,gBAAgB,gBAuB7C,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-stacked-slides/index.native.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAE9C,eAAO,MAAM,kBAAkB,IAAI,CAAC;AAUpC,QAAA,MAAM,aAAa,UAAW,gBAAgB,gBAuB7C,CAAC;AAEF,eAAe,aAAa,CAAC"}

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

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || 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); }
-
 import React from 'react';
 import { StyleSheet, View } from 'react-native';
 import keys from 'lodash/fp/keys';
@@ -23,15 +21,14 @@ const StackedSlides = props => {
   const stackedSlides = indexes.map(slideIndex => {
     const slide = slides[slideIndex]; // const {animationType, hidden, position} = slide;
 
-    return /*#__PURE__*/React.createElement(Slide, _extends({
+    return /*#__PURE__*/React.createElement(Slide, {
       num: Number.parseInt(slideIndex),
       slideIndex,
       slide,
       validateButton,
-      correctionPopinProps
-    }, {
+      correctionPopinProps,
       key: slideIndex
-    }));
+    });
   });
   return /*#__PURE__*/React.createElement(View, {
     style: style.slides

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/organism/review-stacked-slides/index.native.tsx"],"names":["React","StyleSheet","View","keys","Slide","TOTAL_SLIDES_STACK","style","create","slides","flex","height","width","StackedSlides","props","validateButton","correctionPopinProps","indexes","reverse","stackedSlides","map","slideIndex","slide","num","Number","parseInt"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAQC,UAAR,EAAoBC,IAApB,QAA+B,cAA/B;AACA,OAAOC,IAAP,MAAiB,gBAAjB;AACA,OAAOC,KAAP,MAAkB,8BAAlB;AAGA,OAAO,MAAMC,kBAAkB,GAAG,CAA3B;AAEP,MAAMC,KAAK,GAAGL,UAAU,CAACM,MAAX,CAAkB;AAC9BC,EAAAA,MAAM,EAAE;AACNC,IAAAA,IAAI,EAAE,CADA;AAENC,IAAAA,MAAM,EAAE,MAFF;AAGNC,IAAAA,KAAK,EAAE;AAHD;AADsB,CAAlB,CAAd;;AAQA,MAAMC,aAAa,GAAIC,KAAD,IAA6B;AACjD,QAAM;AAACL,IAAAA,MAAD;AAASM,IAAAA,cAAT;AAAyBC,IAAAA;AAAzB,MAAiDF,KAAvD;AAEA,QAAMG,OAAO,GAAGb,IAAI,CAACK,MAAD,CAAJ,CAAaS,OAAb,EAAhB;AACA,QAAMC,aAAa,GAAGF,OAAO,CAACG,GAAR,CAAYC,UAAU,IAAI;AAC9C,UAAMC,KAAK,GAAGb,MAAM,CAACY,UAAD,CAApB,CAD8C,CAE9C;;AAEA,wBACE,oBAAC,KAAD,WACM;AACFE,MAAAA,GAAG,EAAEC,MAAM,CAACC,QAAP,CAAgBJ,UAAhB,CADH;AAEFA,MAAAA,UAFE;AAGFC,MAAAA,KAHE;AAIFP,MAAAA,cAJE;AAKFC,MAAAA;AALE,KADN;AAQE,MAAA,GAAG,EAAEK;AARP,OADF;AAYD,GAhBqB,CAAtB;AAkBA,sBAAO,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAEd,KAAK,CAACE;AAAnB,KAA4BU,aAA5B,CAAP;AACD,CAvBD;;AAyBA,eAAeN,aAAf","sourcesContent":["import React from 'react';\nimport {StyleSheet, View} from 'react-native';\nimport keys from 'lodash/fp/keys';\nimport Slide from '../review-slide/index.native';\nimport {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\nconst StackedSlides = (props: ReviewStackProps) => {\n  const {slides, validateButton, correctionPopinProps} = props;\n\n  const indexes = keys(slides).reverse();\n  const stackedSlides = indexes.map(slideIndex => {\n    const slide = slides[slideIndex];\n    // const {animationType, hidden, position} = slide;\n\n    return (\n      <Slide\n        {...{\n          num: Number.parseInt(slideIndex),\n          slideIndex,\n          slide,\n          validateButton,\n          correctionPopinProps\n        }}\n        key={slideIndex}\n      />\n    );\n  });\n\n  return <View style={style.slides}>{stackedSlides}</View>;\n};\n\nexport default StackedSlides;\n"],"file":"index.native.js"}
+{"version":3,"file":"index.native.js","names":["React","StyleSheet","View","keys","Slide","TOTAL_SLIDES_STACK","style","create","slides","flex","height","width","StackedSlides","props","validateButton","correctionPopinProps","indexes","reverse","stackedSlides","map","slideIndex","slide","num","Number","parseInt"],"sources":["../../../src/organism/review-stacked-slides/index.native.tsx"],"sourcesContent":["import React from 'react';\nimport {StyleSheet, View} from 'react-native';\nimport keys from 'lodash/fp/keys';\nimport Slide from '../review-slide/index.native';\nimport {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\nconst StackedSlides = (props: ReviewStackProps) => {\n  const {slides, validateButton, correctionPopinProps} = props;\n\n  const indexes = keys(slides).reverse();\n  const stackedSlides = indexes.map(slideIndex => {\n    const slide = slides[slideIndex];\n    // const {animationType, hidden, position} = slide;\n\n    return (\n      <Slide\n        {...{\n          num: Number.parseInt(slideIndex),\n          slideIndex,\n          slide,\n          validateButton,\n          correctionPopinProps\n        }}\n        key={slideIndex}\n      />\n    );\n  });\n\n  return <View style={style.slides}>{stackedSlides}</View>;\n};\n\nexport default StackedSlides;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAQC,UAAR,EAAoBC,IAApB,QAA+B,cAA/B;AACA,OAAOC,IAAP,MAAiB,gBAAjB;AACA,OAAOC,KAAP,MAAkB,8BAAlB;AAGA,OAAO,MAAMC,kBAAkB,GAAG,CAA3B;AAEP,MAAMC,KAAK,GAAGL,UAAU,CAACM,MAAX,CAAkB;EAC9BC,MAAM,EAAE;IACNC,IAAI,EAAE,CADA;IAENC,MAAM,EAAE,MAFF;IAGNC,KAAK,EAAE;EAHD;AADsB,CAAlB,CAAd;;AAQA,MAAMC,aAAa,GAAIC,KAAD,IAA6B;EACjD,MAAM;IAACL,MAAD;IAASM,cAAT;IAAyBC;EAAzB,IAAiDF,KAAvD;EAEA,MAAMG,OAAO,GAAGb,IAAI,CAACK,MAAD,CAAJ,CAAaS,OAAb,EAAhB;EACA,MAAMC,aAAa,GAAGF,OAAO,CAACG,GAAR,CAAYC,UAAU,IAAI;IAC9C,MAAMC,KAAK,GAAGb,MAAM,CAACY,UAAD,CAApB,CAD8C,CAE9C;;IAEA,oBACE,oBAAC,KAAD;MAEIE,GAAG,EAAEC,MAAM,CAACC,QAAP,CAAgBJ,UAAhB,CAFT;MAGIA,UAHJ;MAIIC,KAJJ;MAKIP,cALJ;MAMIC,oBANJ;MAQE,GAAG,EAAEK;IARP,EADF;EAYD,CAhBqB,CAAtB;EAkBA,oBAAO,oBAAC,IAAD;IAAM,KAAK,EAAEd,KAAK,CAACE;EAAnB,GAA4BU,aAA5B,CAAP;AACD,CAvBD;;AAyBA,eAAeN,aAAf"}

package/es/organism/review-stacked-slides/prop-types.d.ts

@@ -23,7 +23,7 @@ declare const propTypes: {
         resultLabel: PropTypes.Requireable<string>;
         type: PropTypes.Requireable<string>;
     }>>;
-    slides: PropTypes.Validator<PropTypes.InferProps<{
+    slides: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
         '0': PropTypes.Requireable<PropTypes.InferProps<{
             position: PropTypes.Requireable<number>;
             loading: PropTypes.Requireable<boolean>;
@@ -35,7 +35,7 @@ declare const propTypes: {
             parentContentTitle: PropTypes.Requireable<string>;
             questionText: PropTypes.Requireable<string>;
             answerUI: PropTypes.Requireable<PropTypes.InferProps<{
-                model: PropTypes.Validator<PropTypes.InferProps<{
+                model: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     answer: PropTypes.Requireable<(PropTypes.InferProps<{
                         title: PropTypes.Validator<string>;
@@ -53,9 +53,9 @@ declare const propTypes: {
                         type: PropTypes.Requireable<string>;
                         name: PropTypes.Requireable<string>;
                     }> | null | undefined)[]>;
-                }>>;
+                }>>>;
                 help: PropTypes.Requireable<string>;
-                media: PropTypes.Requireable<PropTypes.InferProps<{
+                media: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     id: PropTypes.Requireable<string>;
                     width: PropTypes.Requireable<string>;
@@ -95,7 +95,7 @@ declare const propTypes: {
                 }> | PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     mediaUrl: PropTypes.Validator<string>;
-                }>>;
+                }> | null | undefined>>;
             }>>;
         }>>;
         '1': PropTypes.Requireable<PropTypes.InferProps<{
@@ -109,7 +109,7 @@ declare const propTypes: {
             parentContentTitle: PropTypes.Requireable<string>;
             questionText: PropTypes.Requireable<string>;
             answerUI: PropTypes.Requireable<PropTypes.InferProps<{
-                model: PropTypes.Validator<PropTypes.InferProps<{
+                model: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     answer: PropTypes.Requireable<(PropTypes.InferProps<{
                         title: PropTypes.Validator<string>;
@@ -127,9 +127,9 @@ declare const propTypes: {
                         type: PropTypes.Requireable<string>;
                         name: PropTypes.Requireable<string>;
                     }> | null | undefined)[]>;
-                }>>;
+                }>>>;
                 help: PropTypes.Requireable<string>;
-                media: PropTypes.Requireable<PropTypes.InferProps<{
+                media: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     id: PropTypes.Requireable<string>;
                     width: PropTypes.Requireable<string>;
@@ -169,7 +169,7 @@ declare const propTypes: {
                 }> | PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     mediaUrl: PropTypes.Validator<string>;
-                }>>;
+                }> | null | undefined>>;
             }>>;
         }>>;
         '2': PropTypes.Requireable<PropTypes.InferProps<{
@@ -183,7 +183,7 @@ declare const propTypes: {
             parentContentTitle: PropTypes.Requireable<string>;
             questionText: PropTypes.Requireable<string>;
             answerUI: PropTypes.Requireable<PropTypes.InferProps<{
-                model: PropTypes.Validator<PropTypes.InferProps<{
+                model: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     answer: PropTypes.Requireable<(PropTypes.InferProps<{
                         title: PropTypes.Validator<string>;
@@ -201,9 +201,9 @@ declare const propTypes: {
                         type: PropTypes.Requireable<string>;
                         name: PropTypes.Requireable<string>;
                     }> | null | undefined)[]>;
-                }>>;
+                }>>>;
                 help: PropTypes.Requireable<string>;
-                media: PropTypes.Requireable<PropTypes.InferProps<{
+                media: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     id: PropTypes.Requireable<string>;
                     width: PropTypes.Requireable<string>;
@@ -243,7 +243,7 @@ declare const propTypes: {
                 }> | PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     mediaUrl: PropTypes.Validator<string>;
-                }>>;
+                }> | null | undefined>>;
             }>>;
         }>>;
         '3': PropTypes.Requireable<PropTypes.InferProps<{
@@ -257,7 +257,7 @@ declare const propTypes: {
             parentContentTitle: PropTypes.Requireable<string>;
             questionText: PropTypes.Requireable<string>;
             answerUI: PropTypes.Requireable<PropTypes.InferProps<{
-                model: PropTypes.Validator<PropTypes.InferProps<{
+                model: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     answer: PropTypes.Requireable<(PropTypes.InferProps<{
                         title: PropTypes.Validator<string>;
@@ -275,9 +275,9 @@ declare const propTypes: {
                         type: PropTypes.Requireable<string>;
                         name: PropTypes.Requireable<string>;
                     }> | null | undefined)[]>;
-                }>>;
+                }>>>;
                 help: PropTypes.Requireable<string>;
-                media: PropTypes.Requireable<PropTypes.InferProps<{
+                media: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     id: PropTypes.Requireable<string>;
                     width: PropTypes.Requireable<string>;
@@ -317,7 +317,7 @@ declare const propTypes: {
                 }> | PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     mediaUrl: PropTypes.Validator<string>;
-                }>>;
+                }> | null | undefined>>;
             }>>;
         }>>;
         '4': PropTypes.Requireable<PropTypes.InferProps<{
@@ -331,7 +331,7 @@ declare const propTypes: {
             parentContentTitle: PropTypes.Requireable<string>;
             questionText: PropTypes.Requireable<string>;
             answerUI: PropTypes.Requireable<PropTypes.InferProps<{
-                model: PropTypes.Validator<PropTypes.InferProps<{
+                model: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     answer: PropTypes.Requireable<(PropTypes.InferProps<{
                         title: PropTypes.Validator<string>;
@@ -349,9 +349,9 @@ declare const propTypes: {
                         type: PropTypes.Requireable<string>;
                         name: PropTypes.Requireable<string>;
                     }> | null | undefined)[]>;
-                }>>;
+                }>>>;
                 help: PropTypes.Requireable<string>;
-                media: PropTypes.Requireable<PropTypes.InferProps<{
+                media: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     id: PropTypes.Requireable<string>;
                     width: PropTypes.Requireable<string>;
@@ -391,10 +391,10 @@ declare const propTypes: {
                 }> | PropTypes.InferProps<{
                     type: PropTypes.Validator<string>;
                     mediaUrl: PropTypes.Validator<string>;
-                }>>;
+                }> | null | undefined>>;
             }>>;
         }>>;
-    }>>;
+    }>>>;
     endReview: PropTypes.Requireable<boolean>;
 };
 export default propTypes;

package/es/organism/review-stacked-slides/prop-types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/organism/review-stacked-slides/prop-types.ts"],"names":["PropTypes","ReviewSlidePropTypes","SlidePropsTypes","propTypes","validateButton","correctionPopinProps","slides","shape","isRequired","endReview","bool"],"mappings":"AAAA,OAAOA,SAAP,MAAsB,YAAtB;AAGA,OAAOC,oBAAP,IAGEC,eAHF,QAIO,4BAJP;AAMA,MAAMC,SAAS,GAAG;AAChBC,EAAAA,cAAc,EAAEH,oBAAoB,CAACG,cADrB;AAEhBC,EAAAA,oBAAoB,EAAEJ,oBAAoB,CAACI,oBAF3B;AAGhBC,EAAAA,MAAM,EAAEN,SAAS,CAACO,KAAV,CAAgB;AACtB,SAAKL,eADiB;AAEtB,SAAKA,eAFiB;AAGtB,SAAKA,eAHiB;AAItB,SAAKA,eAJiB;AAKtB,SAAKA;AALiB,GAAhB,EAMLM,UATa;AAUhBC,EAAAA,SAAS,EAAET,SAAS,CAACU;AAVL,CAAlB;AAaA,eAAeP,SAAf","sourcesContent":["import PropTypes from 'prop-types';\nimport {ReviewCorrectionPopinProps} from '../../molecule/review-correction-popin/prop-types';\n\nimport ReviewSlidePropTypes, {\n  ReviewSlideProps,\n  SlideProps,\n  SlidePropsTypes\n} from '../review-slide/prop-types';\n\nconst propTypes = {\n  validateButton: ReviewSlidePropTypes.validateButton,\n  correctionPopinProps: ReviewSlidePropTypes.correctionPopinProps,\n  slides: PropTypes.shape({\n    '0': SlidePropsTypes,\n    '1': SlidePropsTypes,\n    '2': SlidePropsTypes,\n    '3': SlidePropsTypes,\n    '4': SlidePropsTypes\n  }).isRequired,\n  endReview: PropTypes.bool\n};\n\nexport default propTypes;\n\nexport type ReviewStackProps = {\n  validateButton: ReviewSlideProps['validateButton'];\n  correctionPopinProps?: ReviewCorrectionPopinProps;\n  slides: {[key: string]: SlideProps};\n  endReview: boolean;\n};\n"],"file":"prop-types.js"}
+{"version":3,"file":"prop-types.js","names":["PropTypes","ReviewSlidePropTypes","SlidePropsTypes","propTypes","validateButton","correctionPopinProps","slides","shape","isRequired","endReview","bool"],"sources":["../../../src/organism/review-stacked-slides/prop-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {ReviewCorrectionPopinProps} from '../../molecule/review-correction-popin/prop-types';\n\nimport ReviewSlidePropTypes, {\n  ReviewSlideProps,\n  SlideProps,\n  SlidePropsTypes\n} from '../review-slide/prop-types';\n\nconst propTypes = {\n  validateButton: ReviewSlidePropTypes.validateButton,\n  correctionPopinProps: ReviewSlidePropTypes.correctionPopinProps,\n  slides: PropTypes.shape({\n    '0': SlidePropsTypes,\n    '1': SlidePropsTypes,\n    '2': SlidePropsTypes,\n    '3': SlidePropsTypes,\n    '4': SlidePropsTypes\n  }).isRequired,\n  endReview: PropTypes.bool\n};\n\nexport default propTypes;\n\nexport type ReviewStackProps = {\n  validateButton: ReviewSlideProps['validateButton'];\n  correctionPopinProps?: ReviewCorrectionPopinProps;\n  slides: {[key: string]: SlideProps};\n  endReview: boolean;\n};\n"],"mappings":"AAAA,OAAOA,SAAP,MAAsB,YAAtB;AAGA,OAAOC,oBAAP,IAGEC,eAHF,QAIO,4BAJP;AAMA,MAAMC,SAAS,GAAG;EAChBC,cAAc,EAAEH,oBAAoB,CAACG,cADrB;EAEhBC,oBAAoB,EAAEJ,oBAAoB,CAACI,oBAF3B;EAGhBC,MAAM,EAAEN,SAAS,CAACO,KAAV,CAAgB;IACtB,KAAKL,eADiB;IAEtB,KAAKA,eAFiB;IAGtB,KAAKA,eAHiB;IAItB,KAAKA,eAJiB;IAKtB,KAAKA;EALiB,CAAhB,EAMLM,UATa;EAUhBC,SAAS,EAAET,SAAS,CAACU;AAVL,CAAlB;AAaA,eAAeP,SAAf"}

package/es/organism/review-stacked-slides/style.css

@@ -43,7 +43,6 @@
   width: 100%;
   transform: translate(0, 0);
   transition: transform 0.5s ease-in;
-  
 }
 
 .position1 {
@@ -97,18 +96,24 @@
   }
 }
 
-@keyframes slideOutAndIn {
+.slideOutHideAndIn {
+  pointer-events: none;
+  animation: slideOutHideAndSlideIn 2s ease forwards;
+}
+
+@keyframes slideOutAndInPosition4 {
   0% {
+    width: 100%;
     z-index: 55;
     transform: translate(0, 0);
   }
   50% {
-    width: 100%;
+    width: 97%;
     z-index: 50;
     transform: translate(0, 1000px);
   }
   60% {
-    width: 92%;
+    width: 95%;
     z-index: 30;
     transform: translate(3.2%, 900px);
   }
@@ -119,14 +124,121 @@
   }
 }
 
-.slideOutHideAndIn {
+.slideOutAndIn4 {
+  pointer-events: none;
+  animation: slideOutAndInPosition4 2s ease forwards;
+}
+
+@keyframes slideOutAndInPosition3 {
+  0% {
+    width: 100%;
+    z-index: 55;
+    transform: translate(0, 0);
+  }
+  50% {
+    width: 97%;
+    z-index: 50;
+    transform: translate(0, 1000px);
+  }
+  60% {
+    width: 95%;
+    z-index: 30;
+    transform: translate(3.2%, 900px);
+  }
+  100% {
+    z-index: 35;
+    width: 94%;
+    transform: translate(2.4%, -24px);
+  }
+}
+
+.slideOutAndIn3 {
+  pointer-events: none;
+  animation: slideOutAndInPosition3 2s ease forwards;
+}
+
+@keyframes slideOutAndInPosition2 {
+  0% {
+    width: 100%;
+    z-index: 55;
+    transform: translate(0, 0);
+  }
+  50% {
+    width: 97%;
+    z-index: 50;
+    transform: translate(0, 1000px);
+  }
+  60% {
+    width: 95%;
+    z-index: 30;
+    transform: translate(3.2%, 900px);
+  }
+  100% {
+    z-index: 40;
+    width: 96%;
+    transform: translate(1.6%, -16px);
+  }
+}
+
+.slideOutAndIn2 {
+  pointer-events: none;
+  animation: slideOutAndInPosition2 2s ease forwards;
+}
+
+@keyframes slideOutAndInPosition1 {
+  0% {
+    width: 100%;
+    z-index: 55;
+    transform: translate(0, 0);
+  }
+  50% {
+    width: 97%;
+    z-index: 50;
+    transform: translate(0, 1000px);
+  }
+  60% {
+    width: 95%;
+    z-index: 30;
+    transform: translate(3.2%, 900px);
+  }
+  100% {
+    z-index: 45;
+    width: 98%;
+    transform: translate(0.8%, -8px);
+  }
+}
+
+.slideOutAndIn1 {
   pointer-events: none;
-  animation: slideOutHideAndSlideIn 3s ease forwards;
+  animation: slideOutAndInPosition1 2s ease forwards;
+}
+
+@keyframes slideOutAndInPosition0 {
+  0% {
+    width: 100%;
+    z-index: 55;
+    transform: translate(0, 0);
+  }
+  50% {
+    width: 97%;
+    z-index: 50;
+    transform: translate(0, 1000px);
+  }
+  60% {
+    width: 95%;
+    z-index: 30;
+    transform: translate(3.2%, 900px);
+  }
+  100% {
+    z-index: 55;
+    width: 100%;
+    transform: translate(0, 0);
+  }
 }
 
-.slideOutAndIn {
+.slideOutAndIn0 {
   pointer-events: none;
-  animation: slideOutAndIn 3s ease forwards;
+  animation: slideOutAndInPosition0 2s ease forwards;
 }
 
 .hiddenSlide {