@coorpacademy/components 10.22.5 → 10.22.8

package/lib/atom/resource-miniature/index.js

@@ -17,23 +17,21 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _provider = _interopRequireDefault(require("../provider"));
 
-var _style = require("../label/style.css");
-
-var _style2 = _interopRequireDefault(require("./style.css"));
+var _style = _interopRequireDefault(require("./style.css"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const TYPES = {
   pdf: {
-    style: _style2.default.pdf,
+    style: _style.default.pdf,
     icon: _novaIcons.NovaLineFilesOfficeFileOfficePdf
   },
   audio: {
-    style: _style2.default.audio,
+    style: _style.default.audio,
     icon: _novaIcons.NovaCompositionCoorpacademyMicrophone
   },
   video: {
-    style: _style2.default.video,
+    style: _style.default.video,
     icon: _novaIcons.NovaSolidAudioAudioControlPlay
   }
 };
@@ -49,7 +47,7 @@ const ResourceMiniature = (props, context) => {
     onClick: handleOnClick,
     selected = false
   } = props;
-  const descriptionClassName = selected ? _style2.default.selectedDescription : _style2.default.description;
+  const descriptionClassName = selected ? _style.default.selectedDescription : _style.default.description;
   const white = (0, _get2.default)('common.white', skin);
   const primary = (0, _get2.default)('common.primary', skin);
   const posterOutlineColor = selected ? primary : white;
@@ -59,20 +57,20 @@ const ResourceMiniature = (props, context) => {
     onClick: handleOnClick,
     "data-type": type
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.posterWrapper,
+    className: _style.default.posterWrapper,
     style: {
       borderColor: posterOutlineColor
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.poster,
+    className: _style.default.poster,
     style: {
       backgroundImage: `url(${poster})`
     }
   }), !selected ? /*#__PURE__*/_react.default.createElement(Icon, {
     color: white,
-    className: _style2.default.icon
+    className: _style.default.icon
   }) : null), /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)(descriptionClassName, _style.innerHTML) // eslint-disable-next-line react/no-danger
+    className: (0, _classnames.default)(descriptionClassName, _style.default.innerHTML) // eslint-disable-next-line react/no-danger
     ,
     dangerouslySetInnerHTML: {
       __html: description

package/lib/atom/resource-miniature/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/atom/resource-miniature/index.js"],"names":["TYPES","pdf","style","icon","PDFIcon","audio","PodcastIcon","video","PlayIcon","ResourceMiniature","props","context","skin","type","description","poster","onClick","handleOnClick","selected","descriptionClassName","selectedDescription","white","primary","posterOutlineColor","Icon","posterWrapper","borderColor","backgroundImage","innerHTML","__html","propTypes","PropTypes","oneOf","bool","string","func","contextTypes","Provider","childContextTypes"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;AAKA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,KAAK,GAAG;AACZC,EAAAA,GAAG,EAAE;AAACC,IAAAA,KAAK,EAAEA,gBAAMD,GAAd;AAAmBE,IAAAA,IAAI,EAAEC;AAAzB,GADO;AAEZC,EAAAA,KAAK,EAAE;AAACH,IAAAA,KAAK,EAAEA,gBAAMG,KAAd;AAAqBF,IAAAA,IAAI,EAAEG;AAA3B,GAFK;AAGZC,EAAAA,KAAK,EAAE;AAACL,IAAAA,KAAK,EAAEA,gBAAMK,KAAd;AAAqBJ,IAAAA,IAAI,EAAEK;AAA3B;AAHK,CAAd;;AAMA,MAAMC,iBAAiB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;AAC5C,QAAM;AAACC,IAAAA;AAAD,MAASD,OAAf;AACA,QAAM;AAACE,IAAAA,IAAD;AAAOC,IAAAA,WAAP;AAAoBC,IAAAA,MAApB;AAA4BC,IAAAA,OAAO,EAAEC,aAArC;AAAoDC,IAAAA,QAAQ,GAAG;AAA/D,MAAwER,KAA9E;AACA,QAAMS,oBAAoB,GAAGD,QAAQ,GAAGhB,gBAAMkB,mBAAT,GAA+BlB,gBAAMY,WAA1E;AACA,QAAMO,KAAK,GAAG,mBAAI,cAAJ,EAAoBT,IAApB,CAAd;AACA,QAAMU,OAAO,GAAG,mBAAI,gBAAJ,EAAsBV,IAAtB,CAAhB;AACA,QAAMW,kBAAkB,GAAGL,QAAQ,GAAGI,OAAH,GAAaD,KAAhD;AACA,QAAMG,IAAI,GAAGxB,KAAK,CAACa,IAAD,CAAL,CAAYV,IAAzB;AACA,sBACE;AAAK,IAAA,SAAS,EAAEH,KAAK,CAACa,IAAD,CAAL,CAAYX,KAA5B;AAAmC,IAAA,OAAO,EAAEe,aAA5C;AAA2D,iBAAWJ;AAAtE,kBACE;AAAK,IAAA,SAAS,EAAEX,gBAAMuB,aAAtB;AAAqC,IAAA,KAAK,EAAE;AAACC,MAAAA,WAAW,EAAEH;AAAd;AAA5C,kBACE;AAAK,IAAA,SAAS,EAAErB,gBAAMa,MAAtB;AAA8B,IAAA,KAAK,EAAE;AAACY,MAAAA,eAAe,EAAG,OAAMZ,MAAO;AAAhC;AAArC,IADF,EAEG,CAACG,QAAD,gBAAY,6BAAC,IAAD;AAAM,IAAA,KAAK,EAAEG,KAAb;AAAoB,IAAA,SAAS,EAAEnB,gBAAMC;AAArC,IAAZ,GAA4D,IAF/D,CADF,eAKE;AACE,IAAA,SAAS,EAAE,yBAAWgB,oBAAX,EAAiCS,gBAAjC,CADb,CAEE;AAFF;AAGE,IAAA,uBAAuB,EAAE;AAACC,MAAAA,MAAM,EAAEf;AAAT;AAH3B,IALF,CADF;AAaD,CArBD;;AAuBAL,iBAAiB,CAACqB,SAAlB,2CAA8B;AAC5BjB,EAAAA,IAAI,EAAEkB,mBAAUC,KAAV,CAAgB,oBAAKhC,KAAL,CAAhB,CADsB;AAE5BkB,EAAAA,QAAQ,EAAEa,mBAAUE,IAFQ;AAG5BnB,EAAAA,WAAW,EAAEiB,mBAAUG,MAHK;AAI5BnB,EAAAA,MAAM,EAAEgB,mBAAUG,MAJU;AAK5BlB,EAAAA,OAAO,EAAEe,mBAAUI;AALS,CAA9B;AAQA1B,iBAAiB,CAAC2B,YAAlB,GAAiC;AAC/BxB,EAAAA,IAAI,EAAEyB,kBAASC,iBAAT,CAA2B1B;AADF,CAAjC;eAIeH,iB","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get, keys} from 'lodash/fp';\nimport {\n  NovaSolidAudioAudioControlPlay as PlayIcon,\n  NovaLineFilesOfficeFileOfficePdf as PDFIcon,\n  NovaCompositionCoorpacademyMicrophone as PodcastIcon\n} from '@coorpacademy/nova-icons';\nimport classnames from 'classnames';\nimport Provider from '../provider';\nimport {innerHTML} from '../label/style.css';\nimport style from './style.css';\n\nconst TYPES = {\n  pdf: {style: style.pdf, icon: PDFIcon},\n  audio: {style: style.audio, icon: PodcastIcon},\n  video: {style: style.video, icon: PlayIcon}\n};\n\nconst ResourceMiniature = (props, context) => {\n  const {skin} = context;\n  const {type, description, poster, onClick: handleOnClick, selected = false} = props;\n  const descriptionClassName = selected ? style.selectedDescription : style.description;\n  const white = get('common.white', skin);\n  const primary = get('common.primary', skin);\n  const posterOutlineColor = selected ? primary : white;\n  const Icon = TYPES[type].icon;\n  return (\n    <div className={TYPES[type].style} onClick={handleOnClick} data-type={type}>\n      <div className={style.posterWrapper} style={{borderColor: posterOutlineColor}}>\n        <div className={style.poster} style={{backgroundImage: `url(${poster})`}} />\n        {!selected ? <Icon color={white} className={style.icon} /> : null}\n      </div>\n      <div\n        className={classnames(descriptionClassName, innerHTML)}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{__html: description}}\n      />\n    </div>\n  );\n};\n\nResourceMiniature.propTypes = {\n  type: PropTypes.oneOf(keys(TYPES)),\n  selected: PropTypes.bool,\n  description: PropTypes.string,\n  poster: PropTypes.string,\n  onClick: PropTypes.func\n};\n\nResourceMiniature.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nexport default ResourceMiniature;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/atom/resource-miniature/index.js"],"names":["TYPES","pdf","style","icon","PDFIcon","audio","PodcastIcon","video","PlayIcon","ResourceMiniature","props","context","skin","type","description","poster","onClick","handleOnClick","selected","descriptionClassName","selectedDescription","white","primary","posterOutlineColor","Icon","posterWrapper","borderColor","backgroundImage","innerHTML","__html","propTypes","PropTypes","oneOf","bool","string","func","contextTypes","Provider","childContextTypes"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;AAKA;;AACA;;AACA;;;;AAEA,MAAMA,KAAK,GAAG;AACZC,EAAAA,GAAG,EAAE;AAACC,IAAAA,KAAK,EAAEA,eAAMD,GAAd;AAAmBE,IAAAA,IAAI,EAAEC;AAAzB,GADO;AAEZC,EAAAA,KAAK,EAAE;AAACH,IAAAA,KAAK,EAAEA,eAAMG,KAAd;AAAqBF,IAAAA,IAAI,EAAEG;AAA3B,GAFK;AAGZC,EAAAA,KAAK,EAAE;AAACL,IAAAA,KAAK,EAAEA,eAAMK,KAAd;AAAqBJ,IAAAA,IAAI,EAAEK;AAA3B;AAHK,CAAd;;AAMA,MAAMC,iBAAiB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;AAC5C,QAAM;AAACC,IAAAA;AAAD,MAASD,OAAf;AACA,QAAM;AAACE,IAAAA,IAAD;AAAOC,IAAAA,WAAP;AAAoBC,IAAAA,MAApB;AAA4BC,IAAAA,OAAO,EAAEC,aAArC;AAAoDC,IAAAA,QAAQ,GAAG;AAA/D,MAAwER,KAA9E;AACA,QAAMS,oBAAoB,GAAGD,QAAQ,GAAGhB,eAAMkB,mBAAT,GAA+BlB,eAAMY,WAA1E;AACA,QAAMO,KAAK,GAAG,mBAAI,cAAJ,EAAoBT,IAApB,CAAd;AACA,QAAMU,OAAO,GAAG,mBAAI,gBAAJ,EAAsBV,IAAtB,CAAhB;AACA,QAAMW,kBAAkB,GAAGL,QAAQ,GAAGI,OAAH,GAAaD,KAAhD;AACA,QAAMG,IAAI,GAAGxB,KAAK,CAACa,IAAD,CAAL,CAAYV,IAAzB;AACA,sBACE;AAAK,IAAA,SAAS,EAAEH,KAAK,CAACa,IAAD,CAAL,CAAYX,KAA5B;AAAmC,IAAA,OAAO,EAAEe,aAA5C;AAA2D,iBAAWJ;AAAtE,kBACE;AAAK,IAAA,SAAS,EAAEX,eAAMuB,aAAtB;AAAqC,IAAA,KAAK,EAAE;AAACC,MAAAA,WAAW,EAAEH;AAAd;AAA5C,kBACE;AAAK,IAAA,SAAS,EAAErB,eAAMa,MAAtB;AAA8B,IAAA,KAAK,EAAE;AAACY,MAAAA,eAAe,EAAG,OAAMZ,MAAO;AAAhC;AAArC,IADF,EAEG,CAACG,QAAD,gBAAY,6BAAC,IAAD;AAAM,IAAA,KAAK,EAAEG,KAAb;AAAoB,IAAA,SAAS,EAAEnB,eAAMC;AAArC,IAAZ,GAA4D,IAF/D,CADF,eAKE;AACE,IAAA,SAAS,EAAE,yBAAWgB,oBAAX,EAAiCjB,eAAM0B,SAAvC,CADb,CAEE;AAFF;AAGE,IAAA,uBAAuB,EAAE;AAACC,MAAAA,MAAM,EAAEf;AAAT;AAH3B,IALF,CADF;AAaD,CArBD;;AAuBAL,iBAAiB,CAACqB,SAAlB,2CAA8B;AAC5BjB,EAAAA,IAAI,EAAEkB,mBAAUC,KAAV,CAAgB,oBAAKhC,KAAL,CAAhB,CADsB;AAE5BkB,EAAAA,QAAQ,EAAEa,mBAAUE,IAFQ;AAG5BnB,EAAAA,WAAW,EAAEiB,mBAAUG,MAHK;AAI5BnB,EAAAA,MAAM,EAAEgB,mBAAUG,MAJU;AAK5BlB,EAAAA,OAAO,EAAEe,mBAAUI;AALS,CAA9B;AAQA1B,iBAAiB,CAAC2B,YAAlB,GAAiC;AAC/BxB,EAAAA,IAAI,EAAEyB,kBAASC,iBAAT,CAA2B1B;AADF,CAAjC;eAIeH,iB","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get, keys} from 'lodash/fp';\nimport {\n  NovaSolidAudioAudioControlPlay as PlayIcon,\n  NovaLineFilesOfficeFileOfficePdf as PDFIcon,\n  NovaCompositionCoorpacademyMicrophone as PodcastIcon\n} from '@coorpacademy/nova-icons';\nimport classnames from 'classnames';\nimport Provider from '../provider';\nimport style from './style.css';\n\nconst TYPES = {\n  pdf: {style: style.pdf, icon: PDFIcon},\n  audio: {style: style.audio, icon: PodcastIcon},\n  video: {style: style.video, icon: PlayIcon}\n};\n\nconst ResourceMiniature = (props, context) => {\n  const {skin} = context;\n  const {type, description, poster, onClick: handleOnClick, selected = false} = props;\n  const descriptionClassName = selected ? style.selectedDescription : style.description;\n  const white = get('common.white', skin);\n  const primary = get('common.primary', skin);\n  const posterOutlineColor = selected ? primary : white;\n  const Icon = TYPES[type].icon;\n  return (\n    <div className={TYPES[type].style} onClick={handleOnClick} data-type={type}>\n      <div className={style.posterWrapper} style={{borderColor: posterOutlineColor}}>\n        <div className={style.poster} style={{backgroundImage: `url(${poster})`}} />\n        {!selected ? <Icon color={white} className={style.icon} /> : null}\n      </div>\n      <div\n        className={classnames(descriptionClassName, style.innerHTML)}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{__html: description}}\n      />\n    </div>\n  );\n};\n\nResourceMiniature.propTypes = {\n  type: PropTypes.oneOf(keys(TYPES)),\n  selected: PropTypes.bool,\n  description: PropTypes.string,\n  poster: PropTypes.string,\n  onClick: PropTypes.func\n};\n\nResourceMiniature.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nexport default ResourceMiniature;\n"],"file":"index.js"}

package/lib/atom/resource-miniature/style.css

@@ -75,3 +75,7 @@
     flex: 1 0 52px;
   }
 }
+
+.innerHTML {
+  composes: innerHTML from '../label/style.css';
+}

package/lib/template/app-player/player/slides/header/learner.css

@@ -88,6 +88,10 @@
   margin-right: 10px;
 }
 
+.innerHTML {
+  composes: innerHTML from '../../../../../atom/label/style.css';
+}
+
 @media mobile {
   .contentWrapper {
     max-width: 90%;

package/lib/template/app-player/player/slides/header/learner.js

@@ -17,8 +17,6 @@ var _link = _interopRequireDefault(require("../../../../../atom/link"));
 
 var _provider = _interopRequireDefault(require("../../../../../atom/provider"));
 
-var _style = require("../../../../../atom/label/style.css");
-
 var _learner = _interopRequireDefault(require("./learner.css"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -47,7 +45,7 @@ const Content = ({
     }
   }, details), /*#__PURE__*/_react.default.createElement("span", {
     "data-name": "contentTitle",
-    className: (0, _classnames.default)(_learner.default.contentTitle, _style.innerHTML) // eslint-disable-next-line react/no-danger
+    className: (0, _classnames.default)(_learner.default.contentTitle, _learner.default.innerHTML) // eslint-disable-next-line react/no-danger
     ,
     dangerouslySetInnerHTML: {
       __html: title
@@ -72,7 +70,7 @@ const Subcontent = ({
 }, /*#__PURE__*/_react.default.createElement("div", {
   className: _learner.default.subcontentDetails
 }, details), /*#__PURE__*/_react.default.createElement("div", {
-  className: (0, _classnames.default)(_learner.default.subcontentTitle, _style.innerHTML) // eslint-disable-next-line react/no-danger
+  className: (0, _classnames.default)(_learner.default.subcontentTitle, _learner.default.innerHTML) // eslint-disable-next-line react/no-danger
   ,
   dangerouslySetInnerHTML: {
     __html: title

package/lib/template/app-player/player/slides/header/learner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/template/app-player/player/slides/header/learner.js"],"names":["Content","onClick","title","details","context","skin","primarySkinColor","style","contentWrapper","backIcon","content","contentDetails","color","contentTitle","innerHTML","__html","contextTypes","Provider","childContextTypes","propTypes","Link","PropTypes","string","isRequired","Subcontent","subcontent","subcontentDetails","subcontentTitle","LearnerHeader","props","wrapper","shape"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,OAAO,GAAG,CAAC;AAACC,EAAAA,OAAD;AAAUC,EAAAA,KAAV;AAAiBC,EAAAA;AAAjB,CAAD,EAA4BC,OAA5B,KAAwC;AACtD,QAAM;AAACC,IAAAA;AAAD,MAASD,OAAf;AACA,QAAME,gBAAgB,GAAG,mBAAI,gBAAJ,EAAsBD,IAAtB,CAAzB;AAEA,sBACE,6BAAC,aAAD;AAAM,IAAA,OAAO,EAAEJ,OAAf;AAAwB,IAAA,SAAS,EAAEM,iBAAMC;AAAzC,kBACE,6BAAC,6CAAD;AAAU,IAAA,SAAS,EAAED,iBAAME,QAA3B;AAAqC,IAAA,KAAK,EAAC;AAA3C,IADF,eAEE;AAAK,IAAA,SAAS,EAAEF,iBAAMG;AAAtB,kBACE;AACE,IAAA,SAAS,EAAEH,iBAAMI,cADnB;AAEE,IAAA,KAAK,EAAE;AACLC,MAAAA,KAAK,EAAEN;AADF;AAFT,KAMGH,OANH,CADF,eAUE;AACE,iBAAU,cADZ;AAEE,IAAA,SAAS,EAAE,yBAAWI,iBAAMM,YAAjB,EAA+BC,gBAA/B,CAFb,CAGE;AAHF;AAIE,IAAA,uBAAuB,EAAE;AAACC,MAAAA,MAAM,EAAEb;AAAT;AAJ3B,IAVF,CAFF,CADF;AAsBD,CA1BD;;AA4BAF,OAAO,CAACgB,YAAR,GAAuB;AACrBX,EAAAA,IAAI,EAAEY,kBAASC,iBAAT,CAA2Bb;AADZ,CAAvB;AAIAL,OAAO,CAACmB,SAAR,2CAAoB;AAClBlB,EAAAA,OAAO,EAAEmB,cAAKD,SAAL,CAAelB,OADN;AAElBC,EAAAA,KAAK,EAAEmB,mBAAUC,MAAV,CAAiBC,UAFN;AAGlBpB,EAAAA,OAAO,EAAEkB,mBAAUC;AAHD,CAApB;;AAMA,MAAME,UAAU,GAAG,CAAC;AAACtB,EAAAA,KAAD;AAAQC,EAAAA;AAAR,CAAD,EAAmBC,OAAnB,kBACjB;AAAK,EAAA,SAAS,EAAEG,iBAAMkB;AAAtB,gBACE;AAAK,EAAA,SAAS,EAAElB,iBAAMmB;AAAtB,GAA0CvB,OAA1C,CADF,eAEE;AACE,EAAA,SAAS,EAAE,yBAAWI,iBAAMoB,eAAjB,EAAkCb,gBAAlC,CADb,CAEE;AAFF;AAGE,EAAA,uBAAuB,EAAE;AAACC,IAAAA,MAAM,EAAEb;AAAT;AAH3B,EAFF,CADF;;AAWAsB,UAAU,CAACL,SAAX,2CAAuB;AACrBjB,EAAAA,KAAK,EAAEmB,mBAAUC,MAAV,CAAiBC,UADH;AAErBpB,EAAAA,OAAO,EAAEkB,mBAAUC;AAFE,CAAvB;;AAKA,MAAMM,aAAa,GAAG,CAACC,KAAD,EAAQzB,OAAR,KAAoB;AACxC,QAAM;AAACM,IAAAA,OAAD;AAAUe,IAAAA;AAAV,MAAwBI,KAA9B;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEtB,iBAAMuB;AAAtB,kBACE,6BAAC,OAAD,EAAapB,OAAb,CADF,eAEE,6BAAC,UAAD,EAAgBe,UAAhB,CAFF,CADF;AAMD,CATD;;AAWAG,aAAa,CAACT,SAAd,2CAA0B;AACxBT,EAAAA,OAAO,EAAEW,mBAAUU,KAAV,CAAgB/B,OAAO,CAACmB,SAAxB,EAAmCI,UADpB;AAExBE,EAAAA,UAAU,EAAEJ,mBAAUU,KAAV,CAAgBP,UAAU,CAACL,SAA3B,EAAsCI;AAF1B,CAA1B;eAKeK,a","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport classnames from 'classnames';\nimport {NovaCompositionNavigationArrowLeft as BackIcon} from '@coorpacademy/nova-icons';\nimport Link from '../../../../../atom/link';\nimport Provider from '../../../../../atom/provider';\nimport {innerHTML} from '../../../../../atom/label/style.css';\nimport style from './learner.css';\n\nconst Content = ({onClick, title, details}, context) => {\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  return (\n    <Link onClick={onClick} className={style.contentWrapper}>\n      <BackIcon className={style.backIcon} color=\"inherit\" />\n      <div className={style.content}>\n        <div\n          className={style.contentDetails}\n          style={{\n            color: primarySkinColor\n          }}\n        >\n          {details}\n        </div>\n\n        <span\n          data-name=\"contentTitle\"\n          className={classnames(style.contentTitle, innerHTML)}\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{__html: title}}\n        />\n      </div>\n    </Link>\n  );\n};\n\nContent.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nContent.propTypes = {\n  onClick: Link.propTypes.onClick,\n  title: PropTypes.string.isRequired,\n  details: PropTypes.string\n};\n\nconst Subcontent = ({title, details}, context) => (\n  <div className={style.subcontent}>\n    <div className={style.subcontentDetails}>{details}</div>\n    <div\n      className={classnames(style.subcontentTitle, innerHTML)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: title}}\n    />\n  </div>\n);\n\nSubcontent.propTypes = {\n  title: PropTypes.string.isRequired,\n  details: PropTypes.string\n};\n\nconst LearnerHeader = (props, context) => {\n  const {content, subcontent} = props;\n\n  return (\n    <div className={style.wrapper}>\n      <Content {...content} />\n      <Subcontent {...subcontent} />\n    </div>\n  );\n};\n\nLearnerHeader.propTypes = {\n  content: PropTypes.shape(Content.propTypes).isRequired,\n  subcontent: PropTypes.shape(Subcontent.propTypes).isRequired\n};\n\nexport default LearnerHeader;\n"],"file":"learner.js"}
+{"version":3,"sources":["../../../../../../src/template/app-player/player/slides/header/learner.js"],"names":["Content","onClick","title","details","context","skin","primarySkinColor","style","contentWrapper","backIcon","content","contentDetails","color","contentTitle","innerHTML","__html","contextTypes","Provider","childContextTypes","propTypes","Link","PropTypes","string","isRequired","Subcontent","subcontent","subcontentDetails","subcontentTitle","LearnerHeader","props","wrapper","shape"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,OAAO,GAAG,CAAC;AAACC,EAAAA,OAAD;AAAUC,EAAAA,KAAV;AAAiBC,EAAAA;AAAjB,CAAD,EAA4BC,OAA5B,KAAwC;AACtD,QAAM;AAACC,IAAAA;AAAD,MAASD,OAAf;AACA,QAAME,gBAAgB,GAAG,mBAAI,gBAAJ,EAAsBD,IAAtB,CAAzB;AAEA,sBACE,6BAAC,aAAD;AAAM,IAAA,OAAO,EAAEJ,OAAf;AAAwB,IAAA,SAAS,EAAEM,iBAAMC;AAAzC,kBACE,6BAAC,6CAAD;AAAU,IAAA,SAAS,EAAED,iBAAME,QAA3B;AAAqC,IAAA,KAAK,EAAC;AAA3C,IADF,eAEE;AAAK,IAAA,SAAS,EAAEF,iBAAMG;AAAtB,kBACE;AACE,IAAA,SAAS,EAAEH,iBAAMI,cADnB;AAEE,IAAA,KAAK,EAAE;AACLC,MAAAA,KAAK,EAAEN;AADF;AAFT,KAMGH,OANH,CADF,eAUE;AACE,iBAAU,cADZ;AAEE,IAAA,SAAS,EAAE,yBAAWI,iBAAMM,YAAjB,EAA+BN,iBAAMO,SAArC,CAFb,CAGE;AAHF;AAIE,IAAA,uBAAuB,EAAE;AAACC,MAAAA,MAAM,EAAEb;AAAT;AAJ3B,IAVF,CAFF,CADF;AAsBD,CA1BD;;AA4BAF,OAAO,CAACgB,YAAR,GAAuB;AACrBX,EAAAA,IAAI,EAAEY,kBAASC,iBAAT,CAA2Bb;AADZ,CAAvB;AAIAL,OAAO,CAACmB,SAAR,2CAAoB;AAClBlB,EAAAA,OAAO,EAAEmB,cAAKD,SAAL,CAAelB,OADN;AAElBC,EAAAA,KAAK,EAAEmB,mBAAUC,MAAV,CAAiBC,UAFN;AAGlBpB,EAAAA,OAAO,EAAEkB,mBAAUC;AAHD,CAApB;;AAMA,MAAME,UAAU,GAAG,CAAC;AAACtB,EAAAA,KAAD;AAAQC,EAAAA;AAAR,CAAD,EAAmBC,OAAnB,kBACjB;AAAK,EAAA,SAAS,EAAEG,iBAAMkB;AAAtB,gBACE;AAAK,EAAA,SAAS,EAAElB,iBAAMmB;AAAtB,GAA0CvB,OAA1C,CADF,eAEE;AACE,EAAA,SAAS,EAAE,yBAAWI,iBAAMoB,eAAjB,EAAkCpB,iBAAMO,SAAxC,CADb,CAEE;AAFF;AAGE,EAAA,uBAAuB,EAAE;AAACC,IAAAA,MAAM,EAAEb;AAAT;AAH3B,EAFF,CADF;;AAWAsB,UAAU,CAACL,SAAX,2CAAuB;AACrBjB,EAAAA,KAAK,EAAEmB,mBAAUC,MAAV,CAAiBC,UADH;AAErBpB,EAAAA,OAAO,EAAEkB,mBAAUC;AAFE,CAAvB;;AAKA,MAAMM,aAAa,GAAG,CAACC,KAAD,EAAQzB,OAAR,KAAoB;AACxC,QAAM;AAACM,IAAAA,OAAD;AAAUe,IAAAA;AAAV,MAAwBI,KAA9B;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEtB,iBAAMuB;AAAtB,kBACE,6BAAC,OAAD,EAAapB,OAAb,CADF,eAEE,6BAAC,UAAD,EAAgBe,UAAhB,CAFF,CADF;AAMD,CATD;;AAWAG,aAAa,CAACT,SAAd,2CAA0B;AACxBT,EAAAA,OAAO,EAAEW,mBAAUU,KAAV,CAAgB/B,OAAO,CAACmB,SAAxB,EAAmCI,UADpB;AAExBE,EAAAA,UAAU,EAAEJ,mBAAUU,KAAV,CAAgBP,UAAU,CAACL,SAA3B,EAAsCI;AAF1B,CAA1B;eAKeK,a","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport classnames from 'classnames';\nimport {NovaCompositionNavigationArrowLeft as BackIcon} from '@coorpacademy/nova-icons';\nimport Link from '../../../../../atom/link';\nimport Provider from '../../../../../atom/provider';\nimport style from './learner.css';\n\nconst Content = ({onClick, title, details}, context) => {\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  return (\n    <Link onClick={onClick} className={style.contentWrapper}>\n      <BackIcon className={style.backIcon} color=\"inherit\" />\n      <div className={style.content}>\n        <div\n          className={style.contentDetails}\n          style={{\n            color: primarySkinColor\n          }}\n        >\n          {details}\n        </div>\n\n        <span\n          data-name=\"contentTitle\"\n          className={classnames(style.contentTitle, style.innerHTML)}\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{__html: title}}\n        />\n      </div>\n    </Link>\n  );\n};\n\nContent.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nContent.propTypes = {\n  onClick: Link.propTypes.onClick,\n  title: PropTypes.string.isRequired,\n  details: PropTypes.string\n};\n\nconst Subcontent = ({title, details}, context) => (\n  <div className={style.subcontent}>\n    <div className={style.subcontentDetails}>{details}</div>\n    <div\n      className={classnames(style.subcontentTitle, style.innerHTML)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: title}}\n    />\n  </div>\n);\n\nSubcontent.propTypes = {\n  title: PropTypes.string.isRequired,\n  details: PropTypes.string\n};\n\nconst LearnerHeader = (props, context) => {\n  const {content, subcontent} = props;\n\n  return (\n    <div className={style.wrapper}>\n      <Content {...content} />\n      <Subcontent {...subcontent} />\n    </div>\n  );\n};\n\nLearnerHeader.propTypes = {\n  content: PropTypes.shape(Content.propTypes).isRequired,\n  subcontent: PropTypes.shape(Subcontent.propTypes).isRequired\n};\n\nexport default LearnerHeader;\n"],"file":"learner.js"}

package/lib/template/app-player/player/slides/header/microlearning.css

@@ -37,6 +37,10 @@
   max-width: 100%;
 }
 
+.innerHTML {
+  composes: innerHTML from '../../../../../atom/label/style.css';
+}
+
 @media mobile {
   .content {
     max-width: none;

package/lib/template/app-player/player/slides/header/microlearning.js

@@ -13,8 +13,6 @@ var _novaIcons = require("@coorpacademy/nova-icons");
 
 var _link = _interopRequireDefault(require("../../../../../atom/link"));
 
-var _style = require("../../../../../atom/label/style.css");
-
 var _microlearning = _interopRequireDefault(require("./microlearning.css"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,7 +28,7 @@ const Content = ({
   color: "inherit"
 }), /*#__PURE__*/_react.default.createElement("div", {
   "data-name": "contentTitle",
-  className: (0, _classnames.default)(_microlearning.default.contentTitle, _style.innerHTML) // eslint-disable-next-line react/no-danger
+  className: (0, _classnames.default)(_microlearning.default.contentTitle, _microlearning.default.innerHTML) // eslint-disable-next-line react/no-danger
   ,
   dangerouslySetInnerHTML: {
     __html: title

package/lib/template/app-player/player/slides/header/microlearning.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/template/app-player/player/slides/header/microlearning.js"],"names":["Content","onClick","title","context","style","content","backIcon","contentTitle","innerHTML","__html","propTypes","Link","PropTypes","node","MicrolearningHeader","props","shape","string","isRequired"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,OAAO,GAAG,CAAC;AAACC,EAAAA,OAAD;AAAUC,EAAAA;AAAV,CAAD,EAAmBC,OAAnB,kBACd,6BAAC,aAAD;AAAM,EAAA,OAAO,EAAEF,OAAf;AAAwB,EAAA,SAAS,EAAEG,uBAAMC;AAAzC,gBACE,6BAAC,6CAAD;AAAU,EAAA,SAAS,EAAED,uBAAME,QAA3B;AAAqC,EAAA,KAAK,EAAC;AAA3C,EADF,eAEE;AACE,eAAU,cADZ;AAEE,EAAA,SAAS,EAAE,yBAAWF,uBAAMG,YAAjB,EAA+BC,gBAA/B,CAFb,CAGE;AAHF;AAIE,EAAA,uBAAuB,EAAE;AAACC,IAAAA,MAAM,EAAEP;AAAT;AAJ3B,EAFF,CADF;;AAYAF,OAAO,CAACU,SAAR,2CAAoB;AAClBT,EAAAA,OAAO,EAAEU,cAAKD,SAAL,CAAeT,OADN;AAElBC,EAAAA,KAAK,EAAEU,mBAAUC;AAFC,CAApB;;AAKA,MAAMC,mBAAmB,GAAG,CAACC,KAAD,EAAQZ,OAAR,KAAoB;AAC9C,QAAM;AAACE,IAAAA;AAAD,MAAYU,KAAlB;AACA,sBAAO,6BAAC,OAAD,EAAaV,OAAb,CAAP;AACD,CAHD;;AAKAS,mBAAmB,CAACJ,SAApB,2CAAgC;AAC9BL,EAAAA,OAAO,EAAEO,mBAAUI,KAAV,CAAgB;AACvBf,IAAAA,OAAO,EAAEU,cAAKD,SAAL,CAAeT,OADD;AAEvBC,IAAAA,KAAK,EAAEU,mBAAUK,MAAV,CAAiBC;AAFD,GAAhB;AADqB,CAAhC;eAOeJ,mB","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {NovaCompositionNavigationArrowLeft as BackIcon} from '@coorpacademy/nova-icons';\nimport Link from '../../../../../atom/link';\nimport {innerHTML} from '../../../../../atom/label/style.css';\nimport style from './microlearning.css';\n\nconst Content = ({onClick, title}, context) => (\n  <Link onClick={onClick} className={style.content}>\n    <BackIcon className={style.backIcon} color=\"inherit\" />\n    <div\n      data-name=\"contentTitle\"\n      className={classnames(style.contentTitle, innerHTML)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: title}}\n    />\n  </Link>\n);\n\nContent.propTypes = {\n  onClick: Link.propTypes.onClick,\n  title: PropTypes.node\n};\n\nconst MicrolearningHeader = (props, context) => {\n  const {content} = props;\n  return <Content {...content} />;\n};\n\nMicrolearningHeader.propTypes = {\n  content: PropTypes.shape({\n    onClick: Link.propTypes.onClick,\n    title: PropTypes.string.isRequired\n  })\n};\n\nexport default MicrolearningHeader;\n"],"file":"microlearning.js"}
+{"version":3,"sources":["../../../../../../src/template/app-player/player/slides/header/microlearning.js"],"names":["Content","onClick","title","context","style","content","backIcon","contentTitle","innerHTML","__html","propTypes","Link","PropTypes","node","MicrolearningHeader","props","shape","string","isRequired"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,OAAO,GAAG,CAAC;AAACC,EAAAA,OAAD;AAAUC,EAAAA;AAAV,CAAD,EAAmBC,OAAnB,kBACd,6BAAC,aAAD;AAAM,EAAA,OAAO,EAAEF,OAAf;AAAwB,EAAA,SAAS,EAAEG,uBAAMC;AAAzC,gBACE,6BAAC,6CAAD;AAAU,EAAA,SAAS,EAAED,uBAAME,QAA3B;AAAqC,EAAA,KAAK,EAAC;AAA3C,EADF,eAEE;AACE,eAAU,cADZ;AAEE,EAAA,SAAS,EAAE,yBAAWF,uBAAMG,YAAjB,EAA+BH,uBAAMI,SAArC,CAFb,CAGE;AAHF;AAIE,EAAA,uBAAuB,EAAE;AAACC,IAAAA,MAAM,EAAEP;AAAT;AAJ3B,EAFF,CADF;;AAYAF,OAAO,CAACU,SAAR,2CAAoB;AAClBT,EAAAA,OAAO,EAAEU,cAAKD,SAAL,CAAeT,OADN;AAElBC,EAAAA,KAAK,EAAEU,mBAAUC;AAFC,CAApB;;AAKA,MAAMC,mBAAmB,GAAG,CAACC,KAAD,EAAQZ,OAAR,KAAoB;AAC9C,QAAM;AAACE,IAAAA;AAAD,MAAYU,KAAlB;AACA,sBAAO,6BAAC,OAAD,EAAaV,OAAb,CAAP;AACD,CAHD;;AAKAS,mBAAmB,CAACJ,SAApB,2CAAgC;AAC9BL,EAAAA,OAAO,EAAEO,mBAAUI,KAAV,CAAgB;AACvBf,IAAAA,OAAO,EAAEU,cAAKD,SAAL,CAAeT,OADD;AAEvBC,IAAAA,KAAK,EAAEU,mBAAUK,MAAV,CAAiBC;AAFD,GAAhB;AADqB,CAAhC;eAOeJ,mB","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {NovaCompositionNavigationArrowLeft as BackIcon} from '@coorpacademy/nova-icons';\nimport Link from '../../../../../atom/link';\nimport style from './microlearning.css';\n\nconst Content = ({onClick, title}, context) => (\n  <Link onClick={onClick} className={style.content}>\n    <BackIcon className={style.backIcon} color=\"inherit\" />\n    <div\n      data-name=\"contentTitle\"\n      className={classnames(style.contentTitle, style.innerHTML)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: title}}\n    />\n  </Link>\n);\n\nContent.propTypes = {\n  onClick: Link.propTypes.onClick,\n  title: PropTypes.node\n};\n\nconst MicrolearningHeader = (props, context) => {\n  const {content} = props;\n  return <Content {...content} />;\n};\n\nMicrolearningHeader.propTypes = {\n  content: PropTypes.shape({\n    onClick: Link.propTypes.onClick,\n    title: PropTypes.string.isRequired\n  })\n};\n\nexport default MicrolearningHeader;\n"],"file":"microlearning.js"}

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

@@ -53,13 +53,11 @@ var _audio = _interopRequireDefault(require("../../../../molecule/audio"));
 
 var _resourceBrowser = _interopRequireDefault(require("../../../../organism/resource-browser"));
 
-var _style = require("../../../../atom/label/style.css");
-
 var _footer = _interopRequireDefault(require("./footer"));
 
 var _header = _interopRequireDefault(require("./header"));
 
-var _style2 = _interopRequireDefault(require("./style.css"));
+var _style = _interopRequireDefault(require("./style.css"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -71,7 +69,7 @@ const MediaView = ({
   media
 }) => {
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.contextMedia
+    className: _style.default.contextMedia
   }, /*#__PURE__*/_react.default.createElement(_picture.default, {
     src: media
   }));
@@ -91,7 +89,7 @@ const ClueContent = (props, context) => {
     onClickSeeClue
   } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.clueWrapper
+    className: _style.default.clueWrapper
   }, /*#__PURE__*/_react.default.createElement(_clue.default, {
     text: text,
     starsDiff: starsDiff,
@@ -118,7 +116,7 @@ const Bar = ({
 
   const stepWidth = _current / total * 100;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.stepBar,
+    className: _style.default.stepBar,
     style: {
       backgroundColor: color,
       width: `${stepWidth}%`
@@ -140,13 +138,13 @@ const Step = ({
     "data-name": "step"
   }, /*#__PURE__*/_react.default.createElement("div", {
     "data-name": "counter",
-    className: _style2.default.stepCount
+    className: _style.default.stepCount
   }, /*#__PURE__*/_react.default.createElement("span", {
     style: {
       color
     }
   }, step.current), "/", step.total), /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.stepWrapper
+    className: _style.default.stepWrapper
   }, /*#__PURE__*/_react.default.createElement(_swapper.default, _extends({}, step, {
     color: color,
     current: step.current - 1
@@ -173,7 +171,7 @@ const NewMedia = (props, context) => {
   } = props;
   const current = (0, _get2.default)('current', step);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: `${_style2.default.guideWrapper} ${_style2.default.newMedia}`,
+    className: `${_style.default.guideWrapper} ${_style.default.newMedia}`,
     onClick: onClick,
     "data-name": "newMedia"
   }, /*#__PURE__*/_react.default.createElement("span", null, translate(step === null || current === 1 ? 'See lesson' : 'New media')));
@@ -195,7 +193,7 @@ const ReviewLesson = (props, context) => {
     onClick
   } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: `${_style2.default.guideWrapper} ${_style2.default.reviewLesson}`,
+    className: `${_style.default.guideWrapper} ${_style.default.reviewLesson}`,
     onClick: onClick,
     "data-name": "reviewLesson"
   }, /*#__PURE__*/_react.default.createElement("span", null, translate('Review lesson')));
@@ -232,11 +230,11 @@ const MediaContent = (props, context) => {
     count: Math.abs(starsDiff)
   });
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.resourcesWrapper
+    className: _style.default.resourcesWrapper
   }, /*#__PURE__*/_react.default.createElement(_resourceBrowser.default, {
     resources: resources
   }), /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.stars
+    className: _style.default.stars
   }, starsToWin));
 };
 
@@ -303,7 +301,7 @@ const ContextMedia = ({
   const ContentType = CONTEXT_MEDIA[media.type];
   return /*#__PURE__*/_react.default.createElement("div", {
     "data-name": "contextMedia",
-    className: (0, _classnames.default)(_style2.default.contextWrapper, media.type === 'pdf' ? _style2.default.contextPdfWrapper : null, media.type === 'audio' ? _style2.default.contextAudioWrapper : null)
+    className: (0, _classnames.default)(_style.default.contextWrapper, media.type === 'pdf' ? _style.default.contextPdfWrapper : null, media.type === 'audio' ? _style.default.contextAudioWrapper : null)
   }, /*#__PURE__*/_react.default.createElement(ContentType, media));
 };
 
@@ -326,14 +324,14 @@ const ContextContent = ({
   const paragraphs = descriptionParagraphs.map((paragraph, index) => /*#__PURE__*/_react.default.createElement("p", {
     key: index,
     "data-name": "contextDescription",
-    className: (0, _classnames.default)(_style2.default.contextDescription, _style.innerHTML) // eslint-disable-next-line react/no-danger
+    className: (0, _classnames.default)(_style.default.contextDescription, _style.default.innerHTML) // eslint-disable-next-line react/no-danger
     ,
     dangerouslySetInnerHTML: {
       __html: paragraph
     }
   }));
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.context
+    className: _style.default.context
   }, (0, _get2.default)('media.type', slideContext) ? /*#__PURE__*/_react.default.createElement(ContextMedia, {
     media: slideContext.media
   }) : null, paragraphs);
@@ -356,7 +354,7 @@ const CONTENT_TYPE = {
 const Help = ({
   help
 }) => /*#__PURE__*/_react.default.createElement("div", {
-  className: (0, _classnames.default)(_style2.default.helpView, _style.innerHTML) // eslint-disable-next-line react/no-danger
+  className: (0, _classnames.default)(_style.default.helpView, _style.default.innerHTML) // eslint-disable-next-line react/no-danger
   ,
   dangerouslySetInnerHTML: {
     __html: help
@@ -375,9 +373,9 @@ const ValidateButton = ({
   }
 
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.ctaWrapper
+    className: _style.default.ctaWrapper
   }, /*#__PURE__*/_react.default.createElement(_cta.default, _extends({}, cta, {
-    className: _style2.default.cta
+    className: _style.default.cta
   })));
 };
 
@@ -398,7 +396,7 @@ const ContentLayout = (props, context) => {
     slideContext
   } = props;
   const ContentType = CONTENT_TYPE[selectedTab];
-  const noPaddingRessources = ContentType === MediaContent ? `${_style2.default.contentWrapperNoPadding}` : `${_style2.default.contentWrapper}`;
+  const noPaddingRessources = ContentType === MediaContent ? `${_style.default.contentWrapperNoPadding}` : `${_style.default.contentWrapper}`;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: noPaddingRessources,
     style: {
@@ -406,7 +404,7 @@ const ContentLayout = (props, context) => {
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
     "data-name": "question",
-    className: (0, _classnames.default)(selectedTab === 'context' ? _style2.default.contextTitle : _style2.default.question, _style.innerHTML) // eslint-disable-next-line react/no-danger
+    className: (0, _classnames.default)(selectedTab === 'context' ? _style.default.contextTitle : _style.default.question, _style.default.innerHTML) // eslint-disable-next-line react/no-danger
     ,
     dangerouslySetInnerHTML: {
       __html: selectedTab === 'context' ? slideContext.title : question
@@ -429,7 +427,7 @@ ContentLayout.propTypes = process.env.NODE_ENV !== "production" ? _extends({
  */
 
 const LoadingLayout = () => /*#__PURE__*/_react.default.createElement("div", {
-  className: _style2.default.loading
+  className: _style.default.loading
 }, /*#__PURE__*/_react.default.createElement(_loader.default, null));
 
 const LoadedLayout = (_ref2) => {
@@ -453,9 +451,9 @@ LoadedLayout.propTypes = process.env.NODE_ENV !== "production" ? _extends(_exten
 const ErrorMessage = ({
   errorMsg
 }) => /*#__PURE__*/_react.default.createElement("div", {
-  className: _style2.default.contentWrapper
+  className: _style.default.contentWrapper
 }, /*#__PURE__*/_react.default.createElement("div", {
-  className: _style2.default.error
+  className: _style.default.error
 }, errorMsg));
 
 ErrorMessage.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -497,10 +495,10 @@ const SlidesPlayer = (props, context) => {
     onClick = _identity2.default
   } = mediaButton;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.wrapper,
+    className: _style.default.wrapper,
     "data-name": "slidesPlayer"
   }, header ? /*#__PURE__*/_react.default.createElement(_header.default, header) : null, /*#__PURE__*/_react.default.createElement("div", {
-    className: _style2.default.contentProgression
+    className: _style.default.contentProgression
   }, step ? /*#__PURE__*/_react.default.createElement(Step, {
     step: step,
     color: stepColor

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/template/app-player/player/slides/index.js"],"names":["MediaView","media","style","contextMedia","propTypes","Picture","src","ClueContent","props","context","text","starsDiff","onClickSeeClue","clueWrapper","PropTypes","string","number","func","Bar","total","color","current","_current","stepWidth","stepBar","backgroundColor","width","isRequired","ColorPropType","Step","step","stepCount","stepWrapper","shape","NewMedia","translate","onClick","guideWrapper","newMedia","contextTypes","Provider","childContextTypes","ReviewLesson","reviewLesson","AnswerContent","answerType","help","Answer","MediaContent","resources","starsToWin","count","Math","abs","resourcesWrapper","stars","ResourceBrowser","ContextImage","images","map","url","_id","arrayOf","ContextVideo","videos","videoId","childProps","VideoPlayer","CONTEXT_MEDIA","img","pdf","PDF","audio","Audio","video","ContextMedia","ContentType","type","contextWrapper","contextPdfWrapper","contextAudioWrapper","oneOfType","oneOf","ContextContent","slideContext","descriptionParagraphs","paragraphs","paragraph","index","contextDescription","innerHTML","__html","title","description","CONTENT_TYPE","answer","clue","Help","helpView","ValidateButton","cta","ctaWrapper","Cta","ContentLayout","typeClue","selectedTab","model","question","noPaddingRessources","contentWrapperNoPadding","contentWrapper","contextTitle","skin","LoadingLayout","loading","LoadedLayout","ErrorMessage","errorMsg","error","Content","bool","SlidesPlayer","header","buttons","showNewMedia","showReviewLesson","stepColor","mediaButton","wrapper","contentProgression","TYPE","Footer","Header","backgroundUrl","SrcPropType"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {compact, find, get, getOr, keys, omit, identity, max, pipe, split} from 'lodash/fp';\nimport {ColorPropType, SrcPropType} from '../../../../util/proptypes';\nimport Cta from '../../../../atom/cta';\nimport Picture from '../../../../atom/picture';\nimport Provider from '../../../../atom/provider';\nimport Clue from '../../../../atom/clue';\nimport Answer from '../../../../molecule/answer';\nimport Loader from '../../../../atom/loader';\nimport Swapper from '../../../../hoc/swapper';\nimport VideoPlayer from '../../../../molecule/video-player';\nimport PDF from '../../../../molecule/pdf';\nimport Audio from '../../../../molecule/audio';\nimport ResourceBrowser from '../../../../organism/resource-browser';\nimport {innerHTML} from '../../../../atom/label/style.css';\nimport Footer from './footer';\nimport Header from './header';\nimport style from './style.css';\n\nconst MediaView = ({media}) => {\n  return (\n    <div className={style.contextMedia}>\n      <Picture src={media} />\n    </div>\n  );\n};\n\nMediaView.propTypes = {\n  media: Picture.propTypes.src\n};\n\n/*\n * Content types\n */\n\nconst ClueContent = (props, context) => {\n  const {text, starsDiff, onClickSeeClue} = props;\n\n  return (\n    <div className={style.clueWrapper}>\n      <Clue text={text} starsDiff={starsDiff} onClick={onClickSeeClue} />\n    </div>\n  );\n};\n\nClueContent.propTypes = {\n  text: PropTypes.string,\n  starsDiff: PropTypes.number,\n  onClickSeeClue: PropTypes.func\n};\n\nconst Bar = ({total, color, current}) => {\n  const _current = max([current, 0]);\n\n  if (!total) {\n    return null;\n  }\n\n  const stepWidth = (_current / total) * 100;\n\n  return (\n    <div\n      className={style.stepBar}\n      style={{\n        backgroundColor: color,\n        width: `${stepWidth}%`\n      }}\n    />\n  );\n};\n\nBar.propTypes = {\n  current: PropTypes.number.isRequired,\n  total: PropTypes.number,\n  color: ColorPropType\n};\n\nconst Step = ({step, color}) => {\n  return (\n    <div data-name=\"step\">\n      <div data-name=\"counter\" className={style.stepCount}>\n        <span style={{color}}>{step.current}</span>/{step.total}\n      </div>\n      <div className={style.stepWrapper}>\n        <Swapper {...step} color={color} current={step.current - 1}>\n          <Bar {...step} color={color} />\n        </Swapper>\n      </div>\n    </div>\n  );\n};\n\nStep.propTypes = {\n  step: PropTypes.shape({\n    current: Bar.propTypes.current,\n    total: Bar.propTypes.total\n  }),\n  color: ColorPropType\n};\n\nconst NewMedia = (props, context) => {\n  const {translate} = context;\n  const {onClick, step} = props;\n  const current = get('current', step);\n  return (\n    <div\n      className={`${style.guideWrapper} ${style.newMedia}`}\n      onClick={onClick}\n      data-name=\"newMedia\"\n    >\n      <span>{translate(step === null || current === 1 ? 'See lesson' : 'New media')}</span>\n    </div>\n  );\n};\n\nNewMedia.propTypes = {\n  onClick: PropTypes.func,\n  step: Step.propTypes.step\n};\n\nNewMedia.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nconst ReviewLesson = (props, context) => {\n  const {translate} = context;\n  const {onClick} = props;\n\n  return (\n    <div\n      className={`${style.guideWrapper} ${style.reviewLesson}`}\n      onClick={onClick}\n      data-name=\"reviewLesson\"\n    >\n      <span>{translate('Review lesson')}</span>\n    </div>\n  );\n};\n\nReviewLesson.propTypes = {\n  onClick: PropTypes.func\n};\n\nReviewLesson.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nconst AnswerContent = ({answerType, help}) => <Answer {...answerType} help={help} />;\n\nAnswerContent.propTypes = {\n  answerType: PropTypes.shape(Answer.propTypes),\n  help: PropTypes.string\n};\n\nconst MediaContent = (props, context) => {\n  const {resources, starsDiff} = props;\n  const {translate} = context;\n  const starsToWin = translate('media_stars_to_win', {\n    count: Math.abs(starsDiff)\n  });\n\n  return (\n    <div className={style.resourcesWrapper}>\n      <ResourceBrowser resources={resources} />\n      <div className={style.stars}>{starsToWin}</div>\n    </div>\n  );\n};\n\nMediaContent.propTypes = {\n  resources: ResourceBrowser.propTypes.resources,\n  starsDiff: PropTypes.number\n};\n\nMediaContent.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nconst ContextImage = ({src}) => {\n  const images = src.map(({url, _id}) => <MediaView key={_id} media={url} />);\n  return <div>{images}</div>;\n};\n\nContextImage.propTypes = {\n  src: PropTypes.arrayOf(\n    PropTypes.shape({\n      _id: PropTypes.string,\n      url: PropTypes.string\n    })\n  )\n};\n\nconst ContextVideo = props => {\n  const {src} = props;\n  const videos = src.map(({videoId, ...childProps}) => (\n    <VideoPlayer {...omit('id', childProps)} id={videoId} key={videoId} autoplay={false} />\n  ));\n  return <div>{videos}</div>;\n};\n\nContextVideo.propTypes = {\n  src: PropTypes.arrayOf(PropTypes.shape(VideoPlayer.propTypes))\n};\n\nconst CONTEXT_MEDIA = {\n  img: ContextImage,\n  pdf: PDF,\n  audio: Audio,\n  video: ContextVideo\n};\n\nconst ContextMedia = ({media}) => {\n  const ContentType = CONTEXT_MEDIA[media.type];\n  return (\n    <div\n      data-name=\"contextMedia\"\n      className={classnames(\n        style.contextWrapper,\n        media.type === 'pdf' ? style.contextPdfWrapper : null,\n        media.type === 'audio' ? style.contextAudioWrapper : null\n      )}\n    >\n      <ContentType {...media} />\n    </div>\n  );\n};\n\nContextMedia.propTypes = {\n  media: PropTypes.oneOfType([\n    PropTypes.shape({\n      ...ContextImage.propTypes,\n      type: PropTypes.oneOf(['img'])\n    }),\n    PropTypes.shape({\n      ...PDF.propTypes,\n      type: PropTypes.oneOf(['pdf'])\n    }),\n    PropTypes.shape({\n      ...Audio.propTypes,\n      type: PropTypes.oneOf(['audio'])\n    }),\n    PropTypes.shape({\n      ...ContextVideo.propTypes,\n      type: PropTypes.oneOf(['video'])\n    })\n  ])\n};\n\nconst ContextContent = ({slideContext}) => {\n  const descriptionParagraphs = pipe(getOr('', 'description'), split('\\n'), compact)(slideContext);\n  const paragraphs = descriptionParagraphs.map((paragraph, index) => (\n    <p\n      key={index}\n      data-name=\"contextDescription\"\n      className={classnames(style.contextDescription, innerHTML)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: paragraph}}\n    />\n  ));\n  return (\n    <div className={style.context}>\n      {get('media.type', slideContext) ? <ContextMedia media={slideContext.media} /> : null}\n      {paragraphs}\n    </div>\n  );\n};\n\nContextContent.propTypes = {\n  slideContext: PropTypes.shape({\n    title: PropTypes.string,\n    description: PropTypes.string,\n    media: PropTypes.shape(ContextMedia.propTypes)\n  })\n};\n\nconst CONTENT_TYPE = {\n  answer: AnswerContent,\n  clue: ClueContent,\n  context: ContextContent,\n  media: MediaContent\n};\n\nconst Help = ({help}) => (\n  <div\n    className={classnames(style.helpView, innerHTML)}\n    // eslint-disable-next-line react/no-danger\n    dangerouslySetInnerHTML={{__html: help}}\n  />\n);\n\nHelp.propTypes = {\n  help: PropTypes.string\n};\n\nconst ValidateButton = ({cta}) => {\n  if (!cta) {\n    return null;\n  }\n\n  return (\n    <div className={style.ctaWrapper}>\n      <Cta {...cta} className={style.cta} />\n    </div>\n  );\n};\n\nValidateButton.propTypes = {\n  cta: PropTypes.shape(Cta.propTypes)\n};\n\nconst ContentLayout = (props, context) => {\n  const {\n    typeClue: selectedTab,\n    answerType: {model: {type} = {}} = {},\n    question,\n    help,\n    slideContext\n  } = props;\n  const ContentType = CONTENT_TYPE[selectedTab];\n  const noPaddingRessources =\n    ContentType === MediaContent ? `${style.contentWrapperNoPadding}` : `${style.contentWrapper}`;\n\n  return (\n    <div className={noPaddingRessources} style={{backgroundColor: 'white'}}>\n      <div\n        data-name=\"question\"\n        className={classnames(\n          selectedTab === 'context' ? style.contextTitle : style.question,\n          innerHTML\n        )}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{\n          __html: selectedTab === 'context' ? slideContext.title : question\n        }}\n      />\n      {help && selectedTab === 'answer' && type !== 'qcmDrag' ? <Help help={help} /> : null}\n      <ContentType {...props} />\n      <ValidateButton {...props} />\n    </div>\n  );\n};\n\nContentLayout.contextTypes = {\n  translate: Provider.childContextTypes.translate,\n  skin: Provider.childContextTypes.skin\n};\n\nContentLayout.propTypes = {\n  typeClue: PropTypes.oneOf(keys(CONTENT_TYPE)),\n  question: PropTypes.string,\n  ...ValidateButton.propTypes\n};\n\n/*\n * Loading\n */\n\nconst LoadingLayout = () => (\n  <div className={style.loading}>\n    <Loader />\n  </div>\n);\n\nconst LoadedLayout = ({question, step, ...props}) =>\n  question ? <ContentLayout {...props} question={question} /> : <LoadingLayout />;\n\nLoadedLayout.propTypes = {\n  ...ContentLayout.propTypes,\n  question: ContentLayout.propTypes.question\n};\n\n/*\n * Errors\n */\n\nconst ErrorMessage = ({errorMsg}) => (\n  <div className={style.contentWrapper}>\n    <div className={style.error}>{errorMsg}</div>\n  </div>\n);\n\nErrorMessage.propTypes = {\n  errorMsg: PropTypes.string\n};\n\nconst Content = ({error, ...props}) =>\n  error ? <ErrorMessage {...props} /> : <LoadedLayout {...props} />;\n\nContent.propTypes = {\n  error: PropTypes.bool\n};\n\n/*\n * SlidesPlayer\n */\n\nconst SlidesPlayer = (props, context) => {\n  const {header, step, buttons, showNewMedia = false, showReviewLesson = false} = props;\n  const {skin} = context;\n  const stepColor = get('common.primary', skin);\n  const mediaButton = find({type: 'media'}, buttons) || {};\n  const {onClick = identity} = mediaButton;\n  return (\n    <div className={style.wrapper} data-name=\"slidesPlayer\">\n      {header ? <Header {...header} /> : null}\n      <div className={style.contentProgression}>\n        {step ? <Step step={step} color={stepColor} /> : null}\n        {showNewMedia && !showReviewLesson ? <NewMedia onClick={onClick} step={step} /> : null}\n        {showReviewLesson && !showNewMedia ? <ReviewLesson onClick={onClick} /> : null}\n        <Content {...props} />\n      </div>\n      <Footer buttons={buttons} />\n    </div>\n  );\n};\n\nSlidesPlayer.TYPE = CONTENT_TYPE;\n\nSlidesPlayer.contextTypes = {\n  translate: Provider.childContextTypes.translate,\n  skin: Provider.childContextTypes.skin\n};\n\nSlidesPlayer.propTypes = {\n  cta: ValidateButton.propTypes.cta,\n  step: Step.propTypes.step,\n  buttons: Footer.propTypes.buttons,\n  header: PropTypes.shape(Header.propTypes),\n  showNewMedia: PropTypes.bool,\n  showReviewLesson: PropTypes.bool,\n  backgroundUrl: SrcPropType\n};\n\nexport default SlidesPlayer;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../../../src/template/app-player/player/slides/index.js"],"names":["MediaView","media","style","contextMedia","propTypes","Picture","src","ClueContent","props","context","text","starsDiff","onClickSeeClue","clueWrapper","PropTypes","string","number","func","Bar","total","color","current","_current","stepWidth","stepBar","backgroundColor","width","isRequired","ColorPropType","Step","step","stepCount","stepWrapper","shape","NewMedia","translate","onClick","guideWrapper","newMedia","contextTypes","Provider","childContextTypes","ReviewLesson","reviewLesson","AnswerContent","answerType","help","Answer","MediaContent","resources","starsToWin","count","Math","abs","resourcesWrapper","stars","ResourceBrowser","ContextImage","images","map","url","_id","arrayOf","ContextVideo","videos","videoId","childProps","VideoPlayer","CONTEXT_MEDIA","img","pdf","PDF","audio","Audio","video","ContextMedia","ContentType","type","contextWrapper","contextPdfWrapper","contextAudioWrapper","oneOfType","oneOf","ContextContent","slideContext","descriptionParagraphs","paragraphs","paragraph","index","contextDescription","innerHTML","__html","title","description","CONTENT_TYPE","answer","clue","Help","helpView","ValidateButton","cta","ctaWrapper","Cta","ContentLayout","typeClue","selectedTab","model","question","noPaddingRessources","contentWrapperNoPadding","contentWrapper","contextTitle","skin","LoadingLayout","loading","LoadedLayout","ErrorMessage","errorMsg","error","Content","bool","SlidesPlayer","header","buttons","showNewMedia","showReviewLesson","stepColor","mediaButton","wrapper","contentProgression","TYPE","Footer","Header","backgroundUrl","SrcPropType"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {compact, find, get, getOr, keys, omit, identity, max, pipe, split} from 'lodash/fp';\nimport {ColorPropType, SrcPropType} from '../../../../util/proptypes';\nimport Cta from '../../../../atom/cta';\nimport Picture from '../../../../atom/picture';\nimport Provider from '../../../../atom/provider';\nimport Clue from '../../../../atom/clue';\nimport Answer from '../../../../molecule/answer';\nimport Loader from '../../../../atom/loader';\nimport Swapper from '../../../../hoc/swapper';\nimport VideoPlayer from '../../../../molecule/video-player';\nimport PDF from '../../../../molecule/pdf';\nimport Audio from '../../../../molecule/audio';\nimport ResourceBrowser from '../../../../organism/resource-browser';\nimport Footer from './footer';\nimport Header from './header';\nimport style from './style.css';\n\nconst MediaView = ({media}) => {\n  return (\n    <div className={style.contextMedia}>\n      <Picture src={media} />\n    </div>\n  );\n};\n\nMediaView.propTypes = {\n  media: Picture.propTypes.src\n};\n\n/*\n * Content types\n */\n\nconst ClueContent = (props, context) => {\n  const {text, starsDiff, onClickSeeClue} = props;\n\n  return (\n    <div className={style.clueWrapper}>\n      <Clue text={text} starsDiff={starsDiff} onClick={onClickSeeClue} />\n    </div>\n  );\n};\n\nClueContent.propTypes = {\n  text: PropTypes.string,\n  starsDiff: PropTypes.number,\n  onClickSeeClue: PropTypes.func\n};\n\nconst Bar = ({total, color, current}) => {\n  const _current = max([current, 0]);\n\n  if (!total) {\n    return null;\n  }\n\n  const stepWidth = (_current / total) * 100;\n\n  return (\n    <div\n      className={style.stepBar}\n      style={{\n        backgroundColor: color,\n        width: `${stepWidth}%`\n      }}\n    />\n  );\n};\n\nBar.propTypes = {\n  current: PropTypes.number.isRequired,\n  total: PropTypes.number,\n  color: ColorPropType\n};\n\nconst Step = ({step, color}) => {\n  return (\n    <div data-name=\"step\">\n      <div data-name=\"counter\" className={style.stepCount}>\n        <span style={{color}}>{step.current}</span>/{step.total}\n      </div>\n      <div className={style.stepWrapper}>\n        <Swapper {...step} color={color} current={step.current - 1}>\n          <Bar {...step} color={color} />\n        </Swapper>\n      </div>\n    </div>\n  );\n};\n\nStep.propTypes = {\n  step: PropTypes.shape({\n    current: Bar.propTypes.current,\n    total: Bar.propTypes.total\n  }),\n  color: ColorPropType\n};\n\nconst NewMedia = (props, context) => {\n  const {translate} = context;\n  const {onClick, step} = props;\n  const current = get('current', step);\n  return (\n    <div\n      className={`${style.guideWrapper} ${style.newMedia}`}\n      onClick={onClick}\n      data-name=\"newMedia\"\n    >\n      <span>{translate(step === null || current === 1 ? 'See lesson' : 'New media')}</span>\n    </div>\n  );\n};\n\nNewMedia.propTypes = {\n  onClick: PropTypes.func,\n  step: Step.propTypes.step\n};\n\nNewMedia.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nconst ReviewLesson = (props, context) => {\n  const {translate} = context;\n  const {onClick} = props;\n\n  return (\n    <div\n      className={`${style.guideWrapper} ${style.reviewLesson}`}\n      onClick={onClick}\n      data-name=\"reviewLesson\"\n    >\n      <span>{translate('Review lesson')}</span>\n    </div>\n  );\n};\n\nReviewLesson.propTypes = {\n  onClick: PropTypes.func\n};\n\nReviewLesson.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nconst AnswerContent = ({answerType, help}) => <Answer {...answerType} help={help} />;\n\nAnswerContent.propTypes = {\n  answerType: PropTypes.shape(Answer.propTypes),\n  help: PropTypes.string\n};\n\nconst MediaContent = (props, context) => {\n  const {resources, starsDiff} = props;\n  const {translate} = context;\n  const starsToWin = translate('media_stars_to_win', {\n    count: Math.abs(starsDiff)\n  });\n\n  return (\n    <div className={style.resourcesWrapper}>\n      <ResourceBrowser resources={resources} />\n      <div className={style.stars}>{starsToWin}</div>\n    </div>\n  );\n};\n\nMediaContent.propTypes = {\n  resources: ResourceBrowser.propTypes.resources,\n  starsDiff: PropTypes.number\n};\n\nMediaContent.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nconst ContextImage = ({src}) => {\n  const images = src.map(({url, _id}) => <MediaView key={_id} media={url} />);\n  return <div>{images}</div>;\n};\n\nContextImage.propTypes = {\n  src: PropTypes.arrayOf(\n    PropTypes.shape({\n      _id: PropTypes.string,\n      url: PropTypes.string\n    })\n  )\n};\n\nconst ContextVideo = props => {\n  const {src} = props;\n  const videos = src.map(({videoId, ...childProps}) => (\n    <VideoPlayer {...omit('id', childProps)} id={videoId} key={videoId} autoplay={false} />\n  ));\n  return <div>{videos}</div>;\n};\n\nContextVideo.propTypes = {\n  src: PropTypes.arrayOf(PropTypes.shape(VideoPlayer.propTypes))\n};\n\nconst CONTEXT_MEDIA = {\n  img: ContextImage,\n  pdf: PDF,\n  audio: Audio,\n  video: ContextVideo\n};\n\nconst ContextMedia = ({media}) => {\n  const ContentType = CONTEXT_MEDIA[media.type];\n  return (\n    <div\n      data-name=\"contextMedia\"\n      className={classnames(\n        style.contextWrapper,\n        media.type === 'pdf' ? style.contextPdfWrapper : null,\n        media.type === 'audio' ? style.contextAudioWrapper : null\n      )}\n    >\n      <ContentType {...media} />\n    </div>\n  );\n};\n\nContextMedia.propTypes = {\n  media: PropTypes.oneOfType([\n    PropTypes.shape({\n      ...ContextImage.propTypes,\n      type: PropTypes.oneOf(['img'])\n    }),\n    PropTypes.shape({\n      ...PDF.propTypes,\n      type: PropTypes.oneOf(['pdf'])\n    }),\n    PropTypes.shape({\n      ...Audio.propTypes,\n      type: PropTypes.oneOf(['audio'])\n    }),\n    PropTypes.shape({\n      ...ContextVideo.propTypes,\n      type: PropTypes.oneOf(['video'])\n    })\n  ])\n};\n\nconst ContextContent = ({slideContext}) => {\n  const descriptionParagraphs = pipe(getOr('', 'description'), split('\\n'), compact)(slideContext);\n  const paragraphs = descriptionParagraphs.map((paragraph, index) => (\n    <p\n      key={index}\n      data-name=\"contextDescription\"\n      className={classnames(style.contextDescription, style.innerHTML)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: paragraph}}\n    />\n  ));\n  return (\n    <div className={style.context}>\n      {get('media.type', slideContext) ? <ContextMedia media={slideContext.media} /> : null}\n      {paragraphs}\n    </div>\n  );\n};\n\nContextContent.propTypes = {\n  slideContext: PropTypes.shape({\n    title: PropTypes.string,\n    description: PropTypes.string,\n    media: PropTypes.shape(ContextMedia.propTypes)\n  })\n};\n\nconst CONTENT_TYPE = {\n  answer: AnswerContent,\n  clue: ClueContent,\n  context: ContextContent,\n  media: MediaContent\n};\n\nconst Help = ({help}) => (\n  <div\n    className={classnames(style.helpView, style.innerHTML)}\n    // eslint-disable-next-line react/no-danger\n    dangerouslySetInnerHTML={{__html: help}}\n  />\n);\n\nHelp.propTypes = {\n  help: PropTypes.string\n};\n\nconst ValidateButton = ({cta}) => {\n  if (!cta) {\n    return null;\n  }\n\n  return (\n    <div className={style.ctaWrapper}>\n      <Cta {...cta} className={style.cta} />\n    </div>\n  );\n};\n\nValidateButton.propTypes = {\n  cta: PropTypes.shape(Cta.propTypes)\n};\n\nconst ContentLayout = (props, context) => {\n  const {\n    typeClue: selectedTab,\n    answerType: {model: {type} = {}} = {},\n    question,\n    help,\n    slideContext\n  } = props;\n  const ContentType = CONTENT_TYPE[selectedTab];\n  const noPaddingRessources =\n    ContentType === MediaContent ? `${style.contentWrapperNoPadding}` : `${style.contentWrapper}`;\n\n  return (\n    <div className={noPaddingRessources} style={{backgroundColor: 'white'}}>\n      <div\n        data-name=\"question\"\n        className={classnames(\n          selectedTab === 'context' ? style.contextTitle : style.question,\n          style.innerHTML\n        )}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{\n          __html: selectedTab === 'context' ? slideContext.title : question\n        }}\n      />\n      {help && selectedTab === 'answer' && type !== 'qcmDrag' ? <Help help={help} /> : null}\n      <ContentType {...props} />\n      <ValidateButton {...props} />\n    </div>\n  );\n};\n\nContentLayout.contextTypes = {\n  translate: Provider.childContextTypes.translate,\n  skin: Provider.childContextTypes.skin\n};\n\nContentLayout.propTypes = {\n  typeClue: PropTypes.oneOf(keys(CONTENT_TYPE)),\n  question: PropTypes.string,\n  ...ValidateButton.propTypes\n};\n\n/*\n * Loading\n */\n\nconst LoadingLayout = () => (\n  <div className={style.loading}>\n    <Loader />\n  </div>\n);\n\nconst LoadedLayout = ({question, step, ...props}) =>\n  question ? <ContentLayout {...props} question={question} /> : <LoadingLayout />;\n\nLoadedLayout.propTypes = {\n  ...ContentLayout.propTypes,\n  question: ContentLayout.propTypes.question\n};\n\n/*\n * Errors\n */\n\nconst ErrorMessage = ({errorMsg}) => (\n  <div className={style.contentWrapper}>\n    <div className={style.error}>{errorMsg}</div>\n  </div>\n);\n\nErrorMessage.propTypes = {\n  errorMsg: PropTypes.string\n};\n\nconst Content = ({error, ...props}) =>\n  error ? <ErrorMessage {...props} /> : <LoadedLayout {...props} />;\n\nContent.propTypes = {\n  error: PropTypes.bool\n};\n\n/*\n * SlidesPlayer\n */\n\nconst SlidesPlayer = (props, context) => {\n  const {header, step, buttons, showNewMedia = false, showReviewLesson = false} = props;\n  const {skin} = context;\n  const stepColor = get('common.primary', skin);\n  const mediaButton = find({type: 'media'}, buttons) || {};\n  const {onClick = identity} = mediaButton;\n  return (\n    <div className={style.wrapper} data-name=\"slidesPlayer\">\n      {header ? <Header {...header} /> : null}\n      <div className={style.contentProgression}>\n        {step ? <Step step={step} color={stepColor} /> : null}\n        {showNewMedia && !showReviewLesson ? <NewMedia onClick={onClick} step={step} /> : null}\n        {showReviewLesson && !showNewMedia ? <ReviewLesson onClick={onClick} /> : null}\n        <Content {...props} />\n      </div>\n      <Footer buttons={buttons} />\n    </div>\n  );\n};\n\nSlidesPlayer.TYPE = CONTENT_TYPE;\n\nSlidesPlayer.contextTypes = {\n  translate: Provider.childContextTypes.translate,\n  skin: Provider.childContextTypes.skin\n};\n\nSlidesPlayer.propTypes = {\n  cta: ValidateButton.propTypes.cta,\n  step: Step.propTypes.step,\n  buttons: Footer.propTypes.buttons,\n  header: PropTypes.shape(Header.propTypes),\n  showNewMedia: PropTypes.bool,\n  showReviewLesson: PropTypes.bool,\n  backgroundUrl: SrcPropType\n};\n\nexport default SlidesPlayer;\n"],"file":"index.js"}

package/lib/template/app-player/player/slides/style.css

@@ -271,6 +271,11 @@
   justify-content: center;
 }
 
+.innerHTML {
+  composes: innerHTML from '../../../../atom/label/style.css';
+}
+
+
 @media tablet {
   .wrapper {
     box-shadow: none;