@coorpacademy/components 10.30.2 → 10.30.3

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

@@ -15,9 +15,11 @@ var _index = _interopRequireDefault(require("../../atom/text/index.native"));
 
 var _index2 = _interopRequireDefault(require("../../molecule/answer/index.native"));
 
+var _index3 = _interopRequireDefault(require("../../molecule/review-correction-popin/index.native"));
+
 var _templateContext = require("../../template/app-review/template-context");
 
-var _index3 = _interopRequireDefault(require("../../hoc/touchable/index.native"));
+var _index4 = _interopRequireDefault(require("../../hoc/touchable/index.native"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -25,28 +27,28 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-// import Loader from '../../atom/loader';
-// import ReviewCorrectionPopin from '../../molecule/review-correction-popin';
+const styles = _reactNative.StyleSheet.create({
+  correctionPopinWrapper: {
+    position: 'absolute',
+    bottom: 16,
+    width: '105%'
+  }
+});
+
 const CorrectionPopin = ({
   correctionPopinProps,
-  slideIndex,
-  showCorrectionPopin,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  animateCorrectionPopin
+  slideIndex
 }) => {
-  if (!showCorrectionPopin) return null;
-  const klf = (0, _getOr.default)({}, 'klf', correctionPopinProps);
+  const klf = (0, _getOr.default)(undefined, 'klf', correctionPopinProps);
   const information = (0, _getOr.default)({
     label: '',
     message: ''
   }, 'information', correctionPopinProps);
   const next = (0, _get.default)('next', correctionPopinProps);
+  const onClick = (0, _get.default)(['next', 'onClick'], correctionPopinProps);
   const _correctionPopinProps = {
     next: {
-      onClick: () => {
-        // eslint-disable-next-line no-console
-        console.log('Next Slide');
-      },
+      onClick,
       label: next && next.label,
       'data-name': `next-question-button-${slideIndex}`,
       'aria-label': next && next['aria-label']
@@ -56,8 +58,9 @@ const CorrectionPopin = ({
     type: correctionPopinProps.type,
     resultLabel: correctionPopinProps.resultLabel
   };
-  return /*#__PURE__*/_react.default.createElement(_index.default, null, "@todo ReviewCorrectionPopin ", _correctionPopinProps.toString()) // <ReviewCorrectionPopin {..._correctionPopinProps} />
-  ;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.correctionPopinWrapper
+  }, /*#__PURE__*/_react.default.createElement(_index3.default, _correctionPopinProps));
 }; // const ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {
 //   const {label, onClick, disabled} = validateButton;
 //   const validateButtonProps = {
@@ -149,7 +152,7 @@ const Question = props => {
     style: style.questionHelp
   }, (0, _get.default)('help', answerUI))), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: style.choicesContainer
-  }, /*#__PURE__*/_react.default.createElement(_index2.default, answerUI)), /*#__PURE__*/_react.default.createElement(_index3.default, {
+  }, /*#__PURE__*/_react.default.createElement(_index2.default, answerUI)), /*#__PURE__*/_react.default.createElement(_index4.default, {
     style: style.validateButton
   }, /*#__PURE__*/_react.default.createElement(_index.default, {
     style: style.validateButtonText

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

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","klf","getOr","information","label","message","next","get","_correctionPopinProps","onClick","console","log","type","resultLabel","toString","createQuestionStyle","theme","brandTheme","StyleSheet","create","questionHeading","justifyContent","questionOrigin","fontSize","lineHeight","color","colors","text","primary","marginBottom","spacing","tiny","marginTop","small","textAlign","questionText","fontWeight","questionHelp","gray","medium","choicesContainer","flex","width","validateButton","backgroundColor","borderRadius","validateButtonText","white","Question","props","answerUI","useTemplateContext","style","setStyle","useState","useEffect","questionStyle","createSlideStyle","num","screenWidth","slideWidth","slide","position","left","bottom","height","alignItems","padding","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","useWindowDimensions","slideStyle","loading","parentContentTitle"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {StyleSheet, TextStyle, useWindowDimensions, View, ViewStyle} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport Text from '../../atom/text/index.native';\nimport Answer from '../../molecule/answer/index.native';\n// import Loader from '../../atom/loader';\n// import ReviewCorrectionPopin from '../../molecule/review-correction-popin';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Brand} from '../../variables/brand.native';\nimport {ReviewCorrectionPopinProps} from '../../molecule/review-correction-popin/prop-types';\nimport {ReviewSlideProps, SlideProps} from './prop-types';\n\ntype PopinProps = {\n  correctionPopinProps: ReviewCorrectionPopinProps;\n  slideIndex: unknown;\n  showCorrectionPopin: unknown;\n  animateCorrectionPopin: unknown;\n};\n\nconst CorrectionPopin = ({\n  correctionPopinProps,\n  slideIndex,\n  showCorrectionPopin,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  animateCorrectionPopin\n}: PopinProps) => {\n  if (!showCorrectionPopin) return null;\n\n  const klf = getOr({}, 'klf', correctionPopinProps);\n  const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n  const next = get('next', correctionPopinProps);\n\n  const _correctionPopinProps = {\n    next: {\n      onClick: () => {\n        // eslint-disable-next-line no-console\n        console.log('Next Slide');\n      },\n      label: next && next.label,\n      'data-name': `next-question-button-${slideIndex}`,\n      'aria-label': next && next['aria-label']\n    },\n    klf,\n    information,\n    type: correctionPopinProps.type,\n    resultLabel: correctionPopinProps.resultLabel\n  };\n\n  return (\n    <Text>@todo ReviewCorrectionPopin {_correctionPopinProps.toString()}</Text>\n    // <ReviewCorrectionPopin {..._correctionPopinProps} />\n  );\n};\n\n// const ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {\n//   const {label, onClick, disabled} = validateButton;\n//   const validateButtonProps = {\n//     type: 'primary',\n//     label,\n//     'aria-label': label,\n//     'data-name': `slide-validate-button-${slideIndex}`,\n//     onClick,\n//     disabled,\n//     customStyle: {\n//       backgroundColor: primarySkinColor\n//     }\n//   };\n\n//   return <Button title=\"validate todo\" />;\n// };\n\ntype StyleSheetType = {\n  questionHeading: ViewStyle;\n  questionOrigin: ViewStyle;\n  questionText: TextStyle;\n  questionHelp: ViewStyle;\n  choicesContainer: ViewStyle;\n  validateButton: ViewStyle;\n  validateButtonText: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme, brandTheme: Brand): StyleSheetType =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between'\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary,\n      textAlign: 'center'\n    },\n    questionHelp: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.gray.medium,\n      marginBottom: 0,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    choicesContainer: {\n      flex: 1,\n      width: '100%',\n      justifyContent: 'center'\n    },\n    validateButton: {\n      backgroundColor: brandTheme?.colors?.primary || theme.colors.text.primary,\n      borderRadius: 7,\n      width: '100%'\n    },\n    validateButtonText: {\n      fontSize: 14,\n      lineHeight: 20,\n      fontWeight: '700',\n      color: theme.colors.white,\n      marginBottom: 16,\n      marginTop: 16,\n      textAlign: 'center'\n    }\n  });\n\ntype QuestionProps = {\n  answerUI: SlideProps['answerUI'];\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {answerUI, questionText, questionOrigin} = props;\n  const {theme, brandTheme} = useTemplateContext();\n  const [style, setStyle] = useState<StyleSheetType>();\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme, brandTheme);\n    setStyle(questionStyle);\n  }, [theme, brandTheme]);\n\n  if (!answerUI || !questionText || !style) return null;\n\n  return (\n    <>\n      <View style={style.questionHeading}>\n        <Text style={style.questionOrigin}>{questionOrigin}</Text>\n        <Text style={style.questionText}>{questionText}</Text>\n        <Text style={style.questionHelp}>{get('help', answerUI)}</Text>\n      </View>\n      <View style={style.choicesContainer}>\n        <Answer {...answerUI} />\n      </View>\n      <Touchable style={style.validateButton}>\n        <Text style={style.validateButtonText}>@todo validate</Text>\n      </Touchable>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n};\n\nconst createSlideStyle = (num: number, screenWidth: number): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: 34 + num * 5,\n      backgroundColor: '#fff', // theme.colors.white\n      height: '90%',\n      width: slideWidth,\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      padding: 25,\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.05,\n      shadowRadius: 16,\n      elevation: 10 - num * 1,\n      borderRadius: 16\n    }\n  });\n};\n\nconst Slide = (props: ReviewSlideProps) => {\n  const {slide, correctionPopinProps, num, slideIndex = '0'} = props;\n\n  const {width} = useWindowDimensions();\n  const slideStyle = createSlideStyle(num, width);\n\n  const {\n    loading,\n    parentContentTitle,\n    questionText,\n    answerUI,\n    showCorrectionPopin,\n    animateCorrectionPopin\n  } = slide;\n\n  return (\n    <View style={slideStyle.slide}>\n      {loading ? (\n        // <Loader className={style.loader} theme=\"default\" aria-label={loadingAriaLabel} />\n        <Text>@todo loader {num}</Text>\n      ) : (\n        <>\n          <Question\n            questionOrigin={parentContentTitle}\n            questionText={questionText}\n            answerUI={answerUI}\n            key=\"question-container\"\n          />\n          {correctionPopinProps ? (\n            <CorrectionPopin\n              correctionPopinProps={correctionPopinProps}\n              slideIndex={slideIndex}\n              showCorrectionPopin={showCorrectionPopin}\n              animateCorrectionPopin={animateCorrectionPopin}\n              key=\"correction-popin\"\n            />\n          ) : null}\n        </>\n      )}\n    </View>\n  );\n};\n\nexport default Slide;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["styles","StyleSheet","create","correctionPopinWrapper","position","bottom","width","CorrectionPopin","correctionPopinProps","slideIndex","klf","getOr","undefined","information","label","message","next","get","onClick","_correctionPopinProps","type","resultLabel","createQuestionStyle","theme","brandTheme","questionHeading","justifyContent","questionOrigin","fontSize","lineHeight","color","colors","text","primary","marginBottom","spacing","tiny","marginTop","small","textAlign","questionText","fontWeight","questionHelp","gray","medium","choicesContainer","flex","validateButton","backgroundColor","borderRadius","validateButtonText","white","Question","props","answerUI","useTemplateContext","style","setStyle","useState","useEffect","questionStyle","createSlideStyle","num","screenWidth","slideWidth","slide","left","height","alignItems","padding","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","useWindowDimensions","slideStyle","loading","parentContentTitle","showCorrectionPopin","animateCorrectionPopin"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {StyleSheet, TextStyle, useWindowDimensions, View, ViewStyle} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport Text from '../../atom/text/index.native';\nimport Answer from '../../molecule/answer/index.native';\nimport ReviewCorrectionPopin from '../../molecule/review-correction-popin/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Brand} from '../../variables/brand.native';\nimport {ReviewCorrectionPopinProps} from '../../molecule/review-correction-popin/prop-types';\nimport {ReviewSlideProps, SlideProps} from './prop-types';\n\ntype PopinProps = {\n  correctionPopinProps: ReviewCorrectionPopinProps;\n  slideIndex: unknown;\n  showCorrectionPopin: unknown;\n  animateCorrectionPopin: unknown;\n};\n\nconst styles = StyleSheet.create({\n  correctionPopinWrapper: {\n    position: 'absolute',\n    bottom: 16,\n    width: '105%'\n  }\n});\n\nconst CorrectionPopin = ({correctionPopinProps, slideIndex}: PopinProps) => {\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  return (\n    <View style={styles.correctionPopinWrapper}>\n      <ReviewCorrectionPopin {..._correctionPopinProps} />\n    </View>\n  );\n};\n\n// const ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {\n//   const {label, onClick, disabled} = validateButton;\n//   const validateButtonProps = {\n//     type: 'primary',\n//     label,\n//     'aria-label': label,\n//     'data-name': `slide-validate-button-${slideIndex}`,\n//     onClick,\n//     disabled,\n//     customStyle: {\n//       backgroundColor: primarySkinColor\n//     }\n//   };\n\n//   return <Button title=\"validate todo\" />;\n// };\n\ntype StyleSheetType = {\n  questionHeading: ViewStyle;\n  questionOrigin: ViewStyle;\n  questionText: TextStyle;\n  questionHelp: ViewStyle;\n  choicesContainer: ViewStyle;\n  validateButton: ViewStyle;\n  validateButtonText: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme, brandTheme: Brand): StyleSheetType =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between'\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary,\n      textAlign: 'center'\n    },\n    questionHelp: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.gray.medium,\n      marginBottom: 0,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    choicesContainer: {\n      flex: 1,\n      width: '100%',\n      justifyContent: 'center'\n    },\n    validateButton: {\n      backgroundColor: brandTheme?.colors?.primary || theme.colors.text.primary,\n      borderRadius: 7,\n      width: '100%'\n    },\n    validateButtonText: {\n      fontSize: 14,\n      lineHeight: 20,\n      fontWeight: '700',\n      color: theme.colors.white,\n      marginBottom: 16,\n      marginTop: 16,\n      textAlign: 'center'\n    }\n  });\n\ntype QuestionProps = {\n  answerUI: SlideProps['answerUI'];\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {answerUI, questionText, questionOrigin} = props;\n  const {theme, brandTheme} = useTemplateContext();\n  const [style, setStyle] = useState<StyleSheetType>();\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme, brandTheme);\n    setStyle(questionStyle);\n  }, [theme, brandTheme]);\n\n  if (!answerUI || !questionText || !style) return null;\n\n  return (\n    <>\n      <View style={style.questionHeading}>\n        <Text style={style.questionOrigin}>{questionOrigin}</Text>\n        <Text style={style.questionText}>{questionText}</Text>\n        <Text style={style.questionHelp}>{get('help', answerUI)}</Text>\n      </View>\n      <View style={style.choicesContainer}>\n        <Answer {...answerUI} />\n      </View>\n      <Touchable style={style.validateButton}>\n        <Text style={style.validateButtonText}>@todo validate</Text>\n      </Touchable>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n};\n\nconst createSlideStyle = (num: number, screenWidth: number): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: 34 + num * 5,\n      backgroundColor: '#fff', // theme.colors.white\n      height: '90%',\n      width: slideWidth,\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      padding: 25,\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.05,\n      shadowRadius: 16,\n      elevation: 10 - num * 1,\n      borderRadius: 16\n    }\n  });\n};\n\nconst Slide = (props: ReviewSlideProps) => {\n  const {slide, correctionPopinProps, num, slideIndex = '0'} = props;\n\n  const {width} = useWindowDimensions();\n  const slideStyle = createSlideStyle(num, width);\n\n  const {\n    loading,\n    parentContentTitle,\n    questionText,\n    answerUI,\n    showCorrectionPopin,\n    animateCorrectionPopin\n  } = slide;\n\n  return (\n    <View style={slideStyle.slide}>\n      {loading ? (\n        // <Loader className={style.loader} theme=\"default\" aria-label={loadingAriaLabel} />\n        <Text>@todo loader {num}</Text>\n      ) : (\n        <>\n          <Question\n            questionOrigin={parentContentTitle}\n            questionText={questionText}\n            answerUI={answerUI}\n            key=\"question-container\"\n          />\n          {correctionPopinProps ? (\n            <CorrectionPopin\n              correctionPopinProps={correctionPopinProps}\n              slideIndex={slideIndex}\n              showCorrectionPopin={showCorrectionPopin}\n              animateCorrectionPopin={animateCorrectionPopin}\n              key=\"correction-popin\"\n            />\n          ) : null}\n        </>\n      )}\n    </View>\n  );\n};\n\nexport default Slide;\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "10.30.2",
+  "version": "10.30.3",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -157,5 +157,5 @@
     "last 2 versions",
     "IE 11"
   ],
-  "gitHead": "a601551b4bbd5eacb6106c86a47e72b9f0364766"
+  "gitHead": "cb6bb8e9dc4a523a33cee6766d104a19bb5a3a2c"
 }