@coorpacademy/components 10.19.1 → 10.19.2

package/es/template/slides-review/test/slides-review.js

@@ -0,0 +1,147 @@
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import browserEnv from 'browser-env';
+import test from 'ava';
+import React from 'react';
+import { render, fireEvent, act } from '@testing-library/react';
+import SlidesReview from '..';
+import AnswerQCMDrag from '../../../molecule/answer/test/fixtures/qcm-drag';
+import successFixture from './fixtures/success';
+import failureFixture from './fixtures/failure';
+import failOnceOnLastSlideFixture from './fixtures/only-once-on-last-slide';
+browserEnv({
+  pretendToBeVisual: true
+});
+
+const elementExists = foundElements => foundElements && foundElements[0];
+
+const sleep = msToSleep => new Promise(resolve => setTimeout(resolve, msToSleep));
+
+const waitForRevisionEndChanges = async () => {
+  await act(async () => {
+    await sleep(2500); // wait *just* a little longer than the timeout in the component
+  });
+};
+
+const qcmDrag = AnswerQCMDrag.props;
+const LIMIT = 5;
+
+const clickAllSlides = async (t, container, accumulator = 0) => {
+  if (accumulator === LIMIT) return; // last one needs to wait for more calculations && components updates
+
+  if (accumulator === 4) await act(async () => {
+    await sleep(2000);
+  });
+  const validateButton = container.querySelectorAll(`[data-name="slide-validate-button-${accumulator}"]`);
+  t.truthy(elementExists(validateButton));
+  await act(async () => {
+    await fireEvent.click(validateButton[0]);
+  });
+  const nextButton = container.querySelectorAll(`[data-name="next-question-button-${accumulator}"]`);
+  t.truthy(elementExists(nextButton));
+  await act(async () => {
+    await fireEvent.click(nextButton[0]);
+  });
+  await clickAllSlides(t, container, accumulator + 1);
+};
+
+test.serial('should validate all the slides && unmount the stacked slides after', async t => {
+  const {
+    container
+  } = render( /*#__PURE__*/React.createElement(SlidesReview, _extends({}, successFixture.props, {
+    key: 0
+  })));
+  const wrapper = container.querySelectorAll('[data-name="slides-revision-container"]');
+  t.truthy(wrapper);
+  let stackedSlidesContainer = container.querySelectorAll('[data-name="stacked-slides-container"]');
+  t.truthy(elementExists(stackedSlidesContainer));
+  await clickAllSlides(t, container);
+  await waitForRevisionEndChanges();
+  stackedSlidesContainer = container.querySelectorAll('[data-name="stacked-slides-container"]');
+  t.falsy(elementExists(stackedSlidesContainer));
+  t.pass();
+});
+test.serial('should validate all the slides except the last one, retry and pass', async t => {
+  const {
+    container
+  } = render( /*#__PURE__*/React.createElement(SlidesReview, _extends({}, failOnceOnLastSlideFixture.props, {
+    key: 1
+  })));
+  const wrapper = container.querySelectorAll('[data-name="slides-revision-container"]');
+  t.truthy(wrapper);
+  const stackedSlidesContainer = container.querySelectorAll('[data-name="stacked-slides-container"]');
+  t.truthy(elementExists(stackedSlidesContainer)); // loop once
+
+  await clickAllSlides(t, container); // fail the first slide again (the other slides are passed)
+
+  const validateButton = container.querySelectorAll('[data-name="slide-validate-button-0"]');
+  t.truthy(elementExists(validateButton));
+  await act(async () => {
+    await fireEvent.click(validateButton[0]);
+  });
+  t.pass();
+});
+test.serial('should fail all the slides && still find the stacked slides after', async t => {
+  const {
+    container
+  } = render( /*#__PURE__*/React.createElement(SlidesReview, _extends({}, failureFixture.props, {
+    key: 2
+  })));
+  const wrapper = container.querySelectorAll('[data-name="slides-revision-container"]');
+  t.truthy(wrapper);
+  let stackedSlidesContainer = container.querySelectorAll('[data-name="stacked-slides-container"]');
+  t.truthy(elementExists(stackedSlidesContainer)); // loop once
+
+  await clickAllSlides(t, container); // fail the first slide again (all the other slides are also on fail state)
+
+  const validateButton = container.querySelectorAll('[data-name="slide-validate-button-0"]');
+  t.truthy(elementExists(validateButton));
+  await act(async () => {
+    await fireEvent.click(validateButton[0]);
+  });
+  stackedSlidesContainer = container.querySelectorAll('[data-name="stacked-slides-container"]');
+  t.truthy(elementExists(stackedSlidesContainer));
+  t.pass();
+});
+test.serial('should end Revision on signal && unmount the stacked slides after', async t => {
+  t.plan(6);
+
+  const onValidateClick = () => {
+    t.pass();
+    return Promise.resolve({
+      validationResult: 'failure',
+      nextSlide: {
+        question: 'Other question?',
+        answer: qcmDrag
+      },
+      endReview: true
+    });
+  };
+
+  const props = _extends(_extends({}, failureFixture.props), {}, {
+    validate: {
+      label: failureFixture.props.validate.label,
+      onClick: onValidateClick
+    }
+  });
+
+  const {
+    container
+  } = render( /*#__PURE__*/React.createElement(SlidesReview, _extends({}, props, {
+    key: 3
+  })));
+  const wrapper = container.querySelectorAll('[data-name="slides-revision-container"]');
+  t.truthy(wrapper);
+  let stackedSlidesContainer = container.querySelectorAll('[data-name="stacked-slides-container"]');
+  t.truthy(elementExists(stackedSlidesContainer));
+  const validateButton = container.querySelectorAll('[data-name="slide-validate-button-0"]');
+  t.truthy(elementExists(validateButton));
+  await act(async () => {
+    await fireEvent.click(validateButton[0]);
+  });
+  await waitForRevisionEndChanges();
+  stackedSlidesContainer = container.querySelectorAll('[data-name="stacked-slides-container"]');
+  t.falsy(elementExists(stackedSlidesContainer));
+  t.pass();
+});
+//# sourceMappingURL=slides-review.js.map

package/es/template/slides-review/test/slides-review.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/template/slides-review/test/slides-review.js"],"names":["browserEnv","test","React","render","fireEvent","act","SlidesReview","AnswerQCMDrag","successFixture","failureFixture","failOnceOnLastSlideFixture","pretendToBeVisual","elementExists","foundElements","sleep","msToSleep","Promise","resolve","setTimeout","waitForRevisionEndChanges","qcmDrag","props","LIMIT","clickAllSlides","t","container","accumulator","validateButton","querySelectorAll","truthy","click","nextButton","serial","wrapper","stackedSlidesContainer","falsy","pass","plan","onValidateClick","validationResult","nextSlide","question","answer","endReview","validate","label","onClick"],"mappings":"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","sourcesContent":["import browserEnv from 'browser-env';\nimport test from 'ava';\nimport React from 'react';\nimport {render, fireEvent, act} from '@testing-library/react';\nimport SlidesReview from '..';\nimport AnswerQCMDrag from '../../../molecule/answer/test/fixtures/qcm-drag';\nimport successFixture from './fixtures/success';\nimport failureFixture from './fixtures/failure';\nimport failOnceOnLastSlideFixture from './fixtures/only-once-on-last-slide';\n\nbrowserEnv({pretendToBeVisual: true});\n\nconst elementExists = foundElements => foundElements && foundElements[0];\n\nconst sleep = msToSleep => new Promise(resolve => setTimeout(resolve, msToSleep));\n\nconst waitForRevisionEndChanges = async () => {\n  await act(async () => {\n    await sleep(2500); // wait *just* a little longer than the timeout in the component\n  });\n};\n\nconst qcmDrag = AnswerQCMDrag.props;\n\nconst LIMIT = 5;\n\nconst clickAllSlides = async (t, container, accumulator = 0) => {\n  if (accumulator === LIMIT) return;\n\n  // last one needs to wait for more calculations && components updates\n  if (accumulator === 4)\n    await act(async () => {\n      await sleep(2000);\n    });\n\n  const validateButton = container.querySelectorAll(\n    `[data-name=\"slide-validate-button-${accumulator}\"]`\n  );\n  t.truthy(elementExists(validateButton));\n\n  await act(async () => {\n    await fireEvent.click(validateButton[0]);\n  });\n\n  const nextButton = container.querySelectorAll(\n    `[data-name=\"next-question-button-${accumulator}\"]`\n  );\n  t.truthy(elementExists(nextButton));\n\n  await act(async () => {\n    await fireEvent.click(nextButton[0]);\n  });\n\n  await clickAllSlides(t, container, accumulator + 1);\n};\n\ntest.serial('should validate all the slides && unmount the stacked slides after', async t => {\n  const {container} = render(<SlidesReview {...successFixture.props} key={0} />);\n\n  const wrapper = container.querySelectorAll('[data-name=\"slides-revision-container\"]');\n  t.truthy(wrapper);\n\n  let stackedSlidesContainer = container.querySelectorAll('[data-name=\"stacked-slides-container\"]');\n  t.truthy(elementExists(stackedSlidesContainer));\n\n  await clickAllSlides(t, container);\n\n  await waitForRevisionEndChanges();\n\n  stackedSlidesContainer = container.querySelectorAll('[data-name=\"stacked-slides-container\"]');\n  t.falsy(elementExists(stackedSlidesContainer));\n\n  t.pass();\n});\n\ntest.serial('should validate all the slides except the last one, retry and pass', async t => {\n  const {container} = render(<SlidesReview {...failOnceOnLastSlideFixture.props} key={1} />);\n\n  const wrapper = container.querySelectorAll('[data-name=\"slides-revision-container\"]');\n  t.truthy(wrapper);\n\n  const stackedSlidesContainer = container.querySelectorAll(\n    '[data-name=\"stacked-slides-container\"]'\n  );\n  t.truthy(elementExists(stackedSlidesContainer));\n\n  // loop once\n  await clickAllSlides(t, container);\n\n  // fail the first slide again (the other slides are passed)\n  const validateButton = container.querySelectorAll('[data-name=\"slide-validate-button-0\"]');\n  t.truthy(elementExists(validateButton));\n\n  await act(async () => {\n    await fireEvent.click(validateButton[0]);\n  });\n\n  t.pass();\n});\n\ntest.serial('should fail all the slides && still find the stacked slides after', async t => {\n  const {container} = render(<SlidesReview {...failureFixture.props} key={2} />);\n\n  const wrapper = container.querySelectorAll('[data-name=\"slides-revision-container\"]');\n  t.truthy(wrapper);\n\n  let stackedSlidesContainer = container.querySelectorAll('[data-name=\"stacked-slides-container\"]');\n  t.truthy(elementExists(stackedSlidesContainer));\n\n  // loop once\n  await clickAllSlides(t, container);\n\n  // fail the first slide again (all the other slides are also on fail state)\n  const validateButton = container.querySelectorAll('[data-name=\"slide-validate-button-0\"]');\n  t.truthy(elementExists(validateButton));\n\n  await act(async () => {\n    await fireEvent.click(validateButton[0]);\n  });\n\n  stackedSlidesContainer = container.querySelectorAll('[data-name=\"stacked-slides-container\"]');\n  t.truthy(elementExists(stackedSlidesContainer));\n\n  t.pass();\n});\n\ntest.serial('should end Revision on signal && unmount the stacked slides after', async t => {\n  t.plan(6);\n  const onValidateClick = () => {\n    t.pass();\n    return Promise.resolve({\n      validationResult: 'failure',\n      nextSlide: {question: 'Other question?', answer: qcmDrag},\n      endReview: true\n    });\n  };\n\n  const props = {\n    ...failureFixture.props,\n    validate: {\n      label: failureFixture.props.validate.label,\n      onClick: onValidateClick\n    }\n  };\n\n  const {container} = render(<SlidesReview {...props} key={3} />);\n\n  const wrapper = container.querySelectorAll('[data-name=\"slides-revision-container\"]');\n  t.truthy(wrapper);\n\n  let stackedSlidesContainer = container.querySelectorAll('[data-name=\"stacked-slides-container\"]');\n  t.truthy(elementExists(stackedSlidesContainer));\n\n  const validateButton = container.querySelectorAll('[data-name=\"slide-validate-button-0\"]');\n  t.truthy(elementExists(validateButton));\n\n  await act(async () => {\n    await fireEvent.click(validateButton[0]);\n  });\n\n  await waitForRevisionEndChanges();\n\n  stackedSlidesContainer = container.querySelectorAll('[data-name=\"stacked-slides-container\"]');\n  t.falsy(elementExists(stackedSlidesContainer));\n\n  t.pass();\n});\n"],"file":"slides-review.js"}

package/lib/atom/lottie-wrapper/index.js

@@ -60,7 +60,7 @@ const fetchAndLoadAnimation = async (_lottie, _fetch, animationSrc, containerRef
   });
   const animationData = await fetchResult.json();
 
-  const animation = _lottie.loadAnimation({
+  const animation = _lottie.loadAnimation && _lottie.loadAnimation({
     container: containerRef.current,
     // the dom element that will contain the animation
     renderer: 'svg',

package/lib/atom/lottie-wrapper/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/atom/lottie-wrapper/index.js"],"names":["ANIMATION_CONTROL","play","pause","stop","loading","isIE11","window","userAgent","hasMsCrypto","hasRevision","hasTrident","fetchAndLoadAnimation","_lottie","_fetch","animationSrc","containerRef","loop","animationClassnames","hideOnTransparent","autoplay","animationUrl","URL","toString","fetchResult","headers","animationData","json","animation","loadAnimation","container","current","renderer","rendererSettings","className","preserveAspectRatio","LottieWrapper","props","dataName","ariaLabel","width","height","ie11ImageBackup","backupImageClassName","animationControl","animationClassName","animationItem","setAnimationItem","isAnimationVisible","setIsAnimationVisible","_isIE11","wrapperClassName","style","lottieContainer","lottieAnimationClassName","ie11BackupImageClassName","backupImage","lottie","unfetch","destroy","name","maxWidth","maxHeight","opacity","transition","propTypes","PropTypes","string","isRequired","bool","shape","number","oneOf"],"mappings":"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","sourcesContent":["import React, {useMemo, useRef, useEffect, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport lottie from 'lottie-web';\nimport get from 'lodash/fp/get';\nimport has from 'lodash/fp/has';\nimport includes from 'lodash/fp/includes';\nimport keys from 'lodash/fp/keys';\nimport omit from 'lodash/fp/omit';\nimport unfetch from 'isomorphic-unfetch';\nimport style from './style.css';\n\nexport const ANIMATION_CONTROL = {\n  play: 'play',\n  pause: 'pause',\n  stop: 'stop',\n  loading: 'loading'\n};\n\nconst isIE11 = () => {\n  if (typeof window === 'undefined') return;\n  const userAgent = get('navigator.userAgent', window);\n  const hasMsCrypto = has('msCrypto', window);\n  const hasRevision = includes('rv:', userAgent);\n  const hasTrident = includes('Trident/', userAgent);\n\n  return hasMsCrypto || (hasRevision && hasTrident);\n};\n\nexport const fetchAndLoadAnimation = async (\n  _lottie,\n  _fetch,\n  animationSrc,\n  containerRef,\n  loop,\n  animationClassnames,\n  hideOnTransparent,\n  autoplay\n) => {\n  const animationUrl = new URL(animationSrc).toString();\n  const fetchResult = await _fetch(animationUrl, {\n    headers: {\n      'X-Requested-With': 'XMLHttpRequest',\n      'Content-Type': 'application/json'\n    }\n  });\n\n  const animationData = await fetchResult.json();\n\n  const animation = _lottie.loadAnimation({\n    container: containerRef.current, // the dom element that will contain the animation\n    renderer: 'svg',\n    autoplay,\n    loop,\n    animationData,\n    rendererSettings: {\n      className: animationClassnames,\n      hideOnTransparent,\n      preserveAspectRatio: 'xMidYMid meet' // same options as a preserveAspectRatio prop\n    }\n  });\n  return animation;\n};\n\nconst LottieWrapper = props => {\n  const {\n    className,\n    'data-name': dataName,\n    'aria-label': ariaLabel,\n    animationSrc,\n    loop = false,\n    rendererSettings = {},\n    width,\n    height,\n    ie11ImageBackup,\n    backupImageClassName,\n    autoplay = true,\n    animationControl\n  } = props;\n\n  const {className: animationClassName, hideOnTransparent = true} = rendererSettings;\n\n  const containerRef = useRef(null);\n\n  // lottie's animation instance\n  const [animationItem, setAnimationItem] = useState(null);\n\n  const [isAnimationVisible, setIsAnimationVisible] = useState(autoplay);\n\n  const _isIE11 = useMemo(() => isIE11(), []);\n\n  const wrapperClassName = useMemo(() => classnames(className, style.lottieContainer), [className]);\n\n  const lottieAnimationClassName = useMemo(() => classnames(animationClassName, style.animation), [\n    animationClassName\n  ]);\n\n  const ie11BackupImageClassName = useMemo(\n    () => classnames(backupImageClassName, style.backupImage),\n    [backupImageClassName]\n  );\n\n  useEffect(() => {\n    // enzyme does not handle well the state update after an async useEffect in tests\n    // to remove when the migration towards @testing-library/react is done\n    /* istanbul ignore next */\n    if (includes(animationControl, keys(omit('loading', ANIMATION_CONTROL))) && !autoplay) {\n      setIsAnimationVisible(true);\n      if (animationItem) animationItem[animationControl]();\n      if (animationControl === ANIMATION_CONTROL.stop) setIsAnimationVisible(false);\n    }\n  }, [animationControl, animationItem, autoplay]);\n\n  useEffect(() => {\n    const loadAnimation = async () => {\n      if (!_isIE11 && !animationItem) {\n        /* istanbul ignore else */\n        if (typeof window !== 'undefined') {\n          window.lottie = lottie;\n        }\n        const animation = await fetchAndLoadAnimation(\n          lottie,\n          unfetch,\n          animationSrc,\n          containerRef,\n          loop,\n          lottieAnimationClassName,\n          hideOnTransparent,\n          autoplay\n        );\n\n        /* istanbul ignore next */\n        setAnimationItem(animation);\n      }\n    };\n\n    loadAnimation();\n    return () => animationItem && /* istanbul ignore next */ lottie.destroy(animationItem.name);\n  }, [\n    lottieAnimationClassName,\n    containerRef,\n    hideOnTransparent,\n    loop,\n    animationSrc,\n    _isIE11,\n    animationItem,\n    autoplay\n  ]);\n\n  return (\n    <div\n      ref={containerRef}\n      aria-label={ariaLabel}\n      data-name={dataName}\n      className={wrapperClassName}\n      style={{\n        ...(width && {\n          width: `${width}px`,\n          maxWidth: `${width}px`\n        }),\n        ...(height && {\n          height: `${height}px`,\n          maxHeight: `${height}px`\n        }),\n        opacity: isAnimationVisible ? 1 : 0,\n        transition: 'opacity 0.25s ease-in'\n      }}\n    >\n      {_isIE11 ? (\n        <img\n          src={ie11ImageBackup}\n          className={ie11BackupImageClassName}\n          data-name=\"ie11-backup-image\"\n        />\n      ) : null}\n    </div>\n  );\n};\n\nLottieWrapper.propTypes = {\n  'aria-label': PropTypes.string.isRequired,\n  'data-name': PropTypes.string,\n  animationSrc: PropTypes.string.isRequired,\n  loop: PropTypes.bool,\n  rendererSettings: PropTypes.shape({\n    hideOnTransparent: PropTypes.bool,\n    className: PropTypes.string\n  }),\n  height: PropTypes.number,\n  width: PropTypes.number,\n  className: PropTypes.string,\n  ie11ImageBackup: PropTypes.string.isRequired,\n  backupImageClassName: PropTypes.string,\n  autoplay: PropTypes.bool,\n  animationControl: PropTypes.oneOf(keys(ANIMATION_CONTROL))\n};\n\nexport default LottieWrapper;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/atom/lottie-wrapper/index.js"],"names":["ANIMATION_CONTROL","play","pause","stop","loading","isIE11","window","userAgent","hasMsCrypto","hasRevision","hasTrident","fetchAndLoadAnimation","_lottie","_fetch","animationSrc","containerRef","loop","animationClassnames","hideOnTransparent","autoplay","animationUrl","URL","toString","fetchResult","headers","animationData","json","animation","loadAnimation","container","current","renderer","rendererSettings","className","preserveAspectRatio","LottieWrapper","props","dataName","ariaLabel","width","height","ie11ImageBackup","backupImageClassName","animationControl","animationClassName","animationItem","setAnimationItem","isAnimationVisible","setIsAnimationVisible","_isIE11","wrapperClassName","style","lottieContainer","lottieAnimationClassName","ie11BackupImageClassName","backupImage","lottie","unfetch","destroy","name","maxWidth","maxHeight","opacity","transition","propTypes","PropTypes","string","isRequired","bool","shape","number","oneOf"],"mappings":"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","sourcesContent":["import React, {useMemo, useRef, useEffect, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport lottie from 'lottie-web';\nimport get from 'lodash/fp/get';\nimport has from 'lodash/fp/has';\nimport includes from 'lodash/fp/includes';\nimport keys from 'lodash/fp/keys';\nimport omit from 'lodash/fp/omit';\nimport unfetch from 'isomorphic-unfetch';\nimport style from './style.css';\n\nexport const ANIMATION_CONTROL = {\n  play: 'play',\n  pause: 'pause',\n  stop: 'stop',\n  loading: 'loading'\n};\n\nconst isIE11 = () => {\n  if (typeof window === 'undefined') return;\n  const userAgent = get('navigator.userAgent', window);\n  const hasMsCrypto = has('msCrypto', window);\n  const hasRevision = includes('rv:', userAgent);\n  const hasTrident = includes('Trident/', userAgent);\n\n  return hasMsCrypto || (hasRevision && hasTrident);\n};\n\nexport const fetchAndLoadAnimation = async (\n  _lottie,\n  _fetch,\n  animationSrc,\n  containerRef,\n  loop,\n  animationClassnames,\n  hideOnTransparent,\n  autoplay\n) => {\n  const animationUrl = new URL(animationSrc).toString();\n  const fetchResult = await _fetch(animationUrl, {\n    headers: {\n      'X-Requested-With': 'XMLHttpRequest',\n      'Content-Type': 'application/json'\n    }\n  });\n\n  const animationData = await fetchResult.json();\n\n  const animation =\n    _lottie.loadAnimation &&\n    _lottie.loadAnimation({\n      container: containerRef.current, // the dom element that will contain the animation\n      renderer: 'svg',\n      autoplay,\n      loop,\n      animationData,\n      rendererSettings: {\n        className: animationClassnames,\n        hideOnTransparent,\n        preserveAspectRatio: 'xMidYMid meet' // same options as a preserveAspectRatio prop\n      }\n    });\n  return animation;\n};\n\nconst LottieWrapper = props => {\n  const {\n    className,\n    'data-name': dataName,\n    'aria-label': ariaLabel,\n    animationSrc,\n    loop = false,\n    rendererSettings = {},\n    width,\n    height,\n    ie11ImageBackup,\n    backupImageClassName,\n    autoplay = true,\n    animationControl\n  } = props;\n\n  const {className: animationClassName, hideOnTransparent = true} = rendererSettings;\n\n  const containerRef = useRef(null);\n\n  // lottie's animation instance\n  const [animationItem, setAnimationItem] = useState(null);\n\n  const [isAnimationVisible, setIsAnimationVisible] = useState(autoplay);\n\n  const _isIE11 = useMemo(() => isIE11(), []);\n\n  const wrapperClassName = useMemo(() => classnames(className, style.lottieContainer), [className]);\n\n  const lottieAnimationClassName = useMemo(() => classnames(animationClassName, style.animation), [\n    animationClassName\n  ]);\n\n  const ie11BackupImageClassName = useMemo(\n    () => classnames(backupImageClassName, style.backupImage),\n    [backupImageClassName]\n  );\n\n  useEffect(() => {\n    // enzyme does not handle well the state update after an async useEffect in tests\n    // to remove when the migration towards @testing-library/react is done\n    /* istanbul ignore next */\n    if (includes(animationControl, keys(omit('loading', ANIMATION_CONTROL))) && !autoplay) {\n      setIsAnimationVisible(true);\n      if (animationItem) animationItem[animationControl]();\n      if (animationControl === ANIMATION_CONTROL.stop) setIsAnimationVisible(false);\n    }\n  }, [animationControl, animationItem, autoplay]);\n\n  useEffect(() => {\n    const loadAnimation = async () => {\n      if (!_isIE11 && !animationItem) {\n        /* istanbul ignore else */\n        if (typeof window !== 'undefined') {\n          window.lottie = lottie;\n        }\n        const animation = await fetchAndLoadAnimation(\n          lottie,\n          unfetch,\n          animationSrc,\n          containerRef,\n          loop,\n          lottieAnimationClassName,\n          hideOnTransparent,\n          autoplay\n        );\n\n        /* istanbul ignore next */\n        setAnimationItem(animation);\n      }\n    };\n\n    loadAnimation();\n    return () => animationItem && /* istanbul ignore next */ lottie.destroy(animationItem.name);\n  }, [\n    lottieAnimationClassName,\n    containerRef,\n    hideOnTransparent,\n    loop,\n    animationSrc,\n    _isIE11,\n    animationItem,\n    autoplay\n  ]);\n\n  return (\n    <div\n      ref={containerRef}\n      aria-label={ariaLabel}\n      data-name={dataName}\n      className={wrapperClassName}\n      style={{\n        ...(width && {\n          width: `${width}px`,\n          maxWidth: `${width}px`\n        }),\n        ...(height && {\n          height: `${height}px`,\n          maxHeight: `${height}px`\n        }),\n        opacity: isAnimationVisible ? 1 : 0,\n        transition: 'opacity 0.25s ease-in'\n      }}\n    >\n      {_isIE11 ? (\n        <img\n          src={ie11ImageBackup}\n          className={ie11BackupImageClassName}\n          data-name=\"ie11-backup-image\"\n        />\n      ) : null}\n    </div>\n  );\n};\n\nLottieWrapper.propTypes = {\n  'aria-label': PropTypes.string.isRequired,\n  'data-name': PropTypes.string,\n  animationSrc: PropTypes.string.isRequired,\n  loop: PropTypes.bool,\n  rendererSettings: PropTypes.shape({\n    hideOnTransparent: PropTypes.bool,\n    className: PropTypes.string\n  }),\n  height: PropTypes.number,\n  width: PropTypes.number,\n  className: PropTypes.string,\n  ie11ImageBackup: PropTypes.string.isRequired,\n  backupImageClassName: PropTypes.string,\n  autoplay: PropTypes.bool,\n  animationControl: PropTypes.oneOf(keys(ANIMATION_CONTROL))\n};\n\nexport default LottieWrapper;\n"],"file":"index.js"}

package/lib/atom/review-background/style.css

@@ -17,7 +17,7 @@
 .mainContainer {
   position: relative;
   width: 100vw;
-  height: 100vh;
+  height: 100%;
   background: #ffffff;
   padding: 0;
   margin: 0;

package/lib/atom/review-header-step-item/index.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports.default = void 0;
+exports.default = exports.ICON_VALUES = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -15,6 +15,12 @@ var _style = _interopRequireDefault(require("./style.css"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+const ICON_VALUES = {
+  right: 'right',
+  wrong: 'wrong'
+};
+exports.ICON_VALUES = ICON_VALUES;
+
 const Content = ({
   icon,
   current,
@@ -27,7 +33,7 @@ const Content = ({
     }, value);
   }
 
-  if (icon === 'right') {
+  if (icon === ICON_VALUES.right) {
     return /*#__PURE__*/_react.default.createElement("span", {
       className: _style.default.value,
       "aria-label": `step ${value}`
@@ -36,7 +42,7 @@ const Content = ({
     }));
   }
 
-  if (icon === 'wrong') {
+  if (icon === ICON_VALUES.wrong) {
     return /*#__PURE__*/_react.default.createElement("span", {
       className: _style.default.value,
       "aria-label": `step ${value}`
@@ -52,7 +58,7 @@ const ReviewHeaderStepItem = props => {
     current
   } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)(_style.default.default, icon === 'right' && _style.default.right, icon === 'wrong' && _style.default.wrong, current && _style.default.current),
+    className: (0, _classnames.default)(_style.default.default, icon === ICON_VALUES.right && _style.default.right, icon === ICON_VALUES.wrong && _style.default.wrong, current && _style.default.current),
     "data-name": "header-step-item"
   }, /*#__PURE__*/_react.default.createElement(Content, props));
 };

package/lib/atom/review-header-step-item/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/atom/review-header-step-item/index.js"],"names":["Content","icon","current","value","style","rightIcon","currentRightIcon","wrongIcon","currentWrongIcon","ReviewHeaderStepItem","props","default","right","wrong","propTypes","PropTypes","string","bool"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AAIA;;;;AAEA,MAAMA,OAAO,GAAG,CAAC;AAACC,EAAAA,IAAD;AAAOC,EAAAA,OAAP;AAAgBC,EAAAA;AAAhB,CAAD,KAA4B;AAC1C,MAAI,CAACF,IAAL,EAAW;AACT,wBACE;AAAM,MAAA,SAAS,EAAEG,eAAMD,KAAvB;AAA8B,oBAAa,QAAOA,KAAM;AAAxD,OACGA,KADH,CADF;AAKD;;AAED,MAAIF,IAAI,KAAK,OAAb,EAAsB;AACpB,wBACE;AAAM,MAAA,SAAS,EAAEG,eAAMD,KAAvB;AAA8B,oBAAa,QAAOA,KAAM;AAAxD,oBACE,6BAAC,2CAAD;AAAW,MAAA,SAAS,EAAE,yBAAWC,eAAMC,SAAjB,EAA4BH,OAAO,IAAIE,eAAME,gBAA7C;AAAtB,MADF,CADF;AAKD;;AAED,MAAIL,IAAI,KAAK,OAAb,EAAsB;AACpB,wBACE;AAAM,MAAA,SAAS,EAAEG,eAAMD,KAAvB;AAA8B,oBAAa,QAAOA,KAAM;AAAxD,oBACE,6BAAC,+BAAD;AAAW,MAAA,SAAS,EAAE,yBAAWC,eAAMG,SAAjB,EAA4BL,OAAO,IAAIE,eAAMI,gBAA7C;AAAtB,MADF,CADF;AAKD;AACF,CAxBD;;AA0BA,MAAMC,oBAAoB,GAAGC,KAAK,IAAI;AACpC,QAAM;AAACT,IAAAA,IAAD;AAAOC,IAAAA;AAAP,MAAkBQ,KAAxB;AACA,sBACE;AACE,IAAA,SAAS,EAAE,yBACTN,eAAMO,OADG,EAETV,IAAI,KAAK,OAAT,IAAoBG,eAAMQ,KAFjB,EAGTX,IAAI,KAAK,OAAT,IAAoBG,eAAMS,KAHjB,EAITX,OAAO,IAAIE,eAAMF,OAJR,CADb;AAOE,iBAAU;AAPZ,kBASE,6BAAC,OAAD,EAAaQ,KAAb,CATF,CADF;AAaD,CAfD;;AAiBAD,oBAAoB,CAACK,SAArB,2CAAiC;AAC/Bb,EAAAA,IAAI,EAAEc,mBAAUC,MADe;AAE/Bd,EAAAA,OAAO,EAAEa,mBAAUE,IAFY;AAG/Bd,EAAAA,KAAK,EAAEY,mBAAUC;AAHc,CAAjC;eAMeP,oB","sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport PropTypes from 'prop-types';\nimport {\n  NovaCompositionCoorpacademyCheck as RightIcon,\n  NovaSolidStatusClose as WrongIcon\n} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst Content = ({icon, current, value}) => {\n  if (!icon) {\n    return (\n      <span className={style.value} aria-label={`step ${value}`}>\n        {value}\n      </span>\n    );\n  }\n\n  if (icon === 'right') {\n    return (\n      <span className={style.value} aria-label={`step ${value}`}>\n        <RightIcon className={classnames(style.rightIcon, current && style.currentRightIcon)} />\n      </span>\n    );\n  }\n\n  if (icon === 'wrong') {\n    return (\n      <span className={style.value} aria-label={`step ${value}`}>\n        <WrongIcon className={classnames(style.wrongIcon, current && style.currentWrongIcon)} />\n      </span>\n    );\n  }\n};\n\nconst ReviewHeaderStepItem = props => {\n  const {icon, current} = props;\n  return (\n    <div\n      className={classnames(\n        style.default,\n        icon === 'right' && style.right,\n        icon === 'wrong' && style.wrong,\n        current && style.current\n      )}\n      data-name=\"header-step-item\"\n    >\n      <Content {...props} />\n    </div>\n  );\n};\n\nReviewHeaderStepItem.propTypes = {\n  icon: PropTypes.string,\n  current: PropTypes.bool,\n  value: PropTypes.string\n};\n\nexport default ReviewHeaderStepItem;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/atom/review-header-step-item/index.js"],"names":["ICON_VALUES","right","wrong","Content","icon","current","value","style","rightIcon","currentRightIcon","wrongIcon","currentWrongIcon","ReviewHeaderStepItem","props","default","propTypes","PropTypes","string","bool"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AAIA;;;;AAEO,MAAMA,WAAW,GAAG;AACzBC,EAAAA,KAAK,EAAE,OADkB;AAEzBC,EAAAA,KAAK,EAAE;AAFkB,CAApB;;;AAKP,MAAMC,OAAO,GAAG,CAAC;AAACC,EAAAA,IAAD;AAAOC,EAAAA,OAAP;AAAgBC,EAAAA;AAAhB,CAAD,KAA4B;AAC1C,MAAI,CAACF,IAAL,EAAW;AACT,wBACE;AAAM,MAAA,SAAS,EAAEG,eAAMD,KAAvB;AAA8B,oBAAa,QAAOA,KAAM;AAAxD,OACGA,KADH,CADF;AAKD;;AAED,MAAIF,IAAI,KAAKJ,WAAW,CAACC,KAAzB,EAAgC;AAC9B,wBACE;AAAM,MAAA,SAAS,EAAEM,eAAMD,KAAvB;AAA8B,oBAAa,QAAOA,KAAM;AAAxD,oBACE,6BAAC,2CAAD;AAAW,MAAA,SAAS,EAAE,yBAAWC,eAAMC,SAAjB,EAA4BH,OAAO,IAAIE,eAAME,gBAA7C;AAAtB,MADF,CADF;AAKD;;AAED,MAAIL,IAAI,KAAKJ,WAAW,CAACE,KAAzB,EAAgC;AAC9B,wBACE;AAAM,MAAA,SAAS,EAAEK,eAAMD,KAAvB;AAA8B,oBAAa,QAAOA,KAAM;AAAxD,oBACE,6BAAC,+BAAD;AAAW,MAAA,SAAS,EAAE,yBAAWC,eAAMG,SAAjB,EAA4BL,OAAO,IAAIE,eAAMI,gBAA7C;AAAtB,MADF,CADF;AAKD;AACF,CAxBD;;AA0BA,MAAMC,oBAAoB,GAAGC,KAAK,IAAI;AACpC,QAAM;AAACT,IAAAA,IAAD;AAAOC,IAAAA;AAAP,MAAkBQ,KAAxB;AACA,sBACE;AACE,IAAA,SAAS,EAAE,yBACTN,eAAMO,OADG,EAETV,IAAI,KAAKJ,WAAW,CAACC,KAArB,IAA8BM,eAAMN,KAF3B,EAGTG,IAAI,KAAKJ,WAAW,CAACE,KAArB,IAA8BK,eAAML,KAH3B,EAITG,OAAO,IAAIE,eAAMF,OAJR,CADb;AAOE,iBAAU;AAPZ,kBASE,6BAAC,OAAD,EAAaQ,KAAb,CATF,CADF;AAaD,CAfD;;AAiBAD,oBAAoB,CAACG,SAArB,2CAAiC;AAC/BX,EAAAA,IAAI,EAAEY,mBAAUC,MADe;AAE/BZ,EAAAA,OAAO,EAAEW,mBAAUE,IAFY;AAG/BZ,EAAAA,KAAK,EAAEU,mBAAUC;AAHc,CAAjC;eAMeL,oB","sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport PropTypes from 'prop-types';\nimport {\n  NovaCompositionCoorpacademyCheck as RightIcon,\n  NovaSolidStatusClose as WrongIcon\n} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nexport const ICON_VALUES = {\n  right: 'right',\n  wrong: 'wrong'\n};\n\nconst Content = ({icon, current, value}) => {\n  if (!icon) {\n    return (\n      <span className={style.value} aria-label={`step ${value}`}>\n        {value}\n      </span>\n    );\n  }\n\n  if (icon === ICON_VALUES.right) {\n    return (\n      <span className={style.value} aria-label={`step ${value}`}>\n        <RightIcon className={classnames(style.rightIcon, current && style.currentRightIcon)} />\n      </span>\n    );\n  }\n\n  if (icon === ICON_VALUES.wrong) {\n    return (\n      <span className={style.value} aria-label={`step ${value}`}>\n        <WrongIcon className={classnames(style.wrongIcon, current && style.currentWrongIcon)} />\n      </span>\n    );\n  }\n};\n\nconst ReviewHeaderStepItem = props => {\n  const {icon, current} = props;\n  return (\n    <div\n      className={classnames(\n        style.default,\n        icon === ICON_VALUES.right && style.right,\n        icon === ICON_VALUES.wrong && style.wrong,\n        current && style.current\n      )}\n      data-name=\"header-step-item\"\n    >\n      <Content {...props} />\n    </div>\n  );\n};\n\nReviewHeaderStepItem.propTypes = {\n  icon: PropTypes.string,\n  current: PropTypes.bool,\n  value: PropTypes.string\n};\n\nexport default ReviewHeaderStepItem;\n"],"file":"index.js"}

package/lib/atom/review-header-step-item/style.css

@@ -17,16 +17,15 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  transition: all 0.25s ease;
+  transition: opacity 0.25s ease, font-size 0.25s ease, transform 0.25s ease, line-height 0.25s ease;
   user-select: none;
 }
 
 .current {
-  width: 40px;
-  height: 40px;
   opacity: 1;
   font-size: 16px;
-  line-height: 22px;
+  transform: scale(1.25);
+  transition: transform 0.25s ease;
 }
 
 .right {
@@ -45,24 +44,22 @@
   color: white;
   width: 12px;
   height: 10px;
-  transition: all 0.25s ease;
+  transition: transform 0.25s ease;
 }
 
 .currentRightIcon {
-  width: 16px;
-  height: 14px;
+  transform: scale(1.333, 1.166);
 }
 
 .wrongIcon {
   color: white;
   width: 10px;
   height: 10px;
-  transition: all 0.25s ease;
+  transition: color 0.25s ease;
 }
 
 .currentWrongIcon {
-  width: 15px;
-  height: 15px;
+  transform: scale(1.5);
 }
 
 

package/lib/atom/review-presentation/index.js

@@ -7,7 +7,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _get = _interopRequireDefault(require("lodash/fp/get"));
+var _getOr = _interopRequireDefault(require("lodash/fp/getOr"));
 
 var _map = _interopRequireDefault(require("lodash/fp/map"));
 
@@ -25,7 +25,15 @@ const ICONS = {
 };
 
 const getIcon = icon => {
-  const Icon = (0, _get.default)(icon, ICONS);
+  const Icon = (0, _getOr.default)(null, icon, ICONS);
+  /* istanbul ignore next */
+
+  if (!Icon) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: _style.default.labelIcon
+    });
+  }
+
   return /*#__PURE__*/_react.default.createElement(Icon, {
     className: _style.default.labelIcon
   });

package/lib/atom/review-presentation/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/atom/review-presentation/index.js"],"names":["ICONS","skills","TargetIcon","questions","QuestionIcon","lifes","HeartIcon","allright","CheckIcon","getIcon","icon","Icon","style","labelIcon","ToolTip","tooltipText","tooltipContainer","tooltipIconContainer","informationIcon","toolTip","ReviewPresentation","props","ariaLabel","reviewTitle","reviewText","labelsList","reviewWrapper","__html","reviewListWrapper","map","convert","cap","label","key","reviewList","reviewListItemWrapper","reviewListText","text","levelItem","PropTypes","shape","string","propTypes"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport get from 'lodash/fp/get';\nimport map from 'lodash/fp/map';\nimport {\n  NovaSolidStatusCheckCircle2 as CheckIcon,\n  NovaSolidVoteRewardsVoteHeart as HeartIcon,\n  NovaCompositionCoorpacademyInformationIcon as InformationIcon,\n  NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon,\n  NovaLineSelectionCursorsCursorArrowTarget as TargetIcon\n} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst ICONS = {\n  skills: TargetIcon,\n  questions: QuestionIcon,\n  lifes: HeartIcon,\n  allright: CheckIcon\n};\n\nconst getIcon = icon => {\n  const Icon = get(icon, ICONS);\n  return <Icon className={style.labelIcon} />;\n};\n\nconst ToolTip = ({tooltipText}) => {\n  return (\n    <div className={style.tooltipContainer}>\n      <div className={style.tooltipIconContainer}>\n        <InformationIcon className={style.informationIcon} width={12} height={12} />\n      </div>\n      <div className={style.toolTip}>\n        <div className={style.tooltipText}>{tooltipText}</div>\n      </div>\n    </div>\n  );\n};\n\nconst ReviewPresentation = props => {\n  const {'aria-label': ariaLabel, reviewTitle, reviewText, labelsList} = props;\n\n  return (\n    <div className={style.reviewWrapper} aria-label={ariaLabel}>\n      <div\n        className={style.reviewTitle}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{__html: reviewTitle}}\n      />\n      <div\n        className={style.reviewText}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{__html: reviewText}}\n      />\n      <ul className={style.reviewListWrapper}>\n        {map.convert({cap: false})((label, key) => {\n          return (\n            <li key={`step-${key}`} className={style.reviewList}>\n              <div className={style.reviewListItemWrapper} data-tip data-for=\"reviewListItem\">\n                <div className={style.reviewListText}>\n                  {getIcon(key)} {label.text}\n                </div>\n                <ToolTip tooltipText={label.tooltipText} />\n              </div>\n            </li>\n          );\n        }, labelsList)}\n      </ul>\n    </div>\n  );\n};\n\nconst levelItem = PropTypes.shape({\n  text: PropTypes.string,\n  tooltipText: PropTypes.string\n});\n\nToolTip.propTypes = {\n  tooltipText: PropTypes.string\n};\n\nReviewPresentation.propTypes = {\n  'aria-label': PropTypes.string,\n  reviewTitle: PropTypes.string,\n  reviewText: PropTypes.string,\n  labelsList: PropTypes.shape({\n    skills: levelItem,\n    questions: levelItem,\n    lifes: levelItem,\n    allright: levelItem\n  })\n};\n\nexport default ReviewPresentation;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/atom/review-presentation/index.js"],"names":["ICONS","skills","TargetIcon","questions","QuestionIcon","lifes","HeartIcon","allright","CheckIcon","getIcon","icon","Icon","style","labelIcon","ToolTip","tooltipText","tooltipContainer","tooltipIconContainer","informationIcon","toolTip","ReviewPresentation","props","ariaLabel","reviewTitle","reviewText","labelsList","reviewWrapper","__html","reviewListWrapper","map","convert","cap","label","key","reviewList","reviewListItemWrapper","reviewListText","text","levelItem","PropTypes","shape","string","propTypes"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport getOr from 'lodash/fp/getOr';\nimport map from 'lodash/fp/map';\nimport {\n  NovaSolidStatusCheckCircle2 as CheckIcon,\n  NovaSolidVoteRewardsVoteHeart as HeartIcon,\n  NovaCompositionCoorpacademyInformationIcon as InformationIcon,\n  NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon,\n  NovaLineSelectionCursorsCursorArrowTarget as TargetIcon\n} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst ICONS = {\n  skills: TargetIcon,\n  questions: QuestionIcon,\n  lifes: HeartIcon,\n  allright: CheckIcon\n};\n\nconst getIcon = icon => {\n  const Icon = getOr(null, icon, ICONS);\n\n  /* istanbul ignore next */\n  if (!Icon) {\n    return <div className={style.labelIcon} />;\n  }\n  return <Icon className={style.labelIcon} />;\n};\n\nconst ToolTip = ({tooltipText}) => {\n  return (\n    <div className={style.tooltipContainer}>\n      <div className={style.tooltipIconContainer}>\n        <InformationIcon className={style.informationIcon} width={12} height={12} />\n      </div>\n      <div className={style.toolTip}>\n        <div className={style.tooltipText}>{tooltipText}</div>\n      </div>\n    </div>\n  );\n};\n\nconst ReviewPresentation = props => {\n  const {'aria-label': ariaLabel, reviewTitle, reviewText, labelsList} = props;\n\n  return (\n    <div className={style.reviewWrapper} aria-label={ariaLabel}>\n      <div\n        className={style.reviewTitle}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{__html: reviewTitle}}\n      />\n      <div\n        className={style.reviewText}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{__html: reviewText}}\n      />\n      <ul className={style.reviewListWrapper}>\n        {map.convert({cap: false})((label, key) => {\n          return (\n            <li key={`step-${key}`} className={style.reviewList}>\n              <div className={style.reviewListItemWrapper} data-tip data-for=\"reviewListItem\">\n                <div className={style.reviewListText}>\n                  {getIcon(key)} {label.text}\n                </div>\n                <ToolTip tooltipText={label.tooltipText} />\n              </div>\n            </li>\n          );\n        }, labelsList)}\n      </ul>\n    </div>\n  );\n};\n\nconst levelItem = PropTypes.shape({\n  text: PropTypes.string,\n  tooltipText: PropTypes.string\n});\n\nToolTip.propTypes = {\n  tooltipText: PropTypes.string\n};\n\nReviewPresentation.propTypes = {\n  'aria-label': PropTypes.string,\n  reviewTitle: PropTypes.string,\n  reviewText: PropTypes.string,\n  labelsList: PropTypes.shape({\n    skills: levelItem,\n    questions: levelItem,\n    lifes: levelItem,\n    allright: levelItem\n  })\n};\n\nexport default ReviewPresentation;\n"],"file":"index.js"}

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

@@ -106,11 +106,14 @@ ReviewCorrectionPopin.propTypes = process.env.NODE_ENV !== "production" ? {
   }),
   next: _propTypes.default.shape({
     label: _propTypes.default.string,
-    onClick: _propTypes.default.func
+    onClick: _propTypes.default.func,
+    'data-name': _propTypes.default.string,
+    'aria-label': _propTypes.default.string
   }),
   klf: _propTypes.default.shape({
     label: _propTypes.default.string,
-    onClick: _propTypes.default.func
+    onClick: _propTypes.default.func,
+    tooltip: _propTypes.default.string
   })
 } : {};
 var _default = ReviewCorrectionPopin;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/review-correction-popin/index.js"],"names":["buildKlfButton","klf","klfButtonProps","icon","position","type","style","klfContainer","klfButtonContainer","klfButton","toolTip","tooltipText","tooltip","ReviewCorrectionPopin","props","information","resultLabel","next","nextQuestionButtonProps","cta","ICONS","right","RightIcon","wrong","WrongIcon","Icon","wrapper","popin","correctionSection","iconCircle","iconRight","iconWrong","feedbackSection","labelContainer","label","message","actions","actionsWrong","nextQuestionContainer","nextQuestionButton","propTypes","PropTypes","oneOf","string","shape","onClick","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport PropTypes from 'prop-types';\nimport {\n  NovaCompositionCoorpacademyCheck as RightIcon,\n  NovaSolidStatusClose as WrongIcon\n} from '@coorpacademy/nova-icons';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst buildKlfButton = klf => {\n  const klfButtonProps = {\n    ...klf,\n    icon: {\n      position: 'left',\n      type: 'key'\n    },\n    type: 'primary'\n  };\n\n  return (\n    <div className={style.klfContainer}>\n      <div className={style.klfButtonContainer}>\n        <ButtonLink {...klfButtonProps} className={style.klfButton} />\n      </div>\n      <div className={style.toolTip}>\n        <div className={style.tooltipText}>{klf.tooltip}</div>\n      </div>\n    </div>\n  );\n};\n\nconst ReviewCorrectionPopin = props => {\n  const {information, resultLabel, type, klf, next} = props;\n\n  const nextQuestionButtonProps = {\n    ...next,\n    type: 'primary'\n  };\n\n  const cta = type === 'wrong' ? buildKlfButton(klf) : null;\n\n  const ICONS = {\n    right: RightIcon,\n    wrong: WrongIcon\n  };\n  const Icon = ICONS[type];\n\n  return (\n    <div className={style.wrapper}>\n      <div className={classnames(style.popin, type === 'right' ? style.right : style.wrong)}>\n        <div className={style.correctionSection}>\n          <div className={style.iconCircle}>\n            <Icon className={type === 'right' ? style.iconRight : style.iconWrong} />\n          </div>\n          <div className={style.resultLabel} aria-label=\"result\">\n            <span aria-label={resultLabel}>{resultLabel}</span>\n          </div>\n        </div>\n        <div className={style.feedbackSection}>\n          <div className={style.information} aria-label=\"answer-information\">\n            <div className={style.labelContainer}>\n              <span className={style.label} aria-label={information.label}>\n                {information.label}\n              </span>\n            </div>\n            <span className={style.message} aria-label={information.message}>\n              {information.message}\n            </span>\n          </div>\n        </div>\n        <div className={type === 'right' ? style.actions : style.actionsWrong}>\n          {cta}\n          <div className={style.nextQuestionContainer}>\n            <ButtonLink {...nextQuestionButtonProps} className={style.nextQuestionButton} />\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nReviewCorrectionPopin.propTypes = {\n  type: PropTypes.oneOf(['right', 'wrong']),\n  resultLabel: PropTypes.string,\n  information: PropTypes.shape({\n    label: PropTypes.string,\n    message: PropTypes.string\n  }),\n  next: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func\n  }),\n  klf: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func\n  })\n};\n\nexport default ReviewCorrectionPopin;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/review-correction-popin/index.js"],"names":["buildKlfButton","klf","klfButtonProps","icon","position","type","style","klfContainer","klfButtonContainer","klfButton","toolTip","tooltipText","tooltip","ReviewCorrectionPopin","props","information","resultLabel","next","nextQuestionButtonProps","cta","ICONS","right","RightIcon","wrong","WrongIcon","Icon","wrapper","popin","correctionSection","iconCircle","iconRight","iconWrong","feedbackSection","labelContainer","label","message","actions","actionsWrong","nextQuestionContainer","nextQuestionButton","propTypes","PropTypes","oneOf","string","shape","onClick","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport PropTypes from 'prop-types';\nimport {\n  NovaCompositionCoorpacademyCheck as RightIcon,\n  NovaSolidStatusClose as WrongIcon\n} from '@coorpacademy/nova-icons';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst buildKlfButton = klf => {\n  const klfButtonProps = {\n    ...klf,\n    icon: {\n      position: 'left',\n      type: 'key'\n    },\n    type: 'primary'\n  };\n\n  return (\n    <div className={style.klfContainer}>\n      <div className={style.klfButtonContainer}>\n        <ButtonLink {...klfButtonProps} className={style.klfButton} />\n      </div>\n      <div className={style.toolTip}>\n        <div className={style.tooltipText}>{klf.tooltip}</div>\n      </div>\n    </div>\n  );\n};\n\nconst ReviewCorrectionPopin = props => {\n  const {information, resultLabel, type, klf, next} = props;\n\n  const nextQuestionButtonProps = {\n    ...next,\n    type: 'primary'\n  };\n\n  const cta = type === 'wrong' ? buildKlfButton(klf) : null;\n\n  const ICONS = {\n    right: RightIcon,\n    wrong: WrongIcon\n  };\n  const Icon = ICONS[type];\n\n  return (\n    <div className={style.wrapper}>\n      <div className={classnames(style.popin, type === 'right' ? style.right : style.wrong)}>\n        <div className={style.correctionSection}>\n          <div className={style.iconCircle}>\n            <Icon className={type === 'right' ? style.iconRight : style.iconWrong} />\n          </div>\n          <div className={style.resultLabel} aria-label=\"result\">\n            <span aria-label={resultLabel}>{resultLabel}</span>\n          </div>\n        </div>\n        <div className={style.feedbackSection}>\n          <div className={style.information} aria-label=\"answer-information\">\n            <div className={style.labelContainer}>\n              <span className={style.label} aria-label={information.label}>\n                {information.label}\n              </span>\n            </div>\n            <span className={style.message} aria-label={information.message}>\n              {information.message}\n            </span>\n          </div>\n        </div>\n        <div className={type === 'right' ? style.actions : style.actionsWrong}>\n          {cta}\n          <div className={style.nextQuestionContainer}>\n            <ButtonLink {...nextQuestionButtonProps} className={style.nextQuestionButton} />\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nReviewCorrectionPopin.propTypes = {\n  type: PropTypes.oneOf(['right', 'wrong']),\n  resultLabel: PropTypes.string,\n  information: PropTypes.shape({\n    label: PropTypes.string,\n    message: PropTypes.string\n  }),\n  next: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func,\n    'data-name': PropTypes.string,\n    'aria-label': PropTypes.string\n  }),\n  klf: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func,\n    tooltip: PropTypes.string\n  })\n};\n\nexport default ReviewCorrectionPopin;\n"],"file":"index.js"}

package/lib/molecule/review-correction-popin/test/fixtures/wrong.js

@@ -11,6 +11,7 @@ var _default = {
       message: 'Corporate lawyers trying to understand software.'
     },
     klf: {
+      onClick: () => console.log('klf tooltip'),
       label: 'Key learning factor',
       tooltip: '17 frustrated software engineers grappling with the complexities of software development.'
     },

package/lib/molecule/review-correction-popin/test/fixtures/wrong.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/molecule/review-correction-popin/test/fixtures/wrong.js"],"names":["props","type","resultLabel","information","label","message","klf","tooltip","next","onClick","console","log"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE,OADD;AAELC,IAAAA,WAAW,EAAE,cAFR;AAGLC,IAAAA,WAAW,EAAE;AACXC,MAAAA,KAAK,EAAE,gBADI;AAEXC,MAAAA,OAAO,EAAE;AAFE,KAHR;AAOLC,IAAAA,GAAG,EAAE;AACHF,MAAAA,KAAK,EAAE,qBADJ;AAEHG,MAAAA,OAAO,EACL;AAHC,KAPA;AAYLC,IAAAA,IAAI,EAAE;AACJJ,MAAAA,KAAK,EAAE,eADH;AAEJK,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,eAAZ;AAFX;AAZD;AADM,C","sourcesContent":["export default {\n  props: {\n    type: 'wrong',\n    resultLabel: 'WRONG ANSWER',\n    information: {\n      label: 'Correct Answer',\n      message: 'Corporate lawyers trying to understand software.'\n    },\n    klf: {\n      label: 'Key learning factor',\n      tooltip:\n        '17 frustrated software engineers grappling with the complexities of software development.'\n    },\n    next: {\n      label: 'Next Question',\n      onClick: () => console.log('Next Question')\n    }\n  }\n};\n"],"file":"wrong.js"}
+{"version":3,"sources":["../../../../../src/molecule/review-correction-popin/test/fixtures/wrong.js"],"names":["props","type","resultLabel","information","label","message","klf","onClick","console","log","tooltip","next"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE,OADD;AAELC,IAAAA,WAAW,EAAE,cAFR;AAGLC,IAAAA,WAAW,EAAE;AACXC,MAAAA,KAAK,EAAE,gBADI;AAEXC,MAAAA,OAAO,EAAE;AAFE,KAHR;AAOLC,IAAAA,GAAG,EAAE;AACHC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,aAAZ,CADZ;AAEHL,MAAAA,KAAK,EAAE,qBAFJ;AAGHM,MAAAA,OAAO,EACL;AAJC,KAPA;AAaLC,IAAAA,IAAI,EAAE;AACJP,MAAAA,KAAK,EAAE,eADH;AAEJG,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,eAAZ;AAFX;AAbD;AADM,C","sourcesContent":["export default {\n  props: {\n    type: 'wrong',\n    resultLabel: 'WRONG ANSWER',\n    information: {\n      label: 'Correct Answer',\n      message: 'Corporate lawyers trying to understand software.'\n    },\n    klf: {\n      onClick: () => console.log('klf tooltip'),\n      label: 'Key learning factor',\n      tooltip:\n        '17 frustrated software engineers grappling with the complexities of software development.'\n    },\n    next: {\n      label: 'Next Question',\n      onClick: () => console.log('Next Question')\n    }\n  }\n};\n"],"file":"wrong.js"}

package/lib/molecule/review-header-steps/index.js

@@ -17,7 +17,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 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 ReviewHeaderStep = props => {
+const ReviewHeaderSteps = props => {
   const {
     steps
   } = props;
@@ -30,9 +30,9 @@ const ReviewHeaderStep = props => {
   }, items);
 };
 
-ReviewHeaderStep.propTypes = process.env.NODE_ENV !== "production" ? {
+ReviewHeaderSteps.propTypes = process.env.NODE_ENV !== "production" ? {
   steps: _propTypes.default.arrayOf(_propTypes.default.shape(_reviewHeaderStepItem.default.props))
 } : {};
-var _default = ReviewHeaderStep;
+var _default = ReviewHeaderSteps;
 exports.default = _default;
 //# sourceMappingURL=index.js.map

package/lib/molecule/review-header-steps/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/review-header-steps/index.js"],"names":["ReviewHeaderStep","props","steps","items","step","value","style","wrapper","propTypes","PropTypes","arrayOf","shape","ReviewHeaderStepItem"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,MAAMA,gBAAgB,GAAGC,KAAK,IAAI;AAChC,QAAM;AAACC,IAAAA;AAAD,MAAUD,KAAhB;AAEA,QAAME,KAAK,GAAG,kBAAIC,IAAI,iBAAI,6BAAC,6BAAD,eAA0BA,IAA1B;AAAgC,IAAA,GAAG,EAAEA,IAAI,CAACC;AAA1C,KAAZ,EAAiEH,KAAjE,CAAd;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEI,eAAMC,OAAtB;AAA+B,iBAAU;AAAzC,KACGJ,KADH,CADF;AAKD,CAVD;;AAYAH,gBAAgB,CAACQ,SAAjB,2CAA6B;AAC3BN,EAAAA,KAAK,EAAEO,mBAAUC,OAAV,CAAkBD,mBAAUE,KAAV,CAAgBC,8BAAqBX,KAArC,CAAlB;AADoB,CAA7B;eAIeD,gB","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport map from 'lodash/fp/map';\nimport ReviewHeaderStepItem from '../../atom/review-header-step-item';\nimport style from './style.css';\n\nconst ReviewHeaderStep = props => {\n  const {steps} = props;\n\n  const items = map(step => <ReviewHeaderStepItem {...step} key={step.value} />, steps);\n\n  return (\n    <div className={style.wrapper} data-name=\"header-steps\">\n      {items}\n    </div>\n  );\n};\n\nReviewHeaderStep.propTypes = {\n  steps: PropTypes.arrayOf(PropTypes.shape(ReviewHeaderStepItem.props))\n};\n\nexport default ReviewHeaderStep;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/review-header-steps/index.js"],"names":["ReviewHeaderSteps","props","steps","items","step","value","style","wrapper","propTypes","PropTypes","arrayOf","shape","ReviewHeaderStepItem"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,MAAMA,iBAAiB,GAAGC,KAAK,IAAI;AACjC,QAAM;AAACC,IAAAA;AAAD,MAAUD,KAAhB;AAEA,QAAME,KAAK,GAAG,kBAAIC,IAAI,iBAAI,6BAAC,6BAAD,eAA0BA,IAA1B;AAAgC,IAAA,GAAG,EAAEA,IAAI,CAACC;AAA1C,KAAZ,EAAiEH,KAAjE,CAAd;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEI,eAAMC,OAAtB;AAA+B,iBAAU;AAAzC,KACGJ,KADH,CADF;AAKD,CAVD;;AAYAH,iBAAiB,CAACQ,SAAlB,2CAA8B;AAC5BN,EAAAA,KAAK,EAAEO,mBAAUC,OAAV,CAAkBD,mBAAUE,KAAV,CAAgBC,8BAAqBX,KAArC,CAAlB;AADqB,CAA9B;eAIeD,iB","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport map from 'lodash/fp/map';\nimport ReviewHeaderStepItem from '../../atom/review-header-step-item';\nimport style from './style.css';\n\nconst ReviewHeaderSteps = props => {\n  const {steps} = props;\n\n  const items = map(step => <ReviewHeaderStepItem {...step} key={step.value} />, steps);\n\n  return (\n    <div className={style.wrapper} data-name=\"header-steps\">\n      {items}\n    </div>\n  );\n};\n\nReviewHeaderSteps.propTypes = {\n  steps: PropTypes.arrayOf(PropTypes.shape(ReviewHeaderStepItem.props))\n};\n\nexport default ReviewHeaderSteps;\n"],"file":"index.js"}

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

@@ -24,7 +24,9 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
 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 setScroll = container => () => {
-  container.current.scrollTo({
+  var _container$current;
+
+  ((_container$current = container.current) == null ? void 0 : _container$current.scrollTo) && container.current.scrollTo({
     left: 1000,
     behavior: 'smooth'
   });

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/organism/review-congrats/index.js"],"names":["setScroll","container","current","scrollTo","left","behavior","ReviewCongrats","props","ariaLabel","dataName","animationLottie","title","cardCongratsStar","cardCongratsRank","buttonRevising","buttonRevisingSkill","timer","setTimeout","clearTimeout","style","mainContainer","lottie","ie11Backup","containerCongrats","containerCards","cardStar","cardRank","buttonContainer","buttonRevise","propTypes","PropTypes","string","shape","AtomLottieWrapper","MoleculeReviewCardCongrats","label","onClick","func","type"],"mappings":"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","sourcesContent":["import React, {useEffect, useRef} from 'react';\nimport PropTypes from 'prop-types';\nimport AtomLottieWrapper from '../../atom/lottie-wrapper';\nimport ButtonLink from '../../atom/button-link';\nimport MoleculeReviewCardCongrats from '../../molecule/review-card-congrats';\nimport style from './style.css';\n\nexport const setScroll = container => () => {\n  container.current.scrollTo({\n    left: 1000,\n    behavior: 'smooth'\n  });\n};\n\nconst ReviewCongrats = props => {\n  const {\n    'aria-label': ariaLabel,\n    'data-name': dataName,\n    animationLottie,\n    title,\n    cardCongratsStar,\n    cardCongratsRank,\n    buttonRevising,\n    buttonRevisingSkill\n  } = props;\n\n  const container = useRef(null);\n\n  useEffect(() => {\n    const timer = setTimeout(setScroll(container), 2000);\n    return () => timer && clearTimeout(timer);\n  }, []);\n\n  return (\n    <div className={style.mainContainer} aria-label={ariaLabel} data-name={dataName}>\n      <AtomLottieWrapper\n        {...animationLottie}\n        loop={false}\n        animationControl={'play'}\n        autoplay\n        data-name=\"lottie-wrapper\"\n        className={style.lottie}\n        backupImageClassName={style.ie11Backup}\n      />\n      <div className={style.containerCongrats}>\n        <div className={style.title}>{title}</div>\n        <div ref={container} className={style.containerCards}>\n          <MoleculeReviewCardCongrats {...cardCongratsStar} className={style.cardStar} />\n          <MoleculeReviewCardCongrats\n            {...cardCongratsRank}\n            timerAnimation={1800}\n            className={style.cardRank}\n          />\n        </div>\n        <div className={style.buttonContainer}>\n          <ButtonLink\n            {...buttonRevising}\n            className={style.buttonRevise}\n            data-name=\"revise-skill-link\"\n          />\n          <ButtonLink {...buttonRevisingSkill} className={style.buttonRevise} />\n        </div>\n      </div>\n    </div>\n  );\n};\n\nReviewCongrats.propTypes = {\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string,\n  animationLottie: PropTypes.shape(AtomLottieWrapper.propTypes),\n  title: PropTypes.string,\n  cardCongratsStar: PropTypes.shape(MoleculeReviewCardCongrats.propTypes),\n  cardCongratsRank: PropTypes.shape(MoleculeReviewCardCongrats.propTypes),\n  buttonRevising: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func,\n    type: PropTypes.string\n  }),\n  buttonRevisingSkill: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func,\n    type: PropTypes.string\n  })\n};\n\nexport default ReviewCongrats;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/organism/review-congrats/index.js"],"names":["setScroll","container","current","scrollTo","left","behavior","ReviewCongrats","props","ariaLabel","dataName","animationLottie","title","cardCongratsStar","cardCongratsRank","buttonRevising","buttonRevisingSkill","timer","setTimeout","clearTimeout","style","mainContainer","lottie","ie11Backup","containerCongrats","containerCards","cardStar","cardRank","buttonContainer","buttonRevise","propTypes","PropTypes","string","shape","AtomLottieWrapper","MoleculeReviewCardCongrats","label","onClick","func","type"],"mappings":"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","sourcesContent":["import React, {useEffect, useRef} from 'react';\nimport PropTypes from 'prop-types';\nimport AtomLottieWrapper from '../../atom/lottie-wrapper';\nimport ButtonLink from '../../atom/button-link';\nimport MoleculeReviewCardCongrats from '../../molecule/review-card-congrats';\nimport style from './style.css';\n\nexport const setScroll = container => () => {\n  container.current?.scrollTo &&\n    container.current.scrollTo({\n      left: 1000,\n      behavior: 'smooth'\n    });\n};\n\nconst ReviewCongrats = props => {\n  const {\n    'aria-label': ariaLabel,\n    'data-name': dataName,\n    animationLottie,\n    title,\n    cardCongratsStar,\n    cardCongratsRank,\n    buttonRevising,\n    buttonRevisingSkill\n  } = props;\n\n  const container = useRef(null);\n\n  useEffect(() => {\n    const timer = setTimeout(setScroll(container), 2000);\n    return () => timer && clearTimeout(timer);\n  }, []);\n\n  return (\n    <div className={style.mainContainer} aria-label={ariaLabel} data-name={dataName}>\n      <AtomLottieWrapper\n        {...animationLottie}\n        loop={false}\n        animationControl={'play'}\n        autoplay\n        data-name=\"lottie-wrapper\"\n        className={style.lottie}\n        backupImageClassName={style.ie11Backup}\n      />\n      <div className={style.containerCongrats}>\n        <div className={style.title}>{title}</div>\n        <div ref={container} className={style.containerCards}>\n          <MoleculeReviewCardCongrats {...cardCongratsStar} className={style.cardStar} />\n          <MoleculeReviewCardCongrats\n            {...cardCongratsRank}\n            timerAnimation={1800}\n            className={style.cardRank}\n          />\n        </div>\n        <div className={style.buttonContainer}>\n          <ButtonLink\n            {...buttonRevising}\n            className={style.buttonRevise}\n            data-name=\"revise-skill-link\"\n          />\n          <ButtonLink {...buttonRevisingSkill} className={style.buttonRevise} />\n        </div>\n      </div>\n    </div>\n  );\n};\n\nReviewCongrats.propTypes = {\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string,\n  animationLottie: PropTypes.shape(AtomLottieWrapper.propTypes),\n  title: PropTypes.string,\n  cardCongratsStar: PropTypes.shape(MoleculeReviewCardCongrats.propTypes),\n  cardCongratsRank: PropTypes.shape(MoleculeReviewCardCongrats.propTypes),\n  buttonRevising: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func,\n    type: PropTypes.string\n  }),\n  buttonRevisingSkill: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func,\n    type: PropTypes.string\n  })\n};\n\nexport default ReviewCongrats;\n"],"file":"index.js"}

package/lib/organism/review-congrats/style.css

@@ -114,7 +114,6 @@
   top: 200px;
   user-select: none;
   animation: translateTitle 1.4s ease-out 0s forwards;
-  background-color: white;
 }
 
 .containerCards {

package/lib/organism/review-header/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/organism/review-header/index.js"],"names":["ReviewHeader","props","context","steps","mode","skillName","ariaLabel","closeButtonAriaLabel","onQuitClick","hiddenSteps","skin","primarySkinColor","buttonProps","icon","onClick","size","className","style","review","stepsWrapper","stepsWrapperAnimation","headerWrapper","titlesWrapper","title","color","iconButtonWrapper","propTypes","ReviewHeaderStep","PropTypes","string","isRequired","func","bool"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,YAAY,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;AACvC,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,IAFI;AAGJC,IAAAA,SAHI;AAIJ,kBAAcC,SAJV;AAKJC,IAAAA,oBALI;AAMJC,IAAAA,WANI;AAOJC,IAAAA;AAPI,MAQFR,KARJ;AASA,QAAM;AAACS,IAAAA;AAAD,MAASR,OAAf;AACA,QAAMS,gBAAgB,GAAG,oBAAM,SAAN,EAAiB,gBAAjB,EAAmCD,IAAnC,CAAzB;AAEA,QAAME,WAAW,GAAG;AAClBC,IAAAA,IAAI,EAAE,OADY;AAElB,iBAAa,4BAFK;AAGlB,kBAAcN,oBAHI;AAIlBO,IAAAA,OAAO,EAAEN,WAJS;AAKlBO,IAAAA,IAAI,EAAE,YALY;AAMlBC,IAAAA,SAAS,EAAEC,eAAMC;AANC,GAApB;AASA,QAAMC,YAAY,GAAG,yBACnBF,eAAME,YADa,EAEnBV,WAAW,GAAGQ,eAAMG,qBAAT,GAAiC,IAFzB,CAArB;AAKA,sBACE;AAAK,IAAA,SAAS,EAAEH,eAAMI,aAAtB;AAAqC,iBAAU,eAA/C;AAA+D,kBAAYf;AAA3E,kBACE;AAAK,IAAA,SAAS,EAAEW,eAAMK;AAAtB,kBACE;AAAK,IAAA,SAAS,EAAEL,eAAMM,KAAtB;AAA6B,IAAA,KAAK,EAAEnB,IAApC;AAA0C,kBAAYA,IAAtD;AAA4D,iBAAU;AAAtE,KACGA,IADH,CADF,eAIE;AACE,IAAA,SAAS,EAAEa,eAAMZ,SADnB;AAEE,IAAA,KAAK,EAAE;AACLmB,MAAAA,KAAK,EAAEb;AADF,KAFT;AAKE,IAAA,KAAK,EAAEN,SALT;AAME,kBAAYA,SANd;AAOE,iBAAU;AAPZ,KASGA,SATH,CAJF,CADF,eAkBE;AAAK,IAAA,SAAS,EAAEc;AAAhB,kBACE,6BAAC,0BAAD;AAAkB,IAAA,KAAK,EAAEhB,KAAzB;AAAgC,IAAA,GAAG,EAAE;AAArC,IADF,CAlBF,eAsBE;AAAK,IAAA,SAAS,EAAEc,eAAMQ,iBAAtB;AAAyC,iBAAU;AAAnD,kBACE,6BAAC,2BAAD,EAAwBb,WAAxB,CADF,CAtBF,CADF;AA4BD,CAvDD;;AAyDAZ,YAAY,CAAC0B,SAAb,2CAAyB;AACvBvB,EAAAA,KAAK,EAAEwB,2BAAiBD,SAAjB,CAA2BvB,KADX;AAEvBC,EAAAA,IAAI,EAAEwB,mBAAUC,MAAV,CAAiBC,UAFA;AAGvBzB,EAAAA,SAAS,EAAEuB,mBAAUC,MAAV,CAAiBC,UAHL;AAIvB,gBAAcF,mBAAUC,MAJD;AAKvBtB,EAAAA,oBAAoB,EAAEqB,mBAAUC,MALT;AAMvBrB,EAAAA,WAAW,EAAEoB,mBAAUG,IANA;AAOvBtB,EAAAA,WAAW,EAAEmB,mBAAUI;AAPA,CAAzB;eAUehC,Y","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport getOr from 'lodash/fp/getOr';\nimport ButtonLinkIconOnly from '../../atom/button-link-icon-only';\nimport ReviewHeaderStep from '../../molecule/review-header-steps';\nimport style from './style.css';\n\nconst ReviewHeader = (props, context) => {\n  const {\n    steps,\n    mode,\n    skillName,\n    'aria-label': ariaLabel,\n    closeButtonAriaLabel,\n    onQuitClick,\n    hiddenSteps\n  } = props;\n  const {skin} = context;\n  const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n  const buttonProps = {\n    icon: 'close',\n    'data-name': 'review-header-close-button',\n    'aria-label': closeButtonAriaLabel,\n    onClick: onQuitClick,\n    size: 'responsive',\n    className: style.review\n  };\n\n  const stepsWrapper = classnames(\n    style.stepsWrapper,\n    hiddenSteps ? style.stepsWrapperAnimation : null\n  );\n\n  return (\n    <div className={style.headerWrapper} data-name=\"review-header\" aria-label={ariaLabel}>\n      <div className={style.titlesWrapper}>\n        <div className={style.title} title={mode} aria-label={mode} data-name=\"review-header-mode\">\n          {mode}\n        </div>\n        <div\n          className={style.skillName}\n          style={{\n            color: primarySkinColor\n          }}\n          title={skillName}\n          aria-label={skillName}\n          data-name=\"review-header-skill-name\"\n        >\n          {skillName}\n        </div>\n      </div>\n\n      <div className={stepsWrapper}>\n        <ReviewHeaderStep steps={steps} key={'review-header-steps'} />\n      </div>\n\n      <div className={style.iconButtonWrapper} data-name=\"review-header-close-button-wrapper\">\n        <ButtonLinkIconOnly {...buttonProps} />\n      </div>\n    </div>\n  );\n};\n\nReviewHeader.propTypes = {\n  steps: ReviewHeaderStep.propTypes.steps,\n  mode: PropTypes.string.isRequired,\n  skillName: PropTypes.string.isRequired,\n  'aria-label': PropTypes.string,\n  closeButtonAriaLabel: PropTypes.string,\n  onQuitClick: PropTypes.func,\n  hiddenSteps: PropTypes.bool\n};\n\nexport default ReviewHeader;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/organism/review-header/index.js"],"names":["ReviewHeader","props","context","steps","mode","skillName","ariaLabel","closeButtonAriaLabel","onQuitClick","hiddenSteps","skin","primarySkinColor","buttonProps","icon","onClick","size","className","style","review","stepsWrapper","stepsWrapperAnimation","headerWrapper","titlesWrapper","title","color","iconButtonWrapper","propTypes","ReviewHeaderSteps","PropTypes","string","isRequired","func","bool"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,YAAY,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;AACvC,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,IAFI;AAGJC,IAAAA,SAHI;AAIJ,kBAAcC,SAJV;AAKJC,IAAAA,oBALI;AAMJC,IAAAA,WANI;AAOJC,IAAAA;AAPI,MAQFR,KARJ;AASA,QAAM;AAACS,IAAAA;AAAD,MAASR,OAAf;AACA,QAAMS,gBAAgB,GAAG,oBAAM,SAAN,EAAiB,gBAAjB,EAAmCD,IAAnC,CAAzB;AAEA,QAAME,WAAW,GAAG;AAClBC,IAAAA,IAAI,EAAE,OADY;AAElB,iBAAa,4BAFK;AAGlB,kBAAcN,oBAHI;AAIlBO,IAAAA,OAAO,EAAEN,WAJS;AAKlBO,IAAAA,IAAI,EAAE,YALY;AAMlBC,IAAAA,SAAS,EAAEC,eAAMC;AANC,GAApB;AASA,QAAMC,YAAY,GAAG,yBACnBF,eAAME,YADa,EAEnBV,WAAW,GAAGQ,eAAMG,qBAAT,GAAiC,IAFzB,CAArB;AAKA,sBACE;AAAK,IAAA,SAAS,EAAEH,eAAMI,aAAtB;AAAqC,iBAAU,eAA/C;AAA+D,kBAAYf;AAA3E,kBACE;AAAK,IAAA,SAAS,EAAEW,eAAMK;AAAtB,kBACE;AAAK,IAAA,SAAS,EAAEL,eAAMM,KAAtB;AAA6B,IAAA,KAAK,EAAEnB,IAApC;AAA0C,kBAAYA,IAAtD;AAA4D,iBAAU;AAAtE,KACGA,IADH,CADF,eAIE;AACE,IAAA,SAAS,EAAEa,eAAMZ,SADnB;AAEE,IAAA,KAAK,EAAE;AACLmB,MAAAA,KAAK,EAAEb;AADF,KAFT;AAKE,IAAA,KAAK,EAAEN,SALT;AAME,kBAAYA,SANd;AAOE,iBAAU;AAPZ,KASGA,SATH,CAJF,CADF,eAkBE;AAAK,IAAA,SAAS,EAAEc;AAAhB,kBACE,6BAAC,0BAAD;AAAmB,IAAA,KAAK,EAAEhB,KAA1B;AAAiC,IAAA,GAAG,EAAE;AAAtC,IADF,CAlBF,eAsBE;AAAK,IAAA,SAAS,EAAEc,eAAMQ,iBAAtB;AAAyC,iBAAU;AAAnD,kBACE,6BAAC,2BAAD,EAAwBb,WAAxB,CADF,CAtBF,CADF;AA4BD,CAvDD;;AAyDAZ,YAAY,CAAC0B,SAAb,2CAAyB;AACvBvB,EAAAA,KAAK,EAAEwB,2BAAkBD,SAAlB,CAA4BvB,KADZ;AAEvBC,EAAAA,IAAI,EAAEwB,mBAAUC,MAAV,CAAiBC,UAFA;AAGvBzB,EAAAA,SAAS,EAAEuB,mBAAUC,MAAV,CAAiBC,UAHL;AAIvB,gBAAcF,mBAAUC,MAJD;AAKvBtB,EAAAA,oBAAoB,EAAEqB,mBAAUC,MALT;AAMvBrB,EAAAA,WAAW,EAAEoB,mBAAUG,IANA;AAOvBtB,EAAAA,WAAW,EAAEmB,mBAAUI;AAPA,CAAzB;eAUehC,Y","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport getOr from 'lodash/fp/getOr';\nimport ButtonLinkIconOnly from '../../atom/button-link-icon-only';\nimport ReviewHeaderSteps from '../../molecule/review-header-steps';\nimport style from './style.css';\n\nconst ReviewHeader = (props, context) => {\n  const {\n    steps,\n    mode,\n    skillName,\n    'aria-label': ariaLabel,\n    closeButtonAriaLabel,\n    onQuitClick,\n    hiddenSteps\n  } = props;\n  const {skin} = context;\n  const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n  const buttonProps = {\n    icon: 'close',\n    'data-name': 'review-header-close-button',\n    'aria-label': closeButtonAriaLabel,\n    onClick: onQuitClick,\n    size: 'responsive',\n    className: style.review\n  };\n\n  const stepsWrapper = classnames(\n    style.stepsWrapper,\n    hiddenSteps ? style.stepsWrapperAnimation : null\n  );\n\n  return (\n    <div className={style.headerWrapper} data-name=\"review-header\" aria-label={ariaLabel}>\n      <div className={style.titlesWrapper}>\n        <div className={style.title} title={mode} aria-label={mode} data-name=\"review-header-mode\">\n          {mode}\n        </div>\n        <div\n          className={style.skillName}\n          style={{\n            color: primarySkinColor\n          }}\n          title={skillName}\n          aria-label={skillName}\n          data-name=\"review-header-skill-name\"\n        >\n          {skillName}\n        </div>\n      </div>\n\n      <div className={stepsWrapper}>\n        <ReviewHeaderSteps steps={steps} key={'review-header-steps'} />\n      </div>\n\n      <div className={style.iconButtonWrapper} data-name=\"review-header-close-button-wrapper\">\n        <ButtonLinkIconOnly {...buttonProps} />\n      </div>\n    </div>\n  );\n};\n\nReviewHeader.propTypes = {\n  steps: ReviewHeaderSteps.propTypes.steps,\n  mode: PropTypes.string.isRequired,\n  skillName: PropTypes.string.isRequired,\n  'aria-label': PropTypes.string,\n  closeButtonAriaLabel: PropTypes.string,\n  onQuitClick: PropTypes.func,\n  hiddenSteps: PropTypes.bool\n};\n\nexport default ReviewHeader;\n"],"file":"index.js"}