@coorpacademy/components 11.32.24-alpha.6 → 11.32.25
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.
- package/es/atom/button-link/index.d.ts +1 -0
- package/es/atom/button-link/index.d.ts.map +1 -1
- package/es/atom/button-link/index.js +4 -2
- package/es/atom/button-link/index.js.map +1 -1
- package/es/atom/button-link/types.d.ts +2 -0
- package/es/atom/button-link/types.d.ts.map +1 -1
- package/es/atom/button-link/types.js +1 -0
- package/es/atom/button-link/types.js.map +1 -1
- package/es/atom/circular-progress-bar/index.d.ts.map +1 -1
- package/es/atom/circular-progress-bar/index.js +1 -10
- package/es/atom/circular-progress-bar/index.js.map +1 -1
- package/es/atom/input-doublestep/index.d.ts +1 -0
- package/es/atom/input-doublestep/index.d.ts.map +1 -1
- package/es/atom/input-doublestep/index.js +38 -13
- package/es/atom/input-doublestep/index.js.map +1 -1
- package/es/atom/input-doublestep/style.css +7 -67
- package/es/atom/select/index.js +1 -1
- package/es/atom/select/index.js.map +1 -1
- package/es/molecule/base-modal/index.d.ts +1 -0
- package/es/molecule/base-modal/index.d.ts.map +1 -1
- package/es/molecule/base-modal/index.js +8 -6
- package/es/molecule/base-modal/index.js.map +1 -1
- package/es/molecule/brand-create-form/index.d.ts.map +1 -1
- package/es/molecule/brand-create-form/index.js +9 -4
- package/es/molecule/brand-create-form/index.js.map +1 -1
- package/es/molecule/brand-download-box/index.d.ts.map +1 -1
- package/es/molecule/brand-download-box/index.js +11 -6
- package/es/molecule/brand-download-box/index.js.map +1 -1
- package/es/molecule/brand-download-box/style.css +6 -5
- package/es/molecule/brand-form-group/index.d.ts.map +1 -1
- package/es/molecule/brand-form-group/index.js +12 -1
- package/es/molecule/brand-form-group/index.js.map +1 -1
- package/es/molecule/cm-popin/style.css +1 -1
- package/es/molecule/cm-popin/types.d.ts +3 -0
- package/es/molecule/cm-popin/types.d.ts.map +1 -1
- package/es/molecule/discipline-associated-skills/index.js +1 -1
- package/es/molecule/discipline-associated-skills/index.js.map +1 -1
- package/es/molecule/draggable-list/index.d.ts +1 -0
- package/es/molecule/expandible-actionable-table/index.d.ts +1 -0
- package/es/molecule/expandible-actionable-table/index.d.ts.map +1 -1
- package/es/molecule/expandible-actionable-table/types.d.ts +1 -0
- package/es/molecule/expandible-actionable-table/types.d.ts.map +1 -1
- package/es/molecule/learning-priority-modal/index.d.ts.map +1 -1
- package/es/molecule/learning-priority-modal/index.js +8 -15
- package/es/molecule/learning-priority-modal/index.js.map +1 -1
- package/es/molecule/learning-priority-modal/style.css +0 -1
- package/es/molecule/learning-priority-setup-item/index.d.ts.map +1 -1
- package/es/molecule/learning-priority-setup-item/index.js +1 -1
- package/es/molecule/learning-priority-setup-item/index.js.map +1 -1
- package/es/molecule/learning-profile-radar-chart/index.d.ts.map +1 -1
- package/es/molecule/learning-profile-radar-chart/index.js +0 -2
- package/es/molecule/learning-profile-radar-chart/index.js.map +1 -1
- package/es/molecule/playlist-detail-cover/index.d.ts +14 -0
- package/es/molecule/playlist-detail-cover/index.d.ts.map +1 -0
- package/es/molecule/playlist-detail-cover/index.js +52 -0
- package/es/molecule/playlist-detail-cover/index.js.map +1 -0
- package/es/molecule/playlist-detail-cover/style.css +17 -0
- package/es/molecule/setup-section/index.d.ts.map +1 -1
- package/es/molecule/setup-section/index.js +3 -1
- package/es/molecule/setup-section/index.js.map +1 -1
- package/es/molecule/setup-section/style.css +2 -2
- package/es/molecule/skill-picker-modal/index.js +1 -1
- package/es/molecule/skill-picker-modal/index.js.map +1 -1
- package/es/organism/brand-form/index.d.ts.map +1 -1
- package/es/organism/brand-form/index.js +24 -15
- package/es/organism/brand-form/index.js.map +1 -1
- package/es/organism/brand-learning-priorities/index.d.ts +1 -21
- package/es/organism/brand-learning-priorities/index.d.ts.map +1 -1
- package/es/organism/brand-learning-priorities/index.js +1 -14
- package/es/organism/brand-learning-priorities/index.js.map +1 -1
- package/es/organism/brand-learning-priorities/style.css +2 -0
- package/es/organism/list-item/index.d.ts +3 -1
- package/es/organism/list-item/index.d.ts.map +1 -1
- package/es/organism/list-item/index.js +7 -5
- package/es/organism/list-item/index.js.map +1 -1
- package/es/organism/list-items/index.d.ts +3 -0
- package/es/organism/setup-header/index.d.ts +4 -0
- package/es/organism/wizard-contents/index.d.ts +3 -0
- package/es/template/app-player/loading/index.d.ts +3 -0
- package/es/template/app-player/player/index.d.ts +6 -0
- package/es/template/app-player/player/slides/index.d.ts +3 -0
- package/es/template/app-player/player/slides/index.d.ts.map +1 -1
- package/es/template/app-player/popin-correction/index.d.ts +3 -0
- package/es/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/es/template/app-player/popin-end/index.d.ts +3 -0
- package/es/template/app-review/index.d.ts +3 -0
- package/es/template/app-review/index.d.ts.map +1 -1
- package/es/template/app-review/player/prop-types.d.ts +3 -0
- package/es/template/app-review/player/prop-types.d.ts.map +1 -1
- package/es/template/app-review/prop-types.d.ts +3 -0
- package/es/template/app-review/prop-types.d.ts.map +1 -1
- package/es/template/back-office/brand-create/index.d.ts +4 -0
- package/es/template/back-office/brand-create/index.d.ts.map +1 -1
- package/es/template/back-office/brand-list/index.d.ts +4 -0
- package/es/template/back-office/brand-list/index.d.ts.map +1 -1
- package/es/template/back-office/brand-update/index.d.ts +14 -0
- package/es/template/back-office/dashboard-preview/index.d.ts +4 -0
- package/es/template/back-office/layout/index.d.ts +4 -0
- package/es/template/back-office/layout/index.d.ts.map +1 -1
- package/es/template/common/dashboard/index.d.ts +6 -0
- package/es/template/common/search-page/index.d.ts +3 -0
- package/es/template/external-course/index.d.ts +3 -0
- package/es/template/my-learning/index.js +1 -1
- package/es/template/my-learning/index.js.map +1 -1
- package/es/template/playlist-detail/index.d.ts +96 -0
- package/es/template/playlist-detail/index.d.ts.map +1 -0
- package/es/template/playlist-detail/index.js +109 -0
- package/es/template/playlist-detail/index.js.map +1 -0
- package/es/template/playlist-detail/style.css +108 -0
- package/es/template/skill-detail/all-courses.d.ts +1 -1
- package/es/template/skill-detail/all-courses.js +3 -3
- package/es/template/skill-detail/all-courses.js.map +1 -1
- package/es/template/skill-detail/index.d.ts +39 -4
- package/es/template/skill-detail/index.d.ts.map +1 -1
- package/es/template/skill-detail/index.js +2 -4
- package/es/template/skill-detail/index.js.map +1 -1
- package/es/util/external-content.d.ts +1 -0
- package/es/util/external-content.d.ts.map +1 -1
- package/es/util/external-content.js +1 -0
- package/es/util/external-content.js.map +1 -1
- package/lib/atom/button-link/index.d.ts +1 -0
- package/lib/atom/button-link/index.d.ts.map +1 -1
- package/lib/atom/button-link/index.js +4 -2
- package/lib/atom/button-link/index.js.map +1 -1
- package/lib/atom/button-link/types.d.ts +2 -0
- package/lib/atom/button-link/types.d.ts.map +1 -1
- package/lib/atom/button-link/types.js +1 -0
- package/lib/atom/button-link/types.js.map +1 -1
- package/lib/atom/circular-progress-bar/index.d.ts.map +1 -1
- package/lib/atom/circular-progress-bar/index.js +1 -10
- package/lib/atom/circular-progress-bar/index.js.map +1 -1
- package/lib/atom/input-doublestep/index.d.ts +1 -0
- package/lib/atom/input-doublestep/index.d.ts.map +1 -1
- package/lib/atom/input-doublestep/index.js +39 -13
- package/lib/atom/input-doublestep/index.js.map +1 -1
- package/lib/atom/input-doublestep/style.css +7 -67
- package/lib/atom/select/index.js +1 -1
- package/lib/atom/select/index.js.map +1 -1
- package/lib/molecule/base-modal/index.d.ts +1 -0
- package/lib/molecule/base-modal/index.d.ts.map +1 -1
- package/lib/molecule/base-modal/index.js +8 -6
- package/lib/molecule/base-modal/index.js.map +1 -1
- package/lib/molecule/brand-create-form/index.d.ts.map +1 -1
- package/lib/molecule/brand-create-form/index.js +9 -4
- package/lib/molecule/brand-create-form/index.js.map +1 -1
- package/lib/molecule/brand-download-box/index.d.ts.map +1 -1
- package/lib/molecule/brand-download-box/index.js +11 -6
- package/lib/molecule/brand-download-box/index.js.map +1 -1
- package/lib/molecule/brand-download-box/style.css +6 -5
- package/lib/molecule/brand-form-group/index.d.ts.map +1 -1
- package/lib/molecule/brand-form-group/index.js +12 -1
- package/lib/molecule/brand-form-group/index.js.map +1 -1
- package/lib/molecule/cm-popin/style.css +1 -1
- package/lib/molecule/cm-popin/types.d.ts +3 -0
- package/lib/molecule/cm-popin/types.d.ts.map +1 -1
- package/lib/molecule/discipline-associated-skills/index.js +1 -1
- package/lib/molecule/discipline-associated-skills/index.js.map +1 -1
- package/lib/molecule/draggable-list/index.d.ts +1 -0
- package/lib/molecule/expandible-actionable-table/index.d.ts +1 -0
- package/lib/molecule/expandible-actionable-table/index.d.ts.map +1 -1
- package/lib/molecule/expandible-actionable-table/types.d.ts +1 -0
- package/lib/molecule/expandible-actionable-table/types.d.ts.map +1 -1
- package/lib/molecule/learning-priority-modal/index.d.ts.map +1 -1
- package/lib/molecule/learning-priority-modal/index.js +9 -14
- package/lib/molecule/learning-priority-modal/index.js.map +1 -1
- package/lib/molecule/learning-priority-modal/style.css +0 -1
- package/lib/molecule/learning-priority-setup-item/index.d.ts.map +1 -1
- package/lib/molecule/learning-priority-setup-item/index.js +1 -1
- package/lib/molecule/learning-priority-setup-item/index.js.map +1 -1
- package/lib/molecule/learning-profile-radar-chart/index.d.ts.map +1 -1
- package/lib/molecule/learning-profile-radar-chart/index.js +0 -2
- package/lib/molecule/learning-profile-radar-chart/index.js.map +1 -1
- package/lib/molecule/playlist-detail-cover/index.d.ts +14 -0
- package/lib/molecule/playlist-detail-cover/index.d.ts.map +1 -0
- package/lib/molecule/playlist-detail-cover/index.js +68 -0
- package/lib/molecule/playlist-detail-cover/index.js.map +1 -0
- package/lib/molecule/playlist-detail-cover/style.css +17 -0
- package/lib/molecule/setup-section/index.d.ts.map +1 -1
- package/lib/molecule/setup-section/index.js +4 -1
- package/lib/molecule/setup-section/index.js.map +1 -1
- package/lib/molecule/setup-section/style.css +2 -2
- package/lib/molecule/skill-picker-modal/index.js +1 -1
- package/lib/molecule/skill-picker-modal/index.js.map +1 -1
- package/lib/organism/brand-form/index.d.ts.map +1 -1
- package/lib/organism/brand-form/index.js +24 -15
- package/lib/organism/brand-form/index.js.map +1 -1
- package/lib/organism/brand-learning-priorities/index.d.ts +1 -21
- package/lib/organism/brand-learning-priorities/index.d.ts.map +1 -1
- package/lib/organism/brand-learning-priorities/index.js +3 -15
- package/lib/organism/brand-learning-priorities/index.js.map +1 -1
- package/lib/organism/brand-learning-priorities/style.css +2 -0
- package/lib/organism/list-item/index.d.ts +3 -1
- package/lib/organism/list-item/index.d.ts.map +1 -1
- package/lib/organism/list-item/index.js +7 -5
- package/lib/organism/list-item/index.js.map +1 -1
- package/lib/organism/list-items/index.d.ts +3 -0
- package/lib/organism/setup-header/index.d.ts +4 -0
- package/lib/organism/wizard-contents/index.d.ts +3 -0
- package/lib/template/app-player/loading/index.d.ts +3 -0
- package/lib/template/app-player/player/index.d.ts +6 -0
- package/lib/template/app-player/player/slides/index.d.ts +3 -0
- package/lib/template/app-player/player/slides/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-correction/index.d.ts +3 -0
- package/lib/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-end/index.d.ts +3 -0
- package/lib/template/app-review/index.d.ts +3 -0
- package/lib/template/app-review/index.d.ts.map +1 -1
- package/lib/template/app-review/player/prop-types.d.ts +3 -0
- package/lib/template/app-review/player/prop-types.d.ts.map +1 -1
- package/lib/template/app-review/prop-types.d.ts +3 -0
- package/lib/template/app-review/prop-types.d.ts.map +1 -1
- package/lib/template/back-office/brand-create/index.d.ts +4 -0
- package/lib/template/back-office/brand-create/index.d.ts.map +1 -1
- package/lib/template/back-office/brand-list/index.d.ts +4 -0
- package/lib/template/back-office/brand-list/index.d.ts.map +1 -1
- package/lib/template/back-office/brand-update/index.d.ts +14 -0
- package/lib/template/back-office/dashboard-preview/index.d.ts +4 -0
- package/lib/template/back-office/layout/index.d.ts +4 -0
- package/lib/template/back-office/layout/index.d.ts.map +1 -1
- package/lib/template/common/dashboard/index.d.ts +6 -0
- package/lib/template/common/search-page/index.d.ts +3 -0
- package/lib/template/external-course/index.d.ts +3 -0
- package/lib/template/my-learning/index.js +1 -1
- package/lib/template/my-learning/index.js.map +1 -1
- package/lib/template/playlist-detail/index.d.ts +96 -0
- package/lib/template/playlist-detail/index.d.ts.map +1 -0
- package/lib/template/playlist-detail/index.js +134 -0
- package/lib/template/playlist-detail/index.js.map +1 -0
- package/lib/template/playlist-detail/style.css +108 -0
- package/lib/template/skill-detail/all-courses.d.ts +1 -1
- package/lib/template/skill-detail/all-courses.js +3 -3
- package/lib/template/skill-detail/all-courses.js.map +1 -1
- package/lib/template/skill-detail/index.d.ts +39 -4
- package/lib/template/skill-detail/index.d.ts.map +1 -1
- package/lib/template/skill-detail/index.js +3 -2
- package/lib/template/skill-detail/index.js.map +1 -1
- package/lib/util/external-content.d.ts +1 -0
- package/lib/util/external-content.d.ts.map +1 -1
- package/lib/util/external-content.js +3 -1
- package/lib/util/external-content.js.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,OAAO,IAAI,MAAM,iBAAiB,CAAC;AACnC,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAGlD,QAAA,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,OAAO,IAAI,MAAM,iBAAiB,CAAC;AACnC,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAGlD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDd,CAAC;AAEF,aAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,UAAU,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE;QACZ,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,OAAO,GAAG,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAC5D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,YAAY,CAAC,EAAE,eAAe,CAAC;IAC/B,KAAK,CAAC,EAAE;QACN,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;QACzB,IAAI,EACA,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,GAChD,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;KACtD,CAAC;IACF,IAAI,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC;CACpD,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
@@ -52,7 +52,7 @@ const DisciplineAssociatedSkills = (props, context) => {
|
|
|
52
52
|
}, skill.locale)), []);
|
|
53
53
|
const TooltipContentElement = (0, _react.useCallback)(skill => /*#__PURE__*/_react.default.createElement("div", {
|
|
54
54
|
className: _style.default.tooltipContentWrapper
|
|
55
|
-
}, skill.focused ? /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("b", null, translate('skill_focused_chip_tooltip'))) : null, /*#__PURE__*/_react.default.createElement("div", null, skill.locale)), []);
|
|
55
|
+
}, skill.focused ? /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("b", null, translate('skill_focused_chip_tooltip'))) : null, /*#__PURE__*/_react.default.createElement("div", null, skill.locale)), [translate]);
|
|
56
56
|
return !(0, _isEmpty2.default)(skills) ? /*#__PURE__*/_react.default.createElement("div", {
|
|
57
57
|
"data-name": "discipline-associated-skills",
|
|
58
58
|
className: _style.default.associatedSkillsWrapper
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["DisciplineAssociatedSkills","props","context","translate","skills","skillsBaseUrl","onSkillClick","hrefFormat","useCallback","skill","ref","AnchorElement","style","chipFocusedContent","focused","faSize","wrapperSize","chipFocusedContentText","locale","TooltipContentElement","tooltipContentWrapper","associatedSkillsWrapper","chipsWrapper","map","handleSkillClick","event","preventDefault","handleAnchorElement","handleTooltipContentElement","classnames","chipWrapper","chipWrapperFocused","infoIconTooltip","tooltipSkillFocused","tooltip","contextTypes","Provider","childContextTypes","propTypes","PropTypes","arrayOf","shape","string","bool","func"],"sources":["../../../src/molecule/discipline-associated-skills/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {isEmpty, uniqueId} from 'lodash/fp';\nimport Icon from '../../atom/icon';\nimport ToolTip from '../../atom/tooltip';\nimport Provider from '../../atom/provider';\nimport CatalogSection from '../../atom/catalog-section';\nimport style from './style.css';\n\nconst DisciplineAssociatedSkills = (props, context) => {\n const {translate} = context;\n\n const {skills = [], skillsBaseUrl, onSkillClick} = props;\n\n const hrefFormat = useCallback(\n skill => (skillsBaseUrl ? `${skillsBaseUrl}/${skill.ref}` : ''),\n [skillsBaseUrl]\n );\n\n const AnchorElement = useCallback(\n skill => (\n <div className={style.chipFocusedContent}>\n {skill.focused ? (\n <Icon\n iconName=\"bullseye-arrow\"\n size={{\n faSize: 12,\n wrapperSize: 12\n }}\n />\n ) : null}\n <div className={style.chipFocusedContentText}>{skill.locale}</div>\n </div>\n ),\n []\n );\n\n const TooltipContentElement = useCallback(\n skill => (\n <div className={style.tooltipContentWrapper}>\n {skill.focused ? (\n <div>\n <b>{translate('skill_focused_chip_tooltip')}</b>\n </div>\n ) : null}\n <div>{skill.locale}</div>\n </div>\n ),\n []\n );\n\n return !isEmpty(skills) ? (\n <div data-name=\"discipline-associated-skills\" className={style.associatedSkillsWrapper}>\n <CatalogSection title={translate('associated_skills')}>\n <div className={style.chipsWrapper}>\n {skills.map(skill => {\n function handleSkillClick(event) {\n if (!skillsBaseUrl) event.preventDefault();\n onSkillClick();\n }\n function handleAnchorElement() {\n return AnchorElement(skill);\n }\n function handleTooltipContentElement() {\n return TooltipContentElement(skill);\n }\n return (\n <a\n href={hrefFormat(skill)}\n key={uniqueId()}\n className={classnames(style.chipWrapper, skill.focused && style.chipWrapperFocused)}\n onClick={handleSkillClick}\n >\n <ToolTip\n AnchorElement={handleAnchorElement}\n fontSize={12}\n delayHide={0}\n iconContainerClassName={style.infoIconTooltip}\n tooltipClassName={skill.focused ? style.tooltipSkillFocused : style.tooltip}\n TooltipContent={handleTooltipContentElement}\n closeToolTipInformationTextAriaLabel={translate('close_tooltip_information')}\n />\n </a>\n );\n })}\n </div>\n </CatalogSection>\n </div>\n ) : null;\n};\n\nDisciplineAssociatedSkills.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nDisciplineAssociatedSkills.propTypes = {\n skills: PropTypes.arrayOf(\n PropTypes.shape({\n ref: PropTypes.string,\n locale: PropTypes.string,\n focused: PropTypes.bool\n })\n ),\n skillsBaseUrl: PropTypes.string,\n onSkillClick: PropTypes.func\n};\n\nexport default DisciplineAssociatedSkills;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,MAAMA,0BAA0B,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACrD,MAAM;IAACC;EAAD,IAAcD,OAApB;EAEA,MAAM;IAACE,MAAM,GAAG,EAAV;IAAcC,aAAd;IAA6BC;EAA7B,IAA6CL,KAAnD;EAEA,MAAMM,UAAU,GAAG,IAAAC,kBAAA,EACjBC,KAAK,IAAKJ,aAAa,GAAI,GAAEA,aAAc,IAAGI,KAAK,CAACC,GAAI,EAAjC,GAAqC,EAD3C,EAEjB,CAACL,aAAD,CAFiB,CAAnB;EAKA,MAAMM,aAAa,GAAG,IAAAH,kBAAA,EACpBC,KAAK,iBACH;IAAK,SAAS,EAAEG,cAAA,CAAMC;EAAtB,GACGJ,KAAK,CAACK,OAAN,gBACC,6BAAC,aAAD;IACE,QAAQ,EAAC,gBADX;IAEE,IAAI,EAAE;MACJC,MAAM,EAAE,EADJ;MAEJC,WAAW,EAAE;IAFT;EAFR,EADD,GAQG,IATN,eAUE;IAAK,SAAS,EAAEJ,cAAA,CAAMK;EAAtB,GAA+CR,KAAK,CAACS,MAArD,CAVF,CAFkB,EAepB,EAfoB,CAAtB;EAkBA,MAAMC,qBAAqB,GAAG,IAAAX,kBAAA,EAC5BC,KAAK,iBACH;IAAK,SAAS,EAAEG,cAAA,CAAMQ;EAAtB,GACGX,KAAK,CAACK,OAAN,gBACC,uDACE,wCAAIX,SAAS,CAAC,4BAAD,CAAb,CADF,CADD,GAIG,IALN,eAME,0CAAMM,KAAK,CAACS,MAAZ,CANF,CAF0B,EAW5B,
|
|
1
|
+
{"version":3,"file":"index.js","names":["DisciplineAssociatedSkills","props","context","translate","skills","skillsBaseUrl","onSkillClick","hrefFormat","useCallback","skill","ref","AnchorElement","style","chipFocusedContent","focused","faSize","wrapperSize","chipFocusedContentText","locale","TooltipContentElement","tooltipContentWrapper","associatedSkillsWrapper","chipsWrapper","map","handleSkillClick","event","preventDefault","handleAnchorElement","handleTooltipContentElement","classnames","chipWrapper","chipWrapperFocused","infoIconTooltip","tooltipSkillFocused","tooltip","contextTypes","Provider","childContextTypes","propTypes","PropTypes","arrayOf","shape","string","bool","func"],"sources":["../../../src/molecule/discipline-associated-skills/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {isEmpty, uniqueId} from 'lodash/fp';\nimport Icon from '../../atom/icon';\nimport ToolTip from '../../atom/tooltip';\nimport Provider from '../../atom/provider';\nimport CatalogSection from '../../atom/catalog-section';\nimport style from './style.css';\n\nconst DisciplineAssociatedSkills = (props, context) => {\n const {translate} = context;\n\n const {skills = [], skillsBaseUrl, onSkillClick} = props;\n\n const hrefFormat = useCallback(\n skill => (skillsBaseUrl ? `${skillsBaseUrl}/${skill.ref}` : ''),\n [skillsBaseUrl]\n );\n\n const AnchorElement = useCallback(\n skill => (\n <div className={style.chipFocusedContent}>\n {skill.focused ? (\n <Icon\n iconName=\"bullseye-arrow\"\n size={{\n faSize: 12,\n wrapperSize: 12\n }}\n />\n ) : null}\n <div className={style.chipFocusedContentText}>{skill.locale}</div>\n </div>\n ),\n []\n );\n\n const TooltipContentElement = useCallback(\n skill => (\n <div className={style.tooltipContentWrapper}>\n {skill.focused ? (\n <div>\n <b>{translate('skill_focused_chip_tooltip')}</b>\n </div>\n ) : null}\n <div>{skill.locale}</div>\n </div>\n ),\n [translate]\n );\n\n return !isEmpty(skills) ? (\n <div data-name=\"discipline-associated-skills\" className={style.associatedSkillsWrapper}>\n <CatalogSection title={translate('associated_skills')}>\n <div className={style.chipsWrapper}>\n {skills.map(skill => {\n function handleSkillClick(event) {\n if (!skillsBaseUrl) event.preventDefault();\n onSkillClick();\n }\n function handleAnchorElement() {\n return AnchorElement(skill);\n }\n function handleTooltipContentElement() {\n return TooltipContentElement(skill);\n }\n return (\n <a\n href={hrefFormat(skill)}\n key={uniqueId()}\n className={classnames(style.chipWrapper, skill.focused && style.chipWrapperFocused)}\n onClick={handleSkillClick}\n >\n <ToolTip\n AnchorElement={handleAnchorElement}\n fontSize={12}\n delayHide={0}\n iconContainerClassName={style.infoIconTooltip}\n tooltipClassName={skill.focused ? style.tooltipSkillFocused : style.tooltip}\n TooltipContent={handleTooltipContentElement}\n closeToolTipInformationTextAriaLabel={translate('close_tooltip_information')}\n />\n </a>\n );\n })}\n </div>\n </CatalogSection>\n </div>\n ) : null;\n};\n\nDisciplineAssociatedSkills.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nDisciplineAssociatedSkills.propTypes = {\n skills: PropTypes.arrayOf(\n PropTypes.shape({\n ref: PropTypes.string,\n locale: PropTypes.string,\n focused: PropTypes.bool\n })\n ),\n skillsBaseUrl: PropTypes.string,\n onSkillClick: PropTypes.func\n};\n\nexport default DisciplineAssociatedSkills;\n"],"mappings":"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"}
|
|
@@ -63,6 +63,7 @@ declare namespace DraggableList {
|
|
|
63
63
|
title: PropTypes.Validator<string>;
|
|
64
64
|
subtitle: PropTypes.Requireable<string>;
|
|
65
65
|
selected: PropTypes.Requireable<boolean>;
|
|
66
|
+
selectedColor: PropTypes.Requireable<string>;
|
|
66
67
|
dataColumns: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
67
68
|
label: PropTypes.Requireable<string>;
|
|
68
69
|
type: PropTypes.Requireable<string>;
|
|
@@ -64,6 +64,7 @@ declare const ActionableExpandableTable: {
|
|
|
64
64
|
lastField: import("prop-types").Requireable<NonNullable<import("prop-types").InferProps<{
|
|
65
65
|
componentType: import("prop-types").Requireable<string>;
|
|
66
66
|
type: import("prop-types").Requireable<string>;
|
|
67
|
+
usage: import("prop-types").Requireable<string>;
|
|
67
68
|
label: import("prop-types").Requireable<string>;
|
|
68
69
|
content: import("prop-types").Requireable<import("prop-types").ReactNodeLike>;
|
|
69
70
|
'aria-label': import("prop-types").Requireable<string>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandible-actionable-table/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAOjE,OAAO,EAA2C,KAAK,EAAY,MAAM,SAAS,CAAC;AAqCnF,QAAA,MAAM,yBAAyB;YAAW,KAAK,iBAAiB,gBAAgB
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandible-actionable-table/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAOjE,OAAO,EAA2C,KAAK,EAAY,MAAM,SAAS,CAAC;AAqCnF,QAAA,MAAM,yBAAyB;YAAW,KAAK,iBAAiB,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoL/E,CAAC;AASF,eAAe,yBAAyB,CAAC"}
|
|
@@ -41,6 +41,7 @@ export declare const propTypes: {
|
|
|
41
41
|
lastField: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
|
|
42
42
|
componentType: PropTypes.Requireable<string>;
|
|
43
43
|
type: PropTypes.Requireable<string>;
|
|
44
|
+
usage: PropTypes.Requireable<string>;
|
|
44
45
|
label: PropTypes.Requireable<string>;
|
|
45
46
|
content: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
46
47
|
'aria-label': PropTypes.Requireable<string>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandible-actionable-table/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,OAAO,EAAC,0BAA0B,EAAC,MAAM,mCAAmC,CAAC;AAC7E,OAAO,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAC,KAAK,IAAI,gBAAgB,EAAC,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAC,KAAK,IAAI,oBAAoB,EAAC,MAAM,4BAA4B,CAAC;AA0BzE,eAAO,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandible-actionable-table/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,OAAO,EAAC,0BAA0B,EAAC,MAAM,mCAAmC,CAAC;AAC7E,OAAO,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAC,KAAK,IAAI,gBAAgB,EAAC,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAC,KAAK,IAAI,oBAAoB,EAAC,MAAM,4BAA4B,CAAC;AA0BzE,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoBrB,CAAC;AAEF,oBAAY,KAAK,GACb,MAAM,GACN,CAAC,eAAe,GAAG;IACjB,aAAa,EAAE,QAAQ,CAAC;CACzB,CAAC,GACF,CAAC,oBAAoB,GAAG;IACtB,aAAa,EAAE,cAAc,CAAC;CAC/B,CAAC,CAAC;AAEP,oBAAY,SAAS,GACjB,CAAC,eAAe,GAAG;IACjB,aAAa,EAAE,aAAa,CAAC;CAC9B,CAAC,GACF,CAAC,0BAA0B,GAAG;IAC5B,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC,CAAC;AAEP,oBAAY,SAAS,GACjB,CAAC,gBAAgB,GAAG;IAClB,aAAa,EAAE,cAAc,CAAC;CAC/B,CAAC,GACF,CAAC,KAAK,GAAG;IACP,aAAa,EAAE,yBAAyB,CAAC;CAC1C,CAAC,CAAC;AAEP,oBAAY,MAAM,GAAG;IAAC,KAAK,EAAE,MAAM,CAAA;CAAC,CAAC;AACrC,oBAAY,GAAG,GAAG;IAChB,MAAM,EAAE,KAAK,EAAE,CAAC;IAEhB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AACF,oBAAY,OAAO,GAAG,MAAM,EAAE,CAAC;AAC/B,oBAAY,IAAI,GAAG,GAAG,EAAE,CAAC;AAEzB,oBAAY,KAAK,GAAG;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,GAAG,MAAM,GAAG,IAAI,GAAG,GAAG,EAAE,CAAC;IACvC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC,CAAC;AAEF,oBAAY,WAAW,GAAG;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-modal/index.js"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-modal/index.js"],"names":[],"mappings":";AA2DA,qFA0KC"}
|
|
@@ -7,8 +7,6 @@ var _pick2 = _interopRequireDefault(require("lodash/fp/pick"));
|
|
|
7
7
|
|
|
8
8
|
var _assign2 = _interopRequireDefault(require("lodash/fp/assign"));
|
|
9
9
|
|
|
10
|
-
var _get2 = _interopRequireDefault(require("lodash/fp/get"));
|
|
11
|
-
|
|
12
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
13
11
|
|
|
14
12
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
@@ -31,6 +29,8 @@ var _searchForm = _interopRequireDefault(require("../search-form"));
|
|
|
31
29
|
|
|
32
30
|
var _searchValueIncluded = _interopRequireDefault(require("../../util/search-value-included"));
|
|
33
31
|
|
|
32
|
+
var _colors = require("../../variables/colors");
|
|
33
|
+
|
|
34
34
|
var _style = _interopRequireDefault(require("./style.css"));
|
|
35
35
|
|
|
36
36
|
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); }
|
|
@@ -41,17 +41,14 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
41
41
|
|
|
42
42
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
43
43
|
|
|
44
|
-
const FilterButton =
|
|
44
|
+
const FilterButton = props => {
|
|
45
45
|
const {
|
|
46
46
|
active,
|
|
47
47
|
filter,
|
|
48
48
|
itemTotal,
|
|
49
49
|
onClick
|
|
50
50
|
} = props;
|
|
51
|
-
const
|
|
52
|
-
skin
|
|
53
|
-
} = context;
|
|
54
|
-
const primarySkinColor = (0, _get2.default)('common.primary', skin);
|
|
51
|
+
const primarySkinColor = _colors.COLORS.cm_primary_blue;
|
|
55
52
|
const Content = (0, _react.useCallback)(() => /*#__PURE__*/_react.default.createElement("div", null, filter, /*#__PURE__*/_react.default.createElement("span", {
|
|
56
53
|
className: active ? _style.default.skillFilterNumber : _style.default.skillFilterNumberInActive,
|
|
57
54
|
style: {
|
|
@@ -73,10 +70,6 @@ const FilterButton = (props, context) => {
|
|
|
73
70
|
return /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonProps);
|
|
74
71
|
};
|
|
75
72
|
|
|
76
|
-
FilterButton.contextTypes = {
|
|
77
|
-
skin: _provider.default.childContextTypes.skin,
|
|
78
|
-
translate: _provider.default.childContextTypes.translate
|
|
79
|
-
};
|
|
80
73
|
FilterButton.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
81
74
|
active: _propTypes.default.bool,
|
|
82
75
|
filter: _propTypes.default.string,
|
|
@@ -148,10 +141,11 @@ const LearningPriorityModal = (props, context) => {
|
|
|
148
141
|
},
|
|
149
142
|
label: translate('add'),
|
|
150
143
|
iconName: 'plus',
|
|
151
|
-
disabled: isLoading || !selectedPriority
|
|
144
|
+
disabled: isLoading || !selectedPriority,
|
|
145
|
+
color: _colors.COLORS.cm_primary_blue
|
|
152
146
|
}
|
|
153
147
|
};
|
|
154
|
-
}, [handleCancel, setSelectedPriority, setSelectedPriorityType, onAdd, translate, selectedPriority, selectedPriorityType, isLoading]);
|
|
148
|
+
}, [handleCancel, setSelectedPriority, setSelectedPriorityType, onAdd, onClose, translate, selectedPriority, selectedPriorityType, isLoading]);
|
|
155
149
|
if (!isLoading && !priorities || !isOpen) return null;
|
|
156
150
|
return /*#__PURE__*/_react.default.createElement(_baseModal.default, {
|
|
157
151
|
title: translate('learning_priority_modal_title'),
|
|
@@ -222,12 +216,13 @@ const LearningPriorityModal = (props, context) => {
|
|
|
222
216
|
setSelectedPriorityType(type);
|
|
223
217
|
}
|
|
224
218
|
|
|
225
|
-
if (filterValue !== 'all' && type !== filterValue) return null;
|
|
219
|
+
if (filterValue !== 'all' && type !== filterValue || !type || !title) return null;
|
|
226
220
|
return /*#__PURE__*/_react.default.createElement(_listItem.default, _extends({}, courses !== null ? {
|
|
227
221
|
subtitle: `${courses} ${translate('courses')}`
|
|
228
222
|
} : {}, {
|
|
229
223
|
title: title,
|
|
230
224
|
selected: selected || selectedPriority === priorityRef,
|
|
225
|
+
selectedColor: _colors.COLORS.cm_primary_blue,
|
|
231
226
|
disabled: disabled,
|
|
232
227
|
onClick: handlePriorityClick,
|
|
233
228
|
tags: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["FilterButton","props","context","active","filter","itemTotal","onClick","skin","primarySkinColor","Content","useCallback","style","skillFilterNumber","skillFilterNumberInActive","backgroundColor","convert","color","buttonProps","customStyle","transition","width","content","contextTypes","Provider","childContextTypes","translate","propTypes","PropTypes","bool","string","number","func","LearningPriorityModal","priorities","preselected","isOpen","isLoading","filters","onCancel","onAdd","onClose","selectedPriority","setSelectedPriority","useState","selectedPriorityType","setSelectedPriorityType","searchValue","setSearchValue","filterValue","setFilterValue","searchResults","setSearchResults","handleCancel","handleClose","handleSearch","value","priority","searchValueIncluded","title","handleSearchReset","useEffect","priorityList","useMemo","map","isPreSelectedPriority","some","selected","priorityRef","disabled","footer","cancelButton","label","confirmButton","onConfirm","iconName","LearningPriorityContainer","loaderContainer","loader","searchWrapper","placeholder","onChange","filterWrapper","length","index","name","count","handleChange","filterButtonWrapper","priorityListWrapper","courses","type","handlePriorityClick","subtitle","arrayOf","shape","oneOf","SelectOptionPropTypes"],"sources":["../../../src/molecule/learning-priority-modal/index.js"],"sourcesContent":["import React, {useEffect, useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, assign, pick} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport BaseModal from '../base-modal';\nimport ListItem from '../../organism/list-item';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport Provider from '../../atom/provider';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport SearchForm from '../search-form';\nimport searchValueIncluded from '../../util/search-value-included';\nimport style from './style.css';\n\nconst FilterButton = (props, context) => {\n const {active, filter, itemTotal, onClick} = props;\n const {skin} = context;\n const primarySkinColor = get('common.primary', skin);\n\n const Content = useCallback(\n () => (\n <div>\n {filter}\n <span\n className={active ? style.skillFilterNumber : style.skillFilterNumberInActive}\n style={{\n backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : '#EAEAEB',\n color: active ? primarySkinColor : '#515161'\n }}\n >\n {itemTotal}\n </span>\n </div>\n ),\n [filter, itemTotal, active, primarySkinColor]\n );\n\n const buttonProps = {\n customStyle: {\n backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : 'transparent',\n color: active ? primarySkinColor : '#9999A8',\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n width: 'fit-content'\n },\n onClick,\n content: <Content />,\n 'data-name': 'change-skill-focus-button'\n };\n\n return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nFilterButton.propTypes = {\n active: PropTypes.bool,\n filter: PropTypes.string,\n itemTotal: PropTypes.number,\n onClick: PropTypes.func\n};\n\nconst LearningPriorityModal = (props, context) => {\n const {priorities, preselected, isOpen, isLoading, filters, onCancel, onAdd, onClose} = props;\n const {translate} = context;\n\n const [selectedPriority, setSelectedPriority] = useState('');\n const [selectedPriorityType, setSelectedPriorityType] = useState('');\n const [searchValue, setSearchValue] = useState('');\n const [filterValue, setFilterValue] = useState('all');\n const [searchResults, setSearchResults] = useState(priorities);\n\n const handleCancel = useCallback(() => {\n setSelectedPriority('');\n setSelectedPriorityType('');\n onCancel();\n }, [setSelectedPriority, setSelectedPriorityType, onCancel]);\n\n const handleClose = useCallback(() => {\n setSelectedPriority('');\n setSelectedPriorityType('');\n onClose();\n }, [setSelectedPriority, setSelectedPriorityType, onClose]);\n\n const handleSearch = useCallback(\n value => {\n setSearchValue(value);\n setSearchResults(priorities.filter(priority => searchValueIncluded(priority.title, value)));\n },\n [priorities, setSearchValue, setSearchResults]\n );\n\n const handleSearchReset = useCallback(() => {\n setSearchValue('');\n setSearchResults(priorities);\n }, [priorities, setSearchValue, setSearchResults]);\n\n useEffect(() => {\n setSearchResults(priorities);\n }, [priorities]);\n\n const priorityList = useMemo(() => {\n return searchResults.map(priority => {\n const isPreSelectedPriority = preselected.some(selected => selected === priority.priorityRef);\n return assign(\n {\n selected: isPreSelectedPriority,\n disabled: isPreSelectedPriority\n },\n pick(['title', 'priorityRef', 'type', 'courses'], priority)\n );\n });\n }, [searchResults, preselected]);\n\n const footer = useMemo(() => {\n return {\n cancelButton: {\n onCancel: handleCancel,\n label: translate('cancel')\n },\n confirmButton: {\n onConfirm: () => {\n onAdd(selectedPriority, selectedPriorityType);\n setSelectedPriority('');\n setSelectedPriorityType('');\n onClose();\n },\n label: translate('add'),\n iconName: 'plus',\n disabled: isLoading || !selectedPriority\n }\n };\n }, [\n handleCancel,\n setSelectedPriority,\n setSelectedPriorityType,\n onAdd,\n translate,\n selectedPriority,\n selectedPriorityType,\n isLoading\n ]);\n\n if ((!isLoading && !priorities) || !isOpen) return null;\n\n return (\n <BaseModal\n title={translate('learning_priority_modal_title')}\n description={translate('learning_priority_modal_description')}\n isOpen={isOpen}\n onClose={handleClose}\n footer={footer}\n >\n <div className={style.LearningPriorityContainer}>\n {isLoading ? (\n <div className={style.loaderContainer}>\n <Loader className={style.loader} theme=\"coorpmanager\" />\n </div>\n ) : (\n <>\n <div className={style.searchWrapper}>\n <SearchForm\n search={{\n placeholder: translate('search_priority_place_holder'),\n value: searchValue,\n onChange: handleSearch\n }}\n onReset={handleSearchReset}\n />\n </div>\n <div className={style.filterWrapper}>\n {searchResults.length > 0\n ? filters.map((filter, index) => {\n const {name, value, count} = filter;\n\n function handleChange() {\n setFilterValue(value);\n handleSearchReset();\n }\n\n if (count === 0) return null;\n\n return (\n <div key={index} className={style.filterButtonWrapper}>\n <FilterButton\n active={filterValue === value}\n filter={name}\n onClick={handleChange}\n itemTotal={count}\n />\n </div>\n );\n })\n : null}\n </div>\n <div className={style.priorityListWrapper}>\n {priorityList.map(priority => {\n const {title, priorityRef, courses = null, type, selected, disabled} = priority;\n function handlePriorityClick() {\n if (selectedPriority === priorityRef) {\n setSelectedPriority('');\n setSelectedPriorityType('');\n return;\n }\n setSelectedPriority(priorityRef);\n setSelectedPriorityType(type);\n }\n\n if (filterValue !== 'all' && type !== filterValue) return null;\n\n return (\n <ListItem\n {...(courses !== null ? {subtitle: `${courses} ${translate('courses')}`} : {})}\n title={title}\n selected={selected || selectedPriority === priorityRef}\n disabled={disabled}\n onClick={handlePriorityClick}\n tags={[{label: type, type: 'default'}]}\n key={priorityRef}\n backgroundColor=\"skin\"\n />\n );\n })}\n </div>\n </>\n )}\n </div>\n </BaseModal>\n );\n};\n\nLearningPriorityModal.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nLearningPriorityModal.propTypes = {\n priorities: PropTypes.arrayOf(\n PropTypes.shape({\n priorityRef: PropTypes.string,\n title: PropTypes.string,\n courses: PropTypes.number,\n type: PropTypes.oneOf(['skill', 'playlist', 'certificate'])\n })\n ),\n preselected: PropTypes.arrayOf(PropTypes.string),\n isOpen: PropTypes.bool,\n isLoading: PropTypes.bool,\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n ...SelectOptionPropTypes,\n count: PropTypes.number\n })\n ),\n onCancel: PropTypes.func,\n onAdd: PropTypes.func,\n onClose: PropTypes.func\n};\n\nexport default LearningPriorityModal;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["FilterButton","props","active","filter","itemTotal","onClick","primarySkinColor","COLORS","cm_primary_blue","Content","useCallback","style","skillFilterNumber","skillFilterNumberInActive","backgroundColor","convert","color","buttonProps","customStyle","transition","width","content","propTypes","PropTypes","bool","string","number","func","LearningPriorityModal","context","priorities","preselected","isOpen","isLoading","filters","onCancel","onAdd","onClose","translate","selectedPriority","setSelectedPriority","useState","selectedPriorityType","setSelectedPriorityType","searchValue","setSearchValue","filterValue","setFilterValue","searchResults","setSearchResults","handleCancel","handleClose","handleSearch","value","priority","searchValueIncluded","title","handleSearchReset","useEffect","priorityList","useMemo","map","isPreSelectedPriority","some","selected","priorityRef","disabled","footer","cancelButton","label","confirmButton","onConfirm","iconName","LearningPriorityContainer","loaderContainer","loader","searchWrapper","placeholder","onChange","filterWrapper","length","index","name","count","handleChange","filterButtonWrapper","priorityListWrapper","courses","type","handlePriorityClick","subtitle","contextTypes","Provider","childContextTypes","arrayOf","shape","oneOf","SelectOptionPropTypes"],"sources":["../../../src/molecule/learning-priority-modal/index.js"],"sourcesContent":["import React, {useEffect, useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {assign, pick} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport BaseModal from '../base-modal';\nimport ListItem from '../../organism/list-item';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport Provider from '../../atom/provider';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport SearchForm from '../search-form';\nimport searchValueIncluded from '../../util/search-value-included';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\n\nconst FilterButton = props => {\n const {active, filter, itemTotal, onClick} = props;\n const primarySkinColor = COLORS.cm_primary_blue;\n\n const Content = useCallback(\n () => (\n <div>\n {filter}\n <span\n className={active ? style.skillFilterNumber : style.skillFilterNumberInActive}\n style={{\n backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : '#EAEAEB',\n color: active ? primarySkinColor : '#515161'\n }}\n >\n {itemTotal}\n </span>\n </div>\n ),\n [filter, itemTotal, active, primarySkinColor]\n );\n\n const buttonProps = {\n customStyle: {\n backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : 'transparent',\n color: active ? primarySkinColor : '#9999A8',\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n width: 'fit-content'\n },\n onClick,\n content: <Content />,\n 'data-name': 'change-skill-focus-button'\n };\n\n return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.propTypes = {\n active: PropTypes.bool,\n filter: PropTypes.string,\n itemTotal: PropTypes.number,\n onClick: PropTypes.func\n};\n\nconst LearningPriorityModal = (props, context) => {\n const {priorities, preselected, isOpen, isLoading, filters, onCancel, onAdd, onClose} = props;\n const {translate} = context;\n\n const [selectedPriority, setSelectedPriority] = useState('');\n const [selectedPriorityType, setSelectedPriorityType] = useState('');\n const [searchValue, setSearchValue] = useState('');\n const [filterValue, setFilterValue] = useState('all');\n const [searchResults, setSearchResults] = useState(priorities);\n\n const handleCancel = useCallback(() => {\n setSelectedPriority('');\n setSelectedPriorityType('');\n onCancel();\n }, [setSelectedPriority, setSelectedPriorityType, onCancel]);\n\n const handleClose = useCallback(() => {\n setSelectedPriority('');\n setSelectedPriorityType('');\n onClose();\n }, [setSelectedPriority, setSelectedPriorityType, onClose]);\n\n const handleSearch = useCallback(\n value => {\n setSearchValue(value);\n setSearchResults(priorities.filter(priority => searchValueIncluded(priority.title, value)));\n },\n [priorities, setSearchValue, setSearchResults]\n );\n\n const handleSearchReset = useCallback(() => {\n setSearchValue('');\n setSearchResults(priorities);\n }, [priorities, setSearchValue, setSearchResults]);\n\n useEffect(() => {\n setSearchResults(priorities);\n }, [priorities]);\n\n const priorityList = useMemo(() => {\n return searchResults.map(priority => {\n const isPreSelectedPriority = preselected.some(selected => selected === priority.priorityRef);\n return assign(\n {\n selected: isPreSelectedPriority,\n disabled: isPreSelectedPriority\n },\n pick(['title', 'priorityRef', 'type', 'courses'], priority)\n );\n });\n }, [searchResults, preselected]);\n\n const footer = useMemo(() => {\n return {\n cancelButton: {\n onCancel: handleCancel,\n label: translate('cancel')\n },\n confirmButton: {\n onConfirm: () => {\n onAdd(selectedPriority, selectedPriorityType);\n setSelectedPriority('');\n setSelectedPriorityType('');\n onClose();\n },\n label: translate('add'),\n iconName: 'plus',\n disabled: isLoading || !selectedPriority,\n color: COLORS.cm_primary_blue\n }\n };\n }, [\n handleCancel,\n setSelectedPriority,\n setSelectedPriorityType,\n onAdd,\n onClose,\n translate,\n selectedPriority,\n selectedPriorityType,\n isLoading\n ]);\n\n if ((!isLoading && !priorities) || !isOpen) return null;\n\n return (\n <BaseModal\n title={translate('learning_priority_modal_title')}\n description={translate('learning_priority_modal_description')}\n isOpen={isOpen}\n onClose={handleClose}\n footer={footer}\n >\n <div className={style.LearningPriorityContainer}>\n {isLoading ? (\n <div className={style.loaderContainer}>\n <Loader className={style.loader} theme=\"coorpmanager\" />\n </div>\n ) : (\n <>\n <div className={style.searchWrapper}>\n <SearchForm\n search={{\n placeholder: translate('search_priority_place_holder'),\n value: searchValue,\n onChange: handleSearch\n }}\n onReset={handleSearchReset}\n />\n </div>\n <div className={style.filterWrapper}>\n {searchResults.length > 0\n ? filters.map((filter, index) => {\n const {name, value, count} = filter;\n\n function handleChange() {\n setFilterValue(value);\n handleSearchReset();\n }\n\n if (count === 0) return null;\n\n return (\n <div key={index} className={style.filterButtonWrapper}>\n <FilterButton\n active={filterValue === value}\n filter={name}\n onClick={handleChange}\n itemTotal={count}\n />\n </div>\n );\n })\n : null}\n </div>\n <div className={style.priorityListWrapper}>\n {priorityList.map(priority => {\n const {title, priorityRef, courses = null, type, selected, disabled} = priority;\n function handlePriorityClick() {\n if (selectedPriority === priorityRef) {\n setSelectedPriority('');\n setSelectedPriorityType('');\n return;\n }\n setSelectedPriority(priorityRef);\n setSelectedPriorityType(type);\n }\n\n if ((filterValue !== 'all' && type !== filterValue) || !type || !title) return null;\n\n return (\n <ListItem\n {...(courses !== null ? {subtitle: `${courses} ${translate('courses')}`} : {})}\n title={title}\n selected={selected || selectedPriority === priorityRef}\n selectedColor={COLORS.cm_primary_blue}\n disabled={disabled}\n onClick={handlePriorityClick}\n tags={[{label: type, type: 'default'}]}\n key={priorityRef}\n backgroundColor=\"skin\"\n />\n );\n })}\n </div>\n </>\n )}\n </div>\n </BaseModal>\n );\n};\n\nLearningPriorityModal.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nLearningPriorityModal.propTypes = {\n priorities: PropTypes.arrayOf(\n PropTypes.shape({\n priorityRef: PropTypes.string,\n title: PropTypes.string,\n courses: PropTypes.number,\n type: PropTypes.oneOf(['skill', 'playlist', 'certificate'])\n })\n ),\n preselected: PropTypes.arrayOf(PropTypes.string),\n isOpen: PropTypes.bool,\n isLoading: PropTypes.bool,\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n ...SelectOptionPropTypes,\n count: PropTypes.number\n })\n ),\n onCancel: PropTypes.func,\n onAdd: PropTypes.func,\n onClose: PropTypes.func\n};\n\nexport default LearningPriorityModal;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-setup-item/index.js"],"names":[],"mappings":";AAOA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-setup-item/index.js"],"names":[],"mappings":";AAOA,kFAyDC"}
|
|
@@ -34,7 +34,7 @@ const LearningPrioritySetupItem = (props, context) => {
|
|
|
34
34
|
const {
|
|
35
35
|
translate
|
|
36
36
|
} = context;
|
|
37
|
-
const handleRemovePriority = (0, _react.useCallback)(() => onRemove(priorityRef, type), [priorityRef, type]);
|
|
37
|
+
const handleRemovePriority = (0, _react.useCallback)(() => onRemove(priorityRef, type), [priorityRef, type, onRemove]);
|
|
38
38
|
|
|
39
39
|
const handleTypeTranslate = itemType => {
|
|
40
40
|
switch (itemType) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["LearningPrioritySetupItem","props","context","priorityRef","id","title","courses","type","ariaLabel","onRemove","translate","handleRemovePriority","useCallback","handleTypeTranslate","itemType","style","container","containerInfos","titleWrapper","width","backgroundColor","position","faIcon","name","color","size","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","number","oneOf","func"],"sources":["../../../src/molecule/learning-priority-setup-item/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport Provider from '../../atom/provider';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst LearningPrioritySetupItem = (props, context) => {\n const {priorityRef, id, title, courses = null, type, 'aria-label': ariaLabel, onRemove} = props;\n\n const {translate} = context;\n\n const handleRemovePriority = useCallback(() => onRemove(priorityRef, type)
|
|
1
|
+
{"version":3,"file":"index.js","names":["LearningPrioritySetupItem","props","context","priorityRef","id","title","courses","type","ariaLabel","onRemove","translate","handleRemovePriority","useCallback","handleTypeTranslate","itemType","style","container","containerInfos","titleWrapper","width","backgroundColor","position","faIcon","name","color","size","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","number","oneOf","func"],"sources":["../../../src/molecule/learning-priority-setup-item/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport Provider from '../../atom/provider';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst LearningPrioritySetupItem = (props, context) => {\n const {priorityRef, id, title, courses = null, type, 'aria-label': ariaLabel, onRemove} = props;\n\n const {translate} = context;\n\n const handleRemovePriority = useCallback(\n () => onRemove(priorityRef, type),\n [priorityRef, type, onRemove]\n );\n\n const handleTypeTranslate = itemType => {\n switch (itemType) {\n case 'skill':\n return translate('skill');\n case 'playlist':\n return translate('playlist');\n case 'certificate':\n return translate('certificate');\n }\n };\n\n return (\n <div\n className={style.container}\n aria-label={ariaLabel}\n data-name={`learning-priority-setup-item-${id}`}\n >\n <div className={style.containerInfos}>\n <div className={style.titleWrapper}>\n <div className={style.title}>{title}</div>\n <div>\n <Tag label={handleTypeTranslate(type)} size={'S'} />\n </div>\n </div>\n {courses !== null ? (\n <span className={style.courses}>{`${courses} ${translate('courses')}`}</span>\n ) : null}\n </div>\n <ButtonLink\n type=\"primary\"\n customStyle={{\n width: 'fit-content',\n backgroundColor: 'transparent'\n }}\n hoverBackgroundColor=\"#EAEAEB\"\n icon={{\n position: 'left',\n faIcon: {\n name: 'trash',\n color: '#515161',\n size: 16\n }\n }}\n onClick={handleRemovePriority}\n />\n </div>\n );\n};\n\nLearningPrioritySetupItem.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nLearningPrioritySetupItem.propTypes = {\n 'aria-label': PropTypes.string,\n id: PropTypes.string,\n priorityRef: PropTypes.string,\n title: PropTypes.string,\n courses: PropTypes.number,\n type: PropTypes.oneOf(['skill', 'playlist', 'certificate']),\n onRemove: PropTypes.func\n};\n\nexport default LearningPrioritySetupItem;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,MAAMA,yBAAyB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACpD,MAAM;IAACC,WAAD;IAAcC,EAAd;IAAkBC,KAAlB;IAAyBC,OAAO,GAAG,IAAnC;IAAyCC,IAAzC;IAA+C,cAAcC,SAA7D;IAAwEC;EAAxE,IAAoFR,KAA1F;EAEA,MAAM;IAACS;EAAD,IAAcR,OAApB;EAEA,MAAMS,oBAAoB,GAAG,IAAAC,kBAAA,EAC3B,MAAMH,QAAQ,CAACN,WAAD,EAAcI,IAAd,CADa,EAE3B,CAACJ,WAAD,EAAcI,IAAd,EAAoBE,QAApB,CAF2B,CAA7B;;EAKA,MAAMI,mBAAmB,GAAGC,QAAQ,IAAI;IACtC,QAAQA,QAAR;MACE,KAAK,OAAL;QACE,OAAOJ,SAAS,CAAC,OAAD,CAAhB;;MACF,KAAK,UAAL;QACE,OAAOA,SAAS,CAAC,UAAD,CAAhB;;MACF,KAAK,aAAL;QACE,OAAOA,SAAS,CAAC,aAAD,CAAhB;IANJ;EAQD,CATD;;EAWA,oBACE;IACE,SAAS,EAAEK,cAAA,CAAMC,SADnB;IAEE,cAAYR,SAFd;IAGE,aAAY,gCAA+BJ,EAAG;EAHhD,gBAKE;IAAK,SAAS,EAAEW,cAAA,CAAME;EAAtB,gBACE;IAAK,SAAS,EAAEF,cAAA,CAAMG;EAAtB,gBACE;IAAK,SAAS,EAAEH,cAAA,CAAMV;EAAtB,GAA8BA,KAA9B,CADF,eAEE,uDACE,6BAAC,YAAD;IAAK,KAAK,EAAEQ,mBAAmB,CAACN,IAAD,CAA/B;IAAuC,IAAI,EAAE;EAA7C,EADF,CAFF,CADF,EAOGD,OAAO,KAAK,IAAZ,gBACC;IAAM,SAAS,EAAES,cAAA,CAAMT;EAAvB,GAAkC,GAAEA,OAAQ,IAAGI,SAAS,CAAC,SAAD,CAAY,EAApE,CADD,GAEG,IATN,CALF,eAgBE,6BAAC,mBAAD;IACE,IAAI,EAAC,SADP;IAEE,WAAW,EAAE;MACXS,KAAK,EAAE,aADI;MAEXC,eAAe,EAAE;IAFN,CAFf;IAME,oBAAoB,EAAC,SANvB;IAOE,IAAI,EAAE;MACJC,QAAQ,EAAE,MADN;MAEJC,MAAM,EAAE;QACNC,IAAI,EAAE,OADA;QAENC,KAAK,EAAE,SAFD;QAGNC,IAAI,EAAE;MAHA;IAFJ,CAPR;IAeE,OAAO,EAAEd;EAfX,EAhBF,CADF;AAoCD,CAzDD;;AA2DAX,yBAAyB,CAAC0B,YAA1B,GAAyC;EACvChB,SAAS,EAAEiB,iBAAA,CAASC,iBAAT,CAA2BlB;AADC,CAAzC;AAIAV,yBAAyB,CAAC6B,SAA1B,2CAAsC;EACpC,cAAcC,kBAAA,CAAUC,MADY;EAEpC3B,EAAE,EAAE0B,kBAAA,CAAUC,MAFsB;EAGpC5B,WAAW,EAAE2B,kBAAA,CAAUC,MAHa;EAIpC1B,KAAK,EAAEyB,kBAAA,CAAUC,MAJmB;EAKpCzB,OAAO,EAAEwB,kBAAA,CAAUE,MALiB;EAMpCzB,IAAI,EAAEuB,kBAAA,CAAUG,KAAV,CAAgB,CAAC,OAAD,EAAU,UAAV,EAAsB,aAAtB,CAAhB,CAN8B;EAOpCxB,QAAQ,EAAEqB,kBAAA,CAAUI;AAPgB,CAAtC;eAUelC,yB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-profile-radar-chart/index.tsx"],"names":[],"mappings":";AAiCA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AACjE,OAAO,EAGL,gBAAgB,EAChB,kCAAkC,EAGnC,MAAM,SAAS,CAAC;AAmUjB,eAAO,MAAM,UAAU,EAAE,CACvB,MAAM,EAAE;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;CAAC,EAC/B,KAAK,EAAE,kCAAkC,CAAC,MAAM,CAAC,KAC9C,gBAAgB,EAOX,CAAC;AAEX,eAAO,MAAM,yBAAyB;0GAWjC,kCAAkC,iBACtB,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-profile-radar-chart/index.tsx"],"names":[],"mappings":";AAiCA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AACjE,OAAO,EAGL,gBAAgB,EAChB,kCAAkC,EAGnC,MAAM,SAAS,CAAC;AAmUjB,eAAO,MAAM,UAAU,EAAE,CACvB,MAAM,EAAE;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;CAAC,EAC/B,KAAK,EAAE,kCAAkC,CAAC,MAAM,CAAC,KAC9C,gBAAgB,EAOX,CAAC;AAEX,eAAO,MAAM,yBAAyB;0GAWjC,kCAAkC,iBACtB,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqJhC,CAAC;AAEF,QAAA,MAAM,mCAAmC;YAAW,kCAAkC;;;;;;;;;;;;;;;;;;;;;;;;CAIrF,CAAC;AAUF,eAAe,mCAAmC,CAAC"}
|
|
@@ -405,8 +405,6 @@ const LearningProfileRadarChart = ({
|
|
|
405
405
|
}, [isMobile_]);
|
|
406
406
|
(0, _react.useEffect)(() => setIsMobile_(), [setIsMobile_]);
|
|
407
407
|
(0, _react.useEffect)(() => {
|
|
408
|
-
console.log('LearningProfileRadarChart mounted');
|
|
409
|
-
|
|
410
408
|
const handleClick = () => {
|
|
411
409
|
setActiveDot(undefined);
|
|
412
410
|
onClick(undefined);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["top","offset","x","y","alignment","margin","bottom","right","marginRight","left","marginLeft","BLACK","WHITE","DEFAULT_MAIN_COLOR","DEFAULT_COLORS","gradient","fill","stroke","percentage","color","background","label","CHART_CONFIGS","triangle","name","ticks","sideCount","quadrilateral","pentagon","hexagon","DOT_DEFAULT_PROPS","strokeWidth","strokeOpacity","r","pointerEvents","style","cursor","DOT_ACTIVE_PROPS","RADAR_DEFAULT_PROPS","fillOpacity","Gradient","type","colors","firstColor","secondColor","CustomTooltip","active","payload","length","tooltip","tooltipLabel","tooltipValue","value","CustomDot","cx","cy","onDotHover","onDotClick","activeDot","dataName","subject","onTouchStart","onClick","e","stopPropagation","onMouseOver","onMouseLeave","buildRadars","totalDataset","handleDotHover","handleOnDotClick","index","datakey","dataset","CustomLabel","percentagesValues","chartType","formatedColors","primarySkinColor","exploreLocale","hoveredDot","onExploreClick","hovered","setHovered","useState","isCurrentDotActive","offsetX","offsetY","rest","onLabelClick","handleExploreClick","buttonExploreProps","customStyle","height","backgroundColor","convert","transition","icon","position","faIcon","size","handleMouseOver","useCallback","handleMouseLeave","extraOffsetY","tickeForeignObject","classnames","tickWrapper","tickWrapperFocus","tickWrapperHover","alignItems","textAlign","opacity","map","colorLabel","i","tickValue","tickLabel","buttonWrapper","CHART_CONFIGS_BY_SIDE_COUNT","formatValues","values_","val","formatData","legend","data_","ref","LearningProfileRadarChart","data","colorsProps","width","legacyContext","isMobile","setIsMobile","setActiveDot","setHoveredDot","skin","GetSkinFromContext","translate","GetTranslateFromContext","Object","assign","useMemo","gradients","userAgent","navigator","isMobile_","getIsMobile","setIsMobile_","useEffect","console","log","handleClick","undefined","window","addEventListener","removeEventListener","handleOnActiveDotClick","formatedData","find","indexOf","skillRef","key","renderCustomLabel","props","currentData","ResponsiveLearningProfileRadarChart","contextTypes","Provider","childContextTypes","propTypes","learningProfileRadarChartPropTypes"],"sources":["../../../src/molecule/learning-profile-radar-chart/index.tsx"],"sourcesContent":["import React, {Fragment, useCallback, useEffect, useMemo, useState} from 'react';\nimport {\n Radar,\n RadarChart,\n PolarGrid,\n PolarAngleAxis,\n ResponsiveContainer,\n Tooltip,\n PolarRadiusAxis\n} from 'recharts';\nimport {\n pipe,\n keyBy,\n mapValues,\n size,\n getOr,\n map,\n toPairs,\n values,\n isEmpty,\n omit,\n fromPairs,\n times,\n flatten,\n findKey,\n get\n} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport classnames from 'classnames';\nimport {isMobile as getIsMobile} from '../../util/check-is-mobile';\nimport ButtonLink from '../../atom/button-link';\nimport {ButtonLinkProps} from '../../atom/button-link/types';\nimport Provider, {GetSkinFromContext, GetTranslateFromContext} from '../../atom/provider';\nimport {WebContextValues} from '../../atom/provider/web-context';\nimport {\n ActiveDotType,\n FormatedColorsType,\n FormatedDataType,\n LearningProfileRadarChartPropTypes,\n TickType,\n learningProfileRadarChartPropTypes\n} from './types';\nimport style from './style.css';\n\ntype CHART_TYPE_TYPE = keyof typeof CHART_CONFIGS;\n\n/* TICK_POSITIONS */\nconst top: TickType = {offset: {x: -100, y: -75}, alignment: 'center', margin: 'auto'};\nconst bottom: TickType = {offset: {x: -100, y: 10}, alignment: 'center', margin: 'auto'};\nconst right: TickType = {offset: {x: 30, y: -10}, alignment: 'start', marginRight: 'auto'};\nconst left: TickType = {offset: {x: -230, y: -10}, alignment: 'end', marginLeft: 'auto'};\n\n/* CONSTANTS */\nconst BLACK = '#000000ff';\nconst WHITE = '#ffffffff';\nconst DEFAULT_MAIN_COLOR = '#0062ffff';\n\nconst DEFAULT_COLORS: FormatedColorsType = {\n gradient: {\n fill: [DEFAULT_MAIN_COLOR, DEFAULT_MAIN_COLOR],\n stroke: [DEFAULT_MAIN_COLOR, DEFAULT_MAIN_COLOR]\n },\n percentage: {\n color: BLACK,\n background: WHITE\n },\n label: {\n color: BLACK\n }\n};\n\nconst CHART_CONFIGS = {\n triangle: {\n name: 'triangle',\n ticks: [top, right, left],\n sideCount: 3\n },\n quadrilateral: {\n name: 'quadrilateral',\n ticks: [top, right, bottom, left],\n sideCount: 4\n },\n pentagon: {\n name: 'pentagon',\n ticks: [top, right, right, left, left],\n sideCount: 5\n },\n hexagon: {\n name: 'hexagon',\n ticks: [top, right, right, bottom, left, left],\n sideCount: 6\n }\n} as const;\n\nconst DOT_DEFAULT_PROPS = {\n strokeWidth: 2,\n strokeOpacity: 0.4,\n fill: '#fff',\n r: 4,\n pointerEvents: 'all',\n style: {cursor: 'pointer'}\n} as const;\n\nconst DOT_ACTIVE_PROPS = {\n fill: '#fff',\n r: 6,\n strokeWidth: 4,\n strokeOpacity: 0.6\n} as const;\n\nconst RADAR_DEFAULT_PROPS = {\n strokeWidth: 3,\n strokeOpacity: 0.2,\n fillOpacity: 0.2\n} as const;\n\n/* COMPONENTS */\nconst Gradient = ({type, colors: [firstColor, secondColor]}: {type: string; colors: string[]}) => (\n <defs>\n <linearGradient id={`gradient-${type}`} x1=\"0%\" y1=\"0%\" x2=\"0%\" y2=\"100%\">\n <stop offset=\"0%\" stopColor={firstColor} />\n <stop offset=\"100%\" stopColor={secondColor} />\n </linearGradient>\n </defs>\n);\n\nconst CustomTooltip = ({\n active,\n payload,\n label\n}: {\n active?: boolean;\n payload?: {value: number}[];\n label?: string;\n}) =>\n active && !!payload?.length ? (\n <div className={style.tooltip}>\n <span className={style.tooltipLabel}>{label}</span>\n <span className={style.tooltipValue}>{payload[0].value}%</span>\n </div>\n ) : null;\n\nconst CustomDot = ({\n cx,\n cy,\n payload,\n onDotHover,\n onDotClick,\n stroke,\n activeDot,\n dataName\n}: {\n cx?: number;\n cy?: number;\n payload?: {payload: {subject: string} & {[datakey: string]: number}; name: string};\n onDotHover: (name: string) => void;\n onDotClick: (name: string) => void;\n dataKey: string;\n stroke: string;\n activeDot?: ActiveDotType;\n dataName: string;\n}) => (\n <circle\n {...{\n ...DOT_DEFAULT_PROPS,\n ...(payload?.payload.subject === activeDot?.label && DOT_ACTIVE_PROPS),\n stroke,\n cx,\n cy,\n onTouchStart: () => {\n if (!payload?.name) return;\n onDotClick(payload.name);\n },\n onClick: e => {\n e.stopPropagation();\n\n if (!payload?.name) return;\n onDotClick(payload.name);\n },\n onMouseOver: () => {\n if (!payload?.name) return;\n onDotHover(payload.name);\n },\n onMouseLeave: () => onDotHover(''),\n 'data-name': dataName\n }}\n />\n);\n\nconst buildRadars = (\n totalDataset: number,\n handleDotHover: (name: string) => void,\n handleOnDotClick: (name: string) => void,\n activeDot?: ActiveDotType\n) =>\n times(index => {\n const datakey = `value${index + 1}`;\n const dataset = `dataset-${index + 1}`;\n\n return (\n <Radar\n {...RADAR_DEFAULT_PROPS}\n fill={`url(#gradient-fill-${index})`}\n stroke={`url(#gradient-stroke-${index})`}\n key={dataset}\n name={dataset}\n dataKey={datakey}\n activeDot={{\n ...DOT_ACTIVE_PROPS,\n stroke: `url(#gradient-stroke-${index})`\n }}\n // only on mobile\n // to handle dot style on hover (convert to click)\n // use with the tooltip component\n dot={\n <CustomDot\n onDotHover={handleDotHover}\n onDotClick={handleOnDotClick}\n activeDot={activeDot}\n dataKey={datakey}\n stroke={`url(#gradient-stroke-${index})`}\n dataName={`dot-${dataset}`}\n />\n }\n />\n );\n }, totalDataset);\n\nconst CustomLabel = ({\n index,\n x,\n y,\n percentagesValues,\n label,\n activeDot,\n chartType,\n formatedColors,\n primarySkinColor,\n exploreLocale,\n hoveredDot,\n onClick,\n onExploreClick\n}: {\n index: number;\n x: number;\n y: number;\n percentagesValues: number[];\n label: string;\n chartType: CHART_TYPE_TYPE;\n formatedColors: FormatedColorsType[];\n activeDot?: ActiveDotType;\n primarySkinColor: string;\n exploreLocale: string;\n hoveredDot: string;\n onClick: (name: string) => void;\n onExploreClick: (name: string) => void;\n}) => {\n const [hovered, setHovered] = useState(false);\n const isCurrentDotActive = activeDot?.label === label;\n const {\n offset: {x: offsetX, y: offsetY},\n alignment,\n ...rest\n } = CHART_CONFIGS[chartType].ticks[index];\n\n function onLabelClick(e: React.MouseEvent) {\n e.stopPropagation();\n onClick(label);\n }\n\n function handleExploreClick() {\n onExploreClick(label);\n }\n\n const buttonExploreProps: ButtonLinkProps = {\n customStyle: {\n height: '36px',\n backgroundColor: hovered ? primarySkinColor : convert(`color(${primarySkinColor} a(0.07))`),\n color: hovered ? '#FFFFFF' : primarySkinColor,\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'\n },\n onClick: handleExploreClick,\n 'aria-label': `${label}, ${exploreLocale}`,\n label: exploreLocale,\n 'data-name': 'learner-skill-card-explore-button',\n icon: {\n position: 'left',\n faIcon: {\n name: 'compass',\n backgroundColor: hovered ? primarySkinColor : convert(`color(${primarySkinColor} a(0.07))`),\n color: hovered ? '#FFFFFF' : primarySkinColor,\n size: 16\n }\n }\n };\n\n const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n const extraOffsetY = isCurrentDotActive && index === 0 ? -25 : 0;\n\n return (\n <g>\n <foreignObject\n className={style.tickeForeignObject}\n x={x + offsetX}\n y={y + offsetY + extraOffsetY}\n width=\"200\"\n height=\"65\"\n >\n <div\n data-name={label}\n onClick={onLabelClick}\n className={classnames(\n style.tickWrapper,\n isCurrentDotActive && style.tickWrapperFocus,\n hoveredDot === label && style.tickWrapperHover\n )}\n style={{\n ...rest,\n alignItems: alignment,\n textAlign: alignment,\n opacity: !isEmpty(activeDot) && !isCurrentDotActive ? 0.3 : 1\n }}\n >\n {formatedColors.map(\n ({percentage: {color, background}, label: {color: colorLabel}}, i) => (\n <Fragment key={i}>\n <span className={style.tickValue} style={{color, background}}>\n {percentagesValues[i]}\n </span>\n <span className={style.tickLabel} style={{color: colorLabel}}>\n {label}\n </span>\n </Fragment>\n )\n )}\n {isCurrentDotActive ? (\n <div\n className={style.buttonWrapper}\n onMouseOver={handleMouseOver}\n onMouseLeave={handleMouseLeave}\n data-name=\"button-explore-wrapper\"\n >\n <ButtonLink {...buttonExploreProps} />\n </div>\n ) : null}\n </div>\n </foreignObject>\n </g>\n );\n};\n\n/* UTILS */\nconst CHART_CONFIGS_BY_SIDE_COUNT = pipe(keyBy('sideCount'), mapValues('name'))(CHART_CONFIGS);\n\nconst formatValues: (values_: number | number[]) => Record<string, number> = pipe(\n values_ => flatten([values_]),\n values_ => values_.map((val: number, i: number): [string, number] => [`value${i + 1}`, val]),\n fromPairs\n);\n\n/* this convert incoming component data to rechart data structure */\nexport const formatData: (\n legend: {[ref: string]: string},\n data_: LearningProfileRadarChartPropTypes['data']\n) => FormatedDataType[] = (legend, data_) =>\n pipe(\n toPairs,\n map(([ref, values_]: [string, number | number[]]) => ({\n ...formatValues(values_),\n subject: legend[ref]\n }))\n )(data_);\n\nexport const LearningProfileRadarChart = (\n {\n data,\n legend,\n totalDataset,\n colors: colorsProps,\n onClick,\n onExploreClick,\n width,\n height,\n margin\n }: LearningProfileRadarChartPropTypes,\n legacyContext: WebContextValues\n) => {\n const [isMobile, setIsMobile] = useState(false);\n const [activeDot, setActiveDot] = useState<ActiveDotType>();\n const [hoveredDot, setHoveredDot] = useState('');\n const skin = GetSkinFromContext(legacyContext);\n const translate = GetTranslateFromContext(legacyContext);\n const primarySkinColor = get('common.primary', skin);\n\n const formatedColors = times(i => {\n if (!colorsProps?.length) return DEFAULT_COLORS;\n\n const colors = colorsProps[i];\n return colors ? Object.assign({}, DEFAULT_COLORS, colors) : DEFAULT_COLORS;\n })(totalDataset);\n\n const chartType: CHART_TYPE_TYPE = useMemo(\n () => getOr('hexagon', size(data), CHART_CONFIGS_BY_SIDE_COUNT),\n [data]\n );\n\n const gradients = useMemo(\n () =>\n formatedColors.map(({gradient: {fill, stroke}}, index) => (\n <svg key={`gradient-${index}`}>\n <Gradient type={`fill-${index}`} colors={fill} />\n <Gradient type={`stroke-${index}`} colors={stroke} />\n </svg>\n )),\n [formatedColors]\n );\n\n const userAgent = navigator?.userAgent;\n const isMobile_ = useMemo(() => getIsMobile(userAgent), [userAgent]);\n\n const setIsMobile_ = useCallback(() => {\n setIsMobile(isMobile_);\n }, [isMobile_]);\n\n useEffect(() => setIsMobile_(), [setIsMobile_]);\n\n useEffect(() => {\n console.log('LearningProfileRadarChart mounted');\n const handleClick = () => {\n setActiveDot(undefined);\n onClick(undefined);\n };\n\n !isEmpty(activeDot) && window.addEventListener('click', handleClick);\n\n return () => {\n window.removeEventListener('click', handleClick);\n };\n }, [activeDot, onClick, setActiveDot]);\n\n function handleOnActiveDotClick() {\n setActiveDot(undefined);\n onClick(undefined);\n }\n\n function handleOnDotClick(label: string) {\n if (!isEmpty(activeDot) && activeDot?.label === label) {\n handleOnActiveDotClick();\n return;\n }\n const payload = formatedData.find(({subject}) => subject === label);\n if (!payload) return;\n\n const index = formatedData.indexOf(payload);\n const datakey = `value${index + 1}`;\n const skillRef = findKey(val => val === payload?.subject, legend);\n\n if (skillRef) {\n setActiveDot({\n key: datakey,\n value: payload[datakey],\n label: payload.subject\n });\n onClick(skillRef);\n }\n }\n\n function handleExploreClick(label: string) {\n const payload = formatedData.find(({subject}) => subject === label);\n if (!payload) return;\n\n const skillRef = findKey(val => val === payload?.subject, legend);\n\n if (skillRef) {\n onExploreClick(skillRef);\n }\n }\n\n function renderCustomLabel(props: {\n x: number;\n y: number;\n payload: {value: string};\n index: number;\n }) {\n const {\n x,\n y,\n payload: {value: label},\n index\n } = props;\n const currentData = formatedData.find(({subject}) => subject === label);\n const percentagesValues: number[] = pipe(\n omit('subject'),\n mapValues(value => `${value}%`),\n values\n )(currentData);\n\n return (\n <CustomLabel\n index={index}\n x={x}\n y={y}\n percentagesValues={percentagesValues}\n label={label}\n activeDot={activeDot}\n chartType={chartType}\n formatedColors={formatedColors}\n primarySkinColor={primarySkinColor}\n exploreLocale={translate('Explore')}\n hoveredDot={hoveredDot}\n onClick={handleOnDotClick}\n onExploreClick={handleExploreClick}\n />\n );\n }\n const formatedData = useMemo(() => formatData(legend, data), [legend, data]);\n\n return (\n <RadarChart\n width={width}\n height={height}\n margin={margin ?? (isMobile ? {top: 80} : {top: 180})}\n cx=\"50%\"\n cy=\"50%\"\n outerRadius=\"80%\"\n data={formatedData}\n >\n {gradients}\n <PolarGrid strokeDasharray={10} strokeWidth={2} radialLines={false} />\n <PolarAngleAxis dataKey=\"subject\" tick={!isMobile && renderCustomLabel} />\n <PolarRadiusAxis tick={false} axisLine={false} domain={[0, 100]} />\n {buildRadars(totalDataset, setHoveredDot, handleOnDotClick, activeDot)}\n {isMobile ? <Tooltip cursor={false} content={<CustomTooltip />} /> : null}\n </RadarChart>\n );\n};\n\nconst ResponsiveLearningProfileRadarChart = (props: LearningProfileRadarChartPropTypes) => (\n <ResponsiveContainer width=\"100%\" height=\"100%\">\n <LearningProfileRadarChart {...props} />\n </ResponsiveContainer>\n);\n\nLearningProfileRadarChart.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nLearningProfileRadarChart.propTypes = learningProfileRadarChartPropTypes;\nResponsiveLearningProfileRadarChart.propTypes = learningProfileRadarChartPropTypes;\n\nexport default ResponsiveLearningProfileRadarChart;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["top","offset","x","y","alignment","margin","bottom","right","marginRight","left","marginLeft","BLACK","WHITE","DEFAULT_MAIN_COLOR","DEFAULT_COLORS","gradient","fill","stroke","percentage","color","background","label","CHART_CONFIGS","triangle","name","ticks","sideCount","quadrilateral","pentagon","hexagon","DOT_DEFAULT_PROPS","strokeWidth","strokeOpacity","r","pointerEvents","style","cursor","DOT_ACTIVE_PROPS","RADAR_DEFAULT_PROPS","fillOpacity","Gradient","type","colors","firstColor","secondColor","CustomTooltip","active","payload","length","tooltip","tooltipLabel","tooltipValue","value","CustomDot","cx","cy","onDotHover","onDotClick","activeDot","dataName","subject","onTouchStart","onClick","e","stopPropagation","onMouseOver","onMouseLeave","buildRadars","totalDataset","handleDotHover","handleOnDotClick","index","datakey","dataset","CustomLabel","percentagesValues","chartType","formatedColors","primarySkinColor","exploreLocale","hoveredDot","onExploreClick","hovered","setHovered","useState","isCurrentDotActive","offsetX","offsetY","rest","onLabelClick","handleExploreClick","buttonExploreProps","customStyle","height","backgroundColor","convert","transition","icon","position","faIcon","size","handleMouseOver","useCallback","handleMouseLeave","extraOffsetY","tickeForeignObject","classnames","tickWrapper","tickWrapperFocus","tickWrapperHover","alignItems","textAlign","opacity","map","colorLabel","i","tickValue","tickLabel","buttonWrapper","CHART_CONFIGS_BY_SIDE_COUNT","formatValues","values_","val","formatData","legend","data_","ref","LearningProfileRadarChart","data","colorsProps","width","legacyContext","isMobile","setIsMobile","setActiveDot","setHoveredDot","skin","GetSkinFromContext","translate","GetTranslateFromContext","Object","assign","useMemo","gradients","userAgent","navigator","isMobile_","getIsMobile","setIsMobile_","useEffect","handleClick","undefined","window","addEventListener","removeEventListener","handleOnActiveDotClick","formatedData","find","indexOf","skillRef","key","renderCustomLabel","props","currentData","ResponsiveLearningProfileRadarChart","contextTypes","Provider","childContextTypes","propTypes","learningProfileRadarChartPropTypes"],"sources":["../../../src/molecule/learning-profile-radar-chart/index.tsx"],"sourcesContent":["import React, {Fragment, useCallback, useEffect, useMemo, useState} from 'react';\nimport {\n Radar,\n RadarChart,\n PolarGrid,\n PolarAngleAxis,\n ResponsiveContainer,\n Tooltip,\n PolarRadiusAxis\n} from 'recharts';\nimport {\n pipe,\n keyBy,\n mapValues,\n size,\n getOr,\n map,\n toPairs,\n values,\n isEmpty,\n omit,\n fromPairs,\n times,\n flatten,\n findKey,\n get\n} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport classnames from 'classnames';\nimport {isMobile as getIsMobile} from '../../util/check-is-mobile';\nimport ButtonLink from '../../atom/button-link';\nimport {ButtonLinkProps} from '../../atom/button-link/types';\nimport Provider, {GetSkinFromContext, GetTranslateFromContext} from '../../atom/provider';\nimport {WebContextValues} from '../../atom/provider/web-context';\nimport {\n ActiveDotType,\n FormatedColorsType,\n FormatedDataType,\n LearningProfileRadarChartPropTypes,\n TickType,\n learningProfileRadarChartPropTypes\n} from './types';\nimport style from './style.css';\n\ntype CHART_TYPE_TYPE = keyof typeof CHART_CONFIGS;\n\n/* TICK_POSITIONS */\nconst top: TickType = {offset: {x: -100, y: -75}, alignment: 'center', margin: 'auto'};\nconst bottom: TickType = {offset: {x: -100, y: 10}, alignment: 'center', margin: 'auto'};\nconst right: TickType = {offset: {x: 30, y: -10}, alignment: 'start', marginRight: 'auto'};\nconst left: TickType = {offset: {x: -230, y: -10}, alignment: 'end', marginLeft: 'auto'};\n\n/* CONSTANTS */\nconst BLACK = '#000000ff';\nconst WHITE = '#ffffffff';\nconst DEFAULT_MAIN_COLOR = '#0062ffff';\n\nconst DEFAULT_COLORS: FormatedColorsType = {\n gradient: {\n fill: [DEFAULT_MAIN_COLOR, DEFAULT_MAIN_COLOR],\n stroke: [DEFAULT_MAIN_COLOR, DEFAULT_MAIN_COLOR]\n },\n percentage: {\n color: BLACK,\n background: WHITE\n },\n label: {\n color: BLACK\n }\n};\n\nconst CHART_CONFIGS = {\n triangle: {\n name: 'triangle',\n ticks: [top, right, left],\n sideCount: 3\n },\n quadrilateral: {\n name: 'quadrilateral',\n ticks: [top, right, bottom, left],\n sideCount: 4\n },\n pentagon: {\n name: 'pentagon',\n ticks: [top, right, right, left, left],\n sideCount: 5\n },\n hexagon: {\n name: 'hexagon',\n ticks: [top, right, right, bottom, left, left],\n sideCount: 6\n }\n} as const;\n\nconst DOT_DEFAULT_PROPS = {\n strokeWidth: 2,\n strokeOpacity: 0.4,\n fill: '#fff',\n r: 4,\n pointerEvents: 'all',\n style: {cursor: 'pointer'}\n} as const;\n\nconst DOT_ACTIVE_PROPS = {\n fill: '#fff',\n r: 6,\n strokeWidth: 4,\n strokeOpacity: 0.6\n} as const;\n\nconst RADAR_DEFAULT_PROPS = {\n strokeWidth: 3,\n strokeOpacity: 0.2,\n fillOpacity: 0.2\n} as const;\n\n/* COMPONENTS */\nconst Gradient = ({type, colors: [firstColor, secondColor]}: {type: string; colors: string[]}) => (\n <defs>\n <linearGradient id={`gradient-${type}`} x1=\"0%\" y1=\"0%\" x2=\"0%\" y2=\"100%\">\n <stop offset=\"0%\" stopColor={firstColor} />\n <stop offset=\"100%\" stopColor={secondColor} />\n </linearGradient>\n </defs>\n);\n\nconst CustomTooltip = ({\n active,\n payload,\n label\n}: {\n active?: boolean;\n payload?: {value: number}[];\n label?: string;\n}) =>\n active && !!payload?.length ? (\n <div className={style.tooltip}>\n <span className={style.tooltipLabel}>{label}</span>\n <span className={style.tooltipValue}>{payload[0].value}%</span>\n </div>\n ) : null;\n\nconst CustomDot = ({\n cx,\n cy,\n payload,\n onDotHover,\n onDotClick,\n stroke,\n activeDot,\n dataName\n}: {\n cx?: number;\n cy?: number;\n payload?: {payload: {subject: string} & {[datakey: string]: number}; name: string};\n onDotHover: (name: string) => void;\n onDotClick: (name: string) => void;\n dataKey: string;\n stroke: string;\n activeDot?: ActiveDotType;\n dataName: string;\n}) => (\n <circle\n {...{\n ...DOT_DEFAULT_PROPS,\n ...(payload?.payload.subject === activeDot?.label && DOT_ACTIVE_PROPS),\n stroke,\n cx,\n cy,\n onTouchStart: () => {\n if (!payload?.name) return;\n onDotClick(payload.name);\n },\n onClick: e => {\n e.stopPropagation();\n\n if (!payload?.name) return;\n onDotClick(payload.name);\n },\n onMouseOver: () => {\n if (!payload?.name) return;\n onDotHover(payload.name);\n },\n onMouseLeave: () => onDotHover(''),\n 'data-name': dataName\n }}\n />\n);\n\nconst buildRadars = (\n totalDataset: number,\n handleDotHover: (name: string) => void,\n handleOnDotClick: (name: string) => void,\n activeDot?: ActiveDotType\n) =>\n times(index => {\n const datakey = `value${index + 1}`;\n const dataset = `dataset-${index + 1}`;\n\n return (\n <Radar\n {...RADAR_DEFAULT_PROPS}\n fill={`url(#gradient-fill-${index})`}\n stroke={`url(#gradient-stroke-${index})`}\n key={dataset}\n name={dataset}\n dataKey={datakey}\n activeDot={{\n ...DOT_ACTIVE_PROPS,\n stroke: `url(#gradient-stroke-${index})`\n }}\n // only on mobile\n // to handle dot style on hover (convert to click)\n // use with the tooltip component\n dot={\n <CustomDot\n onDotHover={handleDotHover}\n onDotClick={handleOnDotClick}\n activeDot={activeDot}\n dataKey={datakey}\n stroke={`url(#gradient-stroke-${index})`}\n dataName={`dot-${dataset}`}\n />\n }\n />\n );\n }, totalDataset);\n\nconst CustomLabel = ({\n index,\n x,\n y,\n percentagesValues,\n label,\n activeDot,\n chartType,\n formatedColors,\n primarySkinColor,\n exploreLocale,\n hoveredDot,\n onClick,\n onExploreClick\n}: {\n index: number;\n x: number;\n y: number;\n percentagesValues: number[];\n label: string;\n chartType: CHART_TYPE_TYPE;\n formatedColors: FormatedColorsType[];\n activeDot?: ActiveDotType;\n primarySkinColor: string;\n exploreLocale: string;\n hoveredDot: string;\n onClick: (name: string) => void;\n onExploreClick: (name: string) => void;\n}) => {\n const [hovered, setHovered] = useState(false);\n const isCurrentDotActive = activeDot?.label === label;\n const {\n offset: {x: offsetX, y: offsetY},\n alignment,\n ...rest\n } = CHART_CONFIGS[chartType].ticks[index];\n\n function onLabelClick(e: React.MouseEvent) {\n e.stopPropagation();\n onClick(label);\n }\n\n function handleExploreClick() {\n onExploreClick(label);\n }\n\n const buttonExploreProps: ButtonLinkProps = {\n customStyle: {\n height: '36px',\n backgroundColor: hovered ? primarySkinColor : convert(`color(${primarySkinColor} a(0.07))`),\n color: hovered ? '#FFFFFF' : primarySkinColor,\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'\n },\n onClick: handleExploreClick,\n 'aria-label': `${label}, ${exploreLocale}`,\n label: exploreLocale,\n 'data-name': 'learner-skill-card-explore-button',\n icon: {\n position: 'left',\n faIcon: {\n name: 'compass',\n backgroundColor: hovered ? primarySkinColor : convert(`color(${primarySkinColor} a(0.07))`),\n color: hovered ? '#FFFFFF' : primarySkinColor,\n size: 16\n }\n }\n };\n\n const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n const extraOffsetY = isCurrentDotActive && index === 0 ? -25 : 0;\n\n return (\n <g>\n <foreignObject\n className={style.tickeForeignObject}\n x={x + offsetX}\n y={y + offsetY + extraOffsetY}\n width=\"200\"\n height=\"65\"\n >\n <div\n data-name={label}\n onClick={onLabelClick}\n className={classnames(\n style.tickWrapper,\n isCurrentDotActive && style.tickWrapperFocus,\n hoveredDot === label && style.tickWrapperHover\n )}\n style={{\n ...rest,\n alignItems: alignment,\n textAlign: alignment,\n opacity: !isEmpty(activeDot) && !isCurrentDotActive ? 0.3 : 1\n }}\n >\n {formatedColors.map(\n ({percentage: {color, background}, label: {color: colorLabel}}, i) => (\n <Fragment key={i}>\n <span className={style.tickValue} style={{color, background}}>\n {percentagesValues[i]}\n </span>\n <span className={style.tickLabel} style={{color: colorLabel}}>\n {label}\n </span>\n </Fragment>\n )\n )}\n {isCurrentDotActive ? (\n <div\n className={style.buttonWrapper}\n onMouseOver={handleMouseOver}\n onMouseLeave={handleMouseLeave}\n data-name=\"button-explore-wrapper\"\n >\n <ButtonLink {...buttonExploreProps} />\n </div>\n ) : null}\n </div>\n </foreignObject>\n </g>\n );\n};\n\n/* UTILS */\nconst CHART_CONFIGS_BY_SIDE_COUNT = pipe(keyBy('sideCount'), mapValues('name'))(CHART_CONFIGS);\n\nconst formatValues: (values_: number | number[]) => Record<string, number> = pipe(\n values_ => flatten([values_]),\n values_ => values_.map((val: number, i: number): [string, number] => [`value${i + 1}`, val]),\n fromPairs\n);\n\n/* this convert incoming component data to rechart data structure */\nexport const formatData: (\n legend: {[ref: string]: string},\n data_: LearningProfileRadarChartPropTypes['data']\n) => FormatedDataType[] = (legend, data_) =>\n pipe(\n toPairs,\n map(([ref, values_]: [string, number | number[]]) => ({\n ...formatValues(values_),\n subject: legend[ref]\n }))\n )(data_);\n\nexport const LearningProfileRadarChart = (\n {\n data,\n legend,\n totalDataset,\n colors: colorsProps,\n onClick,\n onExploreClick,\n width,\n height,\n margin\n }: LearningProfileRadarChartPropTypes,\n legacyContext: WebContextValues\n) => {\n const [isMobile, setIsMobile] = useState(false);\n const [activeDot, setActiveDot] = useState<ActiveDotType>();\n const [hoveredDot, setHoveredDot] = useState('');\n const skin = GetSkinFromContext(legacyContext);\n const translate = GetTranslateFromContext(legacyContext);\n const primarySkinColor = get('common.primary', skin);\n\n const formatedColors = times(i => {\n if (!colorsProps?.length) return DEFAULT_COLORS;\n\n const colors = colorsProps[i];\n return colors ? Object.assign({}, DEFAULT_COLORS, colors) : DEFAULT_COLORS;\n })(totalDataset);\n\n const chartType: CHART_TYPE_TYPE = useMemo(\n () => getOr('hexagon', size(data), CHART_CONFIGS_BY_SIDE_COUNT),\n [data]\n );\n\n const gradients = useMemo(\n () =>\n formatedColors.map(({gradient: {fill, stroke}}, index) => (\n <svg key={`gradient-${index}`}>\n <Gradient type={`fill-${index}`} colors={fill} />\n <Gradient type={`stroke-${index}`} colors={stroke} />\n </svg>\n )),\n [formatedColors]\n );\n\n const userAgent = navigator?.userAgent;\n const isMobile_ = useMemo(() => getIsMobile(userAgent), [userAgent]);\n\n const setIsMobile_ = useCallback(() => {\n setIsMobile(isMobile_);\n }, [isMobile_]);\n\n useEffect(() => setIsMobile_(), [setIsMobile_]);\n\n useEffect(() => {\n const handleClick = () => {\n setActiveDot(undefined);\n onClick(undefined);\n };\n\n !isEmpty(activeDot) && window.addEventListener('click', handleClick);\n\n return () => {\n window.removeEventListener('click', handleClick);\n };\n }, [activeDot, onClick, setActiveDot]);\n\n function handleOnActiveDotClick() {\n setActiveDot(undefined);\n onClick(undefined);\n }\n\n function handleOnDotClick(label: string) {\n if (!isEmpty(activeDot) && activeDot?.label === label) {\n handleOnActiveDotClick();\n return;\n }\n const payload = formatedData.find(({subject}) => subject === label);\n if (!payload) return;\n\n const index = formatedData.indexOf(payload);\n const datakey = `value${index + 1}`;\n const skillRef = findKey(val => val === payload?.subject, legend);\n\n if (skillRef) {\n setActiveDot({\n key: datakey,\n value: payload[datakey],\n label: payload.subject\n });\n onClick(skillRef);\n }\n }\n\n function handleExploreClick(label: string) {\n const payload = formatedData.find(({subject}) => subject === label);\n if (!payload) return;\n\n const skillRef = findKey(val => val === payload?.subject, legend);\n\n if (skillRef) {\n onExploreClick(skillRef);\n }\n }\n\n function renderCustomLabel(props: {\n x: number;\n y: number;\n payload: {value: string};\n index: number;\n }) {\n const {\n x,\n y,\n payload: {value: label},\n index\n } = props;\n const currentData = formatedData.find(({subject}) => subject === label);\n const percentagesValues: number[] = pipe(\n omit('subject'),\n mapValues(value => `${value}%`),\n values\n )(currentData);\n\n return (\n <CustomLabel\n index={index}\n x={x}\n y={y}\n percentagesValues={percentagesValues}\n label={label}\n activeDot={activeDot}\n chartType={chartType}\n formatedColors={formatedColors}\n primarySkinColor={primarySkinColor}\n exploreLocale={translate('Explore')}\n hoveredDot={hoveredDot}\n onClick={handleOnDotClick}\n onExploreClick={handleExploreClick}\n />\n );\n }\n const formatedData = useMemo(() => formatData(legend, data), [legend, data]);\n\n return (\n <RadarChart\n width={width}\n height={height}\n margin={margin ?? (isMobile ? {top: 80} : {top: 180})}\n cx=\"50%\"\n cy=\"50%\"\n outerRadius=\"80%\"\n data={formatedData}\n >\n {gradients}\n <PolarGrid strokeDasharray={10} strokeWidth={2} radialLines={false} />\n <PolarAngleAxis dataKey=\"subject\" tick={!isMobile && renderCustomLabel} />\n <PolarRadiusAxis tick={false} axisLine={false} domain={[0, 100]} />\n {buildRadars(totalDataset, setHoveredDot, handleOnDotClick, activeDot)}\n {isMobile ? <Tooltip cursor={false} content={<CustomTooltip />} /> : null}\n </RadarChart>\n );\n};\n\nconst ResponsiveLearningProfileRadarChart = (props: LearningProfileRadarChartPropTypes) => (\n <ResponsiveContainer width=\"100%\" height=\"100%\">\n <LearningProfileRadarChart {...props} />\n </ResponsiveContainer>\n);\n\nLearningProfileRadarChart.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nLearningProfileRadarChart.propTypes = learningProfileRadarChartPropTypes;\nResponsiveLearningProfileRadarChart.propTypes = learningProfileRadarChartPropTypes;\n\nexport default ResponsiveLearningProfileRadarChart;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AA0BA;;AACA;;AACA;;AACA;;AAEA;;AAEA;;AAQA;;;;;;;;;;;;;;AAIA;AACA,MAAMA,GAAa,GAAG;EAACC,MAAM,EAAE;IAACC,CAAC,EAAE,CAAC,GAAL;IAAUC,CAAC,EAAE,CAAC;EAAd,CAAT;EAA4BC,SAAS,EAAE,QAAvC;EAAiDC,MAAM,EAAE;AAAzD,CAAtB;AACA,MAAMC,MAAgB,GAAG;EAACL,MAAM,EAAE;IAACC,CAAC,EAAE,CAAC,GAAL;IAAUC,CAAC,EAAE;EAAb,CAAT;EAA2BC,SAAS,EAAE,QAAtC;EAAgDC,MAAM,EAAE;AAAxD,CAAzB;AACA,MAAME,KAAe,GAAG;EAACN,MAAM,EAAE;IAACC,CAAC,EAAE,EAAJ;IAAQC,CAAC,EAAE,CAAC;EAAZ,CAAT;EAA0BC,SAAS,EAAE,OAArC;EAA8CI,WAAW,EAAE;AAA3D,CAAxB;AACA,MAAMC,IAAc,GAAG;EAACR,MAAM,EAAE;IAACC,CAAC,EAAE,CAAC,GAAL;IAAUC,CAAC,EAAE,CAAC;EAAd,CAAT;EAA4BC,SAAS,EAAE,KAAvC;EAA8CM,UAAU,EAAE;AAA1D,CAAvB;AAEA;;AACA,MAAMC,KAAK,GAAG,WAAd;AACA,MAAMC,KAAK,GAAG,WAAd;AACA,MAAMC,kBAAkB,GAAG,WAA3B;AAEA,MAAMC,cAAkC,GAAG;EACzCC,QAAQ,EAAE;IACRC,IAAI,EAAE,CAACH,kBAAD,EAAqBA,kBAArB,CADE;IAERI,MAAM,EAAE,CAACJ,kBAAD,EAAqBA,kBAArB;EAFA,CAD+B;EAKzCK,UAAU,EAAE;IACVC,KAAK,EAAER,KADG;IAEVS,UAAU,EAAER;EAFF,CAL6B;EASzCS,KAAK,EAAE;IACLF,KAAK,EAAER;EADF;AATkC,CAA3C;AAcA,MAAMW,aAAa,GAAG;EACpBC,QAAQ,EAAE;IACRC,IAAI,EAAE,UADE;IAERC,KAAK,EAAE,CAACzB,GAAD,EAAMO,KAAN,EAAaE,IAAb,CAFC;IAGRiB,SAAS,EAAE;EAHH,CADU;EAMpBC,aAAa,EAAE;IACbH,IAAI,EAAE,eADO;IAEbC,KAAK,EAAE,CAACzB,GAAD,EAAMO,KAAN,EAAaD,MAAb,EAAqBG,IAArB,CAFM;IAGbiB,SAAS,EAAE;EAHE,CANK;EAWpBE,QAAQ,EAAE;IACRJ,IAAI,EAAE,UADE;IAERC,KAAK,EAAE,CAACzB,GAAD,EAAMO,KAAN,EAAaA,KAAb,EAAoBE,IAApB,EAA0BA,IAA1B,CAFC;IAGRiB,SAAS,EAAE;EAHH,CAXU;EAgBpBG,OAAO,EAAE;IACPL,IAAI,EAAE,SADC;IAEPC,KAAK,EAAE,CAACzB,GAAD,EAAMO,KAAN,EAAaA,KAAb,EAAoBD,MAApB,EAA4BG,IAA5B,EAAkCA,IAAlC,CAFA;IAGPiB,SAAS,EAAE;EAHJ;AAhBW,CAAtB;AAuBA,MAAMI,iBAAiB,GAAG;EACxBC,WAAW,EAAE,CADW;EAExBC,aAAa,EAAE,GAFS;EAGxBhB,IAAI,EAAE,MAHkB;EAIxBiB,CAAC,EAAE,CAJqB;EAKxBC,aAAa,EAAE,KALS;EAMxBC,KAAK,EAAE;IAACC,MAAM,EAAE;EAAT;AANiB,CAA1B;AASA,MAAMC,gBAAgB,GAAG;EACvBrB,IAAI,EAAE,MADiB;EAEvBiB,CAAC,EAAE,CAFoB;EAGvBF,WAAW,EAAE,CAHU;EAIvBC,aAAa,EAAE;AAJQ,CAAzB;AAOA,MAAMM,mBAAmB,GAAG;EAC1BP,WAAW,EAAE,CADa;EAE1BC,aAAa,EAAE,GAFW;EAG1BO,WAAW,EAAE;AAHa,CAA5B;AAMA;;AACA,MAAMC,QAAQ,GAAG,CAAC;EAACC,IAAD;EAAOC,MAAM,EAAE,CAACC,UAAD,EAAaC,WAAb;AAAf,CAAD,kBACf,wDACE;EAAgB,EAAE,EAAG,YAAWH,IAAK,EAArC;EAAwC,EAAE,EAAC,IAA3C;EAAgD,EAAE,EAAC,IAAnD;EAAwD,EAAE,EAAC,IAA3D;EAAgE,EAAE,EAAC;AAAnE,gBACE;EAAM,MAAM,EAAC,IAAb;EAAkB,SAAS,EAAEE;AAA7B,EADF,eAEE;EAAM,MAAM,EAAC,MAAb;EAAoB,SAAS,EAAEC;AAA/B,EAFF,CADF,CADF;;AASA,MAAMC,aAAa,GAAG,CAAC;EACrBC,MADqB;EAErBC,OAFqB;EAGrB1B;AAHqB,CAAD,KASpByB,MAAM,IAAI,CAAC,CAACC,OAAO,EAAEC,MAArB,gBACE;EAAK,SAAS,EAAEb,cAAA,CAAMc;AAAtB,gBACE;EAAM,SAAS,EAAEd,cAAA,CAAMe;AAAvB,GAAsC7B,KAAtC,CADF,eAEE;EAAM,SAAS,EAAEc,cAAA,CAAMgB;AAAvB,GAAsCJ,OAAO,CAAC,CAAD,CAAP,CAAWK,KAAjD,MAFF,CADF,GAKI,IAdN;;AAgBA,MAAMC,SAAS,GAAG,CAAC;EACjBC,EADiB;EAEjBC,EAFiB;EAGjBR,OAHiB;EAIjBS,UAJiB;EAKjBC,UALiB;EAMjBxC,MANiB;EAOjByC,SAPiB;EAQjBC;AARiB,CAAD,kBAoBhB,oDAEO7B,iBAFP,EAGQiB,OAAO,EAAEA,OAAT,CAAiBa,OAAjB,KAA6BF,SAAS,EAAErC,KAAxC,IAAiDgB,gBAHzD;EAIIpB,MAJJ;EAKIqC,EALJ;EAMIC,EANJ;EAOIM,YAAY,EAAE,MAAM;IAClB,IAAI,CAACd,OAAO,EAAEvB,IAAd,EAAoB;IACpBiC,UAAU,CAACV,OAAO,CAACvB,IAAT,CAAV;EACD,CAVL;EAWIsC,OAAO,EAAEC,CAAC,IAAI;IACZA,CAAC,CAACC,eAAF;IAEA,IAAI,CAACjB,OAAO,EAAEvB,IAAd,EAAoB;IACpBiC,UAAU,CAACV,OAAO,CAACvB,IAAT,CAAV;EACD,CAhBL;EAiBIyC,WAAW,EAAE,MAAM;IACjB,IAAI,CAAClB,OAAO,EAAEvB,IAAd,EAAoB;IACpBgC,UAAU,CAACT,OAAO,CAACvB,IAAT,CAAV;EACD,CApBL;EAqBI0C,YAAY,EAAE,MAAMV,UAAU,CAAC,EAAD,CArBlC;EAsBI,aAAaG;AAtBjB,GApBF;;AA+CA,MAAMQ,WAAW,GAAG,CAClBC,YADkB,EAElBC,cAFkB,EAGlBC,gBAHkB,EAIlBZ,SAJkB,KAMlB,qBAAMa,KAAK,IAAI;EACb,MAAMC,OAAO,GAAI,QAAOD,KAAK,GAAG,CAAE,EAAlC;EACA,MAAME,OAAO,GAAI,WAAUF,KAAK,GAAG,CAAE,EAArC;EAEA,oBACE,6BAAC,eAAD,eACMjC,mBADN;IAEE,IAAI,EAAG,sBAAqBiC,KAAM,GAFpC;IAGE,MAAM,EAAG,wBAAuBA,KAAM,GAHxC;IAIE,GAAG,EAAEE,OAJP;IAKE,IAAI,EAAEA,OALR;IAME,OAAO,EAAED,OANX;IAOE,SAAS,eACJnC,gBADI;MAEPpB,MAAM,EAAG,wBAAuBsD,KAAM;IAF/B,EAPX,CAWE;IACA;IACA;IAbF;IAcE,GAAG,eACD,6BAAC,SAAD;MACE,UAAU,EAAEF,cADd;MAEE,UAAU,EAAEC,gBAFd;MAGE,SAAS,EAAEZ,SAHb;MAIE,OAAO,EAAEc,OAJX;MAKE,MAAM,EAAG,wBAAuBD,KAAM,GALxC;MAME,QAAQ,EAAG,OAAME,OAAQ;IAN3B;EAfJ,GADF;AA2BD,CA/BD,EA+BGL,YA/BH,CANF;;AAuCA,MAAMM,WAAW,GAAG,CAAC;EACnBH,KADmB;EAEnBrE,CAFmB;EAGnBC,CAHmB;EAInBwE,iBAJmB;EAKnBtD,KALmB;EAMnBqC,SANmB;EAOnBkB,SAPmB;EAQnBC,cARmB;EASnBC,gBATmB;EAUnBC,aAVmB;EAWnBC,UAXmB;EAYnBlB,OAZmB;EAanBmB;AAbmB,CAAD,KA4Bd;EACJ,MAAM,CAACC,OAAD,EAAUC,UAAV,IAAwB,IAAAC,eAAA,EAAS,KAAT,CAA9B;EACA,MAAMC,kBAAkB,GAAG3B,SAAS,EAAErC,KAAX,KAAqBA,KAAhD;;EACA,8BAIIC,aAAa,CAACsD,SAAD,CAAb,CAAyBnD,KAAzB,CAA+B8C,KAA/B,CAJJ;EAAA,MAAM;IACJtE,MAAM,EAAE;MAACC,CAAC,EAAEoF,OAAJ;MAAanF,CAAC,EAAEoF;IAAhB,CADJ;IAEJnF;EAFI,CAAN;EAAA,MAGKoF,IAHL;;EAMA,SAASC,YAAT,CAAsB1B,CAAtB,EAA2C;IACzCA,CAAC,CAACC,eAAF;IACAF,OAAO,CAACzC,KAAD,CAAP;EACD;;EAED,SAASqE,kBAAT,GAA8B;IAC5BT,cAAc,CAAC5D,KAAD,CAAd;EACD;;EAED,MAAMsE,kBAAmC,GAAG;IAC1CC,WAAW,EAAE;MACXC,MAAM,EAAE,MADG;MAEXC,eAAe,EAAEZ,OAAO,GAAGJ,gBAAH,GAAsB,IAAAiB,yBAAA,EAAS,SAAQjB,gBAAiB,WAAlC,CAFnC;MAGX3D,KAAK,EAAE+D,OAAO,GAAG,SAAH,GAAeJ,gBAHlB;MAIXkB,UAAU,EAAE;IAJD,CAD6B;IAO1ClC,OAAO,EAAE4B,kBAPiC;IAQ1C,cAAe,GAAErE,KAAM,KAAI0D,aAAc,EARC;IAS1C1D,KAAK,EAAE0D,aATmC;IAU1C,aAAa,mCAV6B;IAW1CkB,IAAI,EAAE;MACJC,QAAQ,EAAE,MADN;MAEJC,MAAM,EAAE;QACN3E,IAAI,EAAE,SADA;QAENsE,eAAe,EAAEZ,OAAO,GAAGJ,gBAAH,GAAsB,IAAAiB,yBAAA,EAAS,SAAQjB,gBAAiB,WAAlC,CAFxC;QAGN3D,KAAK,EAAE+D,OAAO,GAAG,SAAH,GAAeJ,gBAHvB;QAINsB,IAAI,EAAE;MAJA;IAFJ;EAXoC,CAA5C;EAsBA,MAAMC,eAAe,GAAG,IAAAC,kBAAA,EAAY,MAAMnB,UAAU,CAAC,IAAD,CAA5B,EAAoC,CAACA,UAAD,CAApC,CAAxB;EAEA,MAAMoB,gBAAgB,GAAG,IAAAD,kBAAA,EAAY,MAAMnB,UAAU,CAAC,KAAD,CAA5B,EAAqC,CAACA,UAAD,CAArC,CAAzB;EAEA,MAAMqB,YAAY,GAAGnB,kBAAkB,IAAId,KAAK,KAAK,CAAhC,GAAoC,CAAC,EAArC,GAA0C,CAA/D;EAEA,oBACE,qDACE;IACE,SAAS,EAAEpC,cAAA,CAAMsE,kBADnB;IAEE,CAAC,EAAEvG,CAAC,GAAGoF,OAFT;IAGE,CAAC,EAAEnF,CAAC,GAAGoF,OAAJ,GAAciB,YAHnB;IAIE,KAAK,EAAC,KAJR;IAKE,MAAM,EAAC;EALT,gBAOE;IACE,aAAWnF,KADb;IAEE,OAAO,EAAEoE,YAFX;IAGE,SAAS,EAAE,IAAAiB,mBAAA,EACTvE,cAAA,CAAMwE,WADG,EAETtB,kBAAkB,IAAIlD,cAAA,CAAMyE,gBAFnB,EAGT5B,UAAU,KAAK3D,KAAf,IAAwBc,cAAA,CAAM0E,gBAHrB,CAHb;IAQE,KAAK,eACArB,IADA;MAEHsB,UAAU,EAAE1G,SAFT;MAGH2G,SAAS,EAAE3G,SAHR;MAIH4G,OAAO,EAAE,CAAC,uBAAQtD,SAAR,CAAD,IAAuB,CAAC2B,kBAAxB,GAA6C,GAA7C,GAAmD;IAJzD;EARP,GAeGR,cAAc,CAACoC,GAAf,CACC,CAAC;IAAC/F,UAAU,EAAE;MAACC,KAAD;MAAQC;IAAR,CAAb;IAAkCC,KAAK,EAAE;MAACF,KAAK,EAAE+F;IAAR;EAAzC,CAAD,EAAgEC,CAAhE,kBACE,6BAAC,eAAD;IAAU,GAAG,EAAEA;EAAf,gBACE;IAAM,SAAS,EAAEhF,cAAA,CAAMiF,SAAvB;IAAkC,KAAK,EAAE;MAACjG,KAAD;MAAQC;IAAR;EAAzC,GACGuD,iBAAiB,CAACwC,CAAD,CADpB,CADF,eAIE;IAAM,SAAS,EAAEhF,cAAA,CAAMkF,SAAvB;IAAkC,KAAK,EAAE;MAAClG,KAAK,EAAE+F;IAAR;EAAzC,GACG7F,KADH,CAJF,CAFH,CAfH,EA2BGgE,kBAAkB,gBACjB;IACE,SAAS,EAAElD,cAAA,CAAMmF,aADnB;IAEE,WAAW,EAAEjB,eAFf;IAGE,YAAY,EAAEE,gBAHhB;IAIE,aAAU;EAJZ,gBAME,6BAAC,mBAAD,EAAgBZ,kBAAhB,CANF,CADiB,GASf,IApCN,CAPF,CADF,CADF;AAkDD,CA5HD;AA8HA;;;AACA,MAAM4B,2BAA2B,GAAG,oBAAK,qBAAM,WAAN,CAAL,EAAyB,yBAAU,MAAV,CAAzB,EAA4CjG,aAA5C,CAApC;AAEA,MAAMkG,YAAoE,GAAG,oBAC3EC,OAAO,IAAI,uBAAQ,CAACA,OAAD,CAAR,CADgE,EAE3EA,OAAO,IAAIA,OAAO,CAACR,GAAR,CAAY,CAACS,GAAD,EAAcP,CAAd,KAA8C,CAAE,QAAOA,CAAC,GAAG,CAAE,EAAf,EAAkBO,GAAlB,CAA1D,CAFgE,sBAA7E;AAMA;;AACO,MAAMC,UAGU,GAAG,CAACC,MAAD,EAASC,KAAT,KACxB,uCAEE,mBAAI,CAAC,CAACC,GAAD,EAAML,OAAN,CAAD,kBACCD,YAAY,CAACC,OAAD,CADb;EAEF7D,OAAO,EAAEgE,MAAM,CAACE,GAAD;AAFb,EAAJ,CAFF,EAMED,KANF,CAJK;;;;AAYA,MAAME,yBAAyB,GAAG,CACvC;EACEC,IADF;EAEEJ,MAFF;EAGExD,YAHF;EAIE1B,MAAM,EAAEuF,WAJV;EAKEnE,OALF;EAMEmB,cANF;EAOEiD,KAPF;EAQErC,MARF;EASExF;AATF,CADuC,EAYvC8H,aAZuC,KAapC;EACH,MAAM,CAACC,QAAD,EAAWC,WAAX,IAA0B,IAAAjD,eAAA,EAAS,KAAT,CAAhC;EACA,MAAM,CAAC1B,SAAD,EAAY4E,YAAZ,IAA4B,IAAAlD,eAAA,GAAlC;EACA,MAAM,CAACJ,UAAD,EAAauD,aAAb,IAA8B,IAAAnD,eAAA,EAAS,EAAT,CAApC;EACA,MAAMoD,IAAI,GAAG,IAAAC,4BAAA,EAAmBN,aAAnB,CAAb;EACA,MAAMO,SAAS,GAAG,IAAAC,iCAAA,EAAwBR,aAAxB,CAAlB;EACA,MAAMrD,gBAAgB,GAAG,mBAAI,gBAAJ,EAAsB0D,IAAtB,CAAzB;EAEA,MAAM3D,cAAc,GAAG,qBAAMsC,CAAC,IAAI;IAChC,IAAI,CAACc,WAAW,EAAEjF,MAAlB,EAA0B,OAAOlC,cAAP;IAE1B,MAAM4B,MAAM,GAAGuF,WAAW,CAACd,CAAD,CAA1B;IACA,OAAOzE,MAAM,GAAGkG,MAAM,CAACC,MAAP,CAAc,EAAd,EAAkB/H,cAAlB,EAAkC4B,MAAlC,CAAH,GAA+C5B,cAA5D;EACD,CALsB,EAKpBsD,YALoB,CAAvB;EAOA,MAAMQ,SAA0B,GAAG,IAAAkE,cAAA,EACjC,MAAM,qBAAM,SAAN,EAAiB,oBAAKd,IAAL,CAAjB,EAA6BT,2BAA7B,CAD2B,EAEjC,CAACS,IAAD,CAFiC,CAAnC;EAKA,MAAMe,SAAS,GAAG,IAAAD,cAAA,EAChB,MACEjE,cAAc,CAACoC,GAAf,CAAmB,CAAC;IAAClG,QAAQ,EAAE;MAACC,IAAD;MAAOC;IAAP;EAAX,CAAD,EAA6BsD,KAA7B,kBACjB;IAAK,GAAG,EAAG,YAAWA,KAAM;EAA5B,gBACE,6BAAC,QAAD;IAAU,IAAI,EAAG,QAAOA,KAAM,EAA9B;IAAiC,MAAM,EAAEvD;EAAzC,EADF,eAEE,6BAAC,QAAD;IAAU,IAAI,EAAG,UAASuD,KAAM,EAAhC;IAAmC,MAAM,EAAEtD;EAA3C,EAFF,CADF,CAFc,EAQhB,CAAC4D,cAAD,CARgB,CAAlB;EAWA,MAAMmE,SAAS,GAAGC,SAAS,EAAED,SAA7B;EACA,MAAME,SAAS,GAAG,IAAAJ,cAAA,EAAQ,MAAM,IAAAK,uBAAA,EAAYH,SAAZ,CAAd,EAAsC,CAACA,SAAD,CAAtC,CAAlB;EAEA,MAAMI,YAAY,GAAG,IAAA9C,kBAAA,EAAY,MAAM;IACrC+B,WAAW,CAACa,SAAD,CAAX;EACD,CAFoB,EAElB,CAACA,SAAD,CAFkB,CAArB;EAIA,IAAAG,gBAAA,EAAU,MAAMD,YAAY,EAA5B,EAAgC,CAACA,YAAD,CAAhC;EAEA,IAAAC,gBAAA,EAAU,MAAM;IACd,MAAMC,WAAW,GAAG,MAAM;MACxBhB,YAAY,CAACiB,SAAD,CAAZ;MACAzF,OAAO,CAACyF,SAAD,CAAP;IACD,CAHD;;IAKA,CAAC,uBAAQ7F,SAAR,CAAD,IAAuB8F,MAAM,CAACC,gBAAP,CAAwB,OAAxB,EAAiCH,WAAjC,CAAvB;IAEA,OAAO,MAAM;MACXE,MAAM,CAACE,mBAAP,CAA2B,OAA3B,EAAoCJ,WAApC;IACD,CAFD;EAGD,CAXD,EAWG,CAAC5F,SAAD,EAAYI,OAAZ,EAAqBwE,YAArB,CAXH;;EAaA,SAASqB,sBAAT,GAAkC;IAChCrB,YAAY,CAACiB,SAAD,CAAZ;IACAzF,OAAO,CAACyF,SAAD,CAAP;EACD;;EAED,SAASjF,gBAAT,CAA0BjD,KAA1B,EAAyC;IACvC,IAAI,CAAC,uBAAQqC,SAAR,CAAD,IAAuBA,SAAS,EAAErC,KAAX,KAAqBA,KAAhD,EAAuD;MACrDsI,sBAAsB;MACtB;IACD;;IACD,MAAM5G,OAAO,GAAG6G,YAAY,CAACC,IAAb,CAAkB,CAAC;MAACjG;IAAD,CAAD,KAAeA,OAAO,KAAKvC,KAA7C,CAAhB;IACA,IAAI,CAAC0B,OAAL,EAAc;IAEd,MAAMwB,KAAK,GAAGqF,YAAY,CAACE,OAAb,CAAqB/G,OAArB,CAAd;IACA,MAAMyB,OAAO,GAAI,QAAOD,KAAK,GAAG,CAAE,EAAlC;IACA,MAAMwF,QAAQ,GAAG,uBAAQrC,GAAG,IAAIA,GAAG,KAAK3E,OAAO,EAAEa,OAAhC,EAAyCgE,MAAzC,CAAjB;;IAEA,IAAImC,QAAJ,EAAc;MACZzB,YAAY,CAAC;QACX0B,GAAG,EAAExF,OADM;QAEXpB,KAAK,EAAEL,OAAO,CAACyB,OAAD,CAFH;QAGXnD,KAAK,EAAE0B,OAAO,CAACa;MAHJ,CAAD,CAAZ;MAKAE,OAAO,CAACiG,QAAD,CAAP;IACD;EACF;;EAED,SAASrE,kBAAT,CAA4BrE,KAA5B,EAA2C;IACzC,MAAM0B,OAAO,GAAG6G,YAAY,CAACC,IAAb,CAAkB,CAAC;MAACjG;IAAD,CAAD,KAAeA,OAAO,KAAKvC,KAA7C,CAAhB;IACA,IAAI,CAAC0B,OAAL,EAAc;IAEd,MAAMgH,QAAQ,GAAG,uBAAQrC,GAAG,IAAIA,GAAG,KAAK3E,OAAO,EAAEa,OAAhC,EAAyCgE,MAAzC,CAAjB;;IAEA,IAAImC,QAAJ,EAAc;MACZ9E,cAAc,CAAC8E,QAAD,CAAd;IACD;EACF;;EAED,SAASE,iBAAT,CAA2BC,KAA3B,EAKG;IACD,MAAM;MACJhK,CADI;MAEJC,CAFI;MAGJ4C,OAAO,EAAE;QAACK,KAAK,EAAE/B;MAAR,CAHL;MAIJkD;IAJI,IAKF2F,KALJ;IAMA,MAAMC,WAAW,GAAGP,YAAY,CAACC,IAAb,CAAkB,CAAC;MAACjG;IAAD,CAAD,KAAeA,OAAO,KAAKvC,KAA7C,CAApB;IACA,MAAMsD,iBAA2B,GAAG,oBAClC,oBAAK,SAAL,CADkC,EAElC,yBAAUvB,KAAK,IAAK,GAAEA,KAAM,GAA5B,CAFkC,oBAIlC+G,WAJkC,CAApC;IAMA,oBACE,6BAAC,WAAD;MACE,KAAK,EAAE5F,KADT;MAEE,CAAC,EAAErE,CAFL;MAGE,CAAC,EAAEC,CAHL;MAIE,iBAAiB,EAAEwE,iBAJrB;MAKE,KAAK,EAAEtD,KALT;MAME,SAAS,EAAEqC,SANb;MAOE,SAAS,EAAEkB,SAPb;MAQE,cAAc,EAAEC,cARlB;MASE,gBAAgB,EAAEC,gBATpB;MAUE,aAAa,EAAE4D,SAAS,CAAC,SAAD,CAV1B;MAWE,UAAU,EAAE1D,UAXd;MAYE,OAAO,EAAEV,gBAZX;MAaE,cAAc,EAAEoB;IAblB,EADF;EAiBD;;EACD,MAAMkE,YAAY,GAAG,IAAAd,cAAA,EAAQ,MAAMnB,UAAU,CAACC,MAAD,EAASI,IAAT,CAAxB,EAAwC,CAACJ,MAAD,EAASI,IAAT,CAAxC,CAArB;EAEA,oBACE,6BAAC,oBAAD;IACE,KAAK,EAAEE,KADT;IAEE,MAAM,EAAErC,MAFV;IAGE,MAAM,EAAExF,MAAM,KAAK+H,QAAQ,GAAG;MAACpI,GAAG,EAAE;IAAN,CAAH,GAAe;MAACA,GAAG,EAAE;IAAN,CAA5B,CAHhB;IAIE,EAAE,EAAC,KAJL;IAKE,EAAE,EAAC,KALL;IAME,WAAW,EAAC,KANd;IAOE,IAAI,EAAE4J;EAPR,GASGb,SATH,eAUE,6BAAC,mBAAD;IAAW,eAAe,EAAE,EAA5B;IAAgC,WAAW,EAAE,CAA7C;IAAgD,WAAW,EAAE;EAA7D,EAVF,eAWE,6BAAC,wBAAD;IAAgB,OAAO,EAAC,SAAxB;IAAkC,IAAI,EAAE,CAACX,QAAD,IAAa6B;EAArD,EAXF,eAYE,6BAAC,yBAAD;IAAiB,IAAI,EAAE,KAAvB;IAA8B,QAAQ,EAAE,KAAxC;IAA+C,MAAM,EAAE,CAAC,CAAD,EAAI,GAAJ;EAAvD,EAZF,EAaG9F,WAAW,CAACC,YAAD,EAAemE,aAAf,EAA8BjE,gBAA9B,EAAgDZ,SAAhD,CAbd,EAcG0E,QAAQ,gBAAG,6BAAC,iBAAD;IAAS,MAAM,EAAE,KAAjB;IAAwB,OAAO,eAAE,6BAAC,aAAD;EAAjC,EAAH,GAA4D,IAdvE,CADF;AAkBD,CAjKM;;;;AAmKP,MAAMgC,mCAAmC,GAAIF,KAAD,iBAC1C,6BAAC,6BAAD;EAAqB,KAAK,EAAC,MAA3B;EAAkC,MAAM,EAAC;AAAzC,gBACE,6BAAC,yBAAD,EAA+BA,KAA/B,CADF,CADF;;AAMAnC,yBAAyB,CAACsC,YAA1B,GAAyC;EACvC7B,IAAI,EAAE8B,iBAAA,CAASC,iBAAT,CAA2B/B,IADM;EAEvCE,SAAS,EAAE4B,iBAAA,CAASC,iBAAT,CAA2B7B;AAFC,CAAzC;AAKAX,yBAAyB,CAACyC,SAA1B,2CAAsCC,yCAAtC;AACAL,mCAAmC,CAACI,SAApC,2CAAgDC,yCAAhD;eAEeL,mC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export default PlaylistDetailCover;
|
|
2
|
+
declare function PlaylistDetailCover({ images }: {
|
|
3
|
+
images: any;
|
|
4
|
+
}): JSX.Element;
|
|
5
|
+
declare namespace PlaylistDetailCover {
|
|
6
|
+
namespace propTypes {
|
|
7
|
+
const images: PropTypes.Validator<(PropTypes.InferProps<{
|
|
8
|
+
type: PropTypes.Requireable<string>;
|
|
9
|
+
image: PropTypes.Requireable<string>;
|
|
10
|
+
}> | null | undefined)[]>;
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
import PropTypes from "prop-types";
|
|
14
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/playlist-detail-cover/index.js"],"names":[],"mappings":";AAQA;;gBAoCC"}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = void 0;
|
|
5
|
+
|
|
6
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
7
|
+
|
|
8
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
+
|
|
10
|
+
var _externalContent = require("../../util/external-content");
|
|
11
|
+
|
|
12
|
+
var _style = _interopRequireDefault(require("./style.css"));
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
|
|
16
|
+
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); }
|
|
17
|
+
|
|
18
|
+
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; }
|
|
19
|
+
|
|
20
|
+
const FALLBACK_PATH = 'https://s3.eu-west-1.amazonaws.com/static.coorpacademy.com/assets/images/cover-fallback-external-$TYPE.png';
|
|
21
|
+
|
|
22
|
+
const PlaylistDetailCover = ({
|
|
23
|
+
images
|
|
24
|
+
}) => {
|
|
25
|
+
const [firstColumnImages, secondColumnImages] = (0, _react.useMemo)(() => {
|
|
26
|
+
const imagesClone = [...images];
|
|
27
|
+
return [imagesClone.splice(0, imagesClone.length / 2), imagesClone];
|
|
28
|
+
}, [images]);
|
|
29
|
+
const buildImageStyle = (0, _react.useCallback)(({
|
|
30
|
+
type,
|
|
31
|
+
image
|
|
32
|
+
}) => {
|
|
33
|
+
const imageUrl = image || FALLBACK_PATH.replace('$TYPE', type);
|
|
34
|
+
return {
|
|
35
|
+
backgroundImage: `url(${imageUrl})`,
|
|
36
|
+
backgroundSize: 'cover',
|
|
37
|
+
backgroundPosition: 'center'
|
|
38
|
+
};
|
|
39
|
+
});
|
|
40
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
41
|
+
className: _style.default.container
|
|
42
|
+
}, images.length === 1 ? /*#__PURE__*/_react.default.createElement("img", {
|
|
43
|
+
className: _style.default.image,
|
|
44
|
+
style: buildImageStyle(images[0])
|
|
45
|
+
}) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
46
|
+
className: _style.default.imagesWrapper
|
|
47
|
+
}, firstColumnImages.map((image, index) => /*#__PURE__*/_react.default.createElement("img", {
|
|
48
|
+
key: index,
|
|
49
|
+
className: _style.default.image,
|
|
50
|
+
style: buildImageStyle(image)
|
|
51
|
+
}))), /*#__PURE__*/_react.default.createElement("div", {
|
|
52
|
+
className: _style.default.imagesWrapper
|
|
53
|
+
}, secondColumnImages.map((image, index) => /*#__PURE__*/_react.default.createElement("img", {
|
|
54
|
+
key: index,
|
|
55
|
+
className: _style.default.image,
|
|
56
|
+
style: buildImageStyle(image)
|
|
57
|
+
})))));
|
|
58
|
+
};
|
|
59
|
+
|
|
60
|
+
PlaylistDetailCover.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
61
|
+
images: _propTypes.default.arrayOf(_propTypes.default.shape({
|
|
62
|
+
type: _propTypes.default.oneOf(_externalContent.EXTERNAL_COURSE_TYPES),
|
|
63
|
+
image: _propTypes.default.string
|
|
64
|
+
})).isRequired
|
|
65
|
+
} : {};
|
|
66
|
+
var _default = PlaylistDetailCover;
|
|
67
|
+
exports.default = _default;
|
|
68
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["FALLBACK_PATH","PlaylistDetailCover","images","firstColumnImages","secondColumnImages","useMemo","imagesClone","splice","length","buildImageStyle","useCallback","type","image","imageUrl","replace","backgroundImage","backgroundSize","backgroundPosition","style","container","imagesWrapper","map","index","propTypes","PropTypes","arrayOf","shape","oneOf","EXTERNAL_COURSE_TYPES","string","isRequired"],"sources":["../../../src/molecule/playlist-detail-cover/index.js"],"sourcesContent":["import React, {useMemo, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {EXTERNAL_COURSE_TYPES} from '../../util/external-content';\nimport style from './style.css';\n\nconst FALLBACK_PATH =\n 'https://s3.eu-west-1.amazonaws.com/static.coorpacademy.com/assets/images/cover-fallback-external-$TYPE.png';\n\nconst PlaylistDetailCover = ({images}) => {\n const [firstColumnImages, secondColumnImages] = useMemo(() => {\n const imagesClone = [...images];\n return [imagesClone.splice(0, imagesClone.length / 2), imagesClone];\n }, [images]);\n\n const buildImageStyle = useCallback(({type, image}) => {\n const imageUrl = image || FALLBACK_PATH.replace('$TYPE', type);\n\n return {\n backgroundImage: `url(${imageUrl})`,\n backgroundSize: 'cover',\n backgroundPosition: 'center'\n };\n });\n\n return (\n <div className={style.container}>\n {images.length === 1 ? (\n <img className={style.image} style={buildImageStyle(images[0])} />\n ) : (\n <>\n <div className={style.imagesWrapper}>\n {firstColumnImages.map((image, index) => (\n <img key={index} className={style.image} style={buildImageStyle(image)} />\n ))}\n </div>\n <div className={style.imagesWrapper}>\n {secondColumnImages.map((image, index) => (\n <img key={index} className={style.image} style={buildImageStyle(image)} />\n ))}\n </div>\n </>\n )}\n </div>\n );\n};\n\nPlaylistDetailCover.propTypes = {\n images: PropTypes.arrayOf(\n PropTypes.shape({\n type: PropTypes.oneOf(EXTERNAL_COURSE_TYPES),\n image: PropTypes.string\n })\n ).isRequired\n};\n\nexport default PlaylistDetailCover;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;AAEA,MAAMA,aAAa,GACjB,4GADF;;AAGA,MAAMC,mBAAmB,GAAG,CAAC;EAACC;AAAD,CAAD,KAAc;EACxC,MAAM,CAACC,iBAAD,EAAoBC,kBAApB,IAA0C,IAAAC,cAAA,EAAQ,MAAM;IAC5D,MAAMC,WAAW,GAAG,CAAC,GAAGJ,MAAJ,CAApB;IACA,OAAO,CAACI,WAAW,CAACC,MAAZ,CAAmB,CAAnB,EAAsBD,WAAW,CAACE,MAAZ,GAAqB,CAA3C,CAAD,EAAgDF,WAAhD,CAAP;EACD,CAH+C,EAG7C,CAACJ,MAAD,CAH6C,CAAhD;EAKA,MAAMO,eAAe,GAAG,IAAAC,kBAAA,EAAY,CAAC;IAACC,IAAD;IAAOC;EAAP,CAAD,KAAmB;IACrD,MAAMC,QAAQ,GAAGD,KAAK,IAAIZ,aAAa,CAACc,OAAd,CAAsB,OAAtB,EAA+BH,IAA/B,CAA1B;IAEA,OAAO;MACLI,eAAe,EAAG,OAAMF,QAAS,GAD5B;MAELG,cAAc,EAAE,OAFX;MAGLC,kBAAkB,EAAE;IAHf,CAAP;EAKD,CARuB,CAAxB;EAUA,oBACE;IAAK,SAAS,EAAEC,cAAA,CAAMC;EAAtB,GACGjB,MAAM,CAACM,MAAP,KAAkB,CAAlB,gBACC;IAAK,SAAS,EAAEU,cAAA,CAAMN,KAAtB;IAA6B,KAAK,EAAEH,eAAe,CAACP,MAAM,CAAC,CAAD,CAAP;EAAnD,EADD,gBAGC,yEACE;IAAK,SAAS,EAAEgB,cAAA,CAAME;EAAtB,GACGjB,iBAAiB,CAACkB,GAAlB,CAAsB,CAACT,KAAD,EAAQU,KAAR,kBACrB;IAAK,GAAG,EAAEA,KAAV;IAAiB,SAAS,EAAEJ,cAAA,CAAMN,KAAlC;IAAyC,KAAK,EAAEH,eAAe,CAACG,KAAD;EAA/D,EADD,CADH,CADF,eAME;IAAK,SAAS,EAAEM,cAAA,CAAME;EAAtB,GACGhB,kBAAkB,CAACiB,GAAnB,CAAuB,CAACT,KAAD,EAAQU,KAAR,kBACtB;IAAK,GAAG,EAAEA,KAAV;IAAiB,SAAS,EAAEJ,cAAA,CAAMN,KAAlC;IAAyC,KAAK,EAAEH,eAAe,CAACG,KAAD;EAA/D,EADD,CADH,CANF,CAJJ,CADF;AAoBD,CApCD;;AAsCAX,mBAAmB,CAACsB,SAApB,2CAAgC;EAC9BrB,MAAM,EAAEsB,kBAAA,CAAUC,OAAV,CACND,kBAAA,CAAUE,KAAV,CAAgB;IACdf,IAAI,EAAEa,kBAAA,CAAUG,KAAV,CAAgBC,sCAAhB,CADQ;IAEdhB,KAAK,EAAEY,kBAAA,CAAUK;EAFH,CAAhB,CADM,EAKNC;AAN4B,CAAhC;eASe7B,mB"}
|