@coorpacademy/components 11.32.20-alpha.36 → 11.32.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/atom/button-link/index.d.ts +2 -0
- package/es/atom/button-link/index.d.ts.map +1 -1
- package/es/atom/button-link/index.js +22 -8
- package/es/atom/button-link/index.js.map +1 -1
- package/es/atom/button-link/types.d.ts +4 -0
- package/es/atom/button-link/types.d.ts.map +1 -1
- package/es/atom/button-link/types.js +2 -0
- package/es/atom/button-link/types.js.map +1 -1
- package/es/atom/radio-with-title/index.d.ts +0 -6
- package/es/atom/radio-with-title/index.d.ts.map +1 -1
- package/es/atom/radio-with-title/types.d.ts +0 -6
- package/es/atom/radio-with-title/types.d.ts.map +1 -1
- package/es/atom/tag/style.css +1 -2
- package/es/atom/title/index.d.ts +0 -6
- package/es/atom/title/index.d.ts.map +1 -1
- package/es/atom/title/index.js +4 -16
- package/es/atom/title/index.js.map +1 -1
- package/es/atom/title/style.css +0 -13
- package/es/molecule/base-modal/index.d.ts.map +1 -1
- package/es/molecule/base-modal/index.js +6 -10
- package/es/molecule/base-modal/index.js.map +1 -1
- package/es/molecule/cm-popin/types.d.ts +4 -6
- package/es/molecule/cm-popin/types.d.ts.map +1 -1
- package/es/molecule/dashboard/cards-list/index.d.ts +0 -1
- package/es/molecule/dashboard/cards-list/index.d.ts.map +1 -1
- package/es/molecule/dashboard/cards-list/index.js +25 -23
- package/es/molecule/dashboard/cards-list/index.js.map +1 -1
- package/es/molecule/dashboard/cards-list/prop-types.d.ts +0 -1
- package/es/molecule/dashboard/cards-list/prop-types.d.ts.map +1 -1
- package/es/molecule/dashboard/cards-list/prop-types.js.map +1 -1
- package/es/molecule/dashboard/cards-list/style.css +29 -12
- package/es/molecule/expandible-actionable-table/index.d.ts +2 -0
- package/es/molecule/expandible-actionable-table/index.d.ts.map +1 -1
- package/es/molecule/expandible-actionable-table/types.d.ts +2 -0
- package/es/molecule/expandible-actionable-table/types.d.ts.map +1 -1
- package/es/molecule/learner-skill-card/index.d.ts.map +1 -1
- package/es/molecule/learner-skill-card/index.js +7 -10
- package/es/molecule/learner-skill-card/index.js.map +1 -1
- package/es/molecule/learning-priority-card/index.d.ts +0 -1
- package/es/molecule/learning-priority-card/index.d.ts.map +1 -1
- package/es/molecule/learning-priority-card/index.js +7 -10
- package/es/molecule/learning-priority-card/index.js.map +1 -1
- package/es/molecule/learning-priority-card/style.css +0 -2
- package/es/molecule/learning-priority-card/types.d.ts +0 -2
- package/es/molecule/learning-priority-card/types.d.ts.map +1 -1
- package/es/molecule/learning-priority-card/types.js +1 -2
- package/es/molecule/learning-priority-card/types.js.map +1 -1
- package/es/molecule/skill-card/index.d.ts.map +1 -1
- package/es/molecule/skill-card/index.js +5 -8
- package/es/molecule/skill-card/index.js.map +1 -1
- package/es/molecule/title-and-checkbox-wrapper/index.d.ts +0 -6
- package/es/molecule/title-radio-wrapper/index.d.ts +0 -6
- package/es/molecule/title-radio-wrapper/index.d.ts.map +1 -1
- package/es/molecule/title-radio-wrapper/types.d.ts +0 -6
- package/es/molecule/title-radio-wrapper/types.d.ts.map +1 -1
- package/es/organism/list-items/index.d.ts +4 -0
- package/es/organism/rewards-form/index.d.ts +0 -6
- package/es/organism/select-opponents/index.d.ts +0 -6
- package/es/organism/select-opponents/index.d.ts.map +1 -1
- package/es/organism/select-opponents/types.d.ts +0 -6
- package/es/organism/select-opponents/types.d.ts.map +1 -1
- package/es/organism/setup-header/index.d.ts +8 -0
- package/es/organism/title-and-input/index.d.ts +0 -12
- package/es/organism/title-and-input/index.d.ts.map +1 -1
- package/es/organism/title-and-input/types.d.ts +0 -12
- package/es/organism/title-and-input/types.d.ts.map +1 -1
- package/es/organism/wizard-contents/index.d.ts +6 -6
- package/es/template/app-player/loading/index.d.ts +4 -6
- package/es/template/app-player/player/index.d.ts +8 -12
- package/es/template/app-player/player/slides/index.d.ts +4 -6
- package/es/template/app-player/player/slides/index.d.ts.map +1 -1
- package/es/template/app-player/popin-correction/index.d.ts +4 -6
- package/es/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/es/template/app-player/popin-end/index.d.ts +4 -7
- package/es/template/app-player/popin-end/summary.d.ts +0 -1
- package/es/template/app-review/index.d.ts +4 -6
- package/es/template/app-review/index.d.ts.map +1 -1
- package/es/template/app-review/player/prop-types.d.ts +4 -6
- package/es/template/app-review/player/prop-types.d.ts.map +1 -1
- package/es/template/app-review/prop-types.d.ts +4 -6
- package/es/template/app-review/prop-types.d.ts.map +1 -1
- package/es/template/back-office/brand-create/index.d.ts +8 -0
- package/es/template/back-office/brand-create/index.d.ts.map +1 -1
- package/es/template/back-office/brand-list/index.d.ts +8 -0
- package/es/template/back-office/brand-list/index.d.ts.map +1 -1
- package/es/template/back-office/brand-update/index.d.ts +22 -6
- package/es/template/back-office/dashboard-preview/index.d.ts +8 -0
- package/es/template/back-office/layout/index.d.ts +8 -0
- package/es/template/back-office/layout/index.d.ts.map +1 -1
- package/es/template/common/dashboard/index.d.ts +8 -12
- package/es/template/common/dashboard/index.d.ts.map +1 -1
- package/es/template/common/dashboard/index.js +4 -12
- package/es/template/common/dashboard/index.js.map +1 -1
- package/es/template/common/search-page/index.d.ts +4 -7
- package/es/template/external-course/index.d.ts +4 -6
- package/es/template/my-learning/index.d.ts +0 -82
- package/es/template/my-learning/index.d.ts.map +1 -1
- package/es/template/my-learning/index.js +12 -42
- package/es/template/my-learning/index.js.map +1 -1
- package/es/template/my-learning/style.css +3 -18
- package/es/template/skill-detail/index.d.ts.map +1 -1
- package/es/template/skill-detail/index.js +4 -8
- package/es/template/skill-detail/index.js.map +1 -1
- package/es/template/teams-dashboard/index.d.ts +0 -1
- package/lib/atom/button-link/index.d.ts +2 -0
- package/lib/atom/button-link/index.d.ts.map +1 -1
- package/lib/atom/button-link/index.js +21 -7
- package/lib/atom/button-link/index.js.map +1 -1
- package/lib/atom/button-link/types.d.ts +4 -0
- package/lib/atom/button-link/types.d.ts.map +1 -1
- package/lib/atom/button-link/types.js +2 -0
- package/lib/atom/button-link/types.js.map +1 -1
- package/lib/atom/radio-with-title/index.d.ts +0 -6
- package/lib/atom/radio-with-title/index.d.ts.map +1 -1
- package/lib/atom/radio-with-title/types.d.ts +0 -6
- package/lib/atom/radio-with-title/types.d.ts.map +1 -1
- package/lib/atom/tag/style.css +1 -2
- package/lib/atom/title/index.d.ts +0 -6
- package/lib/atom/title/index.d.ts.map +1 -1
- package/lib/atom/title/index.js +4 -18
- package/lib/atom/title/index.js.map +1 -1
- package/lib/atom/title/style.css +0 -13
- package/lib/molecule/base-modal/index.d.ts.map +1 -1
- package/lib/molecule/base-modal/index.js +5 -9
- package/lib/molecule/base-modal/index.js.map +1 -1
- package/lib/molecule/cm-popin/types.d.ts +4 -6
- package/lib/molecule/cm-popin/types.d.ts.map +1 -1
- package/lib/molecule/dashboard/cards-list/index.d.ts +0 -1
- package/lib/molecule/dashboard/cards-list/index.d.ts.map +1 -1
- package/lib/molecule/dashboard/cards-list/index.js +25 -24
- package/lib/molecule/dashboard/cards-list/index.js.map +1 -1
- package/lib/molecule/dashboard/cards-list/prop-types.d.ts +0 -1
- package/lib/molecule/dashboard/cards-list/prop-types.d.ts.map +1 -1
- package/lib/molecule/dashboard/cards-list/prop-types.js.map +1 -1
- package/lib/molecule/dashboard/cards-list/style.css +29 -12
- package/lib/molecule/expandible-actionable-table/index.d.ts +2 -0
- package/lib/molecule/expandible-actionable-table/index.d.ts.map +1 -1
- package/lib/molecule/expandible-actionable-table/types.d.ts +2 -0
- package/lib/molecule/expandible-actionable-table/types.d.ts.map +1 -1
- package/lib/molecule/learner-skill-card/index.d.ts.map +1 -1
- package/lib/molecule/learner-skill-card/index.js +6 -9
- package/lib/molecule/learner-skill-card/index.js.map +1 -1
- package/lib/molecule/learning-priority-card/index.d.ts +0 -1
- package/lib/molecule/learning-priority-card/index.d.ts.map +1 -1
- package/lib/molecule/learning-priority-card/index.js +7 -10
- package/lib/molecule/learning-priority-card/index.js.map +1 -1
- package/lib/molecule/learning-priority-card/style.css +0 -2
- package/lib/molecule/learning-priority-card/types.d.ts +0 -2
- package/lib/molecule/learning-priority-card/types.d.ts.map +1 -1
- package/lib/molecule/learning-priority-card/types.js +1 -2
- package/lib/molecule/learning-priority-card/types.js.map +1 -1
- package/lib/molecule/skill-card/index.d.ts.map +1 -1
- package/lib/molecule/skill-card/index.js +4 -7
- package/lib/molecule/skill-card/index.js.map +1 -1
- package/lib/molecule/title-and-checkbox-wrapper/index.d.ts +0 -6
- package/lib/molecule/title-radio-wrapper/index.d.ts +0 -6
- package/lib/molecule/title-radio-wrapper/index.d.ts.map +1 -1
- package/lib/molecule/title-radio-wrapper/types.d.ts +0 -6
- package/lib/molecule/title-radio-wrapper/types.d.ts.map +1 -1
- package/lib/organism/list-items/index.d.ts +4 -0
- package/lib/organism/rewards-form/index.d.ts +0 -6
- package/lib/organism/select-opponents/index.d.ts +0 -6
- package/lib/organism/select-opponents/index.d.ts.map +1 -1
- package/lib/organism/select-opponents/types.d.ts +0 -6
- package/lib/organism/select-opponents/types.d.ts.map +1 -1
- package/lib/organism/setup-header/index.d.ts +8 -0
- package/lib/organism/title-and-input/index.d.ts +0 -12
- package/lib/organism/title-and-input/index.d.ts.map +1 -1
- package/lib/organism/title-and-input/types.d.ts +0 -12
- package/lib/organism/title-and-input/types.d.ts.map +1 -1
- package/lib/organism/wizard-contents/index.d.ts +6 -6
- package/lib/template/app-player/loading/index.d.ts +4 -6
- package/lib/template/app-player/player/index.d.ts +8 -12
- package/lib/template/app-player/player/slides/index.d.ts +4 -6
- package/lib/template/app-player/player/slides/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-correction/index.d.ts +4 -6
- package/lib/template/app-player/popin-correction/index.d.ts.map +1 -1
- package/lib/template/app-player/popin-end/index.d.ts +4 -7
- package/lib/template/app-player/popin-end/summary.d.ts +0 -1
- package/lib/template/app-review/index.d.ts +4 -6
- package/lib/template/app-review/index.d.ts.map +1 -1
- package/lib/template/app-review/player/prop-types.d.ts +4 -6
- package/lib/template/app-review/player/prop-types.d.ts.map +1 -1
- package/lib/template/app-review/prop-types.d.ts +4 -6
- package/lib/template/app-review/prop-types.d.ts.map +1 -1
- package/lib/template/back-office/brand-create/index.d.ts +8 -0
- package/lib/template/back-office/brand-create/index.d.ts.map +1 -1
- package/lib/template/back-office/brand-list/index.d.ts +8 -0
- package/lib/template/back-office/brand-list/index.d.ts.map +1 -1
- package/lib/template/back-office/brand-update/index.d.ts +22 -6
- package/lib/template/back-office/dashboard-preview/index.d.ts +8 -0
- package/lib/template/back-office/layout/index.d.ts +8 -0
- package/lib/template/back-office/layout/index.d.ts.map +1 -1
- package/lib/template/common/dashboard/index.d.ts +8 -12
- package/lib/template/common/dashboard/index.d.ts.map +1 -1
- package/lib/template/common/dashboard/index.js +4 -13
- package/lib/template/common/dashboard/index.js.map +1 -1
- package/lib/template/common/search-page/index.d.ts +4 -7
- package/lib/template/external-course/index.d.ts +4 -6
- package/lib/template/my-learning/index.d.ts +0 -82
- package/lib/template/my-learning/index.d.ts.map +1 -1
- package/lib/template/my-learning/index.js +12 -44
- package/lib/template/my-learning/index.js.map +1 -1
- package/lib/template/my-learning/style.css +3 -18
- package/lib/template/skill-detail/index.d.ts.map +1 -1
- package/lib/template/skill-detail/index.js +4 -8
- package/lib/template/skill-detail/index.js.map +1 -1
- package/lib/template/teams-dashboard/index.d.ts +0 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["ShowMoreLink","props","onShowMore","showMore","className","contextTypes","skin","Provider","childContextTypes","propTypes","PropTypes","func","string","IconView","context","contentType","ICONS","chapter","TimerIcon","course","LearnerIcon","dark","IconType","color","style","icon","computeWidth","card","type","nextPage","page","maxPages","CardsList","React","PureComponent","constructor","state","actualPage","scrollLeft","offsetWidth","possiblePositions","possiblePages","cardsWidth","handleScroll_","handleScroll","bind","handleOnLeft","handleOnRight","scrollTo","updateState","updatePages","setCardsWrapper","getScrollWidth","handleResize","testingSizes","componentDidMount","cardsWrapper","addEventListener","window","componentDidUpdate","cards","newCardsWidth","updatePaginationState","setState","componentWillUnmount","removeEventListener","cancel","wrapperWidth","wrapperScrollLeft","cardWidths","cardPositions","accWidth","cardWidth","acc","pageIndex","accPageWidth","pageWidth","skip","position","element","index","onScroll","leftBound","rightBound","leftIndex","rightIndex","limit","indexOfNextFirstCard","indexOf","nextPosition","render","title","customStyle","dataName","ariaLabel","titleStyle","titleLink","cardsView","key","arrowIconProps","preset","borderRadius","showMoreOnLeftAriaLabel","arrows","arrowsWrapper","arrow","titleView","titleNode","hasPages","showMoreView","showMoreBar","switchPagesView","pagingWrapper","wrapper","list","header","translate","oneOfType","node","arrayOf","shape","cardPropTypes","objectOf","showMoreOnRightAriaLabel","oneOf","any"],"sources":["../../../../src/molecule/dashboard/cards-list/index.js"],"sourcesContent":["import React from 'react';\nimport {\n debounce,\n throttle,\n get,\n getOr,\n map,\n sum,\n last,\n pipe,\n toPairs,\n reduce,\n head,\n findIndex,\n findLastIndex\n} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport {\n NovaSolidContentContentBook1 as LearnerIcon,\n NovaCompositionCoorpacademyTimer as TimerIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../../atom/provider';\nimport Card, {cardPropTypes} from '../../card';\nimport LearningPriorityCard from '../../learning-priority-card';\nimport Icon from '../../../atom/icon';\nimport style from './style.css';\n\nconst ShowMoreLink = props => {\n const {onShowMore, showMore, className} = props;\n return (\n <div className={className} onClick={onShowMore}>\n {showMore}\n </div>\n );\n};\n\nShowMoreLink.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nShowMoreLink.propTypes = {\n onShowMore: PropTypes.func,\n showMore: PropTypes.string,\n className: PropTypes.string\n};\n\nconst IconView = (props, context) => {\n const {skin} = context;\n const {contentType} = props;\n const ICONS = {\n chapter: TimerIcon,\n course: LearnerIcon\n };\n\n if (!contentType) {\n return null;\n }\n\n const dark = get('common.dark', skin);\n const IconType = ICONS[contentType];\n\n return (\n <div>\n <IconType style={{color: dark}} className={style.icon} data-contenttype={contentType} />\n </div>\n );\n};\n\nconst computeWidth = card => {\n switch (card && card.type) {\n case 'chapter':\n return 219;\n default:\n return 272;\n }\n};\n\nconst nextPage = (page, maxPages) => {\n if (page < 0) return maxPages;\n if (page > maxPages) return 0;\n return page;\n};\n\nIconView.propTypes = {\n contentType: PropTypes.string\n};\n\nclass CardsList extends React.PureComponent {\n /**\n * IMPORTANT: update prop-types.ts too, 1st a migration of tests\n * is intended, then, a TS + functional refactor is planned.\n */\n static propTypes = {\n contentType: PropTypes.string,\n dataName: PropTypes.string,\n title: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),\n showMore: PropTypes.string,\n cards: PropTypes.arrayOf(PropTypes.shape(cardPropTypes)),\n customStyle: PropTypes.objectOf(PropTypes.string),\n onScroll: PropTypes.func,\n onShowMore: PropTypes.func,\n 'arrows-aria-label': PropTypes.shape({\n showMoreOnLeftAriaLabel: PropTypes.string,\n showMoreOnRightAriaLabel: PropTypes.string\n }),\n type: PropTypes.oneOf(['cards']),\n // eslint-disable-next-line react/forbid-prop-types\n testingSizes: PropTypes.any\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n actualPage: 0,\n maxPages: 0,\n scrollLeft: 0,\n offsetWidth: 0,\n possiblePositions: [],\n possiblePages: [],\n cardsWidth: 0\n };\n\n this.handleScroll_ = throttle(200, this.handleScroll.bind(this));\n this.handleScroll = this.handleScroll.bind(this);\n this.handleOnLeft = this.handleOnLeft.bind(this);\n this.handleOnRight = this.handleOnRight.bind(this);\n this.scrollTo = this.scrollTo.bind(this);\n this.updateState = debounce(200, this.updatePages.bind(this));\n this.updatePages = this.updatePages.bind(this);\n this.setCardsWrapper = this.setCardsWrapper.bind(this);\n this.getScrollWidth = this.getScrollWidth.bind(this);\n this.handleResize = this.handleResize.bind(this);\n\n // for testing purposes only - no other way to test this polluted component\n if (props.testingSizes) {\n const {offsetWidth, scrollLeft, maxPages, possiblePages, possiblePositions} =\n props.testingSizes;\n this.state.offsetWidth = offsetWidth;\n this.state.scrollLeft = scrollLeft;\n this.state.maxPages = maxPages;\n this.state.possiblePages = possiblePages;\n this.state.possiblePositions = possiblePositions;\n }\n }\n\n componentDidMount() {\n this.cardsWrapper.addEventListener('scroll', this.handleScroll_);\n\n if (window) {\n window.addEventListener('resize', this.handleResize);\n }\n }\n\n componentDidUpdate() {\n const {cards = []} = this.props;\n const {offsetWidth, cardsWidth} = this.state;\n const newCardsWidth = pipe(map(computeWidth), sum)(cards);\n\n if (newCardsWidth !== cardsWidth && offsetWidth !== 0) {\n this.updatePaginationState(cards);\n // eslint-disable-next-line react/no-did-update-set-state\n this.setState({\n cardsWidth: newCardsWidth\n });\n }\n }\n\n componentWillUnmount() {\n this.cardsWrapper.removeEventListener('scroll', this.handleScroll_);\n\n if (window) {\n window.removeEventListener('resize', this.handleResize);\n }\n this.updateState.cancel();\n }\n\n /* istanbul ignore next */\n handleResize() {\n const {cards = []} = this.props;\n this.updatePaginationState(cards);\n }\n\n /* istanbul ignore next */\n updatePaginationState(cards) {\n const {offsetWidth: wrapperWidth, scrollLeft: wrapperScrollLeft} = this.state;\n\n const cardWidths = map(computeWidth)(cards);\n\n const possiblePositions = pipe(\n reduce(\n ([cardPositions, accWidth], cardWidth) => [\n [...cardPositions, accWidth],\n cardWidth + accWidth\n ],\n [[], 0]\n ),\n head\n )(cardWidths);\n\n const possiblePages = pipe(\n reduce(\n ([acc, pageIndex, accPageWidth], cardWidth) => {\n const pageWidth = accPageWidth + cardWidth;\n if (pageWidth > wrapperWidth) {\n return [[...acc, pageIndex + 1], pageIndex + 1, cardWidth];\n }\n return [[...acc, pageIndex], pageIndex, pageWidth];\n },\n [[], 0, 0]\n ),\n head\n )(cardWidths);\n\n const skip = findIndex(position => position >= wrapperScrollLeft, possiblePositions);\n const actualPage = possiblePages[skip + 1];\n\n this.setState({\n possiblePositions,\n possiblePages,\n maxPages: last(possiblePages),\n actualPage\n });\n }\n\n setCardsWrapper(element) {\n this.cardsWrapper = element;\n this.setState({\n scrollLeft: this.cardsWrapper?.scrollLeft,\n offsetWidth: this.cardsWrapper?.offsetWidth\n });\n }\n\n /* istanbul ignore next */\n getScrollWidth(index) {\n const {cards = []} = this.props;\n const card = cards[index];\n return computeWidth(card);\n }\n\n /* istanbul ignore next */\n handleScroll() {\n const scrollLeft = this.cardsWrapper?.scrollLeft;\n this.setState({scrollLeft});\n\n const {possiblePositions, offsetWidth} = this.state;\n const {onScroll} = this.props;\n if (onScroll) {\n const leftBound = scrollLeft;\n const rightBound = scrollLeft + offsetWidth;\n\n const leftIndex = findIndex(position => position > leftBound, possiblePositions) - 1;\n const rightIndex = findLastIndex(position => position < rightBound, possiblePositions);\n const skip = leftIndex;\n const limit = rightIndex - skip + 1;\n\n onScroll(skip, limit);\n }\n }\n\n handleOnLeft() {\n const {actualPage, maxPages} = this.state;\n this.scrollTo(nextPage(actualPage - 1, maxPages));\n }\n\n handleOnRight() {\n const {actualPage, maxPages} = this.state;\n this.scrollTo(nextPage(actualPage + 1, maxPages));\n }\n\n scrollTo(page) {\n const {possiblePages, possiblePositions} = this.state;\n const indexOfNextFirstCard = possiblePages.indexOf(page);\n const nextPosition = possiblePositions[indexOfNextFirstCard];\n this.cardsWrapper.scrollLeft = nextPosition;\n this.updatePages(page);\n this.setState({\n scrollLeft: nextPosition\n });\n }\n\n updatePages(actualPage) {\n this.setState({\n actualPage\n });\n }\n\n render() {\n const {\n title,\n showMore,\n cards,\n customStyle = {},\n onShowMore,\n dataName,\n contentType,\n 'arrows-aria-label': ariaLabel = {}\n } = this.props;\n const {skin} = this.context;\n const {maxPages} = this.state;\n const dark = getOr('#90A4AE', 'common.dark', skin);\n const titleStyle = onShowMore ? style.titleLink : style.title;\n const cardsView = pipe(\n toPairs,\n map(([key, card]) => {\n return (\n <div className={style.card} key={key}>\n {card && card.type === 'learningPriority' ? (\n <LearningPriorityCard {...card} />\n ) : (\n <Card {...card} dataName={`${dataName}-${key}`} />\n )}\n </div>\n );\n })\n )(cards);\n\n const arrowIconProps = {\n color: dark,\n preset: 's',\n borderRadius: '8px',\n ariaLabel: ariaLabel.showMoreOnLeftAriaLabel\n };\n\n const arrows = (\n <div className={style.arrowsWrapper}>\n <div className={style.arrow} onClick={this.handleOnLeft} data-name=\"card-list-left-arrow\">\n <Icon {...arrowIconProps} iconName=\"arrow-left\" />\n </div>\n <div className={style.arrow} onClick={this.handleOnRight} data-name=\"card-list-right-arrow\">\n <Icon {...arrowIconProps} iconName=\"arrow-right\" />\n </div>\n </div>\n );\n\n const titleView =\n typeof title === 'string' ? (\n <span data-name=\"title\" className={titleStyle} onClick={onShowMore}>\n <IconView contentType={contentType} />\n <span>{title}</span>\n </span>\n ) : (\n <span className={style.titleNode}>{title}</span>\n );\n\n const hasPages = maxPages > 0;\n const showMoreView =\n hasPages && showMore && onShowMore ? (\n <ShowMoreLink\n className={hasPages ? style.showMoreBar : style.showMore}\n onShowMore={onShowMore}\n showMore={showMore}\n />\n ) : null;\n\n const switchPagesView = hasPages ? (\n <div className={style.pagingWrapper}>\n {showMoreView}\n {arrows}\n </div>\n ) : null;\n\n return (\n <div\n className={style.wrapper}\n style={customStyle}\n data-name=\"cardsList\"\n data-max-pages={`${maxPages}`}\n // eslint-disable-next-line react/destructuring-assignment\n data-actual-page={`${this.state.actualPage}`}\n data-scroll-left={this.cardsWrapper?.scrollLeft}\n >\n <div className={style.list}>\n <div>\n <div data-name=\"header\" className={style.header}>\n {titleView}\n {switchPagesView}\n </div>\n <div\n className={style.cards}\n data-testid=\"cards-view-wrapper\"\n ref={this.setCardsWrapper}\n >\n {cardsView}\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default CardsList;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAgBA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,YAAY,GAAGC,KAAK,IAAI;EAC5B,MAAM;IAACC,UAAD;IAAaC,QAAb;IAAuBC;EAAvB,IAAoCH,KAA1C;EACA,oBACE;IAAK,SAAS,EAAEG,SAAhB;IAA2B,OAAO,EAAEF;EAApC,GACGC,QADH,CADF;AAKD,CAPD;;AASAH,YAAY,CAACK,YAAb,GAA4B;EAC1BC,IAAI,EAAEC,iBAAA,CAASC,iBAAT,CAA2BF;AADP,CAA5B;AAIAN,YAAY,CAACS,SAAb,2CAAyB;EACvBP,UAAU,EAAEQ,kBAAA,CAAUC,IADC;EAEvBR,QAAQ,EAAEO,kBAAA,CAAUE,MAFG;EAGvBR,SAAS,EAAEM,kBAAA,CAAUE;AAHE,CAAzB;;AAMA,MAAMC,QAAQ,GAAG,CAACZ,KAAD,EAAQa,OAAR,KAAoB;EACnC,MAAM;IAACR;EAAD,IAASQ,OAAf;EACA,MAAM;IAACC;EAAD,IAAgBd,KAAtB;EACA,MAAMe,KAAK,GAAG;IACZC,OAAO,EAAEC,2CADG;IAEZC,MAAM,EAAEC;EAFI,CAAd;;EAKA,IAAI,CAACL,WAAL,EAAkB;IAChB,OAAO,IAAP;EACD;;EAED,MAAMM,IAAI,GAAG,mBAAI,aAAJ,EAAmBf,IAAnB,CAAb;EACA,MAAMgB,QAAQ,GAAGN,KAAK,CAACD,WAAD,CAAtB;EAEA,oBACE,uDACE,6BAAC,QAAD;IAAU,KAAK,EAAE;MAACQ,KAAK,EAAEF;IAAR,CAAjB;IAAgC,SAAS,EAAEG,cAAA,CAAMC,IAAjD;IAAuD,oBAAkBV;EAAzE,EADF,CADF;AAKD,CApBD;;AAsBA,MAAMW,YAAY,GAAGC,IAAI,IAAI;EAC3B,QAAQA,IAAI,IAAIA,IAAI,CAACC,IAArB;IACE,KAAK,SAAL;MACE,OAAO,GAAP;;IACF;MACE,OAAO,GAAP;EAJJ;AAMD,CAPD;;AASA,MAAMC,QAAQ,GAAG,CAACC,IAAD,EAAOC,QAAP,KAAoB;EACnC,IAAID,IAAI,GAAG,CAAX,EAAc,OAAOC,QAAP;EACd,IAAID,IAAI,GAAGC,QAAX,EAAqB,OAAO,CAAP;EACrB,OAAOD,IAAP;AACD,CAJD;;AAMAjB,QAAQ,CAACJ,SAAT,2CAAqB;EACnBM,WAAW,EAAEL,kBAAA,CAAUE;AADJ,CAArB;;AAIA,MAAMoB,SAAN,SAAwBC,cAAA,CAAMC,aAA9B,CAA4C;EAC1C;AACF;AACA;AACA;EAwBEC,WAAW,CAAClC,KAAD,EAAQ;IACjB,MAAMA,KAAN;IAEA,KAAKmC,KAAL,GAAa;MACXC,UAAU,EAAE,CADD;MAEXN,QAAQ,EAAE,CAFC;MAGXO,UAAU,EAAE,CAHD;MAIXC,WAAW,EAAE,CAJF;MAKXC,iBAAiB,EAAE,EALR;MAMXC,aAAa,EAAE,EANJ;MAOXC,UAAU,EAAE;IAPD,CAAb;IAUA,KAAKC,aAAL,GAAqB,wBAAS,GAAT,EAAc,KAAKC,YAAL,CAAkBC,IAAlB,CAAuB,IAAvB,CAAd,CAArB;IACA,KAAKD,YAAL,GAAoB,KAAKA,YAAL,CAAkBC,IAAlB,CAAuB,IAAvB,CAApB;IACA,KAAKC,YAAL,GAAoB,KAAKA,YAAL,CAAkBD,IAAlB,CAAuB,IAAvB,CAApB;IACA,KAAKE,aAAL,GAAqB,KAAKA,aAAL,CAAmBF,IAAnB,CAAwB,IAAxB,CAArB;IACA,KAAKG,QAAL,GAAgB,KAAKA,QAAL,CAAcH,IAAd,CAAmB,IAAnB,CAAhB;IACA,KAAKI,WAAL,GAAmB,wBAAS,GAAT,EAAc,KAAKC,WAAL,CAAiBL,IAAjB,CAAsB,IAAtB,CAAd,CAAnB;IACA,KAAKK,WAAL,GAAmB,KAAKA,WAAL,CAAiBL,IAAjB,CAAsB,IAAtB,CAAnB;IACA,KAAKM,eAAL,GAAuB,KAAKA,eAAL,CAAqBN,IAArB,CAA0B,IAA1B,CAAvB;IACA,KAAKO,cAAL,GAAsB,KAAKA,cAAL,CAAoBP,IAApB,CAAyB,IAAzB,CAAtB;IACA,KAAKQ,YAAL,GAAoB,KAAKA,YAAL,CAAkBR,IAAlB,CAAuB,IAAvB,CAApB,CAtBiB,CAwBjB;;IACA,IAAI5C,KAAK,CAACqD,YAAV,EAAwB;MACtB,MAAM;QAACf,WAAD;QAAcD,UAAd;QAA0BP,QAA1B;QAAoCU,aAApC;QAAmDD;MAAnD,IACJvC,KAAK,CAACqD,YADR;MAEA,KAAKlB,KAAL,CAAWG,WAAX,GAAyBA,WAAzB;MACA,KAAKH,KAAL,CAAWE,UAAX,GAAwBA,UAAxB;MACA,KAAKF,KAAL,CAAWL,QAAX,GAAsBA,QAAtB;MACA,KAAKK,KAAL,CAAWK,aAAX,GAA2BA,aAA3B;MACA,KAAKL,KAAL,CAAWI,iBAAX,GAA+BA,iBAA/B;IACD;EACF;;EAEDe,iBAAiB,GAAG;IAClB,KAAKC,YAAL,CAAkBC,gBAAlB,CAAmC,QAAnC,EAA6C,KAAKd,aAAlD;;IAEA,IAAIe,MAAJ,EAAY;MACVA,MAAM,CAACD,gBAAP,CAAwB,QAAxB,EAAkC,KAAKJ,YAAvC;IACD;EACF;;EAEDM,kBAAkB,GAAG;IACnB,MAAM;MAACC,KAAK,GAAG;IAAT,IAAe,KAAK3D,KAA1B;IACA,MAAM;MAACsC,WAAD;MAAcG;IAAd,IAA4B,KAAKN,KAAvC;IACA,MAAMyB,aAAa,GAAG,oBAAK,mBAAInC,YAAJ,CAAL,iBAA6BkC,KAA7B,CAAtB;;IAEA,IAAIC,aAAa,KAAKnB,UAAlB,IAAgCH,WAAW,KAAK,CAApD,EAAuD;MACrD,KAAKuB,qBAAL,CAA2BF,KAA3B,EADqD,CAErD;;MACA,KAAKG,QAAL,CAAc;QACZrB,UAAU,EAAEmB;MADA,CAAd;IAGD;EACF;;EAEDG,oBAAoB,GAAG;IACrB,KAAKR,YAAL,CAAkBS,mBAAlB,CAAsC,QAAtC,EAAgD,KAAKtB,aAArD;;IAEA,IAAIe,MAAJ,EAAY;MACVA,MAAM,CAACO,mBAAP,CAA2B,QAA3B,EAAqC,KAAKZ,YAA1C;IACD;;IACD,KAAKJ,WAAL,CAAiBiB,MAAjB;EACD;EAED;;;EACAb,YAAY,GAAG;IACb,MAAM;MAACO,KAAK,GAAG;IAAT,IAAe,KAAK3D,KAA1B;IACA,KAAK6D,qBAAL,CAA2BF,KAA3B;EACD;EAED;;;EACAE,qBAAqB,CAACF,KAAD,EAAQ;IAC3B,MAAM;MAACrB,WAAW,EAAE4B,YAAd;MAA4B7B,UAAU,EAAE8B;IAAxC,IAA6D,KAAKhC,KAAxE;IAEA,MAAMiC,UAAU,GAAG,mBAAI3C,YAAJ,EAAkBkC,KAAlB,CAAnB;IAEA,MAAMpB,iBAAiB,GAAG,oBACxB,sBACE,CAAC,CAAC8B,aAAD,EAAgBC,QAAhB,CAAD,EAA4BC,SAA5B,KAA0C,CACxC,CAAC,GAAGF,aAAJ,EAAmBC,QAAnB,CADwC,EAExCC,SAAS,GAAGD,QAF4B,CAD5C,EAKE,CAAC,EAAD,EAAK,CAAL,CALF,CADwB,kBASxBF,UATwB,CAA1B;IAWA,MAAM5B,aAAa,GAAG,oBACpB,sBACE,CAAC,CAACgC,GAAD,EAAMC,SAAN,EAAiBC,YAAjB,CAAD,EAAiCH,SAAjC,KAA+C;MAC7C,MAAMI,SAAS,GAAGD,YAAY,GAAGH,SAAjC;;MACA,IAAII,SAAS,GAAGT,YAAhB,EAA8B;QAC5B,OAAO,CAAC,CAAC,GAAGM,GAAJ,EAASC,SAAS,GAAG,CAArB,CAAD,EAA0BA,SAAS,GAAG,CAAtC,EAAyCF,SAAzC,CAAP;MACD;;MACD,OAAO,CAAC,CAAC,GAAGC,GAAJ,EAASC,SAAT,CAAD,EAAsBA,SAAtB,EAAiCE,SAAjC,CAAP;IACD,CAPH,EAQE,CAAC,EAAD,EAAK,CAAL,EAAQ,CAAR,CARF,CADoB,kBAYpBP,UAZoB,CAAtB;IAcA,MAAMQ,IAAI,GAAG,yBAAUC,QAAQ,IAAIA,QAAQ,IAAIV,iBAAlC,EAAqD5B,iBAArD,CAAb;IACA,MAAMH,UAAU,GAAGI,aAAa,CAACoC,IAAI,GAAG,CAAR,CAAhC;IAEA,KAAKd,QAAL,CAAc;MACZvB,iBADY;MAEZC,aAFY;MAGZV,QAAQ,EAAE,oBAAKU,aAAL,CAHE;MAIZJ;IAJY,CAAd;EAMD;;EAEDc,eAAe,CAAC4B,OAAD,EAAU;IACvB,KAAKvB,YAAL,GAAoBuB,OAApB;IACA,KAAKhB,QAAL,CAAc;MACZzB,UAAU,EAAE,KAAKkB,YAAL,EAAmBlB,UADnB;MAEZC,WAAW,EAAE,KAAKiB,YAAL,EAAmBjB;IAFpB,CAAd;EAID;EAED;;;EACAa,cAAc,CAAC4B,KAAD,EAAQ;IACpB,MAAM;MAACpB,KAAK,GAAG;IAAT,IAAe,KAAK3D,KAA1B;IACA,MAAM0B,IAAI,GAAGiC,KAAK,CAACoB,KAAD,CAAlB;IACA,OAAOtD,YAAY,CAACC,IAAD,CAAnB;EACD;EAED;;;EACAiB,YAAY,GAAG;IACb,MAAMN,UAAU,GAAG,KAAKkB,YAAL,EAAmBlB,UAAtC;IACA,KAAKyB,QAAL,CAAc;MAACzB;IAAD,CAAd;IAEA,MAAM;MAACE,iBAAD;MAAoBD;IAApB,IAAmC,KAAKH,KAA9C;IACA,MAAM;MAAC6C;IAAD,IAAa,KAAKhF,KAAxB;;IACA,IAAIgF,QAAJ,EAAc;MACZ,MAAMC,SAAS,GAAG5C,UAAlB;MACA,MAAM6C,UAAU,GAAG7C,UAAU,GAAGC,WAAhC;MAEA,MAAM6C,SAAS,GAAG,yBAAUN,QAAQ,IAAIA,QAAQ,GAAGI,SAAjC,EAA4C1C,iBAA5C,IAAiE,CAAnF;MACA,MAAM6C,UAAU,GAAG,6BAAcP,QAAQ,IAAIA,QAAQ,GAAGK,UAArC,EAAiD3C,iBAAjD,CAAnB;MACA,MAAMqC,IAAI,GAAGO,SAAb;MACA,MAAME,KAAK,GAAGD,UAAU,GAAGR,IAAb,GAAoB,CAAlC;MAEAI,QAAQ,CAACJ,IAAD,EAAOS,KAAP,CAAR;IACD;EACF;;EAEDxC,YAAY,GAAG;IACb,MAAM;MAACT,UAAD;MAAaN;IAAb,IAAyB,KAAKK,KAApC;IACA,KAAKY,QAAL,CAAcnB,QAAQ,CAACQ,UAAU,GAAG,CAAd,EAAiBN,QAAjB,CAAtB;EACD;;EAEDgB,aAAa,GAAG;IACd,MAAM;MAACV,UAAD;MAAaN;IAAb,IAAyB,KAAKK,KAApC;IACA,KAAKY,QAAL,CAAcnB,QAAQ,CAACQ,UAAU,GAAG,CAAd,EAAiBN,QAAjB,CAAtB;EACD;;EAEDiB,QAAQ,CAAClB,IAAD,EAAO;IACb,MAAM;MAACW,aAAD;MAAgBD;IAAhB,IAAqC,KAAKJ,KAAhD;IACA,MAAMmD,oBAAoB,GAAG9C,aAAa,CAAC+C,OAAd,CAAsB1D,IAAtB,CAA7B;IACA,MAAM2D,YAAY,GAAGjD,iBAAiB,CAAC+C,oBAAD,CAAtC;IACA,KAAK/B,YAAL,CAAkBlB,UAAlB,GAA+BmD,YAA/B;IACA,KAAKvC,WAAL,CAAiBpB,IAAjB;IACA,KAAKiC,QAAL,CAAc;MACZzB,UAAU,EAAEmD;IADA,CAAd;EAGD;;EAEDvC,WAAW,CAACb,UAAD,EAAa;IACtB,KAAK0B,QAAL,CAAc;MACZ1B;IADY,CAAd;EAGD;;EAEDqD,MAAM,GAAG;IACP,MAAM;MACJC,KADI;MAEJxF,QAFI;MAGJyD,KAHI;MAIJgC,WAAW,GAAG,EAJV;MAKJ1F,UALI;MAMJ2F,QANI;MAOJ9E,WAPI;MAQJ,qBAAqB+E,SAAS,GAAG;IAR7B,IASF,KAAK7F,KATT;IAUA,MAAM;MAACK;IAAD,IAAS,KAAKQ,OAApB;IACA,MAAM;MAACiB;IAAD,IAAa,KAAKK,KAAxB;IACA,MAAMf,IAAI,GAAG,qBAAM,SAAN,EAAiB,aAAjB,EAAgCf,IAAhC,CAAb;IACA,MAAMyF,UAAU,GAAG7F,UAAU,GAAGsB,cAAA,CAAMwE,SAAT,GAAqBxE,cAAA,CAAMmE,KAAxD;IACA,MAAMM,SAAS,GAAG,uCAEhB,mBAAI,CAAC,CAACC,GAAD,EAAMvE,IAAN,CAAD,KAAiB;MACnB,oBACE;QAAK,SAAS,EAAEH,cAAA,CAAMG,IAAtB;QAA4B,GAAG,EAAEuE;MAAjC,GACGvE,IAAI,IAAIA,IAAI,CAACC,IAAL,KAAc,kBAAtB,gBACC,6BAAC,6BAAD,EAA0BD,IAA1B,CADD,gBAGC,6BAAC,aAAD,eAAUA,IAAV;QAAgB,QAAQ,EAAG,GAAEkE,QAAS,IAAGK,GAAI;MAA7C,GAJJ,CADF;IASD,CAVD,CAFgB,EAahBtC,KAbgB,CAAlB;IAeA,MAAMuC,cAAc,GAAG;MACrB5E,KAAK,EAAEF,IADc;MAErB+E,MAAM,EAAE,GAFa;MAGrBC,YAAY,EAAE,KAHO;MAIrBP,SAAS,EAAEA,SAAS,CAACQ;IAJA,CAAvB;;IAOA,MAAMC,MAAM,gBACV;MAAK,SAAS,EAAE/E,cAAA,CAAMgF;IAAtB,gBACE;MAAK,SAAS,EAAEhF,cAAA,CAAMiF,KAAtB;MAA6B,OAAO,EAAE,KAAK3D,YAA3C;MAAyD,aAAU;IAAnE,gBACE,6BAAC,aAAD,eAAUqD,cAAV;MAA0B,QAAQ,EAAC;IAAnC,GADF,CADF,eAIE;MAAK,SAAS,EAAE3E,cAAA,CAAMiF,KAAtB;MAA6B,OAAO,EAAE,KAAK1D,aAA3C;MAA0D,aAAU;IAApE,gBACE,6BAAC,aAAD,eAAUoD,cAAV;MAA0B,QAAQ,EAAC;IAAnC,GADF,CAJF,CADF;;IAWA,MAAMO,SAAS,GACb,OAAOf,KAAP,KAAiB,QAAjB,gBACE;MAAM,aAAU,OAAhB;MAAwB,SAAS,EAAEI,UAAnC;MAA+C,OAAO,EAAE7F;IAAxD,gBACE,6BAAC,QAAD;MAAU,WAAW,EAAEa;IAAvB,EADF,eAEE,2CAAO4E,KAAP,CAFF,CADF,gBAME;MAAM,SAAS,EAAEnE,cAAA,CAAMmF;IAAvB,GAAmChB,KAAnC,CAPJ;IAUA,MAAMiB,QAAQ,GAAG7E,QAAQ,GAAG,CAA5B;IACA,MAAM8E,YAAY,GAChBD,QAAQ,IAAIzG,QAAZ,IAAwBD,UAAxB,gBACE,6BAAC,YAAD;MACE,SAAS,EAAE0G,QAAQ,GAAGpF,cAAA,CAAMsF,WAAT,GAAuBtF,cAAA,CAAMrB,QADlD;MAEE,UAAU,EAAED,UAFd;MAGE,QAAQ,EAAEC;IAHZ,EADF,GAMI,IAPN;IASA,MAAM4G,eAAe,GAAGH,QAAQ,gBAC9B;MAAK,SAAS,EAAEpF,cAAA,CAAMwF;IAAtB,GACGH,YADH,EAEGN,MAFH,CAD8B,GAK5B,IALJ;IAOA,oBACE;MACE,SAAS,EAAE/E,cAAA,CAAMyF,OADnB;MAEE,KAAK,EAAErB,WAFT;MAGE,aAAU,WAHZ;MAIE,kBAAiB,GAAE7D,QAAS,EAJ9B,CAKE;MALF;MAME,oBAAmB,GAAE,KAAKK,KAAL,CAAWC,UAAW,EAN7C;MAOE,oBAAkB,KAAKmB,YAAL,EAAmBlB;IAPvC,gBASE;MAAK,SAAS,EAAEd,cAAA,CAAM0F;IAAtB,gBACE,uDACE;MAAK,aAAU,QAAf;MAAwB,SAAS,EAAE1F,cAAA,CAAM2F;IAAzC,GACGT,SADH,EAEGK,eAFH,CADF,eAKE;MACE,SAAS,EAAEvF,cAAA,CAAMoC,KADnB;MAEE,eAAY,oBAFd;MAGE,GAAG,EAAE,KAAKT;IAHZ,GAKG8C,SALH,CALF,CADF,CATF,CADF;EA2BD;;AAnTyC;;AAAtCjE,S,CAuBG3B,Y,GAAe;EACpBC,IAAI,EAAEC,iBAAA,CAASC,iBAAT,CAA2BF,IADb;EAEpB8G,SAAS,EAAE7G,iBAAA,CAASC,iBAAT,CAA2B4G;AAFlB,C;AAvBlBpF,S,CAKGvB,S,2CAAY;EACjBM,WAAW,EAAEL,kBAAA,CAAUE,MADN;EAEjBiF,QAAQ,EAAEnF,kBAAA,CAAUE,MAFH;EAGjB+E,KAAK,EAAEjF,kBAAA,CAAU2G,SAAV,CAAoB,CAAC3G,kBAAA,CAAU4G,IAAX,EAAiB5G,kBAAA,CAAUE,MAA3B,CAApB,CAHU;EAIjBT,QAAQ,EAAEO,kBAAA,CAAUE,MAJH;EAKjBgD,KAAK,EAAElD,kBAAA,CAAU6G,OAAV,CAAkB7G,kBAAA,CAAU8G,KAAV,CAAgBC,mBAAhB,CAAlB,CALU;EAMjB7B,WAAW,EAAElF,kBAAA,CAAUgH,QAAV,CAAmBhH,kBAAA,CAAUE,MAA7B,CANI;EAOjBqE,QAAQ,EAAEvE,kBAAA,CAAUC,IAPH;EAQjBT,UAAU,EAAEQ,kBAAA,CAAUC,IARL;EASjB,qBAAqBD,kBAAA,CAAU8G,KAAV,CAAgB;IACnClB,uBAAuB,EAAE5F,kBAAA,CAAUE,MADA;IAEnC+G,wBAAwB,EAAEjH,kBAAA,CAAUE;EAFD,CAAhB,CATJ;EAajBgB,IAAI,EAAElB,kBAAA,CAAUkH,KAAV,CAAgB,CAAC,OAAD,CAAhB,CAbW;EAcjB;EACAtE,YAAY,EAAE5C,kBAAA,CAAUmH;AAfP,C;eAiTN7F,S"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["ShowMoreLink","props","onShowMore","showMore","className","contextTypes","skin","Provider","childContextTypes","propTypes","PropTypes","func","string","IconView","context","contentType","ICONS","chapter","TimerIcon","course","LearnerIcon","dark","IconType","color","style","icon","computeWidth","card","type","nextPage","page","maxPages","CardsList","React","PureComponent","constructor","state","actualPage","scrollLeft","offsetWidth","possiblePositions","possiblePages","cardsWidth","handleScroll_","handleScroll","bind","handleOnLeft","handleOnRight","scrollTo","updateState","updatePages","setCardsWrapper","getScrollWidth","handleResize","testingSizes","componentDidMount","cardsWrapper","addEventListener","window","componentDidUpdate","cards","newCardsWidth","updatePaginationState","setState","componentWillUnmount","removeEventListener","cancel","wrapperWidth","wrapperScrollLeft","cardWidths","cardPositions","accWidth","cardWidth","acc","pageIndex","accPageWidth","pageWidth","skip","position","element","index","onScroll","leftBound","rightBound","leftIndex","rightIndex","limit","indexOfNextFirstCard","indexOf","nextPosition","render","title","customStyle","dataName","ariaLabel","titleStyle","titleLink","cardsView","key","leftArrowView","circle","left","showMoreOnLeftAriaLabel","rightArrowView","right","showMoreOnRightAriaLabel","titleView","titleNode","hasPages","showMoreView","showMoreBar","switchPagesView","pagingWrapper","wrapper","list","header","translate","oneOfType","node","arrayOf","shape","cardPropTypes","objectOf","any"],"sources":["../../../../src/molecule/dashboard/cards-list/index.js"],"sourcesContent":["import React from 'react';\nimport {\n debounce,\n throttle,\n get,\n getOr,\n map,\n sum,\n last,\n pipe,\n toPairs,\n reduce,\n head,\n findIndex,\n findLastIndex\n} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport {\n NovaCompositionNavigationArrowLeft as ArrowLeft,\n NovaCompositionNavigationArrowRight as ArrowRight,\n NovaSolidContentContentBook1 as LearnerIcon,\n NovaCompositionCoorpacademyTimer as TimerIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../../atom/provider';\nimport Card, {cardPropTypes} from '../../card';\nimport style from './style.css';\n\nconst ShowMoreLink = props => {\n const {onShowMore, showMore, className} = props;\n return (\n <div className={className} onClick={onShowMore}>\n {showMore}\n </div>\n );\n};\n\nShowMoreLink.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nShowMoreLink.propTypes = {\n onShowMore: PropTypes.func,\n showMore: PropTypes.string,\n className: PropTypes.string\n};\n\nconst IconView = (props, context) => {\n const {skin} = context;\n const {contentType} = props;\n const ICONS = {\n chapter: TimerIcon,\n course: LearnerIcon\n };\n\n if (!contentType) {\n return null;\n }\n\n const dark = get('common.dark', skin);\n const IconType = ICONS[contentType];\n\n return (\n <div>\n <IconType style={{color: dark}} className={style.icon} data-contenttype={contentType} />\n </div>\n );\n};\n\nconst computeWidth = card => {\n switch (card && card.type) {\n case 'chapter':\n return 219;\n default:\n return 272;\n }\n};\n\nconst nextPage = (page, maxPages) => {\n if (page < 0) return maxPages;\n if (page > maxPages) return 0;\n return page;\n};\n\nIconView.propTypes = {\n contentType: PropTypes.string\n};\n\nclass CardsList extends React.PureComponent {\n /**\n * IMPORTANT: update prop-types.ts too, 1st a migration of tests\n * is intended, then, a TS + functional refactor is planned.\n */\n static propTypes = {\n contentType: PropTypes.string,\n dataName: PropTypes.string,\n title: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),\n showMore: PropTypes.string,\n cards: PropTypes.arrayOf(PropTypes.shape(cardPropTypes)),\n customStyle: PropTypes.objectOf(PropTypes.string),\n onScroll: PropTypes.func,\n onShowMore: PropTypes.func,\n 'arrows-aria-label': PropTypes.shape({\n showMoreOnLeftAriaLabel: PropTypes.string,\n showMoreOnRightAriaLabel: PropTypes.string\n }),\n // eslint-disable-next-line react/forbid-prop-types\n testingSizes: PropTypes.any\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n actualPage: 0,\n maxPages: 0,\n scrollLeft: 0,\n offsetWidth: 0,\n possiblePositions: [],\n possiblePages: [],\n cardsWidth: 0\n };\n\n this.handleScroll_ = throttle(200, this.handleScroll.bind(this));\n this.handleScroll = this.handleScroll.bind(this);\n this.handleOnLeft = this.handleOnLeft.bind(this);\n this.handleOnRight = this.handleOnRight.bind(this);\n this.scrollTo = this.scrollTo.bind(this);\n this.updateState = debounce(200, this.updatePages.bind(this));\n this.updatePages = this.updatePages.bind(this);\n this.setCardsWrapper = this.setCardsWrapper.bind(this);\n this.getScrollWidth = this.getScrollWidth.bind(this);\n this.handleResize = this.handleResize.bind(this);\n\n // for testing purposes only - no other way to test this polluted component\n if (props.testingSizes) {\n const {offsetWidth, scrollLeft, maxPages, possiblePages, possiblePositions} =\n props.testingSizes;\n this.state.offsetWidth = offsetWidth;\n this.state.scrollLeft = scrollLeft;\n this.state.maxPages = maxPages;\n this.state.possiblePages = possiblePages;\n this.state.possiblePositions = possiblePositions;\n }\n }\n\n componentDidMount() {\n this.cardsWrapper.addEventListener('scroll', this.handleScroll_);\n\n if (window) {\n window.addEventListener('resize', this.handleResize);\n }\n }\n\n componentDidUpdate() {\n const {cards = []} = this.props;\n const {offsetWidth, cardsWidth} = this.state;\n const newCardsWidth = pipe(map(computeWidth), sum)(cards);\n\n if (newCardsWidth !== cardsWidth && offsetWidth !== 0) {\n this.updatePaginationState(cards);\n // eslint-disable-next-line react/no-did-update-set-state\n this.setState({\n cardsWidth: newCardsWidth\n });\n }\n }\n\n componentWillUnmount() {\n this.cardsWrapper.removeEventListener('scroll', this.handleScroll_);\n\n if (window) {\n window.removeEventListener('resize', this.handleResize);\n }\n this.updateState.cancel();\n }\n\n /* istanbul ignore next */\n handleResize() {\n const {cards = []} = this.props;\n this.updatePaginationState(cards);\n }\n\n /* istanbul ignore next */\n updatePaginationState(cards) {\n const {offsetWidth: wrapperWidth, scrollLeft: wrapperScrollLeft} = this.state;\n\n const cardWidths = map(computeWidth)(cards);\n\n const possiblePositions = pipe(\n reduce(\n ([cardPositions, accWidth], cardWidth) => [\n [...cardPositions, accWidth],\n cardWidth + accWidth\n ],\n [[], 0]\n ),\n head\n )(cardWidths);\n\n const possiblePages = pipe(\n reduce(\n ([acc, pageIndex, accPageWidth], cardWidth) => {\n const pageWidth = accPageWidth + cardWidth;\n if (pageWidth > wrapperWidth) {\n return [[...acc, pageIndex + 1], pageIndex + 1, cardWidth];\n }\n return [[...acc, pageIndex], pageIndex, pageWidth];\n },\n [[], 0, 0]\n ),\n head\n )(cardWidths);\n\n const skip = findIndex(position => position >= wrapperScrollLeft, possiblePositions);\n const actualPage = possiblePages[skip + 1];\n\n this.setState({\n possiblePositions,\n possiblePages,\n maxPages: last(possiblePages),\n actualPage\n });\n }\n\n setCardsWrapper(element) {\n this.cardsWrapper = element;\n this.setState({\n scrollLeft: this.cardsWrapper?.scrollLeft,\n offsetWidth: this.cardsWrapper?.offsetWidth\n });\n }\n\n /* istanbul ignore next */\n getScrollWidth(index) {\n const {cards = []} = this.props;\n const card = cards[index];\n return computeWidth(card);\n }\n\n /* istanbul ignore next */\n handleScroll() {\n const scrollLeft = this.cardsWrapper?.scrollLeft;\n this.setState({scrollLeft});\n\n const {possiblePositions, offsetWidth} = this.state;\n const {onScroll} = this.props;\n if (onScroll) {\n const leftBound = scrollLeft;\n const rightBound = scrollLeft + offsetWidth;\n\n const leftIndex = findIndex(position => position > leftBound, possiblePositions) - 1;\n const rightIndex = findLastIndex(position => position < rightBound, possiblePositions);\n const skip = leftIndex;\n const limit = rightIndex - skip + 1;\n\n onScroll(skip, limit);\n }\n }\n\n handleOnLeft() {\n const {actualPage, maxPages} = this.state;\n this.scrollTo(nextPage(actualPage - 1, maxPages));\n }\n\n handleOnRight() {\n const {actualPage, maxPages} = this.state;\n this.scrollTo(nextPage(actualPage + 1, maxPages));\n }\n\n scrollTo(page) {\n const {possiblePages, possiblePositions} = this.state;\n const indexOfNextFirstCard = possiblePages.indexOf(page);\n const nextPosition = possiblePositions[indexOfNextFirstCard];\n this.cardsWrapper.scrollLeft = nextPosition;\n this.updatePages(page);\n this.setState({\n scrollLeft: nextPosition\n });\n }\n\n updatePages(actualPage) {\n this.setState({\n actualPage\n });\n }\n\n render() {\n const {\n title,\n showMore,\n cards,\n customStyle = {},\n onShowMore,\n dataName,\n contentType,\n 'arrows-aria-label': ariaLabel = {}\n } = this.props;\n const {skin} = this.context;\n const {maxPages} = this.state;\n const dark = getOr('#90A4AE', 'common.dark', skin);\n const titleStyle = onShowMore ? style.titleLink : style.title;\n const cardsView = pipe(\n toPairs,\n map(([key, card]) => {\n return (\n <div className={style.card} key={key}>\n <Card {...card} dataName={`${dataName}-${key}`} />\n </div>\n );\n })\n )(cards);\n const leftArrowView = (\n <div className={style.circle} onClick={this.handleOnLeft} data-name=\"card-list-left-arrow\">\n <ArrowLeft\n style={{color: dark}}\n className={style.left}\n width={10}\n height={10}\n aria-label={ariaLabel.showMoreOnLeftAriaLabel}\n />\n </div>\n );\n const rightArrowView = (\n <div className={style.circle} onClick={this.handleOnRight} data-name=\"card-list-right-arrow\">\n <ArrowRight\n style={{color: dark}}\n className={style.right}\n width={10}\n height={10}\n aria-label={ariaLabel.showMoreOnRightAriaLabel}\n />\n </div>\n );\n\n const titleView =\n typeof title === 'string' ? (\n <span data-name=\"title\" className={titleStyle} onClick={onShowMore}>\n <IconView contentType={contentType} />\n <span>{title}</span>\n </span>\n ) : (\n <span className={style.titleNode}>{title}</span>\n );\n\n const hasPages = maxPages > 0;\n const showMoreView =\n hasPages && showMore && onShowMore ? (\n <ShowMoreLink\n className={hasPages ? style.showMoreBar : style.showMore}\n onShowMore={onShowMore}\n showMore={showMore}\n />\n ) : null;\n\n const switchPagesView = hasPages ? (\n <div className={style.pagingWrapper}>\n {showMoreView}\n {leftArrowView}\n {rightArrowView}\n </div>\n ) : null;\n\n return (\n <div\n className={style.wrapper}\n style={customStyle}\n data-name=\"cardsList\"\n data-max-pages={`${maxPages}`}\n // eslint-disable-next-line react/destructuring-assignment\n data-actual-page={`${this.state.actualPage}`}\n data-scroll-left={this.cardsWrapper?.scrollLeft}\n >\n <div className={style.list}>\n <div>\n <div data-name=\"header\" className={style.header}>\n {titleView}\n {switchPagesView}\n </div>\n <div\n className={style.cards}\n data-testid=\"cards-view-wrapper\"\n ref={this.setCardsWrapper}\n >\n {cardsView}\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default CardsList;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../../src/molecule/dashboard/cards-list/prop-types.ts"],"names":[],"mappings":";AAAA,oBAAY,cAAc,GAAG;IAC3B,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;IACjC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACrC,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,mBAAmB,EAAE;QACnB,uBAAuB,EAAE,MAAM,CAAC;QAChC,wBAAwB,EAAE,MAAM,CAAC;KAClC,CAAC;
|
|
1
|
+
{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../../src/molecule/dashboard/cards-list/prop-types.ts"],"names":[],"mappings":";AAAA,oBAAY,cAAc,GAAG;IAC3B,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;IACjC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACrC,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,mBAAmB,EAAE;QACnB,uBAAuB,EAAE,MAAM,CAAC;QAChC,wBAAwB,EAAE,MAAM,CAAC;KAClC,CAAC;CACH,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"prop-types.js","names":[],"sources":["../../../../src/molecule/dashboard/cards-list/prop-types.ts"],"sourcesContent":["export type CardsListProps = {\n contentType: string;\n dataName: string;\n title: string | React.ReactNode;\n showMore: string;\n cards: Record<string, unknown>[];\n customStyle: Record<string, unknown>;\n onScroll: (skip: number, limit: number) => void;\n onShowMore: () => void;\n 'arrows-aria-label': {\n showMoreOnLeftAriaLabel: string;\n showMoreOnRightAriaLabel: string;\n };\n
|
|
1
|
+
{"version":3,"file":"prop-types.js","names":[],"sources":["../../../../src/molecule/dashboard/cards-list/prop-types.ts"],"sourcesContent":["export type CardsListProps = {\n contentType: string;\n dataName: string;\n title: string | React.ReactNode;\n showMore: string;\n cards: Record<string, unknown>[];\n customStyle: Record<string, unknown>;\n onScroll: (skip: number, limit: number) => void;\n onShowMore: () => void;\n 'arrows-aria-label': {\n showMoreOnLeftAriaLabel: string;\n showMoreOnRightAriaLabel: string;\n };\n};\n"],"mappings":""}
|
|
@@ -8,8 +8,6 @@
|
|
|
8
8
|
@value lightMediumGray from colors;
|
|
9
9
|
@value medium from colors;
|
|
10
10
|
@value light from colors;
|
|
11
|
-
@value cm_grey_100 from colors;
|
|
12
|
-
@value cm_grey_75 from colors;
|
|
13
11
|
|
|
14
12
|
.wrapper {
|
|
15
13
|
padding: 16px 30px 8px;
|
|
@@ -106,26 +104,45 @@
|
|
|
106
104
|
}
|
|
107
105
|
|
|
108
106
|
.arrow {
|
|
109
|
-
|
|
110
|
-
|
|
107
|
+
position: flex;
|
|
108
|
+
padding: 9px;
|
|
111
109
|
cursor: pointer;
|
|
110
|
+
opacity: 1;
|
|
112
111
|
user-select: none;
|
|
113
112
|
}
|
|
114
113
|
|
|
115
|
-
.
|
|
116
|
-
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
.arrowsWrapper {
|
|
120
|
-
display: flex;
|
|
121
|
-
justify-content: space-between;
|
|
122
|
-
gap: 12px;
|
|
114
|
+
.circle:hover {
|
|
115
|
+
box-shadow: 0 0 10px 0 color(medium a(70%));
|
|
123
116
|
}
|
|
124
117
|
|
|
118
|
+
.circle {
|
|
119
|
+
box-shadow: 0 0px 4px 0 color(lightMediumGray a(70%));
|
|
120
|
+
border: solid 1px light;
|
|
121
|
+
border-radius: 50%;
|
|
122
|
+
cursor: pointer;
|
|
123
|
+
line-height: 0;
|
|
124
|
+
margin-left: 5px;
|
|
125
|
+
}
|
|
125
126
|
.pagingWrapper {
|
|
126
127
|
display: inline-flex;
|
|
127
128
|
}
|
|
128
129
|
|
|
130
|
+
.arrow:hover {
|
|
131
|
+
opacity: 1;
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.left {
|
|
135
|
+
composes: arrow;
|
|
136
|
+
left: -35px;
|
|
137
|
+
text-align: right;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
.right {
|
|
141
|
+
composes: arrow;
|
|
142
|
+
right: -35px;
|
|
143
|
+
text-align: left;
|
|
144
|
+
}
|
|
145
|
+
|
|
129
146
|
@media tablet {
|
|
130
147
|
.cards {
|
|
131
148
|
overflow-x: scroll;
|
|
@@ -79,6 +79,8 @@ declare const ActionableExpandableTable: {
|
|
|
79
79
|
download: import("prop-types").Requireable<boolean>;
|
|
80
80
|
target: import("prop-types").Requireable<string>;
|
|
81
81
|
}>>;
|
|
82
|
+
hoverBackgroundColor: import("prop-types").Requireable<string>;
|
|
83
|
+
hoverColor: import("prop-types").Requireable<string>;
|
|
82
84
|
disabled: import("prop-types").Requireable<boolean>;
|
|
83
85
|
className: import("prop-types").Requireable<string>;
|
|
84
86
|
customStyle: import("prop-types").Requireable<import("prop-types").InferProps<{}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandible-actionable-table/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAOjE,OAAO,EAA2C,KAAK,EAAY,MAAM,SAAS,CAAC;AAqCnF,QAAA,MAAM,yBAAyB;YAAW,KAAK,iBAAiB,gBAAgB
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandible-actionable-table/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAOjE,OAAO,EAA2C,KAAK,EAAY,MAAM,SAAS,CAAC;AAqCnF,QAAA,MAAM,yBAAyB;YAAW,KAAK,iBAAiB,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoL/E,CAAC;AASF,eAAe,yBAAyB,CAAC"}
|
|
@@ -56,6 +56,8 @@ export declare const propTypes: {
|
|
|
56
56
|
download: PropTypes.Requireable<boolean>;
|
|
57
57
|
target: PropTypes.Requireable<string>;
|
|
58
58
|
}>>;
|
|
59
|
+
hoverBackgroundColor: PropTypes.Requireable<string>;
|
|
60
|
+
hoverColor: PropTypes.Requireable<string>;
|
|
59
61
|
disabled: PropTypes.Requireable<boolean>;
|
|
60
62
|
className: PropTypes.Requireable<string>;
|
|
61
63
|
customStyle: PropTypes.Requireable<PropTypes.InferProps<{}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandible-actionable-table/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,OAAO,EAAC,0BAA0B,EAAC,MAAM,mCAAmC,CAAC;AAC7E,OAAO,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAC,KAAK,IAAI,gBAAgB,EAAC,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAC,KAAK,IAAI,oBAAoB,EAAC,MAAM,4BAA4B,CAAC;AA0BzE,eAAO,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandible-actionable-table/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,OAAO,EAAC,0BAA0B,EAAC,MAAM,mCAAmC,CAAC;AAC7E,OAAO,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAC,KAAK,IAAI,gBAAgB,EAAC,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAC,KAAK,IAAI,oBAAoB,EAAC,MAAM,4BAA4B,CAAC;AA0BzE,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoBrB,CAAC;AAEF,oBAAY,KAAK,GACb,MAAM,GACN,CAAC,eAAe,GAAG;IACjB,aAAa,EAAE,QAAQ,CAAC;CACzB,CAAC,GACF,CAAC,oBAAoB,GAAG;IACtB,aAAa,EAAE,cAAc,CAAC;CAC/B,CAAC,CAAC;AAEP,oBAAY,SAAS,GACjB,CAAC,eAAe,GAAG;IACjB,aAAa,EAAE,aAAa,CAAC;CAC9B,CAAC,GACF,CAAC,0BAA0B,GAAG;IAC5B,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC,CAAC;AAEP,oBAAY,SAAS,GACjB,CAAC,gBAAgB,GAAG;IAClB,aAAa,EAAE,cAAc,CAAC;CAC/B,CAAC,GACF,CAAC,KAAK,GAAG;IACP,aAAa,EAAE,yBAAyB,CAAC;CAC1C,CAAC,CAAC;AAEP,oBAAY,MAAM,GAAG;IAAC,KAAK,EAAE,MAAM,CAAA;CAAC,CAAC;AACrC,oBAAY,GAAG,GAAG;IAChB,MAAM,EAAE,KAAK,EAAE,CAAC;IAEhB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AACF,oBAAY,OAAO,GAAG,MAAM,EAAE,CAAC;AAC/B,oBAAY,IAAI,GAAG,GAAG,EAAE,CAAC;AAEzB,oBAAY,KAAK,GAAG;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,GAAG,MAAM,GAAG,IAAI,GAAG,GAAG,EAAE,CAAC;IACvC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC,CAAC;AAEF,oBAAY,WAAW,GAAG;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learner-skill-card/index.js"],"names":[],"mappings":";AASA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learner-skill-card/index.js"],"names":[],"mappings":";AASA,yEAiJC"}
|
|
@@ -46,7 +46,6 @@ const LearnerSkillCard = (props, context) => {
|
|
|
46
46
|
skin,
|
|
47
47
|
translate
|
|
48
48
|
} = context;
|
|
49
|
-
const [hovered, setHovered] = (0, _react.useState)(false);
|
|
50
49
|
const primarySkinColor = (0, _get2.default)('common.primary', skin);
|
|
51
50
|
const reviewLocale = translate('Review');
|
|
52
51
|
const exploreLocale = translate('Explore');
|
|
@@ -54,8 +53,6 @@ const LearnerSkillCard = (props, context) => {
|
|
|
54
53
|
const questionsLocale = translate('questions');
|
|
55
54
|
const skillFocusLocale = translate('skill_focus');
|
|
56
55
|
const contentCompletedLocale = translate('courses_completed');
|
|
57
|
-
const handleMouseOver = (0, _react.useCallback)(() => setHovered(true), [setHovered]);
|
|
58
|
-
const handleMouseLeave = (0, _react.useCallback)(() => setHovered(false), [setHovered]);
|
|
59
56
|
const buttonReviewProps = {
|
|
60
57
|
customStyle: {
|
|
61
58
|
backgroundColor: '#FFF',
|
|
@@ -70,10 +67,12 @@ const LearnerSkillCard = (props, context) => {
|
|
|
70
67
|
};
|
|
71
68
|
const buttonExploreProps = {
|
|
72
69
|
customStyle: {
|
|
73
|
-
backgroundColor:
|
|
74
|
-
color:
|
|
70
|
+
backgroundColor: (0, _cssColorFunction.convert)(`color(${primarySkinColor} a(0.07))`),
|
|
71
|
+
color: primarySkinColor,
|
|
75
72
|
transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'
|
|
76
73
|
},
|
|
74
|
+
hoverColor: '#FFFFFF',
|
|
75
|
+
hoverBackgroundColor: primarySkinColor,
|
|
77
76
|
onClick: onExploreClick,
|
|
78
77
|
'aria-label': `${skillTitle}, ${exploreLocale}`,
|
|
79
78
|
label: exploreLocale,
|
|
@@ -82,8 +81,8 @@ const LearnerSkillCard = (props, context) => {
|
|
|
82
81
|
position: 'left',
|
|
83
82
|
faIcon: {
|
|
84
83
|
name: 'compass',
|
|
85
|
-
backgroundColor:
|
|
86
|
-
color:
|
|
84
|
+
backgroundColor: (0, _cssColorFunction.convert)(`color(${primarySkinColor} a(0.07))`),
|
|
85
|
+
color: primarySkinColor,
|
|
87
86
|
size: 16
|
|
88
87
|
}
|
|
89
88
|
}
|
|
@@ -153,8 +152,6 @@ const LearnerSkillCard = (props, context) => {
|
|
|
153
152
|
"data-name": "cta-wrapper"
|
|
154
153
|
}, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonReviewProps), /*#__PURE__*/_react.default.createElement("div", {
|
|
155
154
|
className: _style.default.buttonWrapper,
|
|
156
|
-
onMouseOver: handleMouseOver,
|
|
157
|
-
onMouseLeave: handleMouseLeave,
|
|
158
155
|
"data-name": "button-explore-wrapper"
|
|
159
156
|
}, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonExploreProps))));
|
|
160
157
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["LearnerSkillCard","props","context","ariaLabel","skillTitle","skillAriaLabel","focus","metrics","review","onReviewClick","onExploreClick","score","content","questionsToReview","contentCompleted","skin","translate","hovered","setHovered","useState","primarySkinColor","reviewLocale","exploreLocale","coursesLocale","questionsLocale","skillFocusLocale","contentCompletedLocale","handleMouseOver","useCallback","handleMouseLeave","buttonReviewProps","customStyle","backgroundColor","transition","padding","disabled","onClick","label","buttonExploreProps","convert","color","icon","position","faIcon","name","size","ProgressBar","progressBarColor","inlineProgressValueStyle","width","style","progressWrapper","progress","learnerSkillCardWrapper","skillCoursesAndQuestionsWrapper","skillInformation","skillInformationNumber","skillTitleWrapper","skillFocusBadge","faSize","wrapperSize","progressInformations","progressInformation","progressInformationNumber","ctaWrapper","buttonWrapper","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","bool","shape","number","func"],"sources":["../../../src/molecule/learner-skill-card/index.js"],"sourcesContent":["import React, {useCallback, useState} from 'react';\nimport {convert} from 'css-color-function';\nimport {get} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport Icon from '../../atom/icon';\nimport ButtonLink from '../../atom/button-link';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nconst LearnerSkillCard = (props, context) => {\n const {\n 'aria-label': ariaLabel,\n skillTitle,\n skillAriaLabel,\n focus = false,\n metrics,\n review = false,\n onReviewClick,\n onExploreClick\n } = props;\n const {score, content, questionsToReview, contentCompleted = 0} = metrics;\n const {skin, translate} = context;\n const [hovered, setHovered] = useState(false);\n const primarySkinColor = get('common.primary', skin);\n\n const reviewLocale = translate('Review');\n const exploreLocale = translate('Explore');\n const coursesLocale = translate('courses');\n const questionsLocale = translate('questions');\n const skillFocusLocale = translate('skill_focus');\n const contentCompletedLocale = translate('courses_completed');\n\n const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n const buttonReviewProps = {\n customStyle: {\n backgroundColor: '#FFF',\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n padding: '0px'\n },\n disabled: !review,\n onClick: onReviewClick,\n 'aria-label': `${skillTitle}, ${reviewLocale}`,\n label: reviewLocale,\n 'data-name': 'learner-skill-card-review-button'\n };\n\n const buttonExploreProps = {\n customStyle: {\n backgroundColor: hovered ? primarySkinColor : convert(`color(${primarySkinColor} a(0.07))`),\n color: hovered ? '#FFFFFF' : primarySkinColor,\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'\n },\n onClick: onExploreClick,\n 'aria-label': `${skillTitle}, ${exploreLocale}`,\n label: exploreLocale,\n 'data-name': 'learner-skill-card-explore-button',\n icon: {\n position: 'left',\n faIcon: {\n name: 'compass',\n backgroundColor: hovered ? primarySkinColor : convert(`color(${primarySkinColor} a(0.07))`),\n color: hovered ? '#FFFFFF' : primarySkinColor,\n size: 16\n }\n }\n };\n\n const ProgressBar = useCallback(() => {\n if (!content) return null;\n\n const progressBarColor = '#3EC483';\n const inlineProgressValueStyle = {\n backgroundColor: progressBarColor,\n width: `${score}%`\n };\n\n return (\n <div className={style.progressWrapper}>\n <div\n data-name=\"progress\"\n className={style.progress}\n style={inlineProgressValueStyle}\n role=\"progressbar\"\n aria-label={get('progression', ariaLabel)}\n />\n </div>\n );\n }, [score, ariaLabel, content]);\n\n return (\n <div\n className={style.learnerSkillCardWrapper}\n data-name=\"learner-skill-card-wrapper\"\n aria-label={ariaLabel}\n >\n {content || questionsToReview ? (\n <div className={style.skillCoursesAndQuestionsWrapper}>\n {content ? (\n <div className={style.skillInformation} data-name=\"skill-courses\">\n <span className={style.skillInformationNumber}>{content}</span> {coursesLocale}\n </div>\n ) : null}\n {questionsToReview ? (\n <div className={style.skillInformation} data-name=\"skill-questions\">\n <span className={style.skillInformationNumber}>{questionsToReview}</span>\n {questionsLocale}\n </div>\n ) : null}\n </div>\n ) : null}\n <div className={style.skillTitleWrapper}>\n <div\n data-name=\"skill-title\"\n className={style.skillTitle}\n aria-label={skillAriaLabel || skillTitle}\n >\n {skillTitle}\n </div>\n {focus ? (\n <div className={style.skillFocusBadge}>\n <Icon\n iconName=\"bullseye-arrow\"\n backgroundColor=\"#DDD1FF\"\n size={{\n faSize: 10,\n wrapperSize: 16\n }}\n />\n {skillFocusLocale}\n </div>\n ) : null}\n </div>\n <ProgressBar />\n <div className={style.progressInformations}>\n {content ? (\n <>\n <div className={style.progressInformation} data-name=\"skill-completed-courses\">\n <span className={style.progressInformationNumber}>{contentCompleted}</span>\n {` ${contentCompletedLocale}`}\n </div>\n <div className={style.progressInformation} data-name=\"completed-percentage\">\n <span className={style.progressInformationNumber}>{score}%</span>\n </div>\n </>\n ) : null}\n </div>\n <div className={style.ctaWrapper} data-name=\"cta-wrapper\">\n <ButtonLink {...buttonReviewProps} />\n <div\n className={style.buttonWrapper}\n onMouseOver={handleMouseOver}\n onMouseLeave={handleMouseLeave}\n data-name=\"button-explore-wrapper\"\n >\n <ButtonLink {...buttonExploreProps} />\n </div>\n </div>\n </div>\n );\n};\n\nLearnerSkillCard.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nLearnerSkillCard.propTypes = {\n 'aria-label': PropTypes.string,\n skillTitle: PropTypes.string,\n skillAriaLabel: PropTypes.string,\n focus: PropTypes.bool,\n metrics: PropTypes.shape({\n score: PropTypes.number,\n content: PropTypes.number,\n questionsToReview: PropTypes.number,\n contentCompleted: PropTypes.number\n }),\n review: PropTypes.bool,\n onReviewClick: PropTypes.func,\n onExploreClick: PropTypes.func\n};\n\nexport default LearnerSkillCard;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["LearnerSkillCard","props","context","ariaLabel","skillTitle","skillAriaLabel","focus","metrics","review","onReviewClick","onExploreClick","score","content","questionsToReview","contentCompleted","skin","translate","primarySkinColor","reviewLocale","exploreLocale","coursesLocale","questionsLocale","skillFocusLocale","contentCompletedLocale","buttonReviewProps","customStyle","backgroundColor","transition","padding","disabled","onClick","label","buttonExploreProps","convert","color","hoverColor","hoverBackgroundColor","icon","position","faIcon","name","size","ProgressBar","useCallback","progressBarColor","inlineProgressValueStyle","width","style","progressWrapper","progress","learnerSkillCardWrapper","skillCoursesAndQuestionsWrapper","skillInformation","skillInformationNumber","skillTitleWrapper","skillFocusBadge","faSize","wrapperSize","progressInformations","progressInformation","progressInformationNumber","ctaWrapper","buttonWrapper","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","bool","shape","number","func"],"sources":["../../../src/molecule/learner-skill-card/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport {convert} from 'css-color-function';\nimport {get} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport Icon from '../../atom/icon';\nimport ButtonLink from '../../atom/button-link';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nconst LearnerSkillCard = (props, context) => {\n const {\n 'aria-label': ariaLabel,\n skillTitle,\n skillAriaLabel,\n focus = false,\n metrics,\n review = false,\n onReviewClick,\n onExploreClick\n } = props;\n const {score, content, questionsToReview, contentCompleted = 0} = metrics;\n const {skin, translate} = context;\n const primarySkinColor = get('common.primary', skin);\n\n const reviewLocale = translate('Review');\n const exploreLocale = translate('Explore');\n const coursesLocale = translate('courses');\n const questionsLocale = translate('questions');\n const skillFocusLocale = translate('skill_focus');\n const contentCompletedLocale = translate('courses_completed');\n\n const buttonReviewProps = {\n customStyle: {\n backgroundColor: '#FFF',\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n padding: '0px'\n },\n disabled: !review,\n onClick: onReviewClick,\n 'aria-label': `${skillTitle}, ${reviewLocale}`,\n label: reviewLocale,\n 'data-name': 'learner-skill-card-review-button'\n };\n\n const buttonExploreProps = {\n customStyle: {\n backgroundColor: convert(`color(${primarySkinColor} a(0.07))`),\n color: primarySkinColor,\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'\n },\n hoverColor: '#FFFFFF',\n hoverBackgroundColor: primarySkinColor,\n onClick: onExploreClick,\n 'aria-label': `${skillTitle}, ${exploreLocale}`,\n label: exploreLocale,\n 'data-name': 'learner-skill-card-explore-button',\n icon: {\n position: 'left',\n faIcon: {\n name: 'compass',\n backgroundColor: convert(`color(${primarySkinColor} a(0.07))`),\n color: primarySkinColor,\n size: 16\n }\n }\n };\n\n const ProgressBar = useCallback(() => {\n if (!content) return null;\n\n const progressBarColor = '#3EC483';\n const inlineProgressValueStyle = {\n backgroundColor: progressBarColor,\n width: `${score}%`\n };\n\n return (\n <div className={style.progressWrapper}>\n <div\n data-name=\"progress\"\n className={style.progress}\n style={inlineProgressValueStyle}\n role=\"progressbar\"\n aria-label={get('progression', ariaLabel)}\n />\n </div>\n );\n }, [score, ariaLabel, content]);\n\n return (\n <div\n className={style.learnerSkillCardWrapper}\n data-name=\"learner-skill-card-wrapper\"\n aria-label={ariaLabel}\n >\n {content || questionsToReview ? (\n <div className={style.skillCoursesAndQuestionsWrapper}>\n {content ? (\n <div className={style.skillInformation} data-name=\"skill-courses\">\n <span className={style.skillInformationNumber}>{content}</span> {coursesLocale}\n </div>\n ) : null}\n {questionsToReview ? (\n <div className={style.skillInformation} data-name=\"skill-questions\">\n <span className={style.skillInformationNumber}>{questionsToReview}</span>\n {questionsLocale}\n </div>\n ) : null}\n </div>\n ) : null}\n <div className={style.skillTitleWrapper}>\n <div\n data-name=\"skill-title\"\n className={style.skillTitle}\n aria-label={skillAriaLabel || skillTitle}\n >\n {skillTitle}\n </div>\n {focus ? (\n <div className={style.skillFocusBadge}>\n <Icon\n iconName=\"bullseye-arrow\"\n backgroundColor=\"#DDD1FF\"\n size={{\n faSize: 10,\n wrapperSize: 16\n }}\n />\n {skillFocusLocale}\n </div>\n ) : null}\n </div>\n <ProgressBar />\n <div className={style.progressInformations}>\n {content ? (\n <>\n <div className={style.progressInformation} data-name=\"skill-completed-courses\">\n <span className={style.progressInformationNumber}>{contentCompleted}</span>\n {` ${contentCompletedLocale}`}\n </div>\n <div className={style.progressInformation} data-name=\"completed-percentage\">\n <span className={style.progressInformationNumber}>{score}%</span>\n </div>\n </>\n ) : null}\n </div>\n <div className={style.ctaWrapper} data-name=\"cta-wrapper\">\n <ButtonLink {...buttonReviewProps} />\n <div className={style.buttonWrapper} data-name=\"button-explore-wrapper\">\n <ButtonLink {...buttonExploreProps} />\n </div>\n </div>\n </div>\n );\n};\n\nLearnerSkillCard.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nLearnerSkillCard.propTypes = {\n 'aria-label': PropTypes.string,\n skillTitle: PropTypes.string,\n skillAriaLabel: PropTypes.string,\n focus: PropTypes.bool,\n metrics: PropTypes.shape({\n score: PropTypes.number,\n content: PropTypes.number,\n questionsToReview: PropTypes.number,\n contentCompleted: PropTypes.number\n }),\n review: PropTypes.bool,\n onReviewClick: PropTypes.func,\n onExploreClick: PropTypes.func\n};\n\nexport default LearnerSkillCard;\n"],"mappings":"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"}
|
|
@@ -10,7 +10,6 @@ declare const LearningPriorityCard: {
|
|
|
10
10
|
}>>;
|
|
11
11
|
progression: import("prop-types").Requireable<number>;
|
|
12
12
|
onClick: import("prop-types").Requireable<(...args: any[]) => any>;
|
|
13
|
-
type: import("prop-types").Requireable<string>;
|
|
14
13
|
};
|
|
15
14
|
contextTypes: {
|
|
16
15
|
skin: import("prop-types").Requireable<import("prop-types").InferProps<{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-card/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAIjE,OAAO,EAAC,6BAA6B,EAAY,MAAM,SAAS,CAAC;AAGjE,QAAA,MAAM,oBAAoB;YAAW,6BAA6B,WAAW,gBAAgB
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-card/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAIjE,OAAO,EAAC,6BAA6B,EAAY,MAAM,SAAS,CAAC;AAGjE,QAAA,MAAM,oBAAoB;YAAW,6BAA6B,WAAW,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8D5F,CAAC;AASF,eAAe,oBAAoB,CAAC"}
|
|
@@ -5,7 +5,7 @@ exports.default = void 0;
|
|
|
5
5
|
|
|
6
6
|
var _get2 = _interopRequireDefault(require("lodash/fp/get"));
|
|
7
7
|
|
|
8
|
-
var _react =
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
10
|
var _cssColorFunction = require("css-color-function");
|
|
11
11
|
|
|
@@ -40,15 +40,14 @@ const LearningPriorityCard = (props, context) => {
|
|
|
40
40
|
const skin = (0, _provider.GetSkinFromContext)(context);
|
|
41
41
|
const exploreLocale = translate('Explore');
|
|
42
42
|
const primarySkinColor = (0, _get2.default)('common.primary', skin);
|
|
43
|
-
const [hovered, setHovered] = (0, _react.useState)(false);
|
|
44
|
-
const handleMouseOver = (0, _react.useCallback)(() => setHovered(true), [setHovered]);
|
|
45
|
-
const handleMouseLeave = (0, _react.useCallback)(() => setHovered(false), [setHovered]);
|
|
46
43
|
const buttonExploreProps = {
|
|
47
44
|
customStyle: {
|
|
48
|
-
backgroundColor:
|
|
49
|
-
color:
|
|
45
|
+
backgroundColor: (0, _cssColorFunction.convert)(`color(${primarySkinColor} a(0.07))`),
|
|
46
|
+
color: primarySkinColor,
|
|
50
47
|
transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'
|
|
51
48
|
},
|
|
49
|
+
hoverBackgroundColor: primarySkinColor,
|
|
50
|
+
hoverColor: '#FFFFFF',
|
|
52
51
|
onClick,
|
|
53
52
|
'aria-label': `${title}, ${exploreLocale}`,
|
|
54
53
|
label: exploreLocale,
|
|
@@ -57,8 +56,8 @@ const LearningPriorityCard = (props, context) => {
|
|
|
57
56
|
position: 'left',
|
|
58
57
|
faIcon: {
|
|
59
58
|
name: 'compass',
|
|
60
|
-
backgroundColor:
|
|
61
|
-
color:
|
|
59
|
+
backgroundColor: (0, _cssColorFunction.convert)(`color(${primarySkinColor} a(0.07))`),
|
|
60
|
+
color: primarySkinColor,
|
|
62
61
|
size: 16
|
|
63
62
|
}
|
|
64
63
|
}
|
|
@@ -82,8 +81,6 @@ const LearningPriorityCard = (props, context) => {
|
|
|
82
81
|
'aria-label': `${title} ${progression}%`,
|
|
83
82
|
'data-name': `circular-progress-bar-${title}`
|
|
84
83
|
})), /*#__PURE__*/_react.default.createElement("div", {
|
|
85
|
-
onMouseOver: handleMouseOver,
|
|
86
|
-
onMouseLeave: handleMouseLeave,
|
|
87
84
|
"data-name": "button-explore-wrapper"
|
|
88
85
|
}, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonExploreProps)));
|
|
89
86
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["LearningPriorityCard","props","context","tag","label","tagLabel","title","progression","onClick","translate","GetTranslateFromContext","skin","GetSkinFromContext","exploreLocale","primarySkinColor","
|
|
1
|
+
{"version":3,"file":"index.js","names":["LearningPriorityCard","props","context","tag","label","tagLabel","title","progression","onClick","translate","GetTranslateFromContext","skin","GetSkinFromContext","exploreLocale","primarySkinColor","buttonExploreProps","customStyle","backgroundColor","convert","color","transition","hoverBackgroundColor","hoverColor","icon","position","faIcon","name","size","style","container","circularProgressBarContainer","strokeWidth","propTypes","contextTypes","Provider","childContextTypes"],"sources":["../../../src/molecule/learning-priority-card/index.tsx"],"sourcesContent":["import React from 'react';\nimport {get} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Provider, {GetTranslateFromContext, GetSkinFromContext} from '../../atom/provider';\nimport {WebContextValues} from '../../atom/provider/web-context';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport CircularProgressBar from '../../atom/circular-progress-bar';\nimport {LearningPriorityCardPropTypes, propTypes} from './types';\nimport style from './style.css';\n\nconst LearningPriorityCard = (props: LearningPriorityCardPropTypes, context: WebContextValues) => {\n const {\n tag: {label: tagLabel},\n title,\n progression,\n onClick\n } = props;\n const translate = GetTranslateFromContext(context);\n const skin = GetSkinFromContext(context);\n const exploreLocale = translate('Explore');\n const primarySkinColor = get('common.primary', skin);\n\n const buttonExploreProps = {\n customStyle: {\n backgroundColor: convert(`color(${primarySkinColor} a(0.07))`),\n color: primarySkinColor,\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'\n },\n hoverBackgroundColor: primarySkinColor,\n hoverColor: '#FFFFFF',\n onClick,\n 'aria-label': `${title}, ${exploreLocale}`,\n label: exploreLocale,\n 'data-name': 'learning-priority-explore-button',\n icon: {\n position: 'left' as const,\n faIcon: {\n name: 'compass',\n backgroundColor: convert(`color(${primarySkinColor} a(0.07))`),\n color: primarySkinColor,\n size: 16\n }\n }\n };\n\n return (\n <div\n className={style.container}\n aria-label={`learning priority card ${title}`}\n data-name={`learning-priority-card-${title}`}\n >\n <div>\n <Tag label={tagLabel} size={'S'} />\n </div>\n <div className={style.title}>{title}</div>\n <div className={style.circularProgressBarContainer}>\n <CircularProgressBar\n {...{\n size: 162,\n strokeWidth: 12,\n progression,\n label: translate('completed'),\n 'aria-label': `${title} ${progression}%`,\n 'data-name': `circular-progress-bar-${title}`\n }}\n />\n </div>\n <div data-name=\"button-explore-wrapper\">\n <ButtonLink {...buttonExploreProps} />\n </div>\n </div>\n );\n};\n\nLearningPriorityCard.propTypes = propTypes;\n\nLearningPriorityCard.contextTypes = {\n skin: Provider.childContextTypes.skin,\n translate: Provider.childContextTypes.translate\n};\n\nexport default LearningPriorityCard;\n"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,MAAMA,oBAAoB,GAAG,CAACC,KAAD,EAAuCC,OAAvC,KAAqE;EAChG,MAAM;IACJC,GAAG,EAAE;MAACC,KAAK,EAAEC;IAAR,CADD;IAEJC,KAFI;IAGJC,WAHI;IAIJC;EAJI,IAKFP,KALJ;EAMA,MAAMQ,SAAS,GAAG,IAAAC,iCAAA,EAAwBR,OAAxB,CAAlB;EACA,MAAMS,IAAI,GAAG,IAAAC,4BAAA,EAAmBV,OAAnB,CAAb;EACA,MAAMW,aAAa,GAAGJ,SAAS,CAAC,SAAD,CAA/B;EACA,MAAMK,gBAAgB,GAAG,mBAAI,gBAAJ,EAAsBH,IAAtB,CAAzB;EAEA,MAAMI,kBAAkB,GAAG;IACzBC,WAAW,EAAE;MACXC,eAAe,EAAE,IAAAC,yBAAA,EAAS,SAAQJ,gBAAiB,WAAlC,CADN;MAEXK,KAAK,EAAEL,gBAFI;MAGXM,UAAU,EAAE;IAHD,CADY;IAMzBC,oBAAoB,EAAEP,gBANG;IAOzBQ,UAAU,EAAE,SAPa;IAQzBd,OARyB;IASzB,cAAe,GAAEF,KAAM,KAAIO,aAAc,EAThB;IAUzBT,KAAK,EAAES,aAVkB;IAWzB,aAAa,kCAXY;IAYzBU,IAAI,EAAE;MACJC,QAAQ,EAAE,MADN;MAEJC,MAAM,EAAE;QACNC,IAAI,EAAE,SADA;QAENT,eAAe,EAAE,IAAAC,yBAAA,EAAS,SAAQJ,gBAAiB,WAAlC,CAFX;QAGNK,KAAK,EAAEL,gBAHD;QAINa,IAAI,EAAE;MAJA;IAFJ;EAZmB,CAA3B;EAuBA,oBACE;IACE,SAAS,EAAEC,cAAA,CAAMC,SADnB;IAEE,cAAa,0BAAyBvB,KAAM,EAF9C;IAGE,aAAY,0BAAyBA,KAAM;EAH7C,gBAKE,uDACE,6BAAC,YAAD;IAAK,KAAK,EAAED,QAAZ;IAAsB,IAAI,EAAE;EAA5B,EADF,CALF,eAQE;IAAK,SAAS,EAAEuB,cAAA,CAAMtB;EAAtB,GAA8BA,KAA9B,CARF,eASE;IAAK,SAAS,EAAEsB,cAAA,CAAME;EAAtB,gBACE,6BAAC,4BAAD;IAEIH,IAAI,EAAE,GAFV;IAGII,WAAW,EAAE,EAHjB;IAIIxB,WAJJ;IAKIH,KAAK,EAAEK,SAAS,CAAC,WAAD,CALpB;IAMI,cAAe,GAAEH,KAAM,IAAGC,WAAY,GAN1C;IAOI,aAAc,yBAAwBD,KAAM;EAPhD,EADF,CATF,eAqBE;IAAK,aAAU;EAAf,gBACE,6BAAC,mBAAD,EAAgBS,kBAAhB,CADF,CArBF,CADF;AA2BD,CA9DD;;AAgEAf,oBAAoB,CAACgC,SAArB,2CAAiCA,gBAAjC;AAEAhC,oBAAoB,CAACiC,YAArB,GAAoC;EAClCtB,IAAI,EAAEuB,iBAAA,CAASC,iBAAT,CAA2BxB,IADC;EAElCF,SAAS,EAAEyB,iBAAA,CAASC,iBAAT,CAA2B1B;AAFJ,CAApC;eAKeT,oB"}
|
|
@@ -6,7 +6,6 @@ export declare type LearningPriorityCardPropTypes = {
|
|
|
6
6
|
};
|
|
7
7
|
progression: number;
|
|
8
8
|
onClick: () => void;
|
|
9
|
-
type: 'learningPriority';
|
|
10
9
|
};
|
|
11
10
|
export declare const propTypes: {
|
|
12
11
|
title: PropTypes.Requireable<string>;
|
|
@@ -15,6 +14,5 @@ export declare const propTypes: {
|
|
|
15
14
|
}>>;
|
|
16
15
|
progression: PropTypes.Requireable<number>;
|
|
17
16
|
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
18
|
-
type: PropTypes.Requireable<string>;
|
|
19
17
|
};
|
|
20
18
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,oBAAY,6BAA6B,GAAG;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE;QACH,KAAK,EAAE,OAAO,GAAG,UAAU,GAAG,eAAe,CAAC;KAC/C,CAAC;IACF,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,oBAAY,6BAA6B,GAAG;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE;QACH,KAAK,EAAE,OAAO,GAAG,UAAU,GAAG,eAAe,CAAC;KAC/C,CAAC;IACF,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;CAOrB,CAAC"}
|
|
@@ -13,8 +13,7 @@ const propTypes = {
|
|
|
13
13
|
label: _propTypes.default.oneOf(['Playlist', 'Certification', 'Skill'])
|
|
14
14
|
}),
|
|
15
15
|
progression: _propTypes.default.number,
|
|
16
|
-
onClick: _propTypes.default.func
|
|
17
|
-
type: _propTypes.default.oneOf(['learningPriority'])
|
|
16
|
+
onClick: _propTypes.default.func
|
|
18
17
|
};
|
|
19
18
|
exports.propTypes = propTypes;
|
|
20
19
|
//# sourceMappingURL=types.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","names":["propTypes","title","PropTypes","string","tag","shape","label","oneOf","progression","number","onClick","func"
|
|
1
|
+
{"version":3,"file":"types.js","names":["propTypes","title","PropTypes","string","tag","shape","label","oneOf","progression","number","onClick","func"],"sources":["../../../src/molecule/learning-priority-card/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\n\nexport type LearningPriorityCardPropTypes = {\n title: string;\n tag: {\n label: 'Skill' | 'Playlist' | 'Certification';\n };\n progression: number;\n onClick: () => void;\n};\n\nexport const propTypes = {\n title: PropTypes.string,\n tag: PropTypes.shape({\n label: PropTypes.oneOf(['Playlist', 'Certification', 'Skill'])\n }),\n progression: PropTypes.number,\n onClick: PropTypes.func\n};\n"],"mappings":";;;;;AAAA;;;;AAWO,MAAMA,SAAS,GAAG;EACvBC,KAAK,EAAEC,kBAAA,CAAUC,MADM;EAEvBC,GAAG,EAAEF,kBAAA,CAAUG,KAAV,CAAgB;IACnBC,KAAK,EAAEJ,kBAAA,CAAUK,KAAV,CAAgB,CAAC,UAAD,EAAa,eAAb,EAA8B,OAA9B,CAAhB;EADY,CAAhB,CAFkB;EAKvBC,WAAW,EAAEN,kBAAA,CAAUO,MALA;EAMvBC,OAAO,EAAER,kBAAA,CAAUS;AANI,CAAlB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/skill-card/index.js"],"names":[],"mappings":";AAwBA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/skill-card/index.js"],"names":[],"mappings":";AAwBA,kEAkEC"}
|
|
@@ -43,16 +43,15 @@ const SkillCard = (props, context) => {
|
|
|
43
43
|
const {
|
|
44
44
|
skin
|
|
45
45
|
} = context;
|
|
46
|
-
const [hovered, setHovered] = (0, _react.useState)(false);
|
|
47
46
|
const primarySkinColor = (0, _getOr.default)('#00B0FF', 'common.primary', skin);
|
|
48
|
-
const handleMouseOver = (0, _react.useCallback)(() => setHovered(true), [setHovered]);
|
|
49
|
-
const handleMouseLeave = (0, _react.useCallback)(() => setHovered(false), [setHovered]);
|
|
50
47
|
const buttonProps = {
|
|
51
48
|
customStyle: {
|
|
52
|
-
backgroundColor:
|
|
53
|
-
color:
|
|
49
|
+
backgroundColor: (0, _cssColorFunction.convert)(`color(${primarySkinColor} a(0.07))`),
|
|
50
|
+
color: primarySkinColor,
|
|
54
51
|
transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'
|
|
55
52
|
},
|
|
53
|
+
hoverBackgroundColor: primarySkinColor,
|
|
54
|
+
hoverColor: '#FFFFFF',
|
|
56
55
|
onClick,
|
|
57
56
|
'aria-label': buttonAriaLabel ? `${skillTitle}, ${buttonAriaLabel}` : skillTitle,
|
|
58
57
|
label: buttonLabel,
|
|
@@ -83,8 +82,6 @@ const SkillCard = (props, context) => {
|
|
|
83
82
|
height: 16
|
|
84
83
|
}), reviseLabel), /*#__PURE__*/_react.default.createElement("div", {
|
|
85
84
|
className: _style.default.buttonWrapper,
|
|
86
|
-
onMouseOver: handleMouseOver,
|
|
87
|
-
onMouseLeave: handleMouseLeave,
|
|
88
85
|
"data-name": "button-wrapper"
|
|
89
86
|
}, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonProps))));
|
|
90
87
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["getGradientBackground","baseColor","gradients","convert","SkillCard","props","context","ariaLabel","skillTitle","skillAriaLabel","buttonLabel","buttonAriaLabel","reviseLabel","reviseAriaLabel","onClick","isCustom","skin","
|
|
1
|
+
{"version":3,"file":"index.js","names":["getGradientBackground","baseColor","gradients","convert","SkillCard","props","context","ariaLabel","skillTitle","skillAriaLabel","buttonLabel","buttonAriaLabel","reviseLabel","reviseAriaLabel","onClick","isCustom","skin","primarySkinColor","getOr","buttonProps","customStyle","backgroundColor","color","transition","hoverBackgroundColor","hoverColor","label","titleBackgroundColor","useMemo","titleBackground","style","skillCardWrapper","background","questionReviseText","questionReviseIcon","buttonWrapper","propTypes"],"sources":["../../../src/molecule/skill-card/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport {convert} from 'css-color-function';\nimport {NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon} from '@coorpacademy/nova-icons';\nimport getOr from 'lodash/fp/getOr';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nconst getGradientBackground = baseColor => {\n const gradients = [\n convert(`color(${baseColor} lightness(30%))`),\n convert(`color(${baseColor} lightness(47%))`),\n convert(`color(${baseColor} lightness(55%))`)\n ];\n\n return `radial-gradient(62.12% 56.45% at 0% 77.29%, ${gradients[0]} 0%, ${convert(\n `color(${gradients[0]} a(0))`\n )} 100%), radial-gradient(113.85% 103.46% at 93.27% 7.88%, ${gradients[1]} 0%, ${convert(\n `color(${gradients[1]} a(0))`\n )} 100%), radial-gradient(49.66% 49.63% at 78.65% 86.26%, ${gradients[2]} 0%, ${convert(\n `color(${gradients[2]} a(0))`\n )} 100%), ${baseColor}`;\n};\n\nconst SkillCard = (props, context) => {\n const {\n 'aria-label': ariaLabel,\n skillTitle,\n skillAriaLabel,\n buttonLabel,\n buttonAriaLabel,\n reviseLabel,\n reviseAriaLabel,\n onClick,\n isCustom = false\n } = props;\n const {skin} = context;\n const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n const buttonProps = {\n customStyle: {\n backgroundColor: convert(`color(${primarySkinColor} a(0.07))`),\n color: primarySkinColor,\n transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'\n },\n hoverBackgroundColor: primarySkinColor,\n hoverColor: '#FFFFFF',\n onClick,\n 'aria-label': buttonAriaLabel ? `${skillTitle}, ${buttonAriaLabel}` : skillTitle,\n label: buttonLabel,\n 'data-name': 'skill-card-button'\n };\n\n const titleBackgroundColor = useMemo(\n () => (isCustom ? '#128C72' : primarySkinColor),\n [isCustom, primarySkinColor]\n );\n\n const titleBackground = useMemo(\n () => getGradientBackground(titleBackgroundColor),\n [titleBackgroundColor]\n );\n\n return (\n <div className={style.skillCardWrapper} data-name=\"skill-card-wrapper\" aria-label={ariaLabel}>\n <div\n data-name=\"skill-title\"\n className={style.skillTitle}\n aria-label={skillAriaLabel || skillTitle}\n style={{\n background: titleBackground\n }}\n >\n {skillTitle}\n </div>\n <div data-name=\"card-content-wrapper\">\n <div\n className={style.questionReviseText}\n data-name=\"questions-to-revise-label\"\n aria-label={reviseAriaLabel || reviseLabel}\n >\n <QuestionIcon className={style.questionReviseIcon} width={16} height={16} />\n {reviseLabel}\n </div>\n <div className={style.buttonWrapper} data-name=\"button-wrapper\">\n <ButtonLink {...buttonProps} />\n </div>\n </div>\n </div>\n );\n};\n\nSkillCard.propTypes = propTypes;\n\nexport default SkillCard;\n"],"mappings":"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"}
|
|
@@ -18,12 +18,6 @@ declare namespace TitleAndCheckBoxWrapper {
|
|
|
18
18
|
'data-name': PropTypes.Requireable<string>;
|
|
19
19
|
titleSize: PropTypes.Requireable<string>;
|
|
20
20
|
subtitleSize: PropTypes.Requireable<string>;
|
|
21
|
-
icon: PropTypes.Requireable<PropTypes.InferProps<any>>;
|
|
22
|
-
tag: PropTypes.Requireable<PropTypes.InferProps<{
|
|
23
|
-
label: PropTypes.Requireable<string>;
|
|
24
|
-
type: PropTypes.Requireable<string>;
|
|
25
|
-
size: PropTypes.Requireable<string>;
|
|
26
|
-
}>>;
|
|
27
21
|
}>>;
|
|
28
22
|
const child: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
|
|
29
23
|
childType: PropTypes.Requireable<string>;
|
|
@@ -11,12 +11,6 @@ declare const TitleRadioWrapper: {
|
|
|
11
11
|
'data-name': import("prop-types").Requireable<string>;
|
|
12
12
|
titleSize: import("prop-types").Requireable<string>;
|
|
13
13
|
subtitleSize: import("prop-types").Requireable<string>;
|
|
14
|
-
icon: import("prop-types").Requireable<import("prop-types").InferProps<any>>;
|
|
15
|
-
tag: import("prop-types").Requireable<import("prop-types").InferProps<{
|
|
16
|
-
label: import("prop-types").Requireable<string>;
|
|
17
|
-
type: import("prop-types").Requireable<string>;
|
|
18
|
-
size: import("prop-types").Requireable<string>;
|
|
19
|
-
}>>;
|
|
20
14
|
}>>>;
|
|
21
15
|
name: import("prop-types").Requireable<string>;
|
|
22
16
|
checked: import("prop-types").Requireable<boolean>;
|