@coorpacademy/components 11.32.10 → 11.32.12-alpha.0

package/es/template/skill-detail/index.js

@@ -0,0 +1,219 @@
+import _get from "lodash/fp/get";
+import React, { useCallback, useState } from 'react';
+import PropTypes from 'prop-types';
+import { convert } from 'css-color-function';
+import classnames from 'classnames';
+import Provider from '../../atom/provider';
+import Select, { SelectOptionPropTypes } from '../../atom/select';
+import ButtonLink from '../../atom/button-link';
+import Icon from '../../atom/icon';
+import CardsGrid from '../../organism/cards-grid';
+import style from './style.css';
+import AllCourses from './all-courses';
+import ContinueLearning from './continue-learning';
+
+const ContinueLearningButton = (props, context) => {
+  const [hovered, setHovered] = useState(false);
+  const {
+    onClick
+  } = props;
+  const {
+    skin,
+    translate
+  } = context;
+
+  const primarySkinColor = _get('common.primary', skin);
+
+  const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);
+  const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);
+  return /*#__PURE__*/React.createElement("div", {
+    onMouseOver: handleMouseOver,
+    onMouseLeave: handleMouseLeave
+  }, /*#__PURE__*/React.createElement(ButtonLink, {
+    label: translate('continue_learning'),
+    type: "primary",
+    customStyle: {
+      width: 'fit-content',
+      borderRadius: '12px',
+      backgroundColor: hovered ? convert(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`) : primarySkinColor
+    },
+    icon: {
+      position: 'left',
+      faIcon: {
+        name: 'play',
+        color: '#FFFFFF',
+        size: 16
+      }
+    },
+    onClick: onClick
+  }));
+};
+
+ContinueLearningButton.contextTypes = {
+  skin: Provider.childContextTypes.skin,
+  translate: Provider.childContextTypes.translate
+};
+ContinueLearningButton.propTypes = process.env.NODE_ENV !== "production" ? {
+  onClick: PropTypes.func
+} : {};
+
+const SkillDetail = (props, context) => {
+  const {
+    title,
+    description,
+    metrics,
+    focused,
+    availableForReview,
+    ongoingCourses,
+    skillIncludedCourses,
+    filters,
+    sorting,
+    onBackClick,
+    onReviewClick,
+    onContinueLearningClick
+  } = props;
+  const {
+    score,
+    content,
+    questionsToReview,
+    contentCompleted = 0
+  } = metrics;
+  const {
+    translate
+  } = context;
+  const [showMore, setShowMore] = useState(false);
+  const handleShowMore = useCallback(() => setShowMore(!showMore), [setShowMore, showMore]);
+  const Description = useCallback(() => {
+    return /*#__PURE__*/React.createElement("div", {
+      className: classnames(style.description, !showMore && style.truncate)
+    }, description);
+  });
+  const ProgressBar = useCallback(() => {
+    if (score === undefined) return null;
+    const progressBarColor = '#3EC483';
+    const inlineProgressValueStyle = {
+      backgroundColor: progressBarColor,
+      width: `${score}%`
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      className: style.progressBarWrapper
+    }, /*#__PURE__*/React.createElement("div", {
+      "data-name": "progress",
+      className: style.progress,
+      style: inlineProgressValueStyle,
+      role: "progressbar"
+    }));
+  }, [score]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: style.backgroundContainer
+  }, /*#__PURE__*/React.createElement("div", {
+    className: style.container
+  }, /*#__PURE__*/React.createElement("div", {
+    className: style.backButtonWrapper,
+    onClick: onBackClick
+  }, /*#__PURE__*/React.createElement(Icon, {
+    iconName: "arrow-left",
+    size: {
+      faSize: 14,
+      wrapperSize: 14
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    className: style.ctaContainer
+  }, /*#__PURE__*/React.createElement("div", null, focused ? /*#__PURE__*/React.createElement("div", {
+    className: style.skillFocusBadge
+  }, /*#__PURE__*/React.createElement(Icon, {
+    iconName: "bullseye-arrow",
+    backgroundColor: "#DDD1FF",
+    size: {
+      faSize: 10,
+      wrapperSize: 16
+    }
+  }), translate('skill_focus')) : null, /*#__PURE__*/React.createElement("div", {
+    className: style.title
+  }, title), description ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Description, null), description.length >= 226 ? /*#__PURE__*/React.createElement("div", {
+    className: style.showMoreWrapper,
+    onClick: handleShowMore
+  }, showMore ? translate('Show less') : translate('Show more'), /*#__PURE__*/React.createElement(Icon, {
+    iconName: showMore ? 'chevron-up' : 'chevron-down',
+    size: {
+      faSize: 14,
+      wrapperSize: 16
+    }
+  })) : null) : null), /*#__PURE__*/React.createElement("div", {
+    className: style.ctaWrapper
+  }, /*#__PURE__*/React.createElement(ButtonLink, {
+    type: "secondary",
+    onClick: onReviewClick,
+    label: translate('review_this_skill'),
+    disabled: !availableForReview,
+    customStyle: {
+      width: 'fit-content',
+      borderRadius: '12px'
+    }
+  }), /*#__PURE__*/React.createElement(ContinueLearningButton, {
+    onClick: onContinueLearningClick
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: style.progressInformationsWrapper
+  }, /*#__PURE__*/React.createElement("div", {
+    className: style.progressTitle
+  }, translate('your_progress')), /*#__PURE__*/React.createElement("div", {
+    className: style.skillCoursesAndQuestionsWrapper
+  }, content ? /*#__PURE__*/React.createElement("div", {
+    className: style.skillInformation,
+    "data-name": "skill-courses"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: style.skillInformationNumber
+  }, content), ' ', translate('courses')) : null, questionsToReview ? /*#__PURE__*/React.createElement("div", {
+    className: style.skillInformation,
+    "data-name": "skill-questions"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: style.skillInformationNumber
+  }, questionsToReview), "\xA0", translate('questions')) : null), /*#__PURE__*/React.createElement(ProgressBar, null), /*#__PURE__*/React.createElement("div", {
+    className: style.progressInformations
+  }, content && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: style.progressInformation,
+    "data-name": "skill-completed-courses"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: style.progressInformationNumber
+  }, contentCompleted), ` ${translate('courses_completed')}`), /*#__PURE__*/React.createElement("div", {
+    className: style.progressInformation,
+    "data-name": "completed-percentage"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: style.progressInformationNumber
+  }, score, "%"))))), /*#__PURE__*/React.createElement(ContinueLearning, {
+    ongoingCourses: ongoingCourses
+  }), /*#__PURE__*/React.createElement(AllCourses, {
+    skillIncludedCourses: skillIncludedCourses,
+    filters: filters,
+    sorting: sorting
+  })));
+};
+
+SkillDetail.contextTypes = {
+  skin: Provider.childContextTypes.skin,
+  translate: Provider.childContextTypes.translate
+};
+SkillDetail.propTypes = process.env.NODE_ENV !== "production" ? {
+  title: PropTypes.string.isRequired,
+  description: PropTypes.string,
+  metrics: PropTypes.shape({
+    score: PropTypes.number,
+    content: PropTypes.number,
+    questionsToReview: PropTypes.number,
+    contentCompleted: PropTypes.number
+  }),
+  focused: PropTypes.bool,
+  availableForReview: PropTypes.bool,
+  ongoingCourses: PropTypes.shape(CardsGrid.propTypes),
+  skillIncludedCourses: PropTypes.shape(CardsGrid.propTypes),
+  filters: PropTypes.shape({
+    onChange: PropTypes.func,
+    options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))
+  }),
+  sorting: PropTypes.shape(Select.propTypes),
+  onBackClick: PropTypes.func,
+  onReviewClick: PropTypes.func,
+  onContinueLearningClick: PropTypes.func
+} : {};
+export default SkillDetail;
+//# sourceMappingURL=index.js.map

package/es/template/skill-detail/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React","useCallback","useState","PropTypes","convert","classnames","Provider","Select","SelectOptionPropTypes","ButtonLink","Icon","CardsGrid","style","AllCourses","ContinueLearning","ContinueLearningButton","props","context","hovered","setHovered","onClick","skin","translate","primarySkinColor","handleMouseOver","handleMouseLeave","width","borderRadius","backgroundColor","position","faIcon","name","color","size","contextTypes","childContextTypes","propTypes","func","SkillDetail","title","description","metrics","focused","availableForReview","ongoingCourses","skillIncludedCourses","filters","sorting","onBackClick","onReviewClick","onContinueLearningClick","score","content","questionsToReview","contentCompleted","showMore","setShowMore","handleShowMore","Description","truncate","ProgressBar","undefined","progressBarColor","inlineProgressValueStyle","progressBarWrapper","progress","backgroundContainer","container","backButtonWrapper","faSize","wrapperSize","ctaContainer","skillFocusBadge","length","showMoreWrapper","ctaWrapper","progressInformationsWrapper","progressTitle","skillCoursesAndQuestionsWrapper","skillInformation","skillInformationNumber","progressInformations","progressInformation","progressInformationNumber","string","isRequired","shape","number","bool","onChange","options","arrayOf"],"sources":["../../../src/template/skill-detail/index.js"],"sourcesContent":["import React, {useCallback, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport classnames from 'classnames';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Select, {SelectOptionPropTypes} from '../../atom/select';\nimport ButtonLink from '../../atom/button-link';\nimport Icon from '../../atom/icon';\nimport CardsGrid from '../../organism/cards-grid';\nimport style from './style.css';\nimport AllCourses from './all-courses';\nimport ContinueLearning from './continue-learning';\n\nconst ContinueLearningButton = (props, context) => {\n  const [hovered, setHovered] = useState(false);\n  const {onClick} = props;\n  const {skin, translate} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n  const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n  return (\n    <div onMouseOver={handleMouseOver} onMouseLeave={handleMouseLeave}>\n      <ButtonLink\n        label={translate('continue_learning')}\n        type=\"primary\"\n        customStyle={{\n          width: 'fit-content',\n          borderRadius: '12px',\n          backgroundColor: hovered\n            ? convert(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`)\n            : primarySkinColor\n        }}\n        icon={{\n          position: 'left',\n          faIcon: {\n            name: 'play',\n            color: '#FFFFFF',\n            size: 16\n          }\n        }}\n        onClick={onClick}\n      />\n    </div>\n  );\n};\n\nContinueLearningButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nContinueLearningButton.propTypes = {\n  onClick: PropTypes.func\n};\n\nconst SkillDetail = (props, context) => {\n  const {\n    title,\n    description,\n    metrics,\n    focused,\n    availableForReview,\n    ongoingCourses,\n    skillIncludedCourses,\n    filters,\n    sorting,\n    onBackClick,\n    onReviewClick,\n    onContinueLearningClick\n  } = props;\n  const {score, content, questionsToReview, contentCompleted = 0} = metrics;\n  const {translate} = context;\n\n  const [showMore, setShowMore] = useState(false);\n\n  const handleShowMore = useCallback(() => setShowMore(!showMore), [setShowMore, showMore]);\n\n  const Description = useCallback(() => {\n    return (\n      <div className={classnames(style.description, !showMore && style.truncate)}>\n        {description}\n      </div>\n    );\n  });\n\n  const ProgressBar = useCallback(() => {\n    if (score === undefined) return null;\n    const progressBarColor = '#3EC483';\n    const inlineProgressValueStyle = {\n      backgroundColor: progressBarColor,\n      width: `${score}%`\n    };\n\n    return (\n      <div className={style.progressBarWrapper}>\n        <div\n          data-name=\"progress\"\n          className={style.progress}\n          style={inlineProgressValueStyle}\n          role=\"progressbar\"\n        />\n      </div>\n    );\n  }, [score]);\n\n  return (\n    <div className={style.backgroundContainer}>\n      <div className={style.container}>\n        <div className={style.backButtonWrapper} onClick={onBackClick}>\n          <Icon\n            iconName=\"arrow-left\"\n            size={{\n              faSize: 14,\n              wrapperSize: 14\n            }}\n          />\n        </div>\n        <div className={style.ctaContainer}>\n          <div>\n            {focused ? (\n              <div className={style.skillFocusBadge}>\n                <Icon\n                  iconName=\"bullseye-arrow\"\n                  backgroundColor=\"#DDD1FF\"\n                  size={{\n                    faSize: 10,\n                    wrapperSize: 16\n                  }}\n                />\n                {translate('skill_focus')}\n              </div>\n            ) : null}\n            <div className={style.title}>{title}</div>\n            {description ? (\n              <>\n                <Description />\n                {description.length >= 226 ? (\n                  <div className={style.showMoreWrapper} onClick={handleShowMore}>\n                    {showMore ? translate('Show less') : translate('Show more')}\n                    <Icon\n                      iconName={showMore ? 'chevron-up' : 'chevron-down'}\n                      size={{\n                        faSize: 14,\n                        wrapperSize: 16\n                      }}\n                    />\n                  </div>\n                ) : null}\n              </>\n            ) : null}\n          </div>\n\n          <div className={style.ctaWrapper}>\n            <ButtonLink\n              type=\"secondary\"\n              onClick={onReviewClick}\n              label={translate('review_this_skill')}\n              disabled={!availableForReview}\n              customStyle={{\n                width: 'fit-content',\n                borderRadius: '12px'\n              }}\n            />\n            <ContinueLearningButton onClick={onContinueLearningClick} />\n          </div>\n        </div>\n        <div className={style.progressInformationsWrapper}>\n          <div className={style.progressTitle}>{translate('your_progress')}</div>\n          <div className={style.skillCoursesAndQuestionsWrapper}>\n            {content ? (\n              <div className={style.skillInformation} data-name=\"skill-courses\">\n                <span className={style.skillInformationNumber}>{content}</span>{' '}\n                {translate('courses')}\n              </div>\n            ) : null}\n            {questionsToReview ? (\n              <div className={style.skillInformation} data-name=\"skill-questions\">\n                <span className={style.skillInformationNumber}>{questionsToReview}</span>\n                &nbsp;{translate('questions')}\n              </div>\n            ) : null}\n          </div>\n          <ProgressBar />\n          <div className={style.progressInformations}>\n            {content && (\n              <>\n                <div className={style.progressInformation} data-name=\"skill-completed-courses\">\n                  <span className={style.progressInformationNumber}>{contentCompleted}</span>\n                  {` ${translate('courses_completed')}`}\n                </div>\n                <div className={style.progressInformation} data-name=\"completed-percentage\">\n                  <span className={style.progressInformationNumber}>{score}%</span>\n                </div>\n              </>\n            )}\n          </div>\n        </div>\n        <ContinueLearning ongoingCourses={ongoingCourses} />\n        <AllCourses\n          skillIncludedCourses={skillIncludedCourses}\n          filters={filters}\n          sorting={sorting}\n        />\n      </div>\n    </div>\n  );\n};\n\nSkillDetail.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nSkillDetail.propTypes = {\n  title: PropTypes.string.isRequired,\n  description: PropTypes.string,\n  metrics: PropTypes.shape({\n    score: PropTypes.number,\n    content: PropTypes.number,\n    questionsToReview: PropTypes.number,\n    contentCompleted: PropTypes.number\n  }),\n  focused: PropTypes.bool,\n  availableForReview: PropTypes.bool,\n  ongoingCourses: PropTypes.shape(CardsGrid.propTypes),\n  skillIncludedCourses: PropTypes.shape(CardsGrid.propTypes),\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n  }),\n  sorting: PropTypes.shape(Select.propTypes),\n  onBackClick: PropTypes.func,\n  onReviewClick: PropTypes.func,\n  onContinueLearningClick: PropTypes.func\n};\n\nexport default SkillDetail;\n"],"mappings":";AAAA,OAAOA,KAAP,IAAeC,WAAf,EAA4BC,QAA5B,QAA2C,OAA3C;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAAQC,OAAR,QAAsB,oBAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,MAAP,IAAgBC,qBAAhB,QAA4C,mBAA5C;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,IAAP,MAAiB,iBAAjB;AACA,OAAOC,SAAP,MAAsB,2BAAtB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,OAAOC,gBAAP,MAA6B,qBAA7B;;AAEA,MAAMC,sBAAsB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACjD,MAAM,CAACC,OAAD,EAAUC,UAAV,IAAwBjB,QAAQ,CAAC,KAAD,CAAtC;EACA,MAAM;IAACkB;EAAD,IAAYJ,KAAlB;EACA,MAAM;IAACK,IAAD;IAAOC;EAAP,IAAoBL,OAA1B;;EACA,MAAMM,gBAAgB,GAAG,KAAI,gBAAJ,EAAsBF,IAAtB,CAAzB;;EAEA,MAAMG,eAAe,GAAGvB,WAAW,CAAC,MAAMkB,UAAU,CAAC,IAAD,CAAjB,EAAyB,CAACA,UAAD,CAAzB,CAAnC;EAEA,MAAMM,gBAAgB,GAAGxB,WAAW,CAAC,MAAMkB,UAAU,CAAC,KAAD,CAAjB,EAA0B,CAACA,UAAD,CAA1B,CAApC;EAEA,oBACE;IAAK,WAAW,EAAEK,eAAlB;IAAmC,YAAY,EAAEC;EAAjD,gBACE,oBAAC,UAAD;IACE,KAAK,EAAEH,SAAS,CAAC,mBAAD,CADlB;IAEE,IAAI,EAAC,SAFP;IAGE,WAAW,EAAE;MACXI,KAAK,EAAE,aADI;MAEXC,YAAY,EAAE,MAFH;MAGXC,eAAe,EAAEV,OAAO,GACpBd,OAAO,CAAE,YAAWmB,gBAAiB,0BAA9B,CADa,GAEpBA;IALO,CAHf;IAUE,IAAI,EAAE;MACJM,QAAQ,EAAE,MADN;MAEJC,MAAM,EAAE;QACNC,IAAI,EAAE,MADA;QAENC,KAAK,EAAE,SAFD;QAGNC,IAAI,EAAE;MAHA;IAFJ,CAVR;IAkBE,OAAO,EAAEb;EAlBX,EADF,CADF;AAwBD,CAlCD;;AAoCAL,sBAAsB,CAACmB,YAAvB,GAAsC;EACpCb,IAAI,EAAEf,QAAQ,CAAC6B,iBAAT,CAA2Bd,IADG;EAEpCC,SAAS,EAAEhB,QAAQ,CAAC6B,iBAAT,CAA2Bb;AAFF,CAAtC;AAKAP,sBAAsB,CAACqB,SAAvB,2CAAmC;EACjChB,OAAO,EAAEjB,SAAS,CAACkC;AADc,CAAnC;;AAIA,MAAMC,WAAW,GAAG,CAACtB,KAAD,EAAQC,OAAR,KAAoB;EACtC,MAAM;IACJsB,KADI;IAEJC,WAFI;IAGJC,OAHI;IAIJC,OAJI;IAKJC,kBALI;IAMJC,cANI;IAOJC,oBAPI;IAQJC,OARI;IASJC,OATI;IAUJC,WAVI;IAWJC,aAXI;IAYJC;EAZI,IAaFlC,KAbJ;EAcA,MAAM;IAACmC,KAAD;IAAQC,OAAR;IAAiBC,iBAAjB;IAAoCC,gBAAgB,GAAG;EAAvD,IAA4Db,OAAlE;EACA,MAAM;IAACnB;EAAD,IAAcL,OAApB;EAEA,MAAM,CAACsC,QAAD,EAAWC,WAAX,IAA0BtD,QAAQ,CAAC,KAAD,CAAxC;EAEA,MAAMuD,cAAc,GAAGxD,WAAW,CAAC,MAAMuD,WAAW,CAAC,CAACD,QAAF,CAAlB,EAA+B,CAACC,WAAD,EAAcD,QAAd,CAA/B,CAAlC;EAEA,MAAMG,WAAW,GAAGzD,WAAW,CAAC,MAAM;IACpC,oBACE;MAAK,SAAS,EAAEI,UAAU,CAACO,KAAK,CAAC4B,WAAP,EAAoB,CAACe,QAAD,IAAa3C,KAAK,CAAC+C,QAAvC;IAA1B,GACGnB,WADH,CADF;EAKD,CAN8B,CAA/B;EAQA,MAAMoB,WAAW,GAAG3D,WAAW,CAAC,MAAM;IACpC,IAAIkD,KAAK,KAAKU,SAAd,EAAyB,OAAO,IAAP;IACzB,MAAMC,gBAAgB,GAAG,SAAzB;IACA,MAAMC,wBAAwB,GAAG;MAC/BnC,eAAe,EAAEkC,gBADc;MAE/BpC,KAAK,EAAG,GAAEyB,KAAM;IAFe,CAAjC;IAKA,oBACE;MAAK,SAAS,EAAEvC,KAAK,CAACoD;IAAtB,gBACE;MACE,aAAU,UADZ;MAEE,SAAS,EAAEpD,KAAK,CAACqD,QAFnB;MAGE,KAAK,EAAEF,wBAHT;MAIE,IAAI,EAAC;IAJP,EADF,CADF;EAUD,CAlB8B,EAkB5B,CAACZ,KAAD,CAlB4B,CAA/B;EAoBA,oBACE;IAAK,SAAS,EAAEvC,KAAK,CAACsD;EAAtB,gBACE;IAAK,SAAS,EAAEtD,KAAK,CAACuD;EAAtB,gBACE;IAAK,SAAS,EAAEvD,KAAK,CAACwD,iBAAtB;IAAyC,OAAO,EAAEpB;EAAlD,gBACE,oBAAC,IAAD;IACE,QAAQ,EAAC,YADX;IAEE,IAAI,EAAE;MACJqB,MAAM,EAAE,EADJ;MAEJC,WAAW,EAAE;IAFT;EAFR,EADF,CADF,eAUE;IAAK,SAAS,EAAE1D,KAAK,CAAC2D;EAAtB,gBACE,iCACG7B,OAAO,gBACN;IAAK,SAAS,EAAE9B,KAAK,CAAC4D;EAAtB,gBACE,oBAAC,IAAD;IACE,QAAQ,EAAC,gBADX;IAEE,eAAe,EAAC,SAFlB;IAGE,IAAI,EAAE;MACJH,MAAM,EAAE,EADJ;MAEJC,WAAW,EAAE;IAFT;EAHR,EADF,EASGhD,SAAS,CAAC,aAAD,CATZ,CADM,GAYJ,IAbN,eAcE;IAAK,SAAS,EAAEV,KAAK,CAAC2B;EAAtB,GAA8BA,KAA9B,CAdF,EAeGC,WAAW,gBACV,uDACE,oBAAC,WAAD,OADF,EAEGA,WAAW,CAACiC,MAAZ,IAAsB,GAAtB,gBACC;IAAK,SAAS,EAAE7D,KAAK,CAAC8D,eAAtB;IAAuC,OAAO,EAAEjB;EAAhD,GACGF,QAAQ,GAAGjC,SAAS,CAAC,WAAD,CAAZ,GAA4BA,SAAS,CAAC,WAAD,CADhD,eAEE,oBAAC,IAAD;IACE,QAAQ,EAAEiC,QAAQ,GAAG,YAAH,GAAkB,cADtC;IAEE,IAAI,EAAE;MACJc,MAAM,EAAE,EADJ;MAEJC,WAAW,EAAE;IAFT;EAFR,EAFF,CADD,GAWG,IAbN,CADU,GAgBR,IA/BN,CADF,eAmCE;IAAK,SAAS,EAAE1D,KAAK,CAAC+D;EAAtB,gBACE,oBAAC,UAAD;IACE,IAAI,EAAC,WADP;IAEE,OAAO,EAAE1B,aAFX;IAGE,KAAK,EAAE3B,SAAS,CAAC,mBAAD,CAHlB;IAIE,QAAQ,EAAE,CAACqB,kBAJb;IAKE,WAAW,EAAE;MACXjB,KAAK,EAAE,aADI;MAEXC,YAAY,EAAE;IAFH;EALf,EADF,eAWE,oBAAC,sBAAD;IAAwB,OAAO,EAAEuB;EAAjC,EAXF,CAnCF,CAVF,eA2DE;IAAK,SAAS,EAAEtC,KAAK,CAACgE;EAAtB,gBACE;IAAK,SAAS,EAAEhE,KAAK,CAACiE;EAAtB,GAAsCvD,SAAS,CAAC,eAAD,CAA/C,CADF,eAEE;IAAK,SAAS,EAAEV,KAAK,CAACkE;EAAtB,GACG1B,OAAO,gBACN;IAAK,SAAS,EAAExC,KAAK,CAACmE,gBAAtB;IAAwC,aAAU;EAAlD,gBACE;IAAM,SAAS,EAAEnE,KAAK,CAACoE;EAAvB,GAAgD5B,OAAhD,CADF,EACkE,GADlE,EAEG9B,SAAS,CAAC,SAAD,CAFZ,CADM,GAKJ,IANN,EAOG+B,iBAAiB,gBAChB;IAAK,SAAS,EAAEzC,KAAK,CAACmE,gBAAtB;IAAwC,aAAU;EAAlD,gBACE;IAAM,SAAS,EAAEnE,KAAK,CAACoE;EAAvB,GAAgD3B,iBAAhD,CADF,UAES/B,SAAS,CAAC,WAAD,CAFlB,CADgB,GAKd,IAZN,CAFF,eAgBE,oBAAC,WAAD,OAhBF,eAiBE;IAAK,SAAS,EAAEV,KAAK,CAACqE;EAAtB,GACG7B,OAAO,iBACN,uDACE;IAAK,SAAS,EAAExC,KAAK,CAACsE,mBAAtB;IAA2C,aAAU;EAArD,gBACE;IAAM,SAAS,EAAEtE,KAAK,CAACuE;EAAvB,GAAmD7B,gBAAnD,CADF,EAEI,IAAGhC,SAAS,CAAC,mBAAD,CAAsB,EAFtC,CADF,eAKE;IAAK,SAAS,EAAEV,KAAK,CAACsE,mBAAtB;IAA2C,aAAU;EAArD,gBACE;IAAM,SAAS,EAAEtE,KAAK,CAACuE;EAAvB,GAAmDhC,KAAnD,MADF,CALF,CAFJ,CAjBF,CA3DF,eA0FE,oBAAC,gBAAD;IAAkB,cAAc,EAAEP;EAAlC,EA1FF,eA2FE,oBAAC,UAAD;IACE,oBAAoB,EAAEC,oBADxB;IAEE,OAAO,EAAEC,OAFX;IAGE,OAAO,EAAEC;EAHX,EA3FF,CADF,CADF;AAqGD,CAvJD;;AAyJAT,WAAW,CAACJ,YAAZ,GAA2B;EACzBb,IAAI,EAAEf,QAAQ,CAAC6B,iBAAT,CAA2Bd,IADR;EAEzBC,SAAS,EAAEhB,QAAQ,CAAC6B,iBAAT,CAA2Bb;AAFb,CAA3B;AAKAgB,WAAW,CAACF,SAAZ,2CAAwB;EACtBG,KAAK,EAAEpC,SAAS,CAACiF,MAAV,CAAiBC,UADF;EAEtB7C,WAAW,EAAErC,SAAS,CAACiF,MAFD;EAGtB3C,OAAO,EAAEtC,SAAS,CAACmF,KAAV,CAAgB;IACvBnC,KAAK,EAAEhD,SAAS,CAACoF,MADM;IAEvBnC,OAAO,EAAEjD,SAAS,CAACoF,MAFI;IAGvBlC,iBAAiB,EAAElD,SAAS,CAACoF,MAHN;IAIvBjC,gBAAgB,EAAEnD,SAAS,CAACoF;EAJL,CAAhB,CAHa;EAStB7C,OAAO,EAAEvC,SAAS,CAACqF,IATG;EAUtB7C,kBAAkB,EAAExC,SAAS,CAACqF,IAVR;EAWtB5C,cAAc,EAAEzC,SAAS,CAACmF,KAAV,CAAgB3E,SAAS,CAACyB,SAA1B,CAXM;EAYtBS,oBAAoB,EAAE1C,SAAS,CAACmF,KAAV,CAAgB3E,SAAS,CAACyB,SAA1B,CAZA;EAatBU,OAAO,EAAE3C,SAAS,CAACmF,KAAV,CAAgB;IACvBG,QAAQ,EAAEtF,SAAS,CAACkC,IADG;IAEvBqD,OAAO,EAAEvF,SAAS,CAACwF,OAAV,CAAkBxF,SAAS,CAACmF,KAAV,CAAgB9E,qBAAhB,CAAlB;EAFc,CAAhB,CAba;EAiBtBuC,OAAO,EAAE5C,SAAS,CAACmF,KAAV,CAAgB/E,MAAM,CAAC6B,SAAvB,CAjBa;EAkBtBY,WAAW,EAAE7C,SAAS,CAACkC,IAlBD;EAmBtBY,aAAa,EAAE9C,SAAS,CAACkC,IAnBH;EAoBtBa,uBAAuB,EAAE/C,SAAS,CAACkC;AApBb,CAAxB;AAuBA,eAAeC,WAAf"}

package/es/template/skill-detail/style.css

@@ -0,0 +1,163 @@
+@value colors: "../../variables/colors.css";
+@value breakpoints: "../../variables/breakpoints.css";
+@value tablet from breakpoints;
+@value xtraLightGrey from colors;
+@value cm_grey_100 from colors;
+@value cm_grey_200 from colors;
+@value cm_grey_400 from colors;
+
+.textBase {
+  font-family: "Gilroy";
+  font-style: normal;
+}
+
+.backgroundContainer {
+  background-color: white;
+  min-height: 100%;
+  width: 100%;
+}
+
+.container {
+  composes: textBase;
+  background-color: white;
+  font-family: "Gilroy";
+  font-style: normal;
+  margin-top: 48px;
+  margin-bottom: 48px;
+  margin-left: auto;
+  margin-right: auto;
+  padding: 0 16px;
+  position: relative;
+  box-sizing: border-box;
+  min-height: 100%;
+  width: 100%;
+  max-width: calc(1080px + 40px);
+}
+
+.backButtonWrapper {
+  margin-bottom: 16px;
+  background-color: cm_grey_100;
+  border-radius: 8px;
+  width: fit-content;
+  padding: 8px;
+  cursor: pointer;
+}
+
+.ctaContainer {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+}
+
+.skillFocusBadge {
+  display: flex;
+  height: 12px;
+  width: fit-content;
+  align-items: center;
+  background-color: #DDD1FF;
+  border-radius: 24px;
+  padding: 4px 8px;
+  font-size: 12px;
+  line-height: 16px;
+  font-weight: 600;
+  color: #3900D6;
+  margin-bottom: 16px;
+}
+
+.ctaWrapper,
+.showMoreWrapper {
+  display: flex;
+  gap: 8px;
+}
+
+.showMoreWrapper {
+  align-items: center;
+  margin-top: 8px;
+  font-weight: 600;
+  cursor: pointer;
+}
+
+.title {
+  font-size: 24px;
+  font-weight: 700;
+  line-height: 32px;
+}
+
+.description {
+  margin-top: 8px;
+  max-width: 734px;
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 20px;
+  color: cm_grey_400;
+}
+
+.truncate {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.progressInformationsWrapper {
+  margin-top: 40px;
+  background-color: xtraLightGrey;
+  border-radius: 16px;
+  padding: 24px;
+}
+
+.progressTitle {
+  font-size: 16px;
+  font-weight: 600;
+  line-height: 22px;
+  margin-bottom: 16px;
+}
+
+.skillCoursesAndQuestionsWrapper,
+.progressInformations {
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 8px;
+}
+
+.skillInformation,
+.progressInformation {
+  composes: textBase;
+  font-weight: 600;
+  font-size: 14px;
+  line-height: 20px;
+  color: cm_grey_400;
+}
+
+.skillInformationNumber,
+.progressInformationNumber {
+  color: #000;
+}
+
+.progressBarWrapper {
+  position: relative;
+  left: 0;
+  width: 100%;
+  height: 4px;
+  border-radius: 2px;
+  overflow: hidden;
+  background-color: cm_grey_100;
+  margin: 16px 0;
+}
+
+.progress {
+  display: block;
+  height: 8px;
+  animation: progressbar 2s ease-in-out;
+}
+
+@media tablet {
+  .ctaContainer {
+    flex-direction: column;
+  }
+
+  .ctaWrapper {
+    margin-top: 32px;
+  }
+}

package/lib/atom/select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/select/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAuDA,qEA2LC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/select/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAwDA,qEAkMC"}

package/lib/atom/select/index.js

@@ -57,6 +57,7 @@ const themeStyle = {
   thematiques: _style.default.thematiques,
   player: _style.default.player,
   template: _style.default.template,
+  skillDetail: _style.default.skillDetail,
   coorpmanager: null
 };
 
@@ -167,7 +168,7 @@ const Select = (props, legacyContext) => {
   }, titleView, /*#__PURE__*/_react.default.createElement("span", {
     "data-testid": "select-span",
     "data-name": "select-span",
-    className: (0, _classnames.default)(_style.default.selectSpan, (0, _includes.default)(theme, ['player', 'invalid', 'question', 'thematiques', 'template']) ? _style.default.noLabelCommon : null, borderClassName, isLongLabel ? _style.default.longLabel : null),
+    className: (0, _classnames.default)(_style.default.selectSpan, (0, _includes.default)(theme, ['player', 'invalid', 'question', 'thematiques', 'template', 'skillDetail']) ? _style.default.noLabelCommon : null, borderClassName, isLongLabel ? _style.default.longLabel : null),
     style: _extends({}, shouldUseSkinFontColor && {
       color
     })

package/lib/atom/select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["themeStyle","filter","style","invalid","header","mooc","question","sort","thematiques","player","template","coorpmanager","ArrowView","shouldRender","isArrowUp","ariaLabel","arrowClass","arrowColor","props","useMemo","color","className","Select","legacyContext","name","options","optgroups","borderClassName","onChange","multiple","disabled","required","description","theme","modified","error","title","propTitle","ariaLabelledBy","skin","GetSkinFromContext","setIsArrowUp","useState","handleSelectOnFocus","useCallback","handleSelectOnBlur","selectOption","option","index","value","optionList","isEmpty","map","optgroup","label","i","titleView","selected","get","find","concat","flatMapDeep","selectedLabel","isSelectedInValidOption","getOr","validOption","handleChange","e","target","selectedOptions","black","isThemeOneOfQuestionTemplateOrPlayer","includes","shouldUseSkinFontColor","undefined","behaviorClassName","getClassState","default","composedClassName","classnames","unselected","labelSize","size","isLongLabel","selectWrapper","selectSpan","noLabelCommon","longLabel","selectedArrow","arrow","selectBox","SelectOptionPropTypes","PropTypes","string","isRequired","oneOfType","number","bool","SelectOptionGroupPropTypes","arrayOf","shape","contextTypes","Provider","childContextTypes","propTypes","func","oneOf","keys"],"sources":["../../../src/atom/select/index.js"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport concat from 'lodash/fp/concat';\nimport filter from 'lodash/fp/filter';\nimport find from 'lodash/fp/find';\nimport flatMapDeep from 'lodash/fp/flatMapDeep';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport includes from 'lodash/fp/includes';\nimport isEmpty from 'lodash/fp/isEmpty';\nimport keys from 'lodash/fp/keys';\nimport map from 'lodash/fp/map';\nimport size from 'lodash/fp/size';\nimport {\n  NovaCompositionNavigationArrowDown as ArrowDown,\n  NovaCompositionNavigationArrowTop as ArrowUp\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext} from '../provider';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst themeStyle = {\n  filter: style.filter,\n  invalid: style.invalid,\n  header: style.header,\n  mooc: style.mooc,\n  question: style.question,\n  sort: style.sort,\n  thematiques: style.thematiques,\n  player: style.player,\n  template: style.template,\n  coorpmanager: null\n};\n\nconst ArrowView = ({shouldRender, isArrowUp, ariaLabel, arrowClass, arrowColor}) => {\n  const props = useMemo(\n    () => ({\n      ...(arrowColor &\n        {\n          color: arrowColor\n        }),\n      className: arrowClass\n    }),\n    [ariaLabel, arrowClass, arrowColor]\n  );\n  if (shouldRender) {\n    return isArrowUp ? (\n      <ArrowUp {...props} data-testid=\"select-arrow-up-icon\" />\n    ) : (\n      <ArrowDown {...props} data-testid=\"select-arrow-down-icon\" />\n    );\n  } else return null;\n};\n\nconst Select = (props, legacyContext) => {\n  const {\n    name,\n    options = [],\n    optgroups = [],\n    className,\n    borderClassName,\n    onChange,\n    multiple = false,\n    disabled,\n    required,\n    description,\n    theme,\n    modified = false,\n    error = false,\n    title: propTitle,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy\n  } = props;\n\n  const skin = GetSkinFromContext(legacyContext);\n  const title = useMemo(\n    () => (propTitle ? `${propTitle}${required ? '*' : ''}` : null),\n    [propTitle, required]\n  );\n\n  const [isArrowUp, setIsArrowUp] = useState(false);\n\n  const handleSelectOnFocus = useCallback(() => setIsArrowUp(true), []);\n  const handleSelectOnBlur = useCallback(() => setIsArrowUp(false), []);\n\n  const selectOption = (option, index) => {\n    return (\n      <option key={index} value={option.value} className={style.selectOption}>\n        {option.name}\n      </option>\n    );\n  };\n\n  const optionList = !isEmpty(options)\n    ? options.map((option, index) => selectOption(option, index))\n    : optgroups.map((optgroup, index) => {\n        return (\n          <optgroup key={index} label={optgroup.label}>\n            {optgroup.options && optgroup.options.map((option, i) => selectOption(option, i))}\n          </optgroup>\n        );\n      });\n\n  const titleView = title ? <span className={style.title}>{title}</span> : null;\n\n  const selected = useMemo(\n    () =>\n      multiple\n        ? map(get('value'), filter({selected: true}, options))\n        : get('value', find({selected: true}, concat(options, flatMapDeep('options', optgroups)))),\n    [multiple, options, optgroups]\n  );\n  const selectedLabel = useMemo(\n    () =>\n      multiple\n        ? map(get('name'), filter({selected: true}, options))\n        : get('name', find({selected: true}, concat(options, flatMapDeep('options', optgroups)))),\n    [multiple, options, optgroups]\n  );\n\n  const isSelectedInValidOption = useMemo(\n    () =>\n      theme === 'player' &&\n      getOr(false, 'name', find({validOption: false, selected: true}, options)),\n    [options, theme]\n  );\n\n  const handleChange = useMemo(\n    () =>\n      multiple\n        ? e => {\n            setIsArrowUp(false);\n            onChange(map(get('value'), e.target.selectedOptions));\n          }\n        : e => {\n            setIsArrowUp(false);\n            onChange(e.target.value);\n          },\n    [onChange, multiple]\n  );\n\n  const black = useMemo(() => getOr('#14171A', 'common.black', skin), [skin]);\n  const color = useMemo(() => getOr('#00B0FF', 'common.primary', skin), [skin]);\n  const isThemeOneOfQuestionTemplateOrPlayer = useMemo(\n    () => includes(theme, ['question', 'template', 'player']),\n    [theme]\n  );\n  const shouldUseSkinFontColor = useMemo(\n    () => !isSelectedInValidOption && selected && isThemeOneOfQuestionTemplateOrPlayer,\n    [isSelectedInValidOption, selected, isThemeOneOfQuestionTemplateOrPlayer]\n  );\n  const arrowColor = selected ? color : undefined;\n\n  const behaviorClassName = useMemo(\n    () => getClassState(style.default, style.modified, style.error, modified, error),\n    [error, modified]\n  );\n  const composedClassName = useMemo(\n    () =>\n      classnames(\n        theme && theme !== 'coorpmanager' ? themeStyle[theme] : behaviorClassName,\n        selected ? style.selected : style.unselected,\n        className\n      ),\n    [behaviorClassName, className, selected, theme]\n  );\n\n  const labelSize = useMemo(() => size(selectedLabel), [selectedLabel]);\n\n  const isLongLabel = useMemo(() => labelSize >= 65, [labelSize]);\n\n  return (\n    <div\n      className={classnames(\n        composedClassName,\n        theme === 'coorpmanager' ? style.coorpmanager : null\n      )}\n    >\n      <label\n        data-testid=\"select-wrapper\"\n        data-name=\"select-wrapper\"\n        title={title}\n        style={{\n          ...(shouldUseSkinFontColor && {\n            color\n          })\n        }}\n        className={style.selectWrapper}\n      >\n        {titleView}\n        <span\n          data-testid=\"select-span\"\n          data-name=\"select-span\"\n          className={classnames(\n            style.selectSpan,\n            includes(theme, ['player', 'invalid', 'question', 'thematiques', 'template'])\n              ? style.noLabelCommon\n              : null,\n            borderClassName,\n            isLongLabel ? style.longLabel : null\n          )}\n          style={{\n            ...(shouldUseSkinFontColor && {\n              color\n            })\n          }}\n        >\n          {selectedLabel}\n        </span>\n        <ArrowView\n          shouldRender={!multiple}\n          isArrowUp={isArrowUp}\n          ariaLabel={ariaLabel}\n          arrowClass={shouldUseSkinFontColor ? style.selectedArrow : style.arrow}\n          arrowColor={isThemeOneOfQuestionTemplateOrPlayer ? arrowColor : black}\n        />\n        <select\n          {...(ariaLabelledBy ? {'aria-labelledby': ariaLabelledBy} : {})}\n          {...(ariaLabel && !ariaLabelledBy ? {'aria-label': ariaLabel} : {})}\n          {...(ariaLabel ? {title: ariaLabel} : {})}\n          data-name=\"native-select\"\n          className={style.selectBox}\n          name={name}\n          onChange={handleChange}\n          value={selected}\n          multiple={multiple}\n          disabled={disabled}\n          onClick={handleSelectOnFocus}\n          onBlur={handleSelectOnBlur}\n          // onBlur does not handle completely an out of bounds click\n          // ex: select is Opened and a click is done outside, cancelling the select\n          // that doesn't count as a Blur, so an onMouseLeave is needed\n          onMouseLeave={handleSelectOnBlur}\n          data-testid=\"native-select\"\n        >\n          {optionList}\n        </select>\n      </label>\n      <div className={style.description}>{description}</div>\n    </div>\n  );\n};\n\nexport const SelectOptionPropTypes = {\n  name: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  selected: PropTypes.bool,\n  validOption: PropTypes.bool\n};\n\nexport const SelectOptionGroupPropTypes = {\n  label: PropTypes.string.isRequired,\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n};\n\nSelect.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nSelect.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  className: PropTypes.string,\n  borderClassName: PropTypes.string,\n  disabled: PropTypes.bool,\n  multiple: PropTypes.bool,\n  description: PropTypes.string,\n  required: PropTypes.bool,\n  onChange: PropTypes.func,\n  theme: PropTypes.oneOf(keys(themeStyle)),\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes)),\n  optgroups: PropTypes.arrayOf(PropTypes.shape(SelectOptionGroupPropTypes)),\n  modified: PropTypes.bool,\n  error: PropTypes.bool,\n  'aria-label': PropTypes.string,\n  'aria-labelledby': PropTypes.string\n};\n\nexport default Select;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["themeStyle","filter","style","invalid","header","mooc","question","sort","thematiques","player","template","skillDetail","coorpmanager","ArrowView","shouldRender","isArrowUp","ariaLabel","arrowClass","arrowColor","props","useMemo","color","className","Select","legacyContext","name","options","optgroups","borderClassName","onChange","multiple","disabled","required","description","theme","modified","error","title","propTitle","ariaLabelledBy","skin","GetSkinFromContext","setIsArrowUp","useState","handleSelectOnFocus","useCallback","handleSelectOnBlur","selectOption","option","index","value","optionList","isEmpty","map","optgroup","label","i","titleView","selected","get","find","concat","flatMapDeep","selectedLabel","isSelectedInValidOption","getOr","validOption","handleChange","e","target","selectedOptions","black","isThemeOneOfQuestionTemplateOrPlayer","includes","shouldUseSkinFontColor","undefined","behaviorClassName","getClassState","default","composedClassName","classnames","unselected","labelSize","size","isLongLabel","selectWrapper","selectSpan","noLabelCommon","longLabel","selectedArrow","arrow","selectBox","SelectOptionPropTypes","PropTypes","string","isRequired","oneOfType","number","bool","SelectOptionGroupPropTypes","arrayOf","shape","contextTypes","Provider","childContextTypes","propTypes","func","oneOf","keys"],"sources":["../../../src/atom/select/index.js"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport concat from 'lodash/fp/concat';\nimport filter from 'lodash/fp/filter';\nimport find from 'lodash/fp/find';\nimport flatMapDeep from 'lodash/fp/flatMapDeep';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport includes from 'lodash/fp/includes';\nimport isEmpty from 'lodash/fp/isEmpty';\nimport keys from 'lodash/fp/keys';\nimport map from 'lodash/fp/map';\nimport size from 'lodash/fp/size';\nimport {\n  NovaCompositionNavigationArrowDown as ArrowDown,\n  NovaCompositionNavigationArrowTop as ArrowUp\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext} from '../provider';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst themeStyle = {\n  filter: style.filter,\n  invalid: style.invalid,\n  header: style.header,\n  mooc: style.mooc,\n  question: style.question,\n  sort: style.sort,\n  thematiques: style.thematiques,\n  player: style.player,\n  template: style.template,\n  skillDetail: style.skillDetail,\n  coorpmanager: null\n};\n\nconst ArrowView = ({shouldRender, isArrowUp, ariaLabel, arrowClass, arrowColor}) => {\n  const props = useMemo(\n    () => ({\n      ...(arrowColor &\n        {\n          color: arrowColor\n        }),\n      className: arrowClass\n    }),\n    [ariaLabel, arrowClass, arrowColor]\n  );\n  if (shouldRender) {\n    return isArrowUp ? (\n      <ArrowUp {...props} data-testid=\"select-arrow-up-icon\" />\n    ) : (\n      <ArrowDown {...props} data-testid=\"select-arrow-down-icon\" />\n    );\n  } else return null;\n};\n\nconst Select = (props, legacyContext) => {\n  const {\n    name,\n    options = [],\n    optgroups = [],\n    className,\n    borderClassName,\n    onChange,\n    multiple = false,\n    disabled,\n    required,\n    description,\n    theme,\n    modified = false,\n    error = false,\n    title: propTitle,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy\n  } = props;\n\n  const skin = GetSkinFromContext(legacyContext);\n  const title = useMemo(\n    () => (propTitle ? `${propTitle}${required ? '*' : ''}` : null),\n    [propTitle, required]\n  );\n\n  const [isArrowUp, setIsArrowUp] = useState(false);\n\n  const handleSelectOnFocus = useCallback(() => setIsArrowUp(true), []);\n  const handleSelectOnBlur = useCallback(() => setIsArrowUp(false), []);\n\n  const selectOption = (option, index) => {\n    return (\n      <option key={index} value={option.value} className={style.selectOption}>\n        {option.name}\n      </option>\n    );\n  };\n\n  const optionList = !isEmpty(options)\n    ? options.map((option, index) => selectOption(option, index))\n    : optgroups.map((optgroup, index) => {\n        return (\n          <optgroup key={index} label={optgroup.label}>\n            {optgroup.options && optgroup.options.map((option, i) => selectOption(option, i))}\n          </optgroup>\n        );\n      });\n\n  const titleView = title ? <span className={style.title}>{title}</span> : null;\n\n  const selected = useMemo(\n    () =>\n      multiple\n        ? map(get('value'), filter({selected: true}, options))\n        : get('value', find({selected: true}, concat(options, flatMapDeep('options', optgroups)))),\n    [multiple, options, optgroups]\n  );\n  const selectedLabel = useMemo(\n    () =>\n      multiple\n        ? map(get('name'), filter({selected: true}, options))\n        : get('name', find({selected: true}, concat(options, flatMapDeep('options', optgroups)))),\n    [multiple, options, optgroups]\n  );\n\n  const isSelectedInValidOption = useMemo(\n    () =>\n      theme === 'player' &&\n      getOr(false, 'name', find({validOption: false, selected: true}, options)),\n    [options, theme]\n  );\n\n  const handleChange = useMemo(\n    () =>\n      multiple\n        ? e => {\n            setIsArrowUp(false);\n            onChange(map(get('value'), e.target.selectedOptions));\n          }\n        : e => {\n            setIsArrowUp(false);\n            onChange(e.target.value);\n          },\n    [onChange, multiple]\n  );\n\n  const black = useMemo(() => getOr('#14171A', 'common.black', skin), [skin]);\n  const color = useMemo(() => getOr('#00B0FF', 'common.primary', skin), [skin]);\n  const isThemeOneOfQuestionTemplateOrPlayer = useMemo(\n    () => includes(theme, ['question', 'template', 'player']),\n    [theme]\n  );\n  const shouldUseSkinFontColor = useMemo(\n    () => !isSelectedInValidOption && selected && isThemeOneOfQuestionTemplateOrPlayer,\n    [isSelectedInValidOption, selected, isThemeOneOfQuestionTemplateOrPlayer]\n  );\n  const arrowColor = selected ? color : undefined;\n\n  const behaviorClassName = useMemo(\n    () => getClassState(style.default, style.modified, style.error, modified, error),\n    [error, modified]\n  );\n  const composedClassName = useMemo(\n    () =>\n      classnames(\n        theme && theme !== 'coorpmanager' ? themeStyle[theme] : behaviorClassName,\n        selected ? style.selected : style.unselected,\n        className\n      ),\n    [behaviorClassName, className, selected, theme]\n  );\n\n  const labelSize = useMemo(() => size(selectedLabel), [selectedLabel]);\n\n  const isLongLabel = useMemo(() => labelSize >= 65, [labelSize]);\n\n  return (\n    <div\n      className={classnames(\n        composedClassName,\n        theme === 'coorpmanager' ? style.coorpmanager : null\n      )}\n    >\n      <label\n        data-testid=\"select-wrapper\"\n        data-name=\"select-wrapper\"\n        title={title}\n        style={{\n          ...(shouldUseSkinFontColor && {\n            color\n          })\n        }}\n        className={style.selectWrapper}\n      >\n        {titleView}\n        <span\n          data-testid=\"select-span\"\n          data-name=\"select-span\"\n          className={classnames(\n            style.selectSpan,\n            includes(theme, [\n              'player',\n              'invalid',\n              'question',\n              'thematiques',\n              'template',\n              'skillDetail'\n            ])\n              ? style.noLabelCommon\n              : null,\n            borderClassName,\n            isLongLabel ? style.longLabel : null\n          )}\n          style={{\n            ...(shouldUseSkinFontColor && {\n              color\n            })\n          }}\n        >\n          {selectedLabel}\n        </span>\n        <ArrowView\n          shouldRender={!multiple}\n          isArrowUp={isArrowUp}\n          ariaLabel={ariaLabel}\n          arrowClass={shouldUseSkinFontColor ? style.selectedArrow : style.arrow}\n          arrowColor={isThemeOneOfQuestionTemplateOrPlayer ? arrowColor : black}\n        />\n        <select\n          {...(ariaLabelledBy ? {'aria-labelledby': ariaLabelledBy} : {})}\n          {...(ariaLabel && !ariaLabelledBy ? {'aria-label': ariaLabel} : {})}\n          {...(ariaLabel ? {title: ariaLabel} : {})}\n          data-name=\"native-select\"\n          className={style.selectBox}\n          name={name}\n          onChange={handleChange}\n          value={selected}\n          multiple={multiple}\n          disabled={disabled}\n          onClick={handleSelectOnFocus}\n          onBlur={handleSelectOnBlur}\n          // onBlur does not handle completely an out of bounds click\n          // ex: select is Opened and a click is done outside, cancelling the select\n          // that doesn't count as a Blur, so an onMouseLeave is needed\n          onMouseLeave={handleSelectOnBlur}\n          data-testid=\"native-select\"\n        >\n          {optionList}\n        </select>\n      </label>\n      <div className={style.description}>{description}</div>\n    </div>\n  );\n};\n\nexport const SelectOptionPropTypes = {\n  name: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  selected: PropTypes.bool,\n  validOption: PropTypes.bool\n};\n\nexport const SelectOptionGroupPropTypes = {\n  label: PropTypes.string.isRequired,\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n};\n\nSelect.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nSelect.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  className: PropTypes.string,\n  borderClassName: PropTypes.string,\n  disabled: PropTypes.bool,\n  multiple: PropTypes.bool,\n  description: PropTypes.string,\n  required: PropTypes.bool,\n  onChange: PropTypes.func,\n  theme: PropTypes.oneOf(keys(themeStyle)),\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes)),\n  optgroups: PropTypes.arrayOf(PropTypes.shape(SelectOptionGroupPropTypes)),\n  modified: PropTypes.bool,\n  error: PropTypes.bool,\n  'aria-label': PropTypes.string,\n  'aria-labelledby': PropTypes.string\n};\n\nexport default Select;\n"],"mappings":"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"}

package/lib/atom/select/style.css

@@ -13,6 +13,7 @@
 @value transparent from colors;
 @value box_shadow_light_dark from colors;
 @value box_shadow_medium_dark from colors;
+@value cm_grey_100 from colors;
 @value cm_blue_900 from colors;
 @value cm_grey_450 from colors;
 
@@ -634,3 +635,30 @@ div.player:hover span.selectSpan {
   height: 54px;
   max-width: 100%;
 }
+
+/*
+  skillDetail
+*/
+
+.skillDetail {
+  composes: no-label;
+}
+
+.skillDetail .selectWrapper {
+  height: 44px;
+  min-height: unset;
+}
+
+.skillDetail .selectSpan {
+  font-size: 15px;
+  height: 44px;
+  line-height: 44px;
+  padding: 0 40px 0 10px;
+  border-radius: 12px !important;
+  background-color: cm_grey_100 !important;
+}
+
+.skillDetail select {
+  border: none !important;
+  height: 44px !important;
+}

package/lib/molecule/cm-popin/types.d.ts

@@ -74,6 +74,7 @@ declare const propTypes: {
         type: PropTypes.Requireable<string>;
         list: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
             list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
+            justifyContent: PropTypes.Requireable<string>;
             loading: PropTypes.Requireable<boolean>;
         }> | PropTypes.InferProps<{
             'aria-label': PropTypes.Requireable<string>;

package/lib/molecule/cm-popin/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,OAAO,IAAI,MAAM,iBAAiB,CAAC;AACnC,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAGlD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDd,CAAC;AAEF,aAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,UAAU,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE;QACZ,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,OAAO,GAAG,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAC5D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,YAAY,CAAC,EAAE,eAAe,CAAC;IAC/B,KAAK,CAAC,EAAE;QACN,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;QACzB,IAAI,EACA,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,GAChD,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;KACtD,CAAC;IACF,IAAI,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC;CACpD,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,OAAO,IAAI,MAAM,iBAAiB,CAAC;AACnC,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAGlD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDd,CAAC;AAEF,aAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,UAAU,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE;QACZ,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,OAAO,GAAG,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAC5D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,YAAY,CAAC,EAAE,eAAe,CAAC;IAC/B,KAAK,CAAC,EAAE;QACN,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;QACzB,IAAI,EACA,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,GAChD,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;KACtD,CAAC;IACF,IAAI,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC;CACpD,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/molecule/discipline-header/index.js

@@ -91,7 +91,7 @@ class DisciplineHeader extends _react.default.Component {
     const {
       translate
     } = this.context;
-    const maxHeightCourseInfos = 215;
+    const maxHeightCourseInfos = 210;
     const hasMediaContent = image || video;
     const toggleLabel = fullDisplay ? translate('See less') : translate('Show more');
     const shortCourseText = scrollHeightShowMore <= maxHeightCourseInfos;

package/lib/molecule/discipline-header/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Preview","image","video","mimeType","get","id","jwpOptions","style","propTypes","Picture","src","PropTypes","shape","VideoPlayer","DisciplineHeader","React","Component","constructor","props","state","fullDisplay","scrollHeightShowMore","handleToggleDisplay","bind","setHandle","setState","prevState","el","getOr","render","title","description","lastUpdated","translate","context","maxHeightCourseInfos","hasMediaContent","toggleLabel","shortCourseText","courseSeeMoreButtonStyle","showMoreHidden","showMore","wrapper","imgWrapper","courseWrapper","courseTextWrapperFull","courseTextWrapperShort","classnames","innerHTML","__html","lastUpdatedWrapper","lastUpdatedWrapperShort","syncIcon","lastUpdatedText","contextTypes","func","string"],"sources":["../../../src/molecule/discipline-header/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport classnames from 'classnames';\nimport {NovaSolidSynchronizeSynchronize3 as SyncIcon} from '@coorpacademy/nova-icons';\nimport VideoPlayer from '../video-player';\nimport Picture from '../../atom/picture';\nimport style from './style.css';\n\nconst Preview = ({image, video}) => {\n  const mimeType = get('mimeType', video);\n  const id = get('id', video);\n  const jwpOptions = get('jwpOptions', video);\n  if (id) {\n    return <VideoPlayer mimeType={mimeType} id={id} width=\"380px\" height=\"250px\" />;\n  } else if (jwpOptions) {\n    return <VideoPlayer {...video} />;\n  } else {\n    return <Picture className={style.image} src={image} />;\n  }\n};\n\nPreview.propTypes = {\n  image: Picture.propTypes.src,\n  video: PropTypes.shape(VideoPlayer.propTypes)\n};\n\nclass DisciplineHeader extends React.Component {\n  static propTypes = {\n    title: PropTypes.string,\n    description: PropTypes.string,\n    image: Preview.propTypes.image,\n    video: Preview.propTypes.video,\n    lastUpdated: PropTypes.string\n  };\n\n  static contextTypes = {\n    translate: PropTypes.func\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      fullDisplay: false,\n      scrollHeightShowMore: 0\n    };\n    this.handleToggleDisplay = this.handleToggleDisplay.bind(this);\n    this.setHandle = this.setHandle.bind(this);\n  }\n\n  handleToggleDisplay() {\n    this.setState(prevState => ({\n      fullDisplay: !prevState.fullDisplay\n    }));\n  }\n\n  setHandle(el) {\n    this.setState({scrollHeightShowMore: getOr(0, 'scrollHeight', el)});\n  }\n\n  render() {\n    const {image, title, description, video, lastUpdated} = this.props;\n    const {fullDisplay, scrollHeightShowMore} = this.state;\n    const {translate} = this.context;\n    const maxHeightCourseInfos = 215;\n    const hasMediaContent = image || video;\n    const toggleLabel = fullDisplay ? translate('See less') : translate('Show more');\n    const shortCourseText = scrollHeightShowMore <= maxHeightCourseInfos;\n    const courseSeeMoreButtonStyle = shortCourseText ? style.showMoreHidden : style.showMore;\n\n    return (\n      <div data-name=\"disciplineHeader\" className={style.wrapper}>\n        {hasMediaContent ? (\n          <div className={style.imgWrapper}>\n            <Preview image={image} video={video} />\n          </div>\n        ) : null}\n        <div className={style.courseWrapper}>\n          <div\n            className={fullDisplay ? style.courseTextWrapperFull : style.courseTextWrapperShort}\n            ref={this.setHandle}\n          >\n            <div\n              data-name=\"title\"\n              className={classnames(style.title, style.innerHTML)}\n              // eslint-disable-next-line react/no-danger\n              dangerouslySetInnerHTML={{__html: title}}\n            />\n            <div\n              className={style.innerHTML}\n              // eslint-disable-next-line react/no-danger\n              dangerouslySetInnerHTML={{__html: description}}\n            />\n          </div>\n          <div className={courseSeeMoreButtonStyle} onClick={this.handleToggleDisplay}>\n            {toggleLabel}\n          </div>\n          {lastUpdated ? (\n            <div\n              className={classnames(\n                style.lastUpdatedWrapper,\n                shortCourseText ? style.lastUpdatedWrapperShort : null\n              )}\n            >\n              <SyncIcon className={style.syncIcon} />\n              <div\n                className={classnames(style.lastUpdatedText, style.innerHTML)}\n                // eslint-disable-next-line react/no-danger\n                dangerouslySetInnerHTML={{__html: lastUpdated}}\n              />\n            </div>\n          ) : null}\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default DisciplineHeader;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["Preview","image","video","mimeType","get","id","jwpOptions","style","propTypes","Picture","src","PropTypes","shape","VideoPlayer","DisciplineHeader","React","Component","constructor","props","state","fullDisplay","scrollHeightShowMore","handleToggleDisplay","bind","setHandle","setState","prevState","el","getOr","render","title","description","lastUpdated","translate","context","maxHeightCourseInfos","hasMediaContent","toggleLabel","shortCourseText","courseSeeMoreButtonStyle","showMoreHidden","showMore","wrapper","imgWrapper","courseWrapper","courseTextWrapperFull","courseTextWrapperShort","classnames","innerHTML","__html","lastUpdatedWrapper","lastUpdatedWrapperShort","syncIcon","lastUpdatedText","contextTypes","func","string"],"sources":["../../../src/molecule/discipline-header/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport classnames from 'classnames';\nimport {NovaSolidSynchronizeSynchronize3 as SyncIcon} from '@coorpacademy/nova-icons';\nimport VideoPlayer from '../video-player';\nimport Picture from '../../atom/picture';\nimport style from './style.css';\n\nconst Preview = ({image, video}) => {\n  const mimeType = get('mimeType', video);\n  const id = get('id', video);\n  const jwpOptions = get('jwpOptions', video);\n  if (id) {\n    return <VideoPlayer mimeType={mimeType} id={id} width=\"380px\" height=\"250px\" />;\n  } else if (jwpOptions) {\n    return <VideoPlayer {...video} />;\n  } else {\n    return <Picture className={style.image} src={image} />;\n  }\n};\n\nPreview.propTypes = {\n  image: Picture.propTypes.src,\n  video: PropTypes.shape(VideoPlayer.propTypes)\n};\n\nclass DisciplineHeader extends React.Component {\n  static propTypes = {\n    title: PropTypes.string,\n    description: PropTypes.string,\n    image: Preview.propTypes.image,\n    video: Preview.propTypes.video,\n    lastUpdated: PropTypes.string\n  };\n\n  static contextTypes = {\n    translate: PropTypes.func\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      fullDisplay: false,\n      scrollHeightShowMore: 0\n    };\n    this.handleToggleDisplay = this.handleToggleDisplay.bind(this);\n    this.setHandle = this.setHandle.bind(this);\n  }\n\n  handleToggleDisplay() {\n    this.setState(prevState => ({\n      fullDisplay: !prevState.fullDisplay\n    }));\n  }\n\n  setHandle(el) {\n    this.setState({scrollHeightShowMore: getOr(0, 'scrollHeight', el)});\n  }\n\n  render() {\n    const {image, title, description, video, lastUpdated} = this.props;\n    const {fullDisplay, scrollHeightShowMore} = this.state;\n    const {translate} = this.context;\n    const maxHeightCourseInfos = 210;\n    const hasMediaContent = image || video;\n    const toggleLabel = fullDisplay ? translate('See less') : translate('Show more');\n    const shortCourseText = scrollHeightShowMore <= maxHeightCourseInfos;\n    const courseSeeMoreButtonStyle = shortCourseText ? style.showMoreHidden : style.showMore;\n\n    return (\n      <div data-name=\"disciplineHeader\" className={style.wrapper}>\n        {hasMediaContent ? (\n          <div className={style.imgWrapper}>\n            <Preview image={image} video={video} />\n          </div>\n        ) : null}\n        <div className={style.courseWrapper}>\n          <div\n            className={fullDisplay ? style.courseTextWrapperFull : style.courseTextWrapperShort}\n            ref={this.setHandle}\n          >\n            <div\n              data-name=\"title\"\n              className={classnames(style.title, style.innerHTML)}\n              // eslint-disable-next-line react/no-danger\n              dangerouslySetInnerHTML={{__html: title}}\n            />\n            <div\n              className={style.innerHTML}\n              // eslint-disable-next-line react/no-danger\n              dangerouslySetInnerHTML={{__html: description}}\n            />\n          </div>\n          <div className={courseSeeMoreButtonStyle} onClick={this.handleToggleDisplay}>\n            {toggleLabel}\n          </div>\n          {lastUpdated ? (\n            <div\n              className={classnames(\n                style.lastUpdatedWrapper,\n                shortCourseText ? style.lastUpdatedWrapperShort : null\n              )}\n            >\n              <SyncIcon className={style.syncIcon} />\n              <div\n                className={classnames(style.lastUpdatedText, style.innerHTML)}\n                // eslint-disable-next-line react/no-danger\n                dangerouslySetInnerHTML={{__html: lastUpdated}}\n              />\n            </div>\n          ) : null}\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default DisciplineHeader;\n"],"mappings":"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"}

package/lib/molecule/learner-skill-card/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learner-skill-card/index.js"],"names":[],"mappings":";AASA,yEAwJC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learner-skill-card/index.js"],"names":[],"mappings":";AASA,yEAyJC"}