@coorpacademy/components 11.32.35 → 11.32.36-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/es/template/playlist-detail/index.d.ts +1 -7
  2. package/es/template/playlist-detail/index.d.ts.map +1 -1
  3. package/es/template/playlist-detail/index.js +4 -9
  4. package/es/template/playlist-detail/index.js.map +1 -1
  5. package/es/template/skill-detail/index.d.ts +15 -20
  6. package/es/template/skill-detail/index.d.ts.map +1 -1
  7. package/es/template/skill-detail/index.js +5 -8
  8. package/es/template/skill-detail/index.js.map +1 -1
  9. package/lib/template/playlist-detail/index.d.ts +1 -7
  10. package/lib/template/playlist-detail/index.d.ts.map +1 -1
  11. package/lib/template/playlist-detail/index.js +4 -10
  12. package/lib/template/playlist-detail/index.js.map +1 -1
  13. package/lib/template/skill-detail/index.d.ts +15 -20
  14. package/lib/template/skill-detail/index.d.ts.map +1 -1
  15. package/lib/template/skill-detail/index.js +5 -9
  16. package/lib/template/skill-detail/index.js.map +1 -1
  17. package/package.json +2 -2
package/es/template/playlist-detail/index.d.ts CHANGED
@@ -33,13 +33,7 @@ declare namespace PlaylistDetail {
33
33
  }> | null | undefined)[]>;
34
34
  const playlistRef: PropTypes.Validator<string>;
35
35
  const description: PropTypes.Requireable<string>;
36
- const ongoingCourses: PropTypes.Requireable<PropTypes.InferProps<{
37
- list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
38
- customStyle: PropTypes.Requireable<{
39
- [x: string]: string | null | undefined;
40
- }>;
41
- loading: PropTypes.Requireable<boolean>;
42
- }>>;
36
+ const ongoingCoursesAvailable: PropTypes.Requireable<boolean>;
43
37
  const playlistCourses: PropTypes.Requireable<PropTypes.InferProps<{
44
38
  list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
45
39
  customStyle: PropTypes.Requireable<{
package/es/template/playlist-detail/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/playlist-detail/index.js"],"names":[],"mappings":";AAiBA,uEAgFC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/playlist-detail/index.js"],"names":[],"mappings":";AAgBA,uEA6EC"}
package/es/template/playlist-detail/index.js CHANGED
@@ -8,7 +8,6 @@ import ButtonLinkIcon from '../../atom/button-link-icon';
8
8
  import Icon from '../../atom/icon';
9
9
  import CardsGrid from '../../organism/cards-grid';
10
10
  import AllCourses from '../skill-detail/all-courses';
11
- import ContinueLearning from '../skill-detail/continue-learning';
12
11
  import PlaylistDetailCover from '../../molecule/playlist-detail-cover';
13
12
  import { ContinueLearningButton } from '../skill-detail';
14
13
  import style from './style.css';
@@ -20,7 +19,7 @@ const PlaylistDetail = (props, context) => {
20
19
  coverImages,
21
20
  playlistRef,
22
21
  description,
23
- ongoingCourses,
22
+ ongoingCoursesAvailable,
24
23
  playlistCourses,
25
24
  totalCourses,
26
25
  filters,
@@ -72,13 +71,9 @@ const PlaylistDetail = (props, context) => {
72
71
  })) : null) : null, /*#__PURE__*/React.createElement("div", {
73
72
  className: style.continueLearningButton
74
73
  }, /*#__PURE__*/React.createElement(ContinueLearningButton, {
75
- ongoingCoursesAvailable: !!ongoingCourses.list.length,
74
+ ongoingCoursesAvailable: ongoingCoursesAvailable,
76
75
  onClick: onContinueLearningClick
77
- })))), /*#__PURE__*/React.createElement("div", {
78
- className: style.continueLearningSection
79
- }, /*#__PURE__*/React.createElement(ContinueLearning, {
80
- ongoingCourses: ongoingCourses
81
- })), /*#__PURE__*/React.createElement(AllCourses, {
76
+ })))), /*#__PURE__*/React.createElement(AllCourses, {
82
77
  courses: playlistCourses,
83
78
  totalCourses: totalCourses,
84
79
  filters: filters,
@@ -95,7 +90,7 @@ PlaylistDetail.propTypes = process.env.NODE_ENV !== "production" ? {
95
90
  coverImages: PlaylistDetailCover.propTypes.images,
96
91
  playlistRef: PropTypes.string.isRequired,
97
92
  description: PropTypes.string,
98
- ongoingCourses: PropTypes.shape(CardsGrid.propTypes),
93
+ ongoingCoursesAvailable: PropTypes.bool,
99
94
  playlistCourses: PropTypes.shape(CardsGrid.propTypes),
100
95
  totalCourses: PropTypes.number,
101
96
  filters: PropTypes.shape({
package/es/template/playlist-detail/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["React","useCallback","useState","PropTypes","classnames","Provider","Tag","Select","SelectOptionPropTypes","ButtonLinkIcon","Icon","CardsGrid","AllCourses","ContinueLearning","PlaylistDetailCover","ContinueLearningButton","style","DESCRIPTION_BREAKPOINT","PlaylistDetail","props","context","title","coverImages","playlistRef","description","ongoingCourses","playlistCourses","totalCourses","filters","sorting","onBackClick","onContinueLearningClick","translate","showMore","setShowMore","handleShowMore","Description","truncate","backgroundContainer","container","backButton","ctaContainer","coverWrapper","length","showMoreWrapper","faSize","wrapperSize","continueLearningButton","list","continueLearningSection","contextTypes","skin","childContextTypes","propTypes","string","isRequired","images","shape","number","onChange","func","options","arrayOf"],"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 <div className={style.continueLearningSection}>\n <ContinueLearning ongoingCourses={ongoingCourses} />\n </div>\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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"}
1
+ {"version":3,"file":"index.js","names":["React","useCallback","useState","PropTypes","classnames","Provider","Tag","Select","SelectOptionPropTypes","ButtonLinkIcon","Icon","CardsGrid","AllCourses","PlaylistDetailCover","ContinueLearningButton","style","DESCRIPTION_BREAKPOINT","PlaylistDetail","props","context","title","coverImages","playlistRef","description","ongoingCoursesAvailable","playlistCourses","totalCourses","filters","sorting","onBackClick","onContinueLearningClick","translate","showMore","setShowMore","handleShowMore","Description","truncate","backgroundContainer","container","backButton","ctaContainer","coverWrapper","length","showMoreWrapper","faSize","wrapperSize","continueLearningButton","contextTypes","skin","childContextTypes","propTypes","string","isRequired","images","bool","shape","number","onChange","func","options","arrayOf"],"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 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 ongoingCoursesAvailable,\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={ongoingCoursesAvailable}\n onClick={onContinueLearningClick}\n />\n </div>\n </div>\n </div>\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 ongoingCoursesAvailable: PropTypes.bool,\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/es/template/skill-detail/index.d.ts CHANGED
@@ -61,33 +61,28 @@ declare namespace SkillDetail {
61
61
  }
62
62
  export { contextTypes_1 as contextTypes };
63
63
  export namespace propTypes_1 {
64
- const title: PropTypes.Validator<string>;
65
- const skillRef: PropTypes.Validator<string>;
66
- const description: PropTypes.Requireable<string>;
67
- const metrics: PropTypes.Requireable<PropTypes.InferProps<{
64
+ export const title: PropTypes.Validator<string>;
65
+ export const skillRef: PropTypes.Validator<string>;
66
+ export const description: PropTypes.Requireable<string>;
67
+ export const metrics: PropTypes.Requireable<PropTypes.InferProps<{
68
68
  score: PropTypes.Requireable<number>;
69
69
  content: PropTypes.Requireable<number>;
70
70
  questionsToReview: PropTypes.Requireable<number>;
71
71
  contentCompleted: PropTypes.Requireable<number>;
72
72
  }>>;
73
- const focused: PropTypes.Requireable<boolean>;
74
- const availableForReview: PropTypes.Requireable<boolean>;
75
- const ongoingCourses: PropTypes.Requireable<PropTypes.InferProps<{
73
+ export const focused: PropTypes.Requireable<boolean>;
74
+ export const availableForReview: PropTypes.Requireable<boolean>;
75
+ const ongoingCoursesAvailable_1: PropTypes.Requireable<boolean>;
76
+ export { ongoingCoursesAvailable_1 as ongoingCoursesAvailable };
77
+ export const skillIncludedCourses: PropTypes.Requireable<PropTypes.InferProps<{
76
78
  list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
77
79
  customStyle: PropTypes.Requireable<{
78
80
  [x: string]: string | null | undefined;
79
81
  }>;
80
82
  loading: PropTypes.Requireable<boolean>;
81
83
  }>>;
82
- const skillIncludedCourses: PropTypes.Requireable<PropTypes.InferProps<{
83
- list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
84
- customStyle: PropTypes.Requireable<{
85
- [x: string]: string | null | undefined;
86
- }>;
87
- loading: PropTypes.Requireable<boolean>;
88
- }>>;
89
- const totalCourses: PropTypes.Requireable<number>;
90
- const filters: PropTypes.Requireable<PropTypes.InferProps<{
84
+ export const totalCourses: PropTypes.Requireable<number>;
85
+ export const filters: PropTypes.Requireable<PropTypes.InferProps<{
91
86
  onChange: PropTypes.Requireable<(...args: any[]) => any>;
92
87
  options: PropTypes.Requireable<(PropTypes.InferProps<{
93
88
  name: PropTypes.Validator<string>;
@@ -96,7 +91,7 @@ declare namespace SkillDetail {
96
91
  validOption: PropTypes.Requireable<boolean>;
97
92
  }> | null | undefined)[]>;
98
93
  }>>;
99
- const sorting: PropTypes.Requireable<PropTypes.InferProps<{
94
+ export const sorting: PropTypes.Requireable<PropTypes.InferProps<{
100
95
  title: PropTypes.Requireable<string>;
101
96
  name: PropTypes.Requireable<string>;
102
97
  className: PropTypes.Requireable<string>;
@@ -127,9 +122,9 @@ declare namespace SkillDetail {
127
122
  'aria-label': PropTypes.Requireable<string>;
128
123
  'aria-labelledby': PropTypes.Requireable<string>;
129
124
  }>>;
130
- const onBackClick: PropTypes.Requireable<(...args: any[]) => any>;
131
- const onReviewClick: PropTypes.Requireable<(...args: any[]) => any>;
132
- const onContinueLearningClick: PropTypes.Requireable<(...args: any[]) => any>;
125
+ export const onBackClick: PropTypes.Requireable<(...args: any[]) => any>;
126
+ export const onReviewClick: PropTypes.Requireable<(...args: any[]) => any>;
127
+ export const onContinueLearningClick: PropTypes.Requireable<(...args: any[]) => any>;
133
128
  }
134
129
  export { propTypes_1 as propTypes };
135
130
  }
package/es/template/skill-detail/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/index.js"],"names":[],"mappings":"AAeO,8EA+BN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYD,oEA8JC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/index.js"],"names":[],"mappings":"AAcO,8EA+BN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYD,oEA6JC"}
package/es/template/skill-detail/index.js CHANGED
@@ -11,7 +11,6 @@ import Icon from '../../atom/icon';
11
11
  import CardsGrid from '../../organism/cards-grid';
12
12
  import style from './style.css';
13
13
  import AllCourses from './all-courses';
14
- import ContinueLearning from './continue-learning';
15
14
  export const ContinueLearningButton = (props, context) => {
16
15
  const {
17
16
  ongoingCoursesAvailable,
@@ -62,7 +61,7 @@ const SkillDetail = (props, context) => {
62
61
  metrics = {},
63
62
  focused,
64
63
  availableForReview,
65
- ongoingCourses,
64
+ ongoingCoursesAvailable,
66
65
  skillIncludedCourses,
67
66
  totalCourses,
68
67
  filters,
@@ -149,7 +148,7 @@ const SkillDetail = (props, context) => {
149
148
  borderRadius: '12px'
150
149
  }
151
150
  }), /*#__PURE__*/React.createElement(ContinueLearningButton, {
152
- ongoingCoursesAvailable: !!ongoingCourses.list.length,
151
+ ongoingCoursesAvailable: ongoingCoursesAvailable,
153
152
  onClick: onContinueLearningClick
154
153
  }))), score !== undefined ? /*#__PURE__*/React.createElement("div", {
155
154
  className: style.progressInformationsWrapper
@@ -167,7 +166,7 @@ const SkillDetail = (props, context) => {
167
166
  "data-name": "skill-questions"
168
167
  }, /*#__PURE__*/React.createElement("span", {
169
168
  className: style.skillInformationNumber
170
- }, questionsToReview), "\xA0", translate('questions')) : null), /*#__PURE__*/React.createElement(ProgressBar, null), /*#__PURE__*/React.createElement("div", {
169
+ }, questionsToReview), "\xA0", translate('skill_chart_side_panel_questions_to_review')) : null), /*#__PURE__*/React.createElement(ProgressBar, null), /*#__PURE__*/React.createElement("div", {
171
170
  className: style.progressInformations
172
171
  }, content && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
173
172
  className: style.progressInformation,
@@ -179,9 +178,7 @@ const SkillDetail = (props, context) => {
179
178
  "data-name": "completed-percentage"
180
179
  }, /*#__PURE__*/React.createElement("span", {
181
180
  className: style.progressInformationNumber
182
- }, score.toFixed(1), "%"))))) : null, /*#__PURE__*/React.createElement(ContinueLearning, {
183
- ongoingCourses: ongoingCourses
184
- }), /*#__PURE__*/React.createElement(AllCourses, {
181
+ }, score.toFixed(1), "%"))))) : null, /*#__PURE__*/React.createElement(AllCourses, {
185
182
  courses: skillIncludedCourses,
186
183
  totalCourses: totalCourses,
187
184
  filters: filters,
@@ -205,7 +202,7 @@ SkillDetail.propTypes = process.env.NODE_ENV !== "production" ? {
205
202
  }),
206
203
  focused: PropTypes.bool,
207
204
  availableForReview: PropTypes.bool,
208
- ongoingCourses: PropTypes.shape(CardsGrid.propTypes),
205
+ ongoingCoursesAvailable: PropTypes.bool,
209
206
  skillIncludedCourses: PropTypes.shape(CardsGrid.propTypes),
210
207
  totalCourses: PropTypes.number,
211
208
  filters: PropTypes.shape({
package/es/template/skill-detail/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["React","useCallback","useState","PropTypes","convert","classnames","Provider","Select","SelectOptionPropTypes","ButtonLink","ButtonLinkIcon","Icon","CardsGrid","style","AllCourses","ContinueLearning","ContinueLearningButton","props","context","ongoingCoursesAvailable","onClick","skin","translate","primarySkinColor","width","borderRadius","backgroundColor","position","faIcon","name","color","size","contextTypes","childContextTypes","propTypes","bool","func","SkillDetail","title","skillRef","description","metrics","focused","availableForReview","ongoingCourses","skillIncludedCourses","totalCourses","filters","sorting","onBackClick","onReviewClick","onContinueLearningClick","score","content","questionsToReview","contentCompleted","showMore","setShowMore","handleShowMore","Description","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","onChange","options","arrayOf"],"sources":["../../../src/template/skill-detail/index.js"],"sourcesContent":["import React, {useCallback, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport classnames from 'classnames';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Select, {SelectOptionPropTypes} from '../../atom/select';\nimport ButtonLink from '../../atom/button-link';\nimport 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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"}
1
+ {"version":3,"file":"index.js","names":["React","useCallback","useState","PropTypes","convert","classnames","Provider","Select","SelectOptionPropTypes","ButtonLink","ButtonLinkIcon","Icon","CardsGrid","style","AllCourses","ContinueLearningButton","props","context","ongoingCoursesAvailable","onClick","skin","translate","primarySkinColor","width","borderRadius","backgroundColor","position","faIcon","name","color","size","contextTypes","childContextTypes","propTypes","bool","func","SkillDetail","title","skillRef","description","metrics","focused","availableForReview","skillIncludedCourses","totalCourses","filters","sorting","onBackClick","onReviewClick","onContinueLearningClick","score","content","questionsToReview","contentCompleted","showMore","setShowMore","handleShowMore","Description","truncate","ProgressBar","undefined","progressBarColor","inlineProgressValueStyle","progressBarWrapper","progress","backgroundContainer","container","backButton","ctaContainer","skillFocusBadge","faSize","wrapperSize","length","showMoreWrapper","ctaWrapper","progressInformationsWrapper","progressTitle","skillCoursesAndQuestionsWrapper","skillInformation","skillInformationNumber","progressInformations","progressInformation","progressInformationNumber","toFixed","string","isRequired","shape","number","onChange","options","arrayOf"],"sources":["../../../src/template/skill-detail/index.js"],"sourcesContent":["import React, {useCallback, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport classnames from 'classnames';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Select, {SelectOptionPropTypes} from '../../atom/select';\nimport ButtonLink from '../../atom/button-link';\nimport 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';\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 ongoingCoursesAvailable,\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={ongoingCoursesAvailable}\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('skill_chart_side_panel_questions_to_review')}\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 <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 ongoingCoursesAvailable: PropTypes.bool,\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/playlist-detail/index.d.ts CHANGED
@@ -33,13 +33,7 @@ declare namespace PlaylistDetail {
33
33
  }> | null | undefined)[]>;
34
34
  const playlistRef: PropTypes.Validator<string>;
35
35
  const description: PropTypes.Requireable<string>;
36
- const ongoingCourses: PropTypes.Requireable<PropTypes.InferProps<{
37
- list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
38
- customStyle: PropTypes.Requireable<{
39
- [x: string]: string | null | undefined;
40
- }>;
41
- loading: PropTypes.Requireable<boolean>;
42
- }>>;
36
+ const ongoingCoursesAvailable: PropTypes.Requireable<boolean>;
43
37
  const playlistCourses: PropTypes.Requireable<PropTypes.InferProps<{
44
38
  list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
45
39
  customStyle: PropTypes.Requireable<{
package/lib/template/playlist-detail/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/playlist-detail/index.js"],"names":[],"mappings":";AAiBA,uEAgFC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/playlist-detail/index.js"],"names":[],"mappings":";AAgBA,uEA6EC"}
package/lib/template/playlist-detail/index.js CHANGED
@@ -23,8 +23,6 @@ var _cardsGrid = _interopRequireDefault(require("../../organism/cards-grid"));
23
23
 
24
24
  var _allCourses = _interopRequireDefault(require("../skill-detail/all-courses"));
25
25
 
26
- var _continueLearning = _interopRequireDefault(require("../skill-detail/continue-learning"));
27
-
28
26
  var _playlistDetailCover = _interopRequireDefault(require("../../molecule/playlist-detail-cover"));
29
27
 
30
28
  var _skillDetail = require("../skill-detail");
@@ -45,7 +43,7 @@ const PlaylistDetail = (props, context) => {
45
43
  coverImages,
46
44
  playlistRef,
47
45
  description,
48
- ongoingCourses,
46
+ ongoingCoursesAvailable,
49
47
  playlistCourses,
50
48
  totalCourses,
51
49
  filters,
@@ -97,13 +95,9 @@ const PlaylistDetail = (props, context) => {
97
95
  })) : null) : null, /*#__PURE__*/_react.default.createElement("div", {
98
96
  className: _style.default.continueLearningButton
99
97
  }, /*#__PURE__*/_react.default.createElement(_skillDetail.ContinueLearningButton, {
100
- ongoingCoursesAvailable: !!ongoingCourses.list.length,
98
+ ongoingCoursesAvailable: ongoingCoursesAvailable,
101
99
  onClick: onContinueLearningClick
102
- })))), /*#__PURE__*/_react.default.createElement("div", {
103
- className: _style.default.continueLearningSection
104
- }, /*#__PURE__*/_react.default.createElement(_continueLearning.default, {
105
- ongoingCourses: ongoingCourses
106
- })), /*#__PURE__*/_react.default.createElement(_allCourses.default, {
100
+ })))), /*#__PURE__*/_react.default.createElement(_allCourses.default, {
107
101
  courses: playlistCourses,
108
102
  totalCourses: totalCourses,
109
103
  filters: filters,
@@ -120,7 +114,7 @@ PlaylistDetail.propTypes = process.env.NODE_ENV !== "production" ? {
120
114
  coverImages: _playlistDetailCover.default.propTypes.images,
121
115
  playlistRef: _propTypes.default.string.isRequired,
122
116
  description: _propTypes.default.string,
123
- ongoingCourses: _propTypes.default.shape(_cardsGrid.default.propTypes),
117
+ ongoingCoursesAvailable: _propTypes.default.bool,
124
118
  playlistCourses: _propTypes.default.shape(_cardsGrid.default.propTypes),
125
119
  totalCourses: _propTypes.default.number,
126
120
  filters: _propTypes.default.shape({
package/lib/template/playlist-detail/index.js.map CHANGED
@@ -1 +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","backButton","ctaContainer","coverWrapper","length","showMoreWrapper","faSize","wrapperSize","continueLearningButton","list","continueLearningSection","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 <div className={style.continueLearningSection}>\n <ContinueLearning ongoingCourses={ongoingCourses} />\n </div>\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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"}
1
+ {"version":3,"file":"index.js","names":["DESCRIPTION_BREAKPOINT","PlaylistDetail","props","context","title","coverImages","playlistRef","description","ongoingCoursesAvailable","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","contextTypes","skin","Provider","childContextTypes","propTypes","PropTypes","string","isRequired","PlaylistDetailCover","images","bool","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 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 ongoingCoursesAvailable,\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={ongoingCoursesAvailable}\n onClick={onContinueLearningClick}\n />\n </div>\n </div>\n </div>\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 ongoingCoursesAvailable: PropTypes.bool,\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":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,MAAMA,sBAAsB,GAAG,GAA/B;;AAEA,MAAMC,cAAc,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACzC,MAAM;IACJC,KADI;IAEJC,WAFI;IAGJC,WAHI;IAIJC,WAJI;IAKJC,uBALI;IAMJC,eANI;IAOJC,YAPI;IAQJC,OARI;IASJC,OATI;IAUJC,WAVI;IAWJC;EAXI,IAYFZ,KAZJ;EAaA,MAAM;IAACa;EAAD,IAAcZ,OAApB;EAEA,MAAM,CAACa,QAAD,EAAWC,WAAX,IAA0B,IAAAC,eAAA,EAAS,KAAT,CAAhC;EAEA,MAAMC,cAAc,GAAG,IAAAC,kBAAA,EAAY,MAAMH,WAAW,CAAC,CAACD,QAAF,CAA7B,EAA0C,CAACC,WAAD,EAAcD,QAAd,CAA1C,CAAvB;EAEA,MAAMK,WAAW,GAAG,IAAAD,kBAAA,EAAY,MAAM;IACpC,oBACE;MAAK,SAAS,EAAE,IAAAE,mBAAA,EAAWC,cAAA,CAAMhB,WAAjB,EAA8B,CAACS,QAAD,IAAaO,cAAA,CAAMC,QAAjD;IAAhB,GACGjB,WADH,CADF;EAKD,CANmB,EAMjB,CAACS,QAAD,EAAWT,WAAX,CANiB,CAApB;EAQA,oBACE;IAAK,SAAS,EAAEgB,cAAA,CAAME;EAAtB,gBACE;IAAK,SAAS,EAAEF,cAAA,CAAMG,SAAtB;IAAiC,aAAWpB;EAA5C,gBACE,6BAAC,uBAAD;IACE,MAAM,EAAC,YADT;IAEE,aAAU,aAFZ;IAGE,cAAW,MAHb;IAIE,OAAO,EAAEO,WAJX;IAKE,SAAS,EAAEU,cAAA,CAAMI,UALnB;IAME,gBAAgB,EAAC;EANnB,EADF,eASE;IAAK,SAAS,EAAEJ,cAAA,CAAMK;EAAtB,gBACE;IAAK,SAAS,EAAEL,cAAA,CAAMM;EAAtB,gBACE,6BAAC,4BAAD;IAAqB,MAAM,EAAExB;EAA7B,EADF,CADF,eAIE,uDACE,6BAAC,YAAD;IAAK,KAAK,EAAEU,SAAS,CAAC,UAAD;EAArB,EADF,eAEE;IAAK,SAAS,EAAEQ,cAAA,CAAMnB;EAAtB,GAA8BA,KAA9B,CAFF,EAGGG,WAAW,gBACV,yEACE,6BAAC,WAAD,OADF,EAEGA,WAAW,CAACuB,MAAZ,IAAsB9B,sBAAtB,gBACC;IAAK,SAAS,EAAEuB,cAAA,CAAMQ,eAAtB;IAAuC,OAAO,EAAEZ;EAAhD,GACGJ,SAAS,CAACC,QAAQ,GAAG,WAAH,GAAiB,WAA1B,CADZ,eAEE,6BAAC,aAAD;IACE,QAAQ,EAAEA,QAAQ,GAAG,YAAH,GAAkB,cADtC;IAEE,IAAI,EAAE;MAACgB,MAAM,EAAE,EAAT;MAAaC,WAAW,EAAE;IAA1B;EAFR,EAFF,CADD,GAQG,IAVN,CADU,GAaR,IAhBN,eAiBE;IAAK,SAAS,EAAEV,cAAA,CAAMW;EAAtB,gBACE,6BAAC,mCAAD;IACE,uBAAuB,EAAE1B,uBAD3B;IAEE,OAAO,EAAEM;EAFX,EADF,CAjBF,CAJF,CATF,eAsCE,6BAAC,mBAAD;IACE,OAAO,EAAEL,eADX;IAEE,YAAY,EAAEC,YAFhB;IAGE,OAAO,EAAEC,OAHX;IAIE,OAAO,EAAEC;EAJX,EAtCF,CADF,CADF;AAiDD,CA7ED;;AA+EAX,cAAc,CAACkC,YAAf,GAA8B;EAC5BC,IAAI,EAAEC,iBAAA,CAASC,iBAAT,CAA2BF,IADL;EAE5BrB,SAAS,EAAEsB,iBAAA,CAASC,iBAAT,CAA2BvB;AAFV,CAA9B;AAKAd,cAAc,CAACsC,SAAf,2CAA2B;EACzBnC,KAAK,EAAEoC,kBAAA,CAAUC,MAAV,CAAiBC,UADC;EAEzBrC,WAAW,EAAEsC,4BAAA,CAAoBJ,SAApB,CAA8BK,MAFlB;EAGzBtC,WAAW,EAAEkC,kBAAA,CAAUC,MAAV,CAAiBC,UAHL;EAIzBnC,WAAW,EAAEiC,kBAAA,CAAUC,MAJE;EAKzBjC,uBAAuB,EAAEgC,kBAAA,CAAUK,IALV;EAMzBpC,eAAe,EAAE+B,kBAAA,CAAUM,KAAV,CAAgBC,kBAAA,CAAUR,SAA1B,CANQ;EAOzB7B,YAAY,EAAE8B,kBAAA,CAAUQ,MAPC;EAQzBrC,OAAO,EAAE6B,kBAAA,CAAUM,KAAV,CAAgB;IACvBG,QAAQ,EAAET,kBAAA,CAAUU,IADG;IAEvBC,OAAO,EAAEX,kBAAA,CAAUY,OAAV,CAAkBZ,kBAAA,CAAUM,KAAV,CAAgBO,6BAAhB,CAAlB;EAFc,CAAhB,CARgB;EAYzBzC,OAAO,EAAE4B,kBAAA,CAAUM,KAAV,CAAgBQ,eAAA,CAAOf,SAAvB,CAZgB;EAazB1B,WAAW,EAAE2B,kBAAA,CAAUU,IAbE;EAczBpC,uBAAuB,EAAE0B,kBAAA,CAAUU;AAdV,CAA3B;eAiBejD,c"}
package/lib/template/skill-detail/index.d.ts CHANGED
@@ -61,33 +61,28 @@ declare namespace SkillDetail {
61
61
  }
62
62
  export { contextTypes_1 as contextTypes };
63
63
  export namespace propTypes_1 {
64
- const title: PropTypes.Validator<string>;
65
- const skillRef: PropTypes.Validator<string>;
66
- const description: PropTypes.Requireable<string>;
67
- const metrics: PropTypes.Requireable<PropTypes.InferProps<{
64
+ export const title: PropTypes.Validator<string>;
65
+ export const skillRef: PropTypes.Validator<string>;
66
+ export const description: PropTypes.Requireable<string>;
67
+ export const metrics: PropTypes.Requireable<PropTypes.InferProps<{
68
68
  score: PropTypes.Requireable<number>;
69
69
  content: PropTypes.Requireable<number>;
70
70
  questionsToReview: PropTypes.Requireable<number>;
71
71
  contentCompleted: PropTypes.Requireable<number>;
72
72
  }>>;
73
- const focused: PropTypes.Requireable<boolean>;
74
- const availableForReview: PropTypes.Requireable<boolean>;
75
- const ongoingCourses: PropTypes.Requireable<PropTypes.InferProps<{
73
+ export const focused: PropTypes.Requireable<boolean>;
74
+ export const availableForReview: PropTypes.Requireable<boolean>;
75
+ const ongoingCoursesAvailable_1: PropTypes.Requireable<boolean>;
76
+ export { ongoingCoursesAvailable_1 as ongoingCoursesAvailable };
77
+ export const skillIncludedCourses: PropTypes.Requireable<PropTypes.InferProps<{
76
78
  list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
77
79
  customStyle: PropTypes.Requireable<{
78
80
  [x: string]: string | null | undefined;
79
81
  }>;
80
82
  loading: PropTypes.Requireable<boolean>;
81
83
  }>>;
82
- const skillIncludedCourses: PropTypes.Requireable<PropTypes.InferProps<{
83
- list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
84
- customStyle: PropTypes.Requireable<{
85
- [x: string]: string | null | undefined;
86
- }>;
87
- loading: PropTypes.Requireable<boolean>;
88
- }>>;
89
- const totalCourses: PropTypes.Requireable<number>;
90
- const filters: PropTypes.Requireable<PropTypes.InferProps<{
84
+ export const totalCourses: PropTypes.Requireable<number>;
85
+ export const filters: PropTypes.Requireable<PropTypes.InferProps<{
91
86
  onChange: PropTypes.Requireable<(...args: any[]) => any>;
92
87
  options: PropTypes.Requireable<(PropTypes.InferProps<{
93
88
  name: PropTypes.Validator<string>;
@@ -96,7 +91,7 @@ declare namespace SkillDetail {
96
91
  validOption: PropTypes.Requireable<boolean>;
97
92
  }> | null | undefined)[]>;
98
93
  }>>;
99
- const sorting: PropTypes.Requireable<PropTypes.InferProps<{
94
+ export const sorting: PropTypes.Requireable<PropTypes.InferProps<{
100
95
  title: PropTypes.Requireable<string>;
101
96
  name: PropTypes.Requireable<string>;
102
97
  className: PropTypes.Requireable<string>;
@@ -127,9 +122,9 @@ declare namespace SkillDetail {
127
122
  'aria-label': PropTypes.Requireable<string>;
128
123
  'aria-labelledby': PropTypes.Requireable<string>;
129
124
  }>>;
130
- const onBackClick: PropTypes.Requireable<(...args: any[]) => any>;
131
- const onReviewClick: PropTypes.Requireable<(...args: any[]) => any>;
132
- const onContinueLearningClick: PropTypes.Requireable<(...args: any[]) => any>;
125
+ export const onBackClick: PropTypes.Requireable<(...args: any[]) => any>;
126
+ export const onReviewClick: PropTypes.Requireable<(...args: any[]) => any>;
127
+ export const onContinueLearningClick: PropTypes.Requireable<(...args: any[]) => any>;
133
128
  }
134
129
  export { propTypes_1 as propTypes };
135
130
  }
package/lib/template/skill-detail/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/index.js"],"names":[],"mappings":"AAeO,8EA+BN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYD,oEA8JC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/index.js"],"names":[],"mappings":"AAcO,8EA+BN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYD,oEA6JC"}
package/lib/template/skill-detail/index.js CHANGED
@@ -29,8 +29,6 @@ var _style = _interopRequireDefault(require("./style.css"));
29
29
 
30
30
  var _allCourses = _interopRequireDefault(require("./all-courses"));
31
31
 
32
- var _continueLearning = _interopRequireDefault(require("./continue-learning"));
33
-
34
32
  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); }
35
33
 
36
34
  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; }
@@ -87,7 +85,7 @@ const SkillDetail = (props, context) => {
87
85
  metrics = {},
88
86
  focused,
89
87
  availableForReview,
90
- ongoingCourses,
88
+ ongoingCoursesAvailable,
91
89
  skillIncludedCourses,
92
90
  totalCourses,
93
91
  filters,
@@ -174,7 +172,7 @@ const SkillDetail = (props, context) => {
174
172
  borderRadius: '12px'
175
173
  }
176
174
  }), /*#__PURE__*/_react.default.createElement(ContinueLearningButton, {
177
- ongoingCoursesAvailable: !!ongoingCourses.list.length,
175
+ ongoingCoursesAvailable: ongoingCoursesAvailable,
178
176
  onClick: onContinueLearningClick
179
177
  }))), score !== undefined ? /*#__PURE__*/_react.default.createElement("div", {
180
178
  className: _style.default.progressInformationsWrapper
@@ -192,7 +190,7 @@ const SkillDetail = (props, context) => {
192
190
  "data-name": "skill-questions"
193
191
  }, /*#__PURE__*/_react.default.createElement("span", {
194
192
  className: _style.default.skillInformationNumber
195
- }, questionsToReview), "\xA0", translate('questions')) : null), /*#__PURE__*/_react.default.createElement(ProgressBar, null), /*#__PURE__*/_react.default.createElement("div", {
193
+ }, questionsToReview), "\xA0", translate('skill_chart_side_panel_questions_to_review')) : null), /*#__PURE__*/_react.default.createElement(ProgressBar, null), /*#__PURE__*/_react.default.createElement("div", {
196
194
  className: _style.default.progressInformations
197
195
  }, content && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
198
196
  className: _style.default.progressInformation,
@@ -204,9 +202,7 @@ const SkillDetail = (props, context) => {
204
202
  "data-name": "completed-percentage"
205
203
  }, /*#__PURE__*/_react.default.createElement("span", {
206
204
  className: _style.default.progressInformationNumber
207
- }, score.toFixed(1), "%"))))) : null, /*#__PURE__*/_react.default.createElement(_continueLearning.default, {
208
- ongoingCourses: ongoingCourses
209
- }), /*#__PURE__*/_react.default.createElement(_allCourses.default, {
205
+ }, score.toFixed(1), "%"))))) : null, /*#__PURE__*/_react.default.createElement(_allCourses.default, {
210
206
  courses: skillIncludedCourses,
211
207
  totalCourses: totalCourses,
212
208
  filters: filters,
@@ -230,7 +226,7 @@ SkillDetail.propTypes = process.env.NODE_ENV !== "production" ? {
230
226
  }),
231
227
  focused: _propTypes.default.bool,
232
228
  availableForReview: _propTypes.default.bool,
233
- ongoingCourses: _propTypes.default.shape(_cardsGrid.default.propTypes),
229
+ ongoingCoursesAvailable: _propTypes.default.bool,
234
230
  skillIncludedCourses: _propTypes.default.shape(_cardsGrid.default.propTypes),
235
231
  totalCourses: _propTypes.default.number,
236
232
  filters: _propTypes.default.shape({
package/lib/template/skill-detail/index.js.map CHANGED
@@ -1 +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","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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"}
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","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","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';\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 ongoingCoursesAvailable,\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={ongoingCoursesAvailable}\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('skill_chart_side_panel_questions_to_review')}\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 <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 ongoingCoursesAvailable: PropTypes.bool,\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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@coorpacademy/components",
3
- "version": "11.32.35",
3
+ "version": "11.32.36-alpha.0+96f545791",
4
4
  "description": "",
5
5
  "main": "lib/index.js",
6
6
  "module": "es/index.js",
@@ -177,5 +177,5 @@
177
177
  "last 2 versions",
178
178
  "IE 11"
179
179
  ],
180
- "gitHead": "087e85a29c5615e99d792c2082a8a1e5e8e154fe"
180
+ "gitHead": "96f5457910c46d1e44e04a9cc16c6855996b9e33"
181
181
  }