@coorpacademy/components 10.30.9 → 10.30.10-alpha.2
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/index.native.d.ts +14 -0
- package/es/atom/button/index.native.d.ts.map +1 -0
- package/es/atom/button/index.native.js +57 -0
- package/es/atom/button/index.native.js.map +1 -0
- package/es/atom/choice/index.native.js +2 -4
- package/es/atom/choice/index.native.js.map +1 -1
- package/es/atom/html/index.native.js +1 -3
- package/es/atom/html/index.native.js.map +1 -1
- package/es/atom/review-presentation/index.native.js +56 -60
- package/es/atom/review-presentation/index.native.js.map +1 -1
- package/es/atom/text/index.native.d.ts +2 -2
- package/es/atom/text/index.native.d.ts.map +1 -1
- package/es/atom/text/index.native.js.map +1 -1
- package/es/hoc/modal/select/index.native.js +3 -3
- package/es/hoc/modal/select/index.native.js.map +1 -1
- package/es/hoc/modal/select-item/index.native.js +13 -17
- package/es/hoc/modal/select-item/index.native.js.map +1 -1
- package/es/hoc/touchable/index.native.d.ts +2 -2
- package/es/hoc/touchable/index.native.d.ts.map +1 -1
- package/es/hoc/touchable/index.native.js +5 -2
- package/es/hoc/touchable/index.native.js.map +1 -1
- package/es/molecule/card-congrats/index.native.d.ts +5 -0
- package/es/molecule/card-congrats/index.native.d.ts.map +1 -0
- package/es/molecule/card-congrats/index.native.js +102 -0
- package/es/molecule/card-congrats/index.native.js.map +1 -0
- package/es/molecule/card-congrats/types.d.ts +15 -0
- package/es/molecule/card-congrats/types.d.ts.map +1 -0
- package/es/molecule/card-congrats/types.js +2 -0
- package/es/molecule/card-congrats/types.js.map +1 -0
- package/es/molecule/dashboard/cards-list/index.js +3 -7
- package/es/molecule/dashboard/cards-list/index.js.map +1 -1
- package/es/molecule/questions/free-text/index.native.js +26 -30
- package/es/molecule/questions/free-text/index.native.js.map +1 -1
- package/es/molecule/questions/mobile/slider/index.native.js +3 -5
- package/es/molecule/questions/mobile/slider/index.native.js.map +1 -1
- package/es/molecule/questions/mobile/template/index.native.js +1 -3
- package/es/molecule/questions/mobile/template/index.native.js.map +1 -1
- package/es/molecule/review-card-congrats/index.js +2 -2
- package/es/molecule/review-card-congrats/index.js.map +1 -1
- package/es/molecule/review-correction-popin/prop-types.d.ts +3 -0
- package/es/molecule/review-correction-popin/prop-types.d.ts.map +1 -1
- package/es/molecule/review-correction-popin/prop-types.js.map +1 -1
- package/es/organism/mooc-header/index.d.ts.map +1 -1
- package/es/organism/mooc-header/index.js +6 -6
- package/es/organism/mooc-header/index.js.map +1 -1
- package/es/organism/review-congrats/index.js +1 -3
- package/es/organism/review-congrats/index.js.map +1 -1
- package/es/organism/review-congrats/index.native.d.ts +5 -0
- package/es/organism/review-congrats/index.native.d.ts.map +1 -0
- package/es/organism/review-congrats/index.native.js +130 -0
- package/es/organism/review-congrats/index.native.js.map +1 -0
- package/es/organism/review-slide/index.native.d.ts.map +1 -1
- package/es/organism/review-slide/index.native.js +16 -61
- package/es/organism/review-slide/index.native.js.map +1 -1
- package/es/organism/review-slide/prop-types.d.ts +5 -0
- package/es/organism/review-slide/prop-types.d.ts.map +1 -1
- package/es/organism/review-slide/prop-types.js.map +1 -1
- package/es/organism/review-stacked-slides/index.native.d.ts.map +1 -1
- package/es/organism/review-stacked-slides/index.native.js +1 -2
- package/es/organism/review-stacked-slides/index.native.js.map +1 -1
- package/es/template/app-review/player/index.native.d.ts.map +1 -1
- package/es/template/app-review/player/index.native.js +8 -9
- package/es/template/app-review/player/index.native.js.map +1 -1
- package/lib/atom/button/index.native.d.ts +14 -0
- package/lib/atom/button/index.native.d.ts.map +1 -0
- package/lib/atom/button/index.native.js +73 -0
- package/lib/atom/button/index.native.js.map +1 -0
- package/lib/atom/choice/index.native.js +2 -4
- package/lib/atom/choice/index.native.js.map +1 -1
- package/lib/atom/html/index.native.js +1 -3
- package/lib/atom/html/index.native.js.map +1 -1
- package/lib/atom/review-presentation/index.native.js +56 -60
- package/lib/atom/review-presentation/index.native.js.map +1 -1
- package/lib/atom/text/index.native.d.ts +2 -2
- package/lib/atom/text/index.native.d.ts.map +1 -1
- package/lib/atom/text/index.native.js.map +1 -1
- package/lib/hoc/modal/select/index.native.js +3 -3
- package/lib/hoc/modal/select/index.native.js.map +1 -1
- package/lib/hoc/modal/select-item/index.native.js +13 -17
- package/lib/hoc/modal/select-item/index.native.js.map +1 -1
- package/lib/hoc/touchable/index.native.d.ts +2 -2
- package/lib/hoc/touchable/index.native.d.ts.map +1 -1
- package/lib/hoc/touchable/index.native.js +5 -2
- package/lib/hoc/touchable/index.native.js.map +1 -1
- package/lib/molecule/card-congrats/index.native.d.ts +5 -0
- package/lib/molecule/card-congrats/index.native.d.ts.map +1 -0
- package/lib/molecule/card-congrats/index.native.js +118 -0
- package/lib/molecule/card-congrats/index.native.js.map +1 -0
- package/lib/molecule/card-congrats/types.d.ts +15 -0
- package/lib/molecule/card-congrats/types.d.ts.map +1 -0
- package/lib/molecule/card-congrats/types.js +2 -0
- package/lib/molecule/card-congrats/types.js.map +1 -0
- package/lib/molecule/dashboard/cards-list/index.js +3 -7
- package/lib/molecule/dashboard/cards-list/index.js.map +1 -1
- package/lib/molecule/questions/free-text/index.native.js +26 -30
- package/lib/molecule/questions/free-text/index.native.js.map +1 -1
- package/lib/molecule/questions/mobile/slider/index.native.js +3 -5
- package/lib/molecule/questions/mobile/slider/index.native.js.map +1 -1
- package/lib/molecule/questions/mobile/template/index.native.js +1 -3
- package/lib/molecule/questions/mobile/template/index.native.js.map +1 -1
- package/lib/molecule/review-card-congrats/index.js.map +1 -1
- package/lib/molecule/review-correction-popin/prop-types.d.ts +3 -0
- package/lib/molecule/review-correction-popin/prop-types.d.ts.map +1 -1
- package/lib/molecule/review-correction-popin/prop-types.js.map +1 -1
- package/lib/organism/mooc-header/index.d.ts.map +1 -1
- package/lib/organism/mooc-header/index.js +6 -6
- package/lib/organism/mooc-header/index.js.map +1 -1
- package/lib/organism/review-congrats/index.js +1 -3
- package/lib/organism/review-congrats/index.js.map +1 -1
- package/lib/organism/review-congrats/index.native.d.ts +5 -0
- package/lib/organism/review-congrats/index.native.d.ts.map +1 -0
- package/lib/organism/review-congrats/index.native.js +149 -0
- package/lib/organism/review-congrats/index.native.js.map +1 -0
- package/lib/organism/review-slide/index.native.d.ts.map +1 -1
- package/lib/organism/review-slide/index.native.js +16 -61
- package/lib/organism/review-slide/index.native.js.map +1 -1
- package/lib/organism/review-slide/prop-types.d.ts +5 -0
- package/lib/organism/review-slide/prop-types.d.ts.map +1 -1
- package/lib/organism/review-slide/prop-types.js.map +1 -1
- package/lib/organism/review-stacked-slides/index.native.d.ts.map +1 -1
- package/lib/organism/review-stacked-slides/index.native.js +1 -2
- package/lib/organism/review-stacked-slides/index.native.js.map +1 -1
- package/lib/template/app-review/player/index.native.d.ts.map +1 -1
- package/lib/template/app-review/player/index.native.js +10 -10
- package/lib/template/app-review/player/index.native.js.map +1 -1
- package/package.json +4 -3
|
@@ -206,12 +206,10 @@ class CardsList extends _react.default.PureComponent {
|
|
|
206
206
|
}
|
|
207
207
|
|
|
208
208
|
setCardsWrapper(element) {
|
|
209
|
-
var _this$cardsWrapper, _this$cardsWrapper2;
|
|
210
|
-
|
|
211
209
|
this.cardsWrapper = element;
|
|
212
210
|
this.setState({
|
|
213
|
-
scrollLeft:
|
|
214
|
-
offsetWidth:
|
|
211
|
+
scrollLeft: this.cardsWrapper?.scrollLeft,
|
|
212
|
+
offsetWidth: this.cardsWrapper?.offsetWidth
|
|
215
213
|
});
|
|
216
214
|
}
|
|
217
215
|
|
|
@@ -224,9 +222,7 @@ class CardsList extends _react.default.PureComponent {
|
|
|
224
222
|
}
|
|
225
223
|
|
|
226
224
|
handleScroll() {
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
const scrollLeft = (_this$cardsWrapper3 = this.cardsWrapper) == null ? void 0 : _this$cardsWrapper3.scrollLeft;
|
|
225
|
+
const scrollLeft = this.cardsWrapper?.scrollLeft;
|
|
230
226
|
this.setState({
|
|
231
227
|
scrollLeft
|
|
232
228
|
});
|
|
@@ -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","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","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","dataName","titleStyle","titleLink","cardsView","key","leftArrowView","circle","left","rightArrowView","right","titleView","hasPages","showMoreView","showMoreBar","switchPagesView","pagingWrapper","wrapper","list","header","translate","arrayOf","shape","Card","protoTypes"],"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 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 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 static propTypes = {\n contentType: PropTypes.string,\n dataName: PropTypes.string,\n title: PropTypes.string,\n showMore: PropTypes.string,\n cards: PropTypes.arrayOf(PropTypes.shape(Card.protoTypes)),\n onScroll: PropTypes.func,\n onShowMore: PropTypes.func\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\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 handleResize() {\n const {cards = []} = this.props;\n this.updatePaginationState(cards);\n }\n\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 getScrollWidth(index) {\n const {cards = []} = this.props;\n const card = cards[index];\n return computeWidth(card);\n }\n\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 {title, showMore, cards, onShowMore, dataName, contentType} = 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 color={dark} className={style.left} width={10} height={10} />\n </div>\n );\n const rightArrowView = (\n <div className={style.circle} onClick={this.handleOnRight} data-name=\"card-list-right-arrow\">\n <ArrowRight color={dark} className={style.right} width={10} height={10} />\n </div>\n );\n\n const titleView = (\n <span data-name=\"title\" className={titleStyle} onClick={onShowMore}>\n <IconView contentType={contentType} />\n <span>{title}</span>\n </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 return (\n <div className={style.wrapper} data-name=\"cardsList\">\n <div className={style.list}>\n <div>\n <div data-name=\"header\" className={style.header}>\n {titleView}\n {switchPagesView}\n </div>\n <div className={style.cards} ref={this.setCardsWrapper}>\n {cardsView}\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default CardsList;\n"],"mappings":"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"}
|
|
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","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","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","dataName","titleStyle","titleLink","cardsView","key","leftArrowView","circle","left","rightArrowView","right","titleView","hasPages","showMoreView","showMoreBar","switchPagesView","pagingWrapper","wrapper","list","header","translate","arrayOf","shape","Card","protoTypes"],"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 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 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 static propTypes = {\n contentType: PropTypes.string,\n dataName: PropTypes.string,\n title: PropTypes.string,\n showMore: PropTypes.string,\n cards: PropTypes.arrayOf(PropTypes.shape(Card.protoTypes)),\n onScroll: PropTypes.func,\n onShowMore: PropTypes.func\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\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 handleResize() {\n const {cards = []} = this.props;\n this.updatePaginationState(cards);\n }\n\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 getScrollWidth(index) {\n const {cards = []} = this.props;\n const card = cards[index];\n return computeWidth(card);\n }\n\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 {title, showMore, cards, onShowMore, dataName, contentType} = 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 color={dark} className={style.left} width={10} height={10} />\n </div>\n );\n const rightArrowView = (\n <div className={style.circle} onClick={this.handleOnRight} data-name=\"card-list-right-arrow\">\n <ArrowRight color={dark} className={style.right} width={10} height={10} />\n </div>\n );\n\n const titleView = (\n <span data-name=\"title\" className={titleStyle} onClick={onShowMore}>\n <IconView contentType={contentType} />\n <span>{title}</span>\n </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 return (\n <div className={style.wrapper} data-name=\"cardsList\">\n <div className={style.list}>\n <div>\n <div data-name=\"header\" className={style.header}>\n {titleView}\n {switchPagesView}\n </div>\n <div className={style.cards} ref={this.setCardsWrapper}>\n {cardsView}\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default CardsList;\n"],"mappings":"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"}
|
|
@@ -19,36 +19,32 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
19
19
|
|
|
20
20
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
21
21
|
|
|
22
|
-
const createStyleSheet = (brandTheme, theme) => {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
width: '100%'
|
|
49
|
-
}
|
|
50
|
-
});
|
|
51
|
-
};
|
|
22
|
+
const createStyleSheet = (brandTheme, theme) => _reactNative.StyleSheet.create({
|
|
23
|
+
// eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread
|
|
24
|
+
input: _extends({
|
|
25
|
+
padding: theme.spacing.tiny,
|
|
26
|
+
borderColor: theme.colors.gray.lightMedium,
|
|
27
|
+
borderRadius: theme.radius.regular,
|
|
28
|
+
minWidth: 175,
|
|
29
|
+
marginHorizontal: 12,
|
|
30
|
+
paddingVertical: 16
|
|
31
|
+
}, _shadow.BOX_STYLE, {
|
|
32
|
+
backgroundColor: theme.colors.white
|
|
33
|
+
}),
|
|
34
|
+
text: {
|
|
35
|
+
borderColor: brandTheme?.colors?.primary,
|
|
36
|
+
color: brandTheme?.colors?.primary || theme.colors.gray.medium,
|
|
37
|
+
fontWeight: theme.fontWeight.bold,
|
|
38
|
+
fontSize: theme.fontSize.regular,
|
|
39
|
+
textAlign: 'center'
|
|
40
|
+
},
|
|
41
|
+
spaced: {
|
|
42
|
+
paddingVertical: theme.spacing.tiny
|
|
43
|
+
},
|
|
44
|
+
fullWitdh: {
|
|
45
|
+
width: '100%'
|
|
46
|
+
}
|
|
47
|
+
});
|
|
52
48
|
|
|
53
49
|
const logEvent = (eventName, analytics, questionType) => {
|
|
54
50
|
analytics && analytics.logEvent(eventName, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["createStyleSheet","brandTheme","theme","StyleSheet","create","input","padding","spacing","tiny","borderColor","colors","gray","lightMedium","borderRadius","radius","regular","minWidth","marginHorizontal","paddingVertical","BOX_STYLE","backgroundColor","white","text","primary","color","medium","fontWeight","bold","fontSize","textAlign","spaced","fullWitdh","width","logEvent","eventName","analytics","questionType","id","FreeText","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","translations","PLACEHOLDER_COLOR","fullWidth","testID","onChange","isDisabled","value","handleFocus","useCallback","ANALYTICS_EVENT_TYPE","INPUT_FOCUS","handleBlur","INPUT_BLUR","useEffect","_stylesheet","typeHere"],"sources":["../../../../src/molecule/questions/free-text/index.native.tsx"],"sourcesContent":["import {View, StyleSheet, TextInput, ViewStyle} from 'react-native';\nimport React, {useState, useEffect, useCallback} from 'react';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE, Analytics} from '../../../variables/analytics';\nimport {Theme} from '../../../variables/theme.native';\nimport {BOX_STYLE} from '../../../variables/shadow';\nimport {Brand} from '../../../variables/brand.native';\n\ntype QuestionType = 'basic' | 'template';\n\ninterface Props {\n fullWidth?: boolean;\n testID: string;\n questionType: QuestionType;\n analytics?: Analytics;\n onChange: (text: string) => void;\n isDisabled?: boolean;\n value?: string; // when value is undefined, TextInput acts as not controlled\n}\n\ntype StyleSheetType = {\n input: ViewStyle;\n text: ViewStyle;\n spaced: ViewStyle;\n fullWitdh: ViewStyle;\n};\n\nconst createStyleSheet = (brandTheme: Brand, theme: Theme): StyleSheetType =>\n StyleSheet.create({\n // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n input: {\n padding: theme.spacing.tiny,\n borderColor: theme.colors.gray.lightMedium,\n borderRadius: theme.radius.regular,\n minWidth: 175,\n marginHorizontal: 12,\n paddingVertical: 16,\n ...BOX_STYLE,\n backgroundColor: theme.colors.white\n },\n text: {\n borderColor: brandTheme?.colors?.primary,\n color: brandTheme?.colors?.primary || theme.colors.gray.medium,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.regular,\n textAlign: 'center'\n },\n spaced: {\n paddingVertical: theme.spacing.tiny\n },\n fullWitdh: {\n width: '100%'\n }\n });\n\nconst logEvent = (eventName: string, analytics: Analytics, questionType: QuestionType) => {\n analytics &&\n analytics.logEvent(eventName, {\n id: `question-input-text`,\n questionType\n });\n};\n\nconst FreeText = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {brandTheme, theme, translations} = templateContext;\n const PLACEHOLDER_COLOR = theme.colors.gray.medium;\n\n // ------------------------------------\n\n const {\n analytics,\n questionType,\n fullWidth = false,\n testID,\n onChange,\n isDisabled = false,\n value\n } = props;\n\n // ------------------------------------\n\n const handleFocus = useCallback(\n () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_FOCUS, analytics, questionType),\n [analytics, questionType]\n );\n\n const handleBlur = useCallback(\n () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_BLUR, analytics, questionType),\n [analytics, questionType]\n );\n\n // ------------------------------------\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(brandTheme, theme);\n setStylesheet(_stylesheet);\n }, [brandTheme, theme]);\n\n // ------------------------------------\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View style={[styleSheet.spaced, fullWidth && styleSheet.fullWitdh]}>\n <TextInput\n style={[styleSheet.input, styleSheet.text]}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onChangeText={onChange}\n placeholder={translations.typeHere}\n placeholderTextColor={PLACEHOLDER_COLOR}\n value={value}\n testID={testID}\n editable={!isDisabled}\n selectTextOnFocus={!isDisabled}\n />\n </View>\n );\n};\n\nexport default FreeText;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;AAsBA,MAAMA,gBAAgB,GAAG,CAACC,UAAD,EAAoBC,KAApB
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["createStyleSheet","brandTheme","theme","StyleSheet","create","input","padding","spacing","tiny","borderColor","colors","gray","lightMedium","borderRadius","radius","regular","minWidth","marginHorizontal","paddingVertical","BOX_STYLE","backgroundColor","white","text","primary","color","medium","fontWeight","bold","fontSize","textAlign","spaced","fullWitdh","width","logEvent","eventName","analytics","questionType","id","FreeText","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","translations","PLACEHOLDER_COLOR","fullWidth","testID","onChange","isDisabled","value","handleFocus","useCallback","ANALYTICS_EVENT_TYPE","INPUT_FOCUS","handleBlur","INPUT_BLUR","useEffect","_stylesheet","typeHere"],"sources":["../../../../src/molecule/questions/free-text/index.native.tsx"],"sourcesContent":["import {View, StyleSheet, TextInput, ViewStyle} from 'react-native';\nimport React, {useState, useEffect, useCallback} from 'react';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE, Analytics} from '../../../variables/analytics';\nimport {Theme} from '../../../variables/theme.native';\nimport {BOX_STYLE} from '../../../variables/shadow';\nimport {Brand} from '../../../variables/brand.native';\n\ntype QuestionType = 'basic' | 'template';\n\ninterface Props {\n fullWidth?: boolean;\n testID: string;\n questionType: QuestionType;\n analytics?: Analytics;\n onChange: (text: string) => void;\n isDisabled?: boolean;\n value?: string; // when value is undefined, TextInput acts as not controlled\n}\n\ntype StyleSheetType = {\n input: ViewStyle;\n text: ViewStyle;\n spaced: ViewStyle;\n fullWitdh: ViewStyle;\n};\n\nconst createStyleSheet = (brandTheme: Brand, theme: Theme): StyleSheetType =>\n StyleSheet.create({\n // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n input: {\n padding: theme.spacing.tiny,\n borderColor: theme.colors.gray.lightMedium,\n borderRadius: theme.radius.regular,\n minWidth: 175,\n marginHorizontal: 12,\n paddingVertical: 16,\n ...BOX_STYLE,\n backgroundColor: theme.colors.white\n },\n text: {\n borderColor: brandTheme?.colors?.primary,\n color: brandTheme?.colors?.primary || theme.colors.gray.medium,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.regular,\n textAlign: 'center'\n },\n spaced: {\n paddingVertical: theme.spacing.tiny\n },\n fullWitdh: {\n width: '100%'\n }\n });\n\nconst logEvent = (eventName: string, analytics: Analytics, questionType: QuestionType) => {\n analytics &&\n analytics.logEvent(eventName, {\n id: `question-input-text`,\n questionType\n });\n};\n\nconst FreeText = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {brandTheme, theme, translations} = templateContext;\n const PLACEHOLDER_COLOR = theme.colors.gray.medium;\n\n // ------------------------------------\n\n const {\n analytics,\n questionType,\n fullWidth = false,\n testID,\n onChange,\n isDisabled = false,\n value\n } = props;\n\n // ------------------------------------\n\n const handleFocus = useCallback(\n () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_FOCUS, analytics, questionType),\n [analytics, questionType]\n );\n\n const handleBlur = useCallback(\n () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_BLUR, analytics, questionType),\n [analytics, questionType]\n );\n\n // ------------------------------------\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(brandTheme, theme);\n setStylesheet(_stylesheet);\n }, [brandTheme, theme]);\n\n // ------------------------------------\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View style={[styleSheet.spaced, fullWidth && styleSheet.fullWitdh]}>\n <TextInput\n style={[styleSheet.input, styleSheet.text]}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onChangeText={onChange}\n placeholder={translations.typeHere}\n placeholderTextColor={PLACEHOLDER_COLOR}\n value={value}\n testID={testID}\n editable={!isDisabled}\n selectTextOnFocus={!isDisabled}\n />\n </View>\n );\n};\n\nexport default FreeText;\n"],"mappings":"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"}
|
|
@@ -67,8 +67,6 @@ const createStyleSheet = theme => _reactNative.StyleSheet.create({
|
|
|
67
67
|
});
|
|
68
68
|
|
|
69
69
|
const QuestionSlider = props => {
|
|
70
|
-
var _brandTheme$colors, _brandTheme$colors2, _brandTheme$colors3;
|
|
71
|
-
|
|
72
70
|
const {
|
|
73
71
|
step,
|
|
74
72
|
style,
|
|
@@ -104,7 +102,7 @@ const QuestionSlider = props => {
|
|
|
104
102
|
testID: testID
|
|
105
103
|
}, /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
106
104
|
style: [styleSheet.header, {
|
|
107
|
-
color: brandTheme
|
|
105
|
+
color: brandTheme?.colors?.primary
|
|
108
106
|
}],
|
|
109
107
|
testID: "slider-value"
|
|
110
108
|
}, value), /*#__PURE__*/_react.default.createElement(_reactNativeSlider.default, {
|
|
@@ -114,10 +112,10 @@ const QuestionSlider = props => {
|
|
|
114
112
|
maximumValue: max,
|
|
115
113
|
minimumValue: min,
|
|
116
114
|
onSlidingComplete: handleSlidingComplete,
|
|
117
|
-
minimumTrackTintColor: brandTheme
|
|
115
|
+
minimumTrackTintColor: brandTheme?.colors?.primary,
|
|
118
116
|
trackStyle: styleSheet.track,
|
|
119
117
|
thumbStyle: [styleSheet.thumb, {
|
|
120
|
-
borderColor: brandTheme
|
|
118
|
+
borderColor: brandTheme?.colors?.primary
|
|
121
119
|
}],
|
|
122
120
|
testID: "slider"
|
|
123
121
|
}), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","container","flex","paddingHorizontal","flexDirection","justifyContent","header","fontSize","fontWeight","bold","textAlign","textValue","color","colors","black","valuesContainer","leftValue","alignItems","rightValue","track","height","borderRadius","radius","button","thumb","BOX_STYLE","width","backgroundColor","borderWidth","QuestionSlider","props","step","style","min","max","unit","value","storeValue","onSlidingComplete","testID","templateContext","useTemplateContext","brandTheme","styleSheet","setStylesheet","useState","setValue","handleSlidingComplete","useCallback","useEffect","_stylesheet","primary","borderColor"],"sources":["../../../../../src/molecule/questions/mobile/slider/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect, useCallback} from 'react';\nimport {View, StyleSheet, ViewStyle, TextStyle} from 'react-native';\nimport Slider from '@coorpacademy/react-native-slider';\n\nimport {Theme} from '../../../../variables/theme.native';\nimport Text from '../../../../atom/text/index.native';\nimport {useTemplateContext} from '../../../../template/app-review/template-context';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\nexport type OnSlidingCompleteFunction = (value: number) => void;\n\nexport type Props = {\n min: number;\n max: number;\n value?: number;\n unit?: string;\n onSlidingComplete: OnSlidingCompleteFunction;\n style?: ViewStyle;\n step?: number;\n testID?: string;\n};\n\ntype StyleSheetType = {\n container: ViewStyle;\n header: TextStyle;\n textValue: TextStyle;\n valuesContainer: ViewStyle;\n leftValue: ViewStyle;\n rightValue: ViewStyle;\n track: ViewStyle;\n thumb: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n StyleSheet.create({\n container: {\n flex: 1,\n paddingHorizontal: 20,\n flexDirection: 'column',\n justifyContent: 'center'\n },\n header: {\n fontSize: 25,\n fontWeight: theme.fontWeight.bold,\n textAlign: 'center'\n },\n textValue: {\n fontSize: 15,\n color: theme.colors.black,\n fontWeight: theme.fontWeight.bold,\n textAlign: 'center'\n },\n valuesContainer: {\n flexDirection: 'row',\n justifyContent: 'space-around'\n },\n leftValue: {\n flex: 1,\n alignItems: 'flex-start'\n },\n rightValue: {\n flex: 1,\n alignItems: 'flex-end'\n },\n track: {\n height: 10,\n borderRadius: theme.radius.button\n },\n thumb: {\n ...BOX_STYLE,\n width: 30,\n height: 30,\n borderRadius: 30 / 2,\n backgroundColor: 'white',\n borderWidth: 1\n }\n });\n\nconst QuestionSlider = (props: Props) => {\n const {\n step,\n style,\n min,\n max,\n unit = '',\n value: storeValue = 0,\n onSlidingComplete,\n testID\n } = props;\n const templateContext = useTemplateContext();\n const {brandTheme, theme} = templateContext;\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const [value, setValue] = useState<number>(storeValue);\n\n const handleSlidingComplete = useCallback(() => {\n onSlidingComplete(value);\n }, [onSlidingComplete, value]);\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View style={[styleSheet.container, style]} testID={testID}>\n <Text style={[styleSheet.header, {color: brandTheme?.colors?.primary}]} testID=\"slider-value\">\n {value}\n </Text>\n <Slider\n step={step || 1}\n value={value}\n onValueChange={setValue}\n maximumValue={max}\n minimumValue={min}\n onSlidingComplete={handleSlidingComplete}\n minimumTrackTintColor={brandTheme?.colors?.primary}\n trackStyle={styleSheet.track}\n thumbStyle={[styleSheet.thumb, {borderColor: brandTheme?.colors?.primary}]}\n testID=\"slider\"\n />\n <View style={styleSheet.valuesContainer} testID=\"slider-values-container\">\n <View style={styleSheet.leftValue}>\n <Text style={styleSheet.textValue} testID=\"slider-min-value\">\n {`${min} ${unit}`}\n </Text>\n </View>\n <View style={styleSheet.rightValue}>\n <Text style={styleSheet.textValue} testID=\"slider-max-value\">\n {`${max} ${unit}`}\n </Text>\n </View>\n </View>\n </View>\n );\n};\n\nexport default QuestionSlider;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AAGA;;AACA;;AACA;;;;;;;;;;AA0BA,MAAMA,gBAAgB,GAAIC,KAAD,IACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,SAAS,EAAE;IACTC,IAAI,EAAE,CADG;IAETC,iBAAiB,EAAE,EAFV;IAGTC,aAAa,EAAE,QAHN;IAITC,cAAc,EAAE;EAJP,CADK;EAOhBC,MAAM,EAAE;IACNC,QAAQ,EAAE,EADJ;IAENC,UAAU,EAAEV,KAAK,CAACU,UAAN,CAAiBC,IAFvB;IAGNC,SAAS,EAAE;EAHL,CAPQ;EAYhBC,SAAS,EAAE;IACTJ,QAAQ,EAAE,EADD;IAETK,KAAK,EAAEd,KAAK,CAACe,MAAN,CAAaC,KAFX;IAGTN,UAAU,EAAEV,KAAK,CAACU,UAAN,CAAiBC,IAHpB;IAITC,SAAS,EAAE;EAJF,CAZK;EAkBhBK,eAAe,EAAE;IACfX,aAAa,EAAE,KADA;IAEfC,cAAc,EAAE;EAFD,CAlBD;EAsBhBW,SAAS,EAAE;IACTd,IAAI,EAAE,CADG;IAETe,UAAU,EAAE;EAFH,CAtBK;EA0BhBC,UAAU,EAAE;IACVhB,IAAI,EAAE,CADI;IAEVe,UAAU,EAAE;EAFF,CA1BI;EA8BhBE,KAAK,EAAE;IACLC,MAAM,EAAE,EADH;IAELC,YAAY,EAAEvB,KAAK,CAACwB,MAAN,CAAaC;EAFtB,CA9BS;EAkChBC,KAAK,eACAC,iBADA;IAEHC,KAAK,EAAE,EAFJ;IAGHN,MAAM,EAAE,EAHL;IAIHC,YAAY,EAAE,KAAK,CAJhB;IAKHM,eAAe,EAAE,OALd;IAMHC,WAAW,EAAE;EANV;AAlCW,CAAlB,CADF;;AA6CA,MAAMC,cAAc,GAAIC,KAAD,IAAkB;
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","container","flex","paddingHorizontal","flexDirection","justifyContent","header","fontSize","fontWeight","bold","textAlign","textValue","color","colors","black","valuesContainer","leftValue","alignItems","rightValue","track","height","borderRadius","radius","button","thumb","BOX_STYLE","width","backgroundColor","borderWidth","QuestionSlider","props","step","style","min","max","unit","value","storeValue","onSlidingComplete","testID","templateContext","useTemplateContext","brandTheme","styleSheet","setStylesheet","useState","setValue","handleSlidingComplete","useCallback","useEffect","_stylesheet","primary","borderColor"],"sources":["../../../../../src/molecule/questions/mobile/slider/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect, useCallback} from 'react';\nimport {View, StyleSheet, ViewStyle, TextStyle} from 'react-native';\nimport Slider from '@coorpacademy/react-native-slider';\n\nimport {Theme} from '../../../../variables/theme.native';\nimport Text from '../../../../atom/text/index.native';\nimport {useTemplateContext} from '../../../../template/app-review/template-context';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\nexport type OnSlidingCompleteFunction = (value: number) => void;\n\nexport type Props = {\n min: number;\n max: number;\n value?: number;\n unit?: string;\n onSlidingComplete: OnSlidingCompleteFunction;\n style?: ViewStyle;\n step?: number;\n testID?: string;\n};\n\ntype StyleSheetType = {\n container: ViewStyle;\n header: TextStyle;\n textValue: TextStyle;\n valuesContainer: ViewStyle;\n leftValue: ViewStyle;\n rightValue: ViewStyle;\n track: ViewStyle;\n thumb: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n StyleSheet.create({\n container: {\n flex: 1,\n paddingHorizontal: 20,\n flexDirection: 'column',\n justifyContent: 'center'\n },\n header: {\n fontSize: 25,\n fontWeight: theme.fontWeight.bold,\n textAlign: 'center'\n },\n textValue: {\n fontSize: 15,\n color: theme.colors.black,\n fontWeight: theme.fontWeight.bold,\n textAlign: 'center'\n },\n valuesContainer: {\n flexDirection: 'row',\n justifyContent: 'space-around'\n },\n leftValue: {\n flex: 1,\n alignItems: 'flex-start'\n },\n rightValue: {\n flex: 1,\n alignItems: 'flex-end'\n },\n track: {\n height: 10,\n borderRadius: theme.radius.button\n },\n thumb: {\n ...BOX_STYLE,\n width: 30,\n height: 30,\n borderRadius: 30 / 2,\n backgroundColor: 'white',\n borderWidth: 1\n }\n });\n\nconst QuestionSlider = (props: Props) => {\n const {\n step,\n style,\n min,\n max,\n unit = '',\n value: storeValue = 0,\n onSlidingComplete,\n testID\n } = props;\n const templateContext = useTemplateContext();\n const {brandTheme, theme} = templateContext;\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const [value, setValue] = useState<number>(storeValue);\n\n const handleSlidingComplete = useCallback(() => {\n onSlidingComplete(value);\n }, [onSlidingComplete, value]);\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View style={[styleSheet.container, style]} testID={testID}>\n <Text style={[styleSheet.header, {color: brandTheme?.colors?.primary}]} testID=\"slider-value\">\n {value}\n </Text>\n <Slider\n step={step || 1}\n value={value}\n onValueChange={setValue}\n maximumValue={max}\n minimumValue={min}\n onSlidingComplete={handleSlidingComplete}\n minimumTrackTintColor={brandTheme?.colors?.primary}\n trackStyle={styleSheet.track}\n thumbStyle={[styleSheet.thumb, {borderColor: brandTheme?.colors?.primary}]}\n testID=\"slider\"\n />\n <View style={styleSheet.valuesContainer} testID=\"slider-values-container\">\n <View style={styleSheet.leftValue}>\n <Text style={styleSheet.textValue} testID=\"slider-min-value\">\n {`${min} ${unit}`}\n </Text>\n </View>\n <View style={styleSheet.rightValue}>\n <Text style={styleSheet.textValue} testID=\"slider-max-value\">\n {`${max} ${unit}`}\n </Text>\n </View>\n </View>\n </View>\n );\n};\n\nexport default QuestionSlider;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AAGA;;AACA;;AACA;;;;;;;;;;AA0BA,MAAMA,gBAAgB,GAAIC,KAAD,IACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,SAAS,EAAE;IACTC,IAAI,EAAE,CADG;IAETC,iBAAiB,EAAE,EAFV;IAGTC,aAAa,EAAE,QAHN;IAITC,cAAc,EAAE;EAJP,CADK;EAOhBC,MAAM,EAAE;IACNC,QAAQ,EAAE,EADJ;IAENC,UAAU,EAAEV,KAAK,CAACU,UAAN,CAAiBC,IAFvB;IAGNC,SAAS,EAAE;EAHL,CAPQ;EAYhBC,SAAS,EAAE;IACTJ,QAAQ,EAAE,EADD;IAETK,KAAK,EAAEd,KAAK,CAACe,MAAN,CAAaC,KAFX;IAGTN,UAAU,EAAEV,KAAK,CAACU,UAAN,CAAiBC,IAHpB;IAITC,SAAS,EAAE;EAJF,CAZK;EAkBhBK,eAAe,EAAE;IACfX,aAAa,EAAE,KADA;IAEfC,cAAc,EAAE;EAFD,CAlBD;EAsBhBW,SAAS,EAAE;IACTd,IAAI,EAAE,CADG;IAETe,UAAU,EAAE;EAFH,CAtBK;EA0BhBC,UAAU,EAAE;IACVhB,IAAI,EAAE,CADI;IAEVe,UAAU,EAAE;EAFF,CA1BI;EA8BhBE,KAAK,EAAE;IACLC,MAAM,EAAE,EADH;IAELC,YAAY,EAAEvB,KAAK,CAACwB,MAAN,CAAaC;EAFtB,CA9BS;EAkChBC,KAAK,eACAC,iBADA;IAEHC,KAAK,EAAE,EAFJ;IAGHN,MAAM,EAAE,EAHL;IAIHC,YAAY,EAAE,KAAK,CAJhB;IAKHM,eAAe,EAAE,OALd;IAMHC,WAAW,EAAE;EANV;AAlCW,CAAlB,CADF;;AA6CA,MAAMC,cAAc,GAAIC,KAAD,IAAkB;EACvC,MAAM;IACJC,IADI;IAEJC,KAFI;IAGJC,GAHI;IAIJC,GAJI;IAKJC,IAAI,GAAG,EALH;IAMJC,KAAK,EAAEC,UAAU,GAAG,CANhB;IAOJC,iBAPI;IAQJC;EARI,IASFT,KATJ;EAUA,MAAMU,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EACA,MAAM;IAACC,UAAD;IAAa5C;EAAb,IAAsB0C,eAA5B;EACA,MAAM,CAACG,UAAD,EAAaC,aAAb,IAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAApC;EACA,MAAM,CAACT,KAAD,EAAQU,QAAR,IAAoB,IAAAD,eAAA,EAAiBR,UAAjB,CAA1B;EAEA,MAAMU,qBAAqB,GAAG,IAAAC,kBAAA,EAAY,MAAM;IAC9CV,iBAAiB,CAACF,KAAD,CAAjB;EACD,CAF6B,EAE3B,CAACE,iBAAD,EAAoBF,KAApB,CAF2B,CAA9B;EAIA,IAAAa,gBAAA,EAAU,MAAM;IACd,MAAMC,WAAW,GAAGrD,gBAAgB,CAACC,KAAD,CAApC;;IACA8C,aAAa,CAACM,WAAD,CAAb;EACD,CAHD,EAGG,CAACpD,KAAD,CAHH;;EAKA,IAAI,CAAC6C,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACA,UAAU,CAAC1C,SAAZ,EAAuB+B,KAAvB,CAAb;IAA4C,MAAM,EAAEO;EAApD,gBACE,6BAAC,cAAD;IAAM,KAAK,EAAE,CAACI,UAAU,CAACrC,MAAZ,EAAoB;MAACM,KAAK,EAAE8B,UAAU,EAAE7B,MAAZ,EAAoBsC;IAA5B,CAApB,CAAb;IAAwE,MAAM,EAAC;EAA/E,GACGf,KADH,CADF,eAIE,6BAAC,0BAAD;IACE,IAAI,EAAEL,IAAI,IAAI,CADhB;IAEE,KAAK,EAAEK,KAFT;IAGE,aAAa,EAAEU,QAHjB;IAIE,YAAY,EAAEZ,GAJhB;IAKE,YAAY,EAAED,GALhB;IAME,iBAAiB,EAAEc,qBANrB;IAOE,qBAAqB,EAAEL,UAAU,EAAE7B,MAAZ,EAAoBsC,OAP7C;IAQE,UAAU,EAAER,UAAU,CAACxB,KARzB;IASE,UAAU,EAAE,CAACwB,UAAU,CAACnB,KAAZ,EAAmB;MAAC4B,WAAW,EAAEV,UAAU,EAAE7B,MAAZ,EAAoBsC;IAAlC,CAAnB,CATd;IAUE,MAAM,EAAC;EAVT,EAJF,eAgBE,6BAAC,iBAAD;IAAM,KAAK,EAAER,UAAU,CAAC5B,eAAxB;IAAyC,MAAM,EAAC;EAAhD,gBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE4B,UAAU,CAAC3B;EAAxB,gBACE,6BAAC,cAAD;IAAM,KAAK,EAAE2B,UAAU,CAAChC,SAAxB;IAAmC,MAAM,EAAC;EAA1C,GACI,GAAEsB,GAAI,IAAGE,IAAK,EADlB,CADF,CADF,eAME,6BAAC,iBAAD;IAAM,KAAK,EAAEQ,UAAU,CAACzB;EAAxB,gBACE,6BAAC,cAAD;IAAM,KAAK,EAAEyB,UAAU,CAAChC,SAAxB;IAAmC,MAAM,EAAC;EAA1C,GACI,GAAEuB,GAAI,IAAGC,IAAK,EADlB,CADF,CANF,CAhBF,CADF;AA+BD,CA5DD;;eA8DeN,c"}
|
|
@@ -66,8 +66,6 @@ const createStyleSheet = theme => ({
|
|
|
66
66
|
});
|
|
67
67
|
|
|
68
68
|
const Item = props => {
|
|
69
|
-
var _brandTheme$colors;
|
|
70
|
-
|
|
71
69
|
const {
|
|
72
70
|
part,
|
|
73
71
|
index,
|
|
@@ -89,7 +87,7 @@ const Item = props => {
|
|
|
89
87
|
const id = `question-part-${index + 1}`;
|
|
90
88
|
const isFocused = focusedSelectId === id;
|
|
91
89
|
const coloredText = brandTheme && {
|
|
92
|
-
color:
|
|
90
|
+
color: brandTheme.colors?.primary
|
|
93
91
|
};
|
|
94
92
|
|
|
95
93
|
if (part.type === 'answerField' && inputNames.includes(part.value)) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","container","width","flexDirection","flexWrap","justifyContent","alignItems","spaced","paddingVertical","spacing","tiny","htmlText","color","colors","black","fontWeight","bold","lineHeight","selectInput","padding","borderRadius","radius","regular","minWidth","marginHorizontal","BOX_STYLE","backgroundColor","white","selectText","gray","medium","fontSize","textAlign","Item","props","part","index","isDisabled","focusedSelectId","choices","onInputChange","handleBlur","handleFocus","styles","templateContext","useTemplateContext","brandTheme","translations","inputNames","map","choice","name","id","isFocused","coloredText","primary","type","includes","value","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectInputStyle","push","selectTextStyle","items","selectAnAnswer","trim","QuestionTemplate","template","styleSheet","setStylesheet","useState","useEffect","_stylesheet","parts","parseTemplateString"],"sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {TextStyle, View, ViewStyle} from 'react-native';\n\nimport trim from 'lodash/fp/trim';\n\nimport Html from '../../../../atom/html/index.native';\nimport Select from '../../../../atom/select-modal/index.native';\nimport Space from '../../../../atom/space/index.native';\nimport type {TemplateListOfChoices, TemplateTextChoice} from '../../types';\nimport FreeText from '../../free-text/index.native';\nimport {\n FocusedSelectId,\n HandleBlur,\n HandleFocus,\n useTemplateContext\n} from '../../../../template/app-review/template-context';\nimport {Theme} from '../../../../variables/theme.native';\nimport parseTemplateString from '../../../../util/parse-template-string';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\ntype StyleSheetType = {\n container: ViewStyle;\n spaced: ViewStyle;\n htmlText: TextStyle;\n selectInput: ViewStyle;\n selectText: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType => ({\n container: {\n width: '100%',\n flexDirection: 'row',\n flexWrap: 'wrap',\n justifyContent: 'center',\n alignItems: 'center'\n },\n spaced: {\n paddingVertical: theme.spacing.tiny\n },\n htmlText: {\n color: theme.colors.black,\n fontWeight: theme.fontWeight.bold,\n lineHeight: 25\n },\n // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n selectInput: {\n padding: theme.spacing.tiny,\n borderRadius: theme.radius.regular,\n minWidth: 175,\n marginHorizontal: 12,\n paddingVertical: 16,\n ...BOX_STYLE,\n backgroundColor: theme.colors.white\n },\n selectText: {\n color: theme.colors.gray.medium,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.regular,\n textAlign: 'center'\n }\n});\n\ntype TemplatePart = {\n type: 'string' | 'answerField';\n value: string;\n};\n\ntype ItemProps = {\n part: TemplatePart;\n choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n index: number;\n isDisabled?: boolean;\n onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n focusedSelectId: FocusedSelectId;\n handleBlur: HandleBlur;\n handleFocus: HandleFocus;\n styles: StyleSheetType;\n};\n\nconst Item = (props: ItemProps) => {\n const {\n part,\n index,\n isDisabled = false,\n focusedSelectId,\n choices,\n onInputChange,\n handleBlur,\n handleFocus,\n styles\n } = props;\n\n const templateContext = useTemplateContext();\n const {theme, brandTheme, translations} = templateContext;\n\n const inputNames = choices.map(choice => choice.name);\n const id = `question-part-${index + 1}`;\n const isFocused = focusedSelectId === id;\n\n const coloredText = brandTheme && {\n color: brandTheme.colors?.primary\n };\n\n if (part.type === 'answerField' && inputNames.includes(part.value)) {\n const choiceIndex = choices.findIndex(choice => choice.name === part.value);\n const choice = choices[choiceIndex];\n const {value} = choice;\n\n if (!choice || !choice.type || !choice.name) {\n return null;\n }\n\n const disabledSuffix = isDisabled ? '-disabled' : '';\n const selectedSuffix = value ? '-selected' : '';\n\n const handleInputChange =\n (_item: TemplateTextChoice | TemplateListOfChoices) => (_value: string) =>\n onInputChange(_item, _value);\n\n if (choice.type === 'text') {\n return (\n <View style={styles.spaced} testID={id}>\n <FreeText\n key={id}\n isDisabled={isDisabled}\n onChange={handleInputChange(choice)}\n value={value}\n testID={`${id}-text${selectedSuffix}${disabledSuffix}`}\n questionType=\"template\"\n />\n </View>\n );\n }\n\n const selectInputStyle: TextStyle[] = [styles.selectInput];\n if (coloredText && value) {\n selectInputStyle.push(coloredText);\n }\n\n const selectTextStyle: TextStyle[] = [styles.selectText];\n if (coloredText && value) {\n selectTextStyle.push(coloredText);\n }\n\n if (choice.type === 'select') {\n return (\n <View style={styles.spaced} testID={id}>\n <Select\n isDisabled={isDisabled}\n questionType=\"template\"\n values={choice.items}\n value={value}\n placeholder={translations.selectAnAnswer}\n isFocused={isFocused}\n onBlur={handleBlur}\n onFocus={handleFocus(id)}\n onChange={handleInputChange(choice)}\n textStyle={selectTextStyle}\n style={selectInputStyle}\n analyticsID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n testID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n />\n </View>\n );\n }\n }\n\n return (\n <Html key={id} fontSize={theme.fontSize.regular} testID={id} style={styles.htmlText}>\n {trim(part.value || '')}\n </Html>\n );\n};\n\nexport type Props = {\n isDisabled?: boolean;\n template: string;\n choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n focusedSelectId: FocusedSelectId;\n handleBlur: HandleBlur;\n handleFocus: HandleFocus;\n};\n\nconst QuestionTemplate = (props: Props) => {\n const {\n template,\n onInputChange,\n choices,\n handleBlur,\n handleFocus,\n focusedSelectId,\n isDisabled = false\n } = props;\n\n const templateContext = useTemplateContext();\n const {theme} = templateContext;\n\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n if (!template || !styleSheet) {\n return null;\n }\n\n const parts: TemplatePart[] = parseTemplateString(template);\n\n return (\n <View style={styleSheet.container} testID=\"question-template\">\n {parts.map((part, id) => (\n <View key={`question-part-${id}`} style={{flexDirection: 'row'}}>\n <Item\n part={part}\n choices={choices}\n index={id}\n focusedSelectId={focusedSelectId}\n isDisabled={isDisabled}\n handleBlur={handleBlur}\n handleFocus={handleFocus}\n onInputChange={onInputChange}\n styles={styleSheet}\n />\n <Space type=\"micro\" />\n </View>\n ))}\n </View>\n );\n};\n\nexport default QuestionTemplate;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","container","width","flexDirection","flexWrap","justifyContent","alignItems","spaced","paddingVertical","spacing","tiny","htmlText","color","colors","black","fontWeight","bold","lineHeight","selectInput","padding","borderRadius","radius","regular","minWidth","marginHorizontal","BOX_STYLE","backgroundColor","white","selectText","gray","medium","fontSize","textAlign","Item","props","part","index","isDisabled","focusedSelectId","choices","onInputChange","handleBlur","handleFocus","styles","templateContext","useTemplateContext","brandTheme","translations","inputNames","map","choice","name","id","isFocused","coloredText","primary","type","includes","value","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectInputStyle","push","selectTextStyle","items","selectAnAnswer","trim","QuestionTemplate","template","styleSheet","setStylesheet","useState","useEffect","_stylesheet","parts","parseTemplateString"],"sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {TextStyle, View, ViewStyle} from 'react-native';\n\nimport trim from 'lodash/fp/trim';\n\nimport Html from '../../../../atom/html/index.native';\nimport Select from '../../../../atom/select-modal/index.native';\nimport Space from '../../../../atom/space/index.native';\nimport type {TemplateListOfChoices, TemplateTextChoice} from '../../types';\nimport FreeText from '../../free-text/index.native';\nimport {\n FocusedSelectId,\n HandleBlur,\n HandleFocus,\n useTemplateContext\n} from '../../../../template/app-review/template-context';\nimport {Theme} from '../../../../variables/theme.native';\nimport parseTemplateString from '../../../../util/parse-template-string';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\ntype StyleSheetType = {\n container: ViewStyle;\n spaced: ViewStyle;\n htmlText: TextStyle;\n selectInput: ViewStyle;\n selectText: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType => ({\n container: {\n width: '100%',\n flexDirection: 'row',\n flexWrap: 'wrap',\n justifyContent: 'center',\n alignItems: 'center'\n },\n spaced: {\n paddingVertical: theme.spacing.tiny\n },\n htmlText: {\n color: theme.colors.black,\n fontWeight: theme.fontWeight.bold,\n lineHeight: 25\n },\n // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n selectInput: {\n padding: theme.spacing.tiny,\n borderRadius: theme.radius.regular,\n minWidth: 175,\n marginHorizontal: 12,\n paddingVertical: 16,\n ...BOX_STYLE,\n backgroundColor: theme.colors.white\n },\n selectText: {\n color: theme.colors.gray.medium,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.regular,\n textAlign: 'center'\n }\n});\n\ntype TemplatePart = {\n type: 'string' | 'answerField';\n value: string;\n};\n\ntype ItemProps = {\n part: TemplatePart;\n choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n index: number;\n isDisabled?: boolean;\n onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n focusedSelectId: FocusedSelectId;\n handleBlur: HandleBlur;\n handleFocus: HandleFocus;\n styles: StyleSheetType;\n};\n\nconst Item = (props: ItemProps) => {\n const {\n part,\n index,\n isDisabled = false,\n focusedSelectId,\n choices,\n onInputChange,\n handleBlur,\n handleFocus,\n styles\n } = props;\n\n const templateContext = useTemplateContext();\n const {theme, brandTheme, translations} = templateContext;\n\n const inputNames = choices.map(choice => choice.name);\n const id = `question-part-${index + 1}`;\n const isFocused = focusedSelectId === id;\n\n const coloredText = brandTheme && {\n color: brandTheme.colors?.primary\n };\n\n if (part.type === 'answerField' && inputNames.includes(part.value)) {\n const choiceIndex = choices.findIndex(choice => choice.name === part.value);\n const choice = choices[choiceIndex];\n const {value} = choice;\n\n if (!choice || !choice.type || !choice.name) {\n return null;\n }\n\n const disabledSuffix = isDisabled ? '-disabled' : '';\n const selectedSuffix = value ? '-selected' : '';\n\n const handleInputChange =\n (_item: TemplateTextChoice | TemplateListOfChoices) => (_value: string) =>\n onInputChange(_item, _value);\n\n if (choice.type === 'text') {\n return (\n <View style={styles.spaced} testID={id}>\n <FreeText\n key={id}\n isDisabled={isDisabled}\n onChange={handleInputChange(choice)}\n value={value}\n testID={`${id}-text${selectedSuffix}${disabledSuffix}`}\n questionType=\"template\"\n />\n </View>\n );\n }\n\n const selectInputStyle: TextStyle[] = [styles.selectInput];\n if (coloredText && value) {\n selectInputStyle.push(coloredText);\n }\n\n const selectTextStyle: TextStyle[] = [styles.selectText];\n if (coloredText && value) {\n selectTextStyle.push(coloredText);\n }\n\n if (choice.type === 'select') {\n return (\n <View style={styles.spaced} testID={id}>\n <Select\n isDisabled={isDisabled}\n questionType=\"template\"\n values={choice.items}\n value={value}\n placeholder={translations.selectAnAnswer}\n isFocused={isFocused}\n onBlur={handleBlur}\n onFocus={handleFocus(id)}\n onChange={handleInputChange(choice)}\n textStyle={selectTextStyle}\n style={selectInputStyle}\n analyticsID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n testID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n />\n </View>\n );\n }\n }\n\n return (\n <Html key={id} fontSize={theme.fontSize.regular} testID={id} style={styles.htmlText}>\n {trim(part.value || '')}\n </Html>\n );\n};\n\nexport type Props = {\n isDisabled?: boolean;\n template: string;\n choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n focusedSelectId: FocusedSelectId;\n handleBlur: HandleBlur;\n handleFocus: HandleFocus;\n};\n\nconst QuestionTemplate = (props: Props) => {\n const {\n template,\n onInputChange,\n choices,\n handleBlur,\n handleFocus,\n focusedSelectId,\n isDisabled = false\n } = props;\n\n const templateContext = useTemplateContext();\n const {theme} = templateContext;\n\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n if (!template || !styleSheet) {\n return null;\n }\n\n const parts: TemplatePart[] = parseTemplateString(template);\n\n return (\n <View style={styleSheet.container} testID=\"question-template\">\n {parts.map((part, id) => (\n <View key={`question-part-${id}`} style={{flexDirection: 'row'}}>\n <Item\n part={part}\n choices={choices}\n index={id}\n focusedSelectId={focusedSelectId}\n isDisabled={isDisabled}\n handleBlur={handleBlur}\n handleFocus={handleFocus}\n onInputChange={onInputChange}\n styles={styleSheet}\n />\n <Space type=\"micro\" />\n </View>\n ))}\n </View>\n );\n};\n\nexport default QuestionTemplate;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["setAnimations","setIsAnimationVisible","setIsAnimated","ReviewCardCongrats","props","ariaLabel","dataName","animationLottie","cardType","iconAriaLabel","className","reviewCardTitle","reviewCardValue","rankSuffix","timerAnimation","isAnimationVisible","useState","isAnimated","useEffect","timer","setTimeout","clearTimeout","wrapperClassName","classnames","style","cardContainer","cardStar","cardRank","mainIcon","wrapperLottie","ie11Backup","title","textContainerStar","textContainerRank","iconRank","textStar","textRank","EASE_OUT_CUBIC","progress","iconStar","propTypes"],"sources":["../../../src/molecule/review-card-congrats/index.js"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport classnames from 'classnames';\nimport {pipe, round, parseInt as _parseInt, multiply} from 'lodash/fp';\nimport {\n NovaCompositionCoorpacademyStar as StarIcon,\n NovaSolidVoteRewardsRewardsBadge5 as RankIcon\n} from '@coorpacademy/nova-icons';\nimport
|
|
1
|
+
{"version":3,"file":"index.js","names":["setAnimations","setIsAnimationVisible","setIsAnimated","ReviewCardCongrats","props","ariaLabel","dataName","animationLottie","cardType","iconAriaLabel","className","reviewCardTitle","reviewCardValue","rankSuffix","timerAnimation","isAnimationVisible","useState","isAnimated","useEffect","timer","setTimeout","clearTimeout","wrapperClassName","classnames","style","cardContainer","cardStar","cardRank","mainIcon","wrapperLottie","ie11Backup","title","textContainerStar","textContainerRank","iconRank","textStar","textRank","EASE_OUT_CUBIC","progress","iconStar","propTypes"],"sources":["../../../src/molecule/review-card-congrats/index.js"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport classnames from 'classnames';\nimport {pipe, round, parseInt as _parseInt, multiply} from 'lodash/fp';\nimport {\n NovaCompositionCoorpacademyStar as StarIcon,\n NovaSolidVoteRewardsRewardsBadge5 as RankIcon\n} from '@coorpacademy/nova-icons';\nimport LottieWrapper from '../../atom/lottie-wrapper';\nimport Animation, {EASE_OUT_CUBIC} from '../../hoc/animation';\nimport AnimationScheduler from '../../hoc/animation-scheduler';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nexport const setAnimations = (setIsAnimationVisible, setIsAnimated) => () => {\n setIsAnimationVisible('play');\n setIsAnimated(true);\n};\n\nconst ReviewCardCongrats = props => {\n const {\n 'aria-label': ariaLabel,\n 'data-name': dataName,\n animationLottie,\n cardType,\n iconAriaLabel,\n className,\n reviewCardTitle,\n reviewCardValue,\n rankSuffix,\n timerAnimation\n } = props;\n\n const [isAnimationVisible, setIsAnimationVisible] = useState('loading');\n const [isAnimated, setIsAnimated] = useState(false);\n\n useEffect(() => {\n let timer;\n // istanbul ignore else\n if (!isAnimationVisible || !isAnimated) {\n timer = setTimeout(setAnimations(setIsAnimationVisible, setIsAnimated), timerAnimation);\n }\n return () => timer && clearTimeout(timer);\n }, [timerAnimation, isAnimated, isAnimationVisible]);\n\n const wrapperClassName = classnames(\n className,\n style.cardContainer,\n cardType === 'card-star' ? style.cardStar : style.cardRank\n );\n\n return (\n <div className={wrapperClassName} aria-label={ariaLabel} data-name={dataName}>\n <div className={style.mainIcon}>\n <LottieWrapper\n {...animationLottie}\n loop={false}\n animationControl={isAnimationVisible}\n autoplay={false}\n data-name=\"lottie-wrapper\"\n className={style.wrapperLottie}\n backupImageClassName={style.ie11Backup}\n />\n </div>\n <div className={style.title}>{reviewCardTitle}</div>\n <div className={cardType === 'card-star' ? style.textContainerStar : style.textContainerRank}>\n {cardType === 'card-rank' ? (\n <RankIcon className={style.iconRank} width={40} height={40} aria-label={iconAriaLabel} />\n ) : null}\n <AnimationScheduler animated={isAnimated}>\n <div>\n <span className={cardType === 'card-star' ? style.textStar : style.textRank}>\n <Animation name=\"counter\" bezier={EASE_OUT_CUBIC} duration={2000}>\n {progress => pipe(_parseInt(10), multiply(progress), round)(reviewCardValue)}\n </Animation>\n </span>\n </div>\n </AnimationScheduler>\n {cardType === 'card-star' ? (\n <StarIcon className={style.iconStar} width={53} height={53} aria-label={iconAriaLabel} />\n ) : (\n <div className={style.rankSuffix}>{rankSuffix}</div>\n )}\n </div>\n </div>\n );\n};\n\nReviewCardCongrats.propTypes = propTypes;\n\nexport default ReviewCardCongrats;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-correction-popin/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;CAiBd,CAAC;AAEF,oBAAY,6BAA6B,GAAG;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,oBAAY,0BAA0B,GAAG;IACvC,GAAG,CAAC,EAAE,6BAA6B,CAAC;IACpC,WAAW,EAAE;QACX,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,YAAY,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,OAAO,GAAG,OAAO,CAAC;CACzB,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
1
|
+
{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-correction-popin/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;CAiBd,CAAC;AAEF,oBAAY,6BAA6B,GAAG;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,oBAAY,0BAA0B,GAAG;IACvC,GAAG,CAAC,EAAE,6BAA6B,CAAC;IACpC,WAAW,EAAE;QACX,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,YAAY,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,OAAO,GAAG,OAAO,CAAC;CACzB,CAAC;AAEF,oBAAY,OAAO,GAAG;IAAC,KAAK,EAAE,0BAA0B,CAAA;CAAC,CAAC;AAE1D,eAAe,SAAS,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"prop-types.js","names":["propTypes","type","PropTypes","oneOf","resultLabel","string","information","shape","label","message","next","onClick","func","klf","tooltip"],"sources":["../../../src/molecule/review-correction-popin/prop-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst propTypes = {\n type: PropTypes.oneOf(['right', 'wrong']),\n resultLabel: PropTypes.string,\n information: PropTypes.shape({\n label: PropTypes.string,\n message: PropTypes.string\n }),\n next: PropTypes.shape({\n label: PropTypes.string,\n onClick: PropTypes.func,\n 'data-name': PropTypes.string,\n 'aria-label': PropTypes.string\n }),\n klf: PropTypes.shape({\n label: PropTypes.string,\n tooltip: PropTypes.string\n })\n};\n\nexport type ReviewCorrectionPopinKLFProps = {\n label: string;\n tooltip: string;\n};\n\nexport type ReviewCorrectionPopinProps = {\n klf?: ReviewCorrectionPopinKLFProps;\n information: {\n label: string;\n message: string;\n };\n next: {\n label: string;\n onClick: () => void;\n 'data-name'?: string;\n 'aria-label': string;\n };\n resultLabel: string;\n type: 'right' | 'wrong';\n};\n\nexport default propTypes;\n"],"mappings":";;;;;AAAA;;;;AAEA,MAAMA,SAAS,GAAG;EAChBC,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,OAAV,CAAhB,CADU;EAEhBC,WAAW,EAAEF,kBAAA,CAAUG,MAFP;EAGhBC,WAAW,EAAEJ,kBAAA,CAAUK,KAAV,CAAgB;IAC3BC,KAAK,EAAEN,kBAAA,CAAUG,MADU;IAE3BI,OAAO,EAAEP,kBAAA,CAAUG;EAFQ,CAAhB,CAHG;EAOhBK,IAAI,EAAER,kBAAA,CAAUK,KAAV,CAAgB;IACpBC,KAAK,EAAEN,kBAAA,CAAUG,MADG;IAEpBM,OAAO,EAAET,kBAAA,CAAUU,IAFC;IAGpB,aAAaV,kBAAA,CAAUG,MAHH;IAIpB,cAAcH,kBAAA,CAAUG;EAJJ,CAAhB,CAPU;EAahBQ,GAAG,EAAEX,kBAAA,CAAUK,KAAV,CAAgB;IACnBC,KAAK,EAAEN,kBAAA,CAAUG,MADE;IAEnBS,OAAO,EAAEZ,kBAAA,CAAUG;EAFA,CAAhB;AAbW,CAAlB;
|
|
1
|
+
{"version":3,"file":"prop-types.js","names":["propTypes","type","PropTypes","oneOf","resultLabel","string","information","shape","label","message","next","onClick","func","klf","tooltip"],"sources":["../../../src/molecule/review-correction-popin/prop-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst propTypes = {\n type: PropTypes.oneOf(['right', 'wrong']),\n resultLabel: PropTypes.string,\n information: PropTypes.shape({\n label: PropTypes.string,\n message: PropTypes.string\n }),\n next: PropTypes.shape({\n label: PropTypes.string,\n onClick: PropTypes.func,\n 'data-name': PropTypes.string,\n 'aria-label': PropTypes.string\n }),\n klf: PropTypes.shape({\n label: PropTypes.string,\n tooltip: PropTypes.string\n })\n};\n\nexport type ReviewCorrectionPopinKLFProps = {\n label: string;\n tooltip: string;\n};\n\nexport type ReviewCorrectionPopinProps = {\n klf?: ReviewCorrectionPopinKLFProps;\n information: {\n label: string;\n message: string;\n };\n next: {\n label: string;\n onClick: () => void;\n 'data-name'?: string;\n 'aria-label': string;\n };\n resultLabel: string;\n type: 'right' | 'wrong';\n};\n\nexport type Fixture = {props: ReviewCorrectionPopinProps};\n\nexport default propTypes;\n"],"mappings":";;;;;AAAA;;;;AAEA,MAAMA,SAAS,GAAG;EAChBC,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,OAAV,CAAhB,CADU;EAEhBC,WAAW,EAAEF,kBAAA,CAAUG,MAFP;EAGhBC,WAAW,EAAEJ,kBAAA,CAAUK,KAAV,CAAgB;IAC3BC,KAAK,EAAEN,kBAAA,CAAUG,MADU;IAE3BI,OAAO,EAAEP,kBAAA,CAAUG;EAFQ,CAAhB,CAHG;EAOhBK,IAAI,EAAER,kBAAA,CAAUK,KAAV,CAAgB;IACpBC,KAAK,EAAEN,kBAAA,CAAUG,MADG;IAEpBM,OAAO,EAAET,kBAAA,CAAUU,IAFC;IAGpB,aAAaV,kBAAA,CAAUG,MAHH;IAIpB,cAAcH,kBAAA,CAAUG;EAJJ,CAAhB,CAPU;EAahBQ,GAAG,EAAEX,kBAAA,CAAUK,KAAV,CAAgB;IACnBC,KAAK,EAAEN,kBAAA,CAAUG,MADE;IAEnBS,OAAO,EAAEZ,kBAAA,CAAUG;EAFA,CAAhB;AAbW,CAAlB;eA0CeL,S"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/mooc-header/index.js"],"names":[],"mappings":";AAwBA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAyFE;IAEF;;;;;;;;;;;;;;;;;;;;;;;MAGE;IAEF,wBAmBC;IAjBC;;;;MAIC;IA6CH,6BAIC;IAED,yBAGC;IAxBD,qCAQC;IAED,wBAGC;IAjBD,+BAEC;IA4BD,2BAKC;IAED,0BAKC;IAED,sBAIC;IAED,qBAIC;IAED,yBAQC;IAED,0BAQC;IArFD,2EASC;IAGC,kBAAsB;IA2ExB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/mooc-header/index.js"],"names":[],"mappings":";AAwBA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAyFE;IAEF;;;;;;;;;;;;;;;;;;;;;;;MAGE;IAEF,wBAmBC;IAjBC;;;;MAIC;IA6CH,6BAIC;IAED,yBAGC;IAxBD,qCAQC;IAED,wBAGC;IAjBD,+BAEC;IA4BD,2BAKC;IAED,0BAKC;IAED,sBAIC;IAED,qBAIC;IAED,yBAQC;IAED,0BAQC;IArFD,2EASC;IAGC,kBAAsB;IA2ExB,6BA8YC;CACF"}
|
|
@@ -514,17 +514,17 @@ class MoocHeader extends _react.default.Component {
|
|
|
514
514
|
onClick: this.handleOnMenuClose
|
|
515
515
|
}), /*#__PURE__*/_react.default.createElement(_link.default, {
|
|
516
516
|
"data-name": "logo-mobile",
|
|
517
|
-
href: logo.href
|
|
518
|
-
"aria-label": logoAriaLabel
|
|
517
|
+
href: logo.href
|
|
519
518
|
}, /*#__PURE__*/_react.default.createElement(_picture.default, {
|
|
520
|
-
src: logoMobileUrl
|
|
519
|
+
src: logoMobileUrl,
|
|
520
|
+
"aria-label": logoAriaLabel
|
|
521
521
|
}))), /*#__PURE__*/_react.default.createElement(_link.default, {
|
|
522
522
|
className: _style.default.logo,
|
|
523
523
|
"data-name": "logo",
|
|
524
|
-
href: logo.href
|
|
525
|
-
"aria-label": logoAriaLabel
|
|
524
|
+
href: logo.href
|
|
526
525
|
}, /*#__PURE__*/_react.default.createElement(_picture.default, {
|
|
527
|
-
src: logoUrl
|
|
526
|
+
src: logoUrl,
|
|
527
|
+
"aria-label": logoAriaLabel
|
|
528
528
|
}))), searchFormView, /*#__PURE__*/_react.default.createElement("div", {
|
|
529
529
|
className: isMenuOpen ? _style.default.menuWrapper : _style.default.hiddenMenuWrapper,
|
|
530
530
|
"data-name": "menu-wrapper"
|