@coorpacademy/components 11.32.21 → 11.32.23-alpha.2

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","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 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  }\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  ]),\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 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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"}

package/lib/template/common/dashboard/index.d.ts

@@ -21,6 +21,9 @@ declare namespace Dashboard {
                         label: PropTypes.Requireable<string>;
                         type: PropTypes.Requireable<string>;
                         size: PropTypes.Requireable<string>;
+                        customStyle: PropTypes.Requireable<{
+                            [x: string]: string | null | undefined;
+                        }>;
                     }>>;
                 }>>;
                 headerIcon: PropTypes.Requireable<string>;
@@ -132,6 +135,8 @@ declare namespace Dashboard {
                     content: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                         items: PropTypes.Requireable<(PropTypes.InferProps<{
                             title: PropTypes.Validator<string>;
+                            subtitle: PropTypes.Requireable<string>;
+                            selected: PropTypes.Requireable<boolean>;
                             dataColumns: PropTypes.Requireable<(PropTypes.InferProps<{
                                 label: PropTypes.Requireable<string>;
                                 type: PropTypes.Requireable<string>;
@@ -174,6 +179,8 @@ declare namespace Dashboard {
                                 label: PropTypes.Requireable<string>;
                                 type: PropTypes.Requireable<string>;
                             }> | null | undefined)[]>;
+                            disabled: PropTypes.Requireable<boolean>;
+                            onClick: PropTypes.Requireable<(...args: any[]) => any>;
                             isBulkStyle: PropTypes.Requireable<boolean>;
                             isOverflowHidden: PropTypes.Requireable<boolean>;
                             order: PropTypes.Requireable<number>;
@@ -307,6 +314,9 @@ declare namespace Dashboard {
                         label: PropTypes.Requireable<string>;
                         type: PropTypes.Requireable<string>;
                         size: PropTypes.Requireable<string>;
+                        customStyle: PropTypes.Requireable<{
+                            [x: string]: string | null | undefined;
+                        }>;
                     }>>;
                 }>>;
                 headerIcon: PropTypes.Requireable<string>;
@@ -418,6 +428,8 @@ declare namespace Dashboard {
                     content: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                         items: PropTypes.Requireable<(PropTypes.InferProps<{
                             title: PropTypes.Validator<string>;
+                            subtitle: PropTypes.Requireable<string>;
+                            selected: PropTypes.Requireable<boolean>;
                             dataColumns: PropTypes.Requireable<(PropTypes.InferProps<{
                                 label: PropTypes.Requireable<string>;
                                 type: PropTypes.Requireable<string>;
@@ -460,6 +472,8 @@ declare namespace Dashboard {
                                 label: PropTypes.Requireable<string>;
                                 type: PropTypes.Requireable<string>;
                             }> | null | undefined)[]>;
+                            disabled: PropTypes.Requireable<boolean>;
+                            onClick: PropTypes.Requireable<(...args: any[]) => any>;
                             isBulkStyle: PropTypes.Requireable<boolean>;
                             isOverflowHidden: PropTypes.Requireable<boolean>;
                             order: PropTypes.Requireable<number>;

package/lib/template/common/search-page/index.d.ts

@@ -205,6 +205,9 @@ declare namespace SearchPage {
                         label: PropTypes.Requireable<string>;
                         type: PropTypes.Requireable<string>;
                         size: PropTypes.Requireable<string>;
+                        customStyle: PropTypes.Requireable<{
+                            [x: string]: string | null | undefined;
+                        }>;
                     }>>;
                 }>>;
                 headerIcon: PropTypes.Requireable<string>;
@@ -316,6 +319,8 @@ declare namespace SearchPage {
                     content: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                         items: PropTypes.Requireable<(PropTypes.InferProps<{
                             title: PropTypes.Validator<string>;
+                            subtitle: PropTypes.Requireable<string>;
+                            selected: PropTypes.Requireable<boolean>;
                             dataColumns: PropTypes.Requireable<(PropTypes.InferProps<{
                                 label: PropTypes.Requireable<string>;
                                 type: PropTypes.Requireable<string>;
@@ -358,6 +363,8 @@ declare namespace SearchPage {
                                 label: PropTypes.Requireable<string>;
                                 type: PropTypes.Requireable<string>;
                             }> | null | undefined)[]>;
+                            disabled: PropTypes.Requireable<boolean>;
+                            onClick: PropTypes.Requireable<(...args: any[]) => any>;
                             isBulkStyle: PropTypes.Requireable<boolean>;
                             isOverflowHidden: PropTypes.Requireable<boolean>;
                             order: PropTypes.Requireable<number>;

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

@@ -38,6 +38,9 @@ declare namespace ExternalCourse {
                         label: PropTypes.Requireable<string>;
                         type: PropTypes.Requireable<string>;
                         size: PropTypes.Requireable<string>;
+                        customStyle: PropTypes.Requireable<{
+                            [x: string]: string | null | undefined;
+                        }>;
                     }>>;
                 }>>;
                 headerIcon: PropTypes.Requireable<string>;
@@ -149,6 +152,8 @@ declare namespace ExternalCourse {
                     content: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                         items: PropTypes.Requireable<(PropTypes.InferProps<{
                             title: PropTypes.Validator<string>;
+                            subtitle: PropTypes.Requireable<string>;
+                            selected: PropTypes.Requireable<boolean>;
                             dataColumns: PropTypes.Requireable<(PropTypes.InferProps<{
                                 label: PropTypes.Requireable<string>;
                                 type: PropTypes.Requireable<string>;
@@ -191,6 +196,8 @@ declare namespace ExternalCourse {
                                 label: PropTypes.Requireable<string>;
                                 type: PropTypes.Requireable<string>;
                             }> | null | undefined)[]>;
+                            disabled: PropTypes.Requireable<boolean>;
+                            onClick: PropTypes.Requireable<(...args: any[]) => any>;
                             isBulkStyle: PropTypes.Requireable<boolean>;
                             isOverflowHidden: PropTypes.Requireable<boolean>;
                             order: PropTypes.Requireable<number>;

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

@@ -0,0 +1,96 @@
+export default PlaylistDetail;
+declare function PlaylistDetail(props: any, context: any): JSX.Element;
+declare namespace PlaylistDetail {
+    namespace contextTypes {
+        const skin: PropTypes.Requireable<PropTypes.InferProps<{
+            common: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            images: PropTypes.Requireable<PropTypes.InferProps<{
+                'logo-mobile': PropTypes.Requireable<any>;
+                logo: PropTypes.Requireable<any>;
+                'logo-email': PropTypes.Requireable<any>;
+                login: PropTypes.Requireable<any>;
+            }>>;
+            icons: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            mod: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            courses: PropTypes.Requireable<any[]>;
+            texts: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+        }>>;
+        const translate: PropTypes.Requireable<(...args: any[]) => any>;
+    }
+    namespace propTypes {
+        const title: PropTypes.Validator<string>;
+        const coverImages: PropTypes.Requireable<(PropTypes.InferProps<{
+            type: PropTypes.Requireable<string>;
+            url: PropTypes.Requireable<string>;
+        }> | null | undefined)[]>;
+        const playlistRef: PropTypes.Validator<string>;
+        const description: PropTypes.Requireable<string>;
+        const ongoingCourses: PropTypes.Requireable<PropTypes.InferProps<{
+            list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
+            customStyle: PropTypes.Requireable<{
+                [x: string]: string | null | undefined;
+            }>;
+            loading: PropTypes.Requireable<boolean>;
+        }>>;
+        const playlistCourses: PropTypes.Requireable<PropTypes.InferProps<{
+            list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
+            customStyle: PropTypes.Requireable<{
+                [x: string]: string | null | undefined;
+            }>;
+            loading: PropTypes.Requireable<boolean>;
+        }>>;
+        const totalCourses: PropTypes.Requireable<number>;
+        const filters: PropTypes.Requireable<PropTypes.InferProps<{
+            onChange: PropTypes.Requireable<(...args: any[]) => any>;
+            options: PropTypes.Requireable<(PropTypes.InferProps<{
+                name: PropTypes.Validator<string>;
+                value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+                selected: PropTypes.Requireable<boolean>;
+                validOption: PropTypes.Requireable<boolean>;
+            }> | null | undefined)[]>;
+        }>>;
+        const sorting: PropTypes.Requireable<PropTypes.InferProps<{
+            title: PropTypes.Requireable<string>;
+            name: PropTypes.Requireable<string>;
+            className: PropTypes.Requireable<string>;
+            borderClassName: PropTypes.Requireable<string>;
+            disabled: PropTypes.Requireable<boolean>;
+            multiple: PropTypes.Requireable<boolean>;
+            description: PropTypes.Requireable<string>;
+            required: PropTypes.Requireable<boolean>;
+            onChange: PropTypes.Requireable<(...args: any[]) => any>;
+            theme: PropTypes.Requireable<string>;
+            options: PropTypes.Requireable<(PropTypes.InferProps<{
+                name: PropTypes.Validator<string>;
+                value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+                selected: PropTypes.Requireable<boolean>;
+                validOption: PropTypes.Requireable<boolean>;
+            }> | null | undefined)[]>;
+            optgroups: PropTypes.Requireable<(PropTypes.InferProps<{
+                label: PropTypes.Validator<string>;
+                options: PropTypes.Requireable<(PropTypes.InferProps<{
+                    name: PropTypes.Validator<string>;
+                    value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+                    selected: PropTypes.Requireable<boolean>;
+                    validOption: PropTypes.Requireable<boolean>;
+                }> | null | undefined)[]>;
+            }> | null | undefined)[]>;
+            modified: PropTypes.Requireable<boolean>;
+            error: PropTypes.Requireable<boolean>;
+            'aria-label': PropTypes.Requireable<string>;
+            'aria-labelledby': PropTypes.Requireable<string>;
+        }>>;
+        const onBackClick: PropTypes.Requireable<(...args: any[]) => any>;
+        const onContinueLearningClick: PropTypes.Requireable<(...args: any[]) => any>;
+    }
+}
+import PropTypes from "prop-types";
+//# sourceMappingURL=index.d.ts.map

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

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

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

@@ -0,0 +1,137 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _provider = _interopRequireDefault(require("../../atom/provider"));
+
+var _tag = _interopRequireDefault(require("../../atom/tag"));
+
+var _select = _interopRequireWildcard(require("../../atom/select"));
+
+var _icon = _interopRequireDefault(require("../../atom/icon"));
+
+var _cardsGrid = _interopRequireDefault(require("../../organism/cards-grid"));
+
+var _allCourses = _interopRequireDefault(require("../skill-detail/all-courses"));
+
+var _continueLearning = _interopRequireDefault(require("../skill-detail/continue-learning"));
+
+var _playlistDetailCover = _interopRequireDefault(require("../../molecule/playlist-detail-cover"));
+
+var _skillDetail = require("../skill-detail");
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const DESCRIPTION_BREAKPOINT = 382;
+
+const PlaylistDetail = (props, context) => {
+  const {
+    title,
+    coverImages,
+    playlistRef,
+    description,
+    ongoingCourses,
+    playlistCourses,
+    totalCourses,
+    filters,
+    sorting,
+    onBackClick,
+    onContinueLearningClick
+  } = props;
+  const {
+    translate
+  } = context;
+  const [showMore, setShowMore] = (0, _react.useState)(false);
+  const handleShowMore = (0, _react.useCallback)(() => setShowMore(!showMore), [setShowMore, showMore]);
+  const Description = (0, _react.useCallback)(() => {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _classnames.default)(_style.default.description, !showMore && _style.default.truncate)
+    }, description);
+  }, [showMore, description]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.backgroundContainer
+  }, /*#__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", {
+    className: _style.default.ctaContainer
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.coverWrapper
+  }, /*#__PURE__*/_react.default.createElement(_playlistDetailCover.default, {
+    images: coverImages
+  })), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_tag.default, {
+    label: translate('playlist')
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.title
+  }, title), description ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(Description, null), description.length >= DESCRIPTION_BREAKPOINT ? /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.showMoreWrapper,
+    onClick: handleShowMore
+  }, translate(showMore ? 'Show less' : 'Show more'), /*#__PURE__*/_react.default.createElement(_icon.default, {
+    iconName: showMore ? 'chevron-up' : 'chevron-down',
+    size: {
+      faSize: 14,
+      wrapperSize: 16
+    }
+  })) : null) : null, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.continueLearningButton
+  }, /*#__PURE__*/_react.default.createElement(_skillDetail.ContinueLearningButton, {
+    ongoingCoursesAvailable: !!ongoingCourses.list.length,
+    onClick: onContinueLearningClick
+  })))), /*#__PURE__*/_react.default.createElement(_continueLearning.default, {
+    ongoingCourses: ongoingCourses
+  }), /*#__PURE__*/_react.default.createElement(_allCourses.default, {
+    courses: playlistCourses,
+    totalCourses: totalCourses,
+    filters: filters,
+    sorting: sorting
+  })));
+};
+
+PlaylistDetail.contextTypes = {
+  skin: _provider.default.childContextTypes.skin,
+  translate: _provider.default.childContextTypes.translate
+};
+PlaylistDetail.propTypes = process.env.NODE_ENV !== "production" ? {
+  title: _propTypes.default.string.isRequired,
+  coverImages: _propTypes.default.arrayOf(_propTypes.default.shape({
+    type: _propTypes.default.oneOf(['podcast', 'video', 'interactive', 'document']),
+    url: _propTypes.default.string
+  })),
+  playlistRef: _propTypes.default.string.isRequired,
+  description: _propTypes.default.string,
+  ongoingCourses: _propTypes.default.shape(_cardsGrid.default.propTypes),
+  playlistCourses: _propTypes.default.shape(_cardsGrid.default.propTypes),
+  totalCourses: _propTypes.default.number,
+  filters: _propTypes.default.shape({
+    onChange: _propTypes.default.func,
+    options: _propTypes.default.arrayOf(_propTypes.default.shape(_select.SelectOptionPropTypes))
+  }),
+  sorting: _propTypes.default.shape(_select.default.propTypes),
+  onBackClick: _propTypes.default.func,
+  onContinueLearningClick: _propTypes.default.func
+} : {};
+var _default = PlaylistDetail;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +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","arrayOf","shape","type","oneOf","url","CardsGrid","number","onChange","func","options","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: PropTypes.arrayOf(\n    PropTypes.shape({\n      type: PropTypes.oneOf(['podcast', 'video', 'interactive', 'document']),\n      url: PropTypes.string\n    })\n  ),\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

@@ -0,0 +1,109 @@
+@value colors: "../../variables/colors.css";
+@value breakpoints: "../../variables/breakpoints.css";
+@value tablet from breakpoints;
+@value mobile from breakpoints;
+@value xtraLightGrey from colors;
+@value cm_grey_100 from colors;
+@value cm_grey_200 from colors;
+@value cm_grey_400 from colors;
+
+.textBase {
+  font-family: "Gilroy";
+  font-style: normal;
+}
+
+.backgroundContainer {
+  background-color: white;
+  min-height: 100%;
+  width: 100%;
+}
+
+.container {
+  composes: textBase;
+  background-color: white;
+  font-family: "Gilroy";
+  font-style: normal;
+  margin-top: 48px;
+  margin-bottom: 48px;
+  margin-left: auto;
+  margin-right: auto;
+  padding: 0 16px;
+  position: relative;
+  box-sizing: border-box;
+  min-height: 100%;
+  width: 100%;
+  max-width: calc(1080px + 40px);
+}
+
+.backButtonWrapper {
+  margin-bottom: 16px;
+  background-color: cm_grey_100;
+  border-radius: 8px;
+  width: fit-content;
+  padding: 8px;
+  cursor: pointer;
+}
+
+.ctaContainer {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  gap: 40px;
+}
+
+.coverWrapper {
+  width: 420px;
+  height: 280px;
+}
+
+.showMoreWrapper {
+  display: flex;
+  gap: 8px;
+}
+
+.showMoreWrapper {
+  align-items: center;
+  margin-top: 8px;
+  font-weight: 600;
+  cursor: pointer;
+}
+
+.title {
+  margin-top: 8px;
+  font-size: 24px;
+  font-weight: 700;
+  line-height: 32px;
+}
+
+.description {
+  margin-top: 8px;
+  max-width: 620px;
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 20px;
+  color: cm_grey_400;
+}
+
+.truncate {
+  display: -webkit-box;
+  -webkit-line-clamp: 4;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.continueLearningButton {
+  margin-top: 24px;
+}
+
+@media tablet {
+  .ctaContainer {
+    flex-direction: column;
+  }
+}
+
+@media mobile {
+  .coverWrapper {
+    width: 100%;
+  }
+}

package/lib/template/skill-detail/all-courses.d.ts

@@ -26,7 +26,7 @@ declare namespace AllCourses {
         const translate: PropTypes.Requireable<(...args: any[]) => any>;
     }
     namespace propTypes {
-        const skillIncludedCourses: PropTypes.Requireable<PropTypes.InferProps<{
+        const courses: PropTypes.Requireable<PropTypes.InferProps<{
             list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
             customStyle: PropTypes.Requireable<{
                 [x: string]: string | null | undefined;

package/lib/template/skill-detail/all-courses.js

@@ -73,7 +73,7 @@ FilterButton.propTypes = process.env.NODE_ENV !== "production" ? {
 
 const AllCourses = (props, context) => {
   const {
-    skillIncludedCourses,
+    courses,
     totalCourses,
     filters,
     sorting
@@ -85,7 +85,7 @@ const AllCourses = (props, context) => {
   const {
     list,
     loading
-  } = skillIncludedCourses;
+  } = courses;
   const {
     translate
   } = context;
@@ -197,7 +197,7 @@ AllCourses.contextTypes = {
   translate: _provider.default.childContextTypes.translate
 };
 AllCourses.propTypes = process.env.NODE_ENV !== "production" ? {
-  skillIncludedCourses: _propTypes.default.shape(_cardsGrid.default.propTypes),
+  courses: _propTypes.default.shape(_cardsGrid.default.propTypes),
   totalCourses: _propTypes.default.number,
   filters: _propTypes.default.shape({
     onChange: _propTypes.default.func,