@coorpacademy/components 11.13.4 → 11.13.6

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

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

package/es/template/back-office/brand-update/index.d.ts

@@ -777,6 +777,24 @@ declare namespace BrandUpdate {
                 className: PropTypes.Requireable<string>;
                 customStyle: PropTypes.Requireable<PropTypes.InferProps<{}>>;
             }>>;
+            selectMultiple: PropTypes.Requireable<PropTypes.InferProps<{
+                title: PropTypes.Requireable<string>;
+                placeholder: PropTypes.Requireable<string>;
+                description: PropTypes.Requireable<string>;
+                hint: PropTypes.Requireable<string>;
+                options: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
+                    selected: PropTypes.Validator<boolean>;
+                    name: PropTypes.Validator<string>;
+                    value: PropTypes.Requireable<string>;
+                }>>[]>;
+                onChange: PropTypes.Requireable<(...args: any[]) => any>;
+                onError: PropTypes.Requireable<(...args: any[]) => any>;
+                multiple: PropTypes.Requireable<boolean>;
+                modified: PropTypes.Requireable<boolean>;
+                disabled: PropTypes.Requireable<boolean>;
+                error: PropTypes.Requireable<string>;
+                theme: PropTypes.Requireable<string>;
+            }>>;
             items: PropTypes.Requireable<(PropTypes.InferProps<{
                 bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
                     buttonAriaLabel: PropTypes.Requireable<string>;

package/lib/atom/button-link/index.js

@@ -71,7 +71,7 @@ const ButtonLink = props => {
     useTitle = true
   } = props;
   const contentView = getButtonContent(icon, label);
-  const styleButton = (0, _classnames.default)(_style.default[`${className}`], _style.default.button, type === 'primary' && _style.default.primary, type === 'secondary' && _style.default.secondary, type === 'tertiary' && _style.default.tertiary, type === 'text' && _style.default.text, type === 'dangerous' && _style.default.dangerous, link && _style.default.link, disabled && _style.default.disabled);
+  const styleButton = (0, _classnames.default)(className, _style.default.button, type === 'primary' && _style.default.primary, type === 'secondary' && _style.default.secondary, type === 'tertiary' && _style.default.tertiary, type === 'text' && _style.default.text, type === 'dangerous' && _style.default.dangerous, link && _style.default.link, disabled && _style.default.disabled);
   const handleOnClick = (0, _react.useCallback)(() => onClick(), [onClick]);
   const handleOnKeyDown = (0, _react.useCallback)(event => onKeyDown(event), [onKeyDown]);
 

package/lib/atom/button-link/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["getButtonContent","icon","label","type","position","Icon","ICONS","style","buttonContent","ButtonLink","props","disabled","dataName","dataTestId","ariaLabel","link","onClick","onKeyDown","className","customStyle","useTitle","contentView","styleButton","classnames","button","primary","secondary","tertiary","text","dangerous","handleOnClick","useCallback","handleOnKeyDown","event","title","propTypes"],"sources":["../../../src/atom/button-link/index.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\nimport {noop} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Link from '../link';\nimport {ICONS} from '../../util/button-icons';\nimport propTypes, {ButtonLinkProps, IconType} from './types';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from './style.css';\n\nconst getButtonContent = (icon?: IconType, label?: string) => {\n  const {type, position} = icon || {type: '', position: ''};\n  const Icon = type && ICONS[type];\n\n  if (!Icon) {\n    return (\n      <div className={style.buttonContent}>\n        <span className={style.label}>{label}</span>\n      </div>\n    );\n  }\n\n  return (\n    <div className={style.buttonContent}>\n      {position === 'left' ? <Icon className={style.icon} /> : null}\n      <span className={style.label}>{label}</span>\n      {position === 'right' ? <Icon className={style.icon} /> : null}\n    </div>\n  );\n};\n\nconst ButtonLink = (props: ButtonLinkProps) => {\n  const {\n    type,\n    label,\n    disabled,\n    icon,\n    'data-name': dataName,\n    'data-testid': dataTestId = 'button-link',\n    'aria-label': ariaLabel,\n    link,\n    onClick = noop,\n    onKeyDown = noop,\n    className,\n    customStyle,\n    useTitle = true\n  } = props;\n  const contentView = getButtonContent(icon, label);\n  const styleButton = classnames(\n    style[`${className}`],\n    style.button,\n    type === 'primary' && style.primary,\n    type === 'secondary' && style.secondary,\n    type === 'tertiary' && style.tertiary,\n    type === 'text' && style.text,\n    type === 'dangerous' && style.dangerous,\n    link && style.link,\n    disabled && style.disabled\n  );\n\n  const handleOnClick = useCallback(() => onClick(), [onClick]);\n\n  const handleOnKeyDown = useCallback(event => onKeyDown(event), [onKeyDown]);\n\n  if (link) {\n    return (\n      <Link\n        {...link}\n        {...(useTitle && {\n          title: ariaLabel || label\n        })}\n        style={customStyle}\n        className={styleButton}\n        data-name={dataName}\n        data-testid={dataTestId}\n        aria-label={ariaLabel || label}\n      >\n        {contentView}\n      </Link>\n    );\n  }\n\n  return (\n    <button\n      {...(useTitle && {\n        title: ariaLabel || label\n      })}\n      type=\"button\"\n      aria-label={ariaLabel || label}\n      data-name={dataName}\n      data-testid={dataTestId}\n      style={customStyle}\n      className={styleButton}\n      onClick={handleOnClick}\n      onKeyDown={handleOnKeyDown}\n      tabIndex={0}\n    >\n      {contentView}\n    </button>\n  );\n};\n\nButtonLink.propTypes = propTypes;\n\nexport default ButtonLink;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["getButtonContent","icon","label","type","position","Icon","ICONS","style","buttonContent","ButtonLink","props","disabled","dataName","dataTestId","ariaLabel","link","onClick","onKeyDown","className","customStyle","useTitle","contentView","styleButton","classnames","button","primary","secondary","tertiary","text","dangerous","handleOnClick","useCallback","handleOnKeyDown","event","title","propTypes"],"sources":["../../../src/atom/button-link/index.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\nimport {noop} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Link from '../link';\nimport {ICONS} from '../../util/button-icons';\nimport propTypes, {ButtonLinkProps, IconType} from './types';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from './style.css';\n\nconst getButtonContent = (icon?: IconType, label?: string) => {\n  const {type, position} = icon || {type: '', position: ''};\n  const Icon = type && ICONS[type];\n\n  if (!Icon) {\n    return (\n      <div className={style.buttonContent}>\n        <span className={style.label}>{label}</span>\n      </div>\n    );\n  }\n\n  return (\n    <div className={style.buttonContent}>\n      {position === 'left' ? <Icon className={style.icon} /> : null}\n      <span className={style.label}>{label}</span>\n      {position === 'right' ? <Icon className={style.icon} /> : null}\n    </div>\n  );\n};\n\nconst ButtonLink = (props: ButtonLinkProps) => {\n  const {\n    type,\n    label,\n    disabled,\n    icon,\n    'data-name': dataName,\n    'data-testid': dataTestId = 'button-link',\n    'aria-label': ariaLabel,\n    link,\n    onClick = noop,\n    onKeyDown = noop,\n    className,\n    customStyle,\n    useTitle = true\n  } = props;\n  const contentView = getButtonContent(icon, label);\n  const styleButton = classnames(\n    className,\n    style.button,\n    type === 'primary' && style.primary,\n    type === 'secondary' && style.secondary,\n    type === 'tertiary' && style.tertiary,\n    type === 'text' && style.text,\n    type === 'dangerous' && style.dangerous,\n    link && style.link,\n    disabled && style.disabled\n  );\n\n  const handleOnClick = useCallback(() => onClick(), [onClick]);\n\n  const handleOnKeyDown = useCallback(event => onKeyDown(event), [onKeyDown]);\n\n  if (link) {\n    return (\n      <Link\n        {...link}\n        {...(useTitle && {\n          title: ariaLabel || label\n        })}\n        style={customStyle}\n        className={styleButton}\n        data-name={dataName}\n        data-testid={dataTestId}\n        aria-label={ariaLabel || label}\n      >\n        {contentView}\n      </Link>\n    );\n  }\n\n  return (\n    <button\n      {...(useTitle && {\n        title: ariaLabel || label\n      })}\n      type=\"button\"\n      aria-label={ariaLabel || label}\n      data-name={dataName}\n      data-testid={dataTestId}\n      style={customStyle}\n      className={styleButton}\n      onClick={handleOnClick}\n      onKeyDown={handleOnKeyDown}\n      tabIndex={0}\n    >\n      {contentView}\n    </button>\n  );\n};\n\nButtonLink.propTypes = propTypes;\n\nexport default ButtonLink;\n"],"mappings":"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"}

package/lib/atom/button-link/style.css

@@ -94,12 +94,3 @@
   border-radius: 0px;
   height: auto;
 }
-
-/* bulk inspect button style */
-.bulkInspectButton {
-  font-family: 'Gilroy';
-  font-style: normal;
-  font-weight: 600;
-  font-size: 14px;
-  color: cm_primary_blue;
-}

package/lib/atom/button-link/types.d.ts

@@ -40,7 +40,7 @@ export declare type ButtonLinkProps = {
     };
     disabled?: boolean;
     className?: string;
-    customStyle?: Record<string, never>;
+    customStyle?: Record<string, unknown>;
     useTitle?: boolean;
 };
 export declare type Fixture = {

package/lib/atom/button-link/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAE9C,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;CAmBd,CAAC;AAEF,oBAAY,QAAQ,GAAG;IACrB,QAAQ,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,IAAI,EAAE,MAAM,OAAO,KAAK,CAAC;CAC1B,CAAC;AACF,oBAAY,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,WAAW,CAAC;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE;QACL,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;KAClD,CAAC;IACF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,oBAAY,OAAO,GAAG;IAAC,KAAK,EAAE,eAAe,CAAA;CAAC,CAAC;AAE/C,eAAe,SAAS,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAE9C,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;CAmBd,CAAC;AAEF,oBAAY,QAAQ,GAAG;IACrB,QAAQ,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,IAAI,EAAE,MAAM,OAAO,KAAK,CAAC;CAC1B,CAAC;AACF,oBAAY,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,WAAW,CAAC;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE;QACL,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;KAClD,CAAC;IACF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,oBAAY,OAAO,GAAG;IAAC,KAAK,EAAE,eAAe,CAAA;CAAC,CAAC;AAE/C,eAAe,SAAS,CAAC"}

package/lib/atom/button-link/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":["propTypes","type","PropTypes","oneOf","label","string","icon","shape","position","ICONS","onClick","func","link","href","download","bool","target","disabled","className","customStyle"],"sources":["../../../src/atom/button-link/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {keys} from 'lodash/fp';\nimport {ICONS} from '../../util/button-icons';\n\nconst propTypes = {\n  type: PropTypes.oneOf(['primary', 'secondary', 'tertiary', 'text', 'dangerous']),\n  label: PropTypes.string,\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string,\n  'data-testid': PropTypes.string,\n  icon: PropTypes.shape({\n    position: PropTypes.oneOf(['right', 'left']),\n    type: PropTypes.oneOf(keys(ICONS))\n  }),\n  onClick: PropTypes.func,\n  link: PropTypes.shape({\n    href: PropTypes.string,\n    download: PropTypes.bool,\n    target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top'])\n  }),\n  disabled: PropTypes.bool,\n  className: PropTypes.string,\n  customStyle: PropTypes.shape({})\n};\n\nexport type IconType = {\n  position: 'right' | 'left';\n  type: keyof typeof ICONS;\n};\nexport type ButtonLinkProps = {\n  type?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'dangerous';\n  label?: string;\n  'aria-label'?: string;\n  'data-name'?: string;\n  'data-testid'?: string;\n  icon?: IconType;\n  onClick?: () => void;\n  onKeyDown?: () => void;\n  link?: {\n    href?: string;\n    download?: boolean;\n    target?: '_self' | '_blank' | '_parent' | '_top';\n  };\n  disabled?: boolean;\n  className?: string;\n  customStyle?: Record<string, never>;\n  useTitle?: boolean;\n};\n\nexport type Fixture = {props: ButtonLinkProps};\n\nexport default propTypes;\n"],"mappings":";;;;;;;AAAA;;AAEA;;;;AAEA,MAAMA,SAAS,GAAG;EAChBC,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,CAAC,SAAD,EAAY,WAAZ,EAAyB,UAAzB,EAAqC,MAArC,EAA6C,WAA7C,CAAhB,CADU;EAEhBC,KAAK,EAAEF,kBAAA,CAAUG,MAFD;EAGhB,cAAcH,kBAAA,CAAUG,MAHR;EAIhB,aAAaH,kBAAA,CAAUG,MAJP;EAKhB,eAAeH,kBAAA,CAAUG,MALT;EAMhBC,IAAI,EAAEJ,kBAAA,CAAUK,KAAV,CAAgB;IACpBC,QAAQ,EAAEN,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,MAAV,CAAhB,CADU;IAEpBF,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,oBAAKM,kBAAL,CAAhB;EAFc,CAAhB,CANU;EAUhBC,OAAO,EAAER,kBAAA,CAAUS,IAVH;EAWhBC,IAAI,EAAEV,kBAAA,CAAUK,KAAV,CAAgB;IACpBM,IAAI,EAAEX,kBAAA,CAAUG,MADI;IAEpBS,QAAQ,EAAEZ,kBAAA,CAAUa,IAFA;IAGpBC,MAAM,EAAEd,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,QAAV,EAAoB,SAApB,EAA+B,MAA/B,CAAhB;EAHY,CAAhB,CAXU;EAgBhBc,QAAQ,EAAEf,kBAAA,CAAUa,IAhBJ;EAiBhBG,SAAS,EAAEhB,kBAAA,CAAUG,MAjBL;EAkBhBc,WAAW,EAAEjB,kBAAA,CAAUK,KAAV,CAAgB,EAAhB;AAlBG,CAAlB;eA+CeP,S"}
+{"version":3,"file":"types.js","names":["propTypes","type","PropTypes","oneOf","label","string","icon","shape","position","ICONS","onClick","func","link","href","download","bool","target","disabled","className","customStyle"],"sources":["../../../src/atom/button-link/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {keys} from 'lodash/fp';\nimport {ICONS} from '../../util/button-icons';\n\nconst propTypes = {\n  type: PropTypes.oneOf(['primary', 'secondary', 'tertiary', 'text', 'dangerous']),\n  label: PropTypes.string,\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string,\n  'data-testid': PropTypes.string,\n  icon: PropTypes.shape({\n    position: PropTypes.oneOf(['right', 'left']),\n    type: PropTypes.oneOf(keys(ICONS))\n  }),\n  onClick: PropTypes.func,\n  link: PropTypes.shape({\n    href: PropTypes.string,\n    download: PropTypes.bool,\n    target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top'])\n  }),\n  disabled: PropTypes.bool,\n  className: PropTypes.string,\n  customStyle: PropTypes.shape({})\n};\n\nexport type IconType = {\n  position: 'right' | 'left';\n  type: keyof typeof ICONS;\n};\nexport type ButtonLinkProps = {\n  type?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'dangerous';\n  label?: string;\n  'aria-label'?: string;\n  'data-name'?: string;\n  'data-testid'?: string;\n  icon?: IconType;\n  onClick?: () => void;\n  onKeyDown?: () => void;\n  link?: {\n    href?: string;\n    download?: boolean;\n    target?: '_self' | '_blank' | '_parent' | '_top';\n  };\n  disabled?: boolean;\n  className?: string;\n  customStyle?: Record<string, unknown>;\n  useTitle?: boolean;\n};\n\nexport type Fixture = {props: ButtonLinkProps};\n\nexport default propTypes;\n"],"mappings":";;;;;;;AAAA;;AAEA;;;;AAEA,MAAMA,SAAS,GAAG;EAChBC,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,CAAC,SAAD,EAAY,WAAZ,EAAyB,UAAzB,EAAqC,MAArC,EAA6C,WAA7C,CAAhB,CADU;EAEhBC,KAAK,EAAEF,kBAAA,CAAUG,MAFD;EAGhB,cAAcH,kBAAA,CAAUG,MAHR;EAIhB,aAAaH,kBAAA,CAAUG,MAJP;EAKhB,eAAeH,kBAAA,CAAUG,MALT;EAMhBC,IAAI,EAAEJ,kBAAA,CAAUK,KAAV,CAAgB;IACpBC,QAAQ,EAAEN,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,MAAV,CAAhB,CADU;IAEpBF,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,oBAAKM,kBAAL,CAAhB;EAFc,CAAhB,CANU;EAUhBC,OAAO,EAAER,kBAAA,CAAUS,IAVH;EAWhBC,IAAI,EAAEV,kBAAA,CAAUK,KAAV,CAAgB;IACpBM,IAAI,EAAEX,kBAAA,CAAUG,MADI;IAEpBS,QAAQ,EAAEZ,kBAAA,CAAUa,IAFA;IAGpBC,MAAM,EAAEd,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,QAAV,EAAoB,SAApB,EAA+B,MAA/B,CAAhB;EAHY,CAAhB,CAXU;EAgBhBc,QAAQ,EAAEf,kBAAA,CAAUa,IAhBJ;EAiBhBG,SAAS,EAAEhB,kBAAA,CAAUG,MAjBL;EAkBhBc,WAAW,EAAEjB,kBAAA,CAAUK,KAAV,CAAgB,EAAhB;AAlBG,CAAlB;eA+CeP,S"}

package/lib/atom/choice/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/choice/index.native.tsx"],"names":[],"mappings":";AACA,OAAO,EAAmB,SAAS,EAAY,MAAM,cAAc,CAAC;AAIpE,OAAO,KAAK,EAAC,KAAK,EAAE,YAAY,EAAC,MAAM,gCAAgC,CAAC;AAMxE,oBAAY,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,YAAY,EAAE,YAAY,CAAC;CAC5B,CAAC;AAqEF,QAAA,MAAM,MAAM,8GAUT,KAAK,uBAqFP,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/atom/choice/index.native.tsx"],"names":[],"mappings":";AACA,OAAO,EAAmB,SAAS,EAAY,MAAM,cAAc,CAAC;AAIpE,OAAO,KAAK,EAAC,KAAK,EAAE,YAAY,EAAC,MAAM,gCAAgC,CAAC;AAMxE,oBAAY,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,YAAY,EAAE,YAAY,CAAC;CAC5B,CAAC;AAqEF,QAAA,MAAM,MAAM,8GAUT,KAAK,uBAuFP,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/lib/atom/choice/index.native.js

@@ -160,7 +160,8 @@ const Choice = ({
   })) : null, children ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: textWrapperStyle
   }, /*#__PURE__*/_react.default.createElement(_index.default, {
-    style: textStyle
+    style: textStyle,
+    isTextCentered: true
   }, children)) : null));
 };
 

package/lib/atom/choice/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","squeezed","StyleSheet","create","boxShadow","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","backgroundColor","container","colors","white","borderRadius","radius","regular","flexDirection","alignItems","minHeight","textContainer","paddingHorizontal","paddingVertical","justifyContent","flex","squeezedTextContainer","padding","spacing","small","paddingLeft","undefined","paddingRight","text","fontSize","medium","fontWeight","bold","color","black","textAlign","textSelected","unselectedImageContainer","borderRightColor","border","imageContainer","overflow","borderTopLeftRadius","borderBottomLeftRadius","image","Choice","children","isSelected","isDisabled","onPress","media","testID","prefixTestID","style","questionType","templateContext","useTemplateContext","brandTheme","styleSheet","setStylesheet","useState","useEffect","_stylesheet","selectedSuffix","mediaType","type","toLowerCase","url","src","length","getCleanUri","source","uri","mediaSuffix","textStyle","textWrapperStyle","push","selectionStyle","primary","borderColor","borderTopRightRadius","borderBottomRightRadius"],"sources":["../../../src/atom/choice/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {View, StyleSheet, ViewStyle, TextStyle} from 'react-native';\n\nimport Html from '../html/index.native';\nimport ImageBackground from '../image-background/index.native';\nimport type {Media, QuestionType} from '../../molecule/questions/types';\nimport getCleanUri from '../../util/get-clean-uri';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\n\nexport type Props = {\n  isSelected?: boolean;\n  onPress: () => void;\n  children?: string;\n  isDisabled?: boolean;\n  testID?: string;\n  media?: Media;\n  squeezed?: boolean;\n  style?: ViewStyle;\n  questionType: QuestionType;\n};\n\ntype StyleSheetType = {\n  boxShadow: ViewStyle;\n  container: ViewStyle;\n  text: TextStyle;\n  textSelected: TextStyle;\n  textContainer: ViewStyle;\n  squeezedTextContainer: ViewStyle;\n  unselectedImageContainer: ViewStyle;\n  imageContainer: ViewStyle;\n  image: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme, squeezed: boolean): StyleSheetType =>\n  StyleSheet.create({\n    boxShadow: {\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: 4},\n      shadowOpacity: 0.12,\n      shadowRadius: 8,\n      elevation: 8,\n      backgroundColor: '#0000'\n    },\n    container: {\n      backgroundColor: theme.colors.white,\n      borderRadius: theme.radius.regular,\n      flexDirection: 'row',\n      alignItems: 'stretch',\n      minHeight: 60\n    },\n    textContainer: {\n      paddingHorizontal: 24,\n      paddingVertical: 12,\n      justifyContent: 'center',\n      alignItems: 'center',\n      flex: 1\n    },\n    squeezedTextContainer: {\n      padding: theme.spacing.small,\n      paddingLeft: undefined,\n      paddingVertical: undefined,\n      paddingRight: undefined,\n      flex: 0\n    },\n    text: {\n      fontSize: squeezed ? theme.fontSize.medium : theme.fontSize.regular,\n      fontWeight: theme.fontWeight.bold,\n      color: theme.colors.black,\n      textAlign: 'center'\n    },\n    textSelected: {\n      color: theme.colors.white\n    },\n    unselectedImageContainer: {\n      borderRightColor: theme.colors.border\n    },\n    imageContainer: {\n      height: '100%',\n      width: '25%',\n      overflow: 'hidden',\n      borderTopLeftRadius: theme.radius.regular,\n      borderBottomLeftRadius: theme.radius.regular\n    },\n    image: {\n      flex: 1\n    }\n  });\n\nconst Choice = ({\n  children,\n  isSelected = false,\n  squeezed = false,\n  isDisabled,\n  onPress,\n  media,\n  testID: prefixTestID,\n  style,\n  questionType\n}: Props) => {\n  const templateContext = useTemplateContext();\n  const {theme, brandTheme} = templateContext;\n\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme, squeezed);\n    setStylesheet(_stylesheet);\n  }, [theme, squeezed]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  const selectedSuffix = prefixTestID && isSelected ? '-selected' : '';\n  const mediaType = media && media.type && media.type === 'img' && media.type.toLowerCase();\n  const url =\n    media &&\n    media.type === 'img' &&\n    media.src &&\n    media.src.length > 0 &&\n    getCleanUri(media.src[0].url);\n\n  const source = {uri: url ? getCleanUri(url) : undefined};\n  const mediaSuffix = prefixTestID && mediaType ? `-${mediaType}` : '';\n\n  const textStyle: TextStyle[] = [styleSheet.text];\n  const textWrapperStyle: ViewStyle[] = [styleSheet.textContainer];\n\n  if (squeezed) {\n    textWrapperStyle.push(styleSheet.squeezedTextContainer);\n  }\n\n  if (isSelected) {\n    textStyle.push(styleSheet.textSelected);\n\n    // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n    const selectionStyle = brandTheme && {\n      backgroundColor: brandTheme.colors?.primary,\n      borderColor: brandTheme.colors?.primary,\n      ...(url\n        ? {\n            borderTopRightRadius: theme.radius.regular,\n            borderBottomRightRadius: theme.radius.regular\n          }\n        : {\n            borderRadius: theme.radius.regular\n          })\n    };\n\n    if (selectionStyle) {\n      textWrapperStyle.push(selectionStyle);\n    }\n  }\n\n  return (\n    <Touchable\n      onPress={!isDisabled ? onPress : undefined}\n      style={style}\n      analyticsID=\"question-choice\"\n      analyticsParams={{questionType}}\n    >\n      <View\n        style={[styleSheet.boxShadow, styleSheet.container]}\n        testID={prefixTestID && `${prefixTestID}${selectedSuffix}`}\n      >\n        {url ? (\n          <View style={styleSheet.imageContainer}>\n            <ImageBackground\n              testID={prefixTestID && `${prefixTestID}${mediaSuffix}`}\n              source={source}\n              style={styleSheet.image}\n            />\n          </View>\n        ) : null}\n\n        {children ? (\n          <View style={textWrapperStyle}>\n            <Html style={textStyle}>{children}</Html>\n          </View>\n        ) : null}\n      </View>\n    </Touchable>\n  );\n};\n\nexport default Choice;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","squeezed","StyleSheet","create","boxShadow","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","backgroundColor","container","colors","white","borderRadius","radius","regular","flexDirection","alignItems","minHeight","textContainer","paddingHorizontal","paddingVertical","justifyContent","flex","squeezedTextContainer","padding","spacing","small","paddingLeft","undefined","paddingRight","text","fontSize","medium","fontWeight","bold","color","black","textAlign","textSelected","unselectedImageContainer","borderRightColor","border","imageContainer","overflow","borderTopLeftRadius","borderBottomLeftRadius","image","Choice","children","isSelected","isDisabled","onPress","media","testID","prefixTestID","style","questionType","templateContext","useTemplateContext","brandTheme","styleSheet","setStylesheet","useState","useEffect","_stylesheet","selectedSuffix","mediaType","type","toLowerCase","url","src","length","getCleanUri","source","uri","mediaSuffix","textStyle","textWrapperStyle","push","selectionStyle","primary","borderColor","borderTopRightRadius","borderBottomRightRadius"],"sources":["../../../src/atom/choice/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {View, StyleSheet, ViewStyle, TextStyle} from 'react-native';\n\nimport Html from '../html/index.native';\nimport ImageBackground from '../image-background/index.native';\nimport type {Media, QuestionType} from '../../molecule/questions/types';\nimport getCleanUri from '../../util/get-clean-uri';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\n\nexport type Props = {\n  isSelected?: boolean;\n  onPress: () => void;\n  children?: string;\n  isDisabled?: boolean;\n  testID?: string;\n  media?: Media;\n  squeezed?: boolean;\n  style?: ViewStyle;\n  questionType: QuestionType;\n};\n\ntype StyleSheetType = {\n  boxShadow: ViewStyle;\n  container: ViewStyle;\n  text: TextStyle;\n  textSelected: TextStyle;\n  textContainer: ViewStyle;\n  squeezedTextContainer: ViewStyle;\n  unselectedImageContainer: ViewStyle;\n  imageContainer: ViewStyle;\n  image: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme, squeezed: boolean): StyleSheetType =>\n  StyleSheet.create({\n    boxShadow: {\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: 4},\n      shadowOpacity: 0.12,\n      shadowRadius: 8,\n      elevation: 8,\n      backgroundColor: '#0000'\n    },\n    container: {\n      backgroundColor: theme.colors.white,\n      borderRadius: theme.radius.regular,\n      flexDirection: 'row',\n      alignItems: 'stretch',\n      minHeight: 60\n    },\n    textContainer: {\n      paddingHorizontal: 24,\n      paddingVertical: 12,\n      justifyContent: 'center',\n      alignItems: 'center',\n      flex: 1\n    },\n    squeezedTextContainer: {\n      padding: theme.spacing.small,\n      paddingLeft: undefined,\n      paddingVertical: undefined,\n      paddingRight: undefined,\n      flex: 0\n    },\n    text: {\n      fontSize: squeezed ? theme.fontSize.medium : theme.fontSize.regular,\n      fontWeight: theme.fontWeight.bold,\n      color: theme.colors.black,\n      textAlign: 'center'\n    },\n    textSelected: {\n      color: theme.colors.white\n    },\n    unselectedImageContainer: {\n      borderRightColor: theme.colors.border\n    },\n    imageContainer: {\n      height: '100%',\n      width: '25%',\n      overflow: 'hidden',\n      borderTopLeftRadius: theme.radius.regular,\n      borderBottomLeftRadius: theme.radius.regular\n    },\n    image: {\n      flex: 1\n    }\n  });\n\nconst Choice = ({\n  children,\n  isSelected = false,\n  squeezed = false,\n  isDisabled,\n  onPress,\n  media,\n  testID: prefixTestID,\n  style,\n  questionType\n}: Props) => {\n  const templateContext = useTemplateContext();\n  const {theme, brandTheme} = templateContext;\n\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme, squeezed);\n    setStylesheet(_stylesheet);\n  }, [theme, squeezed]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  const selectedSuffix = prefixTestID && isSelected ? '-selected' : '';\n  const mediaType = media && media.type && media.type === 'img' && media.type.toLowerCase();\n  const url =\n    media &&\n    media.type === 'img' &&\n    media.src &&\n    media.src.length > 0 &&\n    getCleanUri(media.src[0].url);\n\n  const source = {uri: url ? getCleanUri(url) : undefined};\n  const mediaSuffix = prefixTestID && mediaType ? `-${mediaType}` : '';\n\n  const textStyle: TextStyle[] = [styleSheet.text];\n  const textWrapperStyle: ViewStyle[] = [styleSheet.textContainer];\n\n  if (squeezed) {\n    textWrapperStyle.push(styleSheet.squeezedTextContainer);\n  }\n\n  if (isSelected) {\n    textStyle.push(styleSheet.textSelected);\n\n    // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n    const selectionStyle = brandTheme && {\n      backgroundColor: brandTheme.colors?.primary,\n      borderColor: brandTheme.colors?.primary,\n      ...(url\n        ? {\n            borderTopRightRadius: theme.radius.regular,\n            borderBottomRightRadius: theme.radius.regular\n          }\n        : {\n            borderRadius: theme.radius.regular\n          })\n    };\n\n    if (selectionStyle) {\n      textWrapperStyle.push(selectionStyle);\n    }\n  }\n\n  return (\n    <Touchable\n      onPress={!isDisabled ? onPress : undefined}\n      style={style}\n      analyticsID=\"question-choice\"\n      analyticsParams={{questionType}}\n    >\n      <View\n        style={[styleSheet.boxShadow, styleSheet.container]}\n        testID={prefixTestID && `${prefixTestID}${selectedSuffix}`}\n      >\n        {url ? (\n          <View style={styleSheet.imageContainer}>\n            <ImageBackground\n              testID={prefixTestID && `${prefixTestID}${mediaSuffix}`}\n              source={source}\n              style={styleSheet.image}\n            />\n          </View>\n        ) : null}\n\n        {children ? (\n          <View style={textWrapperStyle}>\n            <Html style={textStyle} isTextCentered>\n              {children}\n            </Html>\n          </View>\n        ) : null}\n      </View>\n    </Touchable>\n  );\n};\n\nexport default Choice;\n"],"mappings":"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"}

package/lib/molecule/questions/qcm-graphic/style.css

@@ -165,6 +165,7 @@
 .innerHTML {
   composes: innerHTML from '../../../atom/label/style.css'
 }
+
 .hiddenCheckbox {
-  opacity: 0;
+  display: none;
 }

package/lib/molecule/review-correction-popin/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-correction-popin/index.native.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAgC,0BAA0B,EAAC,MAAM,cAAc,CAAC;AAmQvF,QAAA,MAAM,qBAAqB,kDAMxB,0BAA0B,uBAiD5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-correction-popin/index.native.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAgC,0BAA0B,EAAC,MAAM,cAAc,CAAC;AAoQvF,QAAA,MAAM,qBAAqB,kDAMxB,0BAA0B,uBAiD5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/lib/molecule/review-correction-popin/index.native.js

@@ -212,11 +212,12 @@ const KlfButton = ({
     property: 'opacity',
     fromValue: 0,
     toValue: 1,
+    duration: 250,
     easing: _reactNative.Easing.bezier(0.25, 1, 0.5, 1)
   });
   const handlePressKey = (0, _react.useCallback)(() => {
     setDisplayTooltip(!displayTooltip);
-    !displayTooltip ? fadeIn.start() : fadeIn.revert();
+    !displayTooltip ? fadeIn.start() : fadeIn.reset();
   }, [displayTooltip, fadeIn]);
   const {
     buttonKlf,

package/lib/molecule/review-correction-popin/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","type","StyleSheet","create","wrapper","backgroundColor","height","display","justifyContent","popin","padding","spacing","medium","borderRadius","flexDirection","alignItems","colors","negative","positive","shadowColor","shadowOpacity","shadowOffset","width","shadowRadius","elevation","correctionSection","iconCircle","white","opacity","icon","resultLabel","color","fontSize","fontWeight","lineHeight","marginLeft","textTransform","feedbackSection","marginVertical","labelContainer","alignSelf","paddingHorizontal","tiny","paddingVertical","micro","marginBottom","label","extraBold","htmlInfoMessage","button","base","small","buttonText","cta","bold","textAlign","containerButtonKlf","buttonKlf","buttonKlfActive","buttonKlfText","iconKey","marginRight","containerTooltip","zIndex","position","black","buttonTooltip","bottom","right","htmlTooltipText","text","primary","triangleTooltip","borderStyle","borderLeftWidth","borderRightWidth","borderBottomWidth","borderTopWidth","borderLeftColor","borderTopColor","borderRightColor","borderBottomColor","transform","rotate","left","top","KlfButton","klf","styleSheet","displayTooltip","setDisplayTooltip","useState","fadeIn","useAnimateProp","property","fromValue","toValue","easing","Easing","bezier","handlePressKey","useCallback","start","revert","tooltip","animatedStyle","ICONS","RightIcon","wrong","WrongIcon","ReviewCorrectionPopin","information","next","templateContext","useTemplateContext","setStylesheet","handlePressNext","onClick","Icon","useEffect","_stylesheet","message"],"sources":["../../../src/molecule/review-correction-popin/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useState} from 'react';\nimport {Animated, Easing, TextStyle, StyleSheet, View, ViewStyle} from 'react-native';\nimport {\n  NovaCompositionCoorpacademyCheck as RightIcon,\n  NovaSolidStatusClose as WrongIcon,\n  NovaLineLoginKey1 as KlfIcon\n} from '@coorpacademy/nova-icons';\nimport {useAnimateProp} from '@coorpacademy/react-native-animation';\nimport Html from '../../atom/html/index.native';\nimport {Theme} from '../../variables/theme.native';\nimport Text from '../../atom/text/index.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {ReviewCorrectionPopinKLFProps, ReviewCorrectionPopinProps} from './prop-types';\n\ninterface StyleSheetType {\n  wrapper: ViewStyle;\n  popin: ViewStyle;\n  correctionSection: ViewStyle;\n  iconCircle: ViewStyle;\n  icon: ViewStyle;\n  resultLabel: TextStyle;\n  feedbackSection: ViewStyle;\n  labelContainer: ViewStyle;\n  label: TextStyle;\n  htmlInfoMessage: TextStyle;\n  button: ViewStyle;\n  buttonText: TextStyle;\n  buttonKlf: ViewStyle;\n  buttonKlfActive: TextStyle;\n  buttonKlfText: TextStyle;\n  iconKey: ViewStyle;\n  containerTooltip: ViewStyle;\n  buttonTooltip: ViewStyle;\n  containerButtonKlf: ViewStyle;\n  triangleTooltip: ViewStyle;\n  htmlTooltipText: TextStyle;\n}\n\nconst createStyleSheet = (theme: Theme, type: string): StyleSheetType =>\n  StyleSheet.create({\n    wrapper: {\n      backgroundColor: '#00000000',\n      height: 2000,\n      display: 'flex',\n      justifyContent: 'flex-end'\n    },\n    popin: {\n      padding: theme.spacing.medium,\n      borderRadius: 16,\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'flex-start',\n      backgroundColor: type === 'wrong' ? theme.colors.negative : theme.colors.positive,\n      shadowColor: type === 'wrong' ? theme.colors.negative : theme.colors.positive,\n      shadowOpacity: 0.5,\n      shadowOffset: {width: 0, height: 0},\n      shadowRadius: 15,\n      elevation: 4\n    },\n    correctionSection: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      width: '80%'\n    },\n    iconCircle: {\n      width: 60,\n      height: 60,\n      alignItems: 'center',\n      justifyContent: 'center',\n      backgroundColor: theme.colors.white,\n      opacity: 0.7,\n      borderRadius: 50\n    },\n    icon: {\n      height: 30,\n      width: 30\n    },\n    resultLabel: {\n      color: theme.colors.white,\n      fontSize: 24,\n      fontWeight: '600',\n      lineHeight: 24,\n      marginLeft: 12,\n      textTransform: 'uppercase'\n    },\n    feedbackSection: {\n      marginVertical: theme.spacing.medium\n    },\n    labelContainer: {\n      alignSelf: 'flex-start',\n      backgroundColor: 'rgba(255, 255, 255, 0.3)',\n      borderRadius: 56,\n      paddingHorizontal: theme.spacing.tiny,\n      paddingVertical: theme.spacing.micro,\n      marginBottom: 8\n    },\n    label: {\n      color: theme.colors.white,\n      fontSize: 14,\n      fontWeight: theme.fontWeight.extraBold,\n      lineHeight: 17\n    },\n    htmlInfoMessage: {\n      color: theme.colors.white,\n      fontSize: 16,\n      fontWeight: '600',\n      lineHeight: 19\n    },\n    button: {\n      alignSelf: 'stretch',\n      backgroundColor: theme.colors.white,\n      borderRadius: 7,\n      paddingHorizontal: theme.spacing.base,\n      paddingVertical: theme.spacing.small\n    },\n    buttonText: {\n      color: theme.colors.cta,\n      fontSize: 14,\n      fontWeight: theme.fontWeight.bold,\n      lineHeight: 20,\n      textAlign: 'center'\n    },\n    containerButtonKlf: {\n      width: '100%'\n    },\n    buttonKlf: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'center',\n      backgroundColor: 'rgba(255, 255, 255, 0.1)',\n      borderRadius: 7,\n      paddingHorizontal: theme.spacing.base,\n      paddingVertical: theme.spacing.small,\n      marginBottom: theme.spacing.tiny\n    },\n    buttonKlfActive: {\n      backgroundColor:\n        'linear-gradient(0deg, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)), rgba(255, 255, 255, 0.1)'\n    },\n    buttonKlfText: {\n      color: 'white',\n      fontSize: 14,\n      fontWeight: theme.fontWeight.bold,\n      lineHeight: 20,\n      textAlign: 'center'\n    },\n    iconKey: {\n      width: 12,\n      height: 12,\n      marginRight: theme.spacing.tiny\n    },\n    containerTooltip: {\n      zIndex: 30,\n      position: 'relative',\n      shadowColor: theme.colors.black,\n      shadowOpacity: 0.3,\n      shadowOffset: {width: 0, height: 0},\n      shadowRadius: 8\n    },\n    buttonTooltip: {\n      zIndex: 20,\n      flexDirection: 'column',\n      justifyContent: 'center',\n      backgroundColor: theme.colors.white,\n      borderRadius: 15,\n      padding: theme.spacing.small,\n      width: '112%',\n      position: 'absolute',\n      bottom: 4,\n      right: -15,\n      shadowColor: theme.colors.black,\n      shadowOpacity: 0.3,\n      shadowOffset: {width: 0, height: 0},\n      shadowRadius: 8,\n      elevation: 6\n    },\n    htmlTooltipText: {\n      color: theme.colors.text.primary,\n      fontSize: 16,\n      fontWeight: '600',\n      lineHeight: 22,\n      textAlign: 'center'\n    },\n    triangleTooltip: {\n      zIndex: 31,\n      width: 0,\n      height: 0,\n      backgroundColor: 'transparent',\n      borderStyle: 'solid',\n      borderLeftWidth: 13,\n      borderRightWidth: 13,\n      borderBottomWidth: 13,\n      borderTopWidth: 13,\n      borderLeftColor: 'transparent',\n      borderTopColor: 'transparent',\n      borderRightColor: theme.colors.white,\n      borderBottomColor: theme.colors.white,\n      transform: [{rotate: '45deg'}],\n      position: 'absolute',\n      left: 110,\n      top: -20,\n      borderRadius: 4\n    }\n  });\n\nconst KlfButton = ({\n  klf,\n  styleSheet\n}: {\n  klf: ReviewCorrectionPopinKLFProps;\n  styleSheet: StyleSheetType;\n}) => {\n  const [displayTooltip, setDisplayTooltip] = useState(false);\n  const fadeIn = useAnimateProp({\n    property: 'opacity',\n    fromValue: 0,\n    toValue: 1,\n    easing: Easing.bezier(0.25, 1, 0.5, 1)\n  });\n\n  const handlePressKey = useCallback(() => {\n    setDisplayTooltip(!displayTooltip);\n    !displayTooltip ? fadeIn.start() : fadeIn.revert();\n  }, [displayTooltip, fadeIn]);\n\n  const {\n    buttonKlf,\n    buttonKlfActive,\n    buttonKlfText,\n    containerButtonKlf,\n    containerTooltip,\n    buttonTooltip,\n    htmlTooltipText,\n    iconKey,\n    triangleTooltip\n  } = styleSheet;\n\n  const {label, tooltip} = klf;\n\n  return (\n    <View style={containerButtonKlf}>\n      <Animated.View style={[containerTooltip, fadeIn.animatedStyle]}>\n        <Touchable\n          style={buttonTooltip}\n          accessibilityLabel={`aria-label-tooltip`}\n          isHighlight\n          onPress={handlePressKey}\n          testID=\"button-tooltip\"\n        >\n          <Html style={htmlTooltipText}>{tooltip}</Html>\n        </Touchable>\n        <View style={triangleTooltip} />\n      </Animated.View>\n      <Touchable\n        style={displayTooltip ? {...buttonKlf, ...buttonKlfActive} : buttonKlf}\n        accessibilityLabel={`aria-label-${label}`}\n        onPress={handlePressKey}\n        testID=\"button-klf\"\n      >\n        <KlfIcon style={iconKey} color=\"white\" />\n        <Text style={buttonKlfText}>{label}</Text>\n      </Touchable>\n    </View>\n  );\n};\n\nconst ICONS = {\n  right: RightIcon,\n  wrong: WrongIcon\n};\n\nconst ReviewCorrectionPopin = ({\n  information,\n  klf,\n  next,\n  type,\n  resultLabel\n}: ReviewCorrectionPopinProps) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n  const handlePressNext = next.onClick;\n\n  const Icon = ICONS[type];\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme, type);\n    setStylesheet(_stylesheet);\n  }, [theme, type]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={styleSheet.wrapper}>\n      <View style={styleSheet.popin}>\n        <View style={styleSheet.correctionSection}>\n          <View style={styleSheet.iconCircle}>\n            <Icon\n              style={styleSheet.icon}\n              color={type === 'wrong' ? theme.colors.negative : theme.colors.positive}\n            />\n          </View>\n          <Text style={styleSheet.resultLabel}>{resultLabel}</Text>\n        </View>\n        <View style={styleSheet.feedbackSection} accessibilityLabel=\"answer-information\">\n          <View style={styleSheet.labelContainer} needsOffscreenAlphaCompositing>\n            <Text accessibilityLabel={information.label} style={styleSheet.label}>\n              {information.label}\n            </Text>\n          </View>\n          <Html style={styleSheet.htmlInfoMessage}>{information.message}</Html>\n        </View>\n        {klf && type === 'wrong' ? <KlfButton styleSheet={styleSheet} klf={klf} /> : null}\n        <Touchable\n          style={styleSheet.button}\n          onPress={handlePressNext}\n          accessibilityLabel={next['aria-label']}\n          testID={next['data-name']}\n        >\n          <Text style={styleSheet.buttonText}>{next.label}</Text>\n        </Touchable>\n      </View>\n    </View>\n  );\n};\n\nexport default ReviewCorrectionPopin;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","type","StyleSheet","create","wrapper","backgroundColor","height","display","justifyContent","popin","padding","spacing","medium","borderRadius","flexDirection","alignItems","colors","negative","positive","shadowColor","shadowOpacity","shadowOffset","width","shadowRadius","elevation","correctionSection","iconCircle","white","opacity","icon","resultLabel","color","fontSize","fontWeight","lineHeight","marginLeft","textTransform","feedbackSection","marginVertical","labelContainer","alignSelf","paddingHorizontal","tiny","paddingVertical","micro","marginBottom","label","extraBold","htmlInfoMessage","button","base","small","buttonText","cta","bold","textAlign","containerButtonKlf","buttonKlf","buttonKlfActive","buttonKlfText","iconKey","marginRight","containerTooltip","zIndex","position","black","buttonTooltip","bottom","right","htmlTooltipText","text","primary","triangleTooltip","borderStyle","borderLeftWidth","borderRightWidth","borderBottomWidth","borderTopWidth","borderLeftColor","borderTopColor","borderRightColor","borderBottomColor","transform","rotate","left","top","KlfButton","klf","styleSheet","displayTooltip","setDisplayTooltip","useState","fadeIn","useAnimateProp","property","fromValue","toValue","duration","easing","Easing","bezier","handlePressKey","useCallback","start","reset","tooltip","animatedStyle","ICONS","RightIcon","wrong","WrongIcon","ReviewCorrectionPopin","information","next","templateContext","useTemplateContext","setStylesheet","handlePressNext","onClick","Icon","useEffect","_stylesheet","message"],"sources":["../../../src/molecule/review-correction-popin/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useState} from 'react';\nimport {Animated, Easing, TextStyle, StyleSheet, View, ViewStyle} from 'react-native';\nimport {\n  NovaCompositionCoorpacademyCheck as RightIcon,\n  NovaSolidStatusClose as WrongIcon,\n  NovaLineLoginKey1 as KlfIcon\n} from '@coorpacademy/nova-icons';\nimport {useAnimateProp} from '@coorpacademy/react-native-animation';\nimport Html from '../../atom/html/index.native';\nimport {Theme} from '../../variables/theme.native';\nimport Text from '../../atom/text/index.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {ReviewCorrectionPopinKLFProps, ReviewCorrectionPopinProps} from './prop-types';\n\ninterface StyleSheetType {\n  wrapper: ViewStyle;\n  popin: ViewStyle;\n  correctionSection: ViewStyle;\n  iconCircle: ViewStyle;\n  icon: ViewStyle;\n  resultLabel: TextStyle;\n  feedbackSection: ViewStyle;\n  labelContainer: ViewStyle;\n  label: TextStyle;\n  htmlInfoMessage: TextStyle;\n  button: ViewStyle;\n  buttonText: TextStyle;\n  buttonKlf: ViewStyle;\n  buttonKlfActive: TextStyle;\n  buttonKlfText: TextStyle;\n  iconKey: ViewStyle;\n  containerTooltip: ViewStyle;\n  buttonTooltip: ViewStyle;\n  containerButtonKlf: ViewStyle;\n  triangleTooltip: ViewStyle;\n  htmlTooltipText: TextStyle;\n}\n\nconst createStyleSheet = (theme: Theme, type: string): StyleSheetType =>\n  StyleSheet.create({\n    wrapper: {\n      backgroundColor: '#00000000',\n      height: 2000,\n      display: 'flex',\n      justifyContent: 'flex-end'\n    },\n    popin: {\n      padding: theme.spacing.medium,\n      borderRadius: 16,\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'flex-start',\n      backgroundColor: type === 'wrong' ? theme.colors.negative : theme.colors.positive,\n      shadowColor: type === 'wrong' ? theme.colors.negative : theme.colors.positive,\n      shadowOpacity: 0.5,\n      shadowOffset: {width: 0, height: 0},\n      shadowRadius: 15,\n      elevation: 4\n    },\n    correctionSection: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      width: '80%'\n    },\n    iconCircle: {\n      width: 60,\n      height: 60,\n      alignItems: 'center',\n      justifyContent: 'center',\n      backgroundColor: theme.colors.white,\n      opacity: 0.7,\n      borderRadius: 50\n    },\n    icon: {\n      height: 30,\n      width: 30\n    },\n    resultLabel: {\n      color: theme.colors.white,\n      fontSize: 24,\n      fontWeight: '600',\n      lineHeight: 24,\n      marginLeft: 12,\n      textTransform: 'uppercase'\n    },\n    feedbackSection: {\n      marginVertical: theme.spacing.medium\n    },\n    labelContainer: {\n      alignSelf: 'flex-start',\n      backgroundColor: 'rgba(255, 255, 255, 0.3)',\n      borderRadius: 56,\n      paddingHorizontal: theme.spacing.tiny,\n      paddingVertical: theme.spacing.micro,\n      marginBottom: 8\n    },\n    label: {\n      color: theme.colors.white,\n      fontSize: 14,\n      fontWeight: theme.fontWeight.extraBold,\n      lineHeight: 17\n    },\n    htmlInfoMessage: {\n      color: theme.colors.white,\n      fontSize: 16,\n      fontWeight: '600',\n      lineHeight: 19\n    },\n    button: {\n      alignSelf: 'stretch',\n      backgroundColor: theme.colors.white,\n      borderRadius: 7,\n      paddingHorizontal: theme.spacing.base,\n      paddingVertical: theme.spacing.small\n    },\n    buttonText: {\n      color: theme.colors.cta,\n      fontSize: 14,\n      fontWeight: theme.fontWeight.bold,\n      lineHeight: 20,\n      textAlign: 'center'\n    },\n    containerButtonKlf: {\n      width: '100%'\n    },\n    buttonKlf: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'center',\n      backgroundColor: 'rgba(255, 255, 255, 0.1)',\n      borderRadius: 7,\n      paddingHorizontal: theme.spacing.base,\n      paddingVertical: theme.spacing.small,\n      marginBottom: theme.spacing.tiny\n    },\n    buttonKlfActive: {\n      backgroundColor:\n        'linear-gradient(0deg, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)), rgba(255, 255, 255, 0.1)'\n    },\n    buttonKlfText: {\n      color: 'white',\n      fontSize: 14,\n      fontWeight: theme.fontWeight.bold,\n      lineHeight: 20,\n      textAlign: 'center'\n    },\n    iconKey: {\n      width: 12,\n      height: 12,\n      marginRight: theme.spacing.tiny\n    },\n    containerTooltip: {\n      zIndex: 30,\n      position: 'relative',\n      shadowColor: theme.colors.black,\n      shadowOpacity: 0.3,\n      shadowOffset: {width: 0, height: 0},\n      shadowRadius: 8\n    },\n    buttonTooltip: {\n      zIndex: 20,\n      flexDirection: 'column',\n      justifyContent: 'center',\n      backgroundColor: theme.colors.white,\n      borderRadius: 15,\n      padding: theme.spacing.small,\n      width: '112%',\n      position: 'absolute',\n      bottom: 4,\n      right: -15,\n      shadowColor: theme.colors.black,\n      shadowOpacity: 0.3,\n      shadowOffset: {width: 0, height: 0},\n      shadowRadius: 8,\n      elevation: 6\n    },\n    htmlTooltipText: {\n      color: theme.colors.text.primary,\n      fontSize: 16,\n      fontWeight: '600',\n      lineHeight: 22,\n      textAlign: 'center'\n    },\n    triangleTooltip: {\n      zIndex: 31,\n      width: 0,\n      height: 0,\n      backgroundColor: 'transparent',\n      borderStyle: 'solid',\n      borderLeftWidth: 13,\n      borderRightWidth: 13,\n      borderBottomWidth: 13,\n      borderTopWidth: 13,\n      borderLeftColor: 'transparent',\n      borderTopColor: 'transparent',\n      borderRightColor: theme.colors.white,\n      borderBottomColor: theme.colors.white,\n      transform: [{rotate: '45deg'}],\n      position: 'absolute',\n      left: 110,\n      top: -20,\n      borderRadius: 4\n    }\n  });\n\nconst KlfButton = ({\n  klf,\n  styleSheet\n}: {\n  klf: ReviewCorrectionPopinKLFProps;\n  styleSheet: StyleSheetType;\n}) => {\n  const [displayTooltip, setDisplayTooltip] = useState(false);\n  const fadeIn = useAnimateProp({\n    property: 'opacity',\n    fromValue: 0,\n    toValue: 1,\n    duration: 250,\n    easing: Easing.bezier(0.25, 1, 0.5, 1)\n  });\n\n  const handlePressKey = useCallback(() => {\n    setDisplayTooltip(!displayTooltip);\n    !displayTooltip ? fadeIn.start() : fadeIn.reset();\n  }, [displayTooltip, fadeIn]);\n\n  const {\n    buttonKlf,\n    buttonKlfActive,\n    buttonKlfText,\n    containerButtonKlf,\n    containerTooltip,\n    buttonTooltip,\n    htmlTooltipText,\n    iconKey,\n    triangleTooltip\n  } = styleSheet;\n\n  const {label, tooltip} = klf;\n\n  return (\n    <View style={containerButtonKlf}>\n      <Animated.View style={[containerTooltip, fadeIn.animatedStyle]}>\n        <Touchable\n          style={buttonTooltip}\n          accessibilityLabel={`aria-label-tooltip`}\n          isHighlight\n          onPress={handlePressKey}\n          testID=\"button-tooltip\"\n        >\n          <Html style={htmlTooltipText}>{tooltip}</Html>\n        </Touchable>\n        <View style={triangleTooltip} />\n      </Animated.View>\n      <Touchable\n        style={displayTooltip ? {...buttonKlf, ...buttonKlfActive} : buttonKlf}\n        accessibilityLabel={`aria-label-${label}`}\n        onPress={handlePressKey}\n        testID=\"button-klf\"\n      >\n        <KlfIcon style={iconKey} color=\"white\" />\n        <Text style={buttonKlfText}>{label}</Text>\n      </Touchable>\n    </View>\n  );\n};\n\nconst ICONS = {\n  right: RightIcon,\n  wrong: WrongIcon\n};\n\nconst ReviewCorrectionPopin = ({\n  information,\n  klf,\n  next,\n  type,\n  resultLabel\n}: ReviewCorrectionPopinProps) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n  const handlePressNext = next.onClick;\n\n  const Icon = ICONS[type];\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme, type);\n    setStylesheet(_stylesheet);\n  }, [theme, type]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={styleSheet.wrapper}>\n      <View style={styleSheet.popin}>\n        <View style={styleSheet.correctionSection}>\n          <View style={styleSheet.iconCircle}>\n            <Icon\n              style={styleSheet.icon}\n              color={type === 'wrong' ? theme.colors.negative : theme.colors.positive}\n            />\n          </View>\n          <Text style={styleSheet.resultLabel}>{resultLabel}</Text>\n        </View>\n        <View style={styleSheet.feedbackSection} accessibilityLabel=\"answer-information\">\n          <View style={styleSheet.labelContainer} needsOffscreenAlphaCompositing>\n            <Text accessibilityLabel={information.label} style={styleSheet.label}>\n              {information.label}\n            </Text>\n          </View>\n          <Html style={styleSheet.htmlInfoMessage}>{information.message}</Html>\n        </View>\n        {klf && type === 'wrong' ? <KlfButton styleSheet={styleSheet} klf={klf} /> : null}\n        <Touchable\n          style={styleSheet.button}\n          onPress={handlePressNext}\n          accessibilityLabel={next['aria-label']}\n          testID={next['data-name']}\n        >\n          <Text style={styleSheet.buttonText}>{next.label}</Text>\n        </Touchable>\n      </View>\n    </View>\n  );\n};\n\nexport default ReviewCorrectionPopin;\n"],"mappings":"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"}

package/lib/organism/list-items/index.d.ts

@@ -1,7 +1,8 @@
 export default ListItems;
-declare function ListItems({ title, buttonLink, content, "aria-label": ariaLabel }: {
+declare function ListItems({ title, buttonLink, selectMultiple, content, "aria-label": ariaLabel }: {
     title: any;
     buttonLink: any;
+    selectMultiple: any;
     content: any;
     "aria-label": any;
 }): JSX.Element;
@@ -28,6 +29,24 @@ declare namespace ListItems {
             className: PropTypes.Requireable<string>;
             customStyle: PropTypes.Requireable<PropTypes.InferProps<{}>>;
         }>>;
+        selectMultiple: PropTypes.Requireable<PropTypes.InferProps<{
+            title: PropTypes.Requireable<string>;
+            placeholder: PropTypes.Requireable<string>;
+            description: PropTypes.Requireable<string>;
+            hint: PropTypes.Requireable<string>;
+            options: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
+                selected: PropTypes.Validator<boolean>;
+                name: PropTypes.Validator<string>;
+                value: PropTypes.Requireable<string>;
+            }>>[]>;
+            onChange: PropTypes.Requireable<(...args: any[]) => any>;
+            onError: PropTypes.Requireable<(...args: any[]) => any>;
+            multiple: PropTypes.Requireable<boolean>;
+            modified: PropTypes.Requireable<boolean>;
+            disabled: PropTypes.Requireable<boolean>;
+            error: PropTypes.Requireable<string>;
+            theme: PropTypes.Requireable<string>;
+        }>>;
         items: PropTypes.Requireable<(PropTypes.InferProps<{
             bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
                 buttonAriaLabel: PropTypes.Requireable<string>;

package/lib/organism/list-items/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AA+BA;;;;;gBAgBC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AAgCA;;;;;;gBAwBC"}

package/lib/organism/list-items/index.js

@@ -13,6 +13,8 @@ var _title = _interopRequireDefault(require("../../atom/title"));
 
 var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
 
+var _selectMultiple = _interopRequireDefault(require("../../molecule/select-multiple"));
+
 var _expandibleActionableTable = _interopRequireDefault(require("../../molecule/expandible-actionable-table"));
 
 var _style = _interopRequireDefault(require("./style.css"));
@@ -58,6 +60,7 @@ const buildContentView = (content, ariaLabel) => {
 const ListItems = ({
   title,
   buttonLink,
+  selectMultiple,
   content,
   'aria-label': ariaLabel
 }) => {
@@ -71,13 +74,18 @@ const ListItems = ({
     type: 'form-group',
     "data-name": 'list-title'
   })), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.actionsWrapper
+  }, selectMultiple ? /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.selectMultiple
+  }, /*#__PURE__*/_react.default.createElement(_selectMultiple.default, selectMultiple)) : null, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.buttonCreate
-  }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonLink))), contentView);
+  }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonLink)))), contentView);
 };
 
 ListItems.propTypes = process.env.NODE_ENV !== "production" ? {
   'aria-label': _propTypes.default.string,
   buttonLink: _propTypes.default.shape(_buttonLink.default.propTypes),
+  selectMultiple: _propTypes.default.shape(_selectMultiple.default.propTypes),
   items: _propTypes.default.arrayOf(_propTypes.default.shape(_listItem.default.propTypes)),
   content: _propTypes.default.oneOfType([_propTypes.default.shape({
     items: _propTypes.default.arrayOf(_propTypes.default.shape(_listItem.default.propTypes)),

package/lib/organism/list-items/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["buildListItemsView","content","ariaLabel","items","itemType","itemsView","map","item","index","id","style","list","buildContentView","type","ListItems","title","buttonLink","contentView","header","buttonCreate","propTypes","PropTypes","string","shape","ButtonLink","arrayOf","ListItem","oneOfType","oneOf","ExpandibleActionableTable"],"sources":["../../../src/organism/list-items/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ListItem from '../list-item';\nimport Title from '../../atom/title';\nimport ButtonLink from '../../atom/button-link';\nimport ExpandibleActionableTable from '../../molecule/expandible-actionable-table';\nimport style from './style.css';\n\nconst buildListItemsView = (content, ariaLabel) => {\n  const {items, itemType} = content;\n  const itemsView = items.map((item, index) => (\n    <li key={item.id} className={style.item} data-name={`content-${index}`}>\n      <ListItem {...item} order={index} contentType={itemType} />\n    </li>\n  ));\n  return (\n    <ul className={style.list} aria-label={ariaLabel} data-name={'content-list'}>\n      {itemsView}\n    </ul>\n  );\n};\nconst buildContentView = (content, ariaLabel) => {\n  const {type} = content;\n  switch (type) {\n    case 'list':\n      return buildListItemsView(content, ariaLabel);\n    case 'expandible-actionable-table':\n      return <ExpandibleActionableTable {...content} />;\n  }\n};\n\nconst ListItems = ({title, buttonLink, content, 'aria-label': ariaLabel}) => {\n  const contentView = buildContentView(content, ariaLabel);\n\n  return (\n    <div>\n      <div className={style.header}>\n        <div className={style.title}>\n          <Title title={title} type={'form-group'} data-name={'list-title'} />\n        </div>\n        <div className={style.buttonCreate}>\n          <ButtonLink {...buttonLink} />\n        </div>\n      </div>\n      {contentView}\n    </div>\n  );\n};\n\nListItems.propTypes = {\n  'aria-label': PropTypes.string,\n  buttonLink: PropTypes.shape(ButtonLink.propTypes),\n  items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),\n  content: PropTypes.oneOfType([\n    PropTypes.shape({\n      items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),\n      type: PropTypes.oneOf(['list']),\n      itemType: PropTypes.string\n    }),\n    PropTypes.shape({\n      ...ExpandibleActionableTable.propTypes,\n      type: PropTypes.oneOf(['expandible-actionable-table'])\n    })\n  ]),\n  title: PropTypes.string\n};\n\nexport default ListItems;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,MAAMA,kBAAkB,GAAG,CAACC,OAAD,EAAUC,SAAV,KAAwB;EACjD,MAAM;IAACC,KAAD;IAAQC;EAAR,IAAoBH,OAA1B;EACA,MAAMI,SAAS,GAAGF,KAAK,CAACG,GAAN,CAAU,CAACC,IAAD,EAAOC,KAAP,kBAC1B;IAAI,GAAG,EAAED,IAAI,CAACE,EAAd;IAAkB,SAAS,EAAEC,cAAA,CAAMH,IAAnC;IAAyC,aAAY,WAAUC,KAAM;EAArE,gBACE,6BAAC,iBAAD,eAAcD,IAAd;IAAoB,KAAK,EAAEC,KAA3B;IAAkC,WAAW,EAAEJ;EAA/C,GADF,CADgB,CAAlB;EAKA,oBACE;IAAI,SAAS,EAAEM,cAAA,CAAMC,IAArB;IAA2B,cAAYT,SAAvC;IAAkD,aAAW;EAA7D,GACGG,SADH,CADF;AAKD,CAZD;;AAaA,MAAMO,gBAAgB,GAAG,CAACX,OAAD,EAAUC,SAAV,KAAwB;EAC/C,MAAM;IAACW;EAAD,IAASZ,OAAf;;EACA,QAAQY,IAAR;IACE,KAAK,MAAL;MACE,OAAOb,kBAAkB,CAACC,OAAD,EAAUC,SAAV,CAAzB;;IACF,KAAK,6BAAL;MACE,oBAAO,6BAAC,kCAAD,EAA+BD,OAA/B,CAAP;EAJJ;AAMD,CARD;;AAUA,MAAMa,SAAS,GAAG,CAAC;EAACC,KAAD;EAAQC,UAAR;EAAoBf,OAApB;EAA6B,cAAcC;AAA3C,CAAD,KAA2D;EAC3E,MAAMe,WAAW,GAAGL,gBAAgB,CAACX,OAAD,EAAUC,SAAV,CAApC;EAEA,oBACE,uDACE;IAAK,SAAS,EAAEQ,cAAA,CAAMQ;EAAtB,gBACE;IAAK,SAAS,EAAER,cAAA,CAAMK;EAAtB,gBACE,6BAAC,cAAD;IAAO,KAAK,EAAEA,KAAd;IAAqB,IAAI,EAAE,YAA3B;IAAyC,aAAW;EAApD,EADF,CADF,eAIE;IAAK,SAAS,EAAEL,cAAA,CAAMS;EAAtB,gBACE,6BAAC,mBAAD,EAAgBH,UAAhB,CADF,CAJF,CADF,EASGC,WATH,CADF;AAaD,CAhBD;;AAkBAH,SAAS,CAACM,SAAV,2CAAsB;EACpB,cAAcC,kBAAA,CAAUC,MADJ;EAEpBN,UAAU,EAAEK,kBAAA,CAAUE,KAAV,CAAgBC,mBAAA,CAAWJ,SAA3B,CAFQ;EAGpBjB,KAAK,EAAEkB,kBAAA,CAAUI,OAAV,CAAkBJ,kBAAA,CAAUE,KAAV,CAAgBG,iBAAA,CAASN,SAAzB,CAAlB,CAHa;EAIpBnB,OAAO,EAAEoB,kBAAA,CAAUM,SAAV,CAAoB,CAC3BN,kBAAA,CAAUE,KAAV,CAAgB;IACdpB,KAAK,EAAEkB,kBAAA,CAAUI,OAAV,CAAkBJ,kBAAA,CAAUE,KAAV,CAAgBG,iBAAA,CAASN,SAAzB,CAAlB,CADO;IAEdP,IAAI,EAAEQ,kBAAA,CAAUO,KAAV,CAAgB,CAAC,MAAD,CAAhB,CAFQ;IAGdxB,QAAQ,EAAEiB,kBAAA,CAAUC;EAHN,CAAhB,CAD2B,EAM3BD,kBAAA,CAAUE,KAAV,cACKM,kCAAA,CAA0BT,SAD/B;IAEEP,IAAI,EAAEQ,kBAAA,CAAUO,KAAV,CAAgB,CAAC,6BAAD,CAAhB;EAFR,GAN2B,CAApB,CAJW;EAepBb,KAAK,EAAEM,kBAAA,CAAUC;AAfG,CAAtB;eAkBeR,S"}
+{"version":3,"file":"index.js","names":["buildListItemsView","content","ariaLabel","items","itemType","itemsView","map","item","index","id","style","list","buildContentView","type","ListItems","title","buttonLink","selectMultiple","contentView","header","actionsWrapper","buttonCreate","propTypes","PropTypes","string","shape","ButtonLink","SelectMultiple","arrayOf","ListItem","oneOfType","oneOf","ExpandibleActionableTable"],"sources":["../../../src/organism/list-items/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ListItem from '../list-item';\nimport Title from '../../atom/title';\nimport ButtonLink from '../../atom/button-link';\nimport SelectMultiple from '../../molecule/select-multiple';\nimport ExpandibleActionableTable from '../../molecule/expandible-actionable-table';\nimport style from './style.css';\n\nconst buildListItemsView = (content, ariaLabel) => {\n  const {items, itemType} = content;\n  const itemsView = items.map((item, index) => (\n    <li key={item.id} className={style.item} data-name={`content-${index}`}>\n      <ListItem {...item} order={index} contentType={itemType} />\n    </li>\n  ));\n  return (\n    <ul className={style.list} aria-label={ariaLabel} data-name={'content-list'}>\n      {itemsView}\n    </ul>\n  );\n};\nconst buildContentView = (content, ariaLabel) => {\n  const {type} = content;\n  switch (type) {\n    case 'list':\n      return buildListItemsView(content, ariaLabel);\n    case 'expandible-actionable-table':\n      return <ExpandibleActionableTable {...content} />;\n  }\n};\n\nconst ListItems = ({title, buttonLink, selectMultiple, content, 'aria-label': ariaLabel}) => {\n  const contentView = buildContentView(content, ariaLabel);\n\n  return (\n    <div>\n      <div className={style.header}>\n        <div className={style.title}>\n          <Title title={title} type={'form-group'} data-name={'list-title'} />\n        </div>\n        <div className={style.actionsWrapper}>\n          {selectMultiple ? (\n            <div className={style.selectMultiple}>\n              <SelectMultiple {...selectMultiple} />\n            </div>\n          ) : null}\n\n          <div className={style.buttonCreate}>\n            <ButtonLink {...buttonLink} />\n          </div>\n        </div>\n      </div>\n      {contentView}\n    </div>\n  );\n};\n\nListItems.propTypes = {\n  'aria-label': PropTypes.string,\n  buttonLink: PropTypes.shape(ButtonLink.propTypes),\n  selectMultiple: PropTypes.shape(SelectMultiple.propTypes),\n  items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),\n  content: PropTypes.oneOfType([\n    PropTypes.shape({\n      items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),\n      type: PropTypes.oneOf(['list']),\n      itemType: PropTypes.string\n    }),\n    PropTypes.shape({\n      ...ExpandibleActionableTable.propTypes,\n      type: PropTypes.oneOf(['expandible-actionable-table'])\n    })\n  ]),\n  title: PropTypes.string\n};\n\nexport default ListItems;\n"],"mappings":"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"}

package/lib/organism/list-items/style.css

@@ -12,6 +12,12 @@
   padding: 0 24px;
   margin-bottom: 24px;
 }
+.actionsWrapper {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 32px;
+}
 
 .title {
   font-family: Gilroy;
@@ -28,6 +34,10 @@
   width: 194px;
 }
 
+.selectMultiple {
+  width: 291px;
+}
+
 .item {
   margin-bottom: 8px;
 }

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

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