@coorpacademy/components 10.19.12 → 10.19.13-alpha.8

package/lib/template/app-review/skills/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/template/app-review/skills/index.native.js"],"names":["styles","StyleSheet","create","container","flex","padding","title","lineHeight","subtitle","text","fontSize","opacity","noSkillsImage","alignSelf","width","height","skills","skill","display","flexDirection","overflow","alignItems","borderRadius","skillTexts","skillTitle","fontWeight","skillInfo","extraSpace","onSelectSkill","console","log","ExtraSpace","Skill","info","propTypes","PropTypes","string","Item","item","isExtraSpace","List","shape","bool","ListSkillsPropTypes","listSkills","NoSkills","titleNoSkills","textNoSkills","NoSkillsPropTypes","Skills","props","length","SkillsWeb"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA;AACA;AACA;AACA;AACA;AAEA,MAAMA,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,SAAS,EAAE;AACTC,IAAAA,IAAI,EAAE,CADG;AAETC,IAAAA,OAAO,EAAE,EAFA,CAGT;AACA;;AAJS,GADoB;AAO/BC,EAAAA,KAAK,EAAE;AACL;AACA;AACAC,IAAAA,UAAU,EAAE,EAHP,CAIL;AACA;AACA;;AANK,GAPwB;AAe/BC,EAAAA,QAAQ,EAAE,CACR;AACA;AACA;AAHQ,GAfqB;AAoB/BC,EAAAA,IAAI,EAAE;AACJC,IAAAA,QAAQ,EAAE,EADN;AAEJH,IAAAA,UAAU,EAAE,EAFR;AAGJ;AACAI,IAAAA,OAAO,EAAE,GAJL,CAKJ;;AALI,GApByB;AA2B/BC,EAAAA,aAAa,EAAE;AACbR,IAAAA,IAAI,EAAE,CADO;AAEbS,IAAAA,SAAS,EAAE,QAFE;AAGbC,IAAAA,KAAK,EAAE,GAHM;AAIbC,IAAAA,MAAM,EAAE;AAJK,GA3BgB;AAiC/BC,EAAAA,MAAM,EAAE,EAjCuB;AAkC/BC,EAAAA,KAAK,EAAE;AACLC,IAAAA,OAAO,EAAE,MADJ;AAELC,IAAAA,aAAa,EAAE,KAFV;AAGLC,IAAAA,QAAQ,EAAE,QAHL;AAILC,IAAAA,UAAU,EAAE,QAJP;AAKLN,IAAAA,MAAM,EAAE,GALH;AAMLO,IAAAA,YAAY,EAAE,CANT,CAOL;AACA;AACA;AACA;;AAVK,GAlCwB;AA8C/BC,EAAAA,UAAU,EAAE;AACVnB,IAAAA,IAAI,EAAE,CADI;AAEVe,IAAAA,aAAa,EAAE;AAFL,GA9CmB;AAkD/BK,EAAAA,UAAU,EAAE;AACVd,IAAAA,QAAQ,EAAE,EADA;AAEVe,IAAAA,UAAU,EAAE,KAFF;AAGVlB,IAAAA,UAAU,EAAE,EAHF,CAIV;AACA;;AALU,GAlDmB;AAyD/BmB,EAAAA,SAAS,EAAE;AACThB,IAAAA,QAAQ,EAAE,EADD;AAETH,IAAAA,UAAU,EAAE,EAFH,CAGT;;AAHS,GAzDoB;AA8D/BoB,EAAAA,UAAU,EAAE;AACVZ,IAAAA,MAAM,EAAE;AADE;AA9DmB,CAAlB,CAAf,C,CAmEA;;;AAEA,MAAMa,aAAa,GAAGtB,KAAK,IAAI,MAAM;AACnC;AACAuB,EAAAA,OAAO,CAACC,GAAR,CAAY,YAAZ,EAA0B;AAACxB,IAAAA;AAAD,GAA1B;AACD,CAHD;;AAKA,MAAMyB,UAAU,GAAG,mBAAM,oBAAC,iBAAD;AAAM,EAAA,KAAK,EAAE/B,MAAM,CAAC2B;AAApB,EAAzB;;AAEA,MAAMK,KAAK,GAAG,CAAC;AAAC1B,EAAAA,KAAD;AAAQ2B,EAAAA;AAAR,CAAD,kBACZ,oBAAC,sBAAD;AAAW,EAAA,KAAK,EAAEjC,MAAM,CAACiB,KAAzB;AAAgC,EAAA,OAAO,EAAEW,aAAa,CAACtB,KAAD;AAAtD,gBACE,oBAAC,iBAAD;AAAM,EAAA,KAAK,EAAEN,MAAM,CAACuB;AAApB,gBACE,oBAAC,iBAAD;AAAM,EAAA,KAAK,EAAEvB,MAAM,CAACwB;AAApB,GAAiClB,KAAjC,CADF,eAEE,oBAAC,iBAAD;AAAM,EAAA,KAAK,EAAEN,MAAM,CAAC0B;AAApB,GAAgCO,IAAhC,CAFF,CADF,eAKE,oBAAC,8CAAD;AAAY,EAAA,KAAK,EAAC,SAAlB;AAA4B,EAAA,MAAM,EAAE,EAApC;AAAwC,EAAA,KAAK,EAAE;AAA/C,EALF,CADF;;AAUAD,KAAK,CAACE,SAAN,2CAAkB;AAChB5B,EAAAA,KAAK,EAAE6B,mBAAUC,MADD;AAEhBH,EAAAA,IAAI,EAAEE,mBAAUC;AAFA,CAAlB,M,CAKA;;AAEA,MAAMC,IAAI,GAAG,CAAC;AAACC,EAAAA,IAAI,EAAE;AAAChC,IAAAA,KAAD;AAAQ2B,IAAAA,IAAR;AAAcM,IAAAA,YAAY,GAAG;AAA7B;AAAP,CAAD,KACXA,YAAY,gBAAG,oBAAC,UAAD,OAAH,gBAAoB,oBAAC,KAAD;AAAO,EAAA,KAAK,EAAEjC,KAAd;AAAqB,EAAA,IAAI,EAAE2B;AAA3B,EADlC;;AAGA,MAAMO,IAAI,GAAG,CAAC;AAACxB,EAAAA;AAAD,CAAD,kBACX,oBAAC,qBAAD;AAAU,EAAA,qBAAqB,EAAEhB,MAAM,CAACgB,MAAxC;AAAgD,EAAA,IAAI,EAAEA,MAAtD;AAA8D,EAAA,UAAU,EAAEqB;AAA1E,EADF;;AAIAA,IAAI,CAACH,SAAL,2CAAiB;AACfI,EAAAA,IAAI,EAAEH,mBAAUM,KAAV,CAAgB;AACpBnC,IAAAA,KAAK,EAAE6B,mBAAUC,MADG;AAEpBH,IAAAA,IAAI,EAAEE,mBAAUC,MAFI;AAGpBG,IAAAA,YAAY,EAAEJ,mBAAUO;AAHJ,GAAhB;AADS,CAAjB;AAQAF,IAAI,CAACN,SAAL,2CAAiB;AACflB,EAAAA,MAAM,EAAE2B,kCAAoBC;AADb,CAAjB,M,CAIA;;AAEA;;;;;;;AAMA,MAAMC,QAAQ,GAAG,CAAC;AAACC,EAAAA,aAAD;AAAgBC,EAAAA;AAAhB,CAAD,kBACf,uDACE,oBAAC,iBAAD;AAAM,EAAA,KAAK,EAAE/C,MAAM,CAACQ;AAApB,GAA+BsC,aAA/B,CADF,eAEE,oBAAC,iBAAD;AAAM,EAAA,KAAK,EAAE9C,MAAM,CAACS;AAApB,GAA2BsC,YAA3B,CAFF,CADF;;AAOAF,QAAQ,CAACX,SAAT,2CAAqBc,+BAArB,M,CAEA;AAEA;;AACA,MAAMC,MAAM,GAAGC,KAAK,IAAI;AACtB,QAAM;AAAC5C,IAAAA,KAAD;AAAQsC,IAAAA;AAAR,MAAsBM,KAA5B;AAEA,sBACE,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAElD,MAAM,CAACG;AAApB,kBACE,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAEH,MAAM,CAACM;AAApB,KAA4BA,KAA5B,CADF,EAEG,CAACsC,UAAD,IAAeA,UAAU,CAACO,MAAX,KAAsB,CAArC,gBACC,oBAAC,QAAD,OADD,gBAGC,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAE,CAAC,GAAGP,UAAJ,EAAgB;AAACL,MAAAA,YAAY,EAAE;AAAf,KAAhB;AAAd,IALJ,CADF;AAUD,CAbD;;AAeAU,MAAM,CAACf,SAAP,2CAAmBkB,sBAAUlB,SAA7B,M,CAEA;;eAEee,M","sourcesContent":["import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport {View, FlatList, Pressable, StyleSheet, Text} from 'react-native';\nimport {NovaCompositionNavigationArrowRight as ArrowRight} from '@coorpacademy/nova-icons';\nimport SkillsWeb, {ListSkillsPropTypes, NoSkillsPropTypes} from '../../../organism/review-skills';\n\n// import theme from '../../../modules/theme';\n// import translations from '../../../translations';\n// import {HEADER_HEIGHT} from '../../../app-shared/components/header-v2';\n// import noSkillsImage from '../../../assets/images/revision-no-skills.png';\n// import Touchable from '../../../app-shared/components/touchable';\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n    padding: 20\n    // paddingTop: HEADER_HEIGHT + 20,\n    // backgroundColor: theme.colors.white\n  },\n  title: {\n    // fontSize: theme.fontSize.xlarge,\n    // fontWeight: theme.fontWeight.bold,\n    lineHeight: 28\n    // color: theme.colors.text.primary,\n    // marginBottom: theme.spacing.base,\n    // marginTop: theme.spacing.small\n  },\n  subtitle: {\n    // fontSize: theme.fontSize.xlarge,\n    // color: theme.colors.text.primary,\n    // marginBottom: theme.spacing.tiny\n  },\n  text: {\n    fontSize: 16,\n    lineHeight: 22,\n    // color: theme.colors.text.primary,\n    opacity: 0.7\n    // marginBottom: theme.spacing.base\n  },\n  noSkillsImage: {\n    flex: 1,\n    alignSelf: 'center',\n    width: 320,\n    height: 300\n  },\n  skills: {},\n  skill: {\n    display: 'flex',\n    flexDirection: 'row',\n    overflow: 'hidden',\n    alignItems: 'center',\n    height: 118,\n    borderRadius: 8\n    // backgroundColor: theme.colors.gray.lighter,\n    // marginTop: theme.spacing.micro,\n    // marginBottom: theme.spacing.micro,\n    // padding: theme.spacing.base\n  },\n  skillTexts: {\n    flex: 1,\n    flexDirection: 'column'\n  },\n  skillTitle: {\n    fontSize: 18,\n    fontWeight: '600',\n    lineHeight: 22\n    // color: theme.colors.text.primary,\n    // marginBottom: theme.spacing.tiny\n  },\n  skillInfo: {\n    fontSize: 12,\n    lineHeight: 16\n    // color: theme.colors.gray.medium\n  },\n  extraSpace: {\n    height: 100\n  }\n});\n\n// -----------------------------------------------------------------------------\n\nconst onSelectSkill = title => () => {\n  // eslint-disable-next-line no-console\n  console.log('pressed on', {title});\n};\n\nconst ExtraSpace = () => <View style={styles.extraSpace} />;\n\nconst Skill = ({title, info}) => (\n  <Pressable style={styles.skill} onPress={onSelectSkill(title)}>\n    <View style={styles.skillTexts}>\n      <Text style={styles.skillTitle}>{title}</Text>\n      <Text style={styles.skillInfo}>{info}</Text>\n    </View>\n    <ArrowRight color=\"#ededed\" height={20} width={20} />\n  </Pressable>\n);\n\nSkill.propTypes = {\n  title: PropTypes.string,\n  info: PropTypes.string\n};\n\n// -----------------------------------------------------------------------------\n\nconst Item = ({item: {title, info, isExtraSpace = false}}) =>\n  isExtraSpace ? <ExtraSpace /> : <Skill title={title} info={info} />;\n\nconst List = ({skills}) => (\n  <FlatList contentContainerStyle={styles.skills} data={skills} renderItem={Item} />\n);\n\nItem.propTypes = {\n  item: PropTypes.shape({\n    title: PropTypes.string,\n    info: PropTypes.string,\n    isExtraSpace: PropTypes.bool\n  })\n};\n\nList.propTypes = {\n  skills: ListSkillsPropTypes.listSkills\n};\n\n// -----------------------------------------------------------------------------\n\n/*\n  title: translations.revision.home.noSkills\n  text: translations.revision.home.noSkillsDetails\n  image: use web svg\n  <ImageBackground source={noSkillsImage} style={styles.noSkillsImage} />\n*/\nconst NoSkills = ({titleNoSkills, textNoSkills}) => (\n  <>\n    <Text style={styles.subtitle}>{titleNoSkills}</Text>\n    <Text style={styles.text}>{textNoSkills}</Text>\n  </>\n);\n\nNoSkills.propTypes = NoSkillsPropTypes;\n\n// -----------------------------------------------------------------------------\n\n//  title --> translations.revision.home.title\nconst Skills = props => {\n  const {title, listSkills} = props;\n\n  return (\n    <View style={styles.container}>\n      <Text style={styles.title}>{title}</Text>\n      {!listSkills || listSkills.length === 0 ? (\n        <NoSkills />\n      ) : (\n        <List skills={[...listSkills, {isExtraSpace: true}]} />\n      )}\n    </View>\n  );\n};\n\nSkills.propTypes = SkillsWeb.propTypes;\n\n// -----------------------------------------------------------------------------\n\nexport default Skills;\n"],"file":"index.native.js"}

package/lib/template/app-review/skills/stories.js

@@ -0,0 +1,16 @@
+// import * as React from 'react';
+// import {storiesOf} from '@storybook/react-native';
+// import RevisionHome from './revision-home';
+// const emptySkills: [] = [];
+// const skillsToRevise: {title: string; info: string}[] = [
+//   {title: 'Negotiation and powers of persuasion', info: '75 questions to revise'},
+//   {title: 'Negotiation and powers of persuasion', info: '75 questions to revise'},
+//   {title: 'Negotiation and powers of persuasion', info: '75 questions to revise'},
+//   {title: 'Negotiation and powers of persuasion', info: '75 questions to revise'},
+//   {title: 'Creativity and innovation', info: '75 questions to revise'}
+// ];
+// storiesOf('RevisionHome', module)
+//   .add('No skills', () => <RevisionHome skillsToRevise={emptySkills} />)
+//   .add('Few skills', () => <RevisionHome skillsToRevise={skillsToRevise} />);
+"use strict";
+//# sourceMappingURL=stories.js.map

package/lib/template/app-review/skills/stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/template/app-review/skills/stories.tsx"],"names":[],"mappings":"AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA","sourcesContent":["// import * as React from 'react';\n// import {storiesOf} from '@storybook/react-native';\n// import RevisionHome from './revision-home';\n\n// const emptySkills: [] = [];\n// const skillsToRevise: {title: string; info: string}[] = [\n//   {title: 'Negotiation and powers of persuasion', info: '75 questions to revise'},\n//   {title: 'Negotiation and powers of persuasion', info: '75 questions to revise'},\n//   {title: 'Negotiation and powers of persuasion', info: '75 questions to revise'},\n//   {title: 'Negotiation and powers of persuasion', info: '75 questions to revise'},\n//   {title: 'Creativity and innovation', info: '75 questions to revise'}\n// ];\n\n// storiesOf('RevisionHome', module)\n//   .add('No skills', () => <RevisionHome skillsToRevise={emptySkills} />)\n//   .add('Few skills', () => <RevisionHome skillsToRevise={skillsToRevise} />);\n"],"file":"stories.js"}

package/lib/template/app-review/slides/index.js

@@ -0,0 +1,367 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = exports.HIGHEST_INDEX = exports.TOTAL_SLIDES_STACK = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _get = _interopRequireDefault(require("lodash/fp/get"));
+
+var _getOr = _interopRequireDefault(require("lodash/fp/getOr"));
+
+var _isNil = _interopRequireDefault(require("lodash/fp/isNil"));
+
+var _reviewHeaderStepItem = require("../../../atom/review-header-step-item");
+
+var _reviewBackground = _interopRequireDefault(require("../../../atom/review-background"));
+
+var _reviewCongrats = _interopRequireDefault(require("../../../organism/review-congrats"));
+
+var _reviewHeader = _interopRequireDefault(require("../../../organism/review-header"));
+
+var _reviewCorrectionPopin = _interopRequireDefault(require("../../../molecule/review-correction-popin"));
+
+var _answer = _interopRequireDefault(require("../../../molecule/answer"));
+
+var _buttonLink = _interopRequireDefault(require("../../../atom/button-link"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+var _propTypes = require("./prop-types");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const stylesByPosition = {
+  0: _style.default.position0,
+  1: _style.default.position1,
+  2: _style.default.position2,
+  3: _style.default.position3,
+  4: _style.default.position4
+};
+const TOTAL_SLIDES_STACK = 5;
+exports.TOTAL_SLIDES_STACK = TOTAL_SLIDES_STACK;
+const HIGHEST_INDEX = TOTAL_SLIDES_STACK - 1;
+exports.HIGHEST_INDEX = HIGHEST_INDEX;
+
+const getSlideAnimation = (action, position, hidden) => {
+  switch (action) {
+    case 'unstack':
+      return _style.default.slideOutHideAndIn;
+
+    case 'restack':
+      return _style.default.slideOutAndIn;
+
+    default:
+      return hidden ? _style.default.hiddenSlide : stylesByPosition[position];
+  }
+};
+
+const Slide = ({
+  slideNumber,
+  slidesState,
+  primarySkinColor,
+  validate,
+  validateSlide,
+  finishedSlides,
+  updateSlidesOnValidation,
+  updateSlidesOnNext,
+  updateReviewStatus,
+  updateStepItemsOnValidation,
+  updateStepItemsOnNext,
+  updateFinishedSlides,
+  slideValidationResult,
+  correctionPopinProps = {}
+}) => {
+  const result = (0, _get.default)('result', slideValidationResult);
+  const exitNode = (0, _get.default)('exitNode', slideValidationResult);
+  const nextSlide = (0, _get.default)('nextSlide', slideValidationResult); // const validatedSlideNumber = get('slideNumber', slideValidationResult);
+
+  const {
+    hidden,
+    endReview,
+    position,
+    animationType,
+    validationResult,
+    questionText,
+    answerUI
+  } = slidesState.get(slideNumber);
+  const {
+    label: validateLabel
+  } = validate;
+  const validateButtonProps = {
+    customStyle: {
+      backgroundColor: primarySkinColor
+    },
+
+    /*
+      slide validation action, this will trigger the correction popin but will not trigger any
+      animations unless the endReview signal is received (all slides will disappear),
+      if there is a nextSlide content, it will be loaded here
+      if it is the last slide and the content needs to be different, then that update will
+      be handled on the next slide logic but the content will be carried from here.
+    */
+    onClick: async () => {
+      // result: 'success' | 'failure'
+      // endReview based on nextContent ref exit node values: 'successExitNode' : 'failExitNode'
+      await validateSlide();
+      updateSlidesOnValidation({
+        slideNumber,
+        newSlideContent: {
+          hidden,
+          position,
+          validationResult: result,
+          endReview: !!exitNode
+        },
+        numberOfFinishedSlides: finishedSlides.size,
+        nextSlide
+      });
+      updateStepItemsOnValidation({
+        stepNumber: slideNumber,
+        icon: result === 'success' ? _reviewHeaderStepItem.ICON_VALUES.right : _reviewHeaderStepItem.ICON_VALUES.wrong
+      });
+      if (result === 'success') updateFinishedSlides([slideNumber, true]);
+
+      if (endReview) {
+        updateReviewStatus('finished');
+      }
+    },
+    'aria-label': validateLabel,
+    label: validateLabel,
+    'data-name': `slide-validate-button-${slideNumber}`,
+    className: _style.default.validateButton,
+    disabled: !(0, _isNil.default)(validationResult)
+  };
+  const {
+    klf = {},
+    information = {
+      label: '',
+      message: ''
+    },
+    next,
+    successLabel = '',
+    failureLabel = ''
+  } = correctionPopinProps;
+  const _correctionPopinProps = {
+    next: {
+      /*
+        next slide action, this will trigger the slides animations
+        if it is the last slide AND the content needs to be different, then that update
+        of the content will be handled here (and in the validate as it happens normally )
+        from the content carried from the validate action.
+      */
+      onClick: () => {
+        updateSlidesOnNext({
+          slideNumber,
+          newSlideContent: {
+            hidden: validationResult === 'success',
+            position: HIGHEST_INDEX - finishedSlides.size,
+            animationType: validationResult === 'success' ? 'unstack' : 'restack',
+            validationResult,
+            endReview: !!exitNode,
+            answerUI,
+            questionText
+          },
+          numberOfFinishedSlides: finishedSlides.size
+        });
+        updateStepItemsOnNext({
+          stepNumber: slideNumber,
+          finishedSlides,
+          current: finishedSlides.size === HIGHEST_INDEX && validationResult !== 'success'
+        });
+
+        if (finishedSlides.size === TOTAL_SLIDES_STACK) {
+          updateReviewStatus('finished');
+        }
+      },
+      label: next && next.label,
+      'data-name': `next-question-button-${slideNumber}`,
+      'aria-label': next && next['aria-label']
+    },
+    klf,
+    information,
+    type: validationResult === 'success' ? 'right' : 'wrong',
+    resultLabel: validationResult === 'success' ? successLabel : failureLabel
+  };
+  const questionOrigin = 'From "Master Design Thinking to become more agile" course';
+  const answerProps = (0, _get.default)(['model', 'choices'], answerUI) ? _extends(_extends({}, answerUI), {}, {
+    model: _extends(_extends({}, answerUI.model), {}, {
+      answers: answerUI.model.choices
+    })
+  }) : answerUI;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    key: `slide-${slideNumber}`,
+    "data-name": `slide-${slideNumber}`,
+    className: (0, _classnames.default)(_style.default.slideBase, getSlideAnimation(animationType, position, hidden), endReview ? _style.default.endReview : null)
+  }, answerUI && questionText ? /*#__PURE__*/_react.default.createElement("div", {
+    key: "content-container",
+    className: _style.default.slideContentContainer
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    key: "from-course",
+    className: _style.default.questionOrigin
+  }, questionOrigin), /*#__PURE__*/_react.default.createElement("div", {
+    key: "title",
+    className: _style.default.question
+  }, questionText), /*#__PURE__*/_react.default.createElement("div", {
+    key: "help",
+    className: _style.default.help
+  }, answerUI.help), /*#__PURE__*/_react.default.createElement("div", {
+    key: "answer-container",
+    className: _style.default.answerContainer
+  }, /*#__PURE__*/_react.default.createElement(_answer.default, _extends({}, answerProps, {
+    key: "answer"
+  })))) : null, /*#__PURE__*/_react.default.createElement("div", {
+    key: "button-wrapper",
+    className: _style.default.validateButtonWrapper
+  }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, validateButtonProps)), /*#__PURE__*/_react.default.createElement("div", {
+    className: validationResult ? _style.default.correctionPopinWrapper : _style.default.hiddenCorrectionPopinWrapper,
+    style: _extends({}, finishedSlides.size !== HIGHEST_INDEX && !validationResult && {
+      display: 'none'
+    })
+  }, /*#__PURE__*/_react.default.createElement(_reviewCorrectionPopin.default, _correctionPopinProps)));
+};
+
+Slide.propTypes = process.env.NODE_ENV !== "production" ? _propTypes.SlidePropTypes : {};
+
+const StackedSlides = ({
+  slides,
+  primarySkinColor,
+  validate,
+  validateSlide,
+  finishedSlides,
+  updateSlidesOnValidation,
+  updateSlidesOnNext,
+  updateReviewStatus,
+  updateStepItemsOnValidation,
+  updateStepItemsOnNext,
+  updateFinishedSlides,
+  slideValidationResult,
+  correctionPopinProps
+}) => {
+  const stackedSlides = []; // eslint-disable-next-line fp/no-loops
+
+  for (let slideNumber = 0; slideNumber < TOTAL_SLIDES_STACK; slideNumber++) {
+    const slide = /*#__PURE__*/_react.default.createElement(Slide, _extends({
+      slideNumber,
+      slides,
+      primarySkinColor,
+      validate,
+      validateSlide,
+      finishedSlides,
+      updateSlidesOnValidation,
+      updateSlidesOnNext,
+      updateReviewStatus,
+      updateStepItemsOnValidation,
+      updateStepItemsOnNext,
+      updateFinishedSlides,
+      slideValidationResult,
+      correctionPopinProps
+    }, {
+      key: slideNumber
+    }));
+
+    stackedSlides.push(slide);
+  }
+
+  return stackedSlides;
+};
+
+StackedSlides.propTypes = process.env.NODE_ENV !== "production" ? _propTypes.StackedSlidesPropTypes : {};
+
+const SlidesReview = ({
+  headerProps,
+  reviewBackgroundAriaLabel,
+  validate,
+  correctionPopinProps,
+  slides,
+  finishedSlides,
+  stepItems,
+  reviewStatus,
+  congratsProps,
+  validateSlide,
+  updateSlidesOnValidation,
+  updateSlidesOnNext,
+  updateReviewStatus,
+  updateStepItemsOnValidation,
+  updateStepItemsOnNext,
+  updateFinishedSlides,
+  slideValidationResult = {}
+}, context) => {
+  const {
+    skin
+  } = context;
+  const primarySkinColor = (0, _react.useMemo)(() => (0, _getOr.default)('#00B0FF', 'common.primary', skin), [skin]);
+  /*
+    ||-------> the slides have an slightly longer lifespan than the "ongoing" review State,
+    after reviewState changes to "finished" the slides don't have to unmount until the last
+    slide-out animation is finished, the slides have to be unmounted to be RGAA complaint
+    (if they are only invisible but still mounted, then they will be found the assisting tools & clutter it)
+  */
+
+  const [shouldMountSlides, updateShouldMountSlides] = (0, _react.useState)(true);
+  (0, _react.useEffect)(() => {
+    if (reviewStatus === 'finished' || finishedSlides.size === TOTAL_SLIDES_STACK) {
+      setTimeout(() => updateShouldMountSlides(false), 2000);
+    }
+  }, [finishedSlides.size, reviewStatus, updateReviewStatus]); // ||-------> transform the step items state (Map structure) to an Array
+
+  const stepItemsArray = (0, _react.useMemo)(() => {
+    // eslint-disable-next-line unicorn/prefer-spread
+    return Array.from(stepItems.values());
+  }, [stepItems]);
+
+  const _headerProps = _extends(_extends({}, headerProps), {}, {
+    steps: stepItemsArray,
+    key: 'review-header',
+    hiddenSteps: reviewStatus !== 'ongoing'
+  });
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    key: "slides-revision-container",
+    "data-name": "slides-revision-container",
+    className: _style.default.slidesRevisionContainer
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    key: "player-background-container",
+    className: _style.default.playerBackground
+  }, /*#__PURE__*/_react.default.createElement(_reviewBackground.default, {
+    "aria-label": reviewBackgroundAriaLabel
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    key: "review-header-wrapper",
+    className: _style.default.reviewHeaderContainer
+  }, /*#__PURE__*/_react.default.createElement(_reviewHeader.default, _headerProps)), shouldMountSlides ? /*#__PURE__*/_react.default.createElement("div", {
+    key: "stacked-slides-container-y-overflow",
+    className: _style.default.stackedSlidesYAxisOverflowContainer
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    key: "stacked-slides-container",
+    "data-name": "stacked-slides-container",
+    className: _style.default.stackedSlidesContainer
+  }, /*#__PURE__*/_react.default.createElement(StackedSlides, {
+    slides,
+    primarySkinColor,
+    validate,
+    validateSlide,
+    finishedSlides,
+    updateSlidesOnValidation,
+    updateSlidesOnNext,
+    updateReviewStatus,
+    updateStepItemsOnValidation,
+    updateStepItemsOnNext,
+    updateFinishedSlides,
+    slideValidationResult,
+    correctionPopinProps
+  }))) : null, reviewStatus === 'finished' ? /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.congrats
+  }, /*#__PURE__*/_react.default.createElement(_reviewCongrats.default, congratsProps)) : null);
+};
+
+SlidesReview.propTypes = process.env.NODE_ENV !== "production" ? _propTypes.SlidesReviewPropTypes : {};
+var _default = SlidesReview;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/template/app-review/slides/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/template/app-review/slides/index.js"],"names":["stylesByPosition","style","position0","position1","position2","position3","position4","TOTAL_SLIDES_STACK","HIGHEST_INDEX","getSlideAnimation","action","position","hidden","slideOutHideAndIn","slideOutAndIn","hiddenSlide","Slide","slideNumber","slidesState","primarySkinColor","validate","validateSlide","finishedSlides","updateSlidesOnValidation","updateSlidesOnNext","updateReviewStatus","updateStepItemsOnValidation","updateStepItemsOnNext","updateFinishedSlides","slideValidationResult","correctionPopinProps","result","exitNode","nextSlide","endReview","animationType","validationResult","questionText","answerUI","get","label","validateLabel","validateButtonProps","customStyle","backgroundColor","onClick","newSlideContent","numberOfFinishedSlides","size","stepNumber","icon","ICON_VALUES","right","wrong","className","validateButton","disabled","klf","information","message","next","successLabel","failureLabel","_correctionPopinProps","current","type","resultLabel","questionOrigin","answerProps","model","answers","choices","slideBase","slideContentContainer","question","help","answerContainer","validateButtonWrapper","correctionPopinWrapper","hiddenCorrectionPopinWrapper","display","propTypes","SlidePropTypes","StackedSlides","slides","stackedSlides","slide","push","StackedSlidesPropTypes","SlidesReview","headerProps","reviewBackgroundAriaLabel","stepItems","reviewStatus","congratsProps","context","skin","shouldMountSlides","updateShouldMountSlides","setTimeout","stepItemsArray","Array","from","values","_headerProps","steps","key","hiddenSteps","slidesRevisionContainer","playerBackground","reviewHeaderContainer","stackedSlidesYAxisOverflowContainer","stackedSlidesContainer","congrats","SlidesReviewPropTypes"],"mappings":"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","sourcesContent":["import React, {useState, useMemo, useEffect} from 'react';\nimport classnames from 'classnames';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport isNil from 'lodash/fp/isNil';\nimport {ICON_VALUES} from '../../../atom/review-header-step-item';\nimport ReviewBackground from '../../../atom/review-background';\nimport ReviewCongrats from '../../../organism/review-congrats';\nimport ReviewHeader from '../../../organism/review-header';\nimport ReviewCorrectionPopin from '../../../molecule/review-correction-popin';\nimport Answer from '../../../molecule/answer';\nimport ButtonLink from '../../../atom/button-link';\nimport style from './style.css';\nimport {SlidesReviewPropTypes, SlidePropTypes, StackedSlidesPropTypes} from './prop-types';\n\nconst stylesByPosition = {\n  0: style.position0,\n  1: style.position1,\n  2: style.position2,\n  3: style.position3,\n  4: style.position4\n};\n\nexport const TOTAL_SLIDES_STACK = 5;\nexport const HIGHEST_INDEX = TOTAL_SLIDES_STACK - 1;\n\nconst getSlideAnimation = (action, position, hidden) => {\n  switch (action) {\n    case 'unstack':\n      return style.slideOutHideAndIn;\n    case 'restack':\n      return style.slideOutAndIn;\n    default:\n      return hidden ? style.hiddenSlide : stylesByPosition[position];\n  }\n};\n\nconst Slide = ({\n  slideNumber,\n  slidesState,\n  primarySkinColor,\n  validate,\n  validateSlide,\n  finishedSlides,\n  updateSlidesOnValidation,\n  updateSlidesOnNext,\n  updateReviewStatus,\n  updateStepItemsOnValidation,\n  updateStepItemsOnNext,\n  updateFinishedSlides,\n  slideValidationResult,\n  correctionPopinProps = {}\n}) => {\n  const result = get('result', slideValidationResult);\n  const exitNode = get('exitNode', slideValidationResult);\n  const nextSlide = get('nextSlide', slideValidationResult);\n  // const validatedSlideNumber = get('slideNumber', slideValidationResult);\n\n  const {\n    hidden,\n    endReview,\n    position,\n    animationType,\n    validationResult,\n    questionText,\n    answerUI\n  } = slidesState.get(slideNumber);\n\n  const {label: validateLabel} = validate;\n\n  const validateButtonProps = {\n    customStyle: {\n      backgroundColor: primarySkinColor\n    },\n    /*\n      slide validation action, this will trigger the correction popin but will not trigger any\n      animations unless the endReview signal is received (all slides will disappear),\n      if there is a nextSlide content, it will be loaded here\n      if it is the last slide and the content needs to be different, then that update will\n      be handled on the next slide logic but the content will be carried from here.\n    */\n    onClick: async () => {\n      // result: 'success' | 'failure'\n      // endReview based on nextContent ref exit node values: 'successExitNode' : 'failExitNode'\n      await validateSlide();\n      updateSlidesOnValidation({\n        slideNumber,\n        newSlideContent: {\n          hidden,\n          position,\n          validationResult: result,\n          endReview: !!exitNode\n        },\n        numberOfFinishedSlides: finishedSlides.size,\n        nextSlide\n      });\n      updateStepItemsOnValidation({\n        stepNumber: slideNumber,\n        icon: result === 'success' ? ICON_VALUES.right : ICON_VALUES.wrong\n      });\n      if (result === 'success') updateFinishedSlides([slideNumber, true]);\n      if (endReview) {\n        updateReviewStatus('finished');\n      }\n    },\n    'aria-label': validateLabel,\n    label: validateLabel,\n    'data-name': `slide-validate-button-${slideNumber}`,\n    className: style.validateButton,\n    disabled: !isNil(validationResult)\n  };\n\n  const {\n    klf = {},\n    information = {label: '', message: ''},\n    next,\n    successLabel = '',\n    failureLabel = ''\n  } = correctionPopinProps;\n\n  const _correctionPopinProps = {\n    next: {\n      /*\n        next slide action, this will trigger the slides animations\n        if it is the last slide AND the content needs to be different, then that update\n        of the content will be handled here (and in the validate as it happens normally )\n        from the content carried from the validate action.\n      */\n      onClick: () => {\n        updateSlidesOnNext({\n          slideNumber,\n          newSlideContent: {\n            hidden: validationResult === 'success',\n            position: HIGHEST_INDEX - finishedSlides.size,\n            animationType: validationResult === 'success' ? 'unstack' : 'restack',\n            validationResult,\n            endReview: !!exitNode,\n            answerUI,\n            questionText\n          },\n          numberOfFinishedSlides: finishedSlides.size\n        });\n        updateStepItemsOnNext({\n          stepNumber: slideNumber,\n          finishedSlides,\n          current: finishedSlides.size === HIGHEST_INDEX && validationResult !== 'success'\n        });\n        if (finishedSlides.size === TOTAL_SLIDES_STACK) {\n          updateReviewStatus('finished');\n        }\n      },\n      label: next && next.label,\n      'data-name': `next-question-button-${slideNumber}`,\n      'aria-label': next && next['aria-label']\n    },\n    klf,\n    information,\n    type: validationResult === 'success' ? 'right' : 'wrong',\n    resultLabel: validationResult === 'success' ? successLabel : failureLabel\n  };\n\n  const questionOrigin = 'From \"Master Design Thinking to become more agile\" course';\n  const answerProps = get(['model', 'choices'], answerUI)\n    ? {\n        ...answerUI,\n        model: {\n          ...answerUI.model,\n          answers: answerUI.model.choices\n        }\n      }\n    : answerUI;\n\n  return (\n    <div\n      key={`slide-${slideNumber}`}\n      data-name={`slide-${slideNumber}`}\n      className={classnames(\n        style.slideBase,\n        getSlideAnimation(animationType, position, hidden),\n        endReview ? style.endReview : null\n      )}\n    >\n      {answerUI && questionText ? (\n        <div key=\"content-container\" className={style.slideContentContainer}>\n          <div key=\"from-course\" className={style.questionOrigin}>\n            {questionOrigin}\n          </div>\n          <div key=\"title\" className={style.question}>\n            {questionText}\n          </div>\n          <div key=\"help\" className={style.help}>\n            {answerUI.help}\n          </div>\n          <div key=\"answer-container\" className={style.answerContainer}>\n            <Answer {...answerProps} key=\"answer\" />\n          </div>\n        </div>\n      ) : null}\n\n      <div key=\"button-wrapper\" className={style.validateButtonWrapper}>\n        <ButtonLink {...validateButtonProps} />\n      </div>\n      <div\n        className={\n          validationResult ? style.correctionPopinWrapper : style.hiddenCorrectionPopinWrapper\n        }\n        style={{\n          ...(finishedSlides.size !== HIGHEST_INDEX &&\n            !validationResult && {\n              display: 'none'\n            })\n        }}\n      >\n        <ReviewCorrectionPopin {..._correctionPopinProps} />\n      </div>\n    </div>\n  );\n};\n\nSlide.propTypes = SlidePropTypes;\n\nconst StackedSlides = ({\n  slides,\n  primarySkinColor,\n  validate,\n  validateSlide,\n  finishedSlides,\n  updateSlidesOnValidation,\n  updateSlidesOnNext,\n  updateReviewStatus,\n  updateStepItemsOnValidation,\n  updateStepItemsOnNext,\n  updateFinishedSlides,\n  slideValidationResult,\n  correctionPopinProps\n}) => {\n  const stackedSlides = [];\n  // eslint-disable-next-line fp/no-loops\n  for (let slideNumber = 0; slideNumber < TOTAL_SLIDES_STACK; slideNumber++) {\n    const slide = (\n      <Slide\n        {...{\n          slideNumber,\n          slides,\n          primarySkinColor,\n          validate,\n          validateSlide,\n          finishedSlides,\n          updateSlidesOnValidation,\n          updateSlidesOnNext,\n          updateReviewStatus,\n          updateStepItemsOnValidation,\n          updateStepItemsOnNext,\n          updateFinishedSlides,\n          slideValidationResult,\n          correctionPopinProps\n        }}\n        key={slideNumber}\n      />\n    );\n    stackedSlides.push(slide);\n  }\n\n  return stackedSlides;\n};\n\nStackedSlides.propTypes = StackedSlidesPropTypes;\n\nconst SlidesReview = (\n  {\n    headerProps,\n    reviewBackgroundAriaLabel,\n    validate,\n    correctionPopinProps,\n    slides,\n    finishedSlides,\n    stepItems,\n    reviewStatus,\n    congratsProps,\n    validateSlide,\n    updateSlidesOnValidation,\n    updateSlidesOnNext,\n    updateReviewStatus,\n    updateStepItemsOnValidation,\n    updateStepItemsOnNext,\n    updateFinishedSlides,\n    slideValidationResult = {}\n  },\n  context\n) => {\n  const {skin} = context;\n  const primarySkinColor = useMemo(() => getOr('#00B0FF', 'common.primary', skin), [skin]);\n\n  /*\n    ||-------> the slides have an slightly longer lifespan than the \"ongoing\" review State,\n    after reviewState changes to \"finished\" the slides don't have to unmount until the last\n    slide-out animation is finished, the slides have to be unmounted to be RGAA complaint\n    (if they are only invisible but still mounted, then they will be found the assisting tools & clutter it)\n  */\n  const [shouldMountSlides, updateShouldMountSlides] = useState(true);\n\n  useEffect(() => {\n    if (reviewStatus === 'finished' || finishedSlides.size === TOTAL_SLIDES_STACK) {\n      setTimeout(() => updateShouldMountSlides(false), 2000);\n    }\n  }, [finishedSlides.size, reviewStatus, updateReviewStatus]);\n\n  // ||-------> transform the step items state (Map structure) to an Array\n  const stepItemsArray = useMemo(() => {\n    // eslint-disable-next-line unicorn/prefer-spread\n    return Array.from(stepItems.values());\n  }, [stepItems]);\n\n  const _headerProps = {\n    ...headerProps,\n    steps: stepItemsArray,\n    key: 'review-header',\n    hiddenSteps: reviewStatus !== 'ongoing'\n  };\n\n  return (\n    <div\n      key=\"slides-revision-container\"\n      data-name=\"slides-revision-container\"\n      className={style.slidesRevisionContainer}\n    >\n      <div key=\"player-background-container\" className={style.playerBackground}>\n        <ReviewBackground aria-label={reviewBackgroundAriaLabel} />\n      </div>\n\n      <div key=\"review-header-wrapper\" className={style.reviewHeaderContainer}>\n        <ReviewHeader {..._headerProps} />\n      </div>\n\n      {shouldMountSlides ? (\n        <div\n          key=\"stacked-slides-container-y-overflow\"\n          className={style.stackedSlidesYAxisOverflowContainer}\n        >\n          <div\n            key=\"stacked-slides-container\"\n            data-name=\"stacked-slides-container\"\n            className={style.stackedSlidesContainer}\n          >\n            <StackedSlides\n              {...{\n                slides,\n                primarySkinColor,\n                validate,\n                validateSlide,\n                finishedSlides,\n                updateSlidesOnValidation,\n                updateSlidesOnNext,\n                updateReviewStatus,\n                updateStepItemsOnValidation,\n                updateStepItemsOnNext,\n                updateFinishedSlides,\n                slideValidationResult,\n                correctionPopinProps\n              }}\n            />\n          </div>\n        </div>\n      ) : null}\n\n      {reviewStatus === 'finished' ? (\n        <div className={style.congrats}>\n          <ReviewCongrats {...congratsProps} />\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nSlidesReview.propTypes = SlidesReviewPropTypes;\n\nexport default SlidesReview;\n"],"file":"index.js"}