@coorpacademy/components 11.32.4 → 11.32.5
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/battle-opponent/index.d.ts.map +1 -1
- package/es/atom/battle-opponent/index.js +1 -1
- package/es/atom/battle-opponent/index.js.map +1 -1
- package/es/molecule/card/favorite.d.ts.map +1 -1
- package/es/molecule/card/favorite.js +1 -1
- package/es/molecule/card/favorite.js.map +1 -1
- package/es/molecule/discipline-associated-skills/index.d.ts +17 -0
- package/es/molecule/discipline-associated-skills/index.d.ts.map +1 -0
- package/es/molecule/discipline-associated-skills/index.js +73 -0
- package/es/molecule/discipline-associated-skills/index.js.map +1 -0
- package/es/molecule/discipline-associated-skills/style.css +71 -0
- package/es/molecule/learning-profile-radar-chart/index.d.ts +28 -1
- package/es/molecule/learning-profile-radar-chart/index.d.ts.map +1 -1
- package/es/molecule/learning-profile-radar-chart/index.js +114 -27
- package/es/molecule/learning-profile-radar-chart/index.js.map +1 -1
- package/es/molecule/learning-profile-radar-chart/style.css +14 -0
- package/es/molecule/learning-profile-radar-chart/types.d.ts +2 -0
- package/es/molecule/learning-profile-radar-chart/types.d.ts.map +1 -1
- package/es/molecule/learning-profile-radar-chart/types.js +2 -1
- package/es/molecule/learning-profile-radar-chart/types.js.map +1 -1
- package/es/molecule/review-correction-popin/index.d.ts.map +1 -1
- package/es/molecule/review-correction-popin/index.js +1 -1
- package/es/molecule/review-correction-popin/index.js.map +1 -1
- package/es/organism/user-preferences/index.d.ts.map +1 -1
- package/es/organism/user-preferences/index.js +1 -1
- package/es/organism/user-preferences/index.js.map +1 -1
- package/es/template/activity/engine-stars.d.ts.map +1 -1
- package/es/template/activity/engine-stars.js +1 -1
- package/es/template/activity/engine-stars.js.map +1 -1
- package/es/template/common/discipline/index.d.ts +6 -0
- package/es/template/common/discipline/index.d.ts.map +1 -1
- package/es/template/common/discipline/index.js +17 -2
- package/es/template/common/discipline/index.js.map +1 -1
- package/es/template/common/discipline/style.css +4 -1
- package/es/template/my-learning/index.d.ts.map +1 -1
- package/es/template/my-learning/index.js +2 -1
- package/es/template/my-learning/index.js.map +1 -1
- package/es/template/my-learning/style.css +4 -0
- package/lib/atom/battle-opponent/index.d.ts.map +1 -1
- package/lib/atom/battle-opponent/index.js +1 -1
- package/lib/atom/battle-opponent/index.js.map +1 -1
- package/lib/molecule/card/favorite.d.ts.map +1 -1
- package/lib/molecule/card/favorite.js +1 -1
- package/lib/molecule/card/favorite.js.map +1 -1
- package/lib/molecule/discipline-associated-skills/index.d.ts +17 -0
- package/lib/molecule/discipline-associated-skills/index.d.ts.map +1 -0
- package/lib/molecule/discipline-associated-skills/index.js +94 -0
- package/lib/molecule/discipline-associated-skills/index.js.map +1 -0
- package/lib/molecule/discipline-associated-skills/style.css +71 -0
- package/lib/molecule/learning-profile-radar-chart/index.d.ts +28 -1
- package/lib/molecule/learning-profile-radar-chart/index.d.ts.map +1 -1
- package/lib/molecule/learning-profile-radar-chart/index.js +116 -27
- package/lib/molecule/learning-profile-radar-chart/index.js.map +1 -1
- package/lib/molecule/learning-profile-radar-chart/style.css +14 -0
- package/lib/molecule/learning-profile-radar-chart/types.d.ts +2 -0
- package/lib/molecule/learning-profile-radar-chart/types.d.ts.map +1 -1
- package/lib/molecule/learning-profile-radar-chart/types.js +2 -1
- package/lib/molecule/learning-profile-radar-chart/types.js.map +1 -1
- package/lib/molecule/review-correction-popin/index.d.ts.map +1 -1
- package/lib/molecule/review-correction-popin/index.js +1 -1
- package/lib/molecule/review-correction-popin/index.js.map +1 -1
- package/lib/organism/user-preferences/index.d.ts.map +1 -1
- package/lib/organism/user-preferences/index.js +1 -1
- package/lib/organism/user-preferences/index.js.map +1 -1
- package/lib/template/activity/engine-stars.d.ts.map +1 -1
- package/lib/template/activity/engine-stars.js +1 -1
- package/lib/template/activity/engine-stars.js.map +1 -1
- package/lib/template/common/discipline/index.d.ts +6 -0
- package/lib/template/common/discipline/index.d.ts.map +1 -1
- package/lib/template/common/discipline/index.js +18 -2
- package/lib/template/common/discipline/index.js.map +1 -1
- package/lib/template/common/discipline/style.css +4 -1
- package/lib/template/my-learning/index.d.ts.map +1 -1
- package/lib/template/my-learning/index.js +2 -1
- package/lib/template/my-learning/index.js.map +1 -1
- package/lib/template/my-learning/style.css +4 -0
- package/locales/bs/global.json +3 -1
- package/locales/cs/global.json +4 -2
- package/locales/de/global.json +3 -1
- package/locales/en/global.json +3 -1
- package/locales/es/global.json +3 -1
- package/locales/et/global.json +3 -1
- package/locales/fi/global.json +3 -1
- package/locales/fr/global.json +3 -1
- package/locales/hr/global.json +3 -1
- package/locales/hu/global.json +3 -1
- package/locales/hy/global.json +3 -1
- package/locales/it/global.json +3 -1
- package/locales/ja/global.json +3 -1
- package/locales/ko/global.json +3 -1
- package/locales/nl/global.json +3 -1
- package/locales/pl/global.json +3 -1
- package/locales/pt/global.json +3 -1
- package/locales/ro/global.json +3 -1
- package/locales/ru/global.json +3 -1
- package/locales/sk/global.json +3 -1
- package/locales/sl/global.json +3 -1
- package/locales/sv/global.json +3 -1
- package/locales/th/global.json +1 -1
- package/locales/tl/global.json +4 -2
- package/locales/tr/global.json +3 -1
- package/locales/uk/global.json +3 -1
- package/locales/vi/global.json +4 -2
- package/locales/zh/global.json +3 -1
- package/locales/zh_TW/global.json +3 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/my-learning/index.js"],"names":[],"mappings":";AAwHA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/my-learning/index.js"],"names":[],"mappings":";AAwHA,mEA2WC"}
|
|
@@ -255,6 +255,7 @@ const MyLearning = (props, context) => {
|
|
|
255
255
|
data: graphDatas,
|
|
256
256
|
legend: graphLegends,
|
|
257
257
|
onClick: handleOnDotClick,
|
|
258
|
+
onExploreClick: onExploreSkill,
|
|
258
259
|
colors: [{
|
|
259
260
|
gradient: {
|
|
260
261
|
fill: ['#0062ffff', '#8000ff85'],
|
|
@@ -313,7 +314,7 @@ const MyLearning = (props, context) => {
|
|
|
313
314
|
iconContainerClassName: style.infoIconTooltip,
|
|
314
315
|
tooltipClassName: style.tooltip,
|
|
315
316
|
TooltipContent: ReviewTooltipContent,
|
|
316
|
-
closeToolTipInformationTextAriaLabel: translate('
|
|
317
|
+
closeToolTipInformationTextAriaLabel: translate('close_tooltip_information')
|
|
317
318
|
})))), /*#__PURE__*/React.createElement("div", {
|
|
318
319
|
className: style.toolBarContainer
|
|
319
320
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -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","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","sort","a","b","stats","score","activeFilter","setActiveFilter","skillsReviewReady","skill","availableForReview","graphDatas","graphLegends","filters","all","review","sumKpi","kpi","coursedCompletedData","questionsAnsweredData","learningHoursData","skillChartPaneLegends","focusedSkill","skillChartPanelProps","title","value","legend","icon","iconName","handleOnDotClick","skillRef","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","handleReviewSkill","handleExploreSkill","courses","skillCourses","questionsAnswered","skillQuestions","coursesCompleted","completedCourses","includes","arrayOf","objectOf","shape","learningHours"],"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} 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 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, translate} = 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]\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: filter === translate('review_mode_available') ? '200px' : '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 skills.sort((a, b) => skillsInformation[b].stats.score - skillsInformation[a].stats.score)\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 => skillsInformation[skill].availableForReview);\n }, [searchResults, skillsInformation]);\n\n const graphDatas = useMemo(\n () =>\n pipe(\n map(skill => [skill, skillsInformation[skill].stats.score]),\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 skillFocusSelectedOnChart\n ? skillsInformation[skillFocusSelectedOnChart].stats[kpi]\n : sumBy(skill => skillsInformation[skill].stats[kpi], selectedSkillsList),\n [skillFocusSelectedOnChart, skillsInformation, selectedSkillsList]\n );\n\n const coursedCompletedData = useMemo(() => sumKpi('coursesCompleted'), [sumKpi]);\n\n const questionsAnsweredData = useMemo(() => sumKpi('questionsAnswered'), [sumKpi]);\n\n const learningHoursData = useMemo(() => sumKpi('learningHours'), [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_courses_completed'),\n value: `${coursedCompletedData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'book-open-cover', backgroundColor: '#D9F4F7'}\n },\n {\n title: translate('skill_chart_side_panel_questions_answered'),\n value: `${questionsAnsweredData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'circle-question', backgroundColor: '#FFDCD1'}\n },\n {\n title: translate('skill_chart_side_panel_learning_hours'),\n value: `${learningHoursData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'clock', backgroundColor: '#FAD6DE'}\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('skill_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 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: '168px',\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(\n 'Press the escape key to close the information text'\n )}\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 function handleReviewSkill() {\n onReviewSkill(skill);\n }\n function handleExploreSkill() {\n onExploreSkill(skill);\n }\n const {\n score,\n courses: skillCourses,\n questionsAnswered: skillQuestions,\n coursesCompleted: completedCourses\n } = skillsInformation[skill].stats;\n return (\n <div key={index}>\n <LearnerSkillCard\n skillTitle={skillsLocales[skill]}\n focus={selectedSkills.includes(skill)}\n metrics={{\n score,\n skillCourses,\n skillQuestions,\n completedCourses\n }}\n review={skillsInformation[skill].availableForReview}\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 courses: PropTypes.number,\n coursesCompleted: PropTypes.number,\n questionsAnswered: PropTypes.number,\n learningHours: 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","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","sort","a","b","stats","score","activeFilter","setActiveFilter","skillsReviewReady","skill","availableForReview","graphDatas","graphLegends","filters","all","review","sumKpi","kpi","coursedCompletedData","questionsAnsweredData","learningHoursData","skillChartPaneLegends","focusedSkill","skillChartPanelProps","title","value","legend","icon","iconName","handleOnDotClick","skillRef","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","handleReviewSkill","handleExploreSkill","courses","skillCourses","questionsAnswered","skillQuestions","coursesCompleted","completedCourses","includes","arrayOf","objectOf","shape","learningHours"],"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} 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 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, translate} = 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]\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: filter === translate('review_mode_available') ? '200px' : '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 skills.sort((a, b) => skillsInformation[b].stats.score - skillsInformation[a].stats.score)\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 => skillsInformation[skill].availableForReview);\n }, [searchResults, skillsInformation]);\n\n const graphDatas = useMemo(\n () =>\n pipe(\n map(skill => [skill, skillsInformation[skill].stats.score]),\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 skillFocusSelectedOnChart\n ? skillsInformation[skillFocusSelectedOnChart].stats[kpi]\n : sumBy(skill => skillsInformation[skill].stats[kpi], selectedSkillsList),\n [skillFocusSelectedOnChart, skillsInformation, selectedSkillsList]\n );\n\n const coursedCompletedData = useMemo(() => sumKpi('coursesCompleted'), [sumKpi]);\n\n const questionsAnsweredData = useMemo(() => sumKpi('questionsAnswered'), [sumKpi]);\n\n const learningHoursData = useMemo(() => sumKpi('learningHours'), [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_courses_completed'),\n value: `${coursedCompletedData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'book-open-cover', backgroundColor: '#D9F4F7'}\n },\n {\n title: translate('skill_chart_side_panel_questions_answered'),\n value: `${questionsAnsweredData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'circle-question', backgroundColor: '#FFDCD1'}\n },\n {\n title: translate('skill_chart_side_panel_learning_hours'),\n value: `${learningHoursData}`,\n legend: skillChartPaneLegends,\n icon: {iconName: 'clock', backgroundColor: '#FAD6DE'}\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('skill_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: '168px',\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 function handleReviewSkill() {\n onReviewSkill(skill);\n }\n function handleExploreSkill() {\n onExploreSkill(skill);\n }\n const {\n score,\n courses: skillCourses,\n questionsAnswered: skillQuestions,\n coursesCompleted: completedCourses\n } = skillsInformation[skill].stats;\n return (\n <div key={index}>\n <LearnerSkillCard\n skillTitle={skillsLocales[skill]}\n focus={selectedSkills.includes(skill)}\n metrics={{\n score,\n skillCourses,\n skillQuestions,\n completedCourses\n }}\n review={skillsInformation[skill].availableForReview}\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 courses: PropTypes.number,\n coursesCompleted: PropTypes.number,\n questionsAnswered: PropTypes.number,\n learningHours: 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":";;;;;;AAAA,OAAOA,KAAP,IAAeC,WAAf,EAA4BC,QAA5B,EAAsCC,OAAtC,QAAoD,OAApD;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAAQC,OAAR,QAAsB,oBAAtB;AAEA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,IAAP,MAAiB,iBAAjB;AACA,OAAOC,OAAP,MAAoB,oBAApB;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,OAAP,MAAoB,oBAApB;AACA,OAAOC,cAAP,MAA2B,iCAA3B;AACA,OAAOC,UAAP,MAAuB,4BAAvB;AACA,OAAOC,gBAAP,MAA6B,mCAA7B;AACA,OAAOC,mCAAP,MAAgD,6CAAhD;AACA,OAAOC,+BAAP,MAA4C,oDAA5C;AACA,OAAOC,gBAAP,MAA6B,mCAA7B;AACA,OAAOC,mBAAP,MAAgC,kCAAhC;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,sBAAsB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACjD,MAAM,CAACC,OAAD,EAAUC,UAAV,IAAwBrB,QAAQ,CAAC,KAAD,CAAtC;EACA,MAAM;IAACsB;EAAD,IAAYJ,KAAlB;EACA,MAAM;IAACK,IAAD;IAAOC;EAAP,IAAoBL,OAA1B;;EACA,MAAMM,gBAAgB,GAAG,KAAI,gBAAJ,EAAsBF,IAAtB,CAAzB;;EAEA,MAAMG,eAAe,GAAG3B,WAAW,CAAC,MAAMsB,UAAU,CAAC,IAAD,CAAjB,EAAyB,CAACA,UAAD,CAAzB,CAAnC;EAEA,MAAMM,gBAAgB,GAAG5B,WAAW,CAAC,MAAMsB,UAAU,CAAC,KAAD,CAAjB,EAA0B,CAACA,UAAD,CAA1B,CAApC;EAEA,oBACE;IACE,aAAU,wBADZ;IAEE,WAAW,EAAEK,eAFf;IAGE,YAAY,EAAEC;EAHhB,gBAKE,oBAAC,UAAD;IACE,WAAW,EAAE;MACXC,eAAe,EAAER,OAAO,GACpBK,gBADoB,GAEpBtB,OAAO,CAAE,SAAQsB,gBAAiB,WAA3B,CAHA;MAIXI,KAAK,EAAET,OAAO,GAAG,SAAH,GAAeK,gBAJlB;MAKXK,UAAU,EAAE;IALD,CADf;IAQE,OAAO,EAAER,OARX;IASE,KAAK,EAAEE,SAAS,CAAC,qBAAD,CATlB;IAUE,aAAU,2BAVZ;IAWE,IAAI,EAAE;MACJO,QAAQ,EAAE,MADN;MAEJC,MAAM,EAAE;QACNC,IAAI,EAAE,eADA;QAENL,eAAe,EAAER,OAAO,GACpBK,gBADoB,GAEpBtB,OAAO,CAAE,SAAQsB,gBAAiB,WAA3B,CAJL;QAKNI,KAAK,EAAET,OAAO,GAAG,SAAH,GAAeK,gBALvB;QAMNS,IAAI,EAAE;MANA;IAFJ;EAXR,EALF,CADF;AA+BD,CAzCD;;AA2CAjB,sBAAsB,CAACkB,YAAvB,GAAsC;EACpCZ,IAAI,EAAEnB,QAAQ,CAACgC,iBAAT,CAA2Bb,IADG;EAEpCC,SAAS,EAAEpB,QAAQ,CAACgC,iBAAT,CAA2BZ;AAFF,CAAtC;AAKAP,sBAAsB,CAACoB,SAAvB,2CAAmC;EACjCf,OAAO,EAAEpB,SAAS,CAACoC;AADc,CAAnC;;AAIA,MAAMC,YAAY,GAAG,CAACrB,KAAD,EAAQC,OAAR,KAAoB;EACvC,MAAM;IAACqB,MAAD;IAASC,MAAT;IAAiBC,UAAjB;IAA6BpB;EAA7B,IAAwCJ,KAA9C;EACA,MAAM;IAACK,IAAD;IAAOC;EAAP,IAAoBL,OAA1B;;EACA,MAAMM,gBAAgB,GAAG,KAAI,gBAAJ,EAAsBF,IAAtB,CAAzB;;EAEA,MAAMoB,OAAO,GAAG5C,WAAW,CACzB,mBACE,iCACG0C,MADH,eAEE;IACE,SAAS,EAAED,MAAM,GAAGxB,KAAK,CAAC4B,iBAAT,GAA6B5B,KAAK,CAAC6B,yBADtD;IAEE,KAAK,EAAE;MACLjB,eAAe,EAAEY,MAAM,GAAGrC,OAAO,CAAE,SAAQsB,gBAAiB,WAA3B,CAAV,GAAmD,SADrE;MAELI,KAAK,EAAEW,MAAM,GAAGf,gBAAH,GAAsB;IAF9B;EAFT,GAOGiB,UAPH,CAFF,CAFuB,EAezB,CAACD,MAAD,EAASC,UAAT,EAAqBF,MAArB,CAfyB,CAA3B;EAkBA,MAAMM,WAAW,GAAG;IAClBC,WAAW,EAAE;MACXnB,eAAe,EAAEY,MAAM,GAAGrC,OAAO,CAAE,SAAQsB,gBAAiB,WAA3B,CAAV,GAAmD,SAD/D;MAEXI,KAAK,EAAEW,MAAM,GAAGf,gBAAH,GAAsB,SAFxB;MAGXK,UAAU,EAAE,6DAHD;MAIXkB,KAAK,EAAEP,MAAM,KAAKjB,SAAS,CAAC,uBAAD,CAApB,GAAgD,OAAhD,GAA0D;IAJtD,CADK;IAOlBF,OAPkB;IAQlB2B,OAAO,eAAE,oBAAC,OAAD,OARS;IASlB,aAAa;EATK,CAApB;EAYA,oBAAO,oBAAC,UAAD,EAAgBH,WAAhB,CAAP;AACD,CApCD;;AAsCAP,YAAY,CAACJ,YAAb,GAA4B;EAC1BZ,IAAI,EAAEnB,QAAQ,CAACgC,iBAAT,CAA2Bb,IADP;EAE1BC,SAAS,EAAEpB,QAAQ,CAACgC,iBAAT,CAA2BZ;AAFZ,CAA5B;AAKAe,YAAY,CAACF,SAAb,2CAAyB;EACvBG,MAAM,EAAEtC,SAAS,CAACgD,IADK;EAEvBT,MAAM,EAAEvC,SAAS,CAACiD,MAFK;EAGvBT,UAAU,EAAExC,SAAS,CAACkD,MAHC;EAIvB9B,OAAO,EAAEpB,SAAS,CAACoC;AAJI,CAAzB;;AAOA,MAAMe,UAAU,GAAG,CAACnC,KAAD,EAAQC,OAAR,KAAoB;EACrC,MAAM;IACJmC,MADI;IAEJC,cAAc,GAAG,EAFb;IAGJC,iBAHI;IAIJC,aAJI;IAKJC,cAAc,GAAG,IALb;IAMJC,SANI;IAOJC,mBAPI;IAQJC,aARI;IASJC;EATI,IAUF5C,KAVJ;EAWA,MAAM;IAACK,IAAD;IAAOC;EAAP,IAAoBL,OAA1B;;EACA,MAAMM,gBAAgB,GAAG,KAAI,gBAAJ,EAAsBF,IAAtB,CAAzB;;EACA,MAAM,CAACwC,IAAD,EAAOC,OAAP,IAAkBhE,QAAQ,CAAC,KAAD,CAAhC;EACA,MAAM,CAACiE,kBAAD,EAAqBC,qBAArB,IAA8ClE,QAAQ,CAACuD,cAAD,CAA5D;EACA,MAAM,CAACY,yBAAD,EAA4BC,4BAA5B,IAA4DpE,QAAQ,CAACqE,SAAD,CAA1E;EACA,MAAM,CAACC,WAAD,EAAcC,cAAd,IAAgCvE,QAAQ,CAAC,EAAD,CAA9C;EACA,MAAM,CAACwE,aAAD,EAAgBC,gBAAhB,IAAoCzE,QAAQ,CAChDsD,MAAM,CAACoB,IAAP,CAAY,CAACC,CAAD,EAAIC,CAAJ,KAAUpB,iBAAiB,CAACoB,CAAD,CAAjB,CAAqBC,KAArB,CAA2BC,KAA3B,GAAmCtB,iBAAiB,CAACmB,CAAD,CAAjB,CAAqBE,KAArB,CAA2BC,KAApF,CADgD,CAAlD;EAGA,MAAM,CAACC,YAAD,EAAeC,eAAf,IAAkChF,QAAQ,CAAC,KAAD,CAAhD;EACA,MAAM,CAACoB,OAAD,EAAUC,UAAV,IAAwBrB,QAAQ,CAAC,KAAD,CAAtC;EAEA,MAAM0B,eAAe,GAAG3B,WAAW,CAAC,MAAMsB,UAAU,CAAC,IAAD,CAAjB,EAAyB,CAACA,UAAD,CAAzB,CAAnC;EAEA,MAAMM,gBAAgB,GAAG5B,WAAW,CAAC,MAAMsB,UAAU,CAAC,KAAD,CAAjB,EAA0B,CAACA,UAAD,CAA1B,CAApC;EAEA,MAAM4D,iBAAiB,GAAGhF,OAAO,CAAC,MAAM;IACtC,OAAOuE,aAAa,CAAC/B,MAAd,CAAqByC,KAAK,IAAI1B,iBAAiB,CAAC0B,KAAD,CAAjB,CAAyBC,kBAAvD,CAAP;EACD,CAFgC,EAE9B,CAACX,aAAD,EAAgBhB,iBAAhB,CAF8B,CAAjC;EAIA,MAAM4B,UAAU,GAAGnF,OAAO,CACxB,MACE,MACE,KAAIiF,KAAK,IAAI,CAACA,KAAD,EAAQ1B,iBAAiB,CAAC0B,KAAD,CAAjB,CAAyBL,KAAzB,CAA+BC,KAAvC,CAAb,CADF,cAGEb,kBAHF,CAFsB,EAMxB,CAACA,kBAAD,EAAqBT,iBAArB,CANwB,CAA1B;EASA,MAAM6B,YAAY,GAAGpF,OAAO,CAC1B,MACE,MACE,KAAIiF,KAAK,IAAI,CAACA,KAAD,EAAQzB,aAAa,CAACyB,KAAD,CAArB,CAAb,CADF,cAGEjB,kBAHF,CAFwB,EAM1B,CAACA,kBAAD,EAAqBR,aAArB,CAN0B,CAA5B;EASA,MAAM6B,OAAO,GAAGrF,OAAO,CAAC,MAAM;IAC5B,OAAO;MACLsF,GAAG,EAAEf,aADA;MAELgB,MAAM,EAAEP;IAFH,CAAP;EAID,CALsB,EAKpB,CAACT,aAAD,EAAgBS,iBAAhB,CALoB,CAAvB;EAOA,MAAMQ,MAAM,GAAG1F,WAAW,CACxB2F,GAAG,IACDvB,yBAAyB,GACrBX,iBAAiB,CAACW,yBAAD,CAAjB,CAA6CU,KAA7C,CAAmDa,GAAnD,CADqB,GAErB,OAAMR,KAAK,IAAI1B,iBAAiB,CAAC0B,KAAD,CAAjB,CAAyBL,KAAzB,CAA+Ba,GAA/B,CAAf,EAAoDzB,kBAApD,CAJkB,EAKxB,CAACE,yBAAD,EAA4BX,iBAA5B,EAA+CS,kBAA/C,CALwB,CAA1B;EAQA,MAAM0B,oBAAoB,GAAG1F,OAAO,CAAC,MAAMwF,MAAM,CAAC,kBAAD,CAAb,EAAmC,CAACA,MAAD,CAAnC,CAApC;EAEA,MAAMG,qBAAqB,GAAG3F,OAAO,CAAC,MAAMwF,MAAM,CAAC,mBAAD,CAAb,EAAoC,CAACA,MAAD,CAApC,CAArC;EAEA,MAAMI,iBAAiB,GAAG5F,OAAO,CAAC,MAAMwF,MAAM,CAAC,eAAD,CAAb,EAAgC,CAACA,MAAD,CAAhC,CAAjC;EAEA,MAAMK,qBAAqB,GAAG7F,OAAO,CACnC,MACEuB,SAAS,CAAC,uBAAD,EAA0B;IACjCuE,YAAY,EAAE5B,yBAAyB,GACnCV,aAAa,CAACU,yBAAD,CADsB,GAEnC3C,SAAS,CAAC,gBAAD;EAHoB,CAA1B,CAFwB,EAOnC,CAACA,SAAD,EAAYiC,aAAZ,EAA2BU,yBAA3B,CAPmC,CAArC;EASA,MAAM6B,oBAAoB,GAAG,CAC3B;IACEC,KAAK,EAAEzE,SAAS,CAAC,0CAAD,CADlB;IAEE0E,KAAK,EAAG,GAAEP,oBAAqB,EAFjC;IAGEQ,MAAM,EAAEL,qBAHV;IAIEM,IAAI,EAAE;MAACC,QAAQ,EAAE,iBAAX;MAA8BzE,eAAe,EAAE;IAA/C;EAJR,CAD2B,EAO3B;IACEqE,KAAK,EAAEzE,SAAS,CAAC,2CAAD,CADlB;IAEE0E,KAAK,EAAG,GAAEN,qBAAsB,EAFlC;IAGEO,MAAM,EAAEL,qBAHV;IAIEM,IAAI,EAAE;MAACC,QAAQ,EAAE,iBAAX;MAA8BzE,eAAe,EAAE;IAA/C;EAJR,CAP2B,EAa3B;IACEqE,KAAK,EAAEzE,SAAS,CAAC,uCAAD,CADlB;IAEE0E,KAAK,EAAG,GAAEL,iBAAkB,EAF9B;IAGEM,MAAM,EAAEL,qBAHV;IAIEM,IAAI,EAAE;MAACC,QAAQ,EAAE,OAAX;MAAoBzE,eAAe,EAAE;IAArC;EAJR,CAb2B,CAA7B;EAqBA,MAAM0E,gBAAgB,GAAGvG,WAAW,CAClCwG,QAAQ,IAAI;IACVnC,4BAA4B,CAACmC,QAAD,CAA5B;EACD,CAHiC,EAIlC,CAACnC,4BAAD,CAJkC,CAApC;EAMA,MAAMoC,qBAAqB,GAAGzG,WAAW,CAAC,MAAMiE,OAAO,CAAC,IAAD,CAAd,EAAsB,CAACA,OAAD,CAAtB,CAAzC;EACA,MAAMyC,sBAAsB,GAAG1G,WAAW,CAAC,MAAMiE,OAAO,CAAC,KAAD,CAAd,EAAuB,CAACA,OAAD,CAAvB,CAA1C;EACA,MAAM0C,wBAAwB,GAAG3G,WAAW,CAC1C4G,cAAc,IAAI;IAChBzC,qBAAqB,CAACyC,cAAD,CAArB;IACA/C,mBAAmB,CAAC+C,cAAD,CAAnB;IACA3C,OAAO,CAAC,KAAD,CAAP;EACD,CALyC,EAM1C,CAACJ,mBAAD,EAAsBM,qBAAtB,EAA6CF,OAA7C,CAN0C,CAA5C;EAQA,MAAM4C,YAAY,GAAG7G,WAAW,CAC9BmG,KAAK,IAAI;IACP3B,cAAc,CAAC2B,KAAD,CAAd;IACAzB,gBAAgB,CAACnB,MAAM,CAACb,MAAP,CAAcyC,KAAK,IAAInE,mBAAmB,CAAC0C,aAAa,CAACyB,KAAD,CAAd,EAAuBgB,KAAvB,CAA1C,CAAD,CAAhB;EACD,CAJ6B,EAK9B,CAAC5C,MAAD,EAASG,aAAT,EAAwBc,cAAxB,EAAwCE,gBAAxC,CAL8B,CAAhC;EAOA,MAAMoC,iBAAiB,GAAG9G,WAAW,CAAC,MAAM;IAC1CwE,cAAc,CAAC,EAAD,CAAd;IACAE,gBAAgB,CAACnB,MAAD,CAAhB;EACD,CAHoC,EAGlC,CAACA,MAAD,EAASiB,cAAT,EAAyBE,gBAAzB,CAHkC,CAArC;EAKA,MAAMqC,oBAAoB,GAAG/G,WAAW,CACtC,mBACE,8CACE,8CACE,+BAAIyB,SAAS,CAAC,4BAAD,CAAb,CADF,CADF,eAIE,+BAAIA,SAAS,CAAC,6BAAD,CAAb,CAJF,eAKE,6CACE,gCAAKA,SAAS,CAAC,mCAAD,CAAd,CADF,eAEE,gCAAKA,SAAS,CAAC,mCAAD,CAAd,CAFF,eAGE,gCAAKA,SAAS,CAAC,mCAAD,CAAd,CAHF,eAIE,gCAAKA,SAAS,CAAC,mCAAD,CAAd,CAJF,CALF,CAFoC,EAetC,CAACA,SAAD,CAfsC,CAAxC;EAkBA,oBACE;IAAK,SAAS,EAAER,KAAK,CAAC+F;EAAtB,gBACE;IAAK,SAAS,EAAE/F,KAAK,CAACgG;EAAtB,gBACE,oBAAC,gBAAD;IACE,MAAM,EAAE1D,MADV;IAEE,cAAc,EAAEW,kBAFlB;IAGE,aAAa,EAAER,aAHjB;IAIE,MAAM,EAAEM,IAJV;IAKE,SAAS,EAAEJ,SALb;IAME,QAAQ,EAAE8C,sBANZ;IAOE,SAAS,EAAEC,wBAPb;IAQE,OAAO,EAAED;EARX,EADF,EAWG/C,cAAc,gBACb;IAAK,aAAU,uBAAf;IAAuC,SAAS,EAAE1C,KAAK,CAACiG;EAAxD,gBACE;IAAQ,SAAS,EAAEjG,KAAK,CAACkG;EAAzB,gBACE;IAAK,SAAS,EAAElG,KAAK,CAACmG;EAAtB,gBACE;IAAK,SAAS,EAAEnG,KAAK,CAACoG;EAAtB,gBACE,oBAAC,IAAD;IACE,QAAQ,EAAC,gBADX;IAEE,eAAe,EAAC,SAFlB;IAGE,YAAY,EAAC,MAHf;IAIE,IAAI,EAAE;MAACC,MAAM,EAAE,EAAT;MAAaC,WAAW,EAAE;IAA1B;EAJR,EADF,CADF,eASE;IAAK,SAAS,EAAEtG,KAAK,CAACuG;EAAtB,gBACE;IAAK,aAAU,mBAAf;IAAmC,SAAS,EAAEvG,KAAK,CAACwG;EAApD,GACGhG,SAAS,CAAC,aAAD,CADZ,CADF,eAIE;IACE,aAAU,yBADZ;IAEE,SAAS,EAAER,KAAK,CAACyG;EAFnB,GAIGjG,SAAS,CAAC,0BAAD,CAJZ,CAJF,CATF,CADF,EAsBGyC,kBAAkB,CAACyD,MAAnB,IAA6B,CAA7B,gBACC,oBAAC,sBAAD;IAAwB,OAAO,EAAElB;EAAjC,EADD,GAEG,IAxBN,CADF,EA2BGvC,kBAAkB,CAACyD,MAAnB,IAA6B,CAA7B,gBACC;IAAK,SAAS,EAAE1G,KAAK,CAAC2G;EAAtB,gBACE;IAAK,SAAS,EAAE3G,KAAK,CAAC4G;EAAtB,gBACE,oBAAC,mCAAD;IACE,YAAY,EAAE,CADhB;IAEE,MAAM,EAAE,GAFV;IAGE,KAAK,EAAE,GAHT;IAIE,IAAI,EAAExC,UAJR;IAKE,MAAM,EAAEC,YALV;IAME,OAAO,EAAEiB,gBANX;IAOE,cAAc,EAAExC,cAPlB;IAQE,MAAM,EAAE,CACN;MACE+D,QAAQ,EAAE;QACRC,IAAI,EAAE,CAAC,WAAD,EAAc,WAAd,CADE;QAERC,MAAM,EAAE,CAAC,WAAD,EAAc,SAAd;MAFA,CADZ;MAKEC,UAAU,EAAE;QACVnG,KAAK,EAAEJ,gBADG;QAEVwG,UAAU,EAAE9H,OAAO,CAAE,SAAQsB,gBAAiB,WAA3B;MAFT,CALd;MASEyG,KAAK,EAAE;QACLrG,KAAK,EAAE;MADF;IATT,CADM;EARV,EADF,CADF,eA2BE,oBAAC,+BAAD;IAAiC,cAAc,EAAEmE;EAAjD,EA3BF,CADD,gBA+BC;IAAK,SAAS,EAAEhF,KAAK,CAACmH;EAAtB,gBACE,oBAAC,OAAD;IACE,SAAS,EAAEnH,KAAK,CAACoH,GADnB;IAEE,GAAG,EAAC,4FAFN;IAGE,GAAG,EAAC;EAHN,EADF,eAME;IAAK,SAAS,EAAEpH,KAAK,CAACqH;EAAtB,GACG7G,SAAS,CAAC,0BAAD,CADZ,CANF,eASE;IAAK,SAAS,EAAER,KAAK,CAACsH;EAAtB,GACG9G,SAAS,CAAC,gCAAD,CADZ,CATF,eAYE;IAAK,WAAW,EAAEE,eAAlB;IAAmC,YAAY,EAAEC;EAAjD,gBACE,oBAAC,UAAD;IACE,KAAK,EAAEH,SAAS,CAAC,qBAAD,CADlB;IAEE,IAAI,EAAC,SAFP;IAGE,WAAW,EAAE;MACXwB,KAAK,EAAE,OADI;MAEXpB,eAAe,EAAER,OAAO,GACpBjB,OAAO,CAAE,YAAWsB,gBAAiB,0BAA9B,CADa,GAEpBA;IAJO,CAHf;IASE,OAAO,EAAE+E;EATX,EADF,CAZF,CA1DJ,CADa,GAuFX,IAlGN,eAmGE;IAAQ,SAAS,EAAExF,KAAK,CAACuH;EAAzB,gBACE;IAAK,SAAS,EAAEvH,KAAK,CAACwH;EAAtB,gBACE,oBAAC,IAAD;IACE,QAAQ,EAAC,UADX;IAEE,eAAe,EAAC,SAFlB;IAGE,IAAI,EAAE;MAACnB,MAAM,EAAE,EAAT;MAAaC,WAAW,EAAE;IAA1B;EAHR,EADF,CADF,eAQE;IAAK,SAAS,EAAEtG,KAAK,CAACyH;EAAtB,gBACE;IAAK,SAAS,EAAEzH,KAAK,CAAC0H;EAAtB,GAA6ClH,SAAS,CAAC,sBAAD,CAAtD,CADF,eAEE;IAAK,SAAS,EAAER,KAAK,CAAC2H;EAAtB,GACGnH,SAAS,CAAC,4BAAD,CADZ,eAEE,oBAAC,OAAD;IACE,QAAQ,EAAE,EADZ;IAEE,sBAAsB,EAAER,KAAK,CAAC4H,eAFhC;IAGE,gBAAgB,EAAE5H,KAAK,CAAC6H,OAH1B;IAIE,cAAc,EAAE/B,oBAJlB;IAKE,oCAAoC,EAAEtF,SAAS,CAAC,2BAAD;EALjD,EAFF,CAFF,CARF,CAnGF,eAyHE;IAAK,SAAS,EAAER,KAAK,CAAC8H;EAAtB,gBACE;IAAK,SAAS,EAAE9H,KAAK,CAAC+H;EAAtB,GACG,MAAKzD,OAAL,EAAc0D,GAAd,CAAkB,CAACvG,MAAD,EAASwG,KAAT,KAAmB;IACpC,SAASC,iBAAT,GAA6B;MAC3BlE,eAAe,CAACvC,MAAD,CAAf;IACD;;IAED,oBACE;MAAK,GAAG,EAAEwG;IAAV,gBACE,oBAAC,YAAD;MACE,MAAM,EAAElE,YAAY,KAAKtC,MAD3B;MAEE,MAAM,EACJA,MAAM,KAAK,KAAX,GAAmBjB,SAAS,CAAC,KAAD,CAA5B,GAAsCA,SAAS,CAAC,uBAAD,CAHnD;MAKE,UAAU,EAAE8D,OAAO,CAAC7C,MAAD,CAAP,CAAgBiF,MAL9B;MAME,OAAO,EAAEwB;IANX,EADF,CADF;EAYD,CAjBA,CADH,CADF,eAqBE;IAAK,SAAS,EAAElI,KAAK,CAACmI;EAAtB,gBACE,oBAAC,UAAD;IACE,MAAM,EAAE;MACNC,WAAW,EAAE5H,SAAS,CAAC,qBAAD,CADhB;MAEN0E,KAAK,EAAE5B,WAFD;MAGN+E,QAAQ,EAAEzC;IAHJ,CADV;IAME,OAAO,EAAEC;EANX,EADF,CArBF,CAzHF,EAyJGvC,WAAW,IAAIE,aAAa,CAACkD,MAAd,KAAyB,CAAxC,gBACC;IAAK,SAAS,EAAE1G,KAAK,CAACsI;EAAtB,gBACE;IAAK,SAAS,EAAEtI,KAAK,CAACuI;EAAtB,GACG/H,SAAS,CAAC,2BAAD,EAA8B;IAAC8C;EAAD,CAA9B,CADZ,CADF,eAIE;IAAK,SAAS,EAAEtD,KAAK,CAACwI;EAAtB,GACGhI,SAAS,CAAC,iCAAD,CADZ,CAJF,eAOE;IAAK,SAAS,EAAER,KAAK,CAACyI,4BAAtB;IAAoD,OAAO,EAAE5C;EAA7D,GACGrF,SAAS,CAAC,kCAAD,CADZ,CAPF,CADD,gBAaC;IAAK,SAAS,EAAER,KAAK,CAAC0I;EAAtB,GACG3E,YAAY,KAAK,uBAAjB,IAA4CO,OAAO,CAACP,YAAD,CAAP,CAAsB2C,MAAtB,KAAiC,CAA7E,gBACC;IAAK,SAAS,EAAE1G,KAAK,CAAC2I;EAAtB,gBACE,oBAAC,cAAD;IACE,aAAa,EAAEnI,SAAS,CAAC,oBAAD,CAD1B;IAEE,YAAY,EAAEA,SAAS,CAAC,gCAAD,CAFzB;IAGE,kBAAkB,EAAEA,SAAS,CAAC,oBAAD,CAH/B;IAIE,aAAa,EAAC;EAJhB,EADF,CADD,GAUC8D,OAAO,CAACP,YAAD,CAAP,CAAsBiE,GAAtB,CAA0B,CAAC9D,KAAD,EAAQ+D,KAAR,KAAkB;IAC1C,SAASW,iBAAT,GAA6B;MAC3B/F,aAAa,CAACqB,KAAD,CAAb;IACD;;IACD,SAAS2E,kBAAT,GAA8B;MAC5B/F,cAAc,CAACoB,KAAD,CAAd;IACD;;IACD,MAAM;MACJJ,KADI;MAEJgF,OAAO,EAAEC,YAFL;MAGJC,iBAAiB,EAAEC,cAHf;MAIJC,gBAAgB,EAAEC;IAJd,IAKF3G,iBAAiB,CAAC0B,KAAD,CAAjB,CAAyBL,KAL7B;IAMA,oBACE;MAAK,GAAG,EAAEoE;IAAV,gBACE,oBAAC,gBAAD;MACE,UAAU,EAAExF,aAAa,CAACyB,KAAD,CAD3B;MAEE,KAAK,EAAE3B,cAAc,CAAC6G,QAAf,CAAwBlF,KAAxB,CAFT;MAGE,OAAO,EAAE;QACPJ,KADO;QAEPiF,YAFO;QAGPE,cAHO;QAIPE;MAJO,CAHX;MASE,MAAM,EAAE3G,iBAAiB,CAAC0B,KAAD,CAAjB,CAAyBC,kBATnC;MAUE,aAAa,EAAEyE,iBAVjB;MAWE,cAAc,EAAEC;IAXlB,EADF,CADF;EAiBD,CA9BD,CAXJ,CAtKJ,CADF,CADF;AAwND,CA3WD;;AA6WAxG,UAAU,CAAClB,YAAX,GAA0B;EACxBZ,IAAI,EAAEnB,QAAQ,CAACgC,iBAAT,CAA2Bb,IADT;EAExBC,SAAS,EAAEpB,QAAQ,CAACgC,iBAAT,CAA2BZ;AAFd,CAA1B;AAKA6B,UAAU,CAAChB,SAAX,2CAAuB;EACrBiB,MAAM,EAAEpD,SAAS,CAACmK,OAAV,CAAkBnK,SAAS,CAACiD,MAA5B,CADa;EAErBI,cAAc,EAAErD,SAAS,CAACmK,OAAV,CAAkBnK,SAAS,CAACiD,MAA5B,CAFK;EAGrBK,iBAAiB,EAAEtD,SAAS,CAACoK,QAAV,CACjBpK,SAAS,CAACqK,KAAV,CAAgB;IACdpF,kBAAkB,EAAEjF,SAAS,CAACgD,IADhB;IAEd2B,KAAK,EAAE3E,SAAS,CAACqK,KAAV,CAAgB;MACrBzF,KAAK,EAAE5E,SAAS,CAACkD,MADI;MAErB0G,OAAO,EAAE5J,SAAS,CAACkD,MAFE;MAGrB8G,gBAAgB,EAAEhK,SAAS,CAACkD,MAHP;MAIrB4G,iBAAiB,EAAE9J,SAAS,CAACkD,MAJR;MAKrBoH,aAAa,EAAEtK,SAAS,CAACkD;IALJ,CAAhB;EAFO,CAAhB,CADiB,CAHE;EAerBK,aAAa,EAAEvD,SAAS,CAACoK,QAAV,CAAmBpK,SAAS,CAACiD,MAA7B,CAfM;EAgBrBO,cAAc,EAAExD,SAAS,CAACgD,IAhBL;EAiBrBS,SAAS,EAAEzD,SAAS,CAACgD,IAjBA;EAkBrBU,mBAAmB,EAAE1D,SAAS,CAACoC,IAlBV;EAmBrBuB,aAAa,EAAE3D,SAAS,CAACoC,IAnBJ;EAoBrBwB,cAAc,EAAE5D,SAAS,CAACoC;AApBL,CAAvB;AAuBA,eAAee,UAAf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/battle-opponent/index.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAC,gBAAgB,EAAC,MAAM,yBAAyB,CAAC;AACzD,OAAkB,EAAC,mBAAmB,EAAC,MAAM,cAAc,CAAC;AAG5D,QAAA,MAAM,cAAc;gHASf,mBAAmB,iBACP,gBAAgB;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/battle-opponent/index.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAC,gBAAgB,EAAC,MAAM,yBAAyB,CAAC;AACzD,OAAkB,EAAC,mBAAmB,EAAC,MAAM,cAAc,CAAC;AAG5D,QAAA,MAAM,cAAc;gHASf,mBAAmB,iBACP,gBAAgB;;;;;;;;;;;;;CAyGhC,CAAC;AAQF,eAAe,cAAc,CAAC"}
|
|
@@ -109,7 +109,7 @@ const BattleOpponent = ({
|
|
|
109
109
|
anchorId: battleOpponentInfoId,
|
|
110
110
|
toolTipIsVisible: toolTipIsVisible,
|
|
111
111
|
TooltipContent: TooltipContent,
|
|
112
|
-
closeToolTipInformationTextAriaLabel: translate('
|
|
112
|
+
closeToolTipInformationTextAriaLabel: translate('close_tooltip_information')
|
|
113
113
|
}))) : /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationArrowRight, {
|
|
114
114
|
className: _style.default.rightArrow,
|
|
115
115
|
width: 16,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["BattleOpponent","isAlreadyEngaged","isRandom","userAvatarSrc","onClick","displayName","tooltipText","ariaLabel","legacyContext","translate","GetTranslateFromContext","wrapperClassnames","useMemo","classnames","style","card","random","displayNameClassnames","name","alreadyEngaged","mouseLeaveTimer","setMouseLeaveTimer","useState","undefined","toolTipIsVisible","setToolTipIsVisible","battleOpponentInfoId","uuidV5","URL","buttonRef","useRef","handleMouseOver","useCallback","clearTimeout","has","current","focus","handleMouseLeave","setTimeout","blur","handleKeyPress","event","toggleStateOnKeyPress","TooltipContent","_props","avatar","tooltipIconContainer","informationIcon","toolTipWrapper","rightArrow","propTypes","contextTypes","Provider","childContextTypes"],"sources":["../../../src/atom/battle-opponent/index.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useState, useRef} from 'react';\nimport classnames from 'classnames';\nimport {v5 as uuidV5} from 'uuid';\nimport has from 'lodash/fp/has';\nimport {\n NovaCompositionNavigationArrowRight as ArrowRight,\n NovaCompositionCoorpacademyInformationIcon as InformationIcon\n} from '@coorpacademy/nova-icons';\nimport ToolTip, {toggleStateOnKeyPress} from '../tooltip';\nimport Provider, {GetTranslateFromContext} from '../provider';\nimport {WebContextValues} from '../provider/web-context';\nimport propTypes, {BattleOpponentProps} from './prop-types';\nimport style from './style.css';\n\nconst BattleOpponent = (\n {\n isAlreadyEngaged,\n isRandom,\n userAvatarSrc,\n onClick,\n displayName,\n tooltipText,\n 'aria-label': ariaLabel\n }: BattleOpponentProps,\n legacyContext: WebContextValues\n) => {\n const translate: Required<WebContextValues>['translate'] = GetTranslateFromContext(legacyContext);\n const wrapperClassnames = useMemo(\n () => classnames(style.card, style['opponent-card'], isRandom ? style.random : null),\n [isRandom]\n );\n\n const displayNameClassnames = useMemo(\n () => classnames(style.name, isAlreadyEngaged ? style.alreadyEngaged : null),\n [isAlreadyEngaged]\n );\n\n const [mouseLeaveTimer, setMouseLeaveTimer] = useState<number | undefined>(undefined);\n const [toolTipIsVisible, setToolTipIsVisible] = useState(false);\n\n // to be replaced by useId when React17 is bumped to React18\n const [battleOpponentInfoId] = useState(\n isAlreadyEngaged ? uuidV5('engaged-battle-', uuidV5.URL) : undefined\n );\n\n const buttonRef = useRef(null);\n\n const handleMouseOver = useCallback(() => {\n mouseLeaveTimer && clearTimeout(mouseLeaveTimer);\n // @ts-expect-error (error: focus does not exists on type never)\n /* istanbul ignore next */ has(['current', 'focus'], buttonRef) && buttonRef.current.focus();\n setToolTipIsVisible(true);\n }, [mouseLeaveTimer]);\n\n const handleMouseLeave = useCallback(() => {\n setMouseLeaveTimer(\n setTimeout(() => {\n setToolTipIsVisible(false);\n // @ts-expect-error (error: blur does not exists on type never)\n /* istanbul ignore next */ has(['current', 'blur'], buttonRef) && buttonRef.current.blur();\n }, 500) as unknown as number\n );\n }, []);\n\n const handleKeyPress = useCallback(\n event => {\n toggleStateOnKeyPress(toolTipIsVisible, setToolTipIsVisible, buttonRef)(event);\n },\n [toolTipIsVisible]\n );\n\n const TooltipContent = useCallback(\n _props => (\n <p\n {..._props}\n onMouseOver={handleMouseOver}\n onMouseLeave={handleMouseLeave}\n data-testid=\"battle-opponent-tooltip-content\"\n >\n {tooltipText}\n </p>\n ),\n [handleMouseLeave, handleMouseOver, tooltipText]\n );\n\n return (\n <li\n {...(!isAlreadyEngaged && {onClick})}\n className={wrapperClassnames}\n data-testid=\"battle-opponent-wrapper\"\n tabIndex={0}\n >\n <div className={style.avatar}>{isRandom ? null : <img src={userAvatarSrc} alt=\"\" />}</div>\n <p className={displayNameClassnames} tabIndex={0}>\n {displayName}\n </p>\n {isAlreadyEngaged ? (\n <>\n <button\n ref={buttonRef}\n tabIndex={0}\n type=\"button\"\n className={style.tooltipIconContainer}\n data-testid=\"battle-engaged-opponent-information-button\"\n onKeyDown={handleKeyPress}\n onMouseLeave={handleMouseLeave}\n onMouseOver={handleMouseOver}\n data-for={battleOpponentInfoId}\n data-tooltip-place=\"left\"\n data-tip={isAlreadyEngaged}\n aria-label={ariaLabel}\n >\n <InformationIcon className={style.informationIcon} width={20} height={20} />\n </button>\n <span className={style.toolTipWrapper}>\n <ToolTip\n fontSize={12}\n anchorId={battleOpponentInfoId}\n toolTipIsVisible={toolTipIsVisible}\n TooltipContent={TooltipContent}\n closeToolTipInformationTextAriaLabel={translate(
|
|
1
|
+
{"version":3,"file":"index.js","names":["BattleOpponent","isAlreadyEngaged","isRandom","userAvatarSrc","onClick","displayName","tooltipText","ariaLabel","legacyContext","translate","GetTranslateFromContext","wrapperClassnames","useMemo","classnames","style","card","random","displayNameClassnames","name","alreadyEngaged","mouseLeaveTimer","setMouseLeaveTimer","useState","undefined","toolTipIsVisible","setToolTipIsVisible","battleOpponentInfoId","uuidV5","URL","buttonRef","useRef","handleMouseOver","useCallback","clearTimeout","has","current","focus","handleMouseLeave","setTimeout","blur","handleKeyPress","event","toggleStateOnKeyPress","TooltipContent","_props","avatar","tooltipIconContainer","informationIcon","toolTipWrapper","rightArrow","propTypes","contextTypes","Provider","childContextTypes"],"sources":["../../../src/atom/battle-opponent/index.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useState, useRef} from 'react';\nimport classnames from 'classnames';\nimport {v5 as uuidV5} from 'uuid';\nimport has from 'lodash/fp/has';\nimport {\n NovaCompositionNavigationArrowRight as ArrowRight,\n NovaCompositionCoorpacademyInformationIcon as InformationIcon\n} from '@coorpacademy/nova-icons';\nimport ToolTip, {toggleStateOnKeyPress} from '../tooltip';\nimport Provider, {GetTranslateFromContext} from '../provider';\nimport {WebContextValues} from '../provider/web-context';\nimport propTypes, {BattleOpponentProps} from './prop-types';\nimport style from './style.css';\n\nconst BattleOpponent = (\n {\n isAlreadyEngaged,\n isRandom,\n userAvatarSrc,\n onClick,\n displayName,\n tooltipText,\n 'aria-label': ariaLabel\n }: BattleOpponentProps,\n legacyContext: WebContextValues\n) => {\n const translate: Required<WebContextValues>['translate'] = GetTranslateFromContext(legacyContext);\n const wrapperClassnames = useMemo(\n () => classnames(style.card, style['opponent-card'], isRandom ? style.random : null),\n [isRandom]\n );\n\n const displayNameClassnames = useMemo(\n () => classnames(style.name, isAlreadyEngaged ? style.alreadyEngaged : null),\n [isAlreadyEngaged]\n );\n\n const [mouseLeaveTimer, setMouseLeaveTimer] = useState<number | undefined>(undefined);\n const [toolTipIsVisible, setToolTipIsVisible] = useState(false);\n\n // to be replaced by useId when React17 is bumped to React18\n const [battleOpponentInfoId] = useState(\n isAlreadyEngaged ? uuidV5('engaged-battle-', uuidV5.URL) : undefined\n );\n\n const buttonRef = useRef(null);\n\n const handleMouseOver = useCallback(() => {\n mouseLeaveTimer && clearTimeout(mouseLeaveTimer);\n // @ts-expect-error (error: focus does not exists on type never)\n /* istanbul ignore next */ has(['current', 'focus'], buttonRef) && buttonRef.current.focus();\n setToolTipIsVisible(true);\n }, [mouseLeaveTimer]);\n\n const handleMouseLeave = useCallback(() => {\n setMouseLeaveTimer(\n setTimeout(() => {\n setToolTipIsVisible(false);\n // @ts-expect-error (error: blur does not exists on type never)\n /* istanbul ignore next */ has(['current', 'blur'], buttonRef) && buttonRef.current.blur();\n }, 500) as unknown as number\n );\n }, []);\n\n const handleKeyPress = useCallback(\n event => {\n toggleStateOnKeyPress(toolTipIsVisible, setToolTipIsVisible, buttonRef)(event);\n },\n [toolTipIsVisible]\n );\n\n const TooltipContent = useCallback(\n _props => (\n <p\n {..._props}\n onMouseOver={handleMouseOver}\n onMouseLeave={handleMouseLeave}\n data-testid=\"battle-opponent-tooltip-content\"\n >\n {tooltipText}\n </p>\n ),\n [handleMouseLeave, handleMouseOver, tooltipText]\n );\n\n return (\n <li\n {...(!isAlreadyEngaged && {onClick})}\n className={wrapperClassnames}\n data-testid=\"battle-opponent-wrapper\"\n tabIndex={0}\n >\n <div className={style.avatar}>{isRandom ? null : <img src={userAvatarSrc} alt=\"\" />}</div>\n <p className={displayNameClassnames} tabIndex={0}>\n {displayName}\n </p>\n {isAlreadyEngaged ? (\n <>\n <button\n ref={buttonRef}\n tabIndex={0}\n type=\"button\"\n className={style.tooltipIconContainer}\n data-testid=\"battle-engaged-opponent-information-button\"\n onKeyDown={handleKeyPress}\n onMouseLeave={handleMouseLeave}\n onMouseOver={handleMouseOver}\n data-for={battleOpponentInfoId}\n data-tooltip-place=\"left\"\n data-tip={isAlreadyEngaged}\n aria-label={ariaLabel}\n >\n <InformationIcon className={style.informationIcon} width={20} height={20} />\n </button>\n <span className={style.toolTipWrapper}>\n <ToolTip\n fontSize={12}\n anchorId={battleOpponentInfoId}\n toolTipIsVisible={toolTipIsVisible}\n TooltipContent={TooltipContent}\n closeToolTipInformationTextAriaLabel={translate('close_tooltip_information')}\n />\n </span>\n </>\n ) : (\n <ArrowRight className={style.rightArrow} width={16} height={16} />\n )}\n </li>\n );\n};\n\nBattleOpponent.propTypes = propTypes;\n\nBattleOpponent.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nexport default BattleOpponent;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"favorite.d.ts","sourceRoot":"","sources":["../../../src/molecule/card/favorite.js"],"names":[],"mappings":";AAcA;;;;;;;;
|
|
1
|
+
{"version":3,"file":"favorite.d.ts","sourceRoot":"","sources":["../../../src/molecule/card/favorite.js"],"names":[],"mappings":";AAcA;;;;;;;;oCAwIC"}
|
|
@@ -130,7 +130,7 @@ const Favorite = ({
|
|
|
130
130
|
anchorId: favoriteButtonAnchorId,
|
|
131
131
|
toolTipIsVisible: toolTipIsVisible,
|
|
132
132
|
TooltipContent: toolTipContent,
|
|
133
|
-
closeToolTipInformationTextAriaLabel: translate('
|
|
133
|
+
closeToolTipInformationTextAriaLabel: translate('close_tooltip_information'),
|
|
134
134
|
stickyOnKeyboardNavigation: true
|
|
135
135
|
}));
|
|
136
136
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"favorite.js","names":["Favorite","favorite","addFavoriteToolTip","removeFavoriteToolTip","className","ariaLabel","onFavoriteClick","disabled","legacyContext","skin","GetSkinFromContext","translate","GetTranslateFromContext","handleFavoriteClick","useCallback","e","stopPropagation","preventDefault","primaryColor","darkColor","brandColor","buttonRef","useRef","allowToolTip","useMemo","favoriteButtonAnchorId","useState","uuidV5","URL","undefined","toolTipContent","mouseLeaveTimer","setMouseLeaveTimer","toolTipIsVisible","setToolTipIsVisible","handleMouseOver","clearTimeout","current","focus","handleMouseLeave","setTimeout","blur","handleKeyPress","event","toggleStateOnKeyPress","iconWrapperClassName","classnames","style","selected","icon","checkIcon","color","removeFromFavorite","moreIcon","addToFavorite","favoriteWrapper","propTypes","PropTypes","string","bool","func","shape","contextTypes","Provider","childContextTypes"],"sources":["../../../src/molecule/card/favorite.js"],"sourcesContent":["import React, {useCallback, useMemo, useRef, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {v5 as uuidV5} from 'uuid';\nimport {get, has, isEmpty, noop} from 'lodash/fp';\nimport {\n NovaCompositionNavigationMore as MoreIcon,\n NovaCompositionCoorpacademyCheck as CheckIcon\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext, GetTranslateFromContext} from '../../atom/provider';\nimport ToolTip, {toggleStateOnKeyPress} from '../../atom/tooltip';\nimport Button from '../../atom/button';\nimport style from './favorite.css';\n\nconst Favorite = (\n {\n favorite,\n addFavoriteToolTip,\n removeFavoriteToolTip,\n className,\n 'aria-label': ariaLabel = {},\n onFavoriteClick = noop,\n disabled\n },\n legacyContext\n) => {\n const skin = GetSkinFromContext(legacyContext);\n const translate = GetTranslateFromContext(legacyContext);\n const handleFavoriteClick = useCallback(\n e => {\n e.stopPropagation();\n e.preventDefault();\n if (!disabled) onFavoriteClick(e);\n },\n [disabled, onFavoriteClick]\n );\n\n const primaryColor = get('common.primary', skin);\n const darkColor = get('common.dark', skin);\n const brandColor = get('common.brand', skin);\n\n const buttonRef = useRef(null);\n\n const allowToolTip = useMemo(\n () => !isEmpty(removeFavoriteToolTip) && !isEmpty(addFavoriteToolTip),\n [addFavoriteToolTip, removeFavoriteToolTip]\n );\n\n // to be replaced by useId when React17 is bumped to React18\n const [favoriteButtonAnchorId] = useState(\n allowToolTip ? uuidV5('engaged-battle-', uuidV5.URL) : undefined\n );\n\n const toolTipContent = useMemo(\n // eslint-disable-next-line no-nested-ternary\n () => (allowToolTip ? (favorite ? removeFavoriteToolTip : addFavoriteToolTip) : null),\n [addFavoriteToolTip, favorite, removeFavoriteToolTip, allowToolTip]\n );\n\n const [mouseLeaveTimer, setMouseLeaveTimer] = useState(undefined);\n\n const [toolTipIsVisible, setToolTipIsVisible] = useState(false);\n\n const handleMouseOver = useCallback(() => {\n mouseLeaveTimer && clearTimeout(mouseLeaveTimer);\n /* istanbul ignore next */ has(['current', 'focus'], buttonRef) && buttonRef.current.focus();\n setToolTipIsVisible(true);\n }, [mouseLeaveTimer]);\n\n const handleMouseLeave = useCallback(() => {\n setMouseLeaveTimer(\n setTimeout(() => {\n setToolTipIsVisible(false);\n // @ts-expect-error (error: blur does not exists on type never)\n /* istanbul ignore next */ has(['current', 'blur'], buttonRef) && buttonRef.current.blur();\n }, 500)\n );\n }, []);\n\n const handleKeyPress = useCallback(\n event => {\n toggleStateOnKeyPress(toolTipIsVisible, setToolTipIsVisible, buttonRef)(event);\n },\n [toolTipIsVisible]\n );\n\n const iconWrapperClassName = useMemo(\n () => classnames(style.favorite, className, favorite && style.selected),\n [className, favorite]\n );\n const icon = useMemo(\n () =>\n favorite ? (\n <CheckIcon\n // eslint-disable-next-line css-modules/no-undef-class\n className={style.checkIcon}\n style={{color: brandColor}}\n width={13}\n height={13}\n data-testid=\"favorite-check-icon\"\n aria-label={ariaLabel.removeFromFavorite}\n />\n ) : (\n <MoreIcon\n className={style.moreIcon}\n style={{color: darkColor}}\n width={13}\n height={13}\n data-testid=\"favorite-add-icon\"\n aria-label={ariaLabel.addToFavorite}\n />\n ),\n [ariaLabel.addToFavorite, ariaLabel.removeFromFavorite, brandColor, darkColor, favorite]\n );\n\n return (\n <div className={style.favoriteWrapper} data-testid=\"favorite-wrapper\">\n <Button\n buttonRef={buttonRef}\n type=\"button\"\n data-for={favoriteButtonAnchorId}\n data-tooltip-place=\"left\"\n data-tip={allowToolTip}\n data-name=\"favorite\"\n data-testid=\"favorite-button\"\n aria-label={ariaLabel.favorite}\n buttonContentClassName={iconWrapperClassName}\n onClick={handleFavoriteClick}\n style={{\n color: primaryColor\n }}\n onKeyDown={handleKeyPress}\n onMouseLeave={handleMouseLeave}\n onMouseOver={handleMouseOver}\n tabIndex={0}\n useButtonTag\n useWrapper={false}\n >\n {icon}\n </Button>\n <ToolTip\n fontSize={12}\n anchorId={favoriteButtonAnchorId}\n toolTipIsVisible={toolTipIsVisible}\n TooltipContent={toolTipContent}\n closeToolTipInformationTextAriaLabel={translate(\n 'Press the escape key to close the information text'\n )}\n stickyOnKeyboardNavigation\n />\n </div>\n );\n};\n\nFavorite.propTypes = {\n className: PropTypes.string,\n favorite: PropTypes.bool,\n disabled: PropTypes.bool,\n addFavoriteToolTip: PropTypes.string,\n removeFavoriteToolTip: PropTypes.string,\n onFavoriteClick: PropTypes.func,\n 'aria-label': PropTypes.shape({\n favorite: PropTypes.string,\n addToFavorite: PropTypes.string,\n removeFromFavorite: PropTypes.string\n })\n};\n\nFavorite.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nexport default Favorite;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"favorite.js","names":["Favorite","favorite","addFavoriteToolTip","removeFavoriteToolTip","className","ariaLabel","onFavoriteClick","disabled","legacyContext","skin","GetSkinFromContext","translate","GetTranslateFromContext","handleFavoriteClick","useCallback","e","stopPropagation","preventDefault","primaryColor","darkColor","brandColor","buttonRef","useRef","allowToolTip","useMemo","favoriteButtonAnchorId","useState","uuidV5","URL","undefined","toolTipContent","mouseLeaveTimer","setMouseLeaveTimer","toolTipIsVisible","setToolTipIsVisible","handleMouseOver","clearTimeout","current","focus","handleMouseLeave","setTimeout","blur","handleKeyPress","event","toggleStateOnKeyPress","iconWrapperClassName","classnames","style","selected","icon","checkIcon","color","removeFromFavorite","moreIcon","addToFavorite","favoriteWrapper","propTypes","PropTypes","string","bool","func","shape","contextTypes","Provider","childContextTypes"],"sources":["../../../src/molecule/card/favorite.js"],"sourcesContent":["import React, {useCallback, useMemo, useRef, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {v5 as uuidV5} from 'uuid';\nimport {get, has, isEmpty, noop} from 'lodash/fp';\nimport {\n NovaCompositionNavigationMore as MoreIcon,\n NovaCompositionCoorpacademyCheck as CheckIcon\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext, GetTranslateFromContext} from '../../atom/provider';\nimport ToolTip, {toggleStateOnKeyPress} from '../../atom/tooltip';\nimport Button from '../../atom/button';\nimport style from './favorite.css';\n\nconst Favorite = (\n {\n favorite,\n addFavoriteToolTip,\n removeFavoriteToolTip,\n className,\n 'aria-label': ariaLabel = {},\n onFavoriteClick = noop,\n disabled\n },\n legacyContext\n) => {\n const skin = GetSkinFromContext(legacyContext);\n const translate = GetTranslateFromContext(legacyContext);\n const handleFavoriteClick = useCallback(\n e => {\n e.stopPropagation();\n e.preventDefault();\n if (!disabled) onFavoriteClick(e);\n },\n [disabled, onFavoriteClick]\n );\n\n const primaryColor = get('common.primary', skin);\n const darkColor = get('common.dark', skin);\n const brandColor = get('common.brand', skin);\n\n const buttonRef = useRef(null);\n\n const allowToolTip = useMemo(\n () => !isEmpty(removeFavoriteToolTip) && !isEmpty(addFavoriteToolTip),\n [addFavoriteToolTip, removeFavoriteToolTip]\n );\n\n // to be replaced by useId when React17 is bumped to React18\n const [favoriteButtonAnchorId] = useState(\n allowToolTip ? uuidV5('engaged-battle-', uuidV5.URL) : undefined\n );\n\n const toolTipContent = useMemo(\n // eslint-disable-next-line no-nested-ternary\n () => (allowToolTip ? (favorite ? removeFavoriteToolTip : addFavoriteToolTip) : null),\n [addFavoriteToolTip, favorite, removeFavoriteToolTip, allowToolTip]\n );\n\n const [mouseLeaveTimer, setMouseLeaveTimer] = useState(undefined);\n\n const [toolTipIsVisible, setToolTipIsVisible] = useState(false);\n\n const handleMouseOver = useCallback(() => {\n mouseLeaveTimer && clearTimeout(mouseLeaveTimer);\n /* istanbul ignore next */ has(['current', 'focus'], buttonRef) && buttonRef.current.focus();\n setToolTipIsVisible(true);\n }, [mouseLeaveTimer]);\n\n const handleMouseLeave = useCallback(() => {\n setMouseLeaveTimer(\n setTimeout(() => {\n setToolTipIsVisible(false);\n // @ts-expect-error (error: blur does not exists on type never)\n /* istanbul ignore next */ has(['current', 'blur'], buttonRef) && buttonRef.current.blur();\n }, 500)\n );\n }, []);\n\n const handleKeyPress = useCallback(\n event => {\n toggleStateOnKeyPress(toolTipIsVisible, setToolTipIsVisible, buttonRef)(event);\n },\n [toolTipIsVisible]\n );\n\n const iconWrapperClassName = useMemo(\n () => classnames(style.favorite, className, favorite && style.selected),\n [className, favorite]\n );\n const icon = useMemo(\n () =>\n favorite ? (\n <CheckIcon\n // eslint-disable-next-line css-modules/no-undef-class\n className={style.checkIcon}\n style={{color: brandColor}}\n width={13}\n height={13}\n data-testid=\"favorite-check-icon\"\n aria-label={ariaLabel.removeFromFavorite}\n />\n ) : (\n <MoreIcon\n className={style.moreIcon}\n style={{color: darkColor}}\n width={13}\n height={13}\n data-testid=\"favorite-add-icon\"\n aria-label={ariaLabel.addToFavorite}\n />\n ),\n [ariaLabel.addToFavorite, ariaLabel.removeFromFavorite, brandColor, darkColor, favorite]\n );\n\n return (\n <div className={style.favoriteWrapper} data-testid=\"favorite-wrapper\">\n <Button\n buttonRef={buttonRef}\n type=\"button\"\n data-for={favoriteButtonAnchorId}\n data-tooltip-place=\"left\"\n data-tip={allowToolTip}\n data-name=\"favorite\"\n data-testid=\"favorite-button\"\n aria-label={ariaLabel.favorite}\n buttonContentClassName={iconWrapperClassName}\n onClick={handleFavoriteClick}\n style={{\n color: primaryColor\n }}\n onKeyDown={handleKeyPress}\n onMouseLeave={handleMouseLeave}\n onMouseOver={handleMouseOver}\n tabIndex={0}\n useButtonTag\n useWrapper={false}\n >\n {icon}\n </Button>\n <ToolTip\n fontSize={12}\n anchorId={favoriteButtonAnchorId}\n toolTipIsVisible={toolTipIsVisible}\n TooltipContent={toolTipContent}\n closeToolTipInformationTextAriaLabel={translate('close_tooltip_information')}\n stickyOnKeyboardNavigation\n />\n </div>\n );\n};\n\nFavorite.propTypes = {\n className: PropTypes.string,\n favorite: PropTypes.bool,\n disabled: PropTypes.bool,\n addFavoriteToolTip: PropTypes.string,\n removeFavoriteToolTip: PropTypes.string,\n onFavoriteClick: PropTypes.func,\n 'aria-label': PropTypes.shape({\n favorite: PropTypes.string,\n addToFavorite: PropTypes.string,\n removeFromFavorite: PropTypes.string\n })\n};\n\nFavorite.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nexport default Favorite;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
export default DisciplineAssociatedSkills;
|
|
2
|
+
declare function DisciplineAssociatedSkills(props: any, context: any): JSX.Element | null;
|
|
3
|
+
declare namespace DisciplineAssociatedSkills {
|
|
4
|
+
namespace contextTypes {
|
|
5
|
+
const translate: PropTypes.Requireable<(...args: any[]) => any>;
|
|
6
|
+
}
|
|
7
|
+
namespace propTypes {
|
|
8
|
+
const skills: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
9
|
+
ref: PropTypes.Requireable<string>;
|
|
10
|
+
locale: PropTypes.Requireable<string>;
|
|
11
|
+
focused: PropTypes.Requireable<boolean>;
|
|
12
|
+
}> | null | undefined)[]>;
|
|
13
|
+
const onSkillClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
import PropTypes from "prop-types";
|
|
17
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/discipline-associated-skills/index.js"],"names":[],"mappings":";AAUA,0FA0DC"}
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = void 0;
|
|
5
|
+
|
|
6
|
+
var _uniqueId2 = _interopRequireDefault(require("lodash/fp/uniqueId"));
|
|
7
|
+
|
|
8
|
+
var _isEmpty2 = _interopRequireDefault(require("lodash/fp/isEmpty"));
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
+
|
|
12
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
+
|
|
14
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
15
|
+
|
|
16
|
+
var _icon = _interopRequireDefault(require("../../atom/icon"));
|
|
17
|
+
|
|
18
|
+
var _tooltip = _interopRequireDefault(require("../../atom/tooltip"));
|
|
19
|
+
|
|
20
|
+
var _provider = _interopRequireDefault(require("../../atom/provider"));
|
|
21
|
+
|
|
22
|
+
var _catalogSection = _interopRequireDefault(require("../../atom/catalog-section"));
|
|
23
|
+
|
|
24
|
+
var _style = _interopRequireDefault(require("./style.css"));
|
|
25
|
+
|
|
26
|
+
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); }
|
|
27
|
+
|
|
28
|
+
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; }
|
|
29
|
+
|
|
30
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
31
|
+
|
|
32
|
+
const DisciplineAssociatedSkills = (props, context) => {
|
|
33
|
+
const {
|
|
34
|
+
translate
|
|
35
|
+
} = context;
|
|
36
|
+
const {
|
|
37
|
+
skills = [],
|
|
38
|
+
onSkillClick
|
|
39
|
+
} = props;
|
|
40
|
+
const AnchorElement = (0, _react.useCallback)(skill => /*#__PURE__*/_react.default.createElement("div", {
|
|
41
|
+
className: _style.default.chipFocusedContent
|
|
42
|
+
}, /*#__PURE__*/_react.default.createElement(_icon.default, {
|
|
43
|
+
iconName: "bullseye-arrow",
|
|
44
|
+
backgroundColor: "#DDD1FF",
|
|
45
|
+
size: {
|
|
46
|
+
faSize: 12,
|
|
47
|
+
wrapperSize: 12
|
|
48
|
+
}
|
|
49
|
+
}), skill), []);
|
|
50
|
+
return !(0, _isEmpty2.default)(skills) ? /*#__PURE__*/_react.default.createElement("div", {
|
|
51
|
+
"data-name": "discipline-associated-skills",
|
|
52
|
+
className: _style.default.associatedSkillsWrapper
|
|
53
|
+
}, /*#__PURE__*/_react.default.createElement(_catalogSection.default, {
|
|
54
|
+
title: translate('associated_skills')
|
|
55
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
56
|
+
className: _style.default.chipsWrapper
|
|
57
|
+
}, skills.map(skill => {
|
|
58
|
+
function handleSkillClick() {
|
|
59
|
+
return onSkillClick(skill.ref);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
function handleAnchorElement() {
|
|
63
|
+
return AnchorElement(skill.locale);
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
67
|
+
key: (0, _uniqueId2.default)(),
|
|
68
|
+
className: (0, _classnames.default)(_style.default.chipWrapper, skill.focused && _style.default.chipWrapperFocused),
|
|
69
|
+
onClick: handleSkillClick
|
|
70
|
+
}, skill.focused ? /*#__PURE__*/_react.default.createElement(_tooltip.default, {
|
|
71
|
+
AnchorElement: handleAnchorElement,
|
|
72
|
+
fontSize: 12,
|
|
73
|
+
iconContainerClassName: _style.default.infoIconTooltip,
|
|
74
|
+
tooltipClassName: _style.default.tooltip,
|
|
75
|
+
TooltipContent: translate('skill_focused_chip_tooltip'),
|
|
76
|
+
closeToolTipInformationTextAriaLabel: translate('close_tooltip_information')
|
|
77
|
+
}) : skill.locale);
|
|
78
|
+
})))) : null;
|
|
79
|
+
};
|
|
80
|
+
|
|
81
|
+
DisciplineAssociatedSkills.contextTypes = {
|
|
82
|
+
translate: _provider.default.childContextTypes.translate
|
|
83
|
+
};
|
|
84
|
+
DisciplineAssociatedSkills.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
85
|
+
skills: _propTypes.default.arrayOf(_propTypes.default.shape({
|
|
86
|
+
ref: _propTypes.default.string,
|
|
87
|
+
locale: _propTypes.default.string,
|
|
88
|
+
focused: _propTypes.default.bool
|
|
89
|
+
})),
|
|
90
|
+
onSkillClick: _propTypes.default.func
|
|
91
|
+
} : {};
|
|
92
|
+
var _default = DisciplineAssociatedSkills;
|
|
93
|
+
exports.default = _default;
|
|
94
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["DisciplineAssociatedSkills","props","context","translate","skills","onSkillClick","AnchorElement","useCallback","skill","style","chipFocusedContent","faSize","wrapperSize","associatedSkillsWrapper","chipsWrapper","map","handleSkillClick","ref","handleAnchorElement","locale","classnames","chipWrapper","focused","chipWrapperFocused","infoIconTooltip","tooltip","contextTypes","Provider","childContextTypes","propTypes","PropTypes","arrayOf","shape","string","bool","func"],"sources":["../../../src/molecule/discipline-associated-skills/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {isEmpty, uniqueId} from 'lodash/fp';\nimport Icon from '../../atom/icon';\nimport ToolTip from '../../atom/tooltip';\nimport Provider from '../../atom/provider';\nimport CatalogSection from '../../atom/catalog-section';\nimport style from './style.css';\n\nconst DisciplineAssociatedSkills = (props, context) => {\n const {translate} = context;\n\n const {skills = [], onSkillClick} = props;\n\n const AnchorElement = useCallback(\n skill => (\n <div className={style.chipFocusedContent}>\n <Icon\n iconName=\"bullseye-arrow\"\n backgroundColor=\"#DDD1FF\"\n size={{\n faSize: 12,\n wrapperSize: 12\n }}\n />\n {skill}\n </div>\n ),\n []\n );\n\n return !isEmpty(skills) ? (\n <div data-name=\"discipline-associated-skills\" className={style.associatedSkillsWrapper}>\n <CatalogSection title={translate('associated_skills')}>\n <div className={style.chipsWrapper}>\n {skills.map(skill => {\n function handleSkillClick() {\n return onSkillClick(skill.ref);\n }\n function handleAnchorElement() {\n return AnchorElement(skill.locale);\n }\n return (\n <div\n key={uniqueId()}\n className={classnames(style.chipWrapper, skill.focused && style.chipWrapperFocused)}\n onClick={handleSkillClick}\n >\n {skill.focused ? (\n <ToolTip\n AnchorElement={handleAnchorElement}\n fontSize={12}\n iconContainerClassName={style.infoIconTooltip}\n tooltipClassName={style.tooltip}\n TooltipContent={translate('skill_focused_chip_tooltip')}\n closeToolTipInformationTextAriaLabel={translate('close_tooltip_information')}\n />\n ) : (\n skill.locale\n )}\n </div>\n );\n })}\n </div>\n </CatalogSection>\n </div>\n ) : null;\n};\n\nDisciplineAssociatedSkills.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nDisciplineAssociatedSkills.propTypes = {\n skills: PropTypes.arrayOf(\n PropTypes.shape({\n ref: PropTypes.string,\n locale: PropTypes.string,\n focused: PropTypes.bool\n })\n ),\n onSkillClick: PropTypes.func\n};\n\nexport default DisciplineAssociatedSkills;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,MAAMA,0BAA0B,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACrD,MAAM;IAACC;EAAD,IAAcD,OAApB;EAEA,MAAM;IAACE,MAAM,GAAG,EAAV;IAAcC;EAAd,IAA8BJ,KAApC;EAEA,MAAMK,aAAa,GAAG,IAAAC,kBAAA,EACpBC,KAAK,iBACH;IAAK,SAAS,EAAEC,cAAA,CAAMC;EAAtB,gBACE,6BAAC,aAAD;IACE,QAAQ,EAAC,gBADX;IAEE,eAAe,EAAC,SAFlB;IAGE,IAAI,EAAE;MACJC,MAAM,EAAE,EADJ;MAEJC,WAAW,EAAE;IAFT;EAHR,EADF,EASGJ,KATH,CAFkB,EAcpB,EAdoB,CAAtB;EAiBA,OAAO,CAAC,uBAAQJ,MAAR,CAAD,gBACL;IAAK,aAAU,8BAAf;IAA8C,SAAS,EAAEK,cAAA,CAAMI;EAA/D,gBACE,6BAAC,uBAAD;IAAgB,KAAK,EAAEV,SAAS,CAAC,mBAAD;EAAhC,gBACE;IAAK,SAAS,EAAEM,cAAA,CAAMK;EAAtB,GACGV,MAAM,CAACW,GAAP,CAAWP,KAAK,IAAI;IACnB,SAASQ,gBAAT,GAA4B;MAC1B,OAAOX,YAAY,CAACG,KAAK,CAACS,GAAP,CAAnB;IACD;;IACD,SAASC,mBAAT,GAA+B;MAC7B,OAAOZ,aAAa,CAACE,KAAK,CAACW,MAAP,CAApB;IACD;;IACD,oBACE;MACE,GAAG,EAAE,yBADP;MAEE,SAAS,EAAE,IAAAC,mBAAA,EAAWX,cAAA,CAAMY,WAAjB,EAA8Bb,KAAK,CAACc,OAAN,IAAiBb,cAAA,CAAMc,kBAArD,CAFb;MAGE,OAAO,EAAEP;IAHX,GAKGR,KAAK,CAACc,OAAN,gBACC,6BAAC,gBAAD;MACE,aAAa,EAAEJ,mBADjB;MAEE,QAAQ,EAAE,EAFZ;MAGE,sBAAsB,EAAET,cAAA,CAAMe,eAHhC;MAIE,gBAAgB,EAAEf,cAAA,CAAMgB,OAJ1B;MAKE,cAAc,EAAEtB,SAAS,CAAC,4BAAD,CAL3B;MAME,oCAAoC,EAAEA,SAAS,CAAC,2BAAD;IANjD,EADD,GAUCK,KAAK,CAACW,MAfV,CADF;EAoBD,CA3BA,CADH,CADF,CADF,CADK,GAmCH,IAnCJ;AAoCD,CA1DD;;AA4DAnB,0BAA0B,CAAC0B,YAA3B,GAA0C;EACxCvB,SAAS,EAAEwB,iBAAA,CAASC,iBAAT,CAA2BzB;AADE,CAA1C;AAIAH,0BAA0B,CAAC6B,SAA3B,2CAAuC;EACrCzB,MAAM,EAAE0B,kBAAA,CAAUC,OAAV,CACND,kBAAA,CAAUE,KAAV,CAAgB;IACdf,GAAG,EAAEa,kBAAA,CAAUG,MADD;IAEdd,MAAM,EAAEW,kBAAA,CAAUG,MAFJ;IAGdX,OAAO,EAAEQ,kBAAA,CAAUI;EAHL,CAAhB,CADM,CAD6B;EAQrC7B,YAAY,EAAEyB,kBAAA,CAAUK;AARa,CAAvC;eAWenC,0B"}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
@value colors: "../../variables/colors.css";
|
|
2
|
+
@value breakpoints: "../../variables/breakpoints.css";
|
|
3
|
+
@value desktop from breakpoints;
|
|
4
|
+
@value cm_grey_100 from colors;
|
|
5
|
+
@value cm_grey_200 from colors;
|
|
6
|
+
@value cm_grey_700 from colors;
|
|
7
|
+
|
|
8
|
+
.associatedSkillsWrapper {
|
|
9
|
+
margin-bottom: 12px;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.chipsWrapper {
|
|
13
|
+
display: flex;
|
|
14
|
+
flex-wrap: wrap;
|
|
15
|
+
gap: 8px;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.chipWrapper {
|
|
19
|
+
width: fit-content;
|
|
20
|
+
border-radius: 8px;
|
|
21
|
+
padding: 4px 8px;
|
|
22
|
+
background-color: cm_grey_200;
|
|
23
|
+
color: cm_grey_700;
|
|
24
|
+
font-family: 'Gilroy';
|
|
25
|
+
font-style: normal;
|
|
26
|
+
font-weight: 600;
|
|
27
|
+
line-height: 20px;
|
|
28
|
+
font-size: 14px;
|
|
29
|
+
text-overflow: ellipsis;
|
|
30
|
+
white-space: nowrap;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.chipWrapperFocused {
|
|
34
|
+
background-color: #DDD1FF;
|
|
35
|
+
color: #3900D6;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.chipFocusedContent {
|
|
39
|
+
display: flex;
|
|
40
|
+
align-items: center;
|
|
41
|
+
gap: 4px;
|
|
42
|
+
|
|
43
|
+
div {
|
|
44
|
+
padding: 0 !important;
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.infoIconTooltip {
|
|
49
|
+
background-color: transparent;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.tooltip {
|
|
53
|
+
width: fit-content;
|
|
54
|
+
color: #FFF;
|
|
55
|
+
font-size: 12px;
|
|
56
|
+
font-style: normal;
|
|
57
|
+
line-height: 16px;
|
|
58
|
+
right: -28px;
|
|
59
|
+
top: -48px;
|
|
60
|
+
|
|
61
|
+
p {
|
|
62
|
+
padding: 8px 8px;
|
|
63
|
+
margin: 0;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
@media desktop {
|
|
68
|
+
.associatedSkillsWrapper {
|
|
69
|
+
margin-top: 24px;
|
|
70
|
+
}
|
|
71
|
+
}
|
|
@@ -1,10 +1,35 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
import { WebContextValues } from '../../atom/provider/web-context';
|
|
2
3
|
import { FormatedDataType, LearningProfileRadarChartPropTypes } from './types';
|
|
3
4
|
export declare const formatData: (legend: {
|
|
4
5
|
[ref: string]: string;
|
|
5
6
|
}, data_: LearningProfileRadarChartPropTypes['data']) => FormatedDataType[];
|
|
6
7
|
export declare const LearningProfileRadarChart: {
|
|
7
|
-
({ data, legend, totalDataset, colors: colorsProps, onClick, width, height, margin }: LearningProfileRadarChartPropTypes): JSX.Element;
|
|
8
|
+
({ data, legend, totalDataset, colors: colorsProps, onClick, onExploreClick, width, height, margin }: LearningProfileRadarChartPropTypes, legacyContext: WebContextValues): JSX.Element;
|
|
9
|
+
contextTypes: {
|
|
10
|
+
skin: import("prop-types").Requireable<import("prop-types").InferProps<{
|
|
11
|
+
common: import("prop-types").Requireable<{
|
|
12
|
+
[x: string]: any;
|
|
13
|
+
}>;
|
|
14
|
+
images: import("prop-types").Requireable<import("prop-types").InferProps<{
|
|
15
|
+
'logo-mobile': import("prop-types").Requireable<any>;
|
|
16
|
+
logo: import("prop-types").Requireable<any>;
|
|
17
|
+
'logo-email': import("prop-types").Requireable<any>;
|
|
18
|
+
login: import("prop-types").Requireable<any>;
|
|
19
|
+
}>>;
|
|
20
|
+
icons: import("prop-types").Requireable<{
|
|
21
|
+
[x: string]: any;
|
|
22
|
+
}>;
|
|
23
|
+
mod: import("prop-types").Requireable<{
|
|
24
|
+
[x: string]: any;
|
|
25
|
+
}>;
|
|
26
|
+
courses: import("prop-types").Requireable<any[]>;
|
|
27
|
+
texts: import("prop-types").Requireable<{
|
|
28
|
+
[x: string]: any;
|
|
29
|
+
}>;
|
|
30
|
+
}>>;
|
|
31
|
+
translate: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
32
|
+
};
|
|
8
33
|
propTypes: {
|
|
9
34
|
data: import("prop-types").Validator<{
|
|
10
35
|
[x: string]: NonNullable<number | (number | null | undefined)[] | null | undefined> | null | undefined;
|
|
@@ -26,6 +51,7 @@ export declare const LearningProfileRadarChart: {
|
|
|
26
51
|
}> | null | undefined)[]>;
|
|
27
52
|
width: import("prop-types").Requireable<number>;
|
|
28
53
|
height: import("prop-types").Requireable<number>;
|
|
54
|
+
onExploreClick: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
29
55
|
};
|
|
30
56
|
};
|
|
31
57
|
declare const ResponsiveLearningProfileRadarChart: {
|
|
@@ -51,6 +77,7 @@ declare const ResponsiveLearningProfileRadarChart: {
|
|
|
51
77
|
}> | null | undefined)[]>;
|
|
52
78
|
width: import("prop-types").Requireable<number>;
|
|
53
79
|
height: import("prop-types").Requireable<number>;
|
|
80
|
+
onExploreClick: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
54
81
|
};
|
|
55
82
|
};
|
|
56
83
|
export default ResponsiveLearningProfileRadarChart;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-profile-radar-chart/index.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-profile-radar-chart/index.tsx"],"names":[],"mappings":";AAiCA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AACjE,OAAO,EAGL,gBAAgB,EAChB,kCAAkC,EAGnC,MAAM,SAAS,CAAC;AAmUjB,eAAO,MAAM,UAAU,EAAE,CACvB,MAAM,EAAE;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;CAAC,EAC/B,KAAK,EAAE,kCAAkC,CAAC,MAAM,CAAC,KAC9C,gBAAgB,EAOX,CAAC;AAEX,eAAO,MAAM,yBAAyB;0GAWjC,kCAAkC,iBACtB,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqJhC,CAAC;AAEF,QAAA,MAAM,mCAAmC;YAAW,kCAAkC;;;;;;;;;;;;;;;;;;;;;;;;CAIrF,CAAC;AAUF,eAAe,mCAAmC,CAAC"}
|