@coorpacademy/components 11.32.26 → 11.32.28

package/lib/template/back-office/brand-update/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["getStyle","isSelected","style","selectedElement","unselectedElement","subTabsView","_subTabs","map","convert","cap","subTab","_index","title","type","selected","buildLeftNavigation","logo","items","onItemClick","formattedTabs","key","href","index","children","iconType","formattedTabsViews","tab","tabs","navigation","buildNotifications","notifications","isEmpty","notificationsList","notification","temporary","permanentNotification","find","permanentNotifications","buildHeader","header","buildPopin","popin","buildDocumentation","documentation","show","onClose","content","classNames","open","documentationContent","__html","closeButton","buildTabs","selectedTab","pipe","e","get","showTabs","subTabs","undefined","buildContentView","loaderContainer","loader","buildDetailsView","details","BrandUpdate","props","contentFixHeight","leftNavigation","notificationsView","documentationView","headerView","tabsView","contentView","detailsView","popinView","contentStyle","contentWithNotifications","container","left","contentWrapper","headerSticky","defaultProps","propTypes","PropTypes","arrayOf","shape","Banner","Header","string","isRequired","bool","oneOfType","BrandForm","oneOf","BrandTable","BrandUpload","BrandAnalytics","BrandDashboard","WizardContents","ListItems","BulkInfos","ExpandibleActionableTable","BrandLearningPriorities","func","CmPopin"],"sources":["../../../../src/template/back-office/brand-update/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport map from 'lodash/fp/map';\nimport pipe from 'lodash/fp/pipe';\nimport get from 'lodash/fp/get';\nimport isEmpty from 'lodash/fp/isEmpty';\nimport find from 'lodash/fp/find';\nimport classNames from 'classnames';\nimport BrandTabs from '../../../molecule/brand-tabs';\nimport {IconLinkItem, LinkItem} from '../../../organism/sidebar';\nimport BrandForm from '../../../organism/brand-form';\nimport BrandTable from '../../../organism/brand-table';\nimport BrandUpload from '../../../organism/brand-upload';\nimport BrandAnalytics from '../../../organism/brand-analytics';\nimport BrandDashboard from '../../../organism/brand-dashboard';\nimport WizardContents from '../../../organism/wizard-contents';\nimport ListItems from '../../../organism/list-items';\nimport BrandLearningPriorities from '../../../organism/brand-learning-priorities';\nimport Banner from '../../../molecule/banner';\nimport Header from '../../../organism/setup-header';\nimport Loader from '../../../atom/loader';\nimport Accordion from '../../../organism/accordion/coorp-manager';\nimport CmPopin from '../../../molecule/cm-popin';\nimport ButtonLinkIconOnly from '../../../atom/button-link-icon-only';\nimport ExpandibleActionableTable from '../../../molecule/expandible-actionable-table';\nimport BulkInfos from '../../../molecule/bulk-infos';\nimport style from './style.css';\n\nconst getStyle = isSelected => (isSelected ? style.selectedElement : style.unselectedElement);\n\nconst subTabsView = (_subTabs = []) =>\n  map.convert({cap: false})((subTab, _index) => (\n    <div key={subTab.title}>\n      {subTab.type === 'iconLink' ? (\n        <IconLinkItem\n          {...subTab}\n          styles={getStyle(subTab.selected)}\n          uppercase={false}\n          target={'_blank'}\n        />\n      ) : (\n        <LinkItem\n          {...subTab}\n          styles={getStyle(subTab.selected)}\n          uppercase={false}\n          setChildrenAsHtml={false}\n        />\n      )}\n    </div>\n  ))(_subTabs);\n\n// TODO: this fonction should be replaced by a molecule to avoid this file to be unreadable\nconst buildLeftNavigation = (logo, items, onItemClick) => {\n  const formattedTabs = items.map(({key, title, href, selected, type = 'simpleTab'}, index) => ({\n    title,\n    selected,\n    type,\n    href,\n    index,\n    children: [],\n    iconType: key || 'arrow'\n  }));\n\n  const formattedTabsViews = map(tab => (\n    <div key={tab.title} className={style.subTabsView}>\n      {subTabsView(tab.tabs)}\n    </div>\n  ))(items);\n\n  return (\n    <div className={style.navigation}>\n      <div className={style.logo}>\n        <a href=\"/\">\n          <img src={logo} />\n        </a>\n      </div>\n      <Accordion tabProps={formattedTabs} theme={'setup'} onClick={onItemClick}>\n        {formattedTabsViews}\n      </Accordion>\n    </div>\n  );\n};\n\nconst buildNotifications = notifications => {\n  if (isEmpty(notifications)) {\n    return null;\n  }\n\n  const notificationsList = notifications.map((notification, index) => {\n    return (\n      <div className={!notification.temporary ? style.permanentNotification : null} key={index}>\n        <Banner {...notification} />\n      </div>\n    );\n  });\n  return (\n    <div className={!find({temporary: true}, notifications) ? style.permanentNotifications : null}>\n      {notificationsList}\n    </div>\n  );\n};\n\nconst buildHeader = header => {\n  return (\n    <div className={style.header}>\n      <Header {...header} />\n    </div>\n  );\n};\n\nconst buildPopin = popin => {\n  return popin ? (\n    <div className={style.popin}>\n      <CmPopin {...popin} />\n    </div>\n  ) : null;\n};\n\nconst buildDocumentation = documentation => {\n  if (!documentation) return null;\n  const {show = false, onClose, content = ''} = documentation;\n  return (\n    <div className={classNames(style.documentation, show && style.open)}>\n      <div\n        className={style.documentationContent}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{__html: content}}\n      />\n      {onClose ? (\n        <ButtonLinkIconOnly\n          className={style.closeButton}\n          onClick={onClose}\n          data-name={'close-icon'}\n          aria-label={'close-icon'}\n          size=\"small\"\n          icon=\"close\"\n        />\n      ) : null}\n    </div>\n  );\n};\n\nconst buildTabs = items => {\n  const selectedTab = pipe(\n    find(e => e.selected),\n    get('tabs'),\n    find(e => e.selected)\n  )(items);\n\n  const showTabs = selectedTab ? find(e => e.selected, selectedTab.subTabs) : undefined;\n  if (!showTabs) return null;\n  return (\n    <div className={style.tabs}>\n      <BrandTabs type=\"light\" tabs={selectedTab.subTabs} />\n    </div>\n  );\n};\n\nconst buildContentView = content => {\n  if (!content) {\n    return (\n      <div className={style.loaderContainer}>\n        <Loader className={style.loader} theme=\"coorpmanager\" />\n      </div>\n    );\n  }\n\n  const {type} = content;\n  switch (type) {\n    case 'form':\n      return <BrandForm {...content} />;\n    case 'list':\n      return <BrandTable {...content} />;\n    case 'upload':\n      return <BrandUpload {...content} />;\n    case 'analytics-dashboards':\n      return <BrandAnalytics {...content} />;\n    case 'list-content':\n    case 'expandible-actionable-table':\n      return <ListItems {...content} />;\n    case 'home':\n      return <BrandDashboard {...content} />;\n    case 'wizard':\n    case 'expandible-table':\n      return <WizardContents {...content} />;\n    case 'bulk-empty-dashboard':\n      return <BulkInfos {...content} />;\n    case 'table-pending':\n      return <ExpandibleActionableTable {...content} />;\n    case 'learning-priorities':\n      return <BrandLearningPriorities {...content} />;\n  }\n};\n\nconst buildDetailsView = details => {\n  if (!details) return;\n  return <BrandTable {...details} />;\n};\n\nconst BrandUpdate = props => {\n  const {\n    notifications,\n    header,\n    items,\n    content,\n    details,\n    popin,\n    onItemClick,\n    documentation,\n    contentFixHeight\n  } = props;\n  const logo = 'https://static.coorpacademy.com/logo/coorp-manager.svg';\n\n  const leftNavigation = buildLeftNavigation(logo, items, onItemClick);\n  const notificationsView = buildNotifications(notifications);\n  const documentationView = buildDocumentation(documentation);\n  const headerView = buildHeader(header, notifications);\n  const tabsView = buildTabs(items);\n  const contentView = buildContentView(content);\n  const detailsView = buildDetailsView(details);\n  const popinView = buildPopin(popin);\n\n  const contentStyle = classNames([\n    style.content,\n    !isEmpty(notifications) && style.contentWithNotifications,\n    contentFixHeight && style.contentFixHeight\n  ]);\n\n  return (\n    <div className={style.container}>\n      <div className={style.left}>{leftNavigation}</div>\n      <div className={style.contentWrapper}>\n        <div className={style.headerSticky}>{headerView}</div>\n        <div className={contentStyle}>\n          {notificationsView}\n          {tabsView}\n          {contentView}\n          {detailsView}\n          {documentationView}\n        </div>\n      </div>\n      {popinView}\n    </div>\n  );\n};\n\nBrandUpdate.defaultProps = {\n  notifications: []\n};\n\nBrandUpdate.propTypes = {\n  notifications: PropTypes.arrayOf(\n    PropTypes.shape({\n      ...Banner.propTypes\n    })\n  ),\n  header: PropTypes.shape({...Header.propTypes}),\n  items: PropTypes.arrayOf(\n    PropTypes.shape({\n      key: PropTypes.string,\n      title: PropTypes.string.isRequired,\n      href: PropTypes.string.isRequired,\n      selected: PropTypes.bool.isRequired,\n      type: PropTypes.string,\n      tabs: PropTypes.arrayOf(\n        PropTypes.shape({\n          title: PropTypes.string.isRequired,\n          href: PropTypes.string.isRequired,\n          selected: PropTypes.bool.isRequired,\n          type: PropTypes.string,\n          subTabs: PropTypes.arrayOf(\n            PropTypes.shape({\n              title: PropTypes.string.isRequired,\n              href: PropTypes.string.isRequired,\n              selected: PropTypes.bool.isRequired,\n              type: PropTypes.string\n            })\n          )\n        })\n      )\n    })\n  ).isRequired,\n  content: PropTypes.oneOfType([\n    PropTypes.shape({\n      ...BrandForm.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['form'])\n    }),\n    PropTypes.shape({\n      ...BrandTable.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['list'])\n    }),\n    PropTypes.shape({\n      ...BrandUpload.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['upload'])\n    }),\n    PropTypes.shape({\n      ...BrandAnalytics.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['analytics-dashboards'])\n    }),\n    PropTypes.shape({\n      ...BrandDashboard.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['home'])\n    }),\n    PropTypes.shape({\n      ...WizardContents.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['wizard'])\n    }),\n    PropTypes.shape({\n      ...ListItems.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['list-content', 'expandible-actionable-table'])\n    }),\n    PropTypes.shape({\n      ...BulkInfos.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['bulk-empty-dashboard'])\n    }),\n    PropTypes.shape({\n      ...ExpandibleActionableTable.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['table-pending'])\n    }),\n    PropTypes.shape({\n      ...WizardContents.propTypes,\n      content: PropTypes.shape({\n        ...ExpandibleActionableTable.propTypes,\n        ...WizardContents.propTypes.content.propTypes\n      }),\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['expandible-table'])\n    }),\n    PropTypes.shape({\n      ...BrandLearningPriorities.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['learning-priorities'])\n    })\n  ]),\n  documentation: PropTypes.shape({\n    content: PropTypes.string,\n    show: PropTypes.bool,\n    onClose: PropTypes.func\n  }),\n  popin: PropTypes.shape({...CmPopin.propTypes}),\n  details: PropTypes.shape({\n    ...BrandTable.propTypes,\n    key: PropTypes.string,\n    type: PropTypes.oneOf(['list'])\n  }),\n  onItemClick: PropTypes.func,\n  contentFixHeight: PropTypes.bool\n};\n\nexport default BrandUpdate;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["getStyle","isSelected","style","selectedElement","unselectedElement","subTabsView","_subTabs","map","convert","cap","subTab","_index","title","type","selected","buildLeftNavigation","logo","items","onItemClick","formattedTabs","key","href","index","children","iconType","formattedTabsViews","tab","tabs","navigation","buildNotifications","notifications","isEmpty","notificationsList","notification","temporary","permanentNotification","find","permanentNotifications","buildHeader","header","buildPopin","popin","buildDocumentation","documentation","show","onClose","content","classNames","open","documentationContent","__html","closeButton","buildTabs","selectedTab","pipe","e","get","showTabs","subTabs","undefined","buildContentView","loaderContainer","loader","buildDetailsView","details","BrandUpdate","props","contentFixHeight","leftNavigation","notificationsView","documentationView","headerView","tabsView","contentView","detailsView","popinView","contentStyle","contentWithNotifications","container","left","contentWrapper","headerSticky","defaultProps","propTypes","PropTypes","arrayOf","shape","Banner","Header","string","isRequired","bool","oneOfType","BrandForm","oneOf","BrandTable","BrandUpload","BrandAnalytics","BrandDashboard","WizardContents","ListItems","BulkInfos","ExpandibleActionableTable","BrandLearningPriorities","func","CmPopin"],"sources":["../../../../src/template/back-office/brand-update/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport map from 'lodash/fp/map';\nimport pipe from 'lodash/fp/pipe';\nimport get from 'lodash/fp/get';\nimport isEmpty from 'lodash/fp/isEmpty';\nimport find from 'lodash/fp/find';\nimport classNames from 'classnames';\nimport BrandTabs from '../../../molecule/brand-tabs';\nimport {IconLinkItem, LinkItem} from '../../../organism/sidebar';\nimport BrandForm from '../../../organism/brand-form';\nimport BrandTable from '../../../organism/brand-table';\nimport BrandUpload from '../../../organism/brand-upload';\nimport BrandAnalytics from '../../../organism/brand-analytics';\nimport BrandDashboard from '../../../organism/brand-dashboard';\nimport WizardContents from '../../../organism/wizard-contents';\nimport ListItems from '../../../organism/list-items';\nimport BrandLearningPriorities from '../../../organism/brand-learning-priorities';\nimport Banner from '../../../molecule/banner';\nimport Header from '../../../organism/setup-header';\nimport Loader from '../../../atom/loader';\nimport Accordion from '../../../organism/accordion/coorp-manager';\nimport CmPopin from '../../../molecule/cm-popin';\nimport ButtonLinkIcon from '../../../atom/button-link-icon';\nimport ExpandibleActionableTable from '../../../molecule/expandible-actionable-table';\nimport BulkInfos from '../../../molecule/bulk-infos';\nimport style from './style.css';\n\nconst getStyle = isSelected => (isSelected ? style.selectedElement : style.unselectedElement);\n\nconst subTabsView = (_subTabs = []) =>\n  map.convert({cap: false})((subTab, _index) => (\n    <div key={subTab.title}>\n      {subTab.type === 'iconLink' ? (\n        <IconLinkItem\n          {...subTab}\n          styles={getStyle(subTab.selected)}\n          uppercase={false}\n          target={'_blank'}\n        />\n      ) : (\n        <LinkItem\n          {...subTab}\n          styles={getStyle(subTab.selected)}\n          uppercase={false}\n          setChildrenAsHtml={false}\n        />\n      )}\n    </div>\n  ))(_subTabs);\n\n// TODO: this fonction should be replaced by a molecule to avoid this file to be unreadable\nconst buildLeftNavigation = (logo, items, onItemClick) => {\n  const formattedTabs = items.map(({key, title, href, selected, type = 'simpleTab'}, index) => ({\n    title,\n    selected,\n    type,\n    href,\n    index,\n    children: [],\n    iconType: key || 'arrow'\n  }));\n\n  const formattedTabsViews = map(tab => (\n    <div key={tab.title} className={style.subTabsView}>\n      {subTabsView(tab.tabs)}\n    </div>\n  ))(items);\n\n  return (\n    <div className={style.navigation}>\n      <div className={style.logo}>\n        <a href=\"/\">\n          <img src={logo} />\n        </a>\n      </div>\n      <Accordion tabProps={formattedTabs} theme={'setup'} onClick={onItemClick}>\n        {formattedTabsViews}\n      </Accordion>\n    </div>\n  );\n};\n\nconst buildNotifications = notifications => {\n  if (isEmpty(notifications)) {\n    return null;\n  }\n\n  const notificationsList = notifications.map((notification, index) => {\n    return (\n      <div className={!notification.temporary ? style.permanentNotification : null} key={index}>\n        <Banner {...notification} />\n      </div>\n    );\n  });\n  return (\n    <div className={!find({temporary: true}, notifications) ? style.permanentNotifications : null}>\n      {notificationsList}\n    </div>\n  );\n};\n\nconst buildHeader = header => {\n  return (\n    <div className={style.header}>\n      <Header {...header} />\n    </div>\n  );\n};\n\nconst buildPopin = popin => {\n  return popin ? (\n    <div className={style.popin}>\n      <CmPopin {...popin} />\n    </div>\n  ) : null;\n};\n\nconst buildDocumentation = documentation => {\n  if (!documentation) return null;\n  const {show = false, onClose, content = ''} = documentation;\n  return (\n    <div className={classNames(style.documentation, show && style.open)}>\n      <div\n        className={style.documentationContent}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{__html: content}}\n      />\n      {onClose ? (\n        <ButtonLinkIcon\n          className={style.closeButton}\n          onClick={onClose}\n          data-name={'close-icon'}\n          aria-label={'close-icon'}\n          size=\"small\"\n          icon=\"close\"\n        />\n      ) : null}\n    </div>\n  );\n};\n\nconst buildTabs = items => {\n  const selectedTab = pipe(\n    find(e => e.selected),\n    get('tabs'),\n    find(e => e.selected)\n  )(items);\n\n  const showTabs = selectedTab ? find(e => e.selected, selectedTab.subTabs) : undefined;\n  if (!showTabs) return null;\n  return (\n    <div className={style.tabs}>\n      <BrandTabs type=\"light\" tabs={selectedTab.subTabs} />\n    </div>\n  );\n};\n\nconst buildContentView = content => {\n  if (!content) {\n    return (\n      <div className={style.loaderContainer}>\n        <Loader className={style.loader} theme=\"coorpmanager\" />\n      </div>\n    );\n  }\n\n  const {type} = content;\n  switch (type) {\n    case 'form':\n      return <BrandForm {...content} />;\n    case 'list':\n      return <BrandTable {...content} />;\n    case 'upload':\n      return <BrandUpload {...content} />;\n    case 'analytics-dashboards':\n      return <BrandAnalytics {...content} />;\n    case 'list-content':\n    case 'expandible-actionable-table':\n      return <ListItems {...content} />;\n    case 'home':\n      return <BrandDashboard {...content} />;\n    case 'wizard':\n    case 'expandible-table':\n      return <WizardContents {...content} />;\n    case 'bulk-empty-dashboard':\n      return <BulkInfos {...content} />;\n    case 'table-pending':\n      return <ExpandibleActionableTable {...content} />;\n    case 'learning-priorities':\n      return <BrandLearningPriorities {...content} />;\n  }\n};\n\nconst buildDetailsView = details => {\n  if (!details) return;\n  return <BrandTable {...details} />;\n};\n\nconst BrandUpdate = props => {\n  const {\n    notifications,\n    header,\n    items,\n    content,\n    details,\n    popin,\n    onItemClick,\n    documentation,\n    contentFixHeight\n  } = props;\n  const logo = 'https://static.coorpacademy.com/logo/coorp-manager.svg';\n\n  const leftNavigation = buildLeftNavigation(logo, items, onItemClick);\n  const notificationsView = buildNotifications(notifications);\n  const documentationView = buildDocumentation(documentation);\n  const headerView = buildHeader(header, notifications);\n  const tabsView = buildTabs(items);\n  const contentView = buildContentView(content);\n  const detailsView = buildDetailsView(details);\n  const popinView = buildPopin(popin);\n\n  const contentStyle = classNames([\n    style.content,\n    !isEmpty(notifications) && style.contentWithNotifications,\n    contentFixHeight && style.contentFixHeight\n  ]);\n\n  return (\n    <div className={style.container}>\n      <div className={style.left}>{leftNavigation}</div>\n      <div className={style.contentWrapper}>\n        <div className={style.headerSticky}>{headerView}</div>\n        <div className={contentStyle}>\n          {notificationsView}\n          {tabsView}\n          {contentView}\n          {detailsView}\n          {documentationView}\n        </div>\n      </div>\n      {popinView}\n    </div>\n  );\n};\n\nBrandUpdate.defaultProps = {\n  notifications: []\n};\n\nBrandUpdate.propTypes = {\n  notifications: PropTypes.arrayOf(\n    PropTypes.shape({\n      ...Banner.propTypes\n    })\n  ),\n  header: PropTypes.shape({...Header.propTypes}),\n  items: PropTypes.arrayOf(\n    PropTypes.shape({\n      key: PropTypes.string,\n      title: PropTypes.string.isRequired,\n      href: PropTypes.string.isRequired,\n      selected: PropTypes.bool.isRequired,\n      type: PropTypes.string,\n      tabs: PropTypes.arrayOf(\n        PropTypes.shape({\n          title: PropTypes.string.isRequired,\n          href: PropTypes.string.isRequired,\n          selected: PropTypes.bool.isRequired,\n          type: PropTypes.string,\n          subTabs: PropTypes.arrayOf(\n            PropTypes.shape({\n              title: PropTypes.string.isRequired,\n              href: PropTypes.string.isRequired,\n              selected: PropTypes.bool.isRequired,\n              type: PropTypes.string\n            })\n          )\n        })\n      )\n    })\n  ).isRequired,\n  content: PropTypes.oneOfType([\n    PropTypes.shape({\n      ...BrandForm.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['form'])\n    }),\n    PropTypes.shape({\n      ...BrandTable.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['list'])\n    }),\n    PropTypes.shape({\n      ...BrandUpload.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['upload'])\n    }),\n    PropTypes.shape({\n      ...BrandAnalytics.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['analytics-dashboards'])\n    }),\n    PropTypes.shape({\n      ...BrandDashboard.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['home'])\n    }),\n    PropTypes.shape({\n      ...WizardContents.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['wizard'])\n    }),\n    PropTypes.shape({\n      ...ListItems.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['list-content', 'expandible-actionable-table'])\n    }),\n    PropTypes.shape({\n      ...BulkInfos.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['bulk-empty-dashboard'])\n    }),\n    PropTypes.shape({\n      ...ExpandibleActionableTable.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['table-pending'])\n    }),\n    PropTypes.shape({\n      ...WizardContents.propTypes,\n      content: PropTypes.shape({\n        ...ExpandibleActionableTable.propTypes,\n        ...WizardContents.propTypes.content.propTypes\n      }),\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['expandible-table'])\n    }),\n    PropTypes.shape({\n      ...BrandLearningPriorities.propTypes,\n      key: PropTypes.string,\n      type: PropTypes.oneOf(['learning-priorities'])\n    })\n  ]),\n  documentation: PropTypes.shape({\n    content: PropTypes.string,\n    show: PropTypes.bool,\n    onClose: PropTypes.func\n  }),\n  popin: PropTypes.shape({...CmPopin.propTypes}),\n  details: PropTypes.shape({\n    ...BrandTable.propTypes,\n    key: PropTypes.string,\n    type: PropTypes.oneOf(['list'])\n  }),\n  onItemClick: PropTypes.func,\n  contentFixHeight: PropTypes.bool\n};\n\nexport default BrandUpdate;\n"],"mappings":"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"}

package/lib/template/common/faq-article-page/index.js

@@ -7,7 +7,7 @@ var _map2 = _interopRequireDefault(require("lodash/fp/map"));
 
 var _react = _interopRequireDefault(require("react"));
 
-var _buttonLinkIconOnly = _interopRequireDefault(require("../../../atom/button-link-icon-only"));
+var _buttonLinkIcon = _interopRequireDefault(require("../../../atom/button-link-icon"));
 
 var _privacyPolicyContact = _interopRequireDefault(require("../../../molecule/privacy-policy-contact"));
 
@@ -37,7 +37,7 @@ const FAQArticlePage = ({
     className: _style.default.container
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.backContainer
-  }, /*#__PURE__*/_react.default.createElement(_buttonLinkIconOnly.default, backButton), /*#__PURE__*/_react.default.createElement("span", null, backButtonText)), /*#__PURE__*/_react.default.createElement("h1", {
+  }, /*#__PURE__*/_react.default.createElement(_buttonLinkIcon.default, backButton), /*#__PURE__*/_react.default.createElement("span", null, backButtonText)), /*#__PURE__*/_react.default.createElement("h1", {
     className: _style.default.title
   }, title), mapWithIndex((item, index) => {
     return /*#__PURE__*/_react.default.createElement("div", {
@@ -58,7 +58,7 @@ const FAQArticlePage = ({
     }));
   }, subArticles), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.backContainerMobile
-  }, /*#__PURE__*/_react.default.createElement(_buttonLinkIconOnly.default, backButton), /*#__PURE__*/_react.default.createElement("span", null, backButtonText)))), /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement(_buttonLinkIcon.default, backButton), /*#__PURE__*/_react.default.createElement("span", null, backButtonText)))), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.privacyPolicyContact
   }, /*#__PURE__*/_react.default.createElement(_privacyPolicyContact.default, privacyPolicyContact)));
 };

package/lib/template/common/faq-article-page/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["mapWithIndex","convert","cap","FAQArticlePage","title","backButton","backButtonText","subArticles","privacyPolicyContact","styles","wrapper","page","container","backContainer","item","index","article","text","subTitle","__html","img","image","backContainerMobile","propTypes"],"sources":["../../../../src/template/common/faq-article-page/index.tsx"],"sourcesContent":["import React from 'react';\nimport {map} from 'lodash/fp';\nimport ButtonLinkIconOnly from '../../../atom/button-link-icon-only';\nimport PrivacyPolicyContact from '../../../molecule/privacy-policy-contact';\nimport {propTypes, Props, SubArticle} from './types';\nimport styles from './style.css';\n\n// @ts-expect-error (need to get the index)\nconst mapWithIndex = map.convert({cap: false});\n\nconst FAQArticlePage = ({\n  title,\n  backButton,\n  backButtonText,\n  subArticles,\n  privacyPolicyContact\n}: Props) => {\n  return (\n    <div className={styles.wrapper}>\n      <div className={styles.page}>\n        <div className={styles.container}>\n          <div className={styles.backContainer}>\n            <ButtonLinkIconOnly {...backButton} />\n            <span>{backButtonText}</span>\n          </div>\n          <h1 className={styles.title}>{title}</h1>\n          {mapWithIndex((item: SubArticle, index: number) => {\n            return (\n              <div className={styles.article} key={`${item.text}${index}`}>\n                <h3 className={styles.subTitle}>{item.subTitle}</h3>\n                <div\n                  className={styles.text}\n                  // eslint-disable-next-line react/no-danger\n                  dangerouslySetInnerHTML={{__html: item.text}}\n                />\n                <img className={styles.img} src={item.image} alt=\"\" />\n              </div>\n            );\n          }, subArticles)}\n          <div className={styles.backContainerMobile}>\n            <ButtonLinkIconOnly {...backButton} />\n            <span>{backButtonText}</span>\n          </div>\n        </div>\n      </div>\n      <div className={styles.privacyPolicyContact}>\n        <PrivacyPolicyContact {...privacyPolicyContact} />\n      </div>\n    </div>\n  );\n};\n\nFAQArticlePage.propTypes = propTypes;\n\nexport default FAQArticlePage;\n"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;;;AAEA;AACA,MAAMA,YAAY,GAAG,cAAIC,OAAJ,CAAY;EAACC,GAAG,EAAE;AAAN,CAAZ,CAArB;;AAEA,MAAMC,cAAc,GAAG,CAAC;EACtBC,KADsB;EAEtBC,UAFsB;EAGtBC,cAHsB;EAItBC,WAJsB;EAKtBC;AALsB,CAAD,KAMV;EACX,oBACE;IAAK,SAAS,EAAEC,cAAA,CAAOC;EAAvB,gBACE;IAAK,SAAS,EAAED,cAAA,CAAOE;EAAvB,gBACE;IAAK,SAAS,EAAEF,cAAA,CAAOG;EAAvB,gBACE;IAAK,SAAS,EAAEH,cAAA,CAAOI;EAAvB,gBACE,6BAAC,2BAAD,EAAwBR,UAAxB,CADF,eAEE,2CAAOC,cAAP,CAFF,CADF,eAKE;IAAI,SAAS,EAAEG,cAAA,CAAOL;EAAtB,GAA8BA,KAA9B,CALF,EAMGJ,YAAY,CAAC,CAACc,IAAD,EAAmBC,KAAnB,KAAqC;IACjD,oBACE;MAAK,SAAS,EAAEN,cAAA,CAAOO,OAAvB;MAAgC,GAAG,EAAG,GAAEF,IAAI,CAACG,IAAK,GAAEF,KAAM;IAA1D,gBACE;MAAI,SAAS,EAAEN,cAAA,CAAOS;IAAtB,GAAiCJ,IAAI,CAACI,QAAtC,CADF,eAEE;MACE,SAAS,EAAET,cAAA,CAAOQ,IADpB,CAEE;MAFF;MAGE,uBAAuB,EAAE;QAACE,MAAM,EAAEL,IAAI,CAACG;MAAd;IAH3B,EAFF,eAOE;MAAK,SAAS,EAAER,cAAA,CAAOW,GAAvB;MAA4B,GAAG,EAAEN,IAAI,CAACO,KAAtC;MAA6C,GAAG,EAAC;IAAjD,EAPF,CADF;EAWD,CAZY,EAYVd,WAZU,CANf,eAmBE;IAAK,SAAS,EAAEE,cAAA,CAAOa;EAAvB,gBACE,6BAAC,2BAAD,EAAwBjB,UAAxB,CADF,eAEE,2CAAOC,cAAP,CAFF,CAnBF,CADF,CADF,eA2BE;IAAK,SAAS,EAAEG,cAAA,CAAOD;EAAvB,gBACE,6BAAC,6BAAD,EAA0BA,oBAA1B,CADF,CA3BF,CADF;AAiCD,CAxCD;;AA0CAL,cAAc,CAACoB,SAAf,2CAA2BA,gBAA3B;eAEepB,c"}
+{"version":3,"file":"index.js","names":["mapWithIndex","convert","cap","FAQArticlePage","title","backButton","backButtonText","subArticles","privacyPolicyContact","styles","wrapper","page","container","backContainer","item","index","article","text","subTitle","__html","img","image","backContainerMobile","propTypes"],"sources":["../../../../src/template/common/faq-article-page/index.tsx"],"sourcesContent":["import React from 'react';\nimport {map} from 'lodash/fp';\nimport ButtonLinkIcon from '../../../atom/button-link-icon';\nimport PrivacyPolicyContact from '../../../molecule/privacy-policy-contact';\nimport {propTypes, Props, SubArticle} from './types';\nimport styles from './style.css';\n\n// @ts-expect-error (need to get the index)\nconst mapWithIndex = map.convert({cap: false});\n\nconst FAQArticlePage = ({\n  title,\n  backButton,\n  backButtonText,\n  subArticles,\n  privacyPolicyContact\n}: Props) => {\n  return (\n    <div className={styles.wrapper}>\n      <div className={styles.page}>\n        <div className={styles.container}>\n          <div className={styles.backContainer}>\n            <ButtonLinkIcon {...backButton} />\n            <span>{backButtonText}</span>\n          </div>\n          <h1 className={styles.title}>{title}</h1>\n          {mapWithIndex((item: SubArticle, index: number) => {\n            return (\n              <div className={styles.article} key={`${item.text}${index}`}>\n                <h3 className={styles.subTitle}>{item.subTitle}</h3>\n                <div\n                  className={styles.text}\n                  // eslint-disable-next-line react/no-danger\n                  dangerouslySetInnerHTML={{__html: item.text}}\n                />\n                <img className={styles.img} src={item.image} alt=\"\" />\n              </div>\n            );\n          }, subArticles)}\n          <div className={styles.backContainerMobile}>\n            <ButtonLinkIcon {...backButton} />\n            <span>{backButtonText}</span>\n          </div>\n        </div>\n      </div>\n      <div className={styles.privacyPolicyContact}>\n        <PrivacyPolicyContact {...privacyPolicyContact} />\n      </div>\n    </div>\n  );\n};\n\nFAQArticlePage.propTypes = propTypes;\n\nexport default FAQArticlePage;\n"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;;;AAEA;AACA,MAAMA,YAAY,GAAG,cAAIC,OAAJ,CAAY;EAACC,GAAG,EAAE;AAAN,CAAZ,CAArB;;AAEA,MAAMC,cAAc,GAAG,CAAC;EACtBC,KADsB;EAEtBC,UAFsB;EAGtBC,cAHsB;EAItBC,WAJsB;EAKtBC;AALsB,CAAD,KAMV;EACX,oBACE;IAAK,SAAS,EAAEC,cAAA,CAAOC;EAAvB,gBACE;IAAK,SAAS,EAAED,cAAA,CAAOE;EAAvB,gBACE;IAAK,SAAS,EAAEF,cAAA,CAAOG;EAAvB,gBACE;IAAK,SAAS,EAAEH,cAAA,CAAOI;EAAvB,gBACE,6BAAC,uBAAD,EAAoBR,UAApB,CADF,eAEE,2CAAOC,cAAP,CAFF,CADF,eAKE;IAAI,SAAS,EAAEG,cAAA,CAAOL;EAAtB,GAA8BA,KAA9B,CALF,EAMGJ,YAAY,CAAC,CAACc,IAAD,EAAmBC,KAAnB,KAAqC;IACjD,oBACE;MAAK,SAAS,EAAEN,cAAA,CAAOO,OAAvB;MAAgC,GAAG,EAAG,GAAEF,IAAI,CAACG,IAAK,GAAEF,KAAM;IAA1D,gBACE;MAAI,SAAS,EAAEN,cAAA,CAAOS;IAAtB,GAAiCJ,IAAI,CAACI,QAAtC,CADF,eAEE;MACE,SAAS,EAAET,cAAA,CAAOQ,IADpB,CAEE;MAFF;MAGE,uBAAuB,EAAE;QAACE,MAAM,EAAEL,IAAI,CAACG;MAAd;IAH3B,EAFF,eAOE;MAAK,SAAS,EAAER,cAAA,CAAOW,GAAvB;MAA4B,GAAG,EAAEN,IAAI,CAACO,KAAtC;MAA6C,GAAG,EAAC;IAAjD,EAPF,CADF;EAWD,CAZY,EAYVd,WAZU,CANf,eAmBE;IAAK,SAAS,EAAEE,cAAA,CAAOa;EAAvB,gBACE,6BAAC,uBAAD,EAAoBjB,UAApB,CADF,eAEE,2CAAOC,cAAP,CAFF,CAnBF,CADF,CADF,eA2BE;IAAK,SAAS,EAAEG,cAAA,CAAOD;EAAvB,gBACE,6BAAC,6BAAD,EAA0BA,oBAA1B,CADF,CA3BF,CADF;AAiCD,CAxCD;;AA0CAL,cAAc,CAACoB,SAAf,2CAA2BA,gBAA3B;eAEepB,c"}

package/lib/template/external-course/index.d.ts

@@ -4,6 +4,10 @@ declare namespace ExternalCourse {
     namespace propTypes {
         const name: PropTypes.Requireable<string>;
         const type: PropTypes.Requireable<string>;
+        const onTop: PropTypes.Requireable<PropTypes.InferProps<{
+            header: PropTypes.Requireable<boolean>;
+            footer: PropTypes.Requireable<boolean>;
+        }>>;
         const url: PropTypes.Validator<string>;
         const quit: PropTypes.Requireable<PropTypes.InferProps<{
             label: PropTypes.Validator<string>;

package/lib/template/external-course/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/external-course/index.js"],"names":[],"mappings":";AAoBA,uEAwIC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/external-course/index.js"],"names":[],"mappings":";AAoBA,uEA+IC"}

package/lib/template/external-course/index.js

@@ -65,6 +65,7 @@ const ExternalCourse = (props, context) => {
     backgroundImageUrl,
     contentType,
     mode = 'default',
+    onTop = {},
     closePopin
   } = props;
   const {
@@ -161,13 +162,17 @@ const ExternalCourse = (props, context) => {
     return !(0, _isNil2.default)(closePopin) ? /*#__PURE__*/_react.default.createElement(_cmPopin.default, closePopin) : null;
   }, [closePopin]);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: defaultWrapperStyle[mode]
+    className: (0, _classnames.default)(defaultWrapperStyle[mode], onTop.header && _style.default.onTopHeader, onTop.footer && _style.default.onTopFooter)
   }, header, popin, mainContentSlot, footer);
 };
 
 ExternalCourse.propTypes = process.env.NODE_ENV !== "production" ? {
   name: _propTypes.default.string,
   type: _propTypes.default.oneOf((0, _keys2.default)(_externalContent.EXTERNAL_CONTENT_ICONS)),
+  onTop: _propTypes.default.shape({
+    header: _propTypes.default.bool,
+    footer: _propTypes.default.bool
+  }),
   url: _propTypes.default.string.isRequired,
   quit: _propTypes.default.shape({
     label: _propTypes.default.string.isRequired,

package/lib/template/external-course/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["defaultWrapperStyle","default","style","cockpit","defaultCockpit","mobile","ExternalCourse","props","context","name","type","url","quit","complete","warning","loading","backgroundImageUrl","contentType","mode","closePopin","skin","primary","IconType","EXTERNAL_CONTENT_ICONS","icon","IconColor","color","mainContentSlot","useMemo","loader","handleOnClick","useCallback","field","onClick","e","stopPropagation","preventDefault","completeButton","disabled","label","backgroundColor","convert","cursor","classnames","completeCta","warningButton","leftSection","iconLabel","link","iconQuestion","quitButton","quitCta","titleSection","title","oval","iconHeader","innerHTML","__html","header","rightSection","footer","popin","propTypes","PropTypes","string","oneOf","isRequired","shape","func","bool","CmPopin","contextTypes","Provider","childContextTypes"],"sources":["../../../src/template/external-course/index.js"],"sourcesContent":["import React, {useCallback, useMemo} from 'react';\nimport {NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon} from '@coorpacademy/nova-icons';\nimport {convert} from 'css-color-function';\nimport classnames from 'classnames';\nimport {noop, getOr, keys, identity, isNil, isEmpty} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport {EXTERNAL_CONTENT_ICONS} from '../../util/external-content';\nimport Provider from '../../atom/provider';\nimport Loader from '../../atom/loader';\nimport Button from '../../atom/button';\nimport ExternalContentViewer from '../../molecule/external-content-viewer';\nimport CmPopin from '../../molecule/cm-popin';\nimport style from './style.css';\n\nconst defaultWrapperStyle = {\n  default: style.default,\n  cockpit: style.defaultCockpit,\n  mobile: style.default\n};\n\nconst ExternalCourse = (props, context) => {\n  const {\n    name,\n    type,\n    url,\n    quit,\n    complete,\n    warning,\n    loading,\n    backgroundImageUrl,\n    contentType,\n    mode = 'default',\n    closePopin\n  } = props;\n  const {skin} = context;\n  const primary = getOr('#00B0FF', 'common.primary', skin);\n  const IconType = EXTERNAL_CONTENT_ICONS[type].icon;\n  const IconColor = EXTERNAL_CONTENT_ICONS[type].color;\n\n  const mainContentSlot = useMemo(() => {\n    return loading ? (\n      <div className={style.loader}>\n        <Loader />\n      </div>\n    ) : (\n      <ExternalContentViewer\n        url={url}\n        mode={mode}\n        backgroundImageUrl={backgroundImageUrl}\n        contentType={contentType}\n      />\n    );\n  }, [loading, url, mode, contentType, backgroundImageUrl]);\n\n  const handleOnClick = useCallback(field => {\n    const onClick = getOr(noop, ['onClick'], field);\n    return e => {\n      e.stopPropagation();\n      e.preventDefault();\n      return onClick(e);\n    };\n  }, []);\n\n  const completeButton = useMemo(() => {\n    return !isNil(complete) ? (\n      <Button\n        type=\"button\"\n        disabled={loading ? true : complete.disabled}\n        onClick={loading ? identity : handleOnClick(complete)}\n        submitValue={complete.label}\n        style={{\n          backgroundColor:\n            complete.disabled || loading ? convert(`color(${primary} a(-50%))`) : primary,\n          cursor: loading ? 'progress' : 'pointer'\n        }}\n        className={classnames(\n          style.completeCta,\n          complete.disabled || loading ? style.disabled : null,\n          loading ? style.loading : null\n        )}\n        data-testid=\"complete-button\"\n      />\n    ) : null;\n  }, [complete, loading, primary, handleOnClick]);\n\n  const warningButton = useMemo(() => {\n    return !isNil(warning) ? (\n      <div className={style.leftSection}>\n        <div onClick={handleOnClick(warning)} className={classnames(style.iconLabel, style.link)}>\n          <QuestionIcon className={style.iconQuestion} width={24} height={24} />\n          <span>{warning.label}</span>\n        </div>\n      </div>\n    ) : null;\n  }, [handleOnClick, warning]);\n\n  const quitButton = useMemo(() => {\n    return !isNil(quit) ? (\n      <div className={style.leftSection}>\n        <span\n          className={classnames(style.quitCta, loading ? style.loading : null)}\n          onClick={loading ? identity : handleOnClick(quit)}\n        >\n          {quit.label}\n        </span>\n      </div>\n    ) : null;\n  }, [quit, loading, handleOnClick]);\n\n  const titleSection = useMemo(() => {\n    return !isNil(name) ? (\n      <div className={classnames(style.iconLabel, style.title)}>\n        <div className={style.oval} style={{backgroundColor: IconColor}}>\n          <IconType className={style.iconHeader} />\n        </div>\n        <span\n          className={style.innerHTML}\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{__html: name}}\n        />\n      </div>\n    ) : null;\n  }, [name, IconColor]);\n\n  const header = useMemo(() => {\n    return !isNil(quit) || !isEmpty(name) ? (\n      <div className={style.header}>\n        {quitButton}\n        {titleSection}\n        {isNil(quit) ? null : <div className={style.rightSection} />}\n      </div>\n    ) : null;\n  }, [name, titleSection, quit, quitButton]);\n\n  const footer = useMemo(() => {\n    return !isNil(warning) || !isNil(complete) ? (\n      <div className={style.footer}>\n        {warningButton}\n        {completeButton}\n        {isNil(warning) ? null : <div className={style.rightSection} />}\n      </div>\n    ) : null;\n  }, [warning, warningButton, complete, completeButton]);\n\n  const popin = useMemo(() => {\n    return !isNil(closePopin) ? <CmPopin {...closePopin} /> : null;\n  }, [closePopin]);\n\n  return (\n    <div className={defaultWrapperStyle[mode]}>\n      {header}\n      {popin}\n      {mainContentSlot}\n      {footer}\n    </div>\n  );\n};\n\nExternalCourse.propTypes = {\n  name: PropTypes.string,\n  type: PropTypes.oneOf(keys(EXTERNAL_CONTENT_ICONS)),\n  url: PropTypes.string.isRequired,\n  quit: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    onClick: PropTypes.func\n  }),\n  complete: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    disabled: PropTypes.bool,\n    onClick: PropTypes.func\n  }),\n  warning: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    onClick: PropTypes.func\n  }),\n  loading: PropTypes.bool,\n  backgroundImageUrl: PropTypes.string,\n  contentType: PropTypes.string,\n  mode: PropTypes.string,\n  closePopin: PropTypes.shape({...CmPopin.propTypes})\n};\n\nExternalCourse.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nexport default ExternalCourse;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["defaultWrapperStyle","default","style","cockpit","defaultCockpit","mobile","ExternalCourse","props","context","name","type","url","quit","complete","warning","loading","backgroundImageUrl","contentType","mode","onTop","closePopin","skin","primary","IconType","EXTERNAL_CONTENT_ICONS","icon","IconColor","color","mainContentSlot","useMemo","loader","handleOnClick","useCallback","field","onClick","e","stopPropagation","preventDefault","completeButton","disabled","label","backgroundColor","convert","cursor","classnames","completeCta","warningButton","leftSection","iconLabel","link","iconQuestion","quitButton","quitCta","titleSection","title","oval","iconHeader","innerHTML","__html","header","rightSection","footer","popin","onTopHeader","onTopFooter","propTypes","PropTypes","string","oneOf","shape","bool","isRequired","func","CmPopin","contextTypes","Provider","childContextTypes"],"sources":["../../../src/template/external-course/index.js"],"sourcesContent":["import React, {useCallback, useMemo} from 'react';\nimport {NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon} from '@coorpacademy/nova-icons';\nimport {convert} from 'css-color-function';\nimport classnames from 'classnames';\nimport {noop, getOr, keys, identity, isNil, isEmpty} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport {EXTERNAL_CONTENT_ICONS} from '../../util/external-content';\nimport Provider from '../../atom/provider';\nimport Loader from '../../atom/loader';\nimport Button from '../../atom/button';\nimport ExternalContentViewer from '../../molecule/external-content-viewer';\nimport CmPopin from '../../molecule/cm-popin';\nimport style from './style.css';\n\nconst defaultWrapperStyle = {\n  default: style.default,\n  cockpit: style.defaultCockpit,\n  mobile: style.default\n};\n\nconst ExternalCourse = (props, context) => {\n  const {\n    name,\n    type,\n    url,\n    quit,\n    complete,\n    warning,\n    loading,\n    backgroundImageUrl,\n    contentType,\n    mode = 'default',\n    onTop = {},\n    closePopin\n  } = props;\n  const {skin} = context;\n  const primary = getOr('#00B0FF', 'common.primary', skin);\n  const IconType = EXTERNAL_CONTENT_ICONS[type].icon;\n  const IconColor = EXTERNAL_CONTENT_ICONS[type].color;\n\n  const mainContentSlot = useMemo(() => {\n    return loading ? (\n      <div className={style.loader}>\n        <Loader />\n      </div>\n    ) : (\n      <ExternalContentViewer\n        url={url}\n        mode={mode}\n        backgroundImageUrl={backgroundImageUrl}\n        contentType={contentType}\n      />\n    );\n  }, [loading, url, mode, contentType, backgroundImageUrl]);\n\n  const handleOnClick = useCallback(field => {\n    const onClick = getOr(noop, ['onClick'], field);\n    return e => {\n      e.stopPropagation();\n      e.preventDefault();\n      return onClick(e);\n    };\n  }, []);\n\n  const completeButton = useMemo(() => {\n    return !isNil(complete) ? (\n      <Button\n        type=\"button\"\n        disabled={loading ? true : complete.disabled}\n        onClick={loading ? identity : handleOnClick(complete)}\n        submitValue={complete.label}\n        style={{\n          backgroundColor:\n            complete.disabled || loading ? convert(`color(${primary} a(-50%))`) : primary,\n          cursor: loading ? 'progress' : 'pointer'\n        }}\n        className={classnames(\n          style.completeCta,\n          complete.disabled || loading ? style.disabled : null,\n          loading ? style.loading : null\n        )}\n        data-testid=\"complete-button\"\n      />\n    ) : null;\n  }, [complete, loading, primary, handleOnClick]);\n\n  const warningButton = useMemo(() => {\n    return !isNil(warning) ? (\n      <div className={style.leftSection}>\n        <div onClick={handleOnClick(warning)} className={classnames(style.iconLabel, style.link)}>\n          <QuestionIcon className={style.iconQuestion} width={24} height={24} />\n          <span>{warning.label}</span>\n        </div>\n      </div>\n    ) : null;\n  }, [handleOnClick, warning]);\n\n  const quitButton = useMemo(() => {\n    return !isNil(quit) ? (\n      <div className={style.leftSection}>\n        <span\n          className={classnames(style.quitCta, loading ? style.loading : null)}\n          onClick={loading ? identity : handleOnClick(quit)}\n        >\n          {quit.label}\n        </span>\n      </div>\n    ) : null;\n  }, [quit, loading, handleOnClick]);\n\n  const titleSection = useMemo(() => {\n    return !isNil(name) ? (\n      <div className={classnames(style.iconLabel, style.title)}>\n        <div className={style.oval} style={{backgroundColor: IconColor}}>\n          <IconType className={style.iconHeader} />\n        </div>\n        <span\n          className={style.innerHTML}\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{__html: name}}\n        />\n      </div>\n    ) : null;\n  }, [name, IconColor]);\n\n  const header = useMemo(() => {\n    return !isNil(quit) || !isEmpty(name) ? (\n      <div className={style.header}>\n        {quitButton}\n        {titleSection}\n        {isNil(quit) ? null : <div className={style.rightSection} />}\n      </div>\n    ) : null;\n  }, [name, titleSection, quit, quitButton]);\n\n  const footer = useMemo(() => {\n    return !isNil(warning) || !isNil(complete) ? (\n      <div className={style.footer}>\n        {warningButton}\n        {completeButton}\n        {isNil(warning) ? null : <div className={style.rightSection} />}\n      </div>\n    ) : null;\n  }, [warning, warningButton, complete, completeButton]);\n\n  const popin = useMemo(() => {\n    return !isNil(closePopin) ? <CmPopin {...closePopin} /> : null;\n  }, [closePopin]);\n\n  return (\n    <div\n      className={classnames(\n        defaultWrapperStyle[mode],\n        onTop.header && style.onTopHeader,\n        onTop.footer && style.onTopFooter\n      )}\n    >\n      {header}\n      {popin}\n      {mainContentSlot}\n      {footer}\n    </div>\n  );\n};\n\nExternalCourse.propTypes = {\n  name: PropTypes.string,\n  type: PropTypes.oneOf(keys(EXTERNAL_CONTENT_ICONS)),\n  onTop: PropTypes.shape({\n    header: PropTypes.bool,\n    footer: PropTypes.bool\n  }),\n  url: PropTypes.string.isRequired,\n  quit: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    onClick: PropTypes.func\n  }),\n  complete: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    disabled: PropTypes.bool,\n    onClick: PropTypes.func\n  }),\n  warning: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    onClick: PropTypes.func\n  }),\n  loading: PropTypes.bool,\n  backgroundImageUrl: PropTypes.string,\n  contentType: PropTypes.string,\n  mode: PropTypes.string,\n  closePopin: PropTypes.shape({...CmPopin.propTypes})\n};\n\nExternalCourse.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nexport default ExternalCourse;\n"],"mappings":"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"}

package/lib/template/external-course/style.css

@@ -21,6 +21,7 @@
   display: flex;
   flex-direction: column;
   align-content: stretch;
+  position: relative;
 }
 
 .defaultCockpit{
@@ -43,7 +44,16 @@
   z-index: 1;
   overflow: hidden;
 }
-
+.onTopHeader .header{
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+.onTopFooter .footer{
+  position: absolute;
+  bottom: 0;
+  left: 0;
+}
 .leftSection, .rightSection {
   align-self: center;
   flex: 1;

package/lib/template/playlist-detail/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/playlist-detail/index.js"],"names":[],"mappings":";AAgBA,uEAyEC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/playlist-detail/index.js"],"names":[],"mappings":";AAiBA,uEA8EC"}

package/lib/template/playlist-detail/index.js

@@ -15,6 +15,8 @@ var _tag = _interopRequireDefault(require("../../atom/tag"));
 
 var _select = _interopRequireWildcard(require("../../atom/select"));
 
+var _buttonLinkIcon = _interopRequireDefault(require("../../atom/button-link-icon"));
+
 var _icon = _interopRequireDefault(require("../../atom/icon"));
 
 var _cardsGrid = _interopRequireDefault(require("../../organism/cards-grid"));
@@ -66,16 +68,14 @@ const PlaylistDetail = (props, context) => {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.container,
     "data-name": playlistRef
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.backButtonWrapper,
-    onClick: onBackClick
-  }, /*#__PURE__*/_react.default.createElement(_icon.default, {
-    iconName: "arrow-left",
-    size: {
-      faSize: 14,
-      wrapperSize: 14
-    }
-  })), /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement(_buttonLinkIcon.default, {
+    faIcon: "arrow-left",
+    "data-name": "back-button",
+    "aria-label": "Back",
+    onClick: onBackClick,
+    className: _style.default.backButton,
+    tooltipPlacement: "right"
+  }), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.ctaContainer
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.coverWrapper

package/lib/template/playlist-detail/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["DESCRIPTION_BREAKPOINT","PlaylistDetail","props","context","title","coverImages","playlistRef","description","ongoingCourses","playlistCourses","totalCourses","filters","sorting","onBackClick","onContinueLearningClick","translate","showMore","setShowMore","useState","handleShowMore","useCallback","Description","classnames","style","truncate","backgroundContainer","container","backButtonWrapper","faSize","wrapperSize","ctaContainer","coverWrapper","length","showMoreWrapper","continueLearningButton","list","contextTypes","skin","Provider","childContextTypes","propTypes","PropTypes","string","isRequired","PlaylistDetailCover","images","shape","CardsGrid","number","onChange","func","options","arrayOf","SelectOptionPropTypes","Select"],"sources":["../../../src/template/playlist-detail/index.js"],"sourcesContent":["import React, {useCallback, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport Provider from '../../atom/provider';\nimport Tag from '../../atom/tag';\nimport Select, {SelectOptionPropTypes} from '../../atom/select';\nimport Icon from '../../atom/icon';\nimport CardsGrid from '../../organism/cards-grid';\nimport AllCourses from '../skill-detail/all-courses';\nimport ContinueLearning from '../skill-detail/continue-learning';\nimport PlaylistDetailCover from '../../molecule/playlist-detail-cover';\nimport {ContinueLearningButton} from '../skill-detail';\nimport style from './style.css';\n\nconst DESCRIPTION_BREAKPOINT = 382;\n\nconst PlaylistDetail = (props, context) => {\n  const {\n    title,\n    coverImages,\n    playlistRef,\n    description,\n    ongoingCourses,\n    playlistCourses,\n    totalCourses,\n    filters,\n    sorting,\n    onBackClick,\n    onContinueLearningClick\n  } = props;\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  }, [showMore, description]);\n\n  return (\n    <div className={style.backgroundContainer}>\n      <div className={style.container} data-name={playlistRef}>\n        <div className={style.backButtonWrapper} onClick={onBackClick}>\n          <Icon iconName=\"arrow-left\" size={{faSize: 14, wrapperSize: 14}} />\n        </div>\n        <div className={style.ctaContainer}>\n          <div className={style.coverWrapper}>\n            <PlaylistDetailCover images={coverImages} />\n          </div>\n          <div>\n            <Tag label={translate('playlist')} />\n            <div className={style.title}>{title}</div>\n            {description ? (\n              <>\n                <Description />\n                {description.length >= DESCRIPTION_BREAKPOINT ? (\n                  <div className={style.showMoreWrapper} onClick={handleShowMore}>\n                    {translate(showMore ? 'Show less' : 'Show more')}\n                    <Icon\n                      iconName={showMore ? 'chevron-up' : 'chevron-down'}\n                      size={{faSize: 14, wrapperSize: 16}}\n                    />\n                  </div>\n                ) : null}\n              </>\n            ) : null}\n            <div className={style.continueLearningButton}>\n              <ContinueLearningButton\n                ongoingCoursesAvailable={!!ongoingCourses.list.length}\n                onClick={onContinueLearningClick}\n              />\n            </div>\n          </div>\n        </div>\n        <ContinueLearning ongoingCourses={ongoingCourses} />\n        <AllCourses\n          courses={playlistCourses}\n          totalCourses={totalCourses}\n          filters={filters}\n          sorting={sorting}\n        />\n      </div>\n    </div>\n  );\n};\n\nPlaylistDetail.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nPlaylistDetail.propTypes = {\n  title: PropTypes.string.isRequired,\n  coverImages: PlaylistDetailCover.propTypes.images,\n  playlistRef: PropTypes.string.isRequired,\n  description: PropTypes.string,\n  ongoingCourses: PropTypes.shape(CardsGrid.propTypes),\n  playlistCourses: PropTypes.shape(CardsGrid.propTypes),\n  totalCourses: PropTypes.number,\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  onContinueLearningClick: PropTypes.func\n};\n\nexport default PlaylistDetail;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["DESCRIPTION_BREAKPOINT","PlaylistDetail","props","context","title","coverImages","playlistRef","description","ongoingCourses","playlistCourses","totalCourses","filters","sorting","onBackClick","onContinueLearningClick","translate","showMore","setShowMore","useState","handleShowMore","useCallback","Description","classnames","style","truncate","backgroundContainer","container","backButton","ctaContainer","coverWrapper","length","showMoreWrapper","faSize","wrapperSize","continueLearningButton","list","contextTypes","skin","Provider","childContextTypes","propTypes","PropTypes","string","isRequired","PlaylistDetailCover","images","shape","CardsGrid","number","onChange","func","options","arrayOf","SelectOptionPropTypes","Select"],"sources":["../../../src/template/playlist-detail/index.js"],"sourcesContent":["import React, {useCallback, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport Provider from '../../atom/provider';\nimport Tag from '../../atom/tag';\nimport Select, {SelectOptionPropTypes} from '../../atom/select';\nimport ButtonLinkIcon from '../../atom/button-link-icon';\nimport Icon from '../../atom/icon';\nimport CardsGrid from '../../organism/cards-grid';\nimport AllCourses from '../skill-detail/all-courses';\nimport ContinueLearning from '../skill-detail/continue-learning';\nimport PlaylistDetailCover from '../../molecule/playlist-detail-cover';\nimport {ContinueLearningButton} from '../skill-detail';\nimport style from './style.css';\n\nconst DESCRIPTION_BREAKPOINT = 382;\n\nconst PlaylistDetail = (props, context) => {\n  const {\n    title,\n    coverImages,\n    playlistRef,\n    description,\n    ongoingCourses,\n    playlistCourses,\n    totalCourses,\n    filters,\n    sorting,\n    onBackClick,\n    onContinueLearningClick\n  } = props;\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  }, [showMore, description]);\n\n  return (\n    <div className={style.backgroundContainer}>\n      <div className={style.container} data-name={playlistRef}>\n        <ButtonLinkIcon\n          faIcon=\"arrow-left\"\n          data-name=\"back-button\"\n          aria-label=\"Back\"\n          onClick={onBackClick}\n          className={style.backButton}\n          tooltipPlacement=\"right\"\n        />\n        <div className={style.ctaContainer}>\n          <div className={style.coverWrapper}>\n            <PlaylistDetailCover images={coverImages} />\n          </div>\n          <div>\n            <Tag label={translate('playlist')} />\n            <div className={style.title}>{title}</div>\n            {description ? (\n              <>\n                <Description />\n                {description.length >= DESCRIPTION_BREAKPOINT ? (\n                  <div className={style.showMoreWrapper} onClick={handleShowMore}>\n                    {translate(showMore ? 'Show less' : 'Show more')}\n                    <Icon\n                      iconName={showMore ? 'chevron-up' : 'chevron-down'}\n                      size={{faSize: 14, wrapperSize: 16}}\n                    />\n                  </div>\n                ) : null}\n              </>\n            ) : null}\n            <div className={style.continueLearningButton}>\n              <ContinueLearningButton\n                ongoingCoursesAvailable={!!ongoingCourses.list.length}\n                onClick={onContinueLearningClick}\n              />\n            </div>\n          </div>\n        </div>\n        <ContinueLearning ongoingCourses={ongoingCourses} />\n        <AllCourses\n          courses={playlistCourses}\n          totalCourses={totalCourses}\n          filters={filters}\n          sorting={sorting}\n        />\n      </div>\n    </div>\n  );\n};\n\nPlaylistDetail.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nPlaylistDetail.propTypes = {\n  title: PropTypes.string.isRequired,\n  coverImages: PlaylistDetailCover.propTypes.images,\n  playlistRef: PropTypes.string.isRequired,\n  description: PropTypes.string,\n  ongoingCourses: PropTypes.shape(CardsGrid.propTypes),\n  playlistCourses: PropTypes.shape(CardsGrid.propTypes),\n  totalCourses: PropTypes.number,\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  onContinueLearningClick: PropTypes.func\n};\n\nexport default PlaylistDetail;\n"],"mappings":"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"}

package/lib/template/playlist-detail/style.css

@@ -35,13 +35,8 @@
   max-width: calc(1080px + 40px);
 }
 
-.backButtonWrapper {
+.backButton {
   margin-bottom: 16px;
-  background-color: cm_grey_100;
-  border-radius: 8px;
-  width: fit-content;
-  padding: 8px;
-  cursor: pointer;
 }
 
 .ctaContainer {

package/lib/template/skill-detail/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/index.js"],"names":[],"mappings":"AAcO,8EA+BN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYD,oEA+JC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/index.js"],"names":[],"mappings":"AAeO,8EA+BN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYD,oEA8JC"}

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

@@ -19,6 +19,8 @@ var _select = _interopRequireWildcard(require("../../atom/select"));
 
 var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
 
+var _buttonLinkIcon = _interopRequireDefault(require("../../atom/button-link-icon"));
+
 var _icon = _interopRequireDefault(require("../../atom/icon"));
 
 var _cardsGrid = _interopRequireDefault(require("../../organism/cards-grid"));
@@ -131,16 +133,14 @@ const SkillDetail = (props, context) => {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.container,
     "data-name": skillRef
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.backButtonWrapper,
-    onClick: onBackClick
-  }, /*#__PURE__*/_react.default.createElement(_icon.default, {
-    iconName: "arrow-left",
-    size: {
-      faSize: 14,
-      wrapperSize: 14
-    }
-  })), /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement(_buttonLinkIcon.default, {
+    faIcon: "arrow-left",
+    "data-name": "back-button",
+    "aria-label": "Back",
+    onClick: onBackClick,
+    className: _style.default.backButton,
+    tooltipPlacement: "right"
+  }), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.ctaContainer
   }, /*#__PURE__*/_react.default.createElement("div", null, focused ? /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.skillFocusBadge

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ContinueLearningButton","props","context","ongoingCoursesAvailable","onClick","skin","translate","primarySkinColor","width","borderRadius","backgroundColor","convert","position","faIcon","name","color","size","contextTypes","Provider","childContextTypes","propTypes","PropTypes","bool","func","SkillDetail","title","skillRef","description","metrics","focused","availableForReview","ongoingCourses","skillIncludedCourses","totalCourses","filters","sorting","onBackClick","onReviewClick","onContinueLearningClick","score","content","questionsToReview","contentCompleted","showMore","setShowMore","useState","handleShowMore","useCallback","Description","classnames","style","truncate","ProgressBar","undefined","progressBarColor","inlineProgressValueStyle","progressBarWrapper","progress","backgroundContainer","container","backButtonWrapper","faSize","wrapperSize","ctaContainer","skillFocusBadge","length","showMoreWrapper","ctaWrapper","list","progressInformationsWrapper","progressTitle","skillCoursesAndQuestionsWrapper","skillInformation","skillInformationNumber","progressInformations","progressInformation","progressInformationNumber","toFixed","string","isRequired","shape","number","CardsGrid","onChange","options","arrayOf","SelectOptionPropTypes","Select"],"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\nexport const ContinueLearningButton = (props, context) => {\n  const {ongoingCoursesAvailable, onClick} = props;\n  const {skin, translate} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  return (\n    <div>\n      <ButtonLink\n        label={\n          ongoingCoursesAvailable ? translate('continue_learning') : translate('start_learning')\n        }\n        type=\"primary\"\n        customStyle={{\n          width: 'fit-content',\n          borderRadius: '12px',\n          backgroundColor: primarySkinColor\n        }}\n        hoverBackgroundColor={convert(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`)}\n        hoverColor=\"#FFFFFF\"\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  ongoingCoursesAvailable: PropTypes.bool,\n  onClick: PropTypes.func\n};\n\nconst SkillDetail = (props, context) => {\n  const {\n    title,\n    skillRef,\n    description,\n    metrics = {},\n    focused,\n    availableForReview,\n    ongoingCourses,\n    skillIncludedCourses,\n    totalCourses,\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  }, [showMore, description]);\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} data-name={skillRef}>\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\n              ongoingCoursesAvailable={!!ongoingCourses.list.length}\n              onClick={onContinueLearningClick}\n            />\n          </div>\n        </div>\n        {score !== undefined ? (\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.toFixed(1)}%</span>\n                  </div>\n                </>\n              )}\n            </div>\n          </div>\n        ) : null}\n        <ContinueLearning ongoingCourses={ongoingCourses} />\n        <AllCourses\n          courses={skillIncludedCourses}\n          totalCourses={totalCourses}\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  skillRef: 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  totalCourses: PropTypes.number,\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":"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"}
+{"version":3,"file":"index.js","names":["ContinueLearningButton","props","context","ongoingCoursesAvailable","onClick","skin","translate","primarySkinColor","width","borderRadius","backgroundColor","convert","position","faIcon","name","color","size","contextTypes","Provider","childContextTypes","propTypes","PropTypes","bool","func","SkillDetail","title","skillRef","description","metrics","focused","availableForReview","ongoingCourses","skillIncludedCourses","totalCourses","filters","sorting","onBackClick","onReviewClick","onContinueLearningClick","score","content","questionsToReview","contentCompleted","showMore","setShowMore","useState","handleShowMore","useCallback","Description","classnames","style","truncate","ProgressBar","undefined","progressBarColor","inlineProgressValueStyle","progressBarWrapper","progress","backgroundContainer","container","backButton","ctaContainer","skillFocusBadge","faSize","wrapperSize","length","showMoreWrapper","ctaWrapper","list","progressInformationsWrapper","progressTitle","skillCoursesAndQuestionsWrapper","skillInformation","skillInformationNumber","progressInformations","progressInformation","progressInformationNumber","toFixed","string","isRequired","shape","number","CardsGrid","onChange","options","arrayOf","SelectOptionPropTypes","Select"],"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 ButtonLinkIcon from '../../atom/button-link-icon';\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\nexport const ContinueLearningButton = (props, context) => {\n  const {ongoingCoursesAvailable, onClick} = props;\n  const {skin, translate} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  return (\n    <div>\n      <ButtonLink\n        label={\n          ongoingCoursesAvailable ? translate('continue_learning') : translate('start_learning')\n        }\n        type=\"primary\"\n        customStyle={{\n          width: 'fit-content',\n          borderRadius: '12px',\n          backgroundColor: primarySkinColor\n        }}\n        hoverBackgroundColor={convert(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`)}\n        hoverColor=\"#FFFFFF\"\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  ongoingCoursesAvailable: PropTypes.bool,\n  onClick: PropTypes.func\n};\n\nconst SkillDetail = (props, context) => {\n  const {\n    title,\n    skillRef,\n    description,\n    metrics = {},\n    focused,\n    availableForReview,\n    ongoingCourses,\n    skillIncludedCourses,\n    totalCourses,\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  }, [showMore, description]);\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} data-name={skillRef}>\n        <ButtonLinkIcon\n          faIcon=\"arrow-left\"\n          data-name=\"back-button\"\n          aria-label=\"Back\"\n          onClick={onBackClick}\n          className={style.backButton}\n          tooltipPlacement=\"right\"\n        />\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\n              ongoingCoursesAvailable={!!ongoingCourses.list.length}\n              onClick={onContinueLearningClick}\n            />\n          </div>\n        </div>\n        {score !== undefined ? (\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.toFixed(1)}%</span>\n                  </div>\n                </>\n              )}\n            </div>\n          </div>\n        ) : null}\n        <ContinueLearning ongoingCourses={ongoingCourses} />\n        <AllCourses\n          courses={skillIncludedCourses}\n          totalCourses={totalCourses}\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  skillRef: 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  totalCourses: PropTypes.number,\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":"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"}

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

@@ -35,13 +35,8 @@
   max-width: calc(1080px + 40px);
 }
 
-.backButtonWrapper {
+.backButton {
   margin-bottom: 16px;
-  background-color: cm_grey_100;
-  border-radius: 8px;
-  width: fit-content;
-  padding: 8px;
-  cursor: pointer;
 }
 
 .ctaContainer {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "11.32.26",
+  "version": "11.32.28",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -177,5 +177,5 @@
     "last 2 versions",
     "IE 11"
   ],
-  "gitHead": "ade3446298caead59145363da83dec12e6883a3d"
+  "gitHead": "db50ee93e1f427ef1a18aa174826835ee0a64b1d"
 }

package/es/atom/button-link-icon-only/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link-icon-only/index.js"],"names":[],"mappings":";AAkCA,6DAiDC"}