@coorpacademy/components 10.19.0 → 10.19.1

package/es/atom/checkbox-with-title/index.js

@@ -18,8 +18,9 @@ const CheckboxWithTitle = props => {
   const idCheckbox = _uniqueId('input-checkbox-');
 
   const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);
-  return /*#__PURE__*/React.createElement("label", {
-    className: style.container,
+  return /*#__PURE__*/React.createElement("div", {
+    className: style.container
+  }, /*#__PURE__*/React.createElement("label", {
     htmlFor: idCheckbox
   }, /*#__PURE__*/React.createElement("input", {
     type: "checkbox",
@@ -34,7 +35,7 @@ const CheckboxWithTitle = props => {
     className: style.label
   }, /*#__PURE__*/React.createElement(CheckIcon, {
     className: style.icon
-  })), /*#__PURE__*/React.createElement("span", {
+  }))), /*#__PURE__*/React.createElement("span", {
     className: style.title
   }, title));
 };

package/es/atom/checkbox-with-title/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/atom/checkbox-with-title/index.js"],"names":["React","useMemo","PropTypes","NovaSolidStatusValidate","CheckIcon","style","CheckboxWithTitle","props","title","name","checked","onChange","dataName","ariaLabel","idCheckbox","handleChange","e","target","container","checkbox","label","icon","propTypes","string","bool","func"],"mappings":";;AAAA,OAAOA,KAAP,IAAeC,OAAf,QAA6B,OAA7B;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAAQC,uBAAuB,IAAIC,SAAnC,QAAmD,0BAAnD;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,iBAAiB,GAAGC,KAAK,IAAI;AACjC,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,IAFI;AAGJC,IAAAA,OAHI;AAIJC,IAAAA,QAAQ,QAJJ;AAKJ,iBAAaC,QALT;AAMJ,kBAAcC;AANV,MAOFN,KAPJ;;AASA,QAAMO,UAAU,GAAG,UAAS,iBAAT,CAAnB;;AACA,QAAMC,YAAY,GAAGd,OAAO,CAAC,MAAMe,CAAC,IAAIL,QAAQ,CAACK,CAAC,CAACC,MAAF,CAASP,OAAV,CAApB,EAAwC,CAACC,QAAD,CAAxC,CAA5B;AAEA,sBACE;AAAO,IAAA,SAAS,EAAEN,KAAK,CAACa,SAAxB;AAAmC,IAAA,OAAO,EAAEJ;AAA5C,kBACE;AACE,IAAA,IAAI,EAAC,UADP;AAEE,IAAA,EAAE,EAAEA,UAFN;AAGE,IAAA,IAAI,EAAEL,IAHR;AAIE,IAAA,QAAQ,EAAEM,YAJZ;AAKE,IAAA,OAAO,EAAEL,OALX;AAME,IAAA,SAAS,EAAEL,KAAK,CAACc,QANnB;AAOE,iBAAWP,QAPb;AAQE,kBAAYC;AARd,IADF,eAWE;AAAK,IAAA,SAAS,EAAER,KAAK,CAACe;AAAtB,kBACE,oBAAC,SAAD;AAAW,IAAA,SAAS,EAAEf,KAAK,CAACgB;AAA5B,IADF,CAXF,eAcE;AAAM,IAAA,SAAS,EAAEhB,KAAK,CAACG;AAAvB,KAA+BA,KAA/B,CAdF,CADF;AAkBD,CA/BD;;AAiCAF,iBAAiB,CAACgB,SAAlB,2CAA8B;AAC5Bd,EAAAA,KAAK,EAAEN,SAAS,CAACqB,MADW;AAE5Bd,EAAAA,IAAI,EAAEP,SAAS,CAACqB,MAFY;AAG5Bb,EAAAA,OAAO,EAAER,SAAS,CAACsB,IAHS;AAI5Bb,EAAAA,QAAQ,EAAET,SAAS,CAACuB,IAJQ;AAK5B,gBAAcvB,SAAS,CAACqB,MALI;AAM5B,eAAarB,SAAS,CAACqB;AANK,CAA9B;AAQA,eAAejB,iBAAf","sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, uniqueId} from 'lodash/fp';\nimport {NovaSolidStatusValidate as CheckIcon} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst CheckboxWithTitle = props => {\n  const {\n    title,\n    name,\n    checked,\n    onChange = noop,\n    'data-name': dataName,\n    'aria-label': ariaLabel\n  } = props;\n\n  const idCheckbox = uniqueId('input-checkbox-');\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n\n  return (\n    <label className={style.container} htmlFor={idCheckbox}>\n      <input\n        type=\"checkbox\"\n        id={idCheckbox}\n        name={name}\n        onChange={handleChange}\n        checked={checked}\n        className={style.checkbox}\n        data-name={dataName}\n        aria-label={ariaLabel}\n      />\n      <div className={style.label}>\n        <CheckIcon className={style.icon} />\n      </div>\n      <span className={style.title}>{title}</span>\n    </label>\n  );\n};\n\nCheckboxWithTitle.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  checked: PropTypes.bool,\n  onChange: PropTypes.func,\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string\n};\nexport default CheckboxWithTitle;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/atom/checkbox-with-title/index.js"],"names":["React","useMemo","PropTypes","NovaSolidStatusValidate","CheckIcon","style","CheckboxWithTitle","props","title","name","checked","onChange","dataName","ariaLabel","idCheckbox","handleChange","e","target","container","checkbox","label","icon","propTypes","string","bool","func"],"mappings":";;AAAA,OAAOA,KAAP,IAAeC,OAAf,QAA6B,OAA7B;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAAQC,uBAAuB,IAAIC,SAAnC,QAAmD,0BAAnD;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,iBAAiB,GAAGC,KAAK,IAAI;AACjC,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,IAFI;AAGJC,IAAAA,OAHI;AAIJC,IAAAA,QAAQ,QAJJ;AAKJ,iBAAaC,QALT;AAMJ,kBAAcC;AANV,MAOFN,KAPJ;;AASA,QAAMO,UAAU,GAAG,UAAS,iBAAT,CAAnB;;AACA,QAAMC,YAAY,GAAGd,OAAO,CAAC,MAAMe,CAAC,IAAIL,QAAQ,CAACK,CAAC,CAACC,MAAF,CAASP,OAAV,CAApB,EAAwC,CAACC,QAAD,CAAxC,CAA5B;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEN,KAAK,CAACa;AAAtB,kBACE;AAAO,IAAA,OAAO,EAAEJ;AAAhB,kBACE;AACE,IAAA,IAAI,EAAC,UADP;AAEE,IAAA,EAAE,EAAEA,UAFN;AAGE,IAAA,IAAI,EAAEL,IAHR;AAIE,IAAA,QAAQ,EAAEM,YAJZ;AAKE,IAAA,OAAO,EAAEL,OALX;AAME,IAAA,SAAS,EAAEL,KAAK,CAACc,QANnB;AAOE,iBAAWP,QAPb;AAQE,kBAAYC;AARd,IADF,eAWE;AAAK,IAAA,SAAS,EAAER,KAAK,CAACe;AAAtB,kBACE,oBAAC,SAAD;AAAW,IAAA,SAAS,EAAEf,KAAK,CAACgB;AAA5B,IADF,CAXF,CADF,eAgBE;AAAM,IAAA,SAAS,EAAEhB,KAAK,CAACG;AAAvB,KAA+BA,KAA/B,CAhBF,CADF;AAoBD,CAjCD;;AAmCAF,iBAAiB,CAACgB,SAAlB,2CAA8B;AAC5Bd,EAAAA,KAAK,EAAEN,SAAS,CAACqB,MADW;AAE5Bd,EAAAA,IAAI,EAAEP,SAAS,CAACqB,MAFY;AAG5Bb,EAAAA,OAAO,EAAER,SAAS,CAACsB,IAHS;AAI5Bb,EAAAA,QAAQ,EAAET,SAAS,CAACuB,IAJQ;AAK5B,gBAAcvB,SAAS,CAACqB,MALI;AAM5B,eAAarB,SAAS,CAACqB;AANK,CAA9B;AAQA,eAAejB,iBAAf","sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, uniqueId} from 'lodash/fp';\nimport {NovaSolidStatusValidate as CheckIcon} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst CheckboxWithTitle = props => {\n  const {\n    title,\n    name,\n    checked,\n    onChange = noop,\n    'data-name': dataName,\n    'aria-label': ariaLabel\n  } = props;\n\n  const idCheckbox = uniqueId('input-checkbox-');\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n\n  return (\n    <div className={style.container}>\n      <label htmlFor={idCheckbox}>\n        <input\n          type=\"checkbox\"\n          id={idCheckbox}\n          name={name}\n          onChange={handleChange}\n          checked={checked}\n          className={style.checkbox}\n          data-name={dataName}\n          aria-label={ariaLabel}\n        />\n        <div className={style.label}>\n          <CheckIcon className={style.icon} />\n        </div>\n      </label>\n      <span className={style.title}>{title}</span>\n    </div>\n  );\n};\n\nCheckboxWithTitle.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  checked: PropTypes.bool,\n  onChange: PropTypes.func,\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string\n};\nexport default CheckboxWithTitle;\n"],"file":"index.js"}

package/es/atom/checkbox-with-title/style.css

@@ -26,7 +26,7 @@
 .container .title {
   font-family: "Gilroy";
   font-weight: bold;
-  font-size: 20px;
+  font-size: 18px;
   color: dark;
   min-height: 50px;
   display: flex;

package/es/molecule/review-card-congrats/style.css

@@ -4,6 +4,7 @@
 @value cm_blue_900 from colors;
 @value cm_positive_100 from colors;
 @value cm_yellow_secondary_200 from colors;
+@value white from colors;
 
 @keyframes fadeIn {
   0% {
@@ -41,6 +42,7 @@
   flex-direction: column;
   justify-content: center;
   width: 280px;
+  background-color: white; /* add background-color to resolve opacity on Firefox and stacking order on IE11 */
 }
 
 .cardStar {

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

@@ -2,6 +2,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 import React, { useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
+import AtomLottieWrapper from '../../atom/lottie-wrapper';
 import ButtonLink from '../../atom/button-link';
 import MoleculeReviewCardCongrats from '../../molecule/review-card-congrats';
 import style from './style.css';
@@ -16,6 +17,7 @@ const ReviewCongrats = props => {
   const {
     'aria-label': ariaLabel,
     'data-name': dataName,
+    animationLottie,
     title,
     cardCongratsStar,
     cardCongratsRank,
@@ -28,9 +30,18 @@ const ReviewCongrats = props => {
     return () => timer && clearTimeout(timer);
   }, []);
   return /*#__PURE__*/React.createElement("div", {
-    className: style.containerCongrats,
+    className: style.mainContainer,
     "aria-label": ariaLabel,
     "data-name": dataName
+  }, /*#__PURE__*/React.createElement(AtomLottieWrapper, _extends({}, animationLottie, {
+    loop: false,
+    animationControl: 'play',
+    autoplay: true,
+    "data-name": "lottie-wrapper",
+    className: style.lottie,
+    backupImageClassName: style.ie11Backup
+  })), /*#__PURE__*/React.createElement("div", {
+    className: style.containerCongrats
   }, /*#__PURE__*/React.createElement("div", {
     className: style.title
   }, title), /*#__PURE__*/React.createElement("div", {
@@ -48,12 +59,13 @@ const ReviewCongrats = props => {
     "data-name": "revise-skill-link"
   })), /*#__PURE__*/React.createElement(ButtonLink, _extends({}, buttonRevisingSkill, {
     className: style.buttonRevise
-  }))));
+  })))));
 };
 
 ReviewCongrats.propTypes = process.env.NODE_ENV !== "production" ? {
   'aria-label': PropTypes.string,
   'data-name': PropTypes.string,
+  animationLottie: PropTypes.shape(AtomLottieWrapper.propTypes),
   title: PropTypes.string,
   cardCongratsStar: PropTypes.shape(MoleculeReviewCardCongrats.propTypes),
   cardCongratsRank: PropTypes.shape(MoleculeReviewCardCongrats.propTypes),

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/organism/review-congrats/index.js"],"names":["React","useEffect","useRef","PropTypes","ButtonLink","MoleculeReviewCardCongrats","style","setScroll","container","current","scrollTo","left","behavior","ReviewCongrats","props","ariaLabel","dataName","title","cardCongratsStar","cardCongratsRank","buttonRevising","buttonRevisingSkill","timer","setTimeout","clearTimeout","containerCongrats","containerCards","cardStar","cardRank","buttonContainer","buttonRevise","propTypes","string","shape","label","onClick","func","type"],"mappings":"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","sourcesContent":["import React, {useEffect, useRef} from 'react';\nimport PropTypes from 'prop-types';\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    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.containerCongrats} aria-label={ariaLabel} data-name={dataName}>\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  );\n};\n\nReviewCongrats.propTypes = {\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string,\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":["React","useEffect","useRef","PropTypes","AtomLottieWrapper","ButtonLink","MoleculeReviewCardCongrats","style","setScroll","container","current","scrollTo","left","behavior","ReviewCongrats","props","ariaLabel","dataName","animationLottie","title","cardCongratsStar","cardCongratsRank","buttonRevising","buttonRevisingSkill","timer","setTimeout","clearTimeout","mainContainer","lottie","ie11Backup","containerCongrats","containerCards","cardStar","cardRank","buttonContainer","buttonRevise","propTypes","string","shape","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"}

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

@@ -1,7 +1,9 @@
 @value breakpoints: "../../variables/breakpoints.css";
+@value tablet from breakpoints;
 @value mobile from breakpoints;
 @value colors: "../../variables/colors.css";
 @value cm_blue_900 from colors;
+@value white from colors;
 
 @keyframes translateTitle {
   0% {
@@ -63,7 +65,35 @@
   }
 }
 
+.mainContainer {
+  height: 100%;
+  width: 100%;
+  position: relative;
+  overflow: hidden;
+}
+
+.lottie {
+  display: flex;
+  position: relative;
+  height: 135%;
+  width: 135%;
+  transform: translate(-13%, -13%);
+  z-index: 1;
+}
+
+.ie11Backup {
+  position: relative;
+  transform: translate(0%, 10%);
+  height: 80%;
+  width: 80%;
+  margin: 0 auto;
+  z-index: 1;
+}
+
 .containerCongrats {
+  position: absolute;
+  top: 0;
+  left: 0;
   align-items: center;
   display: flex;
   flex-direction: column;
@@ -71,7 +101,7 @@
   overflow-y: auto;
   height: 100%;
   width: 100%;
-  position: absolute;
+  z-index: 2;
 }
 
 .title {
@@ -84,6 +114,7 @@
   top: 200px;
   user-select: none;
   animation: translateTitle 1.4s ease-out 0s forwards;
+  background-color: white;
 }
 
 .containerCards {
@@ -134,6 +165,20 @@ _:-ms-fullscreen,
   padding: 12px 16px;
 }
 
+@media tablet {
+  .lottie {
+    height: 195%;
+    width: 195%;
+    transform: translate(-25%, -25%);
+  }
+
+  .ie11Backup {
+    height: 60%;
+    width: 60%;
+    transform: translate(0%, 30%);
+  }
+}
+
 @media mobile {
   @keyframes translateTitle {
     0% {
@@ -175,11 +220,24 @@ _:-ms-fullscreen,
     }
   }
 
-  .containerCongrats {
-    width: 100%;
+  .mainContainer {
     height: 100%;
-    overflow-x: hidden;
-    overflow-y: auto;
+    width: 100%;
+    overflow: hidden;
+    position: relative;
+    z-index: 3;
+  }
+
+  .lottie {
+    height: 410%;
+    width: 410%;
+    transform: translate(-38%, -38%);
+  }
+
+  .ie11Backup {
+    height: 85%;
+    width: 85%;
+    transform: translate(-35%, 10%);
   }
 
   .title {
@@ -196,6 +254,12 @@ _:-ms-fullscreen,
     padding-bottom: 10px;
   }
 
+  /* ie fallback */
+  _:-ms-fullscreen,
+  :root .containerCards {
+    margin-top: 80px;
+  }
+
   .cardStar {
     animation: translateYCardStar 0.6s ease-out 0.8s forwards,
       translateXCardStar 0.2s ease-in-out 2s forwards;

package/es/organism/review-congrats/test/fixtures/default.js

@@ -1,8 +1,15 @@
+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 animationLottie from '../../../../atom/lottie-wrapper/test/fixtures/confetti';
 import moleculeReviewCardStar from '../../../../molecule/review-card-congrats/test/fixtures/star';
 import moleculeReviewCardRank from '../../../../molecule/review-card-congrats/test/fixtures/rank';
 export const defaultProps = {
   'aria-label': 'Review Congratulations',
   'data-name': 'review-congrats',
+  animationLottie: _extends(_extends({}, animationLottie.props), {}, {
+    height: undefined,
+    width: undefined
+  }),
   title: 'Congratulations!',
   cardCongratsStar: moleculeReviewCardStar.props,
   cardCongratsRank: moleculeReviewCardRank.props,

package/es/organism/review-congrats/test/fixtures/default.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/organism/review-congrats/test/fixtures/default.js"],"names":["moleculeReviewCardStar","moleculeReviewCardRank","defaultProps","title","cardCongratsStar","props","cardCongratsRank","buttonRevising","label","onClick","console","log","type","buttonRevisingSkill"],"mappings":"AAAA,OAAOA,sBAAP,MAAmC,8DAAnC;AACA,OAAOC,sBAAP,MAAmC,8DAAnC;AAEA,OAAO,MAAMC,YAAY,GAAG;AAC1B,gBAAc,wBADY;AAE1B,eAAa,iBAFa;AAG1BC,EAAAA,KAAK,EAAE,kBAHmB;AAI1BC,EAAAA,gBAAgB,EAAEJ,sBAAsB,CAACK,KAJf;AAK1BC,EAAAA,gBAAgB,EAAEL,sBAAsB,CAACI,KALf;AAM1BE,EAAAA,cAAc,EAAE;AACd,kBAAc,0BADA;AAEdC,IAAAA,KAAK,EAAE,mBAFO;AAGdC,IAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,mBAAZ,CAHD;AAIdC,IAAAA,IAAI,EAAE;AAJQ,GANU;AAY1BC,EAAAA,mBAAmB,EAAE;AACnBL,IAAAA,KAAK,EAAE,sBADY;AAEnB,kBAAc,6BAFK;AAGnBC,IAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,sBAAZ,CAHI;AAInBC,IAAAA,IAAI,EAAE;AAJa;AAZK,CAArB;AAoBP,eAAe;AAACP,EAAAA,KAAK,EAAEH;AAAR,CAAf","sourcesContent":["import moleculeReviewCardStar from '../../../../molecule/review-card-congrats/test/fixtures/star';\nimport moleculeReviewCardRank from '../../../../molecule/review-card-congrats/test/fixtures/rank';\n\nexport const defaultProps = {\n  'aria-label': 'Review Congratulations',\n  'data-name': 'review-congrats',\n  title: 'Congratulations!',\n  cardCongratsStar: moleculeReviewCardStar.props,\n  cardCongratsRank: moleculeReviewCardRank.props,\n  buttonRevising: {\n    'aria-label': 'Continue revising button',\n    label: 'Continue revising',\n    onClick: () => console.log('Continue revising'),\n    type: 'tertiary'\n  },\n  buttonRevisingSkill: {\n    label: 'Revise another skill',\n    'aria-label': 'Revise another skill button',\n    onClick: () => console.log('Revise another skill'),\n    type: 'primary'\n  }\n};\n\nexport default {props: defaultProps};\n"],"file":"default.js"}
+{"version":3,"sources":["../../../../../src/organism/review-congrats/test/fixtures/default.js"],"names":["animationLottie","moleculeReviewCardStar","moleculeReviewCardRank","defaultProps","props","height","undefined","width","title","cardCongratsStar","cardCongratsRank","buttonRevising","label","onClick","console","log","type","buttonRevisingSkill"],"mappings":";;AAAA,OAAOA,eAAP,MAA4B,wDAA5B;AACA,OAAOC,sBAAP,MAAmC,8DAAnC;AACA,OAAOC,sBAAP,MAAmC,8DAAnC;AAEA,OAAO,MAAMC,YAAY,GAAG;AAC1B,gBAAc,wBADY;AAE1B,eAAa,iBAFa;AAG1BH,EAAAA,eAAe,wBAAMA,eAAe,CAACI,KAAtB;AAA6BC,IAAAA,MAAM,EAAEC,SAArC;AAAgDC,IAAAA,KAAK,EAAED;AAAvD,IAHW;AAI1BE,EAAAA,KAAK,EAAE,kBAJmB;AAK1BC,EAAAA,gBAAgB,EAAER,sBAAsB,CAACG,KALf;AAM1BM,EAAAA,gBAAgB,EAAER,sBAAsB,CAACE,KANf;AAO1BO,EAAAA,cAAc,EAAE;AACd,kBAAc,0BADA;AAEdC,IAAAA,KAAK,EAAE,mBAFO;AAGdC,IAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,mBAAZ,CAHD;AAIdC,IAAAA,IAAI,EAAE;AAJQ,GAPU;AAa1BC,EAAAA,mBAAmB,EAAE;AACnBL,IAAAA,KAAK,EAAE,sBADY;AAEnB,kBAAc,6BAFK;AAGnBC,IAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,sBAAZ,CAHI;AAInBC,IAAAA,IAAI,EAAE;AAJa;AAbK,CAArB;AAqBP,eAAe;AAACZ,EAAAA,KAAK,EAAED;AAAR,CAAf","sourcesContent":["import animationLottie from '../../../../atom/lottie-wrapper/test/fixtures/confetti';\nimport moleculeReviewCardStar from '../../../../molecule/review-card-congrats/test/fixtures/star';\nimport moleculeReviewCardRank from '../../../../molecule/review-card-congrats/test/fixtures/rank';\n\nexport const defaultProps = {\n  'aria-label': 'Review Congratulations',\n  'data-name': 'review-congrats',\n  animationLottie: {...animationLottie.props, height: undefined, width: undefined},\n  title: 'Congratulations!',\n  cardCongratsStar: moleculeReviewCardStar.props,\n  cardCongratsRank: moleculeReviewCardRank.props,\n  buttonRevising: {\n    'aria-label': 'Continue revising button',\n    label: 'Continue revising',\n    onClick: () => console.log('Continue revising'),\n    type: 'tertiary'\n  },\n  buttonRevisingSkill: {\n    label: 'Revise another skill',\n    'aria-label': 'Revise another skill button',\n    onClick: () => console.log('Revise another skill'),\n    type: 'primary'\n  }\n};\n\nexport default {props: defaultProps};\n"],"file":"default.js"}

package/lib/atom/checkbox-with-title/index.js

@@ -32,8 +32,9 @@ const CheckboxWithTitle = props => {
   } = props;
   const idCheckbox = (0, _uniqueId2.default)('input-checkbox-');
   const handleChange = (0, _react.useMemo)(() => e => onChange(e.target.checked), [onChange]);
-  return /*#__PURE__*/_react.default.createElement("label", {
-    className: _style.default.container,
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.container
+  }, /*#__PURE__*/_react.default.createElement("label", {
     htmlFor: idCheckbox
   }, /*#__PURE__*/_react.default.createElement("input", {
     type: "checkbox",
@@ -48,7 +49,7 @@ const CheckboxWithTitle = props => {
     className: _style.default.label
   }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaSolidStatusValidate, {
     className: _style.default.icon
-  })), /*#__PURE__*/_react.default.createElement("span", {
+  }))), /*#__PURE__*/_react.default.createElement("span", {
     className: _style.default.title
   }, title));
 };

package/lib/atom/checkbox-with-title/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/atom/checkbox-with-title/index.js"],"names":["CheckboxWithTitle","props","title","name","checked","onChange","dataName","ariaLabel","idCheckbox","handleChange","e","target","style","container","checkbox","label","icon","propTypes","PropTypes","string","bool","func"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;;;;;AAEA,MAAMA,iBAAiB,GAAGC,KAAK,IAAI;AACjC,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,IAFI;AAGJC,IAAAA,OAHI;AAIJC,IAAAA,QAAQ,iBAJJ;AAKJ,iBAAaC,QALT;AAMJ,kBAAcC;AANV,MAOFN,KAPJ;AASA,QAAMO,UAAU,GAAG,wBAAS,iBAAT,CAAnB;AACA,QAAMC,YAAY,GAAG,oBAAQ,MAAMC,CAAC,IAAIL,QAAQ,CAACK,CAAC,CAACC,MAAF,CAASP,OAAV,CAA3B,EAA+C,CAACC,QAAD,CAA/C,CAArB;AAEA,sBACE;AAAO,IAAA,SAAS,EAAEO,eAAMC,SAAxB;AAAmC,IAAA,OAAO,EAAEL;AAA5C,kBACE;AACE,IAAA,IAAI,EAAC,UADP;AAEE,IAAA,EAAE,EAAEA,UAFN;AAGE,IAAA,IAAI,EAAEL,IAHR;AAIE,IAAA,QAAQ,EAAEM,YAJZ;AAKE,IAAA,OAAO,EAAEL,OALX;AAME,IAAA,SAAS,EAAEQ,eAAME,QANnB;AAOE,iBAAWR,QAPb;AAQE,kBAAYC;AARd,IADF,eAWE;AAAK,IAAA,SAAS,EAAEK,eAAMG;AAAtB,kBACE,6BAAC,kCAAD;AAAW,IAAA,SAAS,EAAEH,eAAMI;AAA5B,IADF,CAXF,eAcE;AAAM,IAAA,SAAS,EAAEJ,eAAMV;AAAvB,KAA+BA,KAA/B,CAdF,CADF;AAkBD,CA/BD;;AAiCAF,iBAAiB,CAACiB,SAAlB,2CAA8B;AAC5Bf,EAAAA,KAAK,EAAEgB,mBAAUC,MADW;AAE5BhB,EAAAA,IAAI,EAAEe,mBAAUC,MAFY;AAG5Bf,EAAAA,OAAO,EAAEc,mBAAUE,IAHS;AAI5Bf,EAAAA,QAAQ,EAAEa,mBAAUG,IAJQ;AAK5B,gBAAcH,mBAAUC,MALI;AAM5B,eAAaD,mBAAUC;AANK,CAA9B;eAQenB,iB","sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, uniqueId} from 'lodash/fp';\nimport {NovaSolidStatusValidate as CheckIcon} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst CheckboxWithTitle = props => {\n  const {\n    title,\n    name,\n    checked,\n    onChange = noop,\n    'data-name': dataName,\n    'aria-label': ariaLabel\n  } = props;\n\n  const idCheckbox = uniqueId('input-checkbox-');\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n\n  return (\n    <label className={style.container} htmlFor={idCheckbox}>\n      <input\n        type=\"checkbox\"\n        id={idCheckbox}\n        name={name}\n        onChange={handleChange}\n        checked={checked}\n        className={style.checkbox}\n        data-name={dataName}\n        aria-label={ariaLabel}\n      />\n      <div className={style.label}>\n        <CheckIcon className={style.icon} />\n      </div>\n      <span className={style.title}>{title}</span>\n    </label>\n  );\n};\n\nCheckboxWithTitle.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  checked: PropTypes.bool,\n  onChange: PropTypes.func,\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string\n};\nexport default CheckboxWithTitle;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/atom/checkbox-with-title/index.js"],"names":["CheckboxWithTitle","props","title","name","checked","onChange","dataName","ariaLabel","idCheckbox","handleChange","e","target","style","container","checkbox","label","icon","propTypes","PropTypes","string","bool","func"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;;;;;AAEA,MAAMA,iBAAiB,GAAGC,KAAK,IAAI;AACjC,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,IAFI;AAGJC,IAAAA,OAHI;AAIJC,IAAAA,QAAQ,iBAJJ;AAKJ,iBAAaC,QALT;AAMJ,kBAAcC;AANV,MAOFN,KAPJ;AASA,QAAMO,UAAU,GAAG,wBAAS,iBAAT,CAAnB;AACA,QAAMC,YAAY,GAAG,oBAAQ,MAAMC,CAAC,IAAIL,QAAQ,CAACK,CAAC,CAACC,MAAF,CAASP,OAAV,CAA3B,EAA+C,CAACC,QAAD,CAA/C,CAArB;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEO,eAAMC;AAAtB,kBACE;AAAO,IAAA,OAAO,EAAEL;AAAhB,kBACE;AACE,IAAA,IAAI,EAAC,UADP;AAEE,IAAA,EAAE,EAAEA,UAFN;AAGE,IAAA,IAAI,EAAEL,IAHR;AAIE,IAAA,QAAQ,EAAEM,YAJZ;AAKE,IAAA,OAAO,EAAEL,OALX;AAME,IAAA,SAAS,EAAEQ,eAAME,QANnB;AAOE,iBAAWR,QAPb;AAQE,kBAAYC;AARd,IADF,eAWE;AAAK,IAAA,SAAS,EAAEK,eAAMG;AAAtB,kBACE,6BAAC,kCAAD;AAAW,IAAA,SAAS,EAAEH,eAAMI;AAA5B,IADF,CAXF,CADF,eAgBE;AAAM,IAAA,SAAS,EAAEJ,eAAMV;AAAvB,KAA+BA,KAA/B,CAhBF,CADF;AAoBD,CAjCD;;AAmCAF,iBAAiB,CAACiB,SAAlB,2CAA8B;AAC5Bf,EAAAA,KAAK,EAAEgB,mBAAUC,MADW;AAE5BhB,EAAAA,IAAI,EAAEe,mBAAUC,MAFY;AAG5Bf,EAAAA,OAAO,EAAEc,mBAAUE,IAHS;AAI5Bf,EAAAA,QAAQ,EAAEa,mBAAUG,IAJQ;AAK5B,gBAAcH,mBAAUC,MALI;AAM5B,eAAaD,mBAAUC;AANK,CAA9B;eAQenB,iB","sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, uniqueId} from 'lodash/fp';\nimport {NovaSolidStatusValidate as CheckIcon} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst CheckboxWithTitle = props => {\n  const {\n    title,\n    name,\n    checked,\n    onChange = noop,\n    'data-name': dataName,\n    'aria-label': ariaLabel\n  } = props;\n\n  const idCheckbox = uniqueId('input-checkbox-');\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n\n  return (\n    <div className={style.container}>\n      <label htmlFor={idCheckbox}>\n        <input\n          type=\"checkbox\"\n          id={idCheckbox}\n          name={name}\n          onChange={handleChange}\n          checked={checked}\n          className={style.checkbox}\n          data-name={dataName}\n          aria-label={ariaLabel}\n        />\n        <div className={style.label}>\n          <CheckIcon className={style.icon} />\n        </div>\n      </label>\n      <span className={style.title}>{title}</span>\n    </div>\n  );\n};\n\nCheckboxWithTitle.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  checked: PropTypes.bool,\n  onChange: PropTypes.func,\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string\n};\nexport default CheckboxWithTitle;\n"],"file":"index.js"}

package/lib/atom/checkbox-with-title/style.css

@@ -26,7 +26,7 @@
 .container .title {
   font-family: "Gilroy";
   font-weight: bold;
-  font-size: 20px;
+  font-size: 18px;
   color: dark;
   min-height: 50px;
   display: flex;

package/lib/molecule/review-card-congrats/style.css

@@ -4,6 +4,7 @@
 @value cm_blue_900 from colors;
 @value cm_positive_100 from colors;
 @value cm_yellow_secondary_200 from colors;
+@value white from colors;
 
 @keyframes fadeIn {
   0% {
@@ -41,6 +42,7 @@
   flex-direction: column;
   justify-content: center;
   width: 280px;
+  background-color: white; /* add background-color to resolve opacity on Firefox and stacking order on IE11 */
 }
 
 .cardStar {

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

@@ -7,6 +7,8 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _lottieWrapper = _interopRequireDefault(require("../../atom/lottie-wrapper"));
+
 var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
 
 var _reviewCardCongrats = _interopRequireDefault(require("../../molecule/review-card-congrats"));
@@ -34,6 +36,7 @@ const ReviewCongrats = props => {
   const {
     'aria-label': ariaLabel,
     'data-name': dataName,
+    animationLottie,
     title,
     cardCongratsStar,
     cardCongratsRank,
@@ -46,9 +49,18 @@ const ReviewCongrats = props => {
     return () => timer && clearTimeout(timer);
   }, []);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.containerCongrats,
+    className: _style.default.mainContainer,
     "aria-label": ariaLabel,
     "data-name": dataName
+  }, /*#__PURE__*/_react.default.createElement(_lottieWrapper.default, _extends({}, animationLottie, {
+    loop: false,
+    animationControl: 'play',
+    autoplay: true,
+    "data-name": "lottie-wrapper",
+    className: _style.default.lottie,
+    backupImageClassName: _style.default.ie11Backup
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.containerCongrats
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.title
   }, title), /*#__PURE__*/_react.default.createElement("div", {
@@ -66,12 +78,13 @@ const ReviewCongrats = props => {
     "data-name": "revise-skill-link"
   })), /*#__PURE__*/_react.default.createElement(_buttonLink.default, _extends({}, buttonRevisingSkill, {
     className: _style.default.buttonRevise
-  }))));
+  })))));
 };
 
 ReviewCongrats.propTypes = process.env.NODE_ENV !== "production" ? {
   'aria-label': _propTypes.default.string,
   'data-name': _propTypes.default.string,
+  animationLottie: _propTypes.default.shape(_lottieWrapper.default.propTypes),
   title: _propTypes.default.string,
   cardCongratsStar: _propTypes.default.shape(_reviewCardCongrats.default.propTypes),
   cardCongratsRank: _propTypes.default.shape(_reviewCardCongrats.default.propTypes),

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","title","cardCongratsStar","cardCongratsRank","buttonRevising","buttonRevisingSkill","timer","setTimeout","clearTimeout","style","containerCongrats","containerCards","cardStar","cardRank","buttonContainer","buttonRevise","propTypes","PropTypes","string","shape","MoleculeReviewCardCongrats","label","onClick","func","type"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEO,MAAMA,SAAS,GAAGC,SAAS,IAAI,MAAM;AAC1CA,EAAAA,SAAS,CAACC,OAAV,CAAkBC,QAAlB,CAA2B;AACzBC,IAAAA,IAAI,EAAE,IADmB;AAEzBC,IAAAA,QAAQ,EAAE;AAFe,GAA3B;AAID,CALM;;;;AAOP,MAAMC,cAAc,GAAGC,KAAK,IAAI;AAC9B,QAAM;AACJ,kBAAcC,SADV;AAEJ,iBAAaC,QAFT;AAGJC,IAAAA,KAHI;AAIJC,IAAAA,gBAJI;AAKJC,IAAAA,gBALI;AAMJC,IAAAA,cANI;AAOJC,IAAAA;AAPI,MAQFP,KARJ;AAUA,QAAMN,SAAS,GAAG,mBAAO,IAAP,CAAlB;AAEA,wBAAU,MAAM;AACd,UAAMc,KAAK,GAAGC,UAAU,CAAChB,SAAS,CAACC,SAAD,CAAV,EAAuB,IAAvB,CAAxB;AACA,WAAO,MAAMc,KAAK,IAAIE,YAAY,CAACF,KAAD,CAAlC;AACD,GAHD,EAGG,EAHH;AAKA,sBACE;AAAK,IAAA,SAAS,EAAEG,eAAMC,iBAAtB;AAAyC,kBAAYX,SAArD;AAAgE,iBAAWC;AAA3E,kBACE;AAAK,IAAA,SAAS,EAAES,eAAMR;AAAtB,KAA8BA,KAA9B,CADF,eAEE;AAAK,IAAA,GAAG,EAAET,SAAV;AAAqB,IAAA,SAAS,EAAEiB,eAAME;AAAtC,kBACE,6BAAC,2BAAD,eAAgCT,gBAAhC;AAAkD,IAAA,SAAS,EAAEO,eAAMG;AAAnE,KADF,eAEE,6BAAC,2BAAD,eACMT,gBADN;AAEE,IAAA,cAAc,EAAE,IAFlB;AAGE,IAAA,SAAS,EAAEM,eAAMI;AAHnB,KAFF,CAFF,eAUE;AAAK,IAAA,SAAS,EAAEJ,eAAMK;AAAtB,kBACE,6BAAC,mBAAD,eACMV,cADN;AAEE,IAAA,SAAS,EAAEK,eAAMM,YAFnB;AAGE,iBAAU;AAHZ,KADF,eAME,6BAAC,mBAAD,eAAgBV,mBAAhB;AAAqC,IAAA,SAAS,EAAEI,eAAMM;AAAtD,KANF,CAVF,CADF;AAqBD,CAvCD;;AAyCAlB,cAAc,CAACmB,SAAf,2CAA2B;AACzB,gBAAcC,mBAAUC,MADC;AAEzB,eAAaD,mBAAUC,MAFE;AAGzBjB,EAAAA,KAAK,EAAEgB,mBAAUC,MAHQ;AAIzBhB,EAAAA,gBAAgB,EAAEe,mBAAUE,KAAV,CAAgBC,4BAA2BJ,SAA3C,CAJO;AAKzBb,EAAAA,gBAAgB,EAAEc,mBAAUE,KAAV,CAAgBC,4BAA2BJ,SAA3C,CALO;AAMzBZ,EAAAA,cAAc,EAAEa,mBAAUE,KAAV,CAAgB;AAC9BE,IAAAA,KAAK,EAAEJ,mBAAUC,MADa;AAE9BI,IAAAA,OAAO,EAAEL,mBAAUM,IAFW;AAG9BC,IAAAA,IAAI,EAAEP,mBAAUC;AAHc,GAAhB,CANS;AAWzBb,EAAAA,mBAAmB,EAAEY,mBAAUE,KAAV,CAAgB;AACnCE,IAAAA,KAAK,EAAEJ,mBAAUC,MADkB;AAEnCI,IAAAA,OAAO,EAAEL,mBAAUM,IAFgB;AAGnCC,IAAAA,IAAI,EAAEP,mBAAUC;AAHmB,GAAhB;AAXI,CAA3B;eAkBerB,c","sourcesContent":["import React, {useEffect, useRef} from 'react';\nimport PropTypes from 'prop-types';\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    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.containerCongrats} aria-label={ariaLabel} data-name={dataName}>\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  );\n};\n\nReviewCongrats.propTypes = {\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string,\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    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

@@ -1,7 +1,9 @@
 @value breakpoints: "../../variables/breakpoints.css";
+@value tablet from breakpoints;
 @value mobile from breakpoints;
 @value colors: "../../variables/colors.css";
 @value cm_blue_900 from colors;
+@value white from colors;
 
 @keyframes translateTitle {
   0% {
@@ -63,7 +65,35 @@
   }
 }
 
+.mainContainer {
+  height: 100%;
+  width: 100%;
+  position: relative;
+  overflow: hidden;
+}
+
+.lottie {
+  display: flex;
+  position: relative;
+  height: 135%;
+  width: 135%;
+  transform: translate(-13%, -13%);
+  z-index: 1;
+}
+
+.ie11Backup {
+  position: relative;
+  transform: translate(0%, 10%);
+  height: 80%;
+  width: 80%;
+  margin: 0 auto;
+  z-index: 1;
+}
+
 .containerCongrats {
+  position: absolute;
+  top: 0;
+  left: 0;
   align-items: center;
   display: flex;
   flex-direction: column;
@@ -71,7 +101,7 @@
   overflow-y: auto;
   height: 100%;
   width: 100%;
-  position: absolute;
+  z-index: 2;
 }
 
 .title {
@@ -84,6 +114,7 @@
   top: 200px;
   user-select: none;
   animation: translateTitle 1.4s ease-out 0s forwards;
+  background-color: white;
 }
 
 .containerCards {
@@ -134,6 +165,20 @@ _:-ms-fullscreen,
   padding: 12px 16px;
 }
 
+@media tablet {
+  .lottie {
+    height: 195%;
+    width: 195%;
+    transform: translate(-25%, -25%);
+  }
+
+  .ie11Backup {
+    height: 60%;
+    width: 60%;
+    transform: translate(0%, 30%);
+  }
+}
+
 @media mobile {
   @keyframes translateTitle {
     0% {
@@ -175,11 +220,24 @@ _:-ms-fullscreen,
     }
   }
 
-  .containerCongrats {
-    width: 100%;
+  .mainContainer {
     height: 100%;
-    overflow-x: hidden;
-    overflow-y: auto;
+    width: 100%;
+    overflow: hidden;
+    position: relative;
+    z-index: 3;
+  }
+
+  .lottie {
+    height: 410%;
+    width: 410%;
+    transform: translate(-38%, -38%);
+  }
+
+  .ie11Backup {
+    height: 85%;
+    width: 85%;
+    transform: translate(-35%, 10%);
   }
 
   .title {
@@ -196,6 +254,12 @@ _:-ms-fullscreen,
     padding-bottom: 10px;
   }
 
+  /* ie fallback */
+  _:-ms-fullscreen,
+  :root .containerCards {
+    margin-top: 80px;
+  }
+
   .cardStar {
     animation: translateYCardStar 0.6s ease-out 0.8s forwards,
       translateXCardStar 0.2s ease-in-out 2s forwards;

package/lib/organism/review-congrats/test/fixtures/default.js

@@ -3,15 +3,23 @@
 exports.__esModule = true;
 exports.default = exports.defaultProps = void 0;
 
+var _confetti = _interopRequireDefault(require("../../../../atom/lottie-wrapper/test/fixtures/confetti"));
+
 var _star = _interopRequireDefault(require("../../../../molecule/review-card-congrats/test/fixtures/star"));
 
 var _rank = _interopRequireDefault(require("../../../../molecule/review-card-congrats/test/fixtures/rank"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: 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 defaultProps = {
   'aria-label': 'Review Congratulations',
   'data-name': 'review-congrats',
+  animationLottie: _extends(_extends({}, _confetti.default.props), {}, {
+    height: undefined,
+    width: undefined
+  }),
   title: 'Congratulations!',
   cardCongratsStar: _star.default.props,
   cardCongratsRank: _rank.default.props,

package/lib/organism/review-congrats/test/fixtures/default.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/organism/review-congrats/test/fixtures/default.js"],"names":["defaultProps","title","cardCongratsStar","moleculeReviewCardStar","props","cardCongratsRank","moleculeReviewCardRank","buttonRevising","label","onClick","console","log","type","buttonRevisingSkill"],"mappings":";;;;;AAAA;;AACA;;;;AAEO,MAAMA,YAAY,GAAG;AAC1B,gBAAc,wBADY;AAE1B,eAAa,iBAFa;AAG1BC,EAAAA,KAAK,EAAE,kBAHmB;AAI1BC,EAAAA,gBAAgB,EAAEC,cAAuBC,KAJf;AAK1BC,EAAAA,gBAAgB,EAAEC,cAAuBF,KALf;AAM1BG,EAAAA,cAAc,EAAE;AACd,kBAAc,0BADA;AAEdC,IAAAA,KAAK,EAAE,mBAFO;AAGdC,IAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,mBAAZ,CAHD;AAIdC,IAAAA,IAAI,EAAE;AAJQ,GANU;AAY1BC,EAAAA,mBAAmB,EAAE;AACnBL,IAAAA,KAAK,EAAE,sBADY;AAEnB,kBAAc,6BAFK;AAGnBC,IAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,sBAAZ,CAHI;AAInBC,IAAAA,IAAI,EAAE;AAJa;AAZK,CAArB;;eAoBQ;AAACR,EAAAA,KAAK,EAAEJ;AAAR,C","sourcesContent":["import moleculeReviewCardStar from '../../../../molecule/review-card-congrats/test/fixtures/star';\nimport moleculeReviewCardRank from '../../../../molecule/review-card-congrats/test/fixtures/rank';\n\nexport const defaultProps = {\n  'aria-label': 'Review Congratulations',\n  'data-name': 'review-congrats',\n  title: 'Congratulations!',\n  cardCongratsStar: moleculeReviewCardStar.props,\n  cardCongratsRank: moleculeReviewCardRank.props,\n  buttonRevising: {\n    'aria-label': 'Continue revising button',\n    label: 'Continue revising',\n    onClick: () => console.log('Continue revising'),\n    type: 'tertiary'\n  },\n  buttonRevisingSkill: {\n    label: 'Revise another skill',\n    'aria-label': 'Revise another skill button',\n    onClick: () => console.log('Revise another skill'),\n    type: 'primary'\n  }\n};\n\nexport default {props: defaultProps};\n"],"file":"default.js"}
+{"version":3,"sources":["../../../../../src/organism/review-congrats/test/fixtures/default.js"],"names":["defaultProps","animationLottie","props","height","undefined","width","title","cardCongratsStar","moleculeReviewCardStar","cardCongratsRank","moleculeReviewCardRank","buttonRevising","label","onClick","console","log","type","buttonRevisingSkill"],"mappings":";;;;;AAAA;;AACA;;AACA;;;;;;AAEO,MAAMA,YAAY,GAAG;AAC1B,gBAAc,wBADY;AAE1B,eAAa,iBAFa;AAG1BC,EAAAA,eAAe,wBAAMA,kBAAgBC,KAAtB;AAA6BC,IAAAA,MAAM,EAAEC,SAArC;AAAgDC,IAAAA,KAAK,EAAED;AAAvD,IAHW;AAI1BE,EAAAA,KAAK,EAAE,kBAJmB;AAK1BC,EAAAA,gBAAgB,EAAEC,cAAuBN,KALf;AAM1BO,EAAAA,gBAAgB,EAAEC,cAAuBR,KANf;AAO1BS,EAAAA,cAAc,EAAE;AACd,kBAAc,0BADA;AAEdC,IAAAA,KAAK,EAAE,mBAFO;AAGdC,IAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,mBAAZ,CAHD;AAIdC,IAAAA,IAAI,EAAE;AAJQ,GAPU;AAa1BC,EAAAA,mBAAmB,EAAE;AACnBL,IAAAA,KAAK,EAAE,sBADY;AAEnB,kBAAc,6BAFK;AAGnBC,IAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,sBAAZ,CAHI;AAInBC,IAAAA,IAAI,EAAE;AAJa;AAbK,CAArB;;eAqBQ;AAACd,EAAAA,KAAK,EAAEF;AAAR,C","sourcesContent":["import animationLottie from '../../../../atom/lottie-wrapper/test/fixtures/confetti';\nimport moleculeReviewCardStar from '../../../../molecule/review-card-congrats/test/fixtures/star';\nimport moleculeReviewCardRank from '../../../../molecule/review-card-congrats/test/fixtures/rank';\n\nexport const defaultProps = {\n  'aria-label': 'Review Congratulations',\n  'data-name': 'review-congrats',\n  animationLottie: {...animationLottie.props, height: undefined, width: undefined},\n  title: 'Congratulations!',\n  cardCongratsStar: moleculeReviewCardStar.props,\n  cardCongratsRank: moleculeReviewCardRank.props,\n  buttonRevising: {\n    'aria-label': 'Continue revising button',\n    label: 'Continue revising',\n    onClick: () => console.log('Continue revising'),\n    type: 'tertiary'\n  },\n  buttonRevisingSkill: {\n    label: 'Revise another skill',\n    'aria-label': 'Revise another skill button',\n    onClick: () => console.log('Revise another skill'),\n    type: 'primary'\n  }\n};\n\nexport default {props: defaultProps};\n"],"file":"default.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "10.19.0",
+  "version": "10.19.1",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -50,7 +50,7 @@
     "Soualmi Djamel <djamel.soualmi@coorpacademy.com>"
   ],
   "dependencies": {
-    "@coorpacademy/nova-icons": "3.11.0",
+    "@coorpacademy/nova-icons": "3.11.1",
     "autoprefixer": "^9.8.0",
     "classnames": "^2.2.6",
     "css-color-function": "^1.3.3",
@@ -122,5 +122,5 @@
     "webpack-hot-middleware": "^2.25.0"
   },
   "author": "CoorpAcademy",
-  "gitHead": "3be3050e700db2d58de6759c1ec7de6869047209"
+  "gitHead": "01ca5ad70c6e5fb3e580f7bef5e0fc05d5524ef8"
 }