@coorpacademy/components 11.32.19 → 11.32.20-alpha.34
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/circular-progress-bar/index.d.ts +15 -0
- package/es/atom/circular-progress-bar/index.d.ts.map +1 -0
- package/es/atom/circular-progress-bar/index.js +86 -0
- package/es/atom/circular-progress-bar/index.js.map +1 -0
- package/es/atom/circular-progress-bar/style.css +51 -0
- package/es/atom/circular-progress-bar/types.d.ts +18 -0
- package/es/atom/circular-progress-bar/types.d.ts.map +1 -0
- package/es/atom/circular-progress-bar/types.js +10 -0
- package/es/atom/circular-progress-bar/types.js.map +1 -0
- package/es/atom/radio-with-title/index.d.ts +6 -0
- package/es/atom/radio-with-title/index.d.ts.map +1 -1
- package/es/atom/radio-with-title/types.d.ts +6 -0
- package/es/atom/radio-with-title/types.d.ts.map +1 -1
- package/es/atom/tag/index.d.ts +6 -1
- package/es/atom/tag/index.d.ts.map +1 -1
- package/es/atom/tag/index.js +16 -11
- package/es/atom/tag/index.js.map +1 -1
- package/es/atom/tag/style.css +39 -19
- package/es/atom/title/index.d.ts +6 -0
- package/es/atom/title/index.d.ts.map +1 -1
- package/es/atom/title/index.js +16 -4
- package/es/atom/title/index.js.map +1 -1
- package/es/atom/title/style.css +13 -0
- package/es/molecule/cm-popin/types.d.ts +6 -0
- package/es/molecule/cm-popin/types.d.ts.map +1 -1
- package/es/molecule/dashboard/cards-list/index.d.ts +2 -0
- package/es/molecule/dashboard/cards-list/index.d.ts.map +1 -1
- package/es/molecule/dashboard/cards-list/index.js +24 -25
- package/es/molecule/dashboard/cards-list/index.js.map +1 -1
- package/es/molecule/dashboard/cards-list/prop-types.d.ts +2 -0
- package/es/molecule/dashboard/cards-list/prop-types.d.ts.map +1 -1
- package/es/molecule/dashboard/cards-list/prop-types.js.map +1 -1
- package/es/molecule/dashboard/cards-list/style.css +12 -29
- package/es/molecule/learning-priority-card/index.d.ts +41 -0
- package/es/molecule/learning-priority-card/index.d.ts.map +1 -0
- package/es/molecule/learning-priority-card/index.js +80 -0
- package/es/molecule/learning-priority-card/index.js.map +1 -0
- package/es/molecule/learning-priority-card/style.css +36 -0
- package/es/molecule/learning-priority-card/types.d.ts +20 -0
- package/es/molecule/learning-priority-card/types.d.ts.map +1 -0
- package/es/molecule/learning-priority-card/types.js +11 -0
- package/es/molecule/learning-priority-card/types.js.map +1 -0
- package/es/molecule/title-and-checkbox-wrapper/index.d.ts +6 -0
- package/es/molecule/title-radio-wrapper/index.d.ts +6 -0
- package/es/molecule/title-radio-wrapper/index.d.ts.map +1 -1
- package/es/molecule/title-radio-wrapper/types.d.ts +6 -0
- package/es/molecule/title-radio-wrapper/types.d.ts.map +1 -1
- package/es/organism/rewards-form/index.d.ts +6 -0
- package/es/organism/select-opponents/index.d.ts +6 -0
- package/es/organism/select-opponents/index.d.ts.map +1 -1
- package/es/organism/select-opponents/types.d.ts +6 -0
- package/es/organism/select-opponents/types.d.ts.map +1 -1
- package/es/organism/title-and-input/index.d.ts +12 -0
- package/es/organism/title-and-input/index.d.ts.map +1 -1
- package/es/organism/title-and-input/types.d.ts +12 -0
- package/es/organism/title-and-input/types.d.ts.map +1 -1
- package/es/organism/wizard-contents/index.d.ts +6 -0
- package/es/template/app-player/loading/index.d.ts +6 -0
- package/es/template/app-player/player/index.d.ts +12 -0
- package/es/template/app-player/player/slides/index.d.ts +6 -0
- package/es/template/app-player/player/slides/index.d.ts.map +1 -1
- package/es/template/app-player/popin-correction/index.d.ts +6 -0
- package/es/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/es/template/app-player/popin-end/index.d.ts +8 -0
- package/es/template/app-player/popin-end/summary.d.ts +2 -0
- package/es/template/app-review/index.d.ts +6 -0
- package/es/template/app-review/index.d.ts.map +1 -1
- package/es/template/app-review/player/prop-types.d.ts +6 -0
- package/es/template/app-review/player/prop-types.d.ts.map +1 -1
- package/es/template/app-review/prop-types.d.ts +6 -0
- package/es/template/app-review/prop-types.d.ts.map +1 -1
- package/es/template/back-office/brand-update/index.d.ts +6 -0
- package/es/template/common/dashboard/index.d.ts +12 -0
- package/es/template/common/search-page/index.d.ts +8 -0
- package/es/template/external-course/index.d.ts +6 -0
- package/es/template/my-learning/index.d.ts +70 -0
- package/es/template/my-learning/index.d.ts.map +1 -1
- package/es/template/my-learning/index.js +12 -2
- package/es/template/my-learning/index.js.map +1 -1
- package/es/template/my-learning/style.css +18 -3
- package/es/template/teams-dashboard/index.d.ts +2 -0
- package/lib/atom/circular-progress-bar/index.d.ts +15 -0
- package/lib/atom/circular-progress-bar/index.d.ts.map +1 -0
- package/lib/atom/circular-progress-bar/index.js +101 -0
- package/lib/atom/circular-progress-bar/index.js.map +1 -0
- package/lib/atom/circular-progress-bar/style.css +51 -0
- package/lib/atom/circular-progress-bar/types.d.ts +18 -0
- package/lib/atom/circular-progress-bar/types.d.ts.map +1 -0
- package/lib/atom/circular-progress-bar/types.js +19 -0
- package/lib/atom/circular-progress-bar/types.js.map +1 -0
- package/lib/atom/radio-with-title/index.d.ts +6 -0
- package/lib/atom/radio-with-title/index.d.ts.map +1 -1
- package/lib/atom/radio-with-title/types.d.ts +6 -0
- package/lib/atom/radio-with-title/types.d.ts.map +1 -1
- package/lib/atom/tag/index.d.ts +6 -1
- package/lib/atom/tag/index.d.ts.map +1 -1
- package/lib/atom/tag/index.js +17 -11
- package/lib/atom/tag/index.js.map +1 -1
- package/lib/atom/tag/style.css +39 -19
- package/lib/atom/title/index.d.ts +6 -0
- package/lib/atom/title/index.d.ts.map +1 -1
- package/lib/atom/title/index.js +18 -4
- package/lib/atom/title/index.js.map +1 -1
- package/lib/atom/title/style.css +13 -0
- package/lib/molecule/cm-popin/types.d.ts +6 -0
- package/lib/molecule/cm-popin/types.d.ts.map +1 -1
- package/lib/molecule/dashboard/cards-list/index.d.ts +2 -0
- package/lib/molecule/dashboard/cards-list/index.d.ts.map +1 -1
- package/lib/molecule/dashboard/cards-list/index.js +25 -25
- package/lib/molecule/dashboard/cards-list/index.js.map +1 -1
- package/lib/molecule/dashboard/cards-list/prop-types.d.ts +2 -0
- package/lib/molecule/dashboard/cards-list/prop-types.d.ts.map +1 -1
- package/lib/molecule/dashboard/cards-list/prop-types.js.map +1 -1
- package/lib/molecule/dashboard/cards-list/style.css +12 -29
- package/lib/molecule/learning-priority-card/index.d.ts +41 -0
- package/lib/molecule/learning-priority-card/index.d.ts.map +1 -0
- package/lib/molecule/learning-priority-card/index.js +98 -0
- package/lib/molecule/learning-priority-card/index.js.map +1 -0
- package/lib/molecule/learning-priority-card/style.css +36 -0
- package/lib/molecule/learning-priority-card/types.d.ts +20 -0
- package/lib/molecule/learning-priority-card/types.d.ts.map +1 -0
- package/lib/molecule/learning-priority-card/types.js +20 -0
- package/lib/molecule/learning-priority-card/types.js.map +1 -0
- package/lib/molecule/title-and-checkbox-wrapper/index.d.ts +6 -0
- package/lib/molecule/title-radio-wrapper/index.d.ts +6 -0
- package/lib/molecule/title-radio-wrapper/index.d.ts.map +1 -1
- package/lib/molecule/title-radio-wrapper/types.d.ts +6 -0
- package/lib/molecule/title-radio-wrapper/types.d.ts.map +1 -1
- package/lib/organism/rewards-form/index.d.ts +6 -0
- package/lib/organism/select-opponents/index.d.ts +6 -0
- package/lib/organism/select-opponents/index.d.ts.map +1 -1
- package/lib/organism/select-opponents/types.d.ts +6 -0
- package/lib/organism/select-opponents/types.d.ts.map +1 -1
- package/lib/organism/title-and-input/index.d.ts +12 -0
- package/lib/organism/title-and-input/index.d.ts.map +1 -1
- package/lib/organism/title-and-input/types.d.ts +12 -0
- package/lib/organism/title-and-input/types.d.ts.map +1 -1
- package/lib/organism/wizard-contents/index.d.ts +6 -0
- package/lib/template/app-player/loading/index.d.ts +6 -0
- package/lib/template/app-player/player/index.d.ts +12 -0
- package/lib/template/app-player/player/slides/index.d.ts +6 -0
- package/lib/template/app-player/player/slides/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-correction/index.d.ts +6 -0
- package/lib/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-end/index.d.ts +8 -0
- package/lib/template/app-player/popin-end/summary.d.ts +2 -0
- package/lib/template/app-review/index.d.ts +6 -0
- package/lib/template/app-review/index.d.ts.map +1 -1
- package/lib/template/app-review/player/prop-types.d.ts +6 -0
- package/lib/template/app-review/player/prop-types.d.ts.map +1 -1
- package/lib/template/app-review/prop-types.d.ts +6 -0
- package/lib/template/app-review/prop-types.d.ts.map +1 -1
- package/lib/template/back-office/brand-update/index.d.ts +6 -0
- package/lib/template/common/dashboard/index.d.ts +12 -0
- package/lib/template/common/search-page/index.d.ts +8 -0
- package/lib/template/external-course/index.d.ts +6 -0
- package/lib/template/my-learning/index.d.ts +70 -0
- package/lib/template/my-learning/index.d.ts.map +1 -1
- package/lib/template/my-learning/index.js +12 -2
- package/lib/template/my-learning/index.js.map +1 -1
- package/lib/template/my-learning/style.css +18 -3
- package/lib/template/teams-dashboard/index.d.ts +2 -0
- package/locales/bs/global.json +1 -0
- package/locales/cs/global.json +1 -0
- package/locales/de/global.json +1 -0
- package/locales/en/global.json +1 -0
- package/locales/es/global.json +1 -0
- package/locales/et/global.json +1 -0
- package/locales/fi/global.json +1 -0
- package/locales/fr/global.json +2 -1
- package/locales/hr/global.json +1 -0
- package/locales/hu/global.json +1 -0
- package/locales/hy/global.json +1 -0
- package/locales/it/global.json +1 -0
- package/locales/ja/global.json +1 -0
- package/locales/ko/global.json +1 -0
- package/locales/nl/global.json +1 -0
- package/locales/pl/global.json +1 -0
- package/locales/pt/global.json +1 -0
- package/locales/ro/global.json +1 -0
- package/locales/ru/global.json +1 -0
- package/locales/sk/global.json +1 -0
- package/locales/sl/global.json +1 -0
- package/locales/sv/global.json +1 -0
- package/locales/tl/global.json +1 -0
- package/locales/tr/global.json +1 -0
- package/locales/uk/global.json +1 -0
- package/locales/vi/global.json +1 -0
- package/locales/zh/global.json +1 -0
- package/locales/zh_TW/global.json +1 -0
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","useCallback","useState","useMemo","PropTypes","convert","Provider","Icon","Picture","ButtonLink","ToolTip","ReviewNoSkills","SearchForm","SkillPickerModal","ResponsiveLearningProfileRadarChart","SkillsChartSideInformationPanel","LearnerSkillCard","searchValueIncluded","formatMinutes","style","ChangeSkillFocusButton","props","context","hovered","setHovered","onClick","skin","translate","primarySkinColor","handleMouseOver","handleMouseLeave","backgroundColor","color","transition","position","faIcon","name","size","contextTypes","childContextTypes","propTypes","func","FilterButton","active","filter","skillTotal","Content","skillFilterNumber","skillFilterNumberInActive","buttonProps","customStyle","width","content","bool","string","number","MyLearning","skills","selectedSkills","skillsInformation","skillsLocales","learnerFeature","isLoading","onSkillFocusConfirm","onReviewSkill","onExploreSkill","open","setOpen","selectedSkillsList","setSelectedSkillsList","skillFocusSelectedOnChart","setSkillFocusSelectedOnChart","undefined","searchValue","setSearchValue","searchResults","setSearchResults","skillRef","activeFilter","setActiveFilter","skillsReviewReady","skill","availableForReview","graphDatas","toFixed","graphLegends","filters","all","review","sumKpi","kpi","skillFocusSelectedOnChartScore","stats","coursedCompletedData","questionsToReviewData","learningTimeData","skillChartPaneLegends","focusedSkill","skillChartPanelProps","title","value","legend","icon","iconName","handleOnDotClick","handleOpenSkillPicker","handleCloseSkillPicker","handleConfirmSkillPicker","focusSkillList","handleSearch","handleSearchReset","ReviewTooltipContent","backgroundContainer","container","skillFocusContainer","skillFocusHeader","skillFocusHeaderWrapper","skillFocusHeaderIcon","faSize","wrapperSize","skillFocusHeaderContent","skillFocusHeaderTitle","skillFocusHeaderDescription","length","skillFocusContent","radarContainer","gradient","fill","stroke","percentage","background","label","skillFocusEmpty","img","skillFocusEmptyTitle","skillFocusEmptyDescription","skillListHeader","skillListHeaderIcon","skillListHeaderContent","skillListHeaderTitle","skillListHeaderDescription","infoIconTooltip","tooltip","toolBarContainer","skillFilterContainer","map","index","handleFilterClick","searchWrapper","placeholder","onChange","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","skillListContainer","skillListEmptyContainer","defaultStats","score","contentCompleted","questionsToReview","handleReviewSkill","handleExploreSkill","includes","arrayOf","objectOf","shape","learningTime"],"sources":["../../../src/template/my-learning/index.js"],"sourcesContent":["import React, {useCallback, useState, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport {get, keys, map, fromPairs, pipe, sumBy, getOr, sortBy} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Icon from '../../atom/icon';\nimport Picture from '../../atom/picture';\nimport ButtonLink from '../../atom/button-link';\nimport ToolTip from '../../atom/tooltip';\nimport ReviewNoSkills from '../../organism/review-no-skills';\nimport SearchForm from '../../molecule/search-form';\nimport SkillPickerModal from '../../molecule/skill-picker-modal';\nimport ResponsiveLearningProfileRadarChart from '../../molecule/learning-profile-radar-chart';\nimport SkillsChartSideInformationPanel from '../../molecule/skills-chart-side-information-panel';\nimport LearnerSkillCard from '../../molecule/learner-skill-card';\nimport searchValueIncluded from '../../util/search-value-included';\nimport {formatMinutes} from '../../util/time-format';\nimport style from './style.css';\n\nconst ChangeSkillFocusButton = (props, context) => {\n const [hovered, setHovered] = useState(false);\n const {onClick} = props;\n const {skin, translate} = context;\n const primarySkinColor = get('common.primary', skin);\n\n const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n return (\n <div\n data-name=\"button-explore-wrapper\"\n onMouseOver={handleMouseOver}\n onMouseLeave={handleMouseLeave}\n >\n <ButtonLink\n customStyle={{\n backgroundColor: hovered\n ? primarySkinColor\n : 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={onClick}\n label={translate('skills_change_focus')}\n data-name=\"change-skill-focus-button\"\n icon={{\n position: 'left',\n faIcon: {\n name: 'arrows-rotate',\n backgroundColor: hovered\n ? primarySkinColor\n : convert(`color(${primarySkinColor} a(0.07))`),\n color: hovered ? '#FFFFFF' : primarySkinColor,\n size: 16\n }\n }}\n />\n </div>\n );\n};\n\nChangeSkillFocusButton.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nChangeSkillFocusButton.propTypes = {\n onClick: PropTypes.func\n};\n\nconst FilterButton = (props, context) => {\n const {active, filter, skillTotal, 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 {skillTotal}\n </span>\n </div>\n ),\n [filter, skillTotal, active, primarySkinColor]\n );\n\n const buttonProps = {\n customStyle: {\n backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : '#FFFFFF',\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 skillTotal: PropTypes.number,\n onClick: PropTypes.func\n};\n\nconst MyLearning = (props, context) => {\n const {\n skills,\n selectedSkills = [],\n skillsInformation,\n skillsLocales,\n learnerFeature = true,\n isLoading,\n onSkillFocusConfirm,\n onReviewSkill,\n onExploreSkill\n } = props;\n const {skin, translate} = context;\n const primarySkinColor = get('common.primary', skin);\n const [open, setOpen] = useState(false);\n const [selectedSkillsList, setSelectedSkillsList] = useState(selectedSkills);\n const [skillFocusSelectedOnChart, setSkillFocusSelectedOnChart] = useState(undefined);\n const [searchValue, setSearchValue] = useState('');\n const [searchResults, setSearchResults] = useState(\n sortBy(skillRef => -getOr(0, [skillRef, 'stats', 'score'], skillsInformation), skills)\n );\n const [activeFilter, setActiveFilter] = useState('all');\n const [hovered, setHovered] = useState(false);\n\n const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n const skillsReviewReady = useMemo(() => {\n return searchResults.filter(skill =>\n skillsInformation[skill] ? skillsInformation[skill].availableForReview : false\n );\n }, [searchResults, skillsInformation]);\n\n const graphDatas = useMemo(\n () =>\n pipe(\n map(skill => [skill, getOr(0, [skill, 'stats', 'score'], skillsInformation).toFixed(1)]),\n fromPairs\n )(selectedSkillsList),\n [selectedSkillsList, skillsInformation]\n );\n\n const graphLegends = useMemo(\n () =>\n pipe(\n map(skill => [skill, skillsLocales[skill]]),\n fromPairs\n )(selectedSkillsList),\n [selectedSkillsList, skillsLocales]\n );\n\n const filters = useMemo(() => {\n return {\n all: searchResults,\n review: skillsReviewReady\n };\n }, [searchResults, skillsReviewReady]);\n\n const sumKpi = useCallback(\n kpi => {\n const skillFocusSelectedOnChartScore = getOr(\n 0,\n [skillFocusSelectedOnChart, 'stats', `${kpi}`],\n skillsInformation\n );\n return skillFocusSelectedOnChart\n ? skillFocusSelectedOnChartScore\n : sumBy(\n skill => (skillsInformation[skill] ? skillsInformation[skill].stats[kpi] : 0),\n selectedSkillsList\n );\n },\n [skillFocusSelectedOnChart, skillsInformation, selectedSkillsList]\n );\n\n const coursedCompletedData = useMemo(() => sumKpi('contentCompleted'), [sumKpi]);\n\n const questionsToReviewData = useMemo(() => sumKpi('questionsToReview'), [sumKpi]);\n\n const learningTimeData = useMemo(() => sumKpi('learningTime'), [sumKpi]);\n\n const skillChartPaneLegends = useMemo(\n () =>\n translate('skill_scope_specifier', {\n focusedSkill: skillFocusSelectedOnChart\n ? skillsLocales[skillFocusSelectedOnChart]\n : translate('focused_skills')\n }),\n [translate, skillsLocales, skillFocusSelectedOnChart]\n );\n const skillChartPanelProps = [\n {\n title: translate('skill_chart_side_panel_content_completed'),\n value: `${coursedCompletedData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'book-open-cover', backgroundColor: '#D9F4F7'}\n },\n {\n title: translate('skill_chart_side_panel_learning_hours'),\n value: formatMinutes(learningTimeData),\n legend: skillChartPaneLegends,\n icon: {iconName: 'clock', backgroundColor: '#FAD6DE'}\n },\n {\n title: translate('skill_chart_side_panel_questions_to_review'),\n value: `${questionsToReviewData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'circle-question', backgroundColor: '#FFDCD1'}\n }\n ];\n\n const handleOnDotClick = useCallback(\n skillRef => {\n setSkillFocusSelectedOnChart(skillRef);\n },\n [setSkillFocusSelectedOnChart]\n );\n const handleOpenSkillPicker = useCallback(() => setOpen(true), [setOpen]);\n const handleCloseSkillPicker = useCallback(() => setOpen(false), [setOpen]);\n const handleConfirmSkillPicker = useCallback(\n focusSkillList => {\n setSelectedSkillsList(focusSkillList);\n onSkillFocusConfirm(focusSkillList);\n setOpen(false);\n },\n [onSkillFocusConfirm, setSelectedSkillsList, setOpen]\n );\n const handleSearch = useCallback(\n value => {\n setSearchValue(value);\n setSearchResults(skills.filter(skill => searchValueIncluded(skillsLocales[skill], value)));\n },\n [skills, skillsLocales, setSearchValue, setSearchResults]\n );\n const handleSearchReset = useCallback(() => {\n setSearchValue('');\n setSearchResults(skills);\n }, [skills, setSearchValue, setSearchResults]);\n\n const ReviewTooltipContent = useCallback(\n () => (\n <div>\n <div>\n <b>{translate('review_mode_tooltip_header')}</b>\n </div>\n <p>{translate('review_mode_tooltip_content')}</p>\n <ol>\n <li>{translate('review_mode_tooltip_content_part1')}</li>\n <li>{translate('review_mode_tooltip_content_part2')}</li>\n <li>{translate('review_mode_tooltip_content_part3')}</li>\n <li>{translate('review_mode_tooltip_content_part4')}</li>\n </ol>\n </div>\n ),\n [translate]\n );\n\n return (\n <div className={style.backgroundContainer}>\n <div className={style.container}>\n <SkillPickerModal\n skills={skills}\n selectedSkills={selectedSkillsList}\n skillsLocales={skillsLocales}\n isOpen={open}\n isLoading={isLoading}\n onCancel={handleCloseSkillPicker}\n onConfirm={handleConfirmSkillPicker}\n onClose={handleCloseSkillPicker}\n />\n {learnerFeature ? (\n <div data-name=\"skill-focus-container\" className={style.skillFocusContainer}>\n <header className={style.skillFocusHeader}>\n <div className={style.skillFocusHeaderWrapper}>\n <div className={style.skillFocusHeaderIcon}>\n <Icon\n iconName=\"bullseye-arrow\"\n backgroundColor=\"#DDD1FF\"\n borderRadius=\"12px\"\n size={{faSize: 20, wrapperSize: 48}}\n />\n </div>\n <div className={style.skillFocusHeaderContent}>\n <div data-name=\"skill-focus-title\" className={style.skillFocusHeaderTitle}>\n {translate('skills_focus')}\n </div>\n <div\n data-name=\"skill-focus-description\"\n className={style.skillFocusHeaderDescription}\n >\n {translate('skills_focus_description')}\n </div>\n </div>\n </div>\n {selectedSkillsList.length >= 3 ? (\n <ChangeSkillFocusButton onClick={handleOpenSkillPicker} />\n ) : null}\n </header>\n {selectedSkillsList.length >= 3 ? (\n <div className={style.skillFocusContent}>\n <div className={style.radarContainer}>\n <ResponsiveLearningProfileRadarChart\n totalDataset={1}\n height={424}\n width={680}\n data={graphDatas}\n legend={graphLegends}\n onClick={handleOnDotClick}\n onExploreClick={onExploreSkill}\n colors={[\n {\n gradient: {\n fill: ['#0062ffff', '#8000ff85'],\n stroke: ['#0062ffff', '#8000FF']\n },\n percentage: {\n color: primarySkinColor,\n background: convert(`color(${primarySkinColor} a(0.07))`)\n },\n label: {\n color: '#020202ff'\n }\n }\n ]}\n />\n </div>\n <SkillsChartSideInformationPanel sidePanelItems={skillChartPanelProps} />\n </div>\n ) : (\n <div className={style.skillFocusEmpty}>\n <Picture\n className={style.img}\n src=\"https://static.coorpacademy.com/assets/images/mylearning-no-skill-selected-placeholder.svg\"\n alt=\"demo\"\n />\n <div className={style.skillFocusEmptyTitle}>\n {translate('skills_focus_empty_title')}\n </div>\n <div className={style.skillFocusEmptyDescription}>\n {translate('skills_focus_empty_description')}\n </div>\n <div onMouseOver={handleMouseOver} onMouseLeave={handleMouseLeave}>\n <ButtonLink\n label={translate('skills_choose_focus')}\n type=\"primary\"\n customStyle={{\n width: 'fit-contain',\n backgroundColor: hovered\n ? convert(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`)\n : primarySkinColor\n }}\n onClick={handleOpenSkillPicker}\n />\n </div>\n </div>\n )}\n </div>\n ) : null}\n <header className={style.skillListHeader}>\n <div className={style.skillListHeaderIcon}>\n <Icon\n iconName=\"dumbbell\"\n backgroundColor=\"#FFF9D1\"\n size={{faSize: 20, wrapperSize: 48}}\n />\n </div>\n <div className={style.skillListHeaderContent}>\n <div className={style.skillListHeaderTitle}>{translate('skills_section_title')}</div>\n <div className={style.skillListHeaderDescription}>\n {translate('skills_section_description')}\n <ToolTip\n fontSize={12}\n iconContainerClassName={style.infoIconTooltip}\n tooltipClassName={style.tooltip}\n TooltipContent={ReviewTooltipContent}\n closeToolTipInformationTextAriaLabel={translate('close_tooltip_information')}\n />\n </div>\n </div>\n </header>\n <div className={style.toolBarContainer}>\n <div className={style.skillFilterContainer}>\n {keys(filters).map((filter, index) => {\n function handleFilterClick() {\n setActiveFilter(filter);\n }\n\n return (\n <div key={index}>\n <FilterButton\n active={activeFilter === filter}\n filter={\n filter === 'all' ? translate('all') : translate('review_mode_available')\n }\n skillTotal={filters[filter].length}\n onClick={handleFilterClick}\n />\n </div>\n );\n })}\n </div>\n <div className={style.searchWrapper}>\n <SearchForm\n search={{\n placeholder: translate('search_place_holder'),\n value: searchValue,\n onChange: handleSearch\n }}\n onReset={handleSearchReset}\n />\n </div>\n </div>\n {searchValue && searchResults.length === 0 ? (\n <div className={style.emptySearchResultContainer}>\n <div className={style.emptySearchResultTitle}>\n {translate('empty_search_result_title', {searchValue})}\n </div>\n <div className={style.emptySearchResultDescription}>\n {translate('empty_search_result_description')}\n </div>\n <div className={style.emptySearchResultClearSearch} onClick={handleSearchReset}>\n {translate('empty_search_result_clear_search')}\n </div>\n </div>\n ) : (\n <div className={style.skillListContainer}>\n {activeFilter === 'review_mode_available' && filters[activeFilter].length === 0 ? (\n <div className={style.skillListEmptyContainer}>\n <ReviewNoSkills\n titleNoSkills={translate('review_skill_empty')}\n textNoSkills={translate('review_skill_empty_description')}\n iconSkillAriaLabel={translate('review_skill_empty')}\n imagePosition=\"top\"\n />\n </div>\n ) : (\n filters[activeFilter].map((skill, index) => {\n const defaultStats = {\n score: 0,\n content: 0,\n contentCompleted: 0,\n questionsToReview: 0\n };\n\n function handleReviewSkill() {\n onReviewSkill(skill);\n }\n function handleExploreSkill() {\n onExploreSkill(skill);\n }\n const {score, content, questionsToReview, contentCompleted} = skillsInformation[\n skill\n ]\n ? skillsInformation[skill].stats\n : defaultStats;\n return (\n <div key={index}>\n <LearnerSkillCard\n skillTitle={skillsLocales[skill]}\n focus={selectedSkills.includes(skill)}\n metrics={{\n score: score.toFixed(1),\n content,\n questionsToReview,\n contentCompleted\n }}\n review={\n skillsInformation[skill]\n ? skillsInformation[skill].availableForReview\n : false\n }\n onReviewClick={handleReviewSkill}\n onExploreClick={handleExploreSkill}\n />\n </div>\n );\n })\n )}\n </div>\n )}\n </div>\n </div>\n );\n};\n\nMyLearning.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nMyLearning.propTypes = {\n skills: PropTypes.arrayOf(PropTypes.string),\n selectedSkills: PropTypes.arrayOf(PropTypes.string),\n skillsInformation: PropTypes.objectOf(\n PropTypes.shape({\n availableForReview: PropTypes.bool,\n stats: PropTypes.shape({\n score: PropTypes.number,\n content: PropTypes.number,\n contentCompleted: PropTypes.number,\n questionsToReview: PropTypes.number,\n learningTime: PropTypes.number\n })\n })\n ),\n skillsLocales: PropTypes.objectOf(PropTypes.string),\n learnerFeature: PropTypes.bool,\n isLoading: PropTypes.bool,\n onSkillFocusConfirm: PropTypes.func,\n onReviewSkill: PropTypes.func,\n onExploreSkill: PropTypes.func\n};\n\nexport default MyLearning;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","useCallback","useState","useMemo","PropTypes","convert","Provider","Icon","Picture","ButtonLink","ToolTip","ReviewNoSkills","SearchForm","SkillPickerModal","ResponsiveLearningProfileRadarChart","SkillsChartSideInformationPanel","LearnerSkillCard","searchValueIncluded","formatMinutes","CardsList","style","ChangeSkillFocusButton","props","context","hovered","setHovered","onClick","skin","translate","primarySkinColor","handleMouseOver","handleMouseLeave","backgroundColor","color","transition","position","faIcon","name","size","contextTypes","childContextTypes","propTypes","func","FilterButton","active","filter","skillTotal","Content","skillFilterNumber","skillFilterNumberInActive","buttonProps","customStyle","width","content","bool","string","number","MyLearning","skills","selectedSkills","skillsInformation","skillsLocales","learnerFeature","isLoading","onSkillFocusConfirm","onReviewSkill","onExploreSkill","learningPriorities","open","setOpen","selectedSkillsList","setSelectedSkillsList","skillFocusSelectedOnChart","setSkillFocusSelectedOnChart","undefined","searchValue","setSearchValue","searchResults","setSearchResults","skillRef","activeFilter","setActiveFilter","skillsReviewReady","skill","availableForReview","graphDatas","toFixed","graphLegends","filters","all","review","sumKpi","kpi","skillFocusSelectedOnChartScore","stats","coursedCompletedData","questionsToReviewData","learningTimeData","skillChartPaneLegends","focusedSkill","skillChartPanelProps","title","value","legend","icon","iconName","handleOnDotClick","handleOpenSkillPicker","handleCloseSkillPicker","handleConfirmSkillPicker","focusSkillList","handleSearch","handleSearchReset","ReviewTooltipContent","backgroundContainer","cardsListContainer","container","skillFocusContainer","skillFocusHeader","skillFocusHeaderWrapper","skillFocusHeaderIcon","faSize","wrapperSize","skillFocusHeaderContent","skillFocusHeaderTitle","skillFocusHeaderDescription","length","skillFocusContent","radarContainer","gradient","fill","stroke","percentage","background","label","skillFocusEmpty","img","skillFocusEmptyTitle","skillFocusEmptyDescription","skillListHeader","skillListHeaderIcon","skillListHeaderContent","skillListHeaderTitle","skillListHeaderDescription","infoIconTooltip","tooltip","toolBarContainer","skillFilterContainer","map","index","handleFilterClick","searchWrapper","placeholder","onChange","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","skillListContainer","skillListEmptyContainer","defaultStats","score","contentCompleted","questionsToReview","handleReviewSkill","handleExploreSkill","includes","arrayOf","objectOf","shape","learningTime"],"sources":["../../../src/template/my-learning/index.js"],"sourcesContent":["import React, {useCallback, useState, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport {get, keys, map, fromPairs, pipe, sumBy, getOr, sortBy} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Icon from '../../atom/icon';\nimport Picture from '../../atom/picture';\nimport ButtonLink from '../../atom/button-link';\nimport ToolTip from '../../atom/tooltip';\nimport ReviewNoSkills from '../../organism/review-no-skills';\nimport SearchForm from '../../molecule/search-form';\nimport SkillPickerModal from '../../molecule/skill-picker-modal';\nimport ResponsiveLearningProfileRadarChart from '../../molecule/learning-profile-radar-chart';\nimport SkillsChartSideInformationPanel from '../../molecule/skills-chart-side-information-panel';\nimport LearnerSkillCard from '../../molecule/learner-skill-card';\nimport searchValueIncluded from '../../util/search-value-included';\nimport {formatMinutes} from '../../util/time-format';\nimport CardsList from '../../molecule/dashboard/cards-list';\nimport style from './style.css';\n\nconst ChangeSkillFocusButton = (props, context) => {\n const [hovered, setHovered] = useState(false);\n const {onClick} = props;\n const {skin, translate} = context;\n const primarySkinColor = get('common.primary', skin);\n\n const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n return (\n <div\n data-name=\"button-explore-wrapper\"\n onMouseOver={handleMouseOver}\n onMouseLeave={handleMouseLeave}\n >\n <ButtonLink\n customStyle={{\n backgroundColor: hovered\n ? primarySkinColor\n : 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={onClick}\n label={translate('skills_change_focus')}\n data-name=\"change-skill-focus-button\"\n icon={{\n position: 'left',\n faIcon: {\n name: 'arrows-rotate',\n backgroundColor: hovered\n ? primarySkinColor\n : convert(`color(${primarySkinColor} a(0.07))`),\n color: hovered ? '#FFFFFF' : primarySkinColor,\n size: 16\n }\n }}\n />\n </div>\n );\n};\n\nChangeSkillFocusButton.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nChangeSkillFocusButton.propTypes = {\n onClick: PropTypes.func\n};\n\nconst FilterButton = (props, context) => {\n const {active, filter, skillTotal, 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 {skillTotal}\n </span>\n </div>\n ),\n [filter, skillTotal, active, primarySkinColor]\n );\n\n const buttonProps = {\n customStyle: {\n backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : '#FFFFFF',\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 skillTotal: PropTypes.number,\n onClick: PropTypes.func\n};\n\nconst MyLearning = (props, context) => {\n const {\n skills,\n selectedSkills = [],\n skillsInformation,\n skillsLocales,\n learnerFeature = true,\n isLoading,\n onSkillFocusConfirm,\n onReviewSkill,\n onExploreSkill,\n learningPriorities\n } = props;\n const {skin, translate} = context;\n const primarySkinColor = get('common.primary', skin);\n const [open, setOpen] = useState(false);\n const [selectedSkillsList, setSelectedSkillsList] = useState(selectedSkills);\n const [skillFocusSelectedOnChart, setSkillFocusSelectedOnChart] = useState(undefined);\n const [searchValue, setSearchValue] = useState('');\n const [searchResults, setSearchResults] = useState(\n sortBy(skillRef => -getOr(0, [skillRef, 'stats', 'score'], skillsInformation), skills)\n );\n const [activeFilter, setActiveFilter] = useState('all');\n const [hovered, setHovered] = useState(false);\n\n const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n const skillsReviewReady = useMemo(() => {\n return searchResults.filter(skill =>\n skillsInformation[skill] ? skillsInformation[skill].availableForReview : false\n );\n }, [searchResults, skillsInformation]);\n\n const graphDatas = useMemo(\n () =>\n pipe(\n map(skill => [skill, getOr(0, [skill, 'stats', 'score'], skillsInformation).toFixed(1)]),\n fromPairs\n )(selectedSkillsList),\n [selectedSkillsList, skillsInformation]\n );\n\n const graphLegends = useMemo(\n () =>\n pipe(\n map(skill => [skill, skillsLocales[skill]]),\n fromPairs\n )(selectedSkillsList),\n [selectedSkillsList, skillsLocales]\n );\n\n const filters = useMemo(() => {\n return {\n all: searchResults,\n review: skillsReviewReady\n };\n }, [searchResults, skillsReviewReady]);\n\n const sumKpi = useCallback(\n kpi => {\n const skillFocusSelectedOnChartScore = getOr(\n 0,\n [skillFocusSelectedOnChart, 'stats', `${kpi}`],\n skillsInformation\n );\n return skillFocusSelectedOnChart\n ? skillFocusSelectedOnChartScore\n : sumBy(\n skill => (skillsInformation[skill] ? skillsInformation[skill].stats[kpi] : 0),\n selectedSkillsList\n );\n },\n [skillFocusSelectedOnChart, skillsInformation, selectedSkillsList]\n );\n\n const coursedCompletedData = useMemo(() => sumKpi('contentCompleted'), [sumKpi]);\n\n const questionsToReviewData = useMemo(() => sumKpi('questionsToReview'), [sumKpi]);\n\n const learningTimeData = useMemo(() => sumKpi('learningTime'), [sumKpi]);\n\n const skillChartPaneLegends = useMemo(\n () =>\n translate('skill_scope_specifier', {\n focusedSkill: skillFocusSelectedOnChart\n ? skillsLocales[skillFocusSelectedOnChart]\n : translate('focused_skills')\n }),\n [translate, skillsLocales, skillFocusSelectedOnChart]\n );\n const skillChartPanelProps = [\n {\n title: translate('skill_chart_side_panel_content_completed'),\n value: `${coursedCompletedData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'book-open-cover', backgroundColor: '#D9F4F7'}\n },\n {\n title: translate('skill_chart_side_panel_learning_hours'),\n value: formatMinutes(learningTimeData),\n legend: skillChartPaneLegends,\n icon: {iconName: 'clock', backgroundColor: '#FAD6DE'}\n },\n {\n title: translate('skill_chart_side_panel_questions_to_review'),\n value: `${questionsToReviewData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'circle-question', backgroundColor: '#FFDCD1'}\n }\n ];\n\n const handleOnDotClick = useCallback(\n skillRef => {\n setSkillFocusSelectedOnChart(skillRef);\n },\n [setSkillFocusSelectedOnChart]\n );\n const handleOpenSkillPicker = useCallback(() => setOpen(true), [setOpen]);\n const handleCloseSkillPicker = useCallback(() => setOpen(false), [setOpen]);\n const handleConfirmSkillPicker = useCallback(\n focusSkillList => {\n setSelectedSkillsList(focusSkillList);\n onSkillFocusConfirm(focusSkillList);\n setOpen(false);\n },\n [onSkillFocusConfirm, setSelectedSkillsList, setOpen]\n );\n const handleSearch = useCallback(\n value => {\n setSearchValue(value);\n setSearchResults(skills.filter(skill => searchValueIncluded(skillsLocales[skill], value)));\n },\n [skills, skillsLocales, setSearchValue, setSearchResults]\n );\n const handleSearchReset = useCallback(() => {\n setSearchValue('');\n setSearchResults(skills);\n }, [skills, setSearchValue, setSearchResults]);\n\n const ReviewTooltipContent = useCallback(\n () => (\n <div>\n <div>\n <b>{translate('review_mode_tooltip_header')}</b>\n </div>\n <p>{translate('review_mode_tooltip_content')}</p>\n <ol>\n <li>{translate('review_mode_tooltip_content_part1')}</li>\n <li>{translate('review_mode_tooltip_content_part2')}</li>\n <li>{translate('review_mode_tooltip_content_part3')}</li>\n <li>{translate('review_mode_tooltip_content_part4')}</li>\n </ol>\n </div>\n ),\n [translate]\n );\n\n return (\n <div className={style.backgroundContainer}>\n <div className={style.cardsListContainer}>\n <CardsList {...learningPriorities} arrows-aria-label={''} />\n </div>\n <div className={style.container}>\n <SkillPickerModal\n skills={skills}\n selectedSkills={selectedSkillsList}\n skillsLocales={skillsLocales}\n isOpen={open}\n isLoading={isLoading}\n onCancel={handleCloseSkillPicker}\n onConfirm={handleConfirmSkillPicker}\n onClose={handleCloseSkillPicker}\n />\n {learnerFeature ? (\n <div data-name=\"skill-focus-container\" className={style.skillFocusContainer}>\n <header className={style.skillFocusHeader}>\n <div className={style.skillFocusHeaderWrapper}>\n <div className={style.skillFocusHeaderIcon}>\n <Icon\n iconName=\"bullseye-arrow\"\n backgroundColor=\"#DDD1FF\"\n borderRadius=\"12px\"\n size={{faSize: 20, wrapperSize: 48}}\n />\n </div>\n <div className={style.skillFocusHeaderContent}>\n <div data-name=\"skill-focus-title\" className={style.skillFocusHeaderTitle}>\n {translate('skills_focus')}\n </div>\n <div\n data-name=\"skill-focus-description\"\n className={style.skillFocusHeaderDescription}\n >\n {translate('skills_focus_description')}\n </div>\n </div>\n </div>\n {selectedSkillsList.length >= 3 ? (\n <ChangeSkillFocusButton onClick={handleOpenSkillPicker} />\n ) : null}\n </header>\n {selectedSkillsList.length >= 3 ? (\n <div className={style.skillFocusContent}>\n <div className={style.radarContainer}>\n <ResponsiveLearningProfileRadarChart\n totalDataset={1}\n height={424}\n width={680}\n data={graphDatas}\n legend={graphLegends}\n onClick={handleOnDotClick}\n onExploreClick={onExploreSkill}\n colors={[\n {\n gradient: {\n fill: ['#0062ffff', '#8000ff85'],\n stroke: ['#0062ffff', '#8000FF']\n },\n percentage: {\n color: primarySkinColor,\n background: convert(`color(${primarySkinColor} a(0.07))`)\n },\n label: {\n color: '#020202ff'\n }\n }\n ]}\n />\n </div>\n <SkillsChartSideInformationPanel sidePanelItems={skillChartPanelProps} />\n </div>\n ) : (\n <div className={style.skillFocusEmpty}>\n <Picture\n className={style.img}\n src=\"https://static.coorpacademy.com/assets/images/mylearning-no-skill-selected-placeholder.svg\"\n alt=\"demo\"\n />\n <div className={style.skillFocusEmptyTitle}>\n {translate('skills_focus_empty_title')}\n </div>\n <div className={style.skillFocusEmptyDescription}>\n {translate('skills_focus_empty_description')}\n </div>\n <div onMouseOver={handleMouseOver} onMouseLeave={handleMouseLeave}>\n <ButtonLink\n label={translate('skills_choose_focus')}\n type=\"primary\"\n customStyle={{\n width: 'fit-contain',\n backgroundColor: hovered\n ? convert(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`)\n : primarySkinColor\n }}\n onClick={handleOpenSkillPicker}\n />\n </div>\n </div>\n )}\n </div>\n ) : null}\n <header className={style.skillListHeader}>\n <div className={style.skillListHeaderIcon}>\n <Icon\n iconName=\"dumbbell\"\n backgroundColor=\"#FFF9D1\"\n size={{faSize: 20, wrapperSize: 48}}\n />\n </div>\n <div className={style.skillListHeaderContent}>\n <div className={style.skillListHeaderTitle}>{translate('skills_section_title')}</div>\n <div className={style.skillListHeaderDescription}>\n {translate('skills_section_description')}\n <ToolTip\n fontSize={12}\n iconContainerClassName={style.infoIconTooltip}\n tooltipClassName={style.tooltip}\n TooltipContent={ReviewTooltipContent}\n closeToolTipInformationTextAriaLabel={translate('close_tooltip_information')}\n />\n </div>\n </div>\n </header>\n <div className={style.toolBarContainer}>\n <div className={style.skillFilterContainer}>\n {keys(filters).map((filter, index) => {\n function handleFilterClick() {\n setActiveFilter(filter);\n }\n\n return (\n <div key={index}>\n <FilterButton\n active={activeFilter === filter}\n filter={\n filter === 'all' ? translate('all') : translate('review_mode_available')\n }\n skillTotal={filters[filter].length}\n onClick={handleFilterClick}\n />\n </div>\n );\n })}\n </div>\n <div className={style.searchWrapper}>\n <SearchForm\n search={{\n placeholder: translate('search_place_holder'),\n value: searchValue,\n onChange: handleSearch\n }}\n onReset={handleSearchReset}\n />\n </div>\n </div>\n {searchValue && searchResults.length === 0 ? (\n <div className={style.emptySearchResultContainer}>\n <div className={style.emptySearchResultTitle}>\n {translate('empty_search_result_title', {searchValue})}\n </div>\n <div className={style.emptySearchResultDescription}>\n {translate('empty_search_result_description')}\n </div>\n <div className={style.emptySearchResultClearSearch} onClick={handleSearchReset}>\n {translate('empty_search_result_clear_search')}\n </div>\n </div>\n ) : (\n <div className={style.skillListContainer}>\n {activeFilter === 'review_mode_available' && filters[activeFilter].length === 0 ? (\n <div className={style.skillListEmptyContainer}>\n <ReviewNoSkills\n titleNoSkills={translate('review_skill_empty')}\n textNoSkills={translate('review_skill_empty_description')}\n iconSkillAriaLabel={translate('review_skill_empty')}\n imagePosition=\"top\"\n />\n </div>\n ) : (\n filters[activeFilter].map((skill, index) => {\n const defaultStats = {\n score: 0,\n content: 0,\n contentCompleted: 0,\n questionsToReview: 0\n };\n\n function handleReviewSkill() {\n onReviewSkill(skill);\n }\n function handleExploreSkill() {\n onExploreSkill(skill);\n }\n const {score, content, questionsToReview, contentCompleted} = skillsInformation[\n skill\n ]\n ? skillsInformation[skill].stats\n : defaultStats;\n return (\n <div key={index}>\n <LearnerSkillCard\n skillTitle={skillsLocales[skill]}\n focus={selectedSkills.includes(skill)}\n metrics={{\n score: score.toFixed(1),\n content,\n questionsToReview,\n contentCompleted\n }}\n review={\n skillsInformation[skill]\n ? skillsInformation[skill].availableForReview\n : false\n }\n onReviewClick={handleReviewSkill}\n onExploreClick={handleExploreSkill}\n />\n </div>\n );\n })\n )}\n </div>\n )}\n </div>\n </div>\n );\n};\n\nMyLearning.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nMyLearning.propTypes = {\n skills: PropTypes.arrayOf(PropTypes.string),\n selectedSkills: PropTypes.arrayOf(PropTypes.string),\n skillsInformation: PropTypes.objectOf(\n PropTypes.shape({\n availableForReview: PropTypes.bool,\n stats: PropTypes.shape({\n score: PropTypes.number,\n content: PropTypes.number,\n contentCompleted: PropTypes.number,\n questionsToReview: PropTypes.number,\n learningTime: PropTypes.number\n })\n })\n ),\n skillsLocales: PropTypes.objectOf(PropTypes.string),\n learnerFeature: PropTypes.bool,\n isLoading: PropTypes.bool,\n onSkillFocusConfirm: PropTypes.func,\n onReviewSkill: PropTypes.func,\n onExploreSkill: PropTypes.func,\n learningPriorities: PropTypes.shape(CardsList.propTypes)\n};\n\nexport default MyLearning;\n"],"mappings":"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"}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
@value tablet from breakpoints;
|
|
4
4
|
@value mobile from breakpoints;
|
|
5
5
|
@value white from colors;
|
|
6
|
+
@value cm_grey_50 from colors;
|
|
6
7
|
@value cm_grey_100 from colors;
|
|
7
8
|
@value cm_grey_500 from colors;
|
|
8
9
|
|
|
@@ -10,12 +11,11 @@
|
|
|
10
11
|
background-color: white;
|
|
11
12
|
min-height: 100%;
|
|
12
13
|
width: 100%;
|
|
14
|
+
font-family: "Gilroy";
|
|
15
|
+
font-style: normal;
|
|
13
16
|
}
|
|
14
17
|
|
|
15
18
|
.container {
|
|
16
|
-
background-color: white;
|
|
17
|
-
font-family: "Gilroy";
|
|
18
|
-
font-style: normal;
|
|
19
19
|
margin-top: 48px;
|
|
20
20
|
margin-bottom: 48px;
|
|
21
21
|
margin-left: auto;
|
|
@@ -28,10 +28,21 @@
|
|
|
28
28
|
max-width: calc(1080px + 32px);
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
+
.cardsListContainer {
|
|
32
|
+
background-color: cm_grey_50;
|
|
33
|
+
padding: 48px 0;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
/* to ecrase wrapper's style from CardsList component */
|
|
37
|
+
.cardsListContainer > :first-child {
|
|
38
|
+
padding: 0;
|
|
39
|
+
}
|
|
40
|
+
|
|
31
41
|
.skillFocusContainer {
|
|
32
42
|
border-radius: 16px;
|
|
33
43
|
border: 1px solid cm_grey_100;
|
|
34
44
|
overflow: hidden;
|
|
45
|
+
margin-top: 48px;
|
|
35
46
|
margin-bottom: 40px;
|
|
36
47
|
}
|
|
37
48
|
|
|
@@ -272,4 +283,8 @@
|
|
|
272
283
|
.skillFocusContent {
|
|
273
284
|
flex-direction: column;
|
|
274
285
|
}
|
|
286
|
+
|
|
287
|
+
.cardsListContainer {
|
|
288
|
+
padding: 24px 16px;
|
|
289
|
+
}
|
|
275
290
|
}
|
|
@@ -100,6 +100,8 @@ declare namespace TeamsDashboard {
|
|
|
100
100
|
showMoreOnLeftAriaLabel: PropTypes.Requireable<string>;
|
|
101
101
|
showMoreOnRightAriaLabel: PropTypes.Requireable<string>;
|
|
102
102
|
}>>;
|
|
103
|
+
type: PropTypes.Requireable<string>;
|
|
104
|
+
key: PropTypes.Requireable<string>;
|
|
103
105
|
testingSizes: PropTypes.Requireable<any>;
|
|
104
106
|
}> | null | undefined)[]>;
|
|
105
107
|
const isLoading: PropTypes.Requireable<boolean>;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { LearningPriorityCardPropTypes } from './types';
|
|
3
|
+
declare const CircularProgressBar: {
|
|
4
|
+
({ label, progression, size, strokeWidth, "aria-label": ariaLabel, "data-name": dataName }: LearningPriorityCardPropTypes): JSX.Element;
|
|
5
|
+
propTypes: {
|
|
6
|
+
label: import("prop-types").Requireable<string>;
|
|
7
|
+
progression: import("prop-types").Validator<number>;
|
|
8
|
+
size: import("prop-types").Requireable<number>;
|
|
9
|
+
strokeWidth: import("prop-types").Requireable<number>;
|
|
10
|
+
'aria-label': import("prop-types").Requireable<string>;
|
|
11
|
+
'data-name': import("prop-types").Requireable<string>;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
export default CircularProgressBar;
|
|
15
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/circular-progress-bar/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAC,6BAA6B,EAA+B,MAAM,SAAS,CAAC;AAmBpF,QAAA,MAAM,mBAAmB;gGAOtB,6BAA6B;;;;;;;;;CAgD/B,CAAC;AAIF,eAAe,mBAAmB,CAAC"}
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = void 0;
|
|
5
|
+
|
|
6
|
+
var _isNull2 = _interopRequireDefault(require("lodash/fp/isNull"));
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
+
|
|
10
|
+
var _types = require("./types");
|
|
11
|
+
|
|
12
|
+
var _style = _interopRequireDefault(require("./style.css"));
|
|
13
|
+
|
|
14
|
+
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); }
|
|
15
|
+
|
|
16
|
+
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; }
|
|
17
|
+
|
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
+
|
|
20
|
+
const ProgressionGradient = () => /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("linearGradient", {
|
|
21
|
+
id: "gradient-stroke-progression",
|
|
22
|
+
x1: "81",
|
|
23
|
+
y1: "0",
|
|
24
|
+
x2: "81",
|
|
25
|
+
y2: "162",
|
|
26
|
+
gradientUnits: "userSpaceOnUse"
|
|
27
|
+
}, /*#__PURE__*/_react.default.createElement("stop", {
|
|
28
|
+
stopColor: "#35CC7F"
|
|
29
|
+
}), /*#__PURE__*/_react.default.createElement("stop", {
|
|
30
|
+
offset: "1",
|
|
31
|
+
stopColor: "#55F2A7"
|
|
32
|
+
})));
|
|
33
|
+
|
|
34
|
+
const CircularProgressBar = ({
|
|
35
|
+
label,
|
|
36
|
+
progression,
|
|
37
|
+
size,
|
|
38
|
+
strokeWidth,
|
|
39
|
+
'aria-label': ariaLabel,
|
|
40
|
+
'data-name': dataName
|
|
41
|
+
}) => {
|
|
42
|
+
const [offset, setOffset] = (0, _react.useState)(null);
|
|
43
|
+
const {
|
|
44
|
+
center,
|
|
45
|
+
radius,
|
|
46
|
+
length
|
|
47
|
+
} = (0, _react.useMemo)(() => {
|
|
48
|
+
const center_ = size / 2;
|
|
49
|
+
const radius_ = center_ - strokeWidth;
|
|
50
|
+
const length_ = Math.ceil(2 * Math.PI * radius_);
|
|
51
|
+
return {
|
|
52
|
+
center: center_,
|
|
53
|
+
radius: radius_,
|
|
54
|
+
length: length_
|
|
55
|
+
};
|
|
56
|
+
}, [size, strokeWidth]);
|
|
57
|
+
(0, _react.useEffect)(() => setOffset(Math.ceil(length * ((100 - progression) / 100))), [length, progression]);
|
|
58
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
59
|
+
className: _style.default.container,
|
|
60
|
+
"aria-label": ariaLabel,
|
|
61
|
+
"data-name": dataName
|
|
62
|
+
}, /*#__PURE__*/_react.default.createElement("svg", {
|
|
63
|
+
className: _style.default.svg,
|
|
64
|
+
width: size,
|
|
65
|
+
height: size
|
|
66
|
+
}, /*#__PURE__*/_react.default.createElement(ProgressionGradient, null), /*#__PURE__*/_react.default.createElement("circle", {
|
|
67
|
+
className: _style.default.mainCircle,
|
|
68
|
+
cx: center,
|
|
69
|
+
cy: center,
|
|
70
|
+
r: radius,
|
|
71
|
+
strokeWidth: 3,
|
|
72
|
+
fill: "transparent"
|
|
73
|
+
}), /*#__PURE__*/_react.default.createElement("circle", {
|
|
74
|
+
cx: center,
|
|
75
|
+
cy: center,
|
|
76
|
+
r: radius - 10 / radius * 100,
|
|
77
|
+
fill: "#fafafa"
|
|
78
|
+
}), /*#__PURE__*/_react.default.createElement("circle", {
|
|
79
|
+
className: _style.default.progressionCircle,
|
|
80
|
+
cx: center,
|
|
81
|
+
cy: center,
|
|
82
|
+
r: radius,
|
|
83
|
+
stroke: `url(#gradient-stroke-progression)`,
|
|
84
|
+
strokeWidth: strokeWidth,
|
|
85
|
+
strokeDasharray: length,
|
|
86
|
+
strokeDashoffset: (0, _isNull2.default)(offset) ? length : offset,
|
|
87
|
+
fill: "transparent",
|
|
88
|
+
strokeLinecap: "round"
|
|
89
|
+
})), /*#__PURE__*/_react.default.createElement("div", {
|
|
90
|
+
className: _style.default.infos
|
|
91
|
+
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
92
|
+
className: _style.default.progression
|
|
93
|
+
}, progression, "%"), /*#__PURE__*/_react.default.createElement("span", {
|
|
94
|
+
className: _style.default.label
|
|
95
|
+
}, label)));
|
|
96
|
+
};
|
|
97
|
+
|
|
98
|
+
CircularProgressBar.propTypes = process.env.NODE_ENV !== "production" ? _types.CircularProgressBarPropTypes : {};
|
|
99
|
+
var _default = CircularProgressBar;
|
|
100
|
+
exports.default = _default;
|
|
101
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["ProgressionGradient","CircularProgressBar","label","progression","size","strokeWidth","ariaLabel","dataName","offset","setOffset","useState","center","radius","length","useMemo","center_","radius_","length_","Math","ceil","PI","useEffect","style","container","svg","mainCircle","progressionCircle","infos","propTypes","CircularProgressBarPropTypes"],"sources":["../../../src/atom/circular-progress-bar/index.tsx"],"sourcesContent":["import React, {useMemo, useState, useEffect} from 'react';\nimport {isNull} from 'lodash/fp';\nimport {LearningPriorityCardPropTypes, CircularProgressBarPropTypes} from './types';\nimport style from './style.css';\n\nconst ProgressionGradient = () => (\n <defs>\n <linearGradient\n id=\"gradient-stroke-progression\"\n x1=\"81\"\n y1=\"0\"\n x2=\"81\"\n y2=\"162\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stopColor=\"#35CC7F\" />\n <stop offset=\"1\" stopColor=\"#55F2A7\" />\n </linearGradient>\n </defs>\n);\n\nconst CircularProgressBar = ({\n label,\n progression,\n size,\n strokeWidth,\n 'aria-label': ariaLabel,\n 'data-name': dataName\n}: LearningPriorityCardPropTypes) => {\n const [offset, setOffset] = useState<null | number>(null);\n\n const {center, radius, length} = useMemo(() => {\n const center_ = size / 2;\n const radius_ = center_ - strokeWidth;\n const length_ = Math.ceil(2 * Math.PI * radius_);\n\n return {center: center_, radius: radius_, length: length_};\n }, [size, strokeWidth]);\n\n useEffect(\n () => setOffset(Math.ceil(length * ((100 - progression) / 100))),\n [length, progression]\n );\n\n return (\n <div className={style.container} aria-label={ariaLabel} data-name={dataName}>\n <svg className={style.svg} width={size} height={size}>\n <ProgressionGradient />\n <circle\n className={style.mainCircle}\n cx={center}\n cy={center}\n r={radius}\n strokeWidth={3}\n fill=\"transparent\"\n />\n <circle cx={center} cy={center} r={radius - (10 / radius) * 100} fill=\"#fafafa\" />\n <circle\n className={style.progressionCircle}\n cx={center}\n cy={center}\n r={radius}\n stroke={`url(#gradient-stroke-progression)`}\n strokeWidth={strokeWidth}\n strokeDasharray={length}\n strokeDashoffset={isNull(offset) ? length : offset}\n fill=\"transparent\"\n strokeLinecap=\"round\"\n />\n </svg>\n <div className={style.infos}>\n <span className={style.progression}>{progression}%</span>\n <span className={style.label}>{label}</span>\n </div>\n </div>\n );\n};\n\nCircularProgressBar.propTypes = CircularProgressBarPropTypes;\n\nexport default CircularProgressBar;\n"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;;;;;;;AAEA,MAAMA,mBAAmB,GAAG,mBAC1B,wDACE;EACE,EAAE,EAAC,6BADL;EAEE,EAAE,EAAC,IAFL;EAGE,EAAE,EAAC,GAHL;EAIE,EAAE,EAAC,IAJL;EAKE,EAAE,EAAC,KALL;EAME,aAAa,EAAC;AANhB,gBAQE;EAAM,SAAS,EAAC;AAAhB,EARF,eASE;EAAM,MAAM,EAAC,GAAb;EAAiB,SAAS,EAAC;AAA3B,EATF,CADF,CADF;;AAgBA,MAAMC,mBAAmB,GAAG,CAAC;EAC3BC,KAD2B;EAE3BC,WAF2B;EAG3BC,IAH2B;EAI3BC,WAJ2B;EAK3B,cAAcC,SALa;EAM3B,aAAaC;AANc,CAAD,KAOS;EACnC,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsB,IAAAC,eAAA,EAAwB,IAAxB,CAA5B;EAEA,MAAM;IAACC,MAAD;IAASC,MAAT;IAAiBC;EAAjB,IAA2B,IAAAC,cAAA,EAAQ,MAAM;IAC7C,MAAMC,OAAO,GAAGX,IAAI,GAAG,CAAvB;IACA,MAAMY,OAAO,GAAGD,OAAO,GAAGV,WAA1B;IACA,MAAMY,OAAO,GAAGC,IAAI,CAACC,IAAL,CAAU,IAAID,IAAI,CAACE,EAAT,GAAcJ,OAAxB,CAAhB;IAEA,OAAO;MAACL,MAAM,EAAEI,OAAT;MAAkBH,MAAM,EAAEI,OAA1B;MAAmCH,MAAM,EAAEI;IAA3C,CAAP;EACD,CANgC,EAM9B,CAACb,IAAD,EAAOC,WAAP,CAN8B,CAAjC;EAQA,IAAAgB,gBAAA,EACE,MAAMZ,SAAS,CAACS,IAAI,CAACC,IAAL,CAAUN,MAAM,IAAI,CAAC,MAAMV,WAAP,IAAsB,GAA1B,CAAhB,CAAD,CADjB,EAEE,CAACU,MAAD,EAASV,WAAT,CAFF;EAKA,oBACE;IAAK,SAAS,EAAEmB,cAAA,CAAMC,SAAtB;IAAiC,cAAYjB,SAA7C;IAAwD,aAAWC;EAAnE,gBACE;IAAK,SAAS,EAAEe,cAAA,CAAME,GAAtB;IAA2B,KAAK,EAAEpB,IAAlC;IAAwC,MAAM,EAAEA;EAAhD,gBACE,6BAAC,mBAAD,OADF,eAEE;IACE,SAAS,EAAEkB,cAAA,CAAMG,UADnB;IAEE,EAAE,EAAEd,MAFN;IAGE,EAAE,EAAEA,MAHN;IAIE,CAAC,EAAEC,MAJL;IAKE,WAAW,EAAE,CALf;IAME,IAAI,EAAC;EANP,EAFF,eAUE;IAAQ,EAAE,EAAED,MAAZ;IAAoB,EAAE,EAAEA,MAAxB;IAAgC,CAAC,EAAEC,MAAM,GAAI,KAAKA,MAAN,GAAgB,GAA5D;IAAiE,IAAI,EAAC;EAAtE,EAVF,eAWE;IACE,SAAS,EAAEU,cAAA,CAAMI,iBADnB;IAEE,EAAE,EAAEf,MAFN;IAGE,EAAE,EAAEA,MAHN;IAIE,CAAC,EAAEC,MAJL;IAKE,MAAM,EAAG,mCALX;IAME,WAAW,EAAEP,WANf;IAOE,eAAe,EAAEQ,MAPnB;IAQE,gBAAgB,EAAE,sBAAOL,MAAP,IAAiBK,MAAjB,GAA0BL,MAR9C;IASE,IAAI,EAAC,aATP;IAUE,aAAa,EAAC;EAVhB,EAXF,CADF,eAyBE;IAAK,SAAS,EAAEc,cAAA,CAAMK;EAAtB,gBACE;IAAM,SAAS,EAAEL,cAAA,CAAMnB;EAAvB,GAAqCA,WAArC,MADF,eAEE;IAAM,SAAS,EAAEmB,cAAA,CAAMpB;EAAvB,GAA+BA,KAA/B,CAFF,CAzBF,CADF;AAgCD,CAvDD;;AAyDAD,mBAAmB,CAAC2B,SAApB,2CAAgCC,mCAAhC;eAEe5B,mB"}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
@value colors: "../../variables/colors.css";
|
|
2
|
+
@value cm_grey_400 from colors;
|
|
3
|
+
@value cm_grey_50 from colors;
|
|
4
|
+
|
|
5
|
+
.container {
|
|
6
|
+
position: relative;
|
|
7
|
+
display: flex;
|
|
8
|
+
flex-direction: column;
|
|
9
|
+
justify-content: center;
|
|
10
|
+
align-items: center;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
.svg {
|
|
14
|
+
transform: rotate(-90deg);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.mainCircle {
|
|
18
|
+
stroke: cm_grey_50;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.progressionCircle {
|
|
22
|
+
transition: stroke-dashoffset 1.5s ease-in-out;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.infos {
|
|
26
|
+
font-family: Gilroy;
|
|
27
|
+
display: flex;
|
|
28
|
+
flex-direction: column;
|
|
29
|
+
justify-content: center;
|
|
30
|
+
align-items: center;
|
|
31
|
+
text-align: center;
|
|
32
|
+
position: absolute;
|
|
33
|
+
top: 50%;
|
|
34
|
+
left: 50%;
|
|
35
|
+
transform: translate(-50%, -50%);
|
|
36
|
+
text-align: center;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.label {
|
|
40
|
+
color: cm_grey_400;
|
|
41
|
+
font-size: 10px;
|
|
42
|
+
font-weight: 500;
|
|
43
|
+
line-height: 12px;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.progression {
|
|
47
|
+
color: #2caf6c;
|
|
48
|
+
font-size: 24px;
|
|
49
|
+
font-weight: 700;
|
|
50
|
+
line-height: 32px;
|
|
51
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import PropTypes from 'prop-types';
|
|
2
|
+
export declare type LearningPriorityCardPropTypes = {
|
|
3
|
+
label: string;
|
|
4
|
+
progression: number;
|
|
5
|
+
size: number;
|
|
6
|
+
strokeWidth: number;
|
|
7
|
+
'aria-label': string;
|
|
8
|
+
'data-name': string;
|
|
9
|
+
};
|
|
10
|
+
export declare const CircularProgressBarPropTypes: {
|
|
11
|
+
label: PropTypes.Requireable<string>;
|
|
12
|
+
progression: PropTypes.Validator<number>;
|
|
13
|
+
size: PropTypes.Requireable<number>;
|
|
14
|
+
strokeWidth: PropTypes.Requireable<number>;
|
|
15
|
+
'aria-label': PropTypes.Requireable<string>;
|
|
16
|
+
'data-name': PropTypes.Requireable<string>;
|
|
17
|
+
};
|
|
18
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/atom/circular-progress-bar/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,oBAAY,6BAA6B,GAAG;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,4BAA4B;;;;;;;CAOxC,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.CircularProgressBarPropTypes = void 0;
|
|
5
|
+
|
|
6
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
7
|
+
|
|
8
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
|
+
|
|
10
|
+
const CircularProgressBarPropTypes = {
|
|
11
|
+
label: _propTypes.default.string,
|
|
12
|
+
progression: _propTypes.default.number.isRequired,
|
|
13
|
+
size: _propTypes.default.number,
|
|
14
|
+
strokeWidth: _propTypes.default.number,
|
|
15
|
+
'aria-label': _propTypes.default.string,
|
|
16
|
+
'data-name': _propTypes.default.string
|
|
17
|
+
};
|
|
18
|
+
exports.CircularProgressBarPropTypes = CircularProgressBarPropTypes;
|
|
19
|
+
//# sourceMappingURL=types.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","names":["CircularProgressBarPropTypes","label","PropTypes","string","progression","number","isRequired","size","strokeWidth"],"sources":["../../../src/atom/circular-progress-bar/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\n\nexport type LearningPriorityCardPropTypes = {\n label: string;\n progression: number;\n size: number;\n strokeWidth: number;\n 'aria-label': string;\n 'data-name': string;\n};\n\nexport const CircularProgressBarPropTypes = {\n label: PropTypes.string,\n progression: PropTypes.number.isRequired,\n size: PropTypes.number,\n strokeWidth: PropTypes.number,\n 'aria-label': PropTypes.string,\n 'data-name': PropTypes.string\n};\n"],"mappings":";;;;;AAAA;;;;AAWO,MAAMA,4BAA4B,GAAG;EAC1CC,KAAK,EAAEC,kBAAA,CAAUC,MADyB;EAE1CC,WAAW,EAAEF,kBAAA,CAAUG,MAAV,CAAiBC,UAFY;EAG1CC,IAAI,EAAEL,kBAAA,CAAUG,MAH0B;EAI1CG,WAAW,EAAEN,kBAAA,CAAUG,MAJmB;EAK1C,cAAcH,kBAAA,CAAUC,MALkB;EAM1C,aAAaD,kBAAA,CAAUC;AANmB,CAArC"}
|
|
@@ -10,6 +10,12 @@ declare const RadioWithTitle: {
|
|
|
10
10
|
'data-name': import("prop-types").Requireable<string>;
|
|
11
11
|
titleSize: import("prop-types").Requireable<string>;
|
|
12
12
|
subtitleSize: import("prop-types").Requireable<string>;
|
|
13
|
+
icon: import("prop-types").Requireable<import("prop-types").InferProps<any>>;
|
|
14
|
+
tag: import("prop-types").Requireable<import("prop-types").InferProps<{
|
|
15
|
+
label: import("prop-types").Requireable<string>;
|
|
16
|
+
type: import("prop-types").Requireable<string>;
|
|
17
|
+
size: import("prop-types").Requireable<string>;
|
|
18
|
+
}>>;
|
|
13
19
|
}>>>;
|
|
14
20
|
name: import("prop-types").Requireable<string>;
|
|
15
21
|
checked: import("prop-types").Requireable<boolean>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/radio-with-title/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAY,mBAAmB,EAAC,MAAM,SAAS,CAAC;AAEvD,QAAA,MAAM,cAAc;YAAW,mBAAmB
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/radio-with-title/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAY,mBAAmB,EAAC,MAAM,SAAS,CAAC;AAEvD,QAAA,MAAM,cAAc;YAAW,mBAAmB;;;;;;;;;;;;;;;;;;;;;;CAwBjD,CAAC;AAIF,eAAe,cAAc,CAAC"}
|
|
@@ -7,6 +7,12 @@ export declare const propTypes: {
|
|
|
7
7
|
'data-name': PropTypes.Requireable<string>;
|
|
8
8
|
titleSize: PropTypes.Requireable<string>;
|
|
9
9
|
subtitleSize: PropTypes.Requireable<string>;
|
|
10
|
+
icon: PropTypes.Requireable<PropTypes.InferProps<any>>;
|
|
11
|
+
tag: PropTypes.Requireable<PropTypes.InferProps<{
|
|
12
|
+
label: PropTypes.Requireable<string>;
|
|
13
|
+
type: PropTypes.Requireable<string>;
|
|
14
|
+
size: PropTypes.Requireable<string>;
|
|
15
|
+
}>>;
|
|
10
16
|
}>>>;
|
|
11
17
|
name: PropTypes.Requireable<string>;
|
|
12
18
|
checked: PropTypes.Requireable<boolean>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/atom/radio-with-title/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAGnC,eAAO,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/atom/radio-with-title/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAGnC,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;CAOrB,CAAC;AAEF,oBAAY,mBAAmB,GAAG;IAChC,KAAK,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;QACjB,IAAI,EAAE,MAAM,CAAC;QACb,WAAW,EAAE,MAAM,CAAC;QACpB,YAAY,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}
|
package/lib/atom/tag/index.d.ts
CHANGED
|
@@ -1,9 +1,14 @@
|
|
|
1
1
|
export default Tag;
|
|
2
|
-
declare function Tag(
|
|
2
|
+
declare function Tag({ label, type, size }: {
|
|
3
|
+
label: any;
|
|
4
|
+
type?: string | undefined;
|
|
5
|
+
size?: string | undefined;
|
|
6
|
+
}): JSX.Element;
|
|
3
7
|
declare namespace Tag {
|
|
4
8
|
namespace propTypes {
|
|
5
9
|
const label: PropTypes.Requireable<string>;
|
|
6
10
|
const type: PropTypes.Requireable<string>;
|
|
11
|
+
const size: PropTypes.Requireable<string>;
|
|
7
12
|
}
|
|
8
13
|
}
|
|
9
14
|
import PropTypes from "prop-types";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/tag/index.js"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/tag/index.js"],"names":[],"mappings":";AAoBA;;;;gBAIC"}
|
package/lib/atom/tag/index.js
CHANGED
|
@@ -9,6 +9,8 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
|
|
10
10
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
11
|
|
|
12
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
13
|
+
|
|
12
14
|
var _style = _interopRequireDefault(require("./style.css"));
|
|
13
15
|
|
|
14
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -20,21 +22,25 @@ const TAG_STYLES = {
|
|
|
20
22
|
warning: _style.default.warning,
|
|
21
23
|
progress: _style.default.progress
|
|
22
24
|
};
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
type = 'default'
|
|
28
|
-
} = props;
|
|
29
|
-
return /*#__PURE__*/_react.default.createElement("span", {
|
|
30
|
-
className: TAG_STYLES[type],
|
|
31
|
-
"data-name": `content-tag-${label}`
|
|
32
|
-
}, label);
|
|
25
|
+
const TAG_SIZE = {
|
|
26
|
+
S: _style.default.small,
|
|
27
|
+
M: _style.default.medium,
|
|
28
|
+
L: _style.default.large
|
|
33
29
|
};
|
|
34
30
|
|
|
31
|
+
const Tag = ({
|
|
32
|
+
label,
|
|
33
|
+
type = 'default',
|
|
34
|
+
size = 'M'
|
|
35
|
+
}) => /*#__PURE__*/_react.default.createElement("span", {
|
|
36
|
+
className: (0, _classnames.default)(TAG_STYLES[type], TAG_SIZE[size]),
|
|
37
|
+
"data-name": `content-tag-${label}`
|
|
38
|
+
}, label);
|
|
39
|
+
|
|
35
40
|
Tag.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
36
41
|
label: _propTypes.default.string,
|
|
37
|
-
type: _propTypes.default.oneOf((0, _keys2.default)(TAG_STYLES))
|
|
42
|
+
type: _propTypes.default.oneOf((0, _keys2.default)(TAG_STYLES)),
|
|
43
|
+
size: _propTypes.default.oneOf(['S', 'M', 'L'])
|
|
38
44
|
} : {};
|
|
39
45
|
var _default = Tag;
|
|
40
46
|
exports.default = _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["TAG_STYLES","default","style","success","failure","warning","progress","
|
|
1
|
+
{"version":3,"file":"index.js","names":["TAG_STYLES","default","style","success","failure","warning","progress","TAG_SIZE","S","small","M","medium","L","large","Tag","label","type","size","classnames","propTypes","PropTypes","string","oneOf"],"sources":["../../../src/atom/tag/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {keys} from 'lodash/fp';\nimport style from './style.css';\n\nconst TAG_STYLES = {\n default: style.default,\n success: style.success,\n failure: style.failure,\n warning: style.warning,\n progress: style.progress\n};\n\nconst TAG_SIZE = {\n S: style.small,\n M: style.medium,\n L: style.large\n};\n\nconst Tag = ({label, type = 'default', size = 'M'}) => (\n <span className={classnames(TAG_STYLES[type], TAG_SIZE[size])} data-name={`content-tag-${label}`}>\n {label}\n </span>\n);\n\nTag.propTypes = {\n label: PropTypes.string,\n type: PropTypes.oneOf(keys(TAG_STYLES)),\n size: PropTypes.oneOf(['S', 'M', 'L'])\n};\n\nexport default Tag;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;;;AAEA,MAAMA,UAAU,GAAG;EACjBC,OAAO,EAAEC,cAAA,CAAMD,OADE;EAEjBE,OAAO,EAAED,cAAA,CAAMC,OAFE;EAGjBC,OAAO,EAAEF,cAAA,CAAME,OAHE;EAIjBC,OAAO,EAAEH,cAAA,CAAMG,OAJE;EAKjBC,QAAQ,EAAEJ,cAAA,CAAMI;AALC,CAAnB;AAQA,MAAMC,QAAQ,GAAG;EACfC,CAAC,EAAEN,cAAA,CAAMO,KADM;EAEfC,CAAC,EAAER,cAAA,CAAMS,MAFM;EAGfC,CAAC,EAAEV,cAAA,CAAMW;AAHM,CAAjB;;AAMA,MAAMC,GAAG,GAAG,CAAC;EAACC,KAAD;EAAQC,IAAI,GAAG,SAAf;EAA0BC,IAAI,GAAG;AAAjC,CAAD,kBACV;EAAM,SAAS,EAAE,IAAAC,mBAAA,EAAWlB,UAAU,CAACgB,IAAD,CAArB,EAA6BT,QAAQ,CAACU,IAAD,CAArC,CAAjB;EAA+D,aAAY,eAAcF,KAAM;AAA/F,GACGA,KADH,CADF;;AAMAD,GAAG,CAACK,SAAJ,2CAAgB;EACdJ,KAAK,EAAEK,kBAAA,CAAUC,MADH;EAEdL,IAAI,EAAEI,kBAAA,CAAUE,KAAV,CAAgB,oBAAKtB,UAAL,CAAhB,CAFQ;EAGdiB,IAAI,EAAEG,kBAAA,CAAUE,KAAV,CAAgB,CAAC,GAAD,EAAM,GAAN,EAAW,GAAX,CAAhB;AAHQ,CAAhB;eAMeR,G"}
|