@coorpacademy/components 11.32.21 → 11.32.23
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/radio-with-title/index.d.ts +3 -0
- package/es/atom/radio-with-title/index.d.ts.map +1 -1
- package/es/atom/radio-with-title/types.d.ts +3 -0
- package/es/atom/radio-with-title/types.d.ts.map +1 -1
- package/es/atom/tag/index.d.ts +5 -1
- package/es/atom/tag/index.d.ts.map +1 -1
- package/es/atom/tag/index.js +6 -3
- package/es/atom/tag/index.js.map +1 -1
- package/es/atom/title/index.d.ts +3 -0
- package/es/molecule/cm-popin/types.d.ts +7 -0
- package/es/molecule/cm-popin/types.d.ts.map +1 -1
- package/es/molecule/draggable-list/index.d.ts +12 -0
- package/es/molecule/draggable-list/index.d.ts.map +1 -1
- package/es/molecule/draggable-list/index.js +4 -2
- package/es/molecule/draggable-list/index.js.map +1 -1
- package/es/molecule/learning-priority-modal/index.d.ts +30 -0
- package/es/molecule/learning-priority-modal/index.d.ts.map +1 -0
- package/es/molecule/learning-priority-modal/index.js +242 -0
- package/es/molecule/learning-priority-modal/index.js.map +1 -0
- package/es/molecule/learning-priority-modal/style.css +70 -0
- package/es/molecule/learning-priority-setup-item/index.d.ts +18 -0
- package/es/molecule/learning-priority-setup-item/index.d.ts.map +1 -0
- package/es/molecule/learning-priority-setup-item/index.js +83 -0
- package/es/molecule/learning-priority-setup-item/index.js.map +1 -0
- package/es/molecule/learning-priority-setup-item/style.css +47 -0
- package/es/molecule/title-and-checkbox-wrapper/index.d.ts +3 -0
- package/es/molecule/title-radio-wrapper/index.d.ts +3 -0
- package/es/molecule/title-radio-wrapper/index.d.ts.map +1 -1
- package/es/molecule/title-radio-wrapper/types.d.ts +3 -0
- package/es/molecule/title-radio-wrapper/types.d.ts.map +1 -1
- package/es/organism/brand-learning-priorities/index.d.ts +167 -0
- package/es/organism/brand-learning-priorities/index.d.ts.map +1 -0
- package/es/organism/brand-learning-priorities/index.js +131 -0
- package/es/organism/brand-learning-priorities/index.js.map +1 -0
- package/es/organism/brand-learning-priorities/style.css +48 -0
- package/es/organism/list-item/index.d.ts +34 -2
- package/es/organism/list-item/index.d.ts.map +1 -1
- package/es/organism/list-item/index.js +58 -14
- package/es/organism/list-item/index.js.map +1 -1
- package/es/organism/list-item/style.css +25 -1
- package/es/organism/list-items/index.d.ts +4 -0
- package/es/organism/rewards-form/index.d.ts +3 -0
- package/es/organism/select-opponents/index.d.ts +3 -0
- package/es/organism/select-opponents/index.d.ts.map +1 -1
- package/es/organism/select-opponents/types.d.ts +3 -0
- package/es/organism/select-opponents/types.d.ts.map +1 -1
- package/es/organism/title-and-input/index.d.ts +6 -0
- package/es/organism/title-and-input/index.d.ts.map +1 -1
- package/es/organism/title-and-input/types.d.ts +6 -0
- package/es/organism/title-and-input/types.d.ts.map +1 -1
- package/es/organism/wizard-contents/index.d.ts +3 -0
- package/es/template/app-player/loading/index.d.ts +7 -0
- package/es/template/app-player/player/index.d.ts +14 -0
- package/es/template/app-player/player/slides/index.d.ts +7 -0
- package/es/template/app-player/player/slides/index.d.ts.map +1 -1
- package/es/template/app-player/popin-correction/index.d.ts +7 -0
- package/es/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/es/template/app-player/popin-end/index.d.ts +7 -0
- package/es/template/app-review/index.d.ts +7 -0
- package/es/template/app-review/index.d.ts.map +1 -1
- package/es/template/app-review/player/prop-types.d.ts +7 -0
- package/es/template/app-review/player/prop-types.d.ts.map +1 -1
- package/es/template/app-review/prop-types.d.ts +7 -0
- package/es/template/app-review/prop-types.d.ts.map +1 -1
- package/es/template/back-office/brand-update/index.d.ts +149 -0
- package/es/template/back-office/brand-update/index.d.ts.map +1 -1
- package/es/template/back-office/brand-update/index.js +7 -0
- package/es/template/back-office/brand-update/index.js.map +1 -1
- package/es/template/common/dashboard/index.d.ts +18 -1
- package/es/template/common/dashboard/index.d.ts.map +1 -1
- package/es/template/common/dashboard/index.js +11 -5
- package/es/template/common/dashboard/index.js.map +1 -1
- package/es/template/common/search-page/index.d.ts +7 -0
- package/es/template/external-course/index.d.ts +7 -0
- package/es/template/my-learning/index.d.ts +2 -78
- package/es/template/my-learning/index.d.ts.map +1 -1
- package/es/template/my-learning/index.js +3 -7
- package/es/template/my-learning/index.js.map +1 -1
- package/lib/atom/radio-with-title/index.d.ts +3 -0
- package/lib/atom/radio-with-title/index.d.ts.map +1 -1
- package/lib/atom/radio-with-title/types.d.ts +3 -0
- package/lib/atom/radio-with-title/types.d.ts.map +1 -1
- package/lib/atom/tag/index.d.ts +5 -1
- package/lib/atom/tag/index.d.ts.map +1 -1
- package/lib/atom/tag/index.js +6 -3
- package/lib/atom/tag/index.js.map +1 -1
- package/lib/atom/title/index.d.ts +3 -0
- package/lib/molecule/cm-popin/types.d.ts +7 -0
- package/lib/molecule/cm-popin/types.d.ts.map +1 -1
- package/lib/molecule/draggable-list/index.d.ts +12 -0
- package/lib/molecule/draggable-list/index.d.ts.map +1 -1
- package/lib/molecule/draggable-list/index.js +5 -2
- package/lib/molecule/draggable-list/index.js.map +1 -1
- package/lib/molecule/learning-priority-modal/index.d.ts +30 -0
- package/lib/molecule/learning-priority-modal/index.d.ts.map +1 -0
- package/lib/molecule/learning-priority-modal/index.js +265 -0
- package/lib/molecule/learning-priority-modal/index.js.map +1 -0
- package/lib/molecule/learning-priority-modal/style.css +70 -0
- package/lib/molecule/learning-priority-setup-item/index.d.ts +18 -0
- package/lib/molecule/learning-priority-setup-item/index.d.ts.map +1 -0
- package/lib/molecule/learning-priority-setup-item/index.js +100 -0
- package/lib/molecule/learning-priority-setup-item/index.js.map +1 -0
- package/lib/molecule/learning-priority-setup-item/style.css +47 -0
- package/lib/molecule/title-and-checkbox-wrapper/index.d.ts +3 -0
- package/lib/molecule/title-radio-wrapper/index.d.ts +3 -0
- package/lib/molecule/title-radio-wrapper/index.d.ts.map +1 -1
- package/lib/molecule/title-radio-wrapper/types.d.ts +3 -0
- package/lib/molecule/title-radio-wrapper/types.d.ts.map +1 -1
- package/lib/organism/brand-learning-priorities/index.d.ts +167 -0
- package/lib/organism/brand-learning-priorities/index.d.ts.map +1 -0
- package/lib/organism/brand-learning-priorities/index.js +150 -0
- package/lib/organism/brand-learning-priorities/index.js.map +1 -0
- package/lib/organism/brand-learning-priorities/style.css +48 -0
- package/lib/organism/list-item/index.d.ts +34 -2
- package/lib/organism/list-item/index.d.ts.map +1 -1
- package/lib/organism/list-item/index.js +62 -16
- package/lib/organism/list-item/index.js.map +1 -1
- package/lib/organism/list-item/style.css +25 -1
- package/lib/organism/list-items/index.d.ts +4 -0
- package/lib/organism/rewards-form/index.d.ts +3 -0
- package/lib/organism/select-opponents/index.d.ts +3 -0
- package/lib/organism/select-opponents/index.d.ts.map +1 -1
- package/lib/organism/select-opponents/types.d.ts +3 -0
- package/lib/organism/select-opponents/types.d.ts.map +1 -1
- package/lib/organism/title-and-input/index.d.ts +6 -0
- package/lib/organism/title-and-input/index.d.ts.map +1 -1
- package/lib/organism/title-and-input/types.d.ts +6 -0
- package/lib/organism/title-and-input/types.d.ts.map +1 -1
- package/lib/organism/wizard-contents/index.d.ts +3 -0
- package/lib/template/app-player/loading/index.d.ts +7 -0
- package/lib/template/app-player/player/index.d.ts +14 -0
- package/lib/template/app-player/player/slides/index.d.ts +7 -0
- package/lib/template/app-player/player/slides/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-correction/index.d.ts +7 -0
- package/lib/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-end/index.d.ts +7 -0
- package/lib/template/app-review/index.d.ts +7 -0
- package/lib/template/app-review/index.d.ts.map +1 -1
- package/lib/template/app-review/player/prop-types.d.ts +7 -0
- package/lib/template/app-review/player/prop-types.d.ts.map +1 -1
- package/lib/template/app-review/prop-types.d.ts +7 -0
- package/lib/template/app-review/prop-types.d.ts.map +1 -1
- package/lib/template/back-office/brand-update/index.d.ts +149 -0
- package/lib/template/back-office/brand-update/index.d.ts.map +1 -1
- package/lib/template/back-office/brand-update/index.js +8 -0
- package/lib/template/back-office/brand-update/index.js.map +1 -1
- package/lib/template/common/dashboard/index.d.ts +18 -1
- package/lib/template/common/dashboard/index.d.ts.map +1 -1
- package/lib/template/common/dashboard/index.js +12 -6
- package/lib/template/common/dashboard/index.js.map +1 -1
- package/lib/template/common/search-page/index.d.ts +7 -0
- package/lib/template/external-course/index.d.ts +7 -0
- package/lib/template/my-learning/index.d.ts +2 -78
- package/lib/template/my-learning/index.d.ts.map +1 -1
- package/lib/template/my-learning/index.js +4 -11
- package/lib/template/my-learning/index.js.map +1 -1
- package/locales/bs/global.json +13 -1
- package/locales/cs/global.json +13 -1
- package/locales/de/global.json +13 -1
- package/locales/en/global.json +12 -0
- package/locales/es/global.json +13 -1
- package/locales/et/global.json +13 -1
- package/locales/fi/global.json +13 -1
- package/locales/fr/global.json +13 -1
- package/locales/hr/global.json +13 -1
- package/locales/hu/global.json +13 -1
- package/locales/hy/global.json +13 -1
- package/locales/it/global.json +13 -1
- package/locales/ja/global.json +13 -1
- package/locales/ko/global.json +13 -1
- package/locales/nl/global.json +13 -1
- package/locales/pl/global.json +13 -1
- package/locales/pt/global.json +13 -1
- package/locales/ro/global.json +13 -1
- package/locales/ru/global.json +13 -1
- package/locales/sk/global.json +13 -1
- package/locales/sl/global.json +13 -1
- package/locales/sv/global.json +13 -1
- package/locales/tl/global.json +13 -1
- package/locales/tr/global.json +13 -1
- package/locales/uk/global.json +13 -1
- package/locales/vi/global.json +13 -1
- package/locales/zh/global.json +13 -1
- package/locales/zh_TW/global.json +13 -1
- package/package.json +2 -2
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import React, { useCallback } from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
import Provider from '../../atom/provider';
|
|
4
|
+
import Tag from '../../atom/tag';
|
|
5
|
+
import ButtonLink from '../../atom/button-link';
|
|
6
|
+
import style from './style.css';
|
|
7
|
+
|
|
8
|
+
const LearningPrioritySetupItem = (props, context) => {
|
|
9
|
+
const {
|
|
10
|
+
priorityRef,
|
|
11
|
+
id,
|
|
12
|
+
title,
|
|
13
|
+
courses = null,
|
|
14
|
+
type,
|
|
15
|
+
'aria-label': ariaLabel,
|
|
16
|
+
onRemove
|
|
17
|
+
} = props;
|
|
18
|
+
const {
|
|
19
|
+
translate
|
|
20
|
+
} = context;
|
|
21
|
+
const handleRemovePriority = useCallback(() => onRemove(priorityRef, type), [priorityRef, type]);
|
|
22
|
+
|
|
23
|
+
const handleTypeTranslate = itemType => {
|
|
24
|
+
switch (itemType) {
|
|
25
|
+
case 'skill':
|
|
26
|
+
return translate('skill');
|
|
27
|
+
|
|
28
|
+
case 'playlist':
|
|
29
|
+
return translate('playlist');
|
|
30
|
+
|
|
31
|
+
case 'certificate':
|
|
32
|
+
return translate('certificate');
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
37
|
+
className: style.container,
|
|
38
|
+
"aria-label": ariaLabel,
|
|
39
|
+
"data-name": `learning-priority-setup-item-${id}`
|
|
40
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
41
|
+
className: style.containerInfos
|
|
42
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
43
|
+
className: style.titleWrapper
|
|
44
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
45
|
+
className: style.title
|
|
46
|
+
}, title), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Tag, {
|
|
47
|
+
label: handleTypeTranslate(type),
|
|
48
|
+
size: 'S'
|
|
49
|
+
}))), courses !== null ? /*#__PURE__*/React.createElement("span", {
|
|
50
|
+
className: style.courses
|
|
51
|
+
}, `${courses} ${translate('courses')}`) : null), /*#__PURE__*/React.createElement(ButtonLink, {
|
|
52
|
+
type: "primary",
|
|
53
|
+
customStyle: {
|
|
54
|
+
width: 'fit-content',
|
|
55
|
+
backgroundColor: 'transparent'
|
|
56
|
+
},
|
|
57
|
+
hoverBackgroundColor: "#EAEAEB",
|
|
58
|
+
icon: {
|
|
59
|
+
position: 'left',
|
|
60
|
+
faIcon: {
|
|
61
|
+
name: 'trash',
|
|
62
|
+
color: '#515161',
|
|
63
|
+
size: 16
|
|
64
|
+
}
|
|
65
|
+
},
|
|
66
|
+
onClick: handleRemovePriority
|
|
67
|
+
}));
|
|
68
|
+
};
|
|
69
|
+
|
|
70
|
+
LearningPrioritySetupItem.contextTypes = {
|
|
71
|
+
translate: Provider.childContextTypes.translate
|
|
72
|
+
};
|
|
73
|
+
LearningPrioritySetupItem.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
74
|
+
'aria-label': PropTypes.string,
|
|
75
|
+
id: PropTypes.string,
|
|
76
|
+
priorityRef: PropTypes.string,
|
|
77
|
+
title: PropTypes.string,
|
|
78
|
+
courses: PropTypes.number,
|
|
79
|
+
type: PropTypes.oneOf(['skill', 'playlist', 'certificate']),
|
|
80
|
+
onRemove: PropTypes.func
|
|
81
|
+
} : {};
|
|
82
|
+
export default LearningPrioritySetupItem;
|
|
83
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","useCallback","PropTypes","Provider","Tag","ButtonLink","style","LearningPrioritySetupItem","props","context","priorityRef","id","title","courses","type","ariaLabel","onRemove","translate","handleRemovePriority","handleTypeTranslate","itemType","container","containerInfos","titleWrapper","width","backgroundColor","position","faIcon","name","color","size","contextTypes","childContextTypes","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), [priorityRef, type]);\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,OAAOA,KAAP,IAAeC,WAAf,QAAiC,OAAjC;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,GAAP,MAAgB,gBAAhB;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,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,GAAGjB,WAAW,CAAC,MAAMe,QAAQ,CAACN,WAAD,EAAcI,IAAd,CAAf,EAAoC,CAACJ,WAAD,EAAcI,IAAd,CAApC,CAAxC;;EAEA,MAAMK,mBAAmB,GAAGC,QAAQ,IAAI;IACtC,QAAQA,QAAR;MACE,KAAK,OAAL;QACE,OAAOH,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,EAAEX,KAAK,CAACe,SADnB;IAEE,cAAYN,SAFd;IAGE,aAAY,gCAA+BJ,EAAG;EAHhD,gBAKE;IAAK,SAAS,EAAEL,KAAK,CAACgB;EAAtB,gBACE;IAAK,SAAS,EAAEhB,KAAK,CAACiB;EAAtB,gBACE;IAAK,SAAS,EAAEjB,KAAK,CAACM;EAAtB,GAA8BA,KAA9B,CADF,eAEE,8CACE,oBAAC,GAAD;IAAK,KAAK,EAAEO,mBAAmB,CAACL,IAAD,CAA/B;IAAuC,IAAI,EAAE;EAA7C,EADF,CAFF,CADF,EAOGD,OAAO,KAAK,IAAZ,gBACC;IAAM,SAAS,EAAEP,KAAK,CAACO;EAAvB,GAAkC,GAAEA,OAAQ,IAAGI,SAAS,CAAC,SAAD,CAAY,EAApE,CADD,GAEG,IATN,CALF,eAgBE,oBAAC,UAAD;IACE,IAAI,EAAC,SADP;IAEE,WAAW,EAAE;MACXO,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,EAAEZ;EAfX,EAhBF,CADF;AAoCD,CAtDD;;AAwDAX,yBAAyB,CAACwB,YAA1B,GAAyC;EACvCd,SAAS,EAAEd,QAAQ,CAAC6B,iBAAT,CAA2Bf;AADC,CAAzC;AAIAV,yBAAyB,CAAC0B,SAA1B,2CAAsC;EACpC,cAAc/B,SAAS,CAACgC,MADY;EAEpCvB,EAAE,EAAET,SAAS,CAACgC,MAFsB;EAGpCxB,WAAW,EAAER,SAAS,CAACgC,MAHa;EAIpCtB,KAAK,EAAEV,SAAS,CAACgC,MAJmB;EAKpCrB,OAAO,EAAEX,SAAS,CAACiC,MALiB;EAMpCrB,IAAI,EAAEZ,SAAS,CAACkC,KAAV,CAAgB,CAAC,OAAD,EAAU,UAAV,EAAsB,aAAtB,CAAhB,CAN8B;EAOpCpB,QAAQ,EAAEd,SAAS,CAACmC;AAPgB,CAAtC;AAUA,eAAe9B,yBAAf"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
@value colors: "../../variables/colors.css";
|
|
2
|
+
@value cm_grey_50 from colors;
|
|
3
|
+
@value cm_grey_700 from colors;
|
|
4
|
+
@value cm_grey_500 from colors;
|
|
5
|
+
@value cm_grey_400 from colors;
|
|
6
|
+
|
|
7
|
+
.container {
|
|
8
|
+
display: flex;
|
|
9
|
+
justify-content: space-between;
|
|
10
|
+
align-items: center;
|
|
11
|
+
background-color: cm_grey_50;
|
|
12
|
+
font-size: 14px;
|
|
13
|
+
margin-top: 8px;
|
|
14
|
+
padding: 8px 16px;
|
|
15
|
+
border-radius: 7px;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.containerInfos {
|
|
19
|
+
margin-left: 32px;
|
|
20
|
+
overflow: hidden;
|
|
21
|
+
flex-grow: 1;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.titleWrapper {
|
|
25
|
+
display: flex;
|
|
26
|
+
align-items: center;
|
|
27
|
+
gap: 8px;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.title {
|
|
31
|
+
color: cm_grey_700;
|
|
32
|
+
line-height: 22px;
|
|
33
|
+
font-family: Gilroy;
|
|
34
|
+
font-size: 16px;
|
|
35
|
+
font-weight: bold;
|
|
36
|
+
overflow: hidden;
|
|
37
|
+
white-space: nowrap;
|
|
38
|
+
display: inline-block;
|
|
39
|
+
text-overflow: ellipsis;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.courses {
|
|
43
|
+
color: cm_grey_500;
|
|
44
|
+
display: block;
|
|
45
|
+
font-family: Gilroy;
|
|
46
|
+
line-height: 20px;
|
|
47
|
+
}
|
|
@@ -23,6 +23,9 @@ declare namespace TitleAndCheckBoxWrapper {
|
|
|
23
23
|
label: PropTypes.Requireable<string>;
|
|
24
24
|
type: PropTypes.Requireable<string>;
|
|
25
25
|
size: PropTypes.Requireable<string>;
|
|
26
|
+
customStyle: PropTypes.Requireable<{
|
|
27
|
+
[x: string]: string | null | undefined;
|
|
28
|
+
}>;
|
|
26
29
|
}>>;
|
|
27
30
|
}>>;
|
|
28
31
|
const child: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
|
|
@@ -16,6 +16,9 @@ declare const TitleRadioWrapper: {
|
|
|
16
16
|
label: import("prop-types").Requireable<string>;
|
|
17
17
|
type: import("prop-types").Requireable<string>;
|
|
18
18
|
size: import("prop-types").Requireable<string>;
|
|
19
|
+
customStyle: import("prop-types").Requireable<{
|
|
20
|
+
[x: string]: string | null | undefined;
|
|
21
|
+
}>;
|
|
19
22
|
}>>;
|
|
20
23
|
}>>>;
|
|
21
24
|
name: import("prop-types").Requireable<string>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/title-radio-wrapper/index.tsx"],"names":[],"mappings":";AAKA,OAAkB,EAAC,sBAAsB,EAAC,MAAM,SAAS,CAAC;AAqB1D,QAAA,MAAM,iBAAiB;YAAW,sBAAsB
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/title-radio-wrapper/index.tsx"],"names":[],"mappings":";AAKA,OAAkB,EAAC,sBAAsB,EAAC,MAAM,SAAS,CAAC;AAqB1D,QAAA,MAAM,iBAAiB;YAAW,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQvD,CAAC;AAIF,eAAe,iBAAiB,CAAC"}
|
|
@@ -16,6 +16,9 @@ declare const propTypes: {
|
|
|
16
16
|
label: PropTypes.Requireable<string>;
|
|
17
17
|
type: PropTypes.Requireable<string>;
|
|
18
18
|
size: PropTypes.Requireable<string>;
|
|
19
|
+
customStyle: PropTypes.Requireable<{
|
|
20
|
+
[x: string]: string | null | undefined;
|
|
21
|
+
}>;
|
|
19
22
|
}>>;
|
|
20
23
|
}>>>;
|
|
21
24
|
name: PropTypes.Requireable<string>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/title-radio-wrapper/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,kBAAkB,MAAM,iCAAiC,CAAC;AAEjE,OAAO,EAAC,mBAAmB,EAAC,MAAM,mCAAmC,CAAC;AACtE,OAAO,cAAc,MAAM,oBAAoB,CAAC;AAEhD,QAAA,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/title-radio-wrapper/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,kBAAkB,MAAM,iCAAiC,CAAC;AAEjE,OAAO,EAAC,mBAAmB,EAAC,MAAM,mCAAmC,CAAC;AACtE,OAAO,cAAc,MAAM,oBAAoB,CAAC;AAEhD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOd,CAAC;AAEF,oBAAY,sBAAsB,GAAG;IACnC,cAAc,EAAE,mBAAmB,CAAC;IACpC,KAAK,EAAE,OAAO,cAAc,CAAC,SAAS,GAAG,OAAO,kBAAkB,CAAC,SAAS,CAAC;IAC7E,SAAS,EAAE,iBAAiB,GAAG,gBAAgB,CAAC;CACjD,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
@@ -0,0 +1,167 @@
|
|
|
1
|
+
export default BrandLearningPriorities;
|
|
2
|
+
declare function BrandLearningPriorities(props: any, context: any): JSX.Element;
|
|
3
|
+
declare namespace BrandLearningPriorities {
|
|
4
|
+
namespace contextTypes {
|
|
5
|
+
const skin: PropTypes.Requireable<PropTypes.InferProps<{
|
|
6
|
+
common: PropTypes.Requireable<{
|
|
7
|
+
[x: string]: any;
|
|
8
|
+
}>;
|
|
9
|
+
images: PropTypes.Requireable<PropTypes.InferProps<{
|
|
10
|
+
'logo-mobile': PropTypes.Requireable<any>;
|
|
11
|
+
logo: PropTypes.Requireable<any>;
|
|
12
|
+
'logo-email': PropTypes.Requireable<any>;
|
|
13
|
+
login: PropTypes.Requireable<any>;
|
|
14
|
+
}>>;
|
|
15
|
+
icons: PropTypes.Requireable<{
|
|
16
|
+
[x: string]: any;
|
|
17
|
+
}>;
|
|
18
|
+
mod: PropTypes.Requireable<{
|
|
19
|
+
[x: string]: any;
|
|
20
|
+
}>;
|
|
21
|
+
courses: PropTypes.Requireable<any[]>;
|
|
22
|
+
texts: PropTypes.Requireable<{
|
|
23
|
+
[x: string]: any;
|
|
24
|
+
}>;
|
|
25
|
+
}>>;
|
|
26
|
+
const translate: PropTypes.Requireable<(...args: any[]) => any>;
|
|
27
|
+
}
|
|
28
|
+
namespace propTypes {
|
|
29
|
+
const content: PropTypes.Requireable<PropTypes.InferProps<{
|
|
30
|
+
items: PropTypes.Requireable<(NonNullable<PropTypes.InferProps<{
|
|
31
|
+
title: PropTypes.Validator<string>;
|
|
32
|
+
onUp: PropTypes.Requireable<(...args: any[]) => any>;
|
|
33
|
+
onDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
34
|
+
display: PropTypes.Requireable<PropTypes.InferProps<{
|
|
35
|
+
title: PropTypes.Requireable<string>;
|
|
36
|
+
name: PropTypes.Requireable<string>;
|
|
37
|
+
id: PropTypes.Requireable<string>;
|
|
38
|
+
value: PropTypes.Requireable<boolean>;
|
|
39
|
+
disabled: PropTypes.Requireable<boolean>;
|
|
40
|
+
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
41
|
+
description: PropTypes.Requireable<string>;
|
|
42
|
+
'aria-labelledby': PropTypes.Requireable<string>;
|
|
43
|
+
'aria-label': PropTypes.Requireable<string>;
|
|
44
|
+
modified: PropTypes.Requireable<boolean>;
|
|
45
|
+
titlePosition: PropTypes.Requireable<string>;
|
|
46
|
+
theme: PropTypes.Requireable<string>;
|
|
47
|
+
details: PropTypes.Requireable<string>;
|
|
48
|
+
'data-name': PropTypes.Requireable<string>;
|
|
49
|
+
requiredSelection: PropTypes.Requireable<boolean>;
|
|
50
|
+
}>>;
|
|
51
|
+
contentTypes: PropTypes.Requireable<PropTypes.InferProps<{
|
|
52
|
+
modified: PropTypes.Requireable<boolean>;
|
|
53
|
+
color: PropTypes.Requireable<string>;
|
|
54
|
+
theme: PropTypes.Requireable<string>;
|
|
55
|
+
className: PropTypes.Requireable<string>;
|
|
56
|
+
list: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
57
|
+
color: PropTypes.Requireable<string>;
|
|
58
|
+
value: PropTypes.Validator<string>;
|
|
59
|
+
name: PropTypes.Requireable<string>;
|
|
60
|
+
theme: PropTypes.Requireable<string>;
|
|
61
|
+
checked: PropTypes.Requireable<boolean>;
|
|
62
|
+
label: PropTypes.Requireable<string>;
|
|
63
|
+
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
64
|
+
}> | null | undefined)[]>;
|
|
65
|
+
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
66
|
+
}>>;
|
|
67
|
+
}> | PropTypes.InferProps<{
|
|
68
|
+
'aria-label': PropTypes.Requireable<PropTypes.InferProps<{
|
|
69
|
+
title: PropTypes.Requireable<string>;
|
|
70
|
+
author: PropTypes.Requireable<string>;
|
|
71
|
+
modules: PropTypes.Requireable<string>;
|
|
72
|
+
position: PropTypes.Requireable<string>;
|
|
73
|
+
}>>;
|
|
74
|
+
image: PropTypes.Requireable<string>;
|
|
75
|
+
badgeList: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
76
|
+
category: PropTypes.Requireable<string>;
|
|
77
|
+
label: PropTypes.Requireable<string>;
|
|
78
|
+
}> | null | undefined)[]>;
|
|
79
|
+
title: PropTypes.Requireable<string>;
|
|
80
|
+
author: PropTypes.Requireable<string>;
|
|
81
|
+
position: PropTypes.Requireable<number>;
|
|
82
|
+
id: PropTypes.Requireable<string>;
|
|
83
|
+
}> | PropTypes.InferProps<{
|
|
84
|
+
title: PropTypes.Validator<string>;
|
|
85
|
+
subtitle: PropTypes.Requireable<string>;
|
|
86
|
+
selected: PropTypes.Requireable<boolean>;
|
|
87
|
+
dataColumns: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
88
|
+
label: PropTypes.Requireable<string>;
|
|
89
|
+
type: PropTypes.Requireable<string>;
|
|
90
|
+
className: PropTypes.Requireable<string>;
|
|
91
|
+
}> | null | undefined)[]>;
|
|
92
|
+
buttonLink: PropTypes.Requireable<PropTypes.InferProps<{
|
|
93
|
+
type: PropTypes.Requireable<string>;
|
|
94
|
+
label: PropTypes.Requireable<string>;
|
|
95
|
+
ariaLabel: PropTypes.Requireable<string>;
|
|
96
|
+
dataName: PropTypes.Requireable<string>;
|
|
97
|
+
icon: PropTypes.Requireable<PropTypes.InferProps<{
|
|
98
|
+
position: PropTypes.Requireable<string>;
|
|
99
|
+
type: PropTypes.Requireable<string>;
|
|
100
|
+
}>>;
|
|
101
|
+
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
102
|
+
}>>;
|
|
103
|
+
secondButtonLink: PropTypes.Requireable<PropTypes.InferProps<{
|
|
104
|
+
type: PropTypes.Requireable<string>;
|
|
105
|
+
label: PropTypes.Requireable<string>;
|
|
106
|
+
ariaLabel: PropTypes.Requireable<string>;
|
|
107
|
+
dataName: PropTypes.Requireable<string>;
|
|
108
|
+
icon: PropTypes.Requireable<PropTypes.InferProps<{
|
|
109
|
+
position: PropTypes.Requireable<string>;
|
|
110
|
+
type: PropTypes.Requireable<string>;
|
|
111
|
+
}>>;
|
|
112
|
+
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
113
|
+
}>>;
|
|
114
|
+
bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
|
|
115
|
+
buttonAriaLabel: PropTypes.Requireable<string>;
|
|
116
|
+
menuAriaLabel: PropTypes.Requireable<string>;
|
|
117
|
+
buttons: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
118
|
+
'data-name': PropTypes.Requireable<string>;
|
|
119
|
+
label: PropTypes.Requireable<string>;
|
|
120
|
+
type: PropTypes.Requireable<string>;
|
|
121
|
+
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
122
|
+
}> | null | undefined)[]>;
|
|
123
|
+
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
124
|
+
}>>;
|
|
125
|
+
tags: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
126
|
+
label: PropTypes.Requireable<string>;
|
|
127
|
+
type: PropTypes.Requireable<string>;
|
|
128
|
+
}> | null | undefined)[]>;
|
|
129
|
+
disabled: PropTypes.Requireable<boolean>;
|
|
130
|
+
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
131
|
+
isBulkStyle: PropTypes.Requireable<boolean>;
|
|
132
|
+
isOverflowHidden: PropTypes.Requireable<boolean>;
|
|
133
|
+
order: PropTypes.Requireable<number>;
|
|
134
|
+
'aria-label': PropTypes.Requireable<string>;
|
|
135
|
+
contentType: PropTypes.Requireable<string>;
|
|
136
|
+
id: PropTypes.Requireable<string>;
|
|
137
|
+
}> | PropTypes.InferProps<{
|
|
138
|
+
'aria-label': PropTypes.Requireable<string>;
|
|
139
|
+
id: PropTypes.Requireable<string>;
|
|
140
|
+
priorityRef: PropTypes.Requireable<string>;
|
|
141
|
+
title: PropTypes.Requireable<string>;
|
|
142
|
+
courses: PropTypes.Requireable<number>;
|
|
143
|
+
type: PropTypes.Requireable<string>;
|
|
144
|
+
onRemove: PropTypes.Requireable<(...args: any[]) => any>;
|
|
145
|
+
}> | null | undefined> | null | undefined)[]>;
|
|
146
|
+
onDrop: PropTypes.Requireable<(...args: any[]) => any>;
|
|
147
|
+
itemType: PropTypes.Requireable<string>;
|
|
148
|
+
}>>;
|
|
149
|
+
const priorities: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
150
|
+
ref: PropTypes.Requireable<string>;
|
|
151
|
+
title: PropTypes.Requireable<string>;
|
|
152
|
+
courses: PropTypes.Requireable<number>;
|
|
153
|
+
type: PropTypes.Requireable<string>;
|
|
154
|
+
}> | null | undefined)[]>;
|
|
155
|
+
const filters: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
156
|
+
count: PropTypes.Requireable<number>;
|
|
157
|
+
name: PropTypes.Validator<string>;
|
|
158
|
+
value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
|
|
159
|
+
selected: PropTypes.Requireable<boolean>;
|
|
160
|
+
validOption: PropTypes.Requireable<boolean>;
|
|
161
|
+
}> | null | undefined)[]>;
|
|
162
|
+
const isLoading: PropTypes.Requireable<boolean>;
|
|
163
|
+
const onAdd: PropTypes.Requireable<(...args: any[]) => any>;
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
import PropTypes from "prop-types";
|
|
167
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/brand-learning-priorities/index.js"],"names":[],"mappings":";AAYA,gFAiGC"}
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import _get from "lodash/fp/get";
|
|
2
|
+
|
|
3
|
+
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); }
|
|
4
|
+
|
|
5
|
+
import React, { useState, useCallback, useMemo, useEffect } from 'react';
|
|
6
|
+
import PropTypes from 'prop-types';
|
|
7
|
+
import { convert } from 'css-color-function';
|
|
8
|
+
import Provider from '../../atom/provider';
|
|
9
|
+
import Loader from '../../atom/loader';
|
|
10
|
+
import { SelectOptionPropTypes } from '../../atom/select';
|
|
11
|
+
import DraggableList from '../../molecule/draggable-list';
|
|
12
|
+
import ButtonLink from '../../atom/button-link';
|
|
13
|
+
import LearningPriorityModal from '../../molecule/learning-priority-modal';
|
|
14
|
+
import style from './style.css';
|
|
15
|
+
|
|
16
|
+
const BrandLearningPriorities = (props, context) => {
|
|
17
|
+
const {
|
|
18
|
+
content,
|
|
19
|
+
priorities,
|
|
20
|
+
filters,
|
|
21
|
+
isLoading,
|
|
22
|
+
onAdd
|
|
23
|
+
} = props;
|
|
24
|
+
const {
|
|
25
|
+
items,
|
|
26
|
+
onDrop,
|
|
27
|
+
itemType
|
|
28
|
+
} = content;
|
|
29
|
+
const [itemList, setItemList] = useState([...items]);
|
|
30
|
+
const [openModal, setOpenModal] = useState(false);
|
|
31
|
+
const {
|
|
32
|
+
skin,
|
|
33
|
+
translate
|
|
34
|
+
} = context;
|
|
35
|
+
|
|
36
|
+
const primarySkinColor = _get('common.primary', skin);
|
|
37
|
+
|
|
38
|
+
const selectedPriorities = useMemo(() => items.map(priority => priority.priorityRef), [items]);
|
|
39
|
+
const handleDropItem = useCallback((dragRef, dropRef) => {
|
|
40
|
+
const dragIndex = itemList.findIndex(item => item.priorityRef === dragRef);
|
|
41
|
+
const dropIndex = itemList.findIndex(item => item.priorityRef === dropRef);
|
|
42
|
+
if (dragIndex === dropIndex) return;
|
|
43
|
+
const newItems = [...itemList];
|
|
44
|
+
const [dragItem] = newItems.splice(dragIndex, 1);
|
|
45
|
+
newItems.splice(dropIndex, 0, dragItem);
|
|
46
|
+
setItemList(newItems);
|
|
47
|
+
onDrop(newItems.map(item => {
|
|
48
|
+
return {
|
|
49
|
+
type: item.type,
|
|
50
|
+
ref: item.priorityRef
|
|
51
|
+
};
|
|
52
|
+
}));
|
|
53
|
+
}, [itemList, setItemList, onDrop]);
|
|
54
|
+
const Loading = useCallback(() => /*#__PURE__*/React.createElement("div", {
|
|
55
|
+
className: style.loaderContainer
|
|
56
|
+
}, /*#__PURE__*/React.createElement(Loader, {
|
|
57
|
+
className: style.loader,
|
|
58
|
+
theme: "coorpmanager"
|
|
59
|
+
})), []);
|
|
60
|
+
useEffect(() => {
|
|
61
|
+
setItemList(items);
|
|
62
|
+
}, [items]);
|
|
63
|
+
const handleOpenModal = useCallback(() => setOpenModal(true), [setOpenModal]);
|
|
64
|
+
const handleCloseModal = useCallback(() => setOpenModal(false), [setOpenModal]);
|
|
65
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
66
|
+
className: style.container
|
|
67
|
+
}, /*#__PURE__*/React.createElement(LearningPriorityModal, {
|
|
68
|
+
isLoading: isLoading,
|
|
69
|
+
isOpen: openModal,
|
|
70
|
+
onCancel: handleCloseModal,
|
|
71
|
+
onClose: handleCloseModal,
|
|
72
|
+
onAdd: onAdd,
|
|
73
|
+
priorities: priorities,
|
|
74
|
+
filters: filters,
|
|
75
|
+
preselected: selectedPriorities
|
|
76
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
77
|
+
className: style.LPtitle
|
|
78
|
+
}, translate('learning_priorities')), /*#__PURE__*/React.createElement("div", {
|
|
79
|
+
className: style.LPdescription
|
|
80
|
+
}, translate('learning_priorities_brand_description')), isLoading ? /*#__PURE__*/React.createElement(Loading, null) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
81
|
+
className: style.ctaWrapper
|
|
82
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
83
|
+
className: style.priorityCount
|
|
84
|
+
}, `${items.length} ${translate('items')}`), /*#__PURE__*/React.createElement(ButtonLink, {
|
|
85
|
+
customStyle: {
|
|
86
|
+
backgroundColor: primarySkinColor,
|
|
87
|
+
color: '#FFFFFF',
|
|
88
|
+
transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',
|
|
89
|
+
width: 'fit-content'
|
|
90
|
+
},
|
|
91
|
+
hoverBackgroundColor: convert(`color(${primarySkinColor} a(0.07))`),
|
|
92
|
+
hoverColor: primarySkinColor,
|
|
93
|
+
onClick: handleOpenModal,
|
|
94
|
+
label: translate('add_learning_priority'),
|
|
95
|
+
"data-name": "add-learning-priority",
|
|
96
|
+
icon: {
|
|
97
|
+
position: 'left',
|
|
98
|
+
faIcon: {
|
|
99
|
+
name: 'plus',
|
|
100
|
+
backgroundColor: primarySkinColor,
|
|
101
|
+
color: '#FFFFFF',
|
|
102
|
+
size: 16
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
})), /*#__PURE__*/React.createElement(DraggableList, {
|
|
106
|
+
itemType: itemType,
|
|
107
|
+
items: itemList,
|
|
108
|
+
onDrop: handleDropItem
|
|
109
|
+
})));
|
|
110
|
+
};
|
|
111
|
+
|
|
112
|
+
BrandLearningPriorities.contextTypes = {
|
|
113
|
+
skin: Provider.childContextTypes.skin,
|
|
114
|
+
translate: Provider.childContextTypes.translate
|
|
115
|
+
};
|
|
116
|
+
BrandLearningPriorities.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
117
|
+
content: PropTypes.shape(DraggableList.propTypes),
|
|
118
|
+
priorities: PropTypes.arrayOf(PropTypes.shape({
|
|
119
|
+
ref: PropTypes.string,
|
|
120
|
+
title: PropTypes.string,
|
|
121
|
+
courses: PropTypes.number,
|
|
122
|
+
type: PropTypes.string
|
|
123
|
+
})),
|
|
124
|
+
filters: PropTypes.arrayOf(PropTypes.shape(_extends({}, SelectOptionPropTypes, {
|
|
125
|
+
count: PropTypes.number
|
|
126
|
+
}))),
|
|
127
|
+
isLoading: PropTypes.bool,
|
|
128
|
+
onAdd: PropTypes.func
|
|
129
|
+
} : {};
|
|
130
|
+
export default BrandLearningPriorities;
|
|
131
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","useState","useCallback","useMemo","useEffect","PropTypes","convert","Provider","Loader","SelectOptionPropTypes","DraggableList","ButtonLink","LearningPriorityModal","style","BrandLearningPriorities","props","context","content","priorities","filters","isLoading","onAdd","items","onDrop","itemType","itemList","setItemList","openModal","setOpenModal","skin","translate","primarySkinColor","selectedPriorities","map","priority","priorityRef","handleDropItem","dragRef","dropRef","dragIndex","findIndex","item","dropIndex","newItems","dragItem","splice","type","ref","Loading","loaderContainer","loader","handleOpenModal","handleCloseModal","container","LPtitle","LPdescription","ctaWrapper","priorityCount","length","backgroundColor","color","transition","width","position","faIcon","name","size","contextTypes","childContextTypes","propTypes","shape","arrayOf","string","title","courses","number","count","bool","func"],"sources":["../../../src/organism/brand-learning-priorities/index.js"],"sourcesContent":["import React, {useState, useCallback, useMemo, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Loader from '../../atom/loader';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport DraggableList from '../../molecule/draggable-list';\nimport ButtonLink from '../../atom/button-link';\nimport LearningPriorityModal from '../../molecule/learning-priority-modal';\nimport style from './style.css';\n\nconst BrandLearningPriorities = (props, context) => {\n const {content, priorities, filters, isLoading, onAdd} = props;\n const {items, onDrop, itemType} = content;\n const [itemList, setItemList] = useState([...items]);\n const [openModal, setOpenModal] = useState(false);\n const {skin, translate} = context;\n const primarySkinColor = get('common.primary', skin);\n\n const selectedPriorities = useMemo(() => items.map(priority => priority.priorityRef), [items]);\n\n const handleDropItem = useCallback(\n (dragRef, dropRef) => {\n const dragIndex = itemList.findIndex(item => item.priorityRef === dragRef);\n const dropIndex = itemList.findIndex(item => item.priorityRef === dropRef);\n\n if (dragIndex === dropIndex) return;\n\n const newItems = [...itemList];\n const [dragItem] = newItems.splice(dragIndex, 1);\n newItems.splice(dropIndex, 0, dragItem);\n\n setItemList(newItems);\n onDrop(\n newItems.map(item => {\n return {type: item.type, ref: item.priorityRef};\n })\n );\n },\n [itemList, setItemList, onDrop]\n );\n\n const Loading = useCallback(\n () => (\n <div className={style.loaderContainer}>\n <Loader className={style.loader} theme=\"coorpmanager\" />\n </div>\n ),\n []\n );\n\n useEffect(() => {\n setItemList(items);\n }, [items]);\n\n const handleOpenModal = useCallback(() => setOpenModal(true), [setOpenModal]);\n const handleCloseModal = useCallback(() => setOpenModal(false), [setOpenModal]);\n return (\n <div className={style.container}>\n <LearningPriorityModal\n isLoading={isLoading}\n isOpen={openModal}\n onCancel={handleCloseModal}\n onClose={handleCloseModal}\n onAdd={onAdd}\n priorities={priorities}\n filters={filters}\n preselected={selectedPriorities}\n />\n <div className={style.LPtitle}>{translate('learning_priorities')}</div>\n <div className={style.LPdescription}>\n {translate('learning_priorities_brand_description')}\n </div>\n\n {isLoading ? (\n <Loading />\n ) : (\n <>\n <div className={style.ctaWrapper}>\n <div className={style.priorityCount}>{`${items.length} ${translate('items')}`}</div>\n <ButtonLink\n customStyle={{\n backgroundColor: primarySkinColor,\n color: '#FFFFFF',\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n width: 'fit-content'\n }}\n hoverBackgroundColor={convert(`color(${primarySkinColor} a(0.07))`)}\n hoverColor={primarySkinColor}\n onClick={handleOpenModal}\n label={translate('add_learning_priority')}\n data-name=\"add-learning-priority\"\n icon={{\n position: 'left',\n faIcon: {\n name: 'plus',\n backgroundColor: primarySkinColor,\n color: '#FFFFFF',\n size: 16\n }\n }}\n />\n </div>\n <DraggableList itemType={itemType} items={itemList} onDrop={handleDropItem} />\n </>\n )}\n </div>\n );\n};\n\nBrandLearningPriorities.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nBrandLearningPriorities.propTypes = {\n content: PropTypes.shape(DraggableList.propTypes),\n priorities: PropTypes.arrayOf(\n PropTypes.shape({\n ref: PropTypes.string,\n title: PropTypes.string,\n courses: PropTypes.number,\n type: PropTypes.string\n })\n ),\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n ...SelectOptionPropTypes,\n count: PropTypes.number\n })\n ),\n isLoading: PropTypes.bool,\n onAdd: PropTypes.func\n};\n\nexport default BrandLearningPriorities;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
@value colors: "../../variables/colors.css";
|
|
2
|
+
@value cm_grey_500 from colors;
|
|
3
|
+
|
|
4
|
+
.container {
|
|
5
|
+
font-family: "Gilroy";
|
|
6
|
+
font-style: normal;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.LPtitle {
|
|
10
|
+
font-size: 18px;
|
|
11
|
+
font-weight: 700;
|
|
12
|
+
line-height: 24px;
|
|
13
|
+
margin-bottom: 8px;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.LPdescription {
|
|
17
|
+
color: cm_grey_500;
|
|
18
|
+
font-size: 14px;
|
|
19
|
+
font-weight: 600;
|
|
20
|
+
line-height: 20px;
|
|
21
|
+
max-width: 620px;
|
|
22
|
+
margin-bottom: 32px;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.loader {
|
|
26
|
+
width: 60px;
|
|
27
|
+
height: 60px;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.loaderContainer {
|
|
31
|
+
display: flex;
|
|
32
|
+
justify-content: center;
|
|
33
|
+
align-items: center;
|
|
34
|
+
height: 50vh;
|
|
35
|
+
width: 100%;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.ctaWrapper {
|
|
39
|
+
display: flex;
|
|
40
|
+
justify-content: space-between;
|
|
41
|
+
margin-bottom: 16px;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.priorityCount {
|
|
45
|
+
font-size: 16px;
|
|
46
|
+
font-weight: 600;
|
|
47
|
+
line-height: 22px;
|
|
48
|
+
}
|
|
@@ -1,20 +1,50 @@
|
|
|
1
1
|
export default ListItem;
|
|
2
|
-
declare function ListItem({ buttonLink, secondButtonLink, bulletPointMenuButton, tags, title, dataColumns, order, "aria-label": ariaLabel, contentType, isBulkStyle, isOverflowHidden }: {
|
|
2
|
+
declare function ListItem({ buttonLink, secondButtonLink, bulletPointMenuButton, tags, title, selected, subtitle, dataColumns, order, "aria-label": ariaLabel, disabled, contentType, isBulkStyle, isOverflowHidden, onClick }: {
|
|
3
3
|
buttonLink: any;
|
|
4
4
|
secondButtonLink: any;
|
|
5
5
|
bulletPointMenuButton: any;
|
|
6
6
|
tags: any;
|
|
7
7
|
title: any;
|
|
8
|
+
selected: any;
|
|
9
|
+
subtitle: any;
|
|
8
10
|
dataColumns: any;
|
|
9
11
|
order: any;
|
|
10
12
|
"aria-label": any;
|
|
13
|
+
disabled?: boolean | undefined;
|
|
11
14
|
contentType: any;
|
|
12
15
|
isBulkStyle?: boolean | undefined;
|
|
13
16
|
isOverflowHidden?: boolean | undefined;
|
|
14
|
-
|
|
17
|
+
onClick?: import("lodash/fp").LodashNoop | undefined;
|
|
18
|
+
}, context: any): JSX.Element;
|
|
15
19
|
declare namespace ListItem {
|
|
20
|
+
namespace contextTypes {
|
|
21
|
+
const skin: PropTypes.Requireable<PropTypes.InferProps<{
|
|
22
|
+
common: PropTypes.Requireable<{
|
|
23
|
+
[x: string]: any;
|
|
24
|
+
}>;
|
|
25
|
+
images: PropTypes.Requireable<PropTypes.InferProps<{
|
|
26
|
+
'logo-mobile': PropTypes.Requireable<any>;
|
|
27
|
+
logo: PropTypes.Requireable<any>;
|
|
28
|
+
'logo-email': PropTypes.Requireable<any>;
|
|
29
|
+
login: PropTypes.Requireable<any>;
|
|
30
|
+
}>>;
|
|
31
|
+
icons: PropTypes.Requireable<{
|
|
32
|
+
[x: string]: any;
|
|
33
|
+
}>;
|
|
34
|
+
mod: PropTypes.Requireable<{
|
|
35
|
+
[x: string]: any;
|
|
36
|
+
}>;
|
|
37
|
+
courses: PropTypes.Requireable<any[]>;
|
|
38
|
+
texts: PropTypes.Requireable<{
|
|
39
|
+
[x: string]: any;
|
|
40
|
+
}>;
|
|
41
|
+
}>>;
|
|
42
|
+
const translate: PropTypes.Requireable<(...args: any[]) => any>;
|
|
43
|
+
}
|
|
16
44
|
const propTypes: {
|
|
17
45
|
title: PropTypes.Validator<string>;
|
|
46
|
+
subtitle: PropTypes.Requireable<string>;
|
|
47
|
+
selected: PropTypes.Requireable<boolean>;
|
|
18
48
|
dataColumns: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
19
49
|
label: PropTypes.Requireable<string>;
|
|
20
50
|
type: PropTypes.Requireable<string>;
|
|
@@ -57,6 +87,8 @@ declare namespace ListItem {
|
|
|
57
87
|
label: PropTypes.Requireable<string>;
|
|
58
88
|
type: PropTypes.Requireable<string>;
|
|
59
89
|
}> | null | undefined)[]>;
|
|
90
|
+
disabled: PropTypes.Requireable<boolean>;
|
|
91
|
+
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
60
92
|
isBulkStyle: PropTypes.Requireable<boolean>;
|
|
61
93
|
isOverflowHidden: PropTypes.Requireable<boolean>;
|
|
62
94
|
order: PropTypes.Requireable<number>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-item/index.js"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-item/index.js"],"names":[],"mappings":";AAaA;;;;;;;;;;;;;;;;8BAuGC"}
|